merge ymorder clash

src/components/order_list/ym_card/ym_card.vue

@@ -0,0 +1,63 @@
+<template>
+    <view class="ym-card-container" @click="toInfo">
+        <a-header :source="orderInfo.extension.name || '-'" :status="statusTxt(orderInfo.status)"></a-header>
+        <view class="ycc-info">
+            <a-line :value="orderInfo.card_info.name || '-'">
+                <block slot="name">卡名称：</block> 
+            </a-line>
+            <a-line :value="orderInfo.card_no || '-'">
+                <block slot="name">年月卡号：</block> 
+            </a-line>
+            <a-line :value="orderInfo.mobile || '-'">
+                <block slot="name">手机号码：</block> 
+            </a-line>
+            <a-line :value="'至' + (orderInfo.expired_at || '-')">
+                <block slot="name">有效期：</block> 
+            </a-line>
+        </view>
+    </view>
+</template>
+
+<script>
+import util from '../../../utils/util';
+import a_header from '../a_header/a_header.vue';
+import a_line from '../a_line/a_line.vue';
+export default {
+    components: {
+        'a-header': a_header,
+        'a-line': a_line,
+    },
+    props: {
+        orderInfo: {
+            default: {
+                card_info: {},
+                extension: {}
+            },
+        }
+    },
+    methods: {
+        toInfo(){
+            let { orderInfo } = this;
+            util.routeTo(`/subpackage/order/pages/ym_card/detail/detail?id=${orderInfo.id}&card_no=${orderInfo.card_no}`, 'nT');
+        },
+        statusTxt(status){
+            let _obj = {
+                0: '待激活',
+                1: '使用中',
+                2: '已失效',
+                3: '已退卡',
+            }
+            return _obj[status] || '-'
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    .ym-card-container{
+        background-color: #fff;
+        padding: 0 20upx 20upx;
+        border-radius: 10upx;
+    }
+</style>

src/js/api.js

@@ -45,6 +45,9 @@ export const API = {
   shop2OrderList: `${ORIGIN}/admin/shop2/orderList`,  // 商城订单 - 列表_copy交易成功
   retailOrderList: `${ORIGIN}/admin/erp/retailOrder/list`,  // 订单管理-零售订单列表
 
+  // 20211112
+  userMonthlyCardLs: `${ORIGIN}/admin/userMonthlyCard/list`,  // 列表用户年月卡-后台
+
   // 营业额统计
   turnoverBrand: `${ORIGIN}/admin/assistant/turnover/brand/calc`,  // 营业额记录-品牌
   turnoverStadium: `${ORIGIN}/admin/assistant/turnover/brand/stadium/calc`,  // 营业额记录-门店
@@ -99,6 +102,8 @@ API['writeOff'] = {
   listVerifyRecord: `${ORIGIN}/admin/stadium/order/listVerifyRecord`,  // 核销记录
   enterVerifyOrder: `${ORIGIN}/admin/stadium/order/enterVerifyOrder`,  // 商家助手-核销查询-输入验证码  
   assistantVerify: `${ORIGIN}/admin/stadium/order/assistantVerify`,  // 商家助手-核销查询-核销
+  userMonthlyCardVerify: `${ORIGIN}/admin/userMonthlyCard/verify`,  // 年月卡核销-后台
+  userMonthlyCardOpenGate: `${ORIGIN}/admin/userMonthlyCard/openGate`,  // 年月卡开门-后台
 }
 
 export default { ORIGIN, API };

src/js/once_name.js

@@ -3,8 +3,10 @@
 
 export const WRITE_OFF_STORE_INFO = 'stadium_list'; 
 export const WRITE_OFF_ORDER_INFO = 'order_info'; 
+export const WRITE_OFF_YM_ORDER_INFO = 'ym_order_info';  // 年月卡订单核销
 
 export default {
     WRITE_OFF_STORE_INFO,
     WRITE_OFF_ORDER_INFO,
+    WRITE_OFF_YM_ORDER_INFO
 }

src/pages.json

@@ -134,6 +134,18 @@
 			}
 		},
 		{
+			"path": "pages/write_off/ym_card_gated/ym_card_gated",
+			"style": {
+				"navigationBarTitleText": "核销订单"
+			}
+		},
+		{
+			"path": "pages/write_off/ym_confirm/ym_confirm",
+			"style": {
+				"navigationBarTitleText": "核销订单"
+			}
+		},
+		{
 			"path": "pages/write_off/confirm/confirm",
 			"style": {
 				"navigationBarTitleText": "确认订单信息"
@@ -402,6 +414,18 @@
 					}
 				},
 				{
+					"path": "pages/ym_card/use_record/use_record",
+					"style" : {
+						"navigationBarTitleText": " 年月卡使用记录" 
+					}
+				},
+				{
+					"path": "pages/ym_card/detail/detail",
+					"style" : {
+						"navigationBarTitleText": "年月卡详情" 
+					}
+				},
+				{
 					"path": "pages/mall/refund_list/refund_list",
 					"style" : {
 						"navigationBarTitleText": "退款" 

src/pages/order_list/order_list.vue

@@ -63,13 +63,8 @@
                 <mall v-if="orderType == 2" :order-info="e"></mall>
                 <rent-and-sale v-if="orderType == 8" :order-info="e"></rent-and-sale>
                 <retail v-if="orderType == 19" :order-info="e"></retail>
+                <ym-card v-if="orderType == 20"  :order-info="e"></ym-card>
             </view>
-            <!-- <view class="ool-item">
-                <mall></mall>
-            </view>
-            <view class="ool-item">
-                <rent-and-sale></rent-and-sale>
-            </view> -->
             
       </view>
       <view class="ol-order-null" v-else>
@@ -138,6 +133,7 @@
 	import device from '../../components/order_list/device/device.vue';  // 售货柜/浴室/咖啡
 	import competition from '../../components/order_list/competition/competition.vue';  // 赛事
 	import retail from '../../components/order_list/retail/retail.vue';  // 零售
+	import ym_card from '../../components/order_list/ym_card/ym_card.vue';  // 年月卡
 
     import util from '../../utils/util';
     import { servers } from '../../js/server';
@@ -163,6 +159,7 @@
             'device': device,
             'competition': competition,
             'retail': retail,
+            'ym-card': ym_card,
         },
         computed:{
             isStoreInfo(){
@@ -175,7 +172,8 @@
                     orderType == 15 || orderType == 16 ||
                     orderType == 8  || orderType == 7  ||
                     orderType == 11 || orderType == 6  || 
-                    orderType == 9
+                    orderType == 9  || orderType == 19 ||
+                    orderType == 20
                 )
             },
             // 分类列表
@@ -423,6 +421,7 @@
 				if(type == 14)return API.appointmentOrderList; // 高光时刻
 				if(type == 2)return API.shop2OrderList; // 商城订单
 				if(type == 19)return API.retailOrderList; // 零售订单
+				if(type == 20)return API.userMonthlyCardLs; // 列表用户年月卡-后台
             },
             // 是否为设备，统一接口
             isDevice(){
@@ -545,6 +544,8 @@
                 return '租售柜订单列表';
             case 19:
                 return '零售订单';
+            case 20:
+                return '年月卡订单';
             default: 
                 return '订单'
         }
@@ -586,6 +587,8 @@
                 return [ {id: '1,2,4', name: '全部'}, {id: 1, name: '租用中'}, {id: 2, name: '已完成'}, {id: 4, name: '已退款'},{id: 5, name: '已购买'}];
             case 19:  // 订单管理 筛选的 status  status = 1  交易成功
                 return [ {id: 1, name: '交易成功'} ];
+            case 20:  // 年月卡 筛选的 status   全部 0,1,2,3   待激活 0   使用中 1    已失效 2    已退卡 3
+                return [ {id: '', name: '全部'}, {id: 0, name: '待激活'}, {id: 1, name: '使用中'}, {id: 2, name: '已失效'},{id: 3, name: '已退卡'}];
             default:  
                 return []
         }

src/pages/write_off/operate/operate.vue

@@ -101,7 +101,11 @@ export default {
                 util.hideLoad();
                 if(res.data.code == 0){
                     let _data = res.data.data || {}
-                    util.$_emit(WRITE_OFF_ORDER_INFO, {..._data})
+                    util.$_emit(WRITE_OFF_ORDER_INFO, {..._data});
+                    if(_data.extension&&_data.extension.verify_order_type === 'monthly_card'){
+                        util.routeTo(`/pages/write_off/ym_confirm/ym_confirm?type=${type}`, 'nT');
+                        return
+                    }
                     util.routeTo(`/pages/write_off/confirm_order/confirm_order?type=${type}`, 'nT');
                 }else{
                     util.routeTo(`/pages/write_off/null/null?type=${type}`, 'nT');

src/pages/write_off/ym_card_gated/ym_card_gated.vue

@@ -0,0 +1,127 @@
+<template>
+    <view class="ym-card-gated">
+        <view class="ycg-stadium">{{ pageInfo.orderInfo.extension.stadium_name || '-' }}</view>
+        <view class="ycg-suc-tip">核销成功</view>
+        <view class="ycg-back-btn" @click="backBtn">返回继续核销</view>
+        <view class="ycg-open-tip" v-if="pageInfo.gates&&pageInfo.gates.length">如需开门，请点击</view>
+        <view class="ycg-btn-ls">
+            <view class="ybl-item" v-for="(e, i) in pageInfo.gates" :key="i">
+                <view class="yi-name">{{ e.hardware_name || '-' }}</view>
+                <view class="yi-btn" @click="openBtn(e.id)">开门</view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+import { API } from '../../../js/api';
+import { servers } from '../../../js/server';
+import { WRITE_OFF_YM_ORDER_INFO } from '../../../js/once_name';
+import util from '../../../utils/util';
+export default {
+    data(){
+        return {
+            pageInfo: {
+                orderInfo: { extension: {} },
+                gates: [],
+            }
+        }
+    },
+    onLoad(options){
+        util.$_once(WRITE_OFF_YM_ORDER_INFO, data => {
+            console.warn(data)
+            this.pageInfo = data;
+        })
+    },
+    methods: {
+        backBtn(){
+            util.routeTo();
+        },
+        openBtn: util.debounce(function(id){
+            let { pageInfo } = this;
+            util.showLoad();
+            servers.get({
+                url: API.writeOff.userMonthlyCardOpenGate,
+                data: { gate_id: id, card_no: pageInfo.orderInfo.card_no },
+                isDefaultGet: false
+            })
+            .then(res=>{
+                util.hideLoad();
+                if(res.data.code == 0){
+                    util.showNone(res.data.message || '操作成功！');
+                }else{
+                    util.showNone(res.data.message || '操作失败！');
+                }
+            })
+            .catch(util.hideLoad)
+        }, 300, true)
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    page{
+        background-color: #fff;
+    }
+    .ym-card-gated{
+        padding: 0 30upx;
+        .ycg-stadium{
+            padding: 30upx 0;
+            font-size: 32upx;
+            color: #1a1a1a;
+            border-bottom: 2upx solid #E5E5E5;
+        }
+        .ycg-suc-tip{
+            padding: 100upx 0 200upx;
+            text-align: center;
+            line-height: 60upx;
+            font-size: 50upx;
+            color: #333;
+        }
+        .ycg-back-btn{
+            margin: 0 auto 50upx;
+            width: 250upx;
+            height: 88upx;
+            line-height: 88upx;
+            text-align: center;
+            font-size: 32upx;
+            color: $themeColor;
+            border: 2upx solid $themeColor;
+            border-radius: 6upx;
+        }
+        .ycg-open-tip{
+            margin-bottom: 50upx;
+            font-size: 24upx;
+            line-height: 32upx;
+            color: #9a9a9d;
+        }
+        .ycg-btn-ls{
+            padding: 0 24upx;
+            .ybl-item{
+                border-bottom: 2upx solid #f2f2f7;
+                padding: 30upx 0;
+                @include centerFlex(space-between);
+                .yi-name{
+                    flex-grow: 1;
+                    font-size: 28upx;
+                    line-height: 32upx;
+                    color: #333;
+                    @include textHide(1);
+                }
+                .yi-btn{
+                    flex-shrink: 0;
+                    margin-left: 20upx;
+                    width: 128upx;
+                    height: 66upx;
+                    line-height: 66upx;
+                    font-size: 32upx;
+                    text-align: center;
+                    border-radius: 10upx;
+                    background-color: $themeColor;
+                    color: #fff;
+                }
+            }
+        }
+    }
+</style>

src/pages/write_off/ym_confirm/ym_confirm.vue

@@ -0,0 +1,192 @@
+<template>
+    <view class="ym-confirm">
+        <view class="yc-header">
+            <view class="yh-stadium">{{ orderInfo.extension.stadium_name || '-' }}</view>
+            <view class="yh-info">
+                <view>今天剩余可使用：{{ orderInfo.extension.rest_number  || '0' }}次</view>
+                <view>进场状态：<text>{{ orderInfo.enter_status == 0?'离场':orderInfo.enter_status == 1?'进场':'' }}</text></view>
+                <view v-if="orderInfo.enter_status == 1">进场时间：{{ orderInfo.latest_enter_time  || '-' }}</view>
+            </view>
+        </view>
+        <view class="yc-user-info">
+            <view class="yui-tit">持卡人信息</view>
+            <view class="yui-line">手机号码：{{ orderInfo.mobile || '-' }}</view>
+            <view class="yui-line">用户昵称：{{ orderInfo.nickname || '-' }}</view>
+        </view>
+        <view class="yc-photo" v-if="!!orderInfo.user_face">
+            <view>照片</view>
+            <image mode="aspectFit" @click="previewImg(orderInfo.user_face)" :src="orderInfo.user_face"></image>
+        </view>
+        
+        <view class="yc-card-mes">
+            <view class="ycm-tit">年月卡信息</view>
+            <view class="ycm-line">年月卡名称：{{ orderInfo.card_info.name || '-' }}</view>
+            <view class="ycm-line">年月卡卡号：{{ orderInfo.card_no || '-' }}</view>
+            <view class="ycm-line">验证码：{{ orderInfo.verify_code || '-' }}</view>
+            <view class="ycm-line">生成时间：{{ orderInfo.created_at || '-' }}</view>
+            <view class="ycm-line">失效时间：{{ orderInfo.expired_at || '-' }}</view>
+        </view>
+        <view class="yc-btns">
+            <view class="green" @click="confirmBtn">确认核销</view>
+            <!-- <view>仅核销</view> -->
+        </view>
+    </view>
+</template>
+
+<script>
+import util from '../../../utils/util';
+import { API } from '../../../js/api';
+import { servers } from '../../../js/server';
+import { WRITE_OFF_YM_ORDER_INFO, WRITE_OFF_ORDER_INFO } from '../../../js/once_name';
+export default {
+    data(){
+        return { 
+            type: '', // verify_code -> 5: 验证码核销(商家助手) | decrypt_text -> 6: 扫码核销(商家助手)
+            orderInfo: {
+                extension: {},
+                card_info: {}
+            }
+        }
+    },
+    onLoad(options){
+        if(options.type)this.type = options.type || '';
+        util.$_once(WRITE_OFF_ORDER_INFO, data => {
+            console.warn(data)
+            this.orderInfo = data;
+        })
+    },
+    methods: {
+        previewImg(url){
+            uni.previewImage({ urls: [ url ] });
+        },
+        confirmBtn: util.debounce(function(){
+            let { orderInfo, type } = this;
+            servers.post({
+                url: API.writeOff.userMonthlyCardVerify,
+                data: {
+                    brand_id: orderInfo.brand_id,
+                    card_no: orderInfo.card_no,
+                    stadium_id: orderInfo.stadium_id,
+                    type: type == 'verify_code'? 5 : 6,
+                },
+                isDefaultGet: false,
+            })
+            .then(res=>{
+                if(res.data.code == 0){
+                    util.showNone(res.data.message || '操作成功！');
+                    let { orderInfo } = this;
+                    let _ls = res.data.data&&res.data.data.gates || [];
+                    setTimeout(_=>{
+                        util.$_emit(WRITE_OFF_YM_ORDER_INFO, {
+                            orderInfo,
+                            gates: _ls
+                        });
+                        util.routeTo(`/pages/write_off/ym_card_gated/ym_card_gated`, 'nT');
+                    }, 1200);
+                }else{
+                    util.showNone(res.data.message || '操作失败！');
+                }
+            })
+        }, 300, true)
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    page{
+        background-color: #fff;
+    }
+    .ym-confirm{
+        padding-bottom: 24upx;
+        padding-bottom: calc( 24upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+        padding-bottom: calc( 24upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+        .yc-header{
+            padding: 0 30upx;
+            border-bottom: 2upx solid #f2f2f7;
+            .yh-stadium{
+                padding: 30upx 0;
+                font-size: 32upx;
+                color: #1a1a1a;
+                border-bottom: 2upx solid #E5E5E5;
+            }
+            .yh-info{
+                padding: 20upx 0;
+                >view{
+                    margin-bottom: 10upx;
+                    font-size: 28upx;
+                    line-height: 52upx;
+                    color: #333333;
+                    @include textHide(1);
+                    >text{
+                        color: $themeColor;
+                    }
+                }
+            }
+        }
+        .yc-user-info{
+            padding: 30upx;
+            border-bottom: 2upx solid #f2f2f7;
+            .yui-tit{
+                margin-bottom: 20upx;
+                font-size: 28upx;
+                line-height: 52upx;
+                color: #9C9C9F;
+            }
+            .yui-line{
+                font-size: 28upx;
+                line-height: 52upx;
+                color: #333;
+                @include textHide(1);
+            }
+        }
+        .yc-photo{
+            display: flex;
+            padding: 30upx;
+            border-bottom: 2upx solid #f2f2f7;
+            >view{
+                margin-right: 50upx;
+                font-size: 28upx;
+                line-height: 52upx;
+                color: #9c9c9f;
+            }
+            >image{
+                flex-shrink: 0;
+                width: 218upx;
+                height: 218upx;
+                border-radius: 10upx;
+            }
+        }
+        .yc-card-mes{
+            padding: 30upx 30upx 0;
+            .ycm-tit{
+                margin-bottom: 20upx;
+                line-height: 52upx;
+                color: #9c9c9f;
+            }
+            .ycm-line{
+                line-height: 52upx;
+                font-size: 28upx;
+                color: #333;
+                @include textHide(1);
+            }
+        }
+        .yc-btns{
+            padding: 152upx 64upx 24upx;
+            >view{
+                margin-bottom: 24upx;
+                line-height: 108upx;
+                text-align: center;
+                border-radius: 10upx;
+                border: 2upx solid $themeColor;
+                font-size: 32upx;
+                color: $themeColor;
+                &.green{
+                    background-color: $themeColor;
+                    color: #fff;
+                }
+            }
+        }
+        
+    }
+</style>

src/subpackage/order/js/api.js

@@ -24,6 +24,10 @@ export const ORDER_API = {
 	rentballOrderEnd:`${ORIGIN}/admin/assistant/rentball/order/end`,  // 租球机-结束计费
 	leaseOrderEnd:`${ORIGIN}/admin/stadium/leaseOrder/endBill`,  // 租售柜-结束计费
 	retailOrderInfo:`${ORIGIN}/admin/erp/retailOrder/info`,  // 订单管理-零售订单详情
+	userMonthlyCardInfo:`${ORIGIN}/admin/userMonthlyCard/get`,  // 详情用户年月卡-后台
+	ymCardInfoFace:`${ORIGIN}/upload/file/ym_card_face`,  // 年月卡用户头像上传
+	ymCardInfoFaceSave:`${ORIGIN}/admin/userMonthlyCard/updateFace`,  // 年月卡用户头像保存
+	ymCardUsage:`${ORIGIN}/admin/userMonthlyCard/usages`,  // 用户年月卡使用记录-后台
 
 }
 

src/subpackage/order/pages/order_manage/order_manage.vue

@@ -38,7 +38,7 @@ export default {
             util.routeTo(getTabRoutePath() + `?order_type=${ele.orderType}`,'nT');
         },
         isFinish(key){
-            let _endKeyArr = [ 1, 2, 3, 4, 5, 7, 9, 10, 14, 16, 15, 13, 6, 8, 11, 12, 18 ];
+            let _endKeyArr = [ 1, 2, 3, 4, 5, 7, 9, 10, 14, 16, 15, 13, 6, 8, 11, 12, 18, 19];
             return _endKeyArr.includes(key);
         }
     }
@@ -59,6 +59,7 @@ function getTabList(){
             { id: 2, name: '次卡订单', key: 2, iconName: 'order_2', orderType: 3 },
             { id: 3, name: '计时订单', key: 3, iconName: 'order_6', orderType: 1 },
             { id: 4, name: '储值卡订单', key: 4, iconName: 'order_1', orderType: 18 },
+            { id: 10, name: '年月卡订单', key: 19, iconName: 'order_19', orderType: 20 },
             { id: 5, name: '课程订单', key: 5, iconName: 'order_8', orderType: 12 },
             { id: 6, name: '赛事订单', key: 6, iconName: 'order_9', orderType: 14 },
             { id: 7, name: '约玩订单', key: 7, iconName: 'order_15', orderType: 10 },

src/subpackage/order/pages/ym_card/detail/detail.vue

@@ -0,0 +1,279 @@
+<template>
+    <view class="ym-card-info">
+        <view class="yci-main">
+            <view class="yci-box ym-card-info">
+                <view class="yci-stadium-name">{{ orderInfo.extension.name || '-' }}</view>
+                <view class="yci-line">
+                    <view>年月卡名称：{{ orderInfo.card_info.name || '-' }}</view>
+                    <view>年月卡卡号：{{ orderInfo.card_no || '-' }}</view>
+                    <view>有效期：至{{ orderInfo.expired_at || '-' }}</view>
+                </view>
+                <view class="yci-btn">
+                    <view @click="toRecord">使用记录</view>
+                </view>
+                <view class="yci-status-tag">
+                    <image mode="aspectFit" :src="getTagImgPath(orderInfo.status)"></image>
+                </view>
+            </view>
+            
+            <view class="yci-box ym-user">
+                <view class="yci-tit">持卡人信息</view>
+                <a-line :value="orderInfo.mobile || '-'">
+                    <block slot="name">手机号码：</block> 
+                </a-line>
+                <a-line :value="orderInfo.nickname || '-'">
+                    <block slot="name">用户昵称：</block> 
+                </a-line>
+                <view class="yu-line">照片：<text @click="changeFaceImgBtn">更改照片</text></view>
+                <image class="yu-img" mode="aspectFit" :src="orderInfo.user_face"></image>
+            </view>
+
+            <view class="yci-box yci-buy-info"  v-if="orderInfo.status == 1 || orderInfo.status == 2 || orderInfo.status == 3">
+                <view class="yci-tit">购卡信息</view>
+                <view class="ybi-name">年月卡名称：{{ orderInfo.card_info.name || '-' }}</view>
+                <s-line :keyname="'金额小计'" :value="'￥' + (orderInfo.extension.amount || '0')"></s-line>
+                <s-line :keyname="'积分抵扣'" :value="'￥' + (orderInfo.extension.deduction_amount|| '0')"></s-line>
+                <s-line :keyname="'折扣金额'" :value="'￥' + (orderInfo.extension.discount_amount || '0')"></s-line>
+                <s-line :keyname="'优惠券优惠'" :value="'￥' + (orderInfo.extension.coupons_amount || '0')"></s-line>
+                <view class="ybi-total"><text>合计支付：</text>￥ {{ orderInfo.extension.pay_amount || '0' }}</view>
+            </view>
+
+            <view class="yci-box yci-pay-info" v-if="orderInfo.status == 1 || orderInfo.status == 2 || orderInfo.status == 3">
+                <view class="yci-tit">支付信息</view>
+                <p-line :keyname="'订单编号'" :value="orderInfo.order_no || '-'" ></p-line>
+                <p-line :keyname="'支付方式'" :value="orderInfo.extension.pay_type_text || '-'" ></p-line>
+                <p-line :keyname="'支付时间'" :value="orderInfo.extension.pay_time || '-'" ></p-line>
+                <p-line :keyname="'微信交易号'" :value="orderInfo.extension.trade_no || '-'" ></p-line>
+                <p-line :keyname="'创建途径'" :value="orderInfo.source || '-'" ></p-line>
+            </view>
+
+        </view>
+    </view>
+</template>
+
+<script>
+import a_line from '../../../../../components/order_list/a_line/a_line.vue';
+import s_line from '../../../components/s_line/s_line.vue';
+import p_line from '../../../components/p_line/p_line.vue';
+import util from '../../../../../utils/util';
+import { ORDER_API } from '../../../js/api';
+import server from '../../../js/server';
+export default {
+    components: {
+        'a-line': a_line,
+        's-line': s_line,
+        'p-line': p_line,
+        
+    },
+    data(){
+        return {
+            orderInfo: {
+                card_info: {},
+                extension: {}
+            },
+            optionsQuery: {},
+        }
+    },
+    onLoad(options){
+        this.getCardInfo({
+            id: options.id,
+            card_no: options.card_no
+        });
+        this.optionsQuery = options || {};
+    },
+    methods: {
+        changeFaceImgBtn(){
+            uni.chooseImage({
+                count: 1,
+                success: imgRes =>{
+                    this.upLoadImg(imgRes || {});
+                },
+                failMsg: imgErr => {
+                    console.warn('chooseImage err --->' , imgErr);
+                    util.showNone('选择图片失败！');
+                }
+            })
+        },
+        upLoadImg(imgRes){
+            util.showLoad();
+            server.uploadFile({
+                url: ORDER_API.ymCardInfoFace,
+                filePath: imgRes.tempFilePaths[0] || '',
+            })
+            .then(e=>{
+                    util.hideLoad();
+                    let _res = util.jsonPar(e.data);
+                    if(_res.code == 0){
+                        let _url = _res.data.url || '';
+                        this.saveFaceImg(_url);
+                    }else{
+                        console.error('上传图片失败--->',_res);
+                        util.showNone(_res.message || '上传图片失败，请重试！')
+                    }
+                })
+                .catch(err=>{
+                    util.hideLoad();
+                    console.error('上传图片失败--->',err);
+                    util.showNone('上传图片失败，稍后重试！')
+                })
+        },
+        saveFaceImg(faceUrl){
+            let { optionsQuery } = this;
+            util.showLoad();
+            server.post({
+                url: ORDER_API.ymCardInfoFaceSave,
+                data: {
+                    card_no: optionsQuery.card_no,
+                    face: faceUrl,
+                },
+                isDefaultGet: false,
+            })
+            .then(res=>{
+                util.hideLoad();
+                if(res.data.code == 0){
+                    util.showNone(res.data.message || '操作成功！');
+                    let { optionsQuery } = this;
+                    setTimeout(_=>{
+                        this.getCardInfo({
+                            id: optionsQuery.id,
+                            card_no: optionsQuery.card_no
+                        });
+                    }, 1200);
+                }else{
+                    util.showNone(res.data.message || '操作失败！');
+                }
+            })
+        },
+        getTagImgPath(status){
+            if(!status)return ''
+            return `/subpackage/order/static/images/ym_card/status_${status}.png`
+        },
+        getCardInfo({id, card_no}){
+            util.showLoad();
+            server.get({
+                url: ORDER_API.userMonthlyCardInfo,
+                data: { id, card_no },
+                failMsg: '加载失败！'
+            })
+            .then(res=>{
+                util.hideLoad();
+                this.orderInfo = res || {};
+            })
+        },
+        toRecord(){
+            let { optionsQuery } = this;
+            util.routeTo(`/subpackage/order/pages/ym_card/use_record/use_record?card_no=${optionsQuery.card_no}`, 'nT');
+        },
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    .ym-card-info{
+        
+    }
+    .yci-box{
+        padding: 30upx;
+        margin-bottom: 24upx;
+        border-radius: 10upx;
+        background-color: #fff;
+    }
+    .yci-tit{
+        margin-bottom: 20upx;
+        line-height: 40upx;
+        font-size: 28upx;
+        color: #9C9C9F;
+    }
+    .yci-main{
+        padding: 24upx;
+        .ym-card-info{
+            position: relative;
+            .yci-stadium-name{
+                margin-bottom: 22upx;
+                padding-bottom: 26upx;
+                line-height: 40upx;
+                font-size: 28upx;
+                font-weight: 500;
+                border-bottom: 2upx solid #D8D8D8;
+                @include textHide(1);
+            }
+            .yci-line{
+                margin-bottom: 32upx;
+                >view{
+                    line-height: 48upx;
+                    font-size: 28upx;
+                    color: #333;
+                    @include textHide(1);
+                }
+            }
+            .yci-btn{
+                @include centerFlex(flex-end);
+                >view{
+                    width: 176upx;
+                    line-height: 80upx;
+                    text-align: center;
+                    border-radius: 10upx;
+                    border: 2upx solid #9A9A9D;
+                    font-size: 32upx;
+                    color: #9A9A9D;
+                }
+            }
+            .yci-status-tag{
+                position: absolute;
+                right: 0;
+                top: 0;
+                width: 132upx;
+                height: 132upx;
+                overflow: hidden;
+                border-top-right-radius: 10upx;
+                >image{
+                    width: 100%;
+                    height: 100%;
+                }
+            }   
+        }
+        .ym-user{
+            .yu-line{
+                margin-bottom: 16upx;
+                font-size: 28upx;
+                line-height: 52upx;
+                color: #9a9a9d;
+                >text{
+                    color: $themeColor;
+                    text-decoration: underline;
+                }
+            }
+            .yu-img{
+                display: block;
+                width: 218upx;
+                height: 218upx;
+                border-radius: 10upx;
+
+            }
+        }
+        .yci-buy-info{
+            .ybi-name{
+                margin-bottom: 22upx;
+                padding-bottom: 30upx;
+                font-size: 28upx;
+                line-height: 40upx;
+                color: #1a1a1a;
+                border-bottom: 2upx solid #D8D8D8;
+
+            }
+            .ybi-total{
+                text-align: right;
+                font-size: 28upx;
+                font-weight: 500;
+                line-height: 40upx;
+                color: #333;
+                @include textHide(1);
+                >text{
+                    color: #9A9A9D;
+                }
+            }
+        }
+    }
+    
+</style>

src/subpackage/order/pages/ym_card/use_record/use_record.vue

@@ -0,0 +1,112 @@
+<template>
+    <view class="use-record">
+        <view class="ur-list">
+            <view class="ul-item" v-for="(e, i) in recordLs" :key="i">
+                <view class="ui-header">
+                    <image class="uh-img" mode="aspectFit" :src="e.stadium_logo"></image>
+                    <view>{{ e.stadium_name || '-' }}</view>
+                </view>
+                <view class="uh-lines">
+                    <view><text>验证方式：</text>{{ e.verify_type || '-' }}</view>
+                    <view><text>核销时间：</text>{{ e.verify_time || '-' }}</view>
+                    <view><text>离场时间：</text>{{ e.leave_time || '-' }}</view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+import util from '../../../../../utils/util';
+import { ORDER_API } from '../../../js/api';
+import server from '../../../js/server';
+export default {
+    data(){
+        return {
+            recordLs: [],
+            page: 1,
+            card_no: '',
+        }
+    },
+    onLoad(options){
+        this.card_no = options.card_no || '';
+        this.getRecordLs({
+            card_no: options.card_no,
+        });
+    },  
+    onReachBottom(){
+        let { card_no, page } = this;
+        this.getRecordLs({
+            card_no: card_no,
+            page: ++page,
+        })
+    },
+    methods: {
+        getRecordLs({
+            card_no,
+            page = 1,
+            page_size = 15
+        }){
+            util.showLoad();
+            server.get({
+                url: ORDER_API.ymCardUsage,
+                data: { card_no, page_size, page },
+                failMsg: '加载失败！'
+            })
+            .then(res=>{
+                util.hideLoad();
+                let _ls = res.list || [];
+                if(page == 1)return this.recordLs = _ls;
+                if(!_ls.length)return util.showNone('没有更多！');
+                this.page = page;
+                this.recordLs = [...this.recordLs, ..._ls];
+            })
+        },
+    }
+}
+</script>
+
+<style lang="scss">
+    @import  '~style/public.scss';
+    .use-record{
+        .ur-list{
+            .ul-item{
+                margin-bottom: 24upx;
+                padding: 30upx;
+                background-color: #fff;
+                .ui-header{
+                    height: 100upx;
+                    border-bottom: 2upx solid #f2f2f7;
+                    @include centerFlex(space-between);
+                    .uh-img{
+                        flex-shrink: 0;
+                        flex-grow: 0;
+                        margin-right: 10upx;
+                        width: 30upx;
+                        height: 30upx;
+                    }
+                    >view{
+                        flex-grow: 1;
+                        line-height: 44upx;
+                        font-size: 32upx;
+                        color: #333;
+                        @include textHide(1);
+                    }
+                }
+                .uh-lines{
+                    padding: 14upx 16upx 10upx;
+                    >view{
+                        font-size: 28upx;
+                        line-height: 50upx;
+                        color: #333;
+                        @include textHide(1);
+                        >text{
+                            color: #9A9A9D;
+                        }
+                    }
+                }
+
+            }
+        }
+    }
+</style>