From 1954307cabc79084943efad88dcaaa94e1ef9ae5 Mon Sep 17 00:00:00 2001
From: "liujw155@outlook.com" <liujw155@outlook.com>
Date: Tue, 18 Mar 2025 17:42:46 +0800
Subject: [PATCH] finish tid1929

---
 src/pages.json                                     |  12 +
 .../order/components/order_list/header.vue         |   2 +-
 src/subpackage/order/components/search_bar.vue     |  68 ++++++
 src/subpackage/order/js/api.js                     |   7 +
 src/subpackage/order/js/handle.js                  |  18 ++
 .../pages/booking_card/modules/refund_modal.vue    | 261 +++++++++++++++++++++
 .../order/pages/booking_card/modules/time_zone.vue |  84 +++++++
 .../order/pages/booking_card/order_info.vue        | 153 ++++++++++--
 .../order/pages/booking_card/order_list.vue        | 155 +++++++++++-
 src/subpackage/order/pages/booking_card/search.vue | 116 +++++++++
 .../order/pages/booking_card/use_record.vue        | 191 +++++++++++++++
 .../modules/order_search/search_bar.vue            |   2 +-
 12 files changed, 1031 insertions(+), 38 deletions(-)
 create mode 100644 src/subpackage/order/components/search_bar.vue
 create mode 100644 src/subpackage/order/js/handle.js
 create mode 100644 src/subpackage/order/pages/booking_card/modules/refund_modal.vue
 create mode 100644 src/subpackage/order/pages/booking_card/modules/time_zone.vue
 create mode 100644 src/subpackage/order/pages/booking_card/search.vue

diff --git a/src/pages.json b/src/pages.json
index e30adf4..8d0be2c 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -657,6 +657,18 @@
 					"style" : {
 						"navigationBarTitleText": "订场卡订单详情" 
 					}
+				},
+				{
+					"path": "pages/booking_card/use_record",
+					"style" : {
+						"navigationBarTitleText": "使用记录" 
+					}
+				},
+				{
+					"path": "pages/booking_card/search",
+					"style" : {
+						"navigationBarTitleText": "搜索订单" 
+					}
 				}
 			]
 		},
diff --git a/src/subpackage/order/components/order_list/header.vue b/src/subpackage/order/components/order_list/header.vue
index cf0884f..004d704 100644
--- a/src/subpackage/order/components/order_list/header.vue
+++ b/src/subpackage/order/components/order_list/header.vue
@@ -14,7 +14,7 @@
         <!-- 交易明细&按钮 -->
         <view class="olh-bot">
             <view class="ob-desc">
-                <text>成功交易{{ successCount || 0 }}笔，退款{{ refundCount || 0 }}笔</text>
+                <text v-if="successCount || refundCount">成功交易{{ successCount || 0 }}笔，退款{{ refundCount || 0 }}笔</text>
             </view>
             <view class="ob-btns">
                 <image @click="$emit('click:search')" class="ob-icon" src="../../static/images/search.png"></image>
diff --git a/src/subpackage/order/components/search_bar.vue b/src/subpackage/order/components/search_bar.vue
new file mode 100644
index 0000000..b431404
--- /dev/null
+++ b/src/subpackage/order/components/search_bar.vue
@@ -0,0 +1,68 @@
+<template>
+    <view class="search-bar">
+        <view class="sb-box">
+            <image class="sb-search-icon" mode="aspectFit" src="/subpackage/order/static/images/search.png"></image>
+            <input class="sb-ipt" :placeholder="placeholder" v-model="searchTxt" confirm-type="search" @confirm="iptConfirm" />
+            <image class="sb-clear-icon" v-if="searchTxt!=''" mode="aspectFit" src="/subpackage/order/static/images/round_close.png" @click="clearSearch"></image>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    props: {
+        placeholder: {
+            type: String,
+            default: '请输入订单号'
+        }
+    },
+    data() {
+        return {
+            searchTxt: ''
+        }
+    },
+    methods: {
+        iptConfirm(){
+            this.$emit('confirm:search', this.searchTxt);
+        },
+        clearSearch(){
+            this.searchTxt = '';
+            this.$emit('click:clear', '');
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .search-bar{
+        margin-bottom: 24upx;
+        height: 144upx;
+        background-color: #fff;
+        @include ctf(center);
+        .sb-box{
+            padding: 0 20upx;
+            height: 92upx;
+            width: 702upx;
+            border-radius: 10upx;
+            background-color: #f2f2f7;
+            @include ctf(center);
+            .sb-search-icon{
+                margin-right: 20upx;
+                flex-shrink: 0;
+                width: 40upx;
+                height: 40upx;
+            }
+            .sb-clear-icon{
+                flex-shrink: 0;
+                margin-right: 0;
+                margin-left: 20upx;
+                width: 32upx;
+                height: 32upx;
+            }
+            .sb-ipt{
+                flex-grow: 1;
+                @include flcw(32upx, 44upx, #1A1A1A);
+            }
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/js/api.js b/src/subpackage/order/js/api.js
index 69aac1c..08aa0ac 100644
--- a/src/subpackage/order/js/api.js
+++ b/src/subpackage/order/js/api.js
@@ -49,6 +49,13 @@ export const ORDER_API = {
 	userValueCardRefundFixed:`${ORIGIN}/admin/userValueCard/refundFixed`,  // 储值卡订单-退款
 	orderRefund:`${ORIGIN}/admin/stadium/order/refund`,  // A订单管理-场馆预订订单-订单退款 (零售订单、场地、次卡)
 	userMonthlyCardRefundFixed:`${ORIGIN}/admin/userMonthlyCard/refundFixed`,  // 年月卡订单-订单退款
+
+	// 20250318 tid1929 订场卡
+	cardOrderList:`${ORIGIN}/admin/venue/number/card/order/list`,  // 订场卡订单 - 列表
+	cardOrderGet:`${ORIGIN}/admin/venue/number/card/order/get`,  // 订场卡订单 - 详情
+	cardOrderRefund:`${ORIGIN}/admin/venue/number/card/order/refund`,  // 订场卡订单 - 退款
+	cardSoldUsage:`${ORIGIN}/admin/venue/number/card/sold/usage`,  // 已售订场卡 - 使用记录
+	
 }
 
 export default ORDER_API;
\ No newline at end of file
diff --git a/src/subpackage/order/js/handle.js b/src/subpackage/order/js/handle.js
new file mode 100644
index 0000000..84e441c
--- /dev/null
+++ b/src/subpackage/order/js/handle.js
@@ -0,0 +1,18 @@
+import { formatDate } from '@/utils/util';
+
+// 初始化默认时间
+export function initPeriod({ beforeDays, afterDays }) {
+    let _dateTimeStemp = new Date().getTime();
+    let _daysTimeStemp = (beforeDays || afterDays || 0) * 24 * 60 * 60 * 1000;
+    let _curDate = formatDate({});
+    if (beforeDays) return {
+        start: formatDate({ date: _dateTimeStemp - _daysTimeStemp }),
+        end: _curDate
+    }
+    if (afterDays) return {
+        start: _curDate,
+        end: formatDate({ date: _dateTimeStemp + _daysTimeStemp })
+    }
+    return {};
+
+}
\ No newline at end of file
diff --git a/src/subpackage/order/pages/booking_card/modules/refund_modal.vue b/src/subpackage/order/pages/booking_card/modules/refund_modal.vue
new file mode 100644
index 0000000..abea108
--- /dev/null
+++ b/src/subpackage/order/pages/booking_card/modules/refund_modal.vue
@@ -0,0 +1,261 @@
+<template>
+    <view class="order-refund-modal">
+        <view class="orm-mask" v-show="isShow">
+            <view class="om-content">
+                <image class="oc-close" mode="aspectFit" src="/subpackage/order/static/images/close.png" @click="hide"></image>
+                <view class="oc-title">退款</view>
+                <view class="oc-section">
+                    <view class="os-info">
+                        <view class="oi-name">{{ refundInfo.stadium_name || '' }}</view>
+                        <view class="oi-line">订单编号：{{ refundInfo.order_no || '' }}</view>
+                        <view class="oi-line">手机号码：{{ refundInfo.mobile || '' }}</view>
+
+                        <view class="os-ipts">
+                            <view class="oi-item">
+                                <view class="oi-name">
+                                    <text class="on-txt">*</text>
+                                    退款金额
+                                </view>
+                                <view class="oi-right">
+                                    <input 
+                                        class="or-ipt" 
+                                        type="digit" 
+                                        v-model="iptInfo.refund_amount"
+                                        :disabled="refundInfo.refund_times > 0"
+                                        :class="{ 'or-disabled': refundInfo.refund_times > 0 }"
+                                    />
+                                    <view class="or-tip">可退{{ refundInfo.refundable_amount || 0 }}元</view>
+                                </view>
+                            </view>
+                            <view class="oi-item">
+                                <view class="oi-name">
+                                    <text class="on-txt">*</text>
+                                    退款积分
+                                </view>
+                                <view class="oi-right">
+                                    <input 
+                                        class="or-ipt" type="digit"  
+                                        v-model="iptInfo.refund_integral"
+                                        :disabled="refundInfo.refund_times > 0"
+                                        :class="{ 'or-disabled': refundInfo.refund_times > 0 }"
+                                    />
+                                    <view class="or-tip">可退{{ refundInfo.refundable_integral || 0 }}积分</view>
+                                </view>
+                            </view>
+                            <view class="oi-item">
+                                <view class="oi-name">
+                                    <text class="on-txt">*</text>
+                                    扣减时间
+                                </view>
+                                <view class="oi-right">
+                                    <input 
+                                        class="or-ipt" type="digit"  
+                                        v-model="iptInfo.refund_time"
+                                        :disabled="refundInfo.refund_times > 0"
+                                        :class="{ 'or-disabled': refundInfo.refund_times > 0 }"
+                                    />
+                                    <view class="or-tip">可扣减时间{{ refundInfo.refundable_time || 0 }}小时</view>
+                                </view>
+                            </view>
+                        </view>
+                        <view class="os-remark">
+                            <view class="or-txt">备注：</view>
+                            <view class="or-txt">订场卡订单退款后，根据输入的扣减时间，将会从订场卡剩余可用时间里扣减相对应的时间。</view>
+                        </view>
+                    </view>
+                </view>
+                <view class="oc-btns">
+                    <view class="ob-item" @click="cancelBtn">取消</view>
+                    <view class="ob-item" @click="confirmBtn">确认</view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+/**
+ * PM: 
+ * 什么状态下都能退
+ * 全部订单都能退两次, 所有订单最多只能退2次款
+ * 只要订单金额是未全退的，都能退
+ * 0元订单不能退
+ * 
+*/
+import { mapState } from 'vuex';
+import { showModal } from '@/utils/util';
+export default {
+    computed: {
+        ...mapState([ 'brandInfo' ])
+    },
+    data() {
+        return {
+            isShow: false,
+            refundInfo: {
+                /**
+                 * @param {String} stadium_name 店铺名称
+                 * @param {String} order_no 订单编号
+                 * @param {String} mobile 手机号码
+                 * @param {String} refundable_amount 退款金额
+                 * @param {String} refundable_integral 退款积分
+                 * @param {String} refundable_hours 可退时间
+                 * @param {Number} refund_times 退款次数
+                 * @param {Function} cancel 取消回调
+                 * @param {Function} confirm 确认回调
+                */
+            },
+            iptInfo: {
+                refund_amount: '',
+                refund_integral: '',
+                refund_time: ''
+            }
+        }
+    },
+    methods: {
+        show(initData){
+            let { brandInfo } = this;
+            if(!brandInfo?.permission?.['1018']){
+                this.isShow = true;
+                this.init(initData);
+            }else{
+                showModal({
+                    content: '您没有退款权限',
+                })
+            }
+            
+        },
+        init(data){
+            this.iptInfo.refund_amount = data?.refundable_amount || '0';
+            this.iptInfo.refund_integral = data?.refundable_integral || '0';
+            this.iptInfo.refund_time = data?.refundable_hours || '0';
+            this.refundInfo = data;
+        },
+        hide(){
+            this.isShow = false;
+        },
+        cancelBtn() {
+            this.hide();
+            this.$emit('click:cancel');
+            this.refundInfo?.cancel?.(0);
+        },
+        confirmBtn() {
+            let { iptInfo, refundInfo } = this;
+            
+            this.$emit('click:confirm');
+            this.refundInfo?.confirm?.({
+                refund_amount: +iptInfo?.refund_amount || 0,
+                refund_integral: +iptInfo?.refund_integral || 0,
+                refund_time: +iptInfo?.refund_time || 0,
+            });
+            this.hide();
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+.order-refund-modal{}
+
+.orm-mask{
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0,0,0,.5);
+    z-index: 10;
+}
+.om-content{
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    padding-bottom: 80upx;
+    width: 620upx;
+    border-radius: 10px;
+    background: #fff;
+    .oc-close{
+        position: absolute;
+        top: 30upx;
+        right: 30upx;
+        width: 34upx;
+        height: 34upx;
+    }
+    .oc-title{
+        padding-top: 78upx;
+        text-align: center;
+        @include flcw(32upx, 44upx, #333, 500);
+    }
+    .oc-section{
+        padding: 30upx 30upx 0;
+        @include ctf(center);
+        .os-info{
+            .oi-name{
+                @include flcw(28upx, 48upx, #333);
+            }
+            .oi-line{
+                @include flcw(28upx, 48upx, #9C9C9F);
+            }
+            .os-ipts{
+                padding-top: 34upx;
+                .oi-item{
+                    display: flex;
+                    align-items: flex-start;
+                    .oi-name{
+                        @include flcw(28upx, 56upx, #333333);
+                        .on-txt{
+                            color: #EA5061;
+                        }
+                    }
+                    .oi-right{
+                        margin-left: 16upx;
+                        flex-shrink: 0;
+                        width: 312upx;
+                        .or-ipt{
+                            display: block;
+                            box-sizing: border-box;
+                            padding: 0 20upx;
+                            width: 100%;
+                            height: 56upx;
+                            border-radius: 10upx;
+                            border: 2upx solid #D8D8D8;
+                            @include flcw(28upx, 48upx, #9C9C9F);
+                            &.or-disabled{
+                                background: #cecece;
+                                color: #9C9C9F;
+                            }
+                        }
+                        .or-tip{
+                            padding-left: 8upx;
+                            @include flcw(24upx, 48upx, #EA5061);
+                            @include tHide;
+                        }
+                    }
+                }
+            }
+            .os-remark{
+                .or-txt{
+                    @include flcw(28upx, 48upx, #1A1A1A);
+                }
+            }
+        }
+    }
+    .oc-btns{
+        margin-top: 32upx;
+        padding: 0 54upx;
+        @include ctf(space-between);
+        .ob-item{
+            width: 240upx;
+            height: 88upx;
+            text-align: center;
+            border: 2upx solid $mColor;
+            border-radius: 10upx;
+            @include flcw(32upx, 84upx, $mColor, 500);
+            &+.ob-item{
+                background: $mColor;
+                color: #fff;
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/pages/booking_card/modules/time_zone.vue b/src/subpackage/order/pages/booking_card/modules/time_zone.vue
new file mode 100644
index 0000000..d89a2e5
--- /dev/null
+++ b/src/subpackage/order/pages/booking_card/modules/time_zone.vue
@@ -0,0 +1,84 @@
+<template>
+    <view class="time-zone">
+        <picker mode="date" @change="startTimeChange">
+            <view class="tz-box">
+                <input disabled class="tb-ipt" placeholder="选择时间" :value="timeStart" />
+                <view class="tb-icon"></view>
+            </view>
+        </picker>
+        
+        <text class="tz-txt">至</text>
+
+        <picker mode="date" @change="endTimeChange">
+            <view class="tz-box">
+                <input disabled class="tb-ipt" placeholder="选择时间" :value="timeEnd" />
+                <view class="tb-icon"></view>
+            </view>
+        </picker>
+    </view>
+</template>
+
+<script>
+import { showNone } from "@/utils/util";
+export default {
+    data(){
+        return {
+            timeStart: '',
+            timeEnd: ''
+        }
+    },
+    methods: {
+        startTimeChange(e){
+            let { timeEnd } = this;
+            let _curTime = e?.detail?.value || '';
+            let _startTimeStamps = new Date(_curTime.replace(/\-/g, '/')).getTime();
+            let _endTimeStamps = new Date(timeEnd.replace(/\-/g, '/')).getTime();
+            if(_endTimeStamps && _startTimeStamps > _endTimeStamps)return showNone('开始时间不能大于结束时间');
+            this.timeStart = _curTime;
+            this.$emit('change:time', { start: _curTime, end: timeEnd });
+        },
+        endTimeChange(e){
+            let { timeStart } = this;
+            let _curTime = e?.detail?.value || '';
+            let _startTimeStamps = new Date(timeStart.replace(/\-/g, '/')).getTime();
+            let _endTimeStamps = new Date(_curTime.replace(/\-/g, '/')).getTime();
+            if(_startTimeStamps && _startTimeStamps > _endTimeStamps)return showNone('结束时间不能小于开始时间');
+            this.timeEnd = _curTime;
+            this.$emit('change:time', { start: timeStart, end: _curTime });
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .time-zone{
+        padding: 26upx 30upx;
+        background: #fff;
+        @include ctf(space-between);
+        .tz-box{
+            width: 312upx;
+            height: 92upx;
+            padding: 0 20upx;
+            background: #F2F2F7;
+            border-radius: 10upx;
+            @include ctf;
+            .tb-ipt{
+                flex-grow: 1;
+                height: 100%;
+                @include flcw(32upx, 44upx, #333333);
+
+            }
+            .tb-icon{
+                flex-shrink: 0;
+                width: 0;
+                height: 0;
+                border-left: 12upx solid transparent;
+                border-right: 12upx solid transparent;
+                border-top: 12upx solid #333333;
+            }
+        }
+        .tz-txt{
+            @include flcw(28upx, 40upx, #9A9A9D);
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/pages/booking_card/order_info.vue b/src/subpackage/order/pages/booking_card/order_info.vue
index fae2e24..e049eac 100644
--- a/src/subpackage/order/pages/booking_card/order_info.vue
+++ b/src/subpackage/order/pages/booking_card/order_info.vue
@@ -2,8 +2,8 @@
     <view class="booking-card">
         <view class="bc-header">
             <view class="odh-stadium">
-                <image class="os-img" mode="aspectFit" :src="''"></image>
-                <view class="os-name">{{ 'stadiumName' || '-' }}</view>
+                <image v-if="extension.stadium_logo" class="os-img" mode="aspectFit" :src="extension.stadium_logo"></image>
+                <view class="os-name">{{ extension.stadium_name || '-' }}</view>
             </view>
             <view class="bh-content">
                 <kv-line label="订单编号：">
@@ -11,8 +11,8 @@
                     <template v-slot:right>
                         <text 
                             class="od-status"
-                            :class="true ? 'active' : ''"
-                        >{{ `orderInfo.status_text` || '-' }}</text>
+                            :class="false ? 'active' : ''"
+                        >{{ orderInfo.pay_status_text || '-' }}</text>
                     </template>
                 </kv-line>
                 <kv-line label="创建时间：">{{ orderInfo.created_at || '-' }}</kv-line>
@@ -23,12 +23,12 @@
         <view class="bc-box bc-cards">
             <view class="bb-tit">
                 <view class="bt-name">订场卡信息</view>
-                <view class="bt-record">使用记录</view>
+                <view class="bt-record" @click="toRecord">使用记录</view>
             </view>
             <view class="bb-content">
-                <kv-line label="订场卡名称：">{{ orderInfo.created_at || '-' }}</kv-line>
-                <kv-line label="订场卡号：">{{ orderInfo.mobile || '-' }}</kv-line>
-                <kv-line label="来源：">{{ orderInfo.nickname || '-' }}</kv-line>
+                <kv-line label="订场卡名称：">{{ orderInfo.card_info_name || '-' }}</kv-line>
+                <kv-line label="订场卡号：">{{ orderInfo.user_card_no || '-' }}</kv-line>
+                <kv-line label="来源：">{{ orderInfo.source || '-' }}</kv-line>
             </view>
             <view class="bc-discount">
                 <kvs-line label="金额小计">¥{{ orderInfo.amount || '0' }}</kvs-line>
@@ -45,13 +45,24 @@
                 <view class="bt-name">支付信息</view>
             </view>
             <view class="bb-content">
-                <kv-line label="支付方式：">支付方式支付方式支付方式支付方式支付方式支付方式支付方式支付方式支付方式</kv-line>
-                <kv-line label="支付时间：">{{ orderInfo.mobile || '-' }}</kv-line>
-                <kv-line label="微信交易号：">{{ orderInfo.nickname || '-' }}</kv-line>
+                <kv-line label="支付方式：">{{ orderInfo.pay_type_text || '-' }}</kv-line>
+                <kv-line label="支付时间：">{{ orderInfo.pay_time || '-' }}</kv-line>
+                <kv-line label="微信交易号：" v-if="orderInfo.trade_no">{{ orderInfo.trade_no || '-' }}</kv-line>
             </view>
         </view>
+        <!-- 退款列表 -->
+		<view v-for="(e, i) in refunds" :key="i">
+            <view style="height: 24rpx;"></view>
+			<order-refund-info
+				:refund_price="e.amount || 0"
+				:refund_no="e.refund_no || '-'"
+				:refund_time="e.refund_time || '-'"
+				:refund_reason="e.reason || '-'"
+				:nameKey="i + 1"
+			></order-refund-info>
+		</view>
 
-        <view class="bc-fixed">
+        <view class="bc-fixed" v-if="refunds.length < 2">
             <view class="bf-btn" @click="refundBtn">退款</view>
         </view>
 
@@ -63,8 +74,12 @@
 <script>
 import kvLine from "../../components/kv_line.vue";
 import kvsLine from "../../components/kvs_line.vue";
-import orderRefundModal from '@/components/order_refund/modal.vue';
+import orderRefundModal from './modules/refund_modal.vue';
 import orderRefundInfo from '@/components/order_refund/info.vue';
+
+import { ORDER_API } from '../../js/api';
+import server from '../../js/server';
+import { showLoad, hideLoad, showNone, routeTo } from '@/utils/util';
 export default {
     components: {
         kvLine,
@@ -72,23 +87,111 @@ export default {
         orderRefundModal,
         orderRefundInfo
     },
+    computed: {
+        extension(){
+            return this.orderInfo?.extension ?? {};
+        },
+        refunds(){
+            return this.orderInfo?.refunds ?? [];
+        }
+    },
+    data(){
+        return {
+            orderInfo: {},
+        }
+    },
+    onLoad(options){
+        this.cardOrderGet({
+            brand_id: options.brand_id ?? '',
+            order_no: options.order_no ?? '',
+        });
+    },
     methods: {
+        toRecord(){
+            let { orderInfo } = this;
+            let _qryStr = `card_no=${orderInfo?.user_card_no || ''}&brand_id=${orderInfo?.brand_id || ''}`;
+            routeTo(`/subpackage/order/pages/booking_card/use_record?${_qryStr}`, 'nT');
+        },
         refundBtn(){
-            this.$refs.orderRefundModal.show({});
+            let { orderInfo, extension, refunds } = this;
+            this.$refs.orderRefundModal.show({
+                stadium_name: extension?.stadium_name ?? '',
+                order_no: orderInfo?.order_no ?? '',
+                mobile: orderInfo?.mobile ?? '',
+                refundable_amount: extension?.refundable_amount ?? 0,
+                refundable_integral: extension?.refundable_integral ?? 0,
+                refundable_hours: extension?.refundable_hours ?? 0,
+                refund_times: refunds?.length || -1,
+                confirm: e => {
+                    this.cardOrderRefund({
+                        brand_id: orderInfo?.brand_id ?? '',
+                        stadium_id: orderInfo?.stadium_id ?? '',
+                        order_no: orderInfo?.order_no ?? '',
+                        amount: e.refund_amount ?? 0,
+                        deduction_integral: e.refund_integral ?? 0,
+                        hours: e.refund_time ?? 0,
+                    })
+                    .finally(()=>{
+                        setTimeout(()=>{
+                            this.cardOrderGet({
+                                brand_id: orderInfo?.brand_id || '',
+                                order_no: orderInfo?.order_no || ''
+                            });
+                        }, 1000);
+                    })
+                }
+            });
+        },
+        // 订场卡订单 - 列表
+        cardOrderGet({ brand_id, order_no }){
+			showLoad();
+            return server.post({
+                url: ORDER_API.cardOrderGet,
+                data: { 
+                    brand_id: +brand_id, order_no,
+                },
+                isDefaultGet: false,
+            })
+            .then(res => {
+				hideLoad();
+                let _data = res?.data || {};
+                if(_data.code === 0){
+                    this.orderInfo = _data.data ?? {};
+                }else{
+                    return Promise.reject(_data);
+                }
+            })
+            .catch(err => {
+                hideLoad();
+                showModal({ content: err.message || '加载列表失败！' })
+                console.warn('subpackage order bookingcard order info cardOrderGet err --->', err);
+            })
+		},
+        // 订场卡订单 - 退款
+        cardOrderRefund({ brand_id, stadium_id, order_no, amount, deduction_integral, hours }){
+            showLoad();
+            return server.post({
+                url: ORDER_API.cardOrderRefund,
+                data: { 
+                    brand_id: +brand_id, stadium_id, order_no, 
+                    amount, deduction_integral, hours
+                },
+                failMsg: '操作失败！'
+            })
+            .then(res=>{
+                hideLoad();
+                showNone('操作成功！');
+                // this.orderInfo = res || {};
+                return 'success';
+            })
+            .catch(err=>{
+                hideLoad();
+                showNone('操作失败！');
+                console.warn('subpackage order bookingcard order info cardOrderRefund err -->', err);
+            })
         }
     }
 }
-
-// 1. produce process
-// p(s1) s1 = 0 finish p(s1) and go
-// v(s2) s2 = 1 finish v(s2) and go
-// 2. loop produce process
-// p(s1) s1 = -1 stop p(s1) and push in queue[1]
-// 3. consume process
-// p(s2) s2 = 0 finish p(s2) and go
-// v(s1) s1 = 0 stop v(s1) and pull queue[1]
-// 4. cp v(s1) ->  produce process
-// v(s2) s2 = 1 finish & go
 </script>
 
 <style lang="scss">
diff --git a/src/subpackage/order/pages/booking_card/order_list.vue b/src/subpackage/order/pages/booking_card/order_list.vue
index 01f0e7b..4697045 100644
--- a/src/subpackage/order/pages/booking_card/order_list.vue
+++ b/src/subpackage/order/pages/booking_card/order_list.vue
@@ -2,46 +2,179 @@
     <view class="booking-cards">
         <order-list-header 
             ref="orderListHeader"
+            @change:stadium="changeStadium"
+            @click:filter="showFilterModal"
+            @click:time="showPeriodModal"
+            @click:search="searchOrder"
+            :start-time="condition.start"
+            :end-time="condition.end"
         ></order-list-header>
         <view class="bc-list">
-            <block v-for="i in 5" :key="i">
+            <block v-for="(e, i) in orderLs" :key="i">
                 <view style="height: 24rpx;"></view>
                 <item-temp 
-                    stadium="欧轩智能羽毛球馆(永泰店)"
-                    status="已付款"
+                    :stadium="e.brand_name"
+                    :status="e.pay_status_text"
+                    @click:item="itemClick(e)"
                 >
-                    <kv-line label="订单号：">DC20250311171554566</kv-line>
-                    <kv-line label="订场卡名称：">篮球10小时订场卡</kv-line>
-                    <kv-line label="手机号码：">18316553478</kv-line>
-                    <kv-line label="支付时间：">2021-07-01 15:25:25</kv-line>
-                    <kv-line label="来源：">美团团购兑换</kv-line>
+                    <kv-line label="订单号：">{{ e.order_no || '-' }}</kv-line>
+                    <kv-line label="订场卡名称：">{{ e.card_info_name || '-' }}</kv-line>
+                    <kv-line label="手机号码：">{{ e.mobile || '-' }}</kv-line>
+                    <kv-line label="支付时间：">{{ e.pay_time || '-' }}</kv-line>
+                    <kv-line label="来源：">{{ e.source || '-' }}</kv-line>
                 </item-temp>
             </block>
         </view>
+        <!-- 时间段选择 -->
+        <period-modal ref="periodModal"  ></period-modal>
+        <!-- status窗口 -->
+        <filter-modal ref="filterModal"></filter-modal>
     </view>
 </template>
 <script>
 import orderListHeader from "../../components/order_list/header.vue";
+import periodModal from "../../components/order_list/period_modal.vue";
+import filterModal from "../../components/order_list/filter_modal.vue";
 import itemTemp from "../../components/order_list/item_temp.vue";
 import kvLine from "../../components/kv_line.vue";
+
+import { ORDER_API } from '../../js/api';
+import server from '../../js/server';
+import { showLoad, hideLoad, showNone, routeTo } from '@/utils/util';
+import { initPeriod } from "../../js/handle";
 export default {
     components: {
         orderListHeader,
         itemTemp,
-        kvLine
+        kvLine,
+        periodModal,
+        filterModal
     },
     data(){
         return {
-
+            brand_id: '',
+            condition: { // 查询条件
+                stadium_id: '', // 场馆id
+                start: '', // 开始时间
+                end: '', // 结束时间
+                status: '', // 订单状态
+            },
+            orderLs: [],
+            page: 1,
         }
     },
+    watch: {
+        condition: {
+            handler(nVal, oVal){
+                let { brand_id } = this;
+                this.orderLs = [];
+                this.page = 1;
+                this.cardOrderList({
+                    brand_id: brand_id || '',
+                    stadium_id: nVal?.stadium_id ?? '',
+                    status: nVal?.status ?? '',
+                    begin: nVal?.start ?? '',
+                    end: nVal?.end ?? '',
+                })
+            },
+            deep: true
+        }
+    },  
     onLoad(options){
         let _bid = options?.brand_id || '';
+        this.brand_id = _bid;
         this.$refs.orderListHeader.initStadiumSelect(_bid);
+        this.initCondition();
+    },
+    onReachBottom(){
+        let { brand_id, condition, page } = this;
+        this.cardOrderList({
+            brand_id: brand_id || '',
+            stadium_id: condition?.stadium_id ?? '',
+            status: condition?.status ?? '',
+            begin: condition?.start ?? '',
+            end: condition?.end ?? '',
+            page: page + 1
+        })
+    },
+    methods: {
+        // 搜索订单
+        searchOrder(){
+            let { brand_id } = this;
+            let _qryStr = `brand_id=${brand_id || ''}`;
+            routeTo(`/subpackage/order/pages/booking_card/search?${_qryStr}`, 'nT');
+        },
+        // 显示时间段选择
+        showPeriodModal(){
+            let { start, end } = this.condition;
+            this.$refs.periodModal.init({
+                start: start,
+                end: end,
+                success: res=>{
+                    this.condition.start = res.start;
+                    this.condition.end = res.end;
+                }
+            });
+        },
+        // 打开筛选窗口
+        showFilterModal(){
+            this.$refs.filterModal.init({
+                title: '订单状态',
+                list: [{ label: '全部', value: '' }, { label: '已付款', value: '1' }, { label: '已退款', value: '4' }],
+                curValue: this.condition.status,
+                success: item =>{
+                    this.condition.status = item.value;
+                }
+            });
+        },
+        // 店铺选择
+        changeStadium(e){
+            this.condition.stadium_id = e.id;
+        },
+        initCondition(){
+            let { start, end } = initPeriod({ beforeDays: 100 });
+            this.condition.start = start;
+            this.condition.end = end;
+        },
+        itemClick(e){
+            let _qryStr = `brand_id=${e.brand_id ?? ''}&order_no=${e.order_no ?? ''}`;
+            routeTo(`/subpackage/order/pages/booking_card/order_info?${_qryStr}`, 'nT');
+        },
+        // 订场卡订单 - 列表
+        cardOrderList({ brand_id, stadium_id = '', status = '', key = '', begin = '', end = '', page = 1, page_size = 10 }){
+			showLoad();
+            return server.post({
+                url: ORDER_API.cardOrderList,
+                data: { 
+                    brand_id: +brand_id, stadium_id, 
+                    status, key, 
+                    begin: `${begin} 00:00:00`, end: `${end} 23:59:59`, 
+                    page, page_size 
+                },
+                isDefaultGet: false,
+            })
+            .then(res => {
+				hideLoad();
+                let _data = res?.data || {};
+                if(_data.code === 0){
+                    let _ls = _data?.data?.list || [];
+                    if(page === 1)return this.orderLs = _ls;
+                    if(_ls.length <= 0)return showNone('没有更多！');
+                    this.orderLs = [...this.orderLs, ..._ls];
+                    this.page = page;
+                }else{
+                    return Promise.reject(_data);
+                }
+            })
+            .catch(err => {
+                hideLoad();
+                showModal({ content: err.message || '加载列表失败！' })
+                console.warn('subpackage order bookingcard order list cardSoldList err --->', err);
+            })
+		},
     }
 }
 </script>
-
 <style lang="scss">
     .bc-list{
         padding: 0 24upx;
diff --git a/src/subpackage/order/pages/booking_card/search.vue b/src/subpackage/order/pages/booking_card/search.vue
new file mode 100644
index 0000000..feea6dc
--- /dev/null
+++ b/src/subpackage/order/pages/booking_card/search.vue
@@ -0,0 +1,116 @@
+<template>
+    <view class="order-search">
+        <search-bar
+            placeholder="请输入订单号/手机号码"
+            @confirm:search="searchOrder"
+        ></search-bar>
+        <view class="os-list">
+            <block v-for="(e, i) in orderLs" :key="i">
+                <view class="tl-item">
+                    <item-temp 
+                        :stadium="e.brand_name"
+                        :status="e.pay_status_text"
+                        @click:item="itemClick(e)"
+                    >
+                        <kv-line label="订单号：">{{ e.order_no || '-' }}</kv-line>
+                        <kv-line label="订场卡名称：">{{ e.card_info_name || '-' }}</kv-line>
+                        <kv-line label="手机号码：">{{ e.mobile || '-' }}</kv-line>
+                        <kv-line label="支付时间：">{{ e.pay_time || '-' }}</kv-line>
+                        <kv-line label="来源：">{{ e.source || '-' }}</kv-line>
+                    </item-temp>
+                </view>
+            </block>
+        </view>
+    </view>
+</template>
+
+<script>
+import search_bar from '../../components/search_bar.vue';
+import itemTemp from "../../components/order_list/item_temp.vue";
+import kvLine from "../../components/kv_line.vue";
+
+import { ORDER_API } from '../../js/api';
+import server from '../../js/server';
+import { showLoad, hideLoad, showNone, routeTo } from '@/utils/util';
+export default {
+    components: {
+        'search-bar': search_bar,
+        itemTemp,
+        kvLine,
+    },
+    data() {
+        return {
+            brand_id: '',
+            orderLs: [],
+            page: 1,
+            searchTxt: ''
+        }
+    },
+    onLoad(options) {
+        let _bid = options?.brand_id || '';
+        this.brand_id = _bid;
+    },
+    onReachBottom(){
+        let { page, brand_id, searchTxt } = this;
+        this.cardOrderList({
+            brand_id: brand_id ?? '',
+            key: searchTxt ?? '',
+            page: ++page
+        })
+    },
+    methods: {
+        itemClick(e){
+            let _qryStr = `brand_id=${e.brand_id ?? ''}&order_no=${e.order_no ?? ''}`;
+            routeTo(`/subpackage/order/pages/booking_card/order_info?${_qryStr}`, 'nT');
+        },
+        searchOrder(value){
+            let { brand_id } = this;
+            this.searchTxt = value;
+            this.page = 1;
+            this.cardOrderList({ brand_id: +brand_id, key: value });
+        },
+        // 订场卡订单 - 列表
+        cardOrderList({ brand_id, stadium_id = '', status = '', key = '', begin = '', end = '', page = 1, page_size = 10 }){
+			showLoad();
+            return server.post({
+                url: ORDER_API.cardOrderList,
+                data: { 
+                    brand_id: +brand_id, stadium_id, 
+                    status, key, 
+                    begin, end, 
+                    page, page_size 
+                },
+                isDefaultGet: false,
+            })
+            .then(res => {
+				hideLoad();
+                let _data = res?.data || {};
+                if(_data.code === 0){
+                    let _ls = _data?.data?.list || [];
+                    if(page === 1)return this.orderLs = _ls;
+                    if(_ls.length <= 0)return showNone('没有更多！');
+                    this.orderLs = [...this.orderLs, ..._ls];
+                    this.page = page;
+                }else{
+                    return Promise.reject(_data);
+                }
+            })
+            .catch(err => {
+                hideLoad();
+                showModal({ content: err.message || '加载列表失败！' })
+                console.warn('subpackage order bookingcard order list cardSoldList err --->', err);
+            })
+		},
+    }
+}
+</script>
+
+<style lang="scss">
+    .os-list{
+        padding: 24upx;
+        @include isPd(24upx);
+        .tl-item + .tl-item{
+            margin-top: 24upx;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/pages/booking_card/use_record.vue b/src/subpackage/order/pages/booking_card/use_record.vue
index e69de29..41d71c1 100644
--- a/src/subpackage/order/pages/booking_card/use_record.vue
+++ b/src/subpackage/order/pages/booking_card/use_record.vue
@@ -0,0 +1,191 @@
+<template>
+    <view class="use-record">
+        <time-zone @change:time="timeChange"></time-zone>
+        <view class="ur-ls">
+            <view class="ul-item" v-for="(e, i) in usageLs" :key="i">
+                <view class="ui-tit-bar">
+                    <view class="utb-status">{{ e.usage_type || '-' }}</view>
+                    <view class="utb-time" :class="{ 'ut-active': e.card_hours_usage > 0 }">{{ e.card_hours_usage || '-' }}小时</view>
+                </view>
+                <view class="ui-lines">
+                    <view class="uli-item">
+                        <view class="ui-label">操作人：</view>
+                        <view class="ui-value">{{ e.source || '-' }}</view>
+                    </view>
+                    <view class="uli-item">
+                        <view class="ui-label">余额：</view>
+                        <view class="ui-value">{{ e.card_hours_surplus || '0' }}小时</view>
+                    </view>
+                    <view class="uli-item" v-if="e.link_order_no">
+                        <view class="ui-label">订单号：</view>
+                        <view class="ui-num" @click="toOrderInfo(e)">
+                            <view class="un-txt">{{ e.link_order_no || '-' }}</view>
+                            <!-- <image class="un-icon" mode="aspectFit" src="/subpackage/booking_card/static/images/arrow_green.png"></image> -->
+                        </view>
+                    </view>
+                    <view class="uli-item">
+                        <view class="ui-label">使用时间：</view>
+                        <view class="ui-value">{{ e.created_at || '-' }}</view>
+                    </view>
+                    <view class="uli-item">
+                        <view class="ui-label">说明：</view>
+                        <view class="ui-value">{{ e.desc || '-' }}</view>
+                    </view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+import time_zone from "./modules/time_zone.vue";
+
+import { ORDER_API } from '../../js/api';
+import server from '../../js/server';
+import { showLoad, hideLoad, showNone, routeTo } from '@/utils/util';
+
+export default {
+    components: {
+        "time-zone": time_zone
+    },
+    data(){
+        return {
+            usageLs: [],
+            times: {
+                start: '',
+                end: ''
+            },
+            page: 1,
+            optionsQuery: {}
+        }
+    },
+    onLoad(options){
+        this.getUsercardUsage({
+            brand_id: options?.brand_id || '',
+            card_no: options?.card_no || ''
+        })
+        this.optionsQuery = options || {};
+    },
+    onReachBottom(){
+        let { page, times, optionsQuery } = this;
+        this.getUsercardUsage({
+            brand_id: optionsQuery?.brand_id || '',
+            card_no: optionsQuery?.card_no || '',
+            page: ++page,
+            start_time: times.start,
+            end_time: times.end
+        })
+    },
+    methods: {
+        toOrderInfo(e){
+            // if(!e.link_order_no)return;
+            // let _qryStr = `order_no=${e.link_order_no}&brand_id=${e.brand_id || ''}&stadium_id=${ e.stadium_id || '' }`;
+            // // 20241127 后端： usage_type === '抵扣' || usage_type === '退款'  的话就跳转订场订单  其他就是订场卡
+            // let _pathStr = '/subpackage/booking_card/pages/mine/detail';
+            // if(['抵扣',  '退款' ].includes(e.usage_type))_pathStr = `/pages/venue/venue_order_detail/venue_order_detail`;
+            // routeTo(`${_pathStr}?${_qryStr}`, 'nT');
+        },
+        timeChange(e){
+            let { optionsQuery } = this; 
+            let { start, end } = e;
+            this.times = { start, end };
+            this.usageLs = [];
+            this.page = 1;
+            this.getUsercardUsage({
+                brand_id: optionsQuery?.brand_id || '',
+                card_no: optionsQuery?.card_no || '',
+                start_time: start,
+                end_time: end
+            })
+        },
+        getUsercardUsage({ brand_id = '', card_no = '', page = 1, page_size = 10, start_time = '', end_time = '' }){
+            showLoad();
+            return server.get({
+                url: ORDER_API.cardSoldUsage,
+                data: { brand_id, card_no, page, page_size, start_time, end_time },
+                failMsg: '获取记录失败'
+            })
+            .then(res => {
+                hideLoad();
+                let _ls = res.list || [];
+                // let _ls = res?.list ||  [];
+                if(page === 1)return this.usageLs = _ls;
+                if(!_ls.length)return showNone('没有更多！');
+                this.page = page;
+                return this.usageLs = [...this.usageLs, ..._ls];
+                
+            })
+            .catch(err => {
+                hideLoad();
+                console.warn('subpackage order booking card use record getUsercardUsage err --->', err);
+                // return Promise.reject(err);
+            })
+        },
+    }
+}
+</script>
+
+<style lang="scss">
+    .use-record{
+        @include isPd(24upx);
+    }
+    .ur-ls{
+        padding-top: 24upx;
+        .ul-item{
+            padding: 28upx;
+            background: #fff;
+            & + .ul-item{
+                margin-top: 24upx;
+            }
+            .ui-tit-bar{
+                padding-bottom: 30upx;
+                border-bottom: 1px solid #E5E5E5;
+                @include ctf(space-between);
+                .utb-status{
+                    max-width: 50%;
+                    @include tHide;
+                    @include flcw(32upx, 44upx, #333333);
+                }
+                .utb-time{
+                    max-width: 50%;
+                    @include tHide;
+                    @include flcw(32upx, 44upx, #9A9A9D);
+                    &.ut-active{
+                        color: #FF873D;
+                    }
+                }
+            }
+            .ui-lines{
+                padding: 16upx 20upx;
+                .uli-item{
+                    @include ctf;
+                    &+&{
+                        margin-top: 24upx;
+                    }
+                    .ui-label{
+                        flex-shrink: 0;
+                        @include flcw(28upx, 52upx, #9A9A9D);
+                    }
+                    .ui-value{
+                        @include tHide;
+                        @include flcw(28upx, 52upx, #333333);
+                        
+                    }
+                    .ui-num{
+                        @include ctf;
+                        .un-txt{
+                            @include tHide;
+                            @include flcw(28upx, 52upx, $mColor);
+                        }
+                        .un-icon{
+                            flex-shrink: 0;
+                            margin-left: 16upx;
+                            width: 24upx;
+                            height: 24upx;
+                        }
+                    }
+                }
+            }
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/order/pages/timekeeping/modules/order_search/search_bar.vue b/src/subpackage/order/pages/timekeeping/modules/order_search/search_bar.vue
index 2b11c53..5c274fa 100644
--- a/src/subpackage/order/pages/timekeeping/modules/order_search/search_bar.vue
+++ b/src/subpackage/order/pages/timekeeping/modules/order_search/search_bar.vue
@@ -2,7 +2,7 @@
     <view class="search-bar">
         <view class="sb-box">
             <image class="sb-search-icon" mode="aspectFit" src="/subpackage/order/static/images/search.png"></image>
-            <input class="sb-ipt" placeholder="你输入订单号" v-model="searchTxt" confirm-type="search" @confirm="iptConfirm" />
+            <input class="sb-ipt" placeholder="请输入订单号" v-model="searchTxt" confirm-type="search" @confirm="iptConfirm" />
             <image class="sb-clear-icon" v-if="searchTxt!=''" mode="aspectFit" src="/subpackage/order/static/images/round_close.png" @click="clearSearch"></image>
         </view>
     </view>