diff --git a/src/components/site/order_modal/order_modal.vue b/src/components/site/order_modal/order_modal.vue
index 239eddc..8377c60 100644
--- a/src/components/site/order_modal/order_modal.vue
+++ b/src/components/site/order_modal/order_modal.vue
@@ -126,9 +126,9 @@
 			</view>
 			<!-- 挂账 -->
 			<view class="om-btns" v-if="orderInfo.type == 'take_up_venue_bboc'">
-				<view class="ob-view" @click="toShare">分享给朋友</view>
+				<view class="ob-view" @click="toShare" v-if="orderInfo.is_take_up_can_share">分享给朋友</view>
 				<view class="ob-view red" @click="cancelOccupy">取消占用</view>
-				<view class="ob-view red2" @click="toCollections">收款</view>
+				<view class="ob-view red2" v-if="!orderInfo.take_up_use_bboc_pay" @click="toCollections">收款</view>
 			</view>
 		</view>
 	</view>
diff --git a/src/pages.json b/src/pages.json
index c1e0f13..ba403fa 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -694,6 +694,17 @@
 					}
 				}
 			]
+		},
+		{
+			"root": "subpackage/common",
+			"pages": [
+				{
+					"path": "pages/pay_type_select",
+					"style" : {
+						"navigationBarTitleText": "支付订单"
+					}
+				}
+			]
 		}
 	],
 	"globalStyle": {
diff --git a/src/pages/site/confirm/confirm.vue b/src/pages/site/confirm/confirm.vue
index 8b4a543..d8ce167 100644
--- a/src/pages/site/confirm/confirm.vue
+++ b/src/pages/site/confirm/confirm.vue
@@ -38,7 +38,8 @@
                     <view><text>*</text>是否联动开灯</view>
                     <switch 
                         :disabled="isOrder"
-                        v-model="light_up"
+                        :checked="light_up"
+                        @change="lightChange"
                         color="#009874"
                         ></switch>
                 </view>
@@ -47,14 +48,14 @@
             <view class="sc-ipt">
                 <view class="si-price">
                     <view class="si-tit"><text>* </text>收取金额</view>
-                    <view class="sp-frame"><text>￥</text><input :disabled="isOrder" v-model="ocPrice" type="digit" /></view>
+                    <view class="sp-frame"><text>￥</text><input v-model="ocPrice" type="digit" /></view>
                 </view>
                 <view class="si-usage">
                     <view class="su-line">
                         <view class="si-tit"><text>* </text>占用用途</view>
                         <view class="su-ls">
                             <block v-for="(e, i) in usageLs" :key="i">
-                                <view :class="[e.type == ocUsage ? 'active' : '']" @click="ocUsage = e.type">
+                                <view :class="[e.type == ocUsage ? 'active' : '']" @click="usageChange(e.type)">
                                     <text>{{ e.name || "-" }}</text>
                                     <image v-if="e.type == ocUsage" mode="aspectFit" src='/static/images/icon/selected_tag.png'></image>
                                 </view>
@@ -66,13 +67,17 @@
                 <view class="si-reason">
                     <view class="si-tit">占用原因</view>
                     <view class="sr-frame">
-                        <textarea :disabled="isOrder" placeholder="多行输入…"  v-model="ocReaon"></textarea>
+                        <textarea placeholder="多行输入…"  v-model="ocReaon"></textarea>
                     </view>
                 </view>
             </view>
         </view>
         <cover-view class="sc-fixed-bot">
-            <cover-view class="sfb-view" hover-class="hover-active" @click="confirmOccupy">确定</cover-view>
+            <cover-view 
+                class="sfb-view" 
+                hover-class="hover-active" 
+                @click="confirmOccupy"
+            >{{ nextBtnTxt || '-' }}</cover-view>
         </cover-view>
     </view>
 </template>
@@ -95,6 +100,11 @@ export default {
         }
     },
     computed: {
+        nextBtnTxt(){
+            let { ocUsage, isOrder } = this;
+            if(ocUsage == 4&&!isOrder)return '确认';
+            return '下一步';
+        },
         isOrder(){
             return !!this?.occupyInfo?.orderInfo?.order_no;
         },
@@ -110,34 +120,88 @@ export default {
         }
     },
     onLoad(){
-        console.log(this.occupyInfo)
+        console.log(this.occupyInfo);
+        this.initOrderPage();
     },
     methods: {
         initOrderPage(){
             let { occupyInfo, isOrder }= this;
+            if(!occupyInfo|| !isOrder)return;
+            let _orderInfo = occupyInfo?.orderInfo || {};
+            this.ocReaon = _orderInfo.reason || '';
+            this.ocPrice = _orderInfo.amount || '';
+            this.ocUsage = this.sereverTypeToUsage(_orderInfo.type) || 1;
+            this.light_up = _orderInfo.light_up || false;
+        },
+        sereverTypeToUsage(type){
+            let _obj = {
+                'take_up_venue_bboc': 4,
+                'fixed_venue': 3,
+            }
+            return _obj[type] || 1;
+        },
+        lightChange(e){
+            this.light_up = e.detail.value;
+        },
+        usageChange(type){
+            let { isOrder } = this;
+            if(isOrder)return;
+            this.ocUsage = type;
+        },
+        toOccupyPaySelect(occupyData){
+            
+        },
+        toOrderPaySelect(additionalData){
+            let { storeInfo } = this.occupyInfo;
+            let { ocPrice, ocUsage } = this;
+            let _query ={
+                    type: ocUsage,
+                    brand_id: storeInfo?.brand_id,
+                    amount: ocPrice,
+                    stadiumInfo: {
+                        id: storeInfo?.id,
+                        name: storeInfo?.name,
+                        logo: storeInfo?.logo,
+                    },
+                    ...additionalData
+                }
+            util.routeTo(`/subpackage/common/pages/pay_type_select?query=${util.jsonStr(_query)}`, 'rT')
         },
         confirmOccupy: util.debounce(function(){
-            let { storeInfo, dateInfo, venueList, typeInfo} = this.occupyInfo;
-            let { ocPrice, ocReaon, light_up, ocUsage } = this;
+            let { storeInfo, dateInfo, venueList, typeInfo, orderInfo} = this.occupyInfo;
+            let { ocPrice, ocReaon, light_up, ocUsage, isOrder } = this;
+
+            let occupyData = {
+                brand_id: storeInfo.brand_id,
+                group: storeInfo.id,
+                amount: +ocPrice,
+                date: dateInfo.dateStr,
+                take_up_use: ocUsage,
+                items: venueList,
+                light_up,
+                reason: ocReaon,
+            }
+
+            if(isOrder&&ocUsage == 4)return this.toOrderPaySelect({
+                exQuery: {
+                    order_no: orderInfo?.order_no,
+                    reason: ocReaon,
+                }
+            });
+            
+            if(ocUsage !== 4)return this.toOrderPaySelect({
+                exQuery: occupyData,
+            });
+
             util.showLoad();
             servers.post({
                 url: API.venue.venueTakeUp,
-                data: {
-                    brand_id: storeInfo.brand_id,
-                    reason: ocReaon,
-                    amount: +ocPrice,
-                    group: storeInfo.id,
-                    date: dateInfo.dateStr,
-                    take_up_use: ocUsage,
-                    items: venueList,
-                    light_up,
-                },
+                data: occupyData,
                 isDefaultGet: false
             })
             .then(res=>{
                 util.hideLoad();
                 if(res.data.code == 0){
-                    
                     util.showNone(res.data.message || '操作成功！');
                     let _res = res.data.data || {};
                     let _qrStr = `?brand_id=${_res.brand_id}&order_no=${_res.order_no}`
diff --git a/src/pages/site/manage/manage.vue b/src/pages/site/manage/manage.vue
index 39302c0..4169b8a 100644
--- a/src/pages/site/manage/manage.vue
+++ b/src/pages/site/manage/manage.vue
@@ -558,9 +558,10 @@ export default {
             this.toOrderConfirm({
                 venueList: orderInfo.sessions || [],
                 orderInfo,
-            });
+            }, 'nT');
+            this.$nextTick(_=>this.boardInfo = null);
         },
-        toOrderConfirm(extraObj){
+        toOrderConfirm(extraObj, type = 'rT'){
             let { curStoreInfo, curTypeInfo, curDateInfo } = this;
             this.$store.commit('setOccupyInfo', {
                 storeInfo: curStoreInfo,
@@ -568,7 +569,7 @@ export default {
                 typeInfo: curTypeInfo,
                 ...extraObj,
             })
-            util.routeTo(`/pages/site/confirm/confirm`, 'rT');
+            util.routeTo(`/pages/site/confirm/confirm`, type);
         },
         // 场馆列表
         getVenueList({ type_key, stadium_id, date }){
diff --git a/src/subpackage/common/components/card_search.vue b/src/subpackage/common/components/card_search.vue
new file mode 100644
index 0000000..9d6c58f
--- /dev/null
+++ b/src/subpackage/common/components/card_search.vue
@@ -0,0 +1,276 @@
+<template>
+	<view class="content" v-if="show">
+		<view class="win-mask"></view>
+		
+		<view class="win-operate">
+			<image mode="aspectFit" src="/static/images/icon/retail/close.png" @click="onClose"></image>
+			<text class="win-title">请选择储值卡</text>
+
+			<view class="win-card">
+				<view class="win-card-search">
+					<image v-if="searchCardValue?false:true" mode="aspectFit" src="/static/images/icon/retail/search.png"></image>
+					<input v-model="searchCardValue" @change="searchCardList" placeholder="请输入微信昵称/手机号码/储值卡号搜索" placeholder-style="win-card-search-input-placeholder">
+				</view>
+				<view class="win-card-list">
+					<view class="win-card-list-item" v-for="(item, index) in cardList" :key="index" @click="onCardClick(item)" :style="{borderColor:item.mark===choosePath?'#009874':'#979797'}">
+						<view>储值卡卡号：<text :style="{color:item.color.card_no}">{{ item.card_no }}</text></view>
+						<view>微信昵称：<text :style="{color:item.color.nickname}">{{ item.nickname }}</text></view>
+						<view>手机号码：<text :style="{color:item.color.mobile}">{{ item.mobile }}</text></view>
+						<view>卡名称：<text :style="{color:item.color.card_name}">{{ item.card_name }}</text></view>
+						<view>卡余额：<text :style="{color:item.color.balance}">￥{{ item.balance }}</text></view>
+						<image mode="aspectFit" :src="item.mark"></image>
+					</view>
+				</view>
+			</view>
+			
+			<view class="win-way-confirm"><button hover-class="hover-active" @click="onConfirm">确定</button></view>
+			<view class="win-iphonex-block"></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import util from '../../../utils/util.js';
+	import server from '../js/server';
+	import api from '../js/api';
+	
+	export default {
+		props: [
+			"show", "price", "storeId", "brandId"
+		],
+		data() { 
+			return {
+				cardList: [],		// 储值卡列表
+				choosePath: "/static/images/icon/retail/choose.png",
+				noChoosePath: "/static/images/icon/retail/noChoose.png",
+				curCardChoose: null,
+				searchCardValue: "",
+			}
+		},
+		created() {
+			
+		},
+		methods: {
+			// 储值卡点击
+			onCardClick(item) {
+				this.curCardChoose = item;
+				for (let i = 0; i < this.cardList.length; ++i) this.cardList[i].mark = this.noChoosePath;
+				this.curCardChoose.mark = this.choosePath;
+			},
+			// 获取储值卡列表
+			searchCardList() {
+				if (!this.searchCardValue) {
+					this.cardList = [];
+					this.curCardChoose = null;
+					// util.showNone("请输入微信昵称/手机号码/储值卡号搜索");
+					return;
+				}
+				
+				let _this = this;
+				this.cardList = [];
+				
+				util.showLoad();
+				server.get({
+					url: api.assistantGetValueCardList,
+					data: {
+						brand_id: this.brandId,
+						stadium_id: this.storeId,
+						total_amount: this.price,
+						key: this.searchCardValue,
+					},
+					isDefaultGet: false,
+					failMsg: '搜索失败！'
+				}).then(res => {
+					util.hideLoad();
+					if (res.data.code == 0) {
+						let color = "#333";
+						for (let i = 0; i < res.data.data.length; ++i) {
+							_this.cardList.push(res.data.data[i]);
+							_this.cardList[i].mark = this.noChoosePath;
+							_this.cardList[i].color = {
+								card_no: color, nickname: color, mobile: color, card_name: color, balance: color
+							};
+							
+							for (let j = 0; j < res.data.data[i].match_key_fields.length; ++j)
+								_this.cardList[i].color[res.data.data[i].match_key_fields[j]] = "#009874";
+						}
+						
+						if (_this.cardList.length) {
+							_this.cardList[0].mark = _this.choosePath;
+							this.curCardChoose = _this.cardList[0];
+						}
+						else {
+							util.showNone("查询不到该储值卡信息，请检查重新输入");
+						}
+					}
+					else {
+						util.showNone(res.data.message || '操作失败！');
+					}
+				});
+			},
+			// 重置数据
+			resetData() {
+				this.curCardChoose = null;
+				this.cardList = [];
+				this.searchCardValue = "";
+			},
+			// 关闭窗口
+			onClose() {
+				this.$emit("update:onClose", false);
+			},
+			// 支付确定
+			onConfirm() {
+				if (!this.curCardChoose) {
+					util.showNone("请搜索选择储值卡！");
+					return;
+				}
+				this.$emit("update:onConfirm", this.curCardChoose);
+				this.onClose();
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	@import '~style/public.scss';
+	.content {
+		width: 100vw;
+		height: 100vh;
+		overflow: hidden;
+		position: fixed;
+		top: 0;
+		left: 0;
+	}
+	.win-mask {
+		width: 100%;
+		height: 100%;
+		position: absolute;
+		background-color: rgba(0, 0, 0, 0.5);
+	}
+	.win-operate {
+		width: 100%;
+		height: 964rpx;
+		position: fixed;
+		bottom: 0%;
+		@include centerFlex(flex-start);
+		flex-direction: column;
+		background-color: white;
+		padding-top: 46rpx;
+		
+		> image {
+			width: 34rpx;
+			height: 34rpx;
+			position: absolute;
+			top: 32rpx;
+			right: 28rpx;
+		}
+		> text {
+			width: 100%;
+			color: #333;
+			font-size: 32rpx;
+			text-align: center;
+			margin-bottom: 54rpx;
+		}
+		.win-way-confirm {
+			width: 100%;
+			padding: 0 20rpx;
+			position: absolute;
+			bottom: 0%;
+			bottom: calc( 0% + constant(safe-area-inset-bottom));
+			bottom: calc( 0% + env(safe-area-inset-bottom));
+			
+			> button {
+				width: 100%;
+				height: 112rpx;
+				line-height: 112rpx;
+				border-radius: 10rpx;
+				padding: 0 0;
+				color: white;
+				background-color: $themeColor;
+			}
+		}
+		.win-iphonex-block {
+			background-color: white;
+			width: 100%;
+			height: constant(safe-area-inset-bottom);
+			height: env(safe-area-inset-bottom);
+			poisition: absolute;
+			bottom: 0%;
+		}
+		.win-card {
+			width: 100%;
+			height: 100%;
+			position: relative;
+			@include centerFlex(flex-start);
+			flex-direction: column;
+			padding: 0 20rpx;
+			
+			.win-card-search {
+				width: 100%;
+				border-radius: 10rpx;
+				background-color: #f2f2f7;
+				margin-bottom: 30rpx;
+				@include centerFlex(flex-start);
+				
+				> image {
+					width: 40rpx;
+					height: 40rpx;
+					flex-shrink: 0;
+					margin-left: 20rpx;
+				}
+				> input {
+					font-size: 32rpx;
+					padding: 24rpx 20rpx;
+					flex-grow: 1;
+				} 
+				.win-card-search-input-placeholder {
+					font-size: 32rpx;
+					color: #9c9c9f;
+				}
+			}
+			.win-card-list {
+				width: 100%;
+				height: 100rpx;
+				overflow: scroll;
+				@include centerFlex(flex-start);
+				flex-direction: column;
+				flex-grow: 1;
+				position: relative;
+				margin-bottom: 112rpx;
+				
+				.win-card-list-item {
+					display: flex;
+					flex-direction: column;
+					flex-shrink: 0;
+					width: 100%;
+					border: 2rpx solid #979797;
+					border-color: #979797;
+					border-radius: 10rpx;
+					padding: 20rpx 0;
+					margin-bottom: 24rpx;
+					position: relative;
+					
+					> view {
+						color: #9c9c9f;
+						font-size: 28rpx;
+						margin-bottom: 5rpx;
+						
+						> text {
+							color: #333;
+							font-size: 28rpx;
+						}
+					}
+					
+					> image {
+						width: 36rpx;
+						height: 36rpx;
+						position: absolute;
+						top: 50%;
+						right: 20rpx;
+						transform: translate(0%, -50%);
+					}
+				}
+			}
+		}
+	}
+</style>
diff --git a/src/subpackage/common/js/api.js b/src/subpackage/common/js/api.js
new file mode 100644
index 0000000..2c68d23
--- /dev/null
+++ b/src/subpackage/common/js/api.js
@@ -0,0 +1,9 @@
+import { ORIGIN } from '../../../js/api';
+
+export const COMMON_API = { 
+    assistantGetValueCardList:`${ORIGIN}/admin/assistant/getValueCardList`,  //  搜索储蓄卡
+    takeUpBbocPay:`${ORIGIN}/admin/stadium/venue/takeUpBbocPay`,  //  挂账收款的接口
+    venueTakeUp: `${ORIGIN}/admin/stadium/venue/takeUp`,  // 商家助手-占用场地提交
+}
+
+export default COMMON_API;
\ No newline at end of file
diff --git a/src/subpackage/common/js/server.js b/src/subpackage/common/js/server.js
new file mode 100644
index 0000000..005716d
--- /dev/null
+++ b/src/subpackage/common/js/server.js
@@ -0,0 +1,10 @@
+import { Server } from '../../../js/server';
+
+class CommonServer extends Server {
+    constructor(props){
+        super(props)
+    }
+}
+
+
+export default new CommonServer();
\ No newline at end of file
diff --git a/src/subpackage/common/pages/pay_type_select.vue b/src/subpackage/common/pages/pay_type_select.vue
new file mode 100644
index 0000000..6936523
--- /dev/null
+++ b/src/subpackage/common/pages/pay_type_select.vue
@@ -0,0 +1,374 @@
+<template>
+    <view class="pay-type-select">
+        <view class="pts-header">
+            <view class="ph-stadium-info">
+                <image mode="aspectFill" :src="stadiumInfo.logo"></image>
+                <view>{{ stadiumInfo.name || '-' }}</view>
+            </view>
+            <view class="ph-type-text">订场支付金额</view>
+            <view class="ph-price"><text>¥</text>{{ optionsQuery.amount || 0 }}</view>
+            <view class="ph-discount-tip">
+                <block v-if="payMethodsID == 3"><text>原价：¥99，</text>折扣金额¥9.9</block>
+            </view>
+        </view>
+        <view class="pts-container">
+            <view class="pc-tit-bar">支付方式</view>
+            <view class="pc-ls">
+                <view class="pl-item" v-for="(e, i) in payMethodsLs" :key="i">
+                    <image mode="aspectFit" :src="'/subpackage/common/static/images/ic_'+e.id+'.png'"></image>
+                    <view class="pi-right" @click="payMethodsChange(e)">
+                        <view class="pr-top">
+                            <view class="pr-txt">{{ e.name || '-' }}</view>
+                            <view class="pr-ipt" v-if="e.id == 4">
+                                <input v-model="otherTypeRemark" />
+                            </view>
+                            <view :class="['pr-icon', e.id == payMethodsID? 'active': '']">
+                                <image mode="aspectFit" src="/subpackage/common/static/images/choose.png"></image>
+                            </view>
+                        </view>
+                        <view class="pr-content" v-if="e.id == 3">
+                            <view class="pc-line">
+                                <view class="pl-txt">储值卡卡号：230316000</view>
+                                <view class="pl-tag">使用会员卡支付9折</view>
+                            </view>
+                            <view class="pc-line">
+                                <view class="pl-txt">微信昵称：LLL</view>
+                            </view>
+                            <view class="pc-line">
+                                <view class="pl-txt">手机号码：13711029033</view>
+                            </view>
+                            <view class="pc-line">
+                                <view class="pl-txt">卡名称：1000元送200元卡</view>
+                            </view>
+                            <view class="pc-line">
+                                <view class="pl-txt">卡余额：￥1050</view>
+                            </view>
+                        </view>
+                    </view>
+                </view>
+            </view>
+        </view>
+        <cover-view class="sc-fixed-bot">
+            <cover-view 
+                class="sfb-view" 
+                hover-class="hover-active" 
+                @click="submitBtn"
+            >立即支付</cover-view>
+        </cover-view>
+        <storeCardSelect 
+            :show="isCardSearchModalShow" 
+            @update:onClose="isCardSearchModalShow = false"
+            @update:onConfirm="true"
+		>
+		</storeCardSelect>
+    </view>
+</template>
+
+<script>
+import server from '../js/server.js';
+import API from '../js/api.js';
+import util from '../../../utils/util.js';
+import storeCardSelect from '../components/card_search';
+export default {
+    components: {
+        'storeCardSelect': storeCardSelect
+    },
+    computed: {
+        stadiumInfo(){
+            return this?.optionsQuery?.stadiumInfo || {};
+        },
+        exQuery(){
+            return this?.optionsQuery?.exQuery || {};
+        }
+    },
+    data() {
+        return {
+            isCardSearchModalShow: false,
+            payMethodsLs: this.getPayMethodsLs(),
+            payMethodsID: 0,
+            optionsQuery: {},
+            otherTypeRemark: '',
+        }
+    },
+    /**
+     * @param {Object} _options = JSON.parse(decodeURIComponent(option.query))
+     * @param {String} _options.type 1 -> 客户订场， 2-> 散客， 3-> 锁场, 4 -> 挂账
+     * @param {String} _options.brand_id 
+     * @param {String} _options.amount 
+     * @param {Object} _options.stadiumInfo 
+     *      @param {String} _options.stadiumInfo.id
+     *      @param {String} _options.stadiumInfo.name
+     *      @param {String} _options.stadiumInfo.logo
+     * 
+     * @param {Object} _options.exQuery  // 拓展参数
+     * 
+     * 
+    */
+    onLoad(option){
+        let optionsQuery = util.jsonPar(decodeURIComponent(option.query));
+        this.optionsQuery = optionsQuery;
+        console.warn(optionsQuery)
+    },
+    methods: {
+        submitBtn: util.debounce(function(){
+            let _type = this.optionsQuery?.type;
+            if(+_type === 4)return this.takeUpBbocPay();
+            if(_type !== 4)return this.takeUpSubmit();
+
+        }, 300, true),
+        payMethodsChange(e){
+            if(e.id == 3)this.isCardSearchModalShow = true;
+            this.payMethodsID = e.id;
+        },
+        getPayMethodsLs(){
+            return [
+                { name: '微信支付', id: 0 },
+                { name: '支付宝支付', id: 1 },
+                { name: '现金支付', id: 2 },
+                { name: '储值卡支付', id: 3 },
+                { name: '其他', id: 4 },
+            ]
+        },
+
+        // 挂账订单支付提交
+        takeUpBbocPay(){
+            let { optionsQuery, payMethodsID, otherTypeRemark } = this;
+            let _data = {
+                    brand_id: optionsQuery.brand_id || '',
+                    amount: optionsQuery.amount || '',
+                    reason: optionsQuery?.exQuery?.reason || '',
+                    order_no: optionsQuery?.exQuery?.order_no || '',
+                    take_up_pay_type: payMethodsID
+                }
+            if(payMethodsID === 4)_data['remark'] = otherTypeRemark || '其它';
+            server.post({
+                url: API.takeUpBbocPay,
+                data: _data,
+                failMsg: '操作失败！'
+            })
+            .then(res=>{
+                util.showNone('操作成功！');
+                setTimeout(_=>{
+                    util.routeTo();
+                }, 1200);
+            })
+        },
+
+        // 1 -> 客户订场， 2-> 散客， 3-> 锁场, 提交
+        takeUpSubmit(){
+            let { exQuery, payMethodsID, otherTypeRemark } = this;
+            let _data = {
+                    ...exQuery,
+                    take_up_pay_type: payMethodsID || ''
+                }
+            if(payMethodsID === 4)_data['remark'] = otherTypeRemark || '其它';
+            util.showLoad();
+            server.post({
+                url: API.venueTakeUp,
+                data: _data,
+                isDefaultGet: false
+            })
+            .then(res=>{
+                util.hideLoad();
+                if(res.data.code == 0){
+                    util.showNone(res.data.message || '操作成功！');
+                    let _res = res.data.data || {};
+                    let _qrStr = `?brand_id=${_res.brand_id}&order_no=${_res.order_no}`
+                    util.routeTo(`/pages/site/occupy_success/occupy_success${_qrStr}`, 'rT');
+                }else{
+                    util.showNone(res.data.message || '操作失败！');
+                }
+            })
+            .catch(util.hideLoad)
+        }
+        
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+    @import '~style/public.scss';
+    .pay-type-select{
+        padding-bottom: 120rpx;
+		padding-bottom: calc( 120rpx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+		padding-bottom: calc( 120rpx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+    }
+    .pts-header{
+        margin-bottom: 24upx;
+        padding: 26upx 36upx 110upx;
+        background-color: #fff;
+        .ph-stadium-info{
+            padding-bottom: 34upx;
+            border-bottom: 1px solid #D8D8D8;
+            @include centerFlex(flex-start);
+            >image{
+                flex-shrink: 0;
+                margin-right: 10upx;
+                width: 30upx;
+                height: 30upx;
+            }
+            >view{
+                font-size: 32upx;
+                font-weight: 500;
+                color: #333333;
+                @include textHide(1);
+            }
+        }
+        .ph-type-text{
+            margin-top: 76upx;
+            text-align: center;
+            font-size: 28upx;
+            font-weight: 500;
+            color: #333333;
+            @include textHide(1);
+        }   
+        .ph-price{
+            margin-top: 84upx;
+            text-align: center;
+            font-size: 80upx;
+            font-weight: 500;
+            color: #333333;
+            @include textHide(1);
+            >text{
+                font-size: 60upx;
+            }
+        }
+        .ph-discount-tip{
+            margin-top: 16upx;
+            text-align: center;
+            line-height: 44upx;
+            min-height: 44upx;
+            font-size: 28upx;
+            color: #FF873D;
+            @include textHide(1);
+            >text{
+                color: #181818;
+            }
+        }
+    }
+    .pts-container{
+        
+        background-color: #fff;
+        .pc-tit-bar{
+            padding-left: 24upx;
+            line-height: 72upx;
+            font-size: 28upx;
+            color: #9A9A9D;
+        }
+        .pc-ls{
+            padding: 16upx 30upx 0;
+            .pl-item{
+                display: flex;
+                &:not(:last-child){
+                    .pi-right{
+                        border-bottom: 1px solid #D8D8D8;
+                    }
+                }
+                >image{
+                    flex-shrink: 0;
+                    margin-right: 16upx;
+                    width: 54upx;
+                    height: 54upx;
+                    transform: translateY(24upx);
+                }
+                .pi-right{
+                    flex-grow: 1;
+                    .pr-top{
+                        width: 100%;
+                        height: 102upx;
+                        @include centerFlex(space-between);
+                        .pr-txt{
+                            flex-shrink: 0;
+                            font-size: 28upx;
+                            color: #181818;
+                        }
+                        .pr-ipt{
+                            margin-left: 40upx;
+                            margin-right: auto;
+                            padding: 0 16upx;
+                            width: 340upx;
+                            height: 64upx;
+                            border: 2upx solid #D8D8D8;
+                            border-radius: 10upx;
+                            >input{
+                                width: 100%;
+                                height: 100%;
+                                font-size: 28upx;
+                                color: #181818;
+                            }
+                        }
+                        .pr-icon{
+                            flex-shrink: 0;
+                            width: 36upx;
+                            height: 36upx;
+                            border-radius: 50%;
+                            border: 2upx solid #aaaaaa;
+                            overflow: hidden;
+                            @include centerFlex(center);
+                            &.active{
+                                border-color: transparent;
+                                >image{
+                                    visibility: visible;
+                                    
+                                }
+                            }
+                            >image{
+                                visibility: hidden;
+                                display: block;
+                                border: none;
+                                width: 100%;
+                                height: 100%;
+                            }
+                        }
+                    }
+                    .pr-content{
+                        padding-top: 4upx;
+                        padding-bottom: 30upx;
+                        .pc-line{
+                            @include centerFlex(flex-start);
+                            .pl-txt{
+                                line-height: 44upx;
+                                font-size: 24upx;
+                                color: #181818;
+                                @include textHide(1);
+                            }
+                            .pl-tag{
+                                flex-shrink: 0;
+                                margin-left: 10upx;
+                                padding: 0 6upx;
+                                line-height: 28upx;
+                                font-size: 24upx;
+                                color: #FF873D;
+                                border: 1px solid #FF873D;
+                                border-radius: 4upx;
+                            }
+                        }
+                    }
+                    
+                }
+            }
+        }
+    }
+    .sc-fixed-bot{
+        position: fixed;
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        padding-top: 10upx;
+        padding-bottom: 10upx;
+        padding-bottom: calc( 10upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+        padding-bottom: calc( 10upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+        background-color: #fff;
+        .sfb-view{
+            margin: 0 auto;
+            width: 702upx;
+            height: 88upx;
+            line-height: 88upx;
+            text-align: center;
+            font-size: 32upx;
+            background-color: #FF873D;
+            color: #fff;
+            border-radius: 44upx;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/common/static/images/choose.png b/src/subpackage/common/static/images/choose.png
new file mode 100644
index 0000000..be2b30b
Binary files /dev/null and b/src/subpackage/common/static/images/choose.png differ
diff --git a/src/subpackage/common/static/images/ic_0.png b/src/subpackage/common/static/images/ic_0.png
new file mode 100644
index 0000000..2d297ad
Binary files /dev/null and b/src/subpackage/common/static/images/ic_0.png differ
diff --git a/src/subpackage/common/static/images/ic_1.png b/src/subpackage/common/static/images/ic_1.png
new file mode 100644
index 0000000..ac4640e
Binary files /dev/null and b/src/subpackage/common/static/images/ic_1.png differ
diff --git a/src/subpackage/common/static/images/ic_2.png b/src/subpackage/common/static/images/ic_2.png
new file mode 100644
index 0000000..c95d079
Binary files /dev/null and b/src/subpackage/common/static/images/ic_2.png differ
diff --git a/src/subpackage/common/static/images/ic_3.png b/src/subpackage/common/static/images/ic_3.png
new file mode 100644
index 0000000..d077fec
Binary files /dev/null and b/src/subpackage/common/static/images/ic_3.png differ
diff --git a/src/subpackage/common/static/images/ic_4.png b/src/subpackage/common/static/images/ic_4.png
new file mode 100644
index 0000000..1e5fcea
Binary files /dev/null and b/src/subpackage/common/static/images/ic_4.png differ
diff --git a/src/subpackage/retail/components/store_card_select/store_card_select.vue b/src/subpackage/retail/components/store_card_select/store_card_select.vue
index ccabf2f..1caf69c 100644
--- a/src/subpackage/retail/components/store_card_select/store_card_select.vue
+++ b/src/subpackage/retail/components/store_card_select/store_card_select.vue
@@ -31,7 +31,6 @@
 
 <script>
 	import util from '../../../../utils/util.js';
-	import tools from '../../js/tools.js';
 	import retailServer from '../../js/retail_server';
 	import retailApi from '../../js/retail_api';