ylong 8 months ago
parent
commit
511c663ad8
5 changed files with 1125 additions and 982 deletions
  1. 1 1
      .env.dev.js
  2. 2 1
      manifest.json
  3. 319 303
      pages-mine/pages/order-detail.vue
  4. 11 3
      pages.json
  5. 792 674
      pages/home/index.vue

+ 1 - 1
.env.dev.js

@@ -1,5 +1,5 @@
 export default {
     "NODE_ENV": 'development',
-    "apiUrl":"https://bk.shuhi.com",
+    "apiUrl":"https://bpi.shuhi.com",
     "apiUrlPrefix":"/api",
 };

+ 2 - 1
manifest.json

@@ -121,7 +121,8 @@
     },
     "mp-alipay" : {
         "usingComponents" : true,
-        "component2" : true
+        "component2" : true,
+        "appid" : "2021005158666596"
     },
     "mp-qq" : {
         "optimization" : {

+ 319 - 303
pages-mine/pages/order-detail.vue

@@ -1,126 +1,125 @@
 <template>
-    <view class="order-detail">
-        <!-- 时间轴组件 -->
-        <order-timeline :logVoList="orderInfo.logVoList" :trackingVoList="orderInfo.trackingVoList"></order-timeline>
+	<view class="order-detail">
+		<!-- 时间轴组件 -->
+		<order-timeline :logVoList="orderInfo.logVoList" :trackingVoList="orderInfo.trackingVoList"></order-timeline>
 
-        <!--   -->
-        <return-notice :orderInfo="orderInfo" v-if="orderInfo.restTime" @close="handleReturn"></return-notice>
-        <!-- 书籍列表组件 -->
-        <book-list :books="bookList" :totalNum="orderInfo.totalNum"></book-list>
+		<!--   -->
+		<return-notice :orderInfo="orderInfo" v-if="orderInfo.restTime" @close="handleReturn"></return-notice>
+		<!-- 书籍列表组件 -->
+		<book-list :books="bookList" :totalNum="orderInfo.totalNum"></book-list>
 
-        <!-- 收入信息区块 -->
-        <view class="info-block">
-            <view class=" flex-a flex-j-b">
-                <text class="common-title font-32">卖书收入:</text>
-                <text class="common-text" style="color: #FF0000;" v-if="orderInfo.finalMoney">¥{{
-                    orderInfo.finalMoney }}</text>
-                <text class="common-text" style="color: #FF0000;" v-else>待审核</text>
-            </view>
-            <view class="desc-bg">
-                <view class="flex-a flex-j-b">
-                    <text class="common-text-2 font-26">书籍数量:</text>
-                    <text class="common-text font-26">{{ orderInfo.totalNum }}</text>
-                </view>
-                
-                <view class="flex-a flex-j-b" v-if="orderInfo.upsellFinalMoney || orderInfo.upsellExpectMoney">
-                    <text class="common-text-2 font-26">限时加价:</text>
-                    <text class="common-text-2 font-26">¥{{ orderInfo.upsellFinalMoney || orderInfo.upsellExpectMoney }}</text>
-                </view>
-                <view class="flex-a flex-j-b">
-                    <view class="common-text-2 font-26">
-                        预估书款:
-                        <u-icon name="question-circle-fill" color="#333333" size="36" @click="showRules"></u-icon>
-                    </view>
-                    <text class="common-text-2 font-26">¥{{ orderInfo.expectMoney }}</text>
-                </view>
-            </view>
-        </view>
-        <!-- 订单信息区块 -->
-        <view class="info-block">
-            <view class=" flex-a flex-j-b">
-                <text class="common-title font-32">卖书编号:</text>
-                <view class="common-text-2 font-26 flex-a">{{ orderInfo.orderId }}
-                    <image src="../static/copy.png" style="width: 42rpx;height:42rpx;margin-left: 20rpx;"
-                        @click="copyOrderNo"></image>
-                </view>
-            </view>
-            <view class="desc-bg">
-                <view class="flex-a flex-j-b">
-                    <view class="common-text-2 font-26">快递备注:</view>
-                    <text class="common-text font-26">{{ orderInfo.expressDelivery || '-' }}</text>
-                </view>
-            </view>
-        </view>
+		<!-- 收入信息区块 -->
+		<view class="info-block">
+			<view class="flex-a flex-j-b">
+				<text class="common-title font-32">卖书收入:</text>
+				<text class="common-text" style="color: #ff0000" v-if="orderInfo.finalMoney">¥{{ orderInfo.finalMoney }}</text>
+				<text class="common-text" style="color: #ff0000" v-else>待审核</text>
+			</view>
+			<view class="desc-bg">
+				<view class="flex-a flex-j-b">
+					<text class="common-text-2 font-26">书籍数量:</text>
+					<text class="common-text font-26">{{ orderInfo.totalNum }}</text>
+				</view>
 
-        <!-- 地址信息区块 -->
-        <view class="info-block">
-            <view class=" flex-a flex-j-b">
-                <text class="common-title font-32" style="width: 220rpx;">发货地址:</text>
+				<view class="flex-a flex-j-b" v-if="orderInfo.upsellFinalMoney || orderInfo.upsellExpectMoney">
+					<text class="common-text-2 font-26">限时加价:</text>
+					<text class="common-text-2 font-26">¥{{ orderInfo.upsellFinalMoney || orderInfo.upsellExpectMoney }}</text>
+				</view>
+				<view class="flex-a flex-j-b">
+					<view class="common-text-2 font-26">
+						预估书款:
+						<u-icon name="question-circle-fill" color="#333333" size="36" @click="showRules"></u-icon>
+					</view>
+					<text class="common-text-2 font-26">¥{{ orderInfo.expectMoney }}</text>
+				</view>
+			</view>
+		</view>
+		<!-- 订单信息区块 -->
+		<view class="info-block">
+			<view class="flex-a flex-j-b">
+				<text class="common-title font-32">卖书编号:</text>
+				<view class="common-text-2 font-26 flex-a">
+					{{ orderInfo.orderId }}
+					<image src="../static/copy.png" style="width: 42rpx; height: 42rpx; margin-left: 20rpx" @click="copyOrderNo"></image>
+				</view>
+			</view>
+			<view class="desc-bg">
+				<view class="flex-a flex-j-b">
+					<view class="common-text-2 font-26">快递备注:</view>
+					<text class="common-text font-26">{{ orderInfo.expressDelivery || '-' }}</text>
+				</view>
+			</view>
+		</view>
 
-                <view class="flex-d flex-j-e flex-1">
-                    <view class="common-text-2 font-26 mb-12">
-                        <text>{{ orderInfo.sendName }}</text>
-                        <text class="ml-40">{{ orderInfo.sendMobile }}</text>
-                    </view>
-                    <text class="common-text" style="line-height: 42rpx;">
-                        {{ orderInfo.sendAddress }}
-                    </text>
-                </view>
-            </view>
-        </view>
+		<!-- 地址信息区块 -->
+		<view class="info-block">
+			<view class="flex-a flex-j-b">
+				<text class="common-title font-32" style="width: 220rpx">发货地址:</text>
 
-        <!-- 底部操作栏 -->
-        <view class="bottom-fixed-con detail-bottom flex-d">
-            <service-info :firstOrder="orderInfo.firstOrder"></service-info>
-            <view class="flex-a" style="width: 100%;padding: 0 30rpx;">
-                <u-button type="warning" @click="handleOpenOverTime" v-if="orderInfo.confirmCompensationMoney" style="margin-right: 10px;">验货超时补偿</u-button>
-                <u-button type="warning" @click="handleOpenSellLoss" v-if="orderInfo.priceCompensationMoney">卖亏必赔</u-button>
+				<view class="flex-d flex-j-e flex-1">
+					<view class="common-text-2 font-26 mb-12">
+						<text>{{ orderInfo.sendName }}</text>
+						<text class="ml-40">{{ orderInfo.sendMobile }}</text>
+					</view>
+					<text class="common-text" style="line-height: 42rpx">
+						{{ orderInfo.sendAddress }}
+					</text>
+				</view>
+			</view>
+		</view>
 
+		<!-- 底部操作栏 -->
+		<view class="bottom-fixed-con detail-bottom flex-d">
+			<service-info :firstOrder="orderInfo.firstOrder"></service-info>
+			<view class="flex-a" style="width: 100%; padding: 0 30rpx;justify-content: flex-end;align-items: center;min-height: 42px;">
+				<u-button size="small" type="warning" @click="handleOpenOverTime" v-if="orderInfo.confirmCompensationMoney" style="margin-right: 10px">验货超时补偿</u-button>
+				<u-button size="small" type="warning" @click="handleOpenSellLoss" v-if="orderInfo.priceCompensationMoney" style="margin-right: 10px">卖亏必赔</u-button>
+				<order-actions style="width:fit-content" :order="orderInfo" :status="orderInfo.status" @action="handleAction" @success="getOrderInfo"></order-actions>
+			</view>
+		</view>
 
-                <order-actions size="large" :order="orderInfo" :status="orderInfo.status" @action="handleAction"
-                    style="width: 100%;" @success="getOrderInfo"></order-actions>
-            </view>
-        </view>
+		<u-action-sheet
+			v-model="showReportSheet"
+			:list="actionList"
+			@close="showReportSheet = false"
+			@click="handleReportSelect"
+			cancelText="取消"
+			:mask-close-able="false"
+			:safe-area-inset-bottom="true"
+		/>
 
-        <u-action-sheet v-model="showReportSheet" :list="actionList" @close="showReportSheet = false"
-            @click="handleReportSelect" cancelText="取消" :mask-close-able="false" :safe-area-inset-bottom="true" />
+		<CommonDialog ref="returnDialog" title="退回不通过书籍" :showFooter="false" @confirm="handleRecycleConfirm" width="88%">
+			<view class="flex-a flex-j-b">
+				<button class="confirm-btn plain" @click="handleApplyBack">我要取回</button>
+				<button class="confirm-btn plain" @click="handleRecycleWare">仓库循环处理</button>
+			</view>
+			<view class="button-bottom" @click="handleRecycle">
+				<text style="font-size: 32rpx; font-weight: bold">按纸价回收</text>
+				<text style="margin-top: 2px">补贴 ¥{{ orderInfo.basicRecycleMoney || 0 }} 到余额</text>
+			</view>
+		</CommonDialog>
 
-        <CommonDialog ref="returnDialog" title="退回不通过书籍" :showFooter="false" @confirm="handleRecycleConfirm" width="88%">
-            <view class="flex-a flex-j-b">
-                <button class="confirm-btn plain" @click="handleApplyBack">我要取回</button>
-                <button class="confirm-btn plain" @click="handleRecycleWare">仓库循环处理</button>
-            </view>
-            <view class="button-bottom" @click="handleRecycle">
-                <text style="font-size: 32rpx;font-weight: bold;">按纸价回收</text>
-                <text style="margin-top: 2px;">补贴 ¥{{ orderInfo.basicRecycleMoney || 0 }} 到余额</text>
-            </view>
-        </CommonDialog>
+		<CommonDialog ref="recycleDialog" title="是否按纸价回收" @confirm="handleRecycleConfirm">补贴 ¥{{ orderInfo.basicRecycleMoney || 0 }} 到余额</CommonDialog>
+		<CommonDialog ref="recycleWare" title="是否仓库循环处理" @confirm="handleRecycleWareConfirm">感谢您对环保事业的支持,仓库将循环处理</CommonDialog>
 
-        <CommonDialog ref="recycleDialog" title="是否按纸价回收" @confirm="handleRecycleConfirm">
-            补贴 ¥{{ orderInfo.basicRecycleMoney || 0 }} 到余额
-        </CommonDialog>
-        <CommonDialog ref="recycleWare" title="是否仓库循环处理" @confirm="handleRecycleWareConfirm">
-            感谢您对环保事业的支持,仓库将循环处理
-        </CommonDialog>
-
-        <CommonDialog ref="overTimeDialog" title="验货超时补偿" @confirm="handleOverTimeConfirm" :showFooter="false">
-            <view class="flex-a flex-j-b" style="padding:40rpx 0;">
-                <u-button class="confirm-btn" type="success" @click="handleOverTimeConfirm">补贴 ¥{{ orderInfo.confirmCompensationMoney || 0 }} 到余额</u-button>
-                <u-button class="confirm-btn" type="warning" @click="handleCloseOverTime">原谅你了</u-button>
-            </view>
-        </CommonDialog>
-        <CommonDialog ref="sellLossDialog" title="卖亏必赔" @confirm="handleSellLossConfirm" :showFooter="false">
-            <view class="flex-a flex-j-b" style="padding:40rpx 0;">
-                <u-button class="confirm-btn" type="success" @click="handleSellLossConfirm">补贴 ¥{{ orderInfo.priceCompensationMoney || 0 }} 到余额</u-button>
-                <u-button class="confirm-btn" type="warning" @click="handleCloseSellLoss">原谅你了</u-button>
-            </view>
-        </CommonDialog>
-    </view>
+		<CommonDialog ref="overTimeDialog" title="验货超时补偿" @confirm="handleOverTimeConfirm" :showFooter="false">
+			<view class="flex-a flex-j-b" style="padding: 40rpx 0">
+				<u-button class="confirm-btn" type="success" @click="handleOverTimeConfirm">补贴 ¥{{ orderInfo.confirmCompensationMoney || 0 }} 到余额</u-button>
+				<u-button class="confirm-btn" type="warning" @click="handleCloseOverTime">原谅你了</u-button>
+			</view>
+		</CommonDialog>
+		<CommonDialog ref="sellLossDialog" title="卖亏必赔" @confirm="handleSellLossConfirm" :showFooter="false">
+			<view class="flex-a flex-j-b" style="padding: 40rpx 0">
+				<u-button class="confirm-btn" type="success" @click="handleSellLossConfirm">补贴 ¥{{ orderInfo.priceCompensationMoney || 0 }} 到余额</u-button>
+				<u-button class="confirm-btn" type="warning" @click="handleCloseSellLoss">原谅你了</u-button>
+			</view>
+		</CommonDialog>
+	</view>
 </template>
 
 <script>
-import OrderTimeline from '../components/order-timeline.vue'
-import BookList from '../components/book-list.vue'
+import OrderTimeline from '../components/order-timeline.vue';
+import BookList from '../components/book-list.vue';
 import ReturnNotice from '../components/return-notice.vue';
 import ServiceInfo from '@/pages/home/components/ServiceInfo.vue';
 import btnAction from '../mixin/btnAction';
@@ -128,210 +127,227 @@ import OrderActions from '../components/order-actions.vue';
 import CommonDialog from '@/components/common-dialog.vue';
 
 export default {
-    mixins: [btnAction],
-    components: {
-        OrderTimeline,
-        BookList,
-        ReturnNotice,
-        ServiceInfo,
-        OrderActions,
-        CommonDialog
-    },
-    data() {
-        return {
-            bookList: [],
-            // 订单信息
-            orderInfo: {},
-            orderId: ''
-        }
-    },
-    onLoad(options) {
-        if (options.orderId) {
-            this.orderId = options.orderId
-            this.getOrderInfo(options.orderId)
-        }
-    },
-    methods: {
-        copyOrderNo() {
-            uni.setClipboardData({
-                data: this.orderInfo.orderId.toString(),
-                success: () => {
-                    uni.$u.toast('复制成功')
-                },
-                fail: (error) => {
-                    console.log(error, "error");
-                    uni.$u.toast('复制失败')
-                }
-            })
-        },
-        successFeedback() {
-            this.getOrderInfo()
-        },
-        showRules() {
-            uni.navigateTo({
-                url: '/pages-mine/pages/rules-for-sellbooks'
-            })
-        },
+	mixins: [btnAction],
+	components: {
+		OrderTimeline,
+		BookList,
+		ReturnNotice,
+		ServiceInfo,
+		OrderActions,
+		CommonDialog
+	},
+	data() {
+		return {
+			bookList: [],
+			// 订单信息
+			orderInfo: {},
+			orderId: ''
+		};
+	},
+	onLoad(options) {
+		if (options.orderId) {
+			this.orderId = options.orderId;
+			this.getOrderInfo(options.orderId);
+		}
+	},
+	methods: {
+		copyOrderNo() {
+			uni.setClipboardData({
+				data: this.orderInfo.orderId.toString(),
+				success: () => {
+					uni.$u.toast('复制成功');
+				},
+				fail: (error) => {
+					console.log(error, 'error');
+					uni.$u.toast('复制失败');
+				}
+			});
+		},
+		successFeedback() {
+			this.getOrderInfo();
+		},
+		showRules() {
+			uni.navigateTo({
+				url: '/pages-mine/pages/rules-for-sellbooks'
+			});
+		},
 
-        //获取订单信息
-        getOrderInfo() {
-            uni.$u.http.get('/token/order/getOrderDetail?orderId=' + this.orderId).then(res => {
-                if (res.code === 200) {
-                    this.orderInfo = res.data
-                    this.bookList = res.data.detailVoList
-                }
-            })
-        },
-        handleReturn() {
-            console.log('退回不通过书籍');
-            this.$refs.returnDialog?.openPopup()
-        },
-        //仓库循环处理
-        handleRecycleWare() {
-            this.closeDialog()
-            this.$refs.recycleWare?.openPopup()
-        },
-        //仓库循环处理确认
-        handleRecycleWareConfirm() {
-            console.log('仓库循环处理确认');
-            uni.$u.http.post('/token/order/notNeed', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.recycleDialog?.closePopup()
-                    uni.$u.toast(`已补贴 ${this.orderInfo.basicRecycleMoney || 0} 到余额`)
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        },
-        //纸价回收
-        handleRecycle() {
-            this.closeDialog()
-            this.$refs.recycleDialog?.openPopup()
-        },
-        //纸价回收确认
-        handleRecycleConfirm() {
-            uni.$u.http.post('/token/order/basicRecycle', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.recycleDialog?.closePopup()
-                    uni.$u.toast('纸价回收成功')
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        },
-        closeDialog() {
-            this.$refs.returnDialog?.closePopup()
-        },
-        //我要取回
-        handleApplyBack() {
-            console.log(this.orderInfo, 'xxxxx')
-            uni.navigateTo({
-                url: `/pages-mine/pages/apply?orderId=${this.orderInfo.orderId}`
-            })
-            this.closeDialog()
-        },
+		//获取订单信息
+		getOrderInfo() {
+			uni.$u.http.get('/token/order/getOrderDetail?orderId=' + this.orderId).then((res) => {
+				if (res.code === 200) {
+					this.orderInfo = res.data;
+					this.bookList = res.data.detailVoList;
+				}
+			});
+		},
+		handleReturn() {
+			console.log('退回不通过书籍');
+			this.$refs.returnDialog?.openPopup();
+		},
+		//仓库循环处理
+		handleRecycleWare() {
+			this.closeDialog();
+			this.$refs.recycleWare?.openPopup();
+		},
+		//仓库循环处理确认
+		handleRecycleWareConfirm() {
+			console.log('仓库循环处理确认');
+			uni.$u.http
+				.post('/token/order/notNeed', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.recycleDialog?.closePopup();
+						uni.$u.toast(`已补贴 ${this.orderInfo.basicRecycleMoney || 0} 到余额`);
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		},
+		//纸价回收
+		handleRecycle() {
+			this.closeDialog();
+			this.$refs.recycleDialog?.openPopup();
+		},
+		//纸价回收确认
+		handleRecycleConfirm() {
+			uni.$u.http
+				.post('/token/order/basicRecycle', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.recycleDialog?.closePopup();
+						uni.$u.toast('纸价回收成功');
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		},
+		closeDialog() {
+			this.$refs.returnDialog?.closePopup();
+		},
+		//我要取回
+		handleApplyBack() {
+			console.log(this.orderInfo, 'xxxxx');
+			uni.navigateTo({
+				url: `/pages-mine/pages/apply?orderId=${this.orderInfo.orderId}`
+			});
+			this.closeDialog();
+		},
 
-        //验货超时补偿
-        handleOpenOverTime() {
-            this.$refs.overTimeDialog?.openPopup()
-        },
-        //卖亏必赔
-        handleOpenSellLoss() {
-            this.$refs.sellLossDialog?.openPopup()
-        },
-        //验货超时补偿确认
-        handleOverTimeConfirm() {
-            uni.$u.http.post('/token/order/confirmCompensation/submit', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.overTimeDialog?.closePopup()
-                    uni.$u.toast('验货超时补偿申请成功')
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        },
-        //验货超时补偿取消
-        handleCloseOverTime() {
-            uni.$u.http.post('/token/order/confirmCompensation/abandon', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.overTimeDialog?.closePopup()
-                    uni.$u.toast('操作成功')
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        },
-        //卖亏必赔确认
-        handleSellLossConfirm() {
-            uni.$u.http.post('/token/order/priceCompensation/submit', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.sellLossDialog?.closePopup()
-                    uni.$u.toast('卖亏必赔申请成功')
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        },
-        //卖亏必赔取消
-        handleCloseSellLoss() {
-            uni.$u.http.post('/token/order/priceCompensation/abandon', {
-                orderId: this.orderInfo.orderId
-            }).then(res => {
-                if (res.code === 200) {
-                    this.$refs.sellLossDialog?.closePopup()
-                    uni.$u.toast('操作成功')
-                    this.getOrderInfo(this.orderInfo.orderId)
-                }
-            })
-        }
-    }
-}
+		//验货超时补偿
+		handleOpenOverTime() {
+			this.$refs.overTimeDialog?.openPopup();
+		},
+		//卖亏必赔
+		handleOpenSellLoss() {
+			this.$refs.sellLossDialog?.openPopup();
+		},
+		//验货超时补偿确认
+		handleOverTimeConfirm() {
+			uni.$u.http
+				.post('/token/order/confirmCompensation/submit', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.overTimeDialog?.closePopup();
+						uni.$u.toast('验货超时补偿申请成功');
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		},
+		//验货超时补偿取消
+		handleCloseOverTime() {
+			uni.$u.http
+				.post('/token/order/confirmCompensation/abandon', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.overTimeDialog?.closePopup();
+						uni.$u.toast('操作成功');
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		},
+		//卖亏必赔确认
+		handleSellLossConfirm() {
+			uni.$u.http
+				.post('/token/order/priceCompensation/submit', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.sellLossDialog?.closePopup();
+						uni.$u.toast('卖亏必赔申请成功');
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		},
+		//卖亏必赔取消
+		handleCloseSellLoss() {
+			uni.$u.http
+				.post('/token/order/priceCompensation/abandon', {
+					orderId: this.orderInfo.orderId
+				})
+				.then((res) => {
+					if (res.code === 200) {
+						this.$refs.sellLossDialog?.closePopup();
+						uni.$u.toast('操作成功');
+						this.getOrderInfo(this.orderInfo.orderId);
+					}
+				});
+		}
+	}
+};
 </script>
 
 <style lang="scss" scoped>
 .order-detail {
-    min-height: 100vh;
-    background: #f8f8f8;
-    padding-bottom: 230rpx;
+	min-height: 100vh;
+	background: #f8f8f8;
+	padding-bottom: 230rpx;
 
-    .desc-bg {
-        background: #fafafa;
-        padding: 20rpx 30rpx;
-        border-radius: 10rpx;
-        margin-top: 20rpx;
-    }
+	.desc-bg {
+		background: #fafafa;
+		padding: 20rpx 30rpx;
+		border-radius: 10rpx;
+		margin-top: 20rpx;
+	}
 
-    .info-block {
-        background: #FFFFFF;
-        padding: 30rpx;
-        margin: 30rpx;
-        border-radius: 10rpx;
-    }
+	.info-block {
+		background: #ffffff;
+		padding: 30rpx;
+		margin: 30rpx;
+		border-radius: 10rpx;
+	}
 
-    .detail-bottom {
-        flex-direction: column;
-        padding-left: 0;
-        padding-right: 0;
-        padding-top: 0;
-    }
+	.detail-bottom {
+		flex-direction: column;
+		padding-left: 0;
+		padding-right: 0;
+		padding-top: 0;
+	}
 }
 
 .button-bottom {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    margin: 30rpx 0;
-    background-color: #38C148;
-    color: #ffffff;
-    font-size: 24rpx;
-    line-height: 32rpx;
-    padding: 16rpx 0;
-    border-radius: 10rpx;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	margin: 30rpx 0;
+	background-color: #38c148;
+	color: #ffffff;
+	font-size: 24rpx;
+	line-height: 32rpx;
+	padding: 16rpx 0;
+	border-radius: 10rpx;
+}
+
+:deep(.btn-bottom) {
+	height: 60rpx !important;
+	line-height: 60rpx !important;
 }
-</style>
+</style>

+ 11 - 3
pages.json

@@ -6,8 +6,12 @@
         {
             "path": "pages/home/index",
             "style": {
-                "navigationBarTitleText": "书嗨",
-                "navigationStyle": "custom"
+                "navigationBarTitleText": "",
+                "navigationStyle": "custom",
+                "mp-alipay": {
+                    "transparentTitle": "always",
+                    "titlePenetrate": "YES"
+                }
             }
         },
         {
@@ -16,7 +20,11 @@
                 "navigationBarTitleText": "我的",
                 "navigationBarBackgroundColor": "#38C148",
                 "navigationBarTextStyle": "white",
-                "navigationStyle": "custom"
+                "navigationStyle": "custom",
+                "mp-alipay": {
+                    "transparentTitle": "always",
+                    "titlePenetrate": "YES"
+                }
             }
         },
         {

+ 792 - 674
pages/home/index.vue

@@ -1,702 +1,820 @@
 <template>
-	<view class="container" :style="{ background: containerBg }" :class="bookList.length ? 'book-list' : 'no-list'">
-		<u-navbar :is-back="false" :border-bottom="false" :background="{ background: navbarBackground }">
-			<text class="nav-title">卖书给书嗨</text>
-		</u-navbar>
-
-		<not-scanned v-if="!bookList.length"></not-scanned>
-		<scan-book-list
-			v-else
-			@updateBooks="updateBooksList"
-			@deleted="handleDeleteBook"
-			:bookList="bookList"
-			ref="scanBookList"
-			@upsell="handleUpsell"
-			@refresh="getLastOrder"
-		></scan-book-list>
-		<!-- 底部固定按钮 -->
-		<view class="bottom-fixed">
-			<view class="btn-wrap mb-20">
-				<button class="scan-btn flex-1" @click="handleScan">
-					<u-icon name="scan" color="#FFFFFF" size="40"></u-icon>
-					<text>扫码卖书</text>
-				</button>
-				<button class="isbn-btn flex-1" @click="goToInputISBN">
-					<u-icon name="edit-pen" color="#4CD964" size="40"></u-icon>
-					<text>输入ISBN</text>
-				</button>
-			</view>
-
-			<view class="flex-a flex-j-b pad-20" style="padding-top: 0" v-if="bookList.length">
-				<view class="left-info" style="min-width: 194px">
-					<view class="flex-a common-text">
-						共
-						<text class="color-red">{{ orderInfo.totalNum }}</text>
-						件 预估回收价
-						<text class="color-red">¥{{ orderInfo.totalRecycleMoney || 0 }}</text>
-					</view>
-					<text class="common-text tip">*旧书预估价格满 {{ orderInfo.minOrderMoney }} 元起收</text>
-				</view>
-
-				<button class="scan-btn next-btn" @click="handleValidate" :disabled="isDisabled">下一步</button>
-			</view>
-
-			<service-info v-if="bookList.length" :serviceList="serviceList" :firstOrder="orderInfo.firstOrder"></service-info>
-		</view>
-
-		<InputIsbn ref="isbnPopup" @submit="(isbn) => checkBookISBN(isbn, 'input')" />
-		<!-- 套装书说明弹窗 -->
-		<CommonDialog ref="setBookDialog" title="套装书说明" :showCancel="false" @confirm="handleSetBookConfirm">
-			<text>套装书(ISBN码相同的系列书箱)只需扫描其中一册,扫码价即套装价。打包时请把所有单册统在一起或放在一个袋子里寄出。</text>
-		</CommonDialog>
-
-		<!-- 暂不回收弹窗 -->
-		<CommonDialog ref="notAcceptDialog" title="暂不回收" :showCancel="false">
-			<text>这本书暂时不回收,请您过段时间再来试试~</text>
-		</CommonDialog>
-
-		<!-- 暂无信息弹窗 -->
-		<CommonDialog ref="noInfoDialog" title="暂无信息" :showCancel="false">
-			<text>抱歉,没有该书的信息,书嗨会定期补充图书信息,请您过段时间再来试试~</text>
-		</CommonDialog>
-
-		<!-- 扫累了弹窗 -->
-		<CommonDialog ref="tiredDialog" title="温馨提示" :showCancel="false">
-			<text>扫累了,休息休息吧~</text>
-		</CommonDialog>
-
-		<!-- 该书超出最大回收本数  maxAcceptDialog-->
-		<CommonDialog ref="maxAcceptDialog" title="温馨提示" :showCancel="false">
-			<text>该书超出最大回收本数</text>
-		</CommonDialog>
-
-		<!-- 单个订单最多40本书  orderMaxNumDialog-->
-		<CommonDialog ref="orderMaxNumDialog" title="温馨提示" :showCancel="false">
-			<text>单个订单最多40本书</text>
-		</CommonDialog>
-
-		<!-- 删除活动书籍弹窗 -->
-		<common-dialog ref="deleteDialog" title="温馨提示" @confirm="confirmDelete">
-			<text>{{ deleteBook.upsellMoney ? '此书为限时加价收图书,删除后再次添加将失去加价收资格,确定删除吗?' : '确定删除这本图书吗?' }}</text>
-		</common-dialog>
-
-		<!-- 此订单还有未加价的图书,提交订单后将失去加价资格,确定提交吗? -->
-		<common-dialog ref="noUpsellDialog" title="温馨提示" @confirm="onNext">
-			<text>此订单还有未加价的图书,提交订单后将失去加价资格,确定提交吗?</text>
-		</common-dialog>
-
-		<!-- 温馨提示弹窗 -->
-		<KindReminder ref="kindReminder" @start="handleStartSelling" @viewRules="handleViewRules" />
-
-		<view
-			class="customer-service"
-			:style="{
-				left: servicePosition.left + 'px',
-				right: servicePosition.right + 'px',
-				bottom: servicePosition.bottom + 'px'
-			}"
-			@touchstart="touchStart"
-			@touchmove="touchMove"
-			@touchend="touchEnd"
-		>
-			<button class="service-btn" open-type="contact">
-				<image src="/static/img/kf.png" mode="widthFix" style="width: 126rpx; height: 140rpx"></image>
-			</button>
-		</view>
-
-		<ConfirmBooks ref="confirmBooks" @incomplete="handleIncomplete" />
-		<!-- 首单免费弹窗 -->
-		<FirstOrderFreePopup ref="firstOrderFreePopup" />
-
-		<!-- 图书加价弹窗 -->
-		<UpsellBook ref="upsellRef" @scan="handleScanCode" />
-
-		<!-- 加价分享弹窗 -->
-		<UpsellShare ref="shareRef" @viewRules="handleViewSellRules" />
-		<!-- 加价二维码弹窗 -->
-		<UpsellQrcode ref="upsellQrcodeRef" />
-
-		<!-- 加价规则弹窗 -->
-		<UpsellRules ref="upsellRulesRef" />
-	</view>
+    <view
+        class="container"
+        :style="{ background: containerBg }"
+        :class="bookList.length ? 'book-list' : 'no-list'"
+    >
+        <u-navbar
+            :is-back="false"
+            :border-bottom="false"
+            :background="{ background: navbarBackground }"
+        >
+            <text class="nav-title">卖书给书嗨</text>
+        </u-navbar>
+
+        <not-scanned v-if="!bookList.length"></not-scanned>
+        <scan-book-list
+            v-else
+            @updateBooks="updateBooksList"
+            @deleted="handleDeleteBook"
+            :bookList="bookList"
+            ref="scanBookList"
+            @upsell="handleUpsell"
+            @refresh="getLastOrder"
+        ></scan-book-list>
+        <!-- 底部固定按钮 -->
+        <view class="bottom-fixed">
+            <view class="btn-wrap mb-20">
+                <button class="scan-btn flex-1" @click="handleScan">
+                    <u-icon name="scan" color="#FFFFFF" size="40"></u-icon>
+                    <text>扫码卖书</text>
+                </button>
+                <button class="isbn-btn flex-1" @click="goToInputISBN">
+                    <u-icon name="edit-pen" color="#4CD964" size="40"></u-icon>
+                    <text>输入ISBN</text>
+                </button>
+            </view>
+
+            <view
+                class="flex-a flex-j-b pad-20"
+                style="padding-top: 0"
+                v-if="bookList.length"
+            >
+                <view class="left-info" style="min-width: 194px">
+                    <view class="flex-a common-text">
+                        共
+                        <text class="color-red">{{ orderInfo.totalNum }}</text>
+                        件 预估回收价
+                        <text class="color-red"
+                            >¥{{ orderInfo.totalRecycleMoney || 0 }}</text
+                        >
+                    </view>
+                    <text class="common-text tip"
+                        >*旧书预估价格满
+                        {{ orderInfo.minOrderMoney }} 元起收</text
+                    >
+                </view>
+
+                <button
+                    class="scan-btn next-btn"
+                    @click="handleValidate"
+                    :disabled="isDisabled"
+                >
+                    下一步
+                </button>
+            </view>
+
+            <service-info
+                v-if="bookList.length"
+                :serviceList="serviceList"
+                :firstOrder="orderInfo.firstOrder"
+            ></service-info>
+        </view>
+
+        <InputIsbn
+            ref="isbnPopup"
+            @submit="(isbn) => checkBookISBN(isbn, 'input')"
+        />
+        <!-- 套装书说明弹窗 -->
+        <CommonDialog
+            ref="setBookDialog"
+            title="套装书说明"
+            :showCancel="false"
+            @confirm="handleSetBookConfirm"
+        >
+            <text
+                >套装书(ISBN码相同的系列书箱)只需扫描其中一册,扫码价即套装价。打包时请把所有单册统在一起或放在一个袋子里寄出。</text
+            >
+        </CommonDialog>
+
+        <!-- 暂不回收弹窗 -->
+        <CommonDialog
+            ref="notAcceptDialog"
+            title="暂不回收"
+            :showCancel="false"
+        >
+            <text>这本书暂时不回收,请您过段时间再来试试~</text>
+        </CommonDialog>
+
+        <!-- 暂无信息弹窗 -->
+        <CommonDialog ref="noInfoDialog" title="暂无信息" :showCancel="false">
+            <text
+                >抱歉,没有该书的信息,书嗨会定期补充图书信息,请您过段时间再来试试~</text
+            >
+        </CommonDialog>
+
+        <!-- 扫累了弹窗 -->
+        <CommonDialog ref="tiredDialog" title="温馨提示" :showCancel="false">
+            <text>扫累了,休息休息吧~</text>
+        </CommonDialog>
+
+        <!-- 该书超出最大回收本数  maxAcceptDialog-->
+        <CommonDialog
+            ref="maxAcceptDialog"
+            title="温馨提示"
+            :showCancel="false"
+        >
+            <text>该书超出最大回收本数</text>
+        </CommonDialog>
+
+        <!-- 单个订单最多40本书  orderMaxNumDialog-->
+        <CommonDialog
+            ref="orderMaxNumDialog"
+            title="温馨提示"
+            :showCancel="false"
+        >
+            <text>单个订单最多40本书</text>
+        </CommonDialog>
+
+        <!-- 删除活动书籍弹窗 -->
+        <common-dialog
+            ref="deleteDialog"
+            title="温馨提示"
+            @confirm="confirmDelete"
+        >
+            <text>{{
+                deleteBook.upsellMoney
+                    ? "此书为限时加价收图书,删除后再次添加将失去加价收资格,确定删除吗?"
+                    : "确定删除这本图书吗?"
+            }}</text>
+        </common-dialog>
+
+        <!-- 此订单还有未加价的图书,提交订单后将失去加价资格,确定提交吗? -->
+        <common-dialog ref="noUpsellDialog" title="温馨提示" @confirm="onNext">
+            <text
+                >此订单还有未加价的图书,提交订单后将失去加价资格,确定提交吗?</text
+            >
+        </common-dialog>
+
+        <!-- 温馨提示弹窗 -->
+        <KindReminder
+            ref="kindReminder"
+            @start="handleStartSelling"
+            @viewRules="handleViewRules"
+        />
+
+        <view
+            class="customer-service"
+            :style="{
+                left: servicePosition.left + 'px',
+                right: servicePosition.right + 'px',
+                bottom: servicePosition.bottom + 'px',
+            }"
+            @touchstart="touchStart"
+            @touchmove="touchMove"
+            @touchend="touchEnd"
+        >
+            <button class="service-btn" open-type="contact">
+                <image
+                    src="/static/img/kf.png"
+                    mode="widthFix"
+                    style="width: 126rpx; height: 140rpx"
+                ></image>
+            </button>
+        </view>
+
+        <ConfirmBooks ref="confirmBooks" @incomplete="handleIncomplete" />
+        <!-- 首单免费弹窗 -->
+        <FirstOrderFreePopup ref="firstOrderFreePopup" />
+
+        <!-- 图书加价弹窗 -->
+        <UpsellBook ref="upsellRef" @scan="handleScanCode" />
+
+        <!-- 加价分享弹窗 -->
+        <UpsellShare ref="shareRef" @viewRules="handleViewSellRules" />
+        <!-- 加价二维码弹窗 -->
+        <UpsellQrcode ref="upsellQrcodeRef" />
+
+        <!-- 加价规则弹窗 -->
+        <UpsellRules ref="upsellRulesRef" />
+    </view>
 </template>
 
 <script>
-import notScanned from './components/notScanned.vue';
-import InputIsbn from './components/InputIsbn.vue';
-import ScanBookList from './components/ScanBookList.vue';
-import CommonDialog from '@/components/common-dialog.vue';
-import KindReminder from './components/KindReminder.vue';
-import ServiceInfo from './components/ServiceInfo.vue';
-import ConfirmBooks from './components/ConfirmBooks.vue';
-import FirstOrderFreePopup from './components/FirstOrderFreePopup.vue';
-import UpsellBook from './components/upsell-book.vue';
-import UpsellRules from './components/upsell-rules.vue';
-import UpsellShare from './components/upsell-share.vue';
-import UpsellQrcode from './components/upsell-qrcode.vue';
-import { silentLogin } from '@/api/auth';
+import notScanned from "./components/notScanned.vue";
+import InputIsbn from "./components/InputIsbn.vue";
+import ScanBookList from "./components/ScanBookList.vue";
+import CommonDialog from "@/components/common-dialog.vue";
+import KindReminder from "./components/KindReminder.vue";
+import ServiceInfo from "./components/ServiceInfo.vue";
+import ConfirmBooks from "./components/ConfirmBooks.vue";
+import FirstOrderFreePopup from "./components/FirstOrderFreePopup.vue";
+import UpsellBook from "./components/upsell-book.vue";
+import UpsellRules from "./components/upsell-rules.vue";
+import UpsellShare from "./components/upsell-share.vue";
+import UpsellQrcode from "./components/upsell-qrcode.vue";
+import { silentLogin } from "@/api/auth";
 const app = getApp();
 
 export default {
-	components: {
-		notScanned,
-		InputIsbn,
-		ScanBookList,
-		CommonDialog,
-		KindReminder,
-		ServiceInfo,
-		ConfirmBooks,
-		FirstOrderFreePopup,
-		UpsellBook,
-		UpsellRules,
-		UpsellShare,
-		UpsellQrcode
-	},
-	data() {
-		return {
-			orderInfo: {},
-			collapseState: {
-				step1: false,
-				step3: false
-			},
-			scrollTop: 0,
-			bookList: [],
-			serviceList: [],
-			currentBook: {},
-			// 客服按钮位置
-			servicePosition: {
-				left: 'auto',
-				right: 0,
-				bottom: '20%'
-			},
-			// 触摸开始位置
-			startX: 0,
-			startY: 0,
-			// 屏幕宽度和高度
-			screenWidth: 0,
-			screenHeight: 0,
-			// 初始位置记录,用于计算拖动
-			initialLeft: 0,
-			initialBottom: 0,
-			// 是否正在更新位置,用于防止频繁更新
-			isUpdatingPosition: false,
-			shareData: {},
-			deleteBook: {}
-		};
-	},
-	computed: {
-		navbarBackground() {
-			if (this.scrollTop > 0) {
-				return 'linear-gradient(180deg, #4CD964 0%, #5ff178 100%)';
-			}
-			return 'transparent';
-		},
-		containerBg() {
-			return this.bookList.length > 0 ? 'linear-gradient(180deg, #4CD964 0%, #F8F8F8 25%)' : 'linear-gradient(180deg, #4CD964 0%, #ffffff 25%)';
-		},
-		containerPb() {
-			return this.bookList.length > 0 ? '300rpx' : '110rpx';
-		},
-		totalBooks() {
-			return this.bookList.reduce((sum, book) => sum + (book.num || 1), 0);
-		},
-		totalPrice() {
-			return this.bookList.reduce((sum, book) => sum + book.recyclePrice * (book.num || 1) + book.currUpsellMoney || 0, 0).toFixed(2);
-		},
-		isDisabled() {
-			return this.totalPrice < this.orderInfo.minOrderMoney;
-		}
-	},
-	onPageScroll(e) {
-		this.$nextTick(() => {
-			this.scrollTop = e.scrollTop;
-		});
-	},
-	// 分享配置
-	onShareAppMessage() {
-		let upsellCode = uni.getStorageSync('upsellCodeShare');
-		console.log(upsellCode, '分享');
-		// 调用分享接口
-		uni.$u.http.get('/token/order/goToShare?upsellCode=' + upsellCode);
-		return {
-			title: '书嗨',
-			path: '/pages/home/index?upsellCode=' + upsellCode,
-			imageUrl: 'https://shuhi.oss-cn-qingdao.aliyuncs.com/mini/share.jpg'
-		};
-	},
-
-	// 分享到朋友圈
-	onShareTimeline() {
-		let upsellCode = uni.getStorageSync('upsellCodeShare');
-		// 调用分享接口
-		uni.$u.http.get('/token/order/goToShare?upsellCode=' + upsellCode);
-		return {
-			title: '书嗨',
-			path: '/pages/home/index?upsellCode=' + upsellCode,
-			imageUrl: 'https://shuhi.oss-cn-qingdao.aliyuncs.com/mini/share.jpg'
-		};
-	},
-	onReady() {
-		// 获取屏幕宽度和高度
-		uni.getSystemInfo({
-			success: (res) => {
-				this.screenWidth = res.windowWidth;
-				this.screenHeight = res.windowHeight;
-			}
-		});
-		setTimeout(() => {
-			let loginSuccess = uni.getStorageSync('loginSuccess');
-			let upsellCode = app.globalData.upsellCode;
-
-			if (loginSuccess && upsellCode) {
-				console.log(loginSuccess, '登录成功loginSuccess');
-				this.$refs.shareRef?.open(upsellCode);
-				uni.removeStorageSync('loginSuccess');
-				this.getLastOrder();
-			}
-		}, 1000);
-	},
-
-	methods: {
-		//删除书籍
-		handleDeleteBook(book) {
-			this.deleteBook = book;
-			this.$refs.deleteDialog.openPopup(book);
-		},
-
-		confirmDelete() {
-			uni.$u.http
-				.post('/token/order/removeBook', {
-					orderId: this.deleteBook.orderId,
-					isbn: this.deleteBook.isbn
-				})
-				.then((res) => {
-					if (res.code == 200) {
-						this.$u.toast('删除成功');
-						this.getLastOrder();
-					}
-				});
-		},
-
-		//扫码助力
-		handleScanCode(data = {}) {
-			this.$refs.upsellQrcodeRef.open(data);
-		},
-
-		slientLogin() {
-			let inviteCode = uni.getStorageSync('inviteCode') || '';
-			let token = uni.getStorageSync('token');
-			if (token) return;
-			uni.login({
-				success(res) {
-					uni.$u.http
-						.post('/user/wxLogin', {
-							code: res.code,
-							inviteCode
-						})
-						.then((response) => {
-							if (response.code == 200) {
-								uni.setStorageSync('token', response.data.token);
-							}
-						});
-				},
-				fail: (err) => {
-					console.log(err, 'wx.login登录失败');
-				}
-			});
-		},
-
-		//查看活动规则
-		handleViewSellRules() {
-			this.$refs.upsellRulesRef.open();
-		},
-
-		// 触摸开始
-		touchStart(e) {
-			const touch = e.touches[0];
-			this.startX = touch.clientX;
-			this.startY = touch.clientY;
-
-			// 记录初始位置,用于计算移动距离
-			if (this.servicePosition.right !== 'auto') {
-				// 如果是靠右定位,记录当前位置但不立即改变显示位置
-				// 只在内部计算中使用,避免视觉上的位置跳动
-				this.initialLeft = this.screenWidth - 126;
-			} else {
-				this.initialLeft = parseFloat(this.servicePosition.left);
-			}
-
-			// 如果bottom是百分比,转换为具体像素值,但不改变显示位置
-			if (typeof this.servicePosition.bottom === 'string' && this.servicePosition.bottom.includes('%')) {
-				const percentage = parseFloat(this.servicePosition.bottom) / 100;
-				this.initialBottom = this.screenHeight * percentage;
-			} else {
-				this.initialBottom = parseFloat(this.servicePosition.bottom);
-			}
-		},
-
-		// 触摸移动
-		touchMove(e) {
-			// 阻止默认行为,防止页面滚动
-			e.preventDefault && e.preventDefault();
-			e.stopPropagation && e.stopPropagation();
-
-			const touch = e.touches[0];
-
-			// 计算移动距离
-			const deltaX = touch.clientX - this.startX;
-			const deltaY = touch.clientY - this.startY;
-
-			// 使用初始位置计算新位置,避免累积误差
-			let newLeft = this.initialLeft + deltaX;
-			let newBottom = this.initialBottom - deltaY; // 注意:y轴方向是相反的
-
-			// 确保按钮不超出屏幕边界
-			if (newLeft < 0) {
-				newLeft = 0;
-			} else if (newLeft > this.screenWidth - 126) {
-				newLeft = this.screenWidth - 126;
-			}
-
-			// 确保按钮不超出屏幕垂直边界
-			if (newBottom < 20) {
-				newBottom = 20;
-			} else if (newBottom > this.screenHeight - 160) {
-				newBottom = this.screenHeight - 160;
-			}
-
-			// 使用节流方式更新位置,避免过于频繁的更新
-			if (!this.isUpdatingPosition) {
-				this.isUpdatingPosition = true;
-
-				// 更新位置 - 第一次移动时才真正改变right为auto
-				this.servicePosition = {
-					left: newLeft,
-					right: 'auto',
-					bottom: newBottom
-				};
-
-				// 使用setTimeout代替requestAnimationFrame,在微信小程序中更兼容
-				setTimeout(() => {
-					this.isUpdatingPosition = false;
-				}, 16); // 约等于60fps的刷新率
-			}
-
-			// 不更新起始点,保持相对于初始触摸点的位移计算
-			// 这样可以避免累积误差,使拖动更精确
-		},
-
-		// 触摸结束,实现吸附效果
-		touchEnd() {
-			// 确保不再有待处理的更新
-			this.isUpdatingPosition = false;
-
-			const buttonCenter = this.servicePosition.left + 63; // 按钮中心位置
-			const halfScreen = this.screenWidth / 2;
-
-			// 判断是吸附到左边还是右边
-			if (buttonCenter < halfScreen) {
-				// 吸附到左边
-				this.servicePosition = {
-					left: 0,
-					right: 'auto',
-					bottom: this.servicePosition.bottom
-				};
-			} else {
-				// 吸附到右边
-				this.servicePosition = {
-					left: 'auto',
-					right: 0,
-					bottom: this.servicePosition.bottom
-				};
-			}
-		},
-
-		handleStart() {
-			this.showPopup = true;
-		},
-		//套装书确认
-		handleSetBookConfirm() {
-			this.$refs.confirmBooks.openPopup(this.currentBook);
-		},
-		//书册补全
-		handleIncomplete() {
-			this.$refs.scanBookList.handleDeleteBook(this.currentBook);
-		},
-
-		handleValidate() {
-			if (this.bookList.some((v) => v.canInvite == 1)) {
-				this.$refs.noUpsellDialog.openPopup();
-			} else {
-				this.onNext();
-			}
-		},
-
-		//提交
-		onNext() {
-			let orderId = this.orderInfo.orderId;
-			//预提交
-			uni.$u.http.get('/token/order/preSubmit?orderId=' + orderId).then((res) => {
-				if (res.code == 200) {
-					if (res.data.code == 1 || res.data.code == 2) {
-						uni.navigateTo({
-							url: '/pages-home/pages/book-order'
-						});
-						uni.setStorageSync('orderId', orderId);
-					} else {
-						uni.showToast({
-							icon: 'none',
-							title: res.msg
-						});
-					}
-				} else {
-					uni.showToast({
-						icon: 'none',
-						title: res.msg
-					});
-				}
-			});
-		},
-		// 加价
-		handleUpsell(book) {
-			this.$refs.upsellRef.open(book);
-		},
-
-		updateBooksList(data, book) {
-			this.bookList = data;
-			// book.upsellMoney && this.getLastOrder();
-			this.getLastOrder();
-		},
-
-		toggleCollapse(step) {
-			this.$set(this.collapseState, step, !this.collapseState[step]);
-		},
-		handleScan() {
-			uni.scanCode({
-				scanType: ['barCode'],
-				success: (res) => {
-					this.checkBookISBN(res.result, 'scan');
-				},
-				fail: () => {
-					uni.showToast({
-						title: '扫码失败',
-						icon: 'none'
-					});
-				}
-			});
-		},
-		checkBookISBN(isbn, type) {
-			let url = type == 'input' ? `/token/order/inputIsbn?isbn=${isbn}` : `/token/order/scanIsbn?isbn=${isbn}`;
-			uni.$u.http.get(url).then((res) => {
-				if (res.code == 200) {
-					let code = res.data.code;
-					if (code == 1) {
-						res.data.num = 1;
-						res.data.status = 1;
-						res.data.recyclePrice = res.data.recycleMoney;
-						this.currentBook = res.data;
-						this.bookList.unshift(res.data);
-						if (res.data.suit == 1) {
-							this.$refs.setBookDialog.openPopup();
-						}
-						if (res.data.canInvite == 1) {
-							this.$refs.upsellRef.open(res.data);
-						}
-					} else if (code == 2) {
-						let item = this.bookList.find((v) => v.isbn === isbn);
-						item.num = item.num + 1;
-						if (res.data.canInvite == 1) {
-							this.$refs.upsellRef.open(res.data);
-						}
-					} else {
-						this.handleBookCode(res.data.code);
-					}
-				} else {
-					uni.showToast({
-						title: res.msg,
-						icon: 'none'
-					});
-				}
-			});
-		},
-		//处理扫码之后不同的状态 0-扫码频繁 1-成功 2-本单已有该书,数量+1  3-没有该书 4-本书暂不回收 5-超过每单最大可卖数量  6-单个订单最多40本书
-		handleBookCode(code) {
-			if (code == 1) {
-				this.bookList.push();
-			}
-			let tempKeys = ['tiredDialog', '', '', 'noInfoDialog', 'notAcceptDialog', 'maxAcceptDialog', 'orderMaxNumDialog'];
-			let key = tempKeys[code];
-			if (key) {
-				this.$refs[key].openPopup();
-			}
-		},
-		//获取当前用户未提交订单 /api/token/order/lastOrder
-		getLastOrder() {
-			uni.$u.http.get('/token/order/lastOrder').then((res) => {
-				if (res.code == 200) {
-					this.orderInfo = res.data;
-					if (res.data.showDialog == 1) {
-						this.$refs.firstOrderFreePopup.openPopup();
-					} else if (res.data.showDialog == 2) {
-						this.$refs.kindReminder.openPopup();
-					}
-
-					this.bookList = res.data?.orderDetailList
-						? res.data.orderDetailList.map((v) => {
-								v.orderId = res.data.orderId;
-								return v;
-						  })
-						: [];
-					this.serviceList = res.data.serviceList || [];
-				}
-			});
-		},
-
-		goToScannedBooks() {
-			uni.navigateTo({
-				url: '/pages-home/pages/scaned-book'
-			});
-		},
-		goToInputISBN() {
-			this.$refs.isbnPopup.openPopup();
-		},
-		handleStartSelling() {
-			// 标记已显示过温馨提示
-			uni.setStorageSync('kindReminderShown', true);
-		}
-	},
-
-	onShow() {
-		// 获取上一个订单
-		setTimeout(() => {
-			let token = uni.getStorageSync('token');
-			token && this.getLastOrder();
-		}, 300);
-	}
+    components: {
+        notScanned,
+        InputIsbn,
+        ScanBookList,
+        CommonDialog,
+        KindReminder,
+        ServiceInfo,
+        ConfirmBooks,
+        FirstOrderFreePopup,
+        UpsellBook,
+        UpsellRules,
+        UpsellShare,
+        UpsellQrcode,
+    },
+    data() {
+        return {
+            orderInfo: {},
+            collapseState: {
+                step1: false,
+                step3: false,
+            },
+            scrollTop: 0,
+            bookList: [],
+            serviceList: [],
+            currentBook: {},
+            // 客服按钮位置
+            servicePosition: {
+                left: "auto",
+                right: 0,
+                bottom: "20%",
+            },
+            // 触摸开始位置
+            startX: 0,
+            startY: 0,
+            // 屏幕宽度和高度
+            screenWidth: 0,
+            screenHeight: 0,
+            // 初始位置记录,用于计算拖动
+            initialLeft: 0,
+            initialBottom: 0,
+            // 是否正在更新位置,用于防止频繁更新
+            isUpdatingPosition: false,
+            shareData: {},
+            deleteBook: {},
+        };
+    },
+    computed: {
+        navbarBackground() {
+            if (this.scrollTop > 0) {
+                return "linear-gradient(180deg, #4CD964 0%, #5ff178 100%)";
+            }
+            return "transparent";
+        },
+        containerBg() {
+            return this.bookList.length > 0
+                ? "linear-gradient(180deg, #4CD964 0%, #F8F8F8 25%)"
+                : "linear-gradient(180deg, #4CD964 0%, #ffffff 25%)";
+        },
+        containerPb() {
+            return this.bookList.length > 0 ? "300rpx" : "110rpx";
+        },
+        totalBooks() {
+            return this.bookList.reduce(
+                (sum, book) => sum + (book.num || 1),
+                0
+            );
+        },
+        totalPrice() {
+            return this.bookList
+                .reduce(
+                    (sum, book) =>
+                        sum +
+                            book.recyclePrice * (book.num || 1) +
+                            book.currUpsellMoney || 0,
+                    0
+                )
+                .toFixed(2);
+        },
+        isDisabled() {
+            return this.totalPrice < this.orderInfo.minOrderMoney;
+        },
+    },
+    onPageScroll(e) {
+        this.$nextTick(() => {
+            this.scrollTop = e.scrollTop;
+        });
+    },
+    // 分享配置
+    onShareAppMessage(res) {
+        if (res.from === "button") {
+            let upsellCode = uni.getStorageSync("upsellCodeShare");
+            console.log(upsellCode, "分享");
+            // 调用分享接口
+            uni.$u.http.get("/token/order/goToShare?upsellCode=" + upsellCode);
+            return {
+                title: "书嗨",
+                path: "/pages/home/index?upsellCode=" + upsellCode,
+                imageUrl:
+                    "https://shuhi.oss-cn-qingdao.aliyuncs.com/mini/share.jpg",
+            };
+        } else {
+            return {
+                title: "书嗨",
+                page: "/pages/home/index",
+            };
+        }
+    },
+
+    // 分享到朋友圈
+    onShareTimeline(res) {
+        if (res.from === "button") {
+            let upsellCode = uni.getStorageSync("upsellCodeShare");
+            // 调用分享接口
+            uni.$u.http.get("/token/order/goToShare?upsellCode=" + upsellCode);
+            return {
+                title: "书嗨",
+                path: "/pages/home/index?upsellCode=" + upsellCode,
+                imageUrl:
+                    "https://shuhi.oss-cn-qingdao.aliyuncs.com/mini/share.jpg",
+            };
+        } else {
+            return {
+                title: "书嗨",
+                page: "/pages/home/index",
+            };
+        }
+    },
+    onReady() {
+        // 获取屏幕宽度和高度
+        uni.getSystemInfo({
+            success: (res) => {
+                this.screenWidth = res.windowWidth;
+                this.screenHeight = res.windowHeight;
+            },
+        });
+        setTimeout(() => {
+            let loginSuccess = uni.getStorageSync("loginSuccess");
+            let upsellCode = app.globalData.upsellCode;
+
+            if (loginSuccess && upsellCode) {
+                console.log(loginSuccess, "登录成功loginSuccess");
+                this.$refs.shareRef?.open(upsellCode);
+                uni.removeStorageSync("loginSuccess");
+                this.getLastOrder();
+            }
+        }, 1000);
+    },
+
+    methods: {
+        //删除书籍
+        handleDeleteBook(book) {
+            this.deleteBook = book;
+            this.$refs.deleteDialog.openPopup(book);
+        },
+
+        confirmDelete() {
+            uni.$u.http
+                .post("/token/order/removeBook", {
+                    orderId: this.deleteBook.orderId,
+                    isbn: this.deleteBook.isbn,
+                })
+                .then((res) => {
+                    if (res.code == 200) {
+                        this.$u.toast("删除成功");
+                        this.getLastOrder();
+                    }
+                });
+        },
+
+        //扫码助力
+        handleScanCode(data = {}) {
+            this.$refs.upsellQrcodeRef.open(data);
+        },
+
+        slientLogin() {
+            let inviteCode = uni.getStorageSync("inviteCode") || "";
+            let token = uni.getStorageSync("token");
+            if (token) return;
+            uni.login({
+                success(res) {
+                    uni.$u.http
+                        .post("/user/wxLogin", {
+                            code: res.code,
+                            inviteCode,
+                        })
+                        .then((response) => {
+                            if (response.code == 200) {
+                                uni.setStorageSync(
+                                    "token",
+                                    response.data.token
+                                );
+                            }
+                        });
+                },
+                fail: (err) => {
+                    console.log(err, "wx.login登录失败");
+                },
+            });
+        },
+
+        //查看活动规则
+        handleViewSellRules() {
+            this.$refs.upsellRulesRef.open();
+        },
+
+        // 触摸开始
+        touchStart(e) {
+            const touch = e.touches[0];
+            this.startX = touch.clientX;
+            this.startY = touch.clientY;
+
+            // 记录初始位置,用于计算移动距离
+            if (this.servicePosition.right !== "auto") {
+                // 如果是靠右定位,记录当前位置但不立即改变显示位置
+                // 只在内部计算中使用,避免视觉上的位置跳动
+                this.initialLeft = this.screenWidth - 126;
+            } else {
+                this.initialLeft = parseFloat(this.servicePosition.left);
+            }
+
+            // 如果bottom是百分比,转换为具体像素值,但不改变显示位置
+            if (
+                typeof this.servicePosition.bottom === "string" &&
+                this.servicePosition.bottom.includes("%")
+            ) {
+                const percentage =
+                    parseFloat(this.servicePosition.bottom) / 100;
+                this.initialBottom = this.screenHeight * percentage;
+            } else {
+                this.initialBottom = parseFloat(this.servicePosition.bottom);
+            }
+        },
+
+        // 触摸移动
+        touchMove(e) {
+            // 阻止默认行为,防止页面滚动
+            e.preventDefault && e.preventDefault();
+            e.stopPropagation && e.stopPropagation();
+
+            const touch = e.touches[0];
+
+            // 计算移动距离
+            const deltaX = touch.clientX - this.startX;
+            const deltaY = touch.clientY - this.startY;
+
+            // 使用初始位置计算新位置,避免累积误差
+            let newLeft = this.initialLeft + deltaX;
+            let newBottom = this.initialBottom - deltaY; // 注意:y轴方向是相反的
+
+            // 确保按钮不超出屏幕边界
+            if (newLeft < 0) {
+                newLeft = 0;
+            } else if (newLeft > this.screenWidth - 126) {
+                newLeft = this.screenWidth - 126;
+            }
+
+            // 确保按钮不超出屏幕垂直边界
+            if (newBottom < 20) {
+                newBottom = 20;
+            } else if (newBottom > this.screenHeight - 160) {
+                newBottom = this.screenHeight - 160;
+            }
+
+            // 使用节流方式更新位置,避免过于频繁的更新
+            if (!this.isUpdatingPosition) {
+                this.isUpdatingPosition = true;
+
+                // 更新位置 - 第一次移动时才真正改变right为auto
+                this.servicePosition = {
+                    left: newLeft,
+                    right: "auto",
+                    bottom: newBottom,
+                };
+
+                // 使用setTimeout代替requestAnimationFrame,在微信小程序中更兼容
+                setTimeout(() => {
+                    this.isUpdatingPosition = false;
+                }, 16); // 约等于60fps的刷新率
+            }
+
+            // 不更新起始点,保持相对于初始触摸点的位移计算
+            // 这样可以避免累积误差,使拖动更精确
+        },
+
+        // 触摸结束,实现吸附效果
+        touchEnd() {
+            // 确保不再有待处理的更新
+            this.isUpdatingPosition = false;
+
+            const buttonCenter = this.servicePosition.left + 63; // 按钮中心位置
+            const halfScreen = this.screenWidth / 2;
+
+            // 判断是吸附到左边还是右边
+            if (buttonCenter < halfScreen) {
+                // 吸附到左边
+                this.servicePosition = {
+                    left: 0,
+                    right: "auto",
+                    bottom: this.servicePosition.bottom,
+                };
+            } else {
+                // 吸附到右边
+                this.servicePosition = {
+                    left: "auto",
+                    right: 0,
+                    bottom: this.servicePosition.bottom,
+                };
+            }
+        },
+
+        handleStart() {
+            this.showPopup = true;
+        },
+        //套装书确认
+        handleSetBookConfirm() {
+            this.$refs.confirmBooks.openPopup(this.currentBook);
+        },
+        //书册补全
+        handleIncomplete() {
+            this.$refs.scanBookList.handleDeleteBook(this.currentBook);
+        },
+
+        handleValidate() {
+            if (this.bookList.some((v) => v.canInvite == 1)) {
+                this.$refs.noUpsellDialog.openPopup();
+            } else {
+                this.onNext();
+            }
+        },
+
+        //提交
+        onNext() {
+            let orderId = this.orderInfo.orderId;
+            //预提交
+            uni.$u.http
+                .get("/token/order/preSubmit?orderId=" + orderId)
+                .then((res) => {
+                    if (res.code == 200) {
+                        if (res.data.code == 1 || res.data.code == 2) {
+                            uni.navigateTo({
+                                url: "/pages-home/pages/book-order",
+                            });
+                            uni.setStorageSync("orderId", orderId);
+                        } else {
+                            uni.showToast({
+                                icon: "none",
+                                title: res.msg,
+                            });
+                        }
+                    } else {
+                        uni.showToast({
+                            icon: "none",
+                            title: res.msg,
+                        });
+                    }
+                });
+        },
+        // 加价
+        handleUpsell(book) {
+            this.$refs.upsellRef.open(book);
+        },
+
+        updateBooksList(data, book) {
+            this.bookList = data;
+            // book.upsellMoney && this.getLastOrder();
+            this.getLastOrder();
+        },
+
+        toggleCollapse(step) {
+            this.$set(this.collapseState, step, !this.collapseState[step]);
+        },
+        handleScan() {
+            uni.scanCode({
+                scanType: ["barCode"],
+                success: (res) => {
+                    this.checkBookISBN(res.result, "scan");
+                },
+                fail: () => {
+                    uni.showToast({
+                        title: "扫码失败",
+                        icon: "none",
+                    });
+                },
+            });
+        },
+        checkBookISBN(isbn, type) {
+            let url =
+                type == "input"
+                    ? `/token/order/inputIsbn?isbn=${isbn}`
+                    : `/token/order/scanIsbn?isbn=${isbn}`;
+            uni.$u.http.get(url).then((res) => {
+                if (res.code == 200) {
+                    let code = res.data.code;
+                    if (code == 1) {
+                        res.data.num = 1;
+                        res.data.status = 1;
+                        res.data.recyclePrice = res.data.recycleMoney;
+                        this.currentBook = res.data;
+                        this.bookList.unshift(res.data);
+                        if (res.data.suit == 1) {
+                            this.$refs.setBookDialog.openPopup();
+                        }
+                        if (res.data.canInvite == 1) {
+                            this.$refs.upsellRef.open(res.data);
+                        }
+                    } else if (code == 2) {
+                        let item = this.bookList.find((v) => v.isbn === isbn);
+                        item.num = item.num + 1;
+                        if (res.data.canInvite == 1) {
+                            this.$refs.upsellRef.open(res.data);
+                        }
+                    } else {
+                        this.handleBookCode(res.data.code);
+                    }
+                } else {
+                    uni.showToast({
+                        title: res.msg,
+                        icon: "none",
+                    });
+                }
+            });
+        },
+        //处理扫码之后不同的状态 0-扫码频繁 1-成功 2-本单已有该书,数量+1  3-没有该书 4-本书暂不回收 5-超过每单最大可卖数量  6-单个订单最多40本书
+        handleBookCode(code) {
+            if (code == 1) {
+                this.bookList.push();
+            }
+            let tempKeys = [
+                "tiredDialog",
+                "",
+                "",
+                "noInfoDialog",
+                "notAcceptDialog",
+                "maxAcceptDialog",
+                "orderMaxNumDialog",
+            ];
+            let key = tempKeys[code];
+            if (key) {
+                this.$refs[key].openPopup();
+            }
+        },
+        //获取当前用户未提交订单 /api/token/order/lastOrder
+        getLastOrder() {
+            uni.$u.http.get("/token/order/lastOrder").then((res) => {
+                if (res.code == 200) {
+                    this.orderInfo = res.data;
+                    if (res.data.showDialog == 1) {
+                        this.$refs.firstOrderFreePopup.openPopup();
+                    } else if (res.data.showDialog == 2) {
+                        this.$refs.kindReminder.openPopup();
+                    }
+
+                    this.bookList = res.data?.orderDetailList
+                        ? res.data.orderDetailList.map((v) => {
+                              v.orderId = res.data.orderId;
+                              return v;
+                          })
+                        : [];
+                    this.serviceList = res.data.serviceList || [];
+                }
+            });
+        },
+
+        goToScannedBooks() {
+            uni.navigateTo({
+                url: "/pages-home/pages/scaned-book",
+            });
+        },
+        goToInputISBN() {
+            this.$refs.isbnPopup.openPopup();
+        },
+        handleStartSelling() {
+            // 标记已显示过温馨提示
+            uni.setStorageSync("kindReminderShown", true);
+        },
+    },
+
+    onShow() {
+        // 获取上一个订单
+        setTimeout(() => {
+            let token = uni.getStorageSync("token");
+            token && this.getLastOrder();
+        }, 300);
+    },
 };
 </script>
 
 <style lang="scss" scoped>
 .customer-service {
-	position: fixed;
-	width: 126rpx;
-	height: 140rpx;
-	bottom: 20%;
-	z-index: 999;
-	transition: all 0.3s ease;
-
-	/* 添加过渡效果使吸附更平滑 */
-	button {
-		height: max-content;
-		background-color: transparent;
-		padding: 0;
-	}
+    position: fixed;
+    width: 126rpx;
+    height: 140rpx;
+    bottom: 20%;
+    z-index: 999;
+    transition: all 0.3s ease;
+
+    /* 添加过渡效果使吸附更平滑 */
+    button {
+        height: max-content;
+        background-color: transparent;
+        padding: 0;
+    }
 }
 
 .container {
-	height: 100%;
-	position: relative;
-	overflow: auto;
-	z-index: 1;
-	/* #ifdef MP-WEIXIN */
-	min-height: 100vh;
-	/* #endif */
-	/* #ifndef MP-WEIXIN */
-	min-height: calc(100vh - 120rpx);
-
-	/* #endif */
-	&.book-list {
-		padding-bottom: 300rpx;
-	}
-
-	padding-bottom: 130rpx;
-
-	.nav-title {
-		font-family: PingFang SC;
-		font-weight: bold;
-		font-size: 34rpx;
-		color: #ffffff;
-		padding-left: 40rpx;
-	}
+    height: 100%;
+    position: relative;
+    overflow: auto;
+    z-index: 1;
+    /* #ifdef MP-WEIXIN */
+    min-height: 100vh;
+    /* #endif */
+    /* #ifndef MP-WEIXIN */
+    min-height: calc(100vh - 120rpx);
+
+    /* #endif */
+    &.book-list {
+        padding-bottom: 300rpx;
+    }
+
+    padding-bottom: 130rpx;
+
+    .nav-title {
+        font-family: PingFang SC;
+        font-weight: bold;
+        font-size: 34rpx;
+        color: #ffffff;
+        padding-left: 40rpx;
+    }
 }
 
 .common-text {
-	font-family: PingFang SC;
-	font-weight: 500;
-	font-size: 28rpx;
-	color: #999999;
-
-	&.tip {
-		color: #ff8a4b;
-	}
+    font-family: PingFang SC;
+    font-weight: 500;
+    font-size: 28rpx;
+    color: #999999;
+
+    &.tip {
+        color: #ff8a4b;
+    }
 }
 
 .color-red {
-	color: #ff0000;
-	margin: 0 10rpx;
+    color: #ff0000;
+    margin: 0 10rpx;
 }
 .color-green {
-	color: #276f1e;
+    color: #276f1e;
 }
 
 .bottom-fixed {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	z-index: 9;
-	background-color: #ffffff;
-	/* #ifdef H5 */
-	padding-bottom: 120rpx;
-	/* #endif */
-
-	.btn-wrap {
-		display: flex;
-		gap: 20rpx;
-		padding: 20rpx;
-		padding-bottom: 0;
-
-		button {
-			flex: 1;
-			height: 88rpx;
-			border-radius: 10rpx;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			gap: 10rpx;
-			border: none;
-
-			text {
-				font-size: 32rpx;
-			}
-
-			&::after {
-				border: none;
-			}
-		}
-
-		.isbn-btn {
-			background-color: #ffffff;
-			color: #4cd964;
-			border: 3rpx solid #4cd964;
-		}
-	}
-
-	.scan-btn {
-		background-color: #4cd964;
-		color: #ffffff;
-	}
-
-	.next-btn {
-		margin: 0;
-		margin-left: 20rpx;
-
-		&[aria-disabled='true'] {
-			background-color: #cccccc;
-			color: #ffffff;
-			opacity: 0.7;
-			cursor: not-allowed;
-		}
-	}
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 9;
+    background-color: #ffffff;
+    /* #ifdef H5 */
+    padding-bottom: 120rpx;
+    /* #endif */
+
+    .btn-wrap {
+        display: flex;
+        gap: 20rpx;
+        padding: 20rpx;
+        padding-bottom: 0;
+
+        button {
+            flex: 1;
+            height: 88rpx;
+            border-radius: 10rpx;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 10rpx;
+            border: none;
+
+            text {
+                font-size: 32rpx;
+            }
+
+            &::after {
+                border: none;
+            }
+        }
+
+        .isbn-btn {
+            background-color: #ffffff;
+            color: #4cd964;
+            border: 3rpx solid #4cd964;
+        }
+    }
+
+    .scan-btn {
+        background-color: #4cd964;
+        color: #ffffff;
+    }
+
+    .next-btn {
+        margin: 0;
+        margin-left: 20rpx;
+
+        &[aria-disabled="true"] {
+            background-color: #cccccc;
+            color: #ffffff;
+            opacity: 0.7;
+            cursor: not-allowed;
+        }
+    }
 }
 </style>