MrShi
2026-05-22 fbc074229fd4736f1ae2793c9daebf04726188b2
small-program/pages/luggage-storage/luggage-storage.vue
@@ -1,5 +1,15 @@
<template>
   <view class="luggage-page">
      <view class="nav-bar" :style="{ paddingTop: statusbarHeight + 'px' }">
         <view class="nav-content" :style="{ height: navHeight + 'px' }">
            <view class="nav-left" @click="goBack">
               <u-icon name="arrow-left" :size="26" color="#333333"></u-icon>
            </view>
            <text class="nav-title">行李寄存</text>
            <view class="nav-right"></view>
         </view>
      </view>
      <!-- <view class="top-placeholder" :style="{ height: statusbarHeight + navHeight + 'px' }"></view> -->
      <view class="top-gradient-bg"></view>
      <view class="mode-tabs">
         <view
@@ -7,7 +17,7 @@
            :key="item.value"
            class="mode-tab"
            :class="{ active: activeMode === item.value }"
            @tap="switchMode(item.value)"
            @click="switchMode(item.value)"
         >
            <text>{{ item.label }}</text>
            <view v-if="activeMode === item.value" class="mode-line"></view>
@@ -64,11 +74,7 @@
                           </view>
                        </view>
                        <view v-if="receiveAddr" class="store-cell-copy-addr">
                           <text class="store-cell-title">{{ receiveAddr.name }}</text>
                           <view class="store-cell-subtitle-container">
                              <image src="/static/icon/home_ic_location3@2x.png" mode="widthFix"></image>
                              <text class="store-cell-subtitle">{{ receiveAddr.addr }}</text>
                           </view>
                           <text class="store-cell-title">{{ receiveAddr.addr }}</text>
                        </view>
                     </view>
                  </view>
@@ -90,7 +96,7 @@
                  <input v-model="form.mobile" class="form-input" :class="{ 'filled-input': form.mobile }" type="number" placeholder="请输入收件人电话" placeholder-style="color: #B2B2B2;" />
               </view>
               <view class="form-row dashed-row">
                  <text class="form-label">预计到店时间</text>
                  <text class="form-label">到店寄存时间</text>
                  <view class="row-picker" @click="showArriveTimePicker = true">
                     <text :class="form.arriveTime ? 'picker-value-text' : 'placeholder-text'">{{ form.arriveTime || '请选择' }}</text>
                     <u-icon name="arrow-right" size="18" color="#222222"></u-icon>
@@ -98,7 +104,7 @@
               </view>
               <view class="form-row no-border">
                  <text class="form-label">预计取件时间</text>
                  <view class="row-picker" @click="showPickupTimePicker = true">
                  <view class="row-picker" @click="openPickupTimePicker">
                     <text :class="form.pickupTime ? 'picker-value-text' : 'placeholder-text'">{{ form.pickupTime || '请选择' }}</text>
                     <u-icon name="arrow-right" size="18" color="#222222"></u-icon>
                  </view>
@@ -108,9 +114,10 @@
               :show="showArriveTimePicker"
               v-model="arriveTimeValue"
               mode="datetime"
               :minDate="Date.now()"
               confirmText="确定"
               cancelText="取消"
               title="选择预计到店时间"
               title="选择到店寄存时间"
               @confirm="confirmArriveTime"
               @cancel="showArriveTimePicker = false"
               @close="showArriveTimePicker = false"
@@ -119,6 +126,7 @@
               :show="showPickupTimePicker"
               v-model="pickupTimeValue"
               mode="datetime"
               :minDate="pickupMinDate"
               confirmText="确定"
               cancelText="取消"
               title="选择预计取件时间"
@@ -133,7 +141,7 @@
                     <text class="section-title">寄存行李类型</text>
                     <text class="section-desc">(多选,必填)</text>
                  </view>
                  <view class="price-note">
                  <view class="price-note"  @click="goRichText(9)">
                     <image class="price-note-icon" src="/static/icon/ic_tips@2x.png" mode="widthFix"></image>
                     <text>价格说明</text>
                  </view>
@@ -145,10 +153,12 @@
                  :class="{ active: item.count > 0 }"
               >
                  <view class="luggage-info">
                     <image class="luggage-image" :src="item.iconFull" mode="widthFix"></image>
                     <view class="luggage-image">
                        <image style="height: 100%;"  :src="item.iconFull" mode="heightFix"></image>
                     </view>
                     <view class="luggage-copy">
                        <text class="luggage-name">{{ item.name }}</text>
                        <text class="luggage-size">{{ item.otherField || '' }}</text>
                        <text class="luggage-size">{{ item.remark || '' }}</text>
                     </view>
                  </view>
                  <view class="luggage-stepper">
@@ -165,7 +175,7 @@
                     <text class="section-title">物品信息</text>
                  </view>
                  <view class="required-wrap">
                     <text class="section-required goods-required-text" :style="{ color: form.goodTypeName ? '#111111' : '#B2B2B2' }">{{ form.goodTypeName || '必选,请选择' }}</text>
                     <text class="section-required goods-required-text" :style="{ color: form.goodTypeName ? '#111111' : 'red' }">{{ form.goodTypeName || '必选,请选择' }}</text>
                     <u-icon name="arrow-right" size="12" color="#A8AFBA"></u-icon>
                  </view>
               </view>
@@ -173,9 +183,9 @@
                  <view class="upload-box" @click="chooseAndUploadImage(9)">
                     <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
                  </view>
                  <view v-for="(item, index) in uploadedImages" :key="index" class="uploaded-box" @click="deleteImage(index)">
                  <view v-for="(item, index) in uploadedImages" :key="index" class="uploaded-box">
                     <image class="uploaded-image" :src="item.url" mode="aspectFill"></image>
                     <text class="uploaded-delete" @click="deleteImage(index)">删除</text>
                     <text class="uploaded-delete" @click.stop="deleteImage(index)">删除</text>
                  </view>
               </view>
            </view>
@@ -208,9 +218,25 @@
                     <text class="unit-text">元</text>
                  </view>
               </view>
               <view v-if="amountData" class="insurance-tip-row">
                  <text class="insurance-tip-label">物品保费:</text>
                  <text class="insurance-tip-value">¥{{ amountData.insuranceFee }}</text>
               <view v-if="amountData || showInsuranceTip" class="insurance-tip-row">
                  <text v-if="showInsuranceTip" class="insurance-tip-warning">{{ showInsuranceTipText }}</text>
                  <text v-else></text>
                  <view style="display: flex; align-items: center;">
                     <text v-if="amountData" class="insurance-tip-label">物品保费:</text>
                     <text v-if="amountData" class="insurance-tip-value">¥{{ amountData.insuranceFee }}</text>
                  </view>
               </view>
            </view>
            <view class="section-card simple-card">
               <view class="form-row" @click="selectCoupon">
                  <text class="form-label">平台优惠券</text>
                  <view class="form-value-wrap">
                     <view style="display: flex; flex-direction: column; align-items: flex-end;">
                        <text :class="selectedCoupon && selectedCoupon.value > 0 ? 'coupon-value-red' : 'form-value-placeholder'">{{ selectedCoupon && selectedCoupon.value > 0 ? '-¥' + selectedCoupon.value.toFixed(2) : '选择优惠券' }}</text>
                     </view>
                     <u-icon name="arrow-right" size="14" color="#999999"></u-icon>
                  </view>
               </view>
            </view>
@@ -222,7 +248,65 @@
            </view>
         </view>
         <view style="width: 100%; height: 104rpx;" v-if="amountData"></view>
         <view style="width: 100%; height: calc(112rpx + env(safe-area-inset-bottom));"></view>
      </scroll-view>
      <!-- 优惠券选择弹窗 -->
      <u-popup :show="showCouponPopup" mode="bottom" round="24" :closeOnClickOverlay="true" @close="showCouponPopup = false">
         <view class="coupon-popup-wrap">
            <view class="coupon-popup-head">
               <text class="coupon-popup-title">选择优惠券</text>
               <view class="coupon-popup-close" @tap="showCouponPopup = false">
                  <u-icon name="close" size="28" color="#999999"></u-icon>
               </view>
            </view>
            <scroll-view scroll-y class="coupon-list-scroll">
               <template v-if="couponList.length > 0">
                  <view
                     v-for="(coupon, index) in couponList"
                     :key="index"
                     class="coupon-item"
                     :class="{ active: selectedCouponIndex === index }"
                     @click="toggleCoupon(index)"
                  >
                     <!-- 上半部分 -->
                     <view class="coupon-item-top">
                        <view class="coupon-item-left">
                           <text class="coupon-name" v-if="coupon.couponType === 0">平台满减券</text>
                           <text class="coupon-validity">有效期{{ formatDate(coupon.startDate) }}~{{ formatDate(coupon.endDate) }}</text>
                        </view>
                        <view class="coupon-item-right">
                           <text class="coupon-amount">¥{{ ((coupon.price || 0) / 100).toFixed(2) }}</text>
                           <text class="coupon-desc">满{{((coupon.limitPrice || 0) / 100).toFixed(2)}}可用</text>
                        </view>
                     </view>
                     <!-- 虚线分隔 -->
                     <view class="coupon-divider"></view>
                     <!-- 下半部分 -->
                     <view class="coupon-item-bottom">
                        <view class="coupon-usage" @click.stop="toggleUsage(index)">
                           <text class="coupon-usage-label">使用说明</text>
                           <u-icon :name="showUsageIndex === index ? 'arrow-up' : 'arrow-down'" size="14" color="#999999"></u-icon>
                        </view>
                        <u-icon v-if="selectedCouponIndex === index" name="checkmark-circle-fill" size="24" color="#1890FF"></u-icon>
                     </view>
                     <!-- 使用说明内容 -->
                     <view v-if="showUsageIndex === index" class="coupon-usage-content">
                        <text class="coupon-usage-text">{{ coupon.info }}</text>
                     </view>
                  </view>
               </template>
               <view class="coupon-list-scroll-wu" v-else>暂无优惠券</view>
            </scroll-view>
            <view class="coupon-confirm-btn-wrap">
               <view class="coupon-confirm-btn active-submit-btn" @click="confirmCoupon">确定选择</view>
            </view>
         </view>
      </u-popup>
      <u-popup :show="showStorePopup" mode="bottom" round="24" :closeOnClickOverlay="true" @close="showStorePopup = false">
         <view class="store-popup-wrap">
@@ -255,7 +339,7 @@
                           <image class="store-option-address-icon" src="/static/icon/home_ic_location3@2x.png" mode="widthFix"></image>
                           <text class="store-option-address">{{ item.address }}</text>
                        </view>
                        <text class="store-option-time">{{ item.time }}</text>
                        <text class="store-option-time">{{ item.shopHours || '' }}</text>
                     </view>
                  </view>
                  <view v-if="tempSelectedStoreId === item.id" class="store-check">
@@ -280,23 +364,26 @@
                  <text class="goods-main-title">物品名称</text>
                  <text class="goods-main-required">(必选)</text>
               </view>
               <view class="goods-danger-tip">
               <view class="goods-danger-tip"  @click="goRichText(10)">
                  <image class="goods-danger-icon" src="/static/icon/ic_tips@2x.png" mode="widthFix"></image>
                  <text>禁寄物品</text>
               </view>
            </view>
            <text class="goods-popup-desc">为确保物品寄递安全,请检查是否不夹带易燃易爆物品</text>
            <view class="goods-tag-grid">
               <view
                  v-for="(item, index) in goodsOptions"
                  :key="index"
                  class="goods-tag"
                  :class="{ active: item.active }"
                  @click="goodsOptions.forEach((row,i) => row.active = i === index)"
               >
                  <text>{{ item.name }}</text>
            <view style="display: block;height: 500rpx;overflow-y: auto;margin-top:10px ;">
               <view class="goods-tag-grid">
                  <view
                     v-for="(item, index) in goodsOptions"
                     :key="index"
                     class="goods-tag"
                     :class="{ active: item.active }"
                     @click="goodsOptions.forEach((row,i) => row.active = i === index)"
                  >
                     <text>{{ item.name }}</text>
                  </view>
               </view>
            </view>
            </view>
            <view class="goods-save-btn" @tap="confirmGoods">保存</view>
         </view>
      </u-popup>
@@ -317,19 +404,43 @@
                  </view>
                  <text class="amount-row-value">{{ '¥' + item.unitPrice }}</text>
               </view>
               <view v-if="activeMode === 'city' && amountData.distance" class="amount-row amount-row-extra">
                  <view class="amount-row-left">
                     <text class="amount-row-label">配送里程</text>
                  </view>
                  <text class="amount-row-value">{{ amountData.distance + 'km' }}</text>
               </view>
               <view v-if="activeMode !== 'city' && amountData.days" class="amount-row amount-row-extra">
                  <view class="amount-row-left">
                     <text class="amount-row-label">寄存天数</text>
                  </view>
                  <text class="amount-row-value">{{ amountData.days + '天' }}</text>
               </view>
               <view v-if="amountData.insuranceFee" class="amount-row amount-row-extra">
                  <view class="amount-row-left">
                     <text class="amount-row-label">物品保费</text>
                  </view>
                  <text class="amount-row-value">{{ '¥' + amountData.insuranceFee }}</text>
               </view>
               <view v-if="selectedCoupon" class="amount-row amount-row-extra">
                  <view class="amount-row-left">
                     <text class="amount-row-label">平台优惠券</text>
                  </view>
                  <text class="amount-row-discount">-¥{{ selectedCoupon.value || selectedCoupon.amount || 0 }}</text>
               </view>
            </view>
            <view class="agreement-bar popup-agreement-bar" @click="toggleAgreement">
               <image class="agreement-icon" :src="agreementChecked ? '/static/icon/ic_accept_sel@2x.png' : '/static/icon/ic_accept@2x.png'" mode="widthFix" />
               <text class="agreement-text">我已阅读并同意</text>
               <text class="agreement-link" @tap="goRichText('protocol')">《用户服务协议》</text>
               <text class="agreement-link" @tap="goRichText(0)">《用户服务协议》</text>
               <text class="agreement-text">及</text>
               <text class="agreement-link" @tap="goRichText('privacy')">《隐私政策》</text>
               <text class="agreement-link" @tap="goRichText(1)">《隐私政策》</text>
            </view>
            <view class="bottom-action-row popup-action-row">
               <view class="total-wrap">
                  <text class="total-label">总费用</text>
                  <text class="total-price">{{ amountData ? '¥' + amountData.totalPrice : '¥--' }}</text>
                  <view @click="showAmountPopup = false">
                  <text class="total-price">{{ amountData ? '¥' + (amountData.totalPrice - (selectedCoupon ? selectedCoupon.value || selectedCoupon.amount || 0 : 0)).toFixed(2) : '¥--' }}</text>
                  <view style="width: 100rpx; height: 40rpx; display: flex; align-items: center;" @click="showAmountPopup = false">
                     <text class="detail-text">明细</text>
                     <u-icon name="arrow-up" size="13" color="#7B7F86"></u-icon>
                  </view>
@@ -343,22 +454,23 @@
         <view class="agreement-bar" @click="toggleAgreement">
            <image class="agreement-icon" :src="agreementChecked ? '/static/icon/ic_accept_sel@2x.png' : '/static/icon/ic_accept@2x.png'" mode="widthFix" />
            <text class="agreement-text">我已阅读并同意</text>
            <text class="agreement-link" @tap="goRichText('protocol')">《用户服务协议》</text>
            <text class="agreement-link" @click="goRichText(0)">《用户服务协议》</text>
            <text class="agreement-text">及</text>
            <text class="agreement-link" @tap="goRichText('privacy')">《隐私政策》</text>
            <text class="agreement-link" @click="goRichText(1)">《隐私政策》</text>
         </view>
         <view class="bottom-action-row">
            <view class="total-wrap">
            <view class="total-wrap" @click.stop="openAmountPopup">
               <text class="total-label">总费用</text>
               <text class="total-price">{{ amountData ? '¥' + amountData.totalPrice : '¥--' }}</text>
               <text class="total-price">{{ amountData ? '¥' + (amountData.totalPrice - (selectedCoupon ? selectedCoupon.value || 0 : 0)).toFixed(2) : '¥--' }}</text>
               <template v-if="amountData">
                  <text class="detail-text detail-click" @tap.stop="openAmountPopup">明细</text>
                  <text class="detail-text detail-click">明细</text>
                  <u-icon name="arrow-down" size="18" color="#999999"></u-icon>
               </template>
            </view>
            <view class="submit-btn active-submit-btn" @click="createOrder">立即下单</view>
         </view>
      </view>
      <!-- 选择服务点/地址 -->
      <u-action-sheet
         :show="showReceiveAddress"
@@ -387,7 +499,7 @@
               { label: '就地寄存', value: 'local' },
               { label: '同城寄送', value: 'city' }
            ],
            agreementChecked: true,
            agreementChecked: false,
            tempSelectedStoreId: 2,
            selectedStoreId: 2,
            tempSelectedGoodsIds: [1],
@@ -406,6 +518,8 @@
               goodsImages: [],
            },
            amountData: null,
            showInsuranceTip: false,
            showInsuranceTipText: '',
            luggageTypes: [],
            serviceTimes: [],
@@ -428,8 +542,13 @@
            actions: [
               { name: '选择服务点' },
               { name: '选择地址簿' }
            ]
         }
            ],
            selectedCoupon: null,
         showCouponPopup: false,
         couponList: [],
         selectedCouponIndex: -1,
         showUsageIndex: -1,
      }
      },
      watch: {
         'form.insurance': {
@@ -446,7 +565,7 @@
         }
      },
      computed: {
         ...mapState(['latitude', 'longitude', 'cityId']),
         ...mapState(['latitude', 'longitude', 'cityId', 'statusbarHeight', 'navHeight', 'userInfo']),
         servicePointPlaceholder() {
            return this.activeMode === 'city' ? '选择寄送服务点' : '选择寄存服务点'
         },
@@ -461,32 +580,154 @@
         },
         totalPriceText() {
            return '¥150.00'
         },
         pickupMinDate() {
            if (this.form.arriveTime) {
               return new Date(this.form.arriveTime).getTime()
            }
            return Date.now()
         }
      },
      onLoad() {
         this.getNearbyShopList()
         this.getCategoryList()
         this.getCitySizeList()
         this.agreementChecked=false
         this.getContactInfo()
         
         if (uni.getStorageSync('selectedStore')) {
            const store = uni.getStorageSync('selectedStore')
            this.selectedStore = store
            this.sendStore = store
            uni.removeStorageSync('selectedStore')
         }
         uni.$on('updateAddress', (data) => {
            console.log(data)
            this.receiveStore = null
            this.form.receiver = data.name
            this.form.mobile = data.phone
            this.receiveAddr = data
            this.receiveAddr.addr = data.provinceName + data.cityName + data.districtName + data.addr
         })
         uni.$on('selectCoupon', (data) => {
            this.selectedCoupon = data
            if (this.activeMode === 'city') {
               this.calculateRemotePrice()
            } else {
               this.calculateLocalPrice()
            }
         })
      },
      onUnload() {
         uni.$off('updateAddress')
         uni.$off('selectCoupon')
      },
      methods: {
         formatDate(dateStr) {
            if (!dateStr) return ''
            const date = new Date(dateStr)
            const year = String(date.getFullYear()).slice(2)
            const month = String(date.getMonth() + 1).padStart(2, '0')
            const day = String(date.getDate()).padStart(2, '0')
            const hours = String(date.getHours()).padStart(2, '0')
            const minutes = String(date.getMinutes()).padStart(2, '0')
            return `${year}.${month}.${day} ${hours}:${minutes}`
         },
         hasFormData() {
            if (this.form.receiver || this.form.mobile || this.form.arriveTime ||
               this.form.pickupTime || this.form.goodType || this.form.insurance ||
               this.form.remark || this.form.goodsImages.length > 0 ||
               this.selectedStore || this.sendStore || this.receiveStore ||
               this.receiveAddr || this.amountData) {
               return true
            }
            if (this.luggageTypes.some(item => item.count > 0)) {
               return true
            }
            return false
         },
         goBack() {
            if (this.hasFormData()) {
               uni.showModal({
                  title: '提示',
                  content: '离开后当前页面内容失效,是否确认离开?',
                  confirmText: '确认离开',
                  cancelText: '取消',
                  success: (res) => {
                     if (res.confirm) {
                        uni.navigateBack()
                     }
                  }
               })
            } else {
               uni.navigateBack()
            }
         },
         getCouponId() {
            if (this.selectedCoupon && this.selectedCoupon.id && this.selectedCoupon.id > 0) {
               return this.selectedCoupon.id
            } else if (this.selectedCoupon && this.selectedCoupon.id === 0) {
               return null
            }
            return -1
         },
         selectCoupon() {
            this.showCouponPopup = true
         },
         toggleUsage(index) {
            if (this.showUsageIndex === index) {
               this.showUsageIndex = -1
            } else {
               this.showUsageIndex = index
            }
         },
         toggleCoupon(index) {
            if (this.selectedCouponIndex === index) {
               // 重复点击,取消选择
               this.selectedCouponIndex = -1
            } else {
               // 选择优惠券
               this.selectedCouponIndex = index
            }
         },
         confirmCoupon() {
            if (this.selectedCouponIndex >= 0 && this.selectedCouponIndex < this.couponList.length) {
               const coupon = this.couponList[this.selectedCouponIndex]
               this.selectedCoupon = {
                  id: coupon.id,
                  name: coupon.name,
                  value: coupon.value || coupon.amount / 100,
                  price: coupon.amount
               }
               this.showCouponPopup = false
               if (this.activeMode === 'city') {
                  this.calculateRemotePrice()
               } else {
                  this.calculateLocalPrice()
               }
            } else if (this.selectedCouponIndex === -1) {
               // 取消选择优惠券
               this.selectedCoupon = { id: 0, name: '不使用优惠券', value: 0 }
               this.showCouponPopup = false
               if (this.activeMode === 'city') {
                  this.calculateRemotePrice()
               } else {
                  this.calculateLocalPrice()
               }
            }
         },
         caozuo(e) {
            var that = this;
            if (e.name === '选择服务点') {
               that.storePopupType = 'receive'
               that.receiveStore = null
               that.showStorePopup = true
            } else if (e.name === '选择地址簿') {
               that.receiveAddr = null
               uni.navigateTo({
                  url: '/pages/address/address?type=1'
               })
            }
            that.showReceiveAddress = false
            this.showReceiveAddress = false
         },
         async uploadFiles(filePaths, maxCount = 9) {
            if (!filePaths || filePaths.length === 0) {
@@ -580,12 +821,8 @@
         },
         switchMode(mode) {
            this.activeMode = mode
            this.selectedStore = null
            this.sendStore = null
            this.receiveStore = null
            this.receiveAddr = null
            this.form.receiver = ''
            this.form.mobile = ''
            this.form.arriveTime = ''
            this.form.pickupTime = ''
            this.form.goodType = ''
@@ -647,6 +884,8 @@
            }
            this.form.goodTypeName = this.goodsOptions.find(item => item.active)?.name || ''
            this.form.goodType = this.goodsOptions.find(item => item.active)?.id || ''
            this.showInsuranceTip = this.goodsOptions.find(item => item.active)?.relationOtherField === '1'
            this.showInsuranceTipText = this.goodsOptions.find(item => item.active)?.relationRemark
            this.showGoodsPopup = false
         },
         confirmArriveTime(e) {
@@ -657,8 +896,17 @@
            const hour = String(date.getHours()).padStart(2, '0')
            const minute = String(date.getMinutes()).padStart(2, '0')
            this.form.arriveTime = `${year}-${month}-${day} ${hour}:${minute}`
            this.form.pickupTime = ''
            this.pickupTimeValue = e.value + 3600000
            this.showArriveTimePicker = false
            this.calculateLocalPrice()
         },
         openPickupTimePicker() {
            if (!this.form.arriveTime) {
               uni.showToast({ title: '请先选择到店寄存时间', icon: 'none' })
               return
            }
            this.showPickupTimePicker = true
         },
         confirmPickupTime(e) {
            const date = new Date(e.value)
@@ -669,7 +917,7 @@
            const minute = String(date.getMinutes()).padStart(2, '0')
            const pickupTime = `${year}-${month}-${day} ${hour}:${minute}`
            if (this.form.arriveTime && new Date(pickupTime) <= new Date(this.form.arriveTime)) {
               uni.showToast({ title: '预计取件时间必须大于预计到店时间', icon: 'none' })
               uni.showToast({ title: '预计取件时间必须大于到店寄存时间', icon: 'none' })
               return
            }
            this.form.pickupTime = pickupTime
@@ -693,6 +941,16 @@
                  item.count = 0
               })
               this.luggageTypes = res.data || []
            }
         },
         async getContactInfo() {
            const res = await this.$u.api.getContactInfo({})
            if (res.code === 200 && res.data) {
               this.form.receiver = res.data.name || this.userInfo.name || ''
               this.form.mobile = res.data.phone || this.userInfo.telephone || ''
            } else {
               this.form.receiver = this.userInfo.name || ''
               this.form.mobile = this.userInfo.telephone || ''
            }
         },
         async getNearbyShopList() {
@@ -735,7 +993,8 @@
            }
         },
         async calculateLocalPriceOnly() {
            if (!this.selectedStore || !this.form.arriveTime || !this.form.pickupTime) {
            if (!this.form.arriveTime || !this.form.pickupTime) {
               this.amountData = null
               return
            }
            const luggageList = this.luggageTypes
@@ -745,15 +1004,16 @@
                  quantity: item.count
               }))
            if (luggageList.length === 0) {
               this.amountData = null
               return
            }
            const res = await this.$u.api.calculateLocalPrice({
               cityId: this.cityId,
               shopId: this.selectedStore.id,
               depositStartTime: this.form.arriveTime + ':00',
               depositEndTime: this.form.pickupTime + ':00',
               items: luggageList,
               declaredAmount: this.form.insurance || 0
               declaredAmount: this.form.insurance || 0,
               couponId: this.getCouponId()
            })
            if (res.code === 200) {
               res.data.itemList.forEach(item => {
@@ -761,14 +1021,35 @@
               })
               res.data.totalPrice = res.data.totalPrice / 100
               res.data.insuranceFee = res.data.insuranceFee / 100
               if (res.data.selectedCoupon) {
                  res.data.selectedCoupon.value = res.data.selectedCoupon.price / 100
               }
               if (res.data.availableCoupons) {
                  res.data.availableCoupons.forEach(coupon => {
                     coupon.value = coupon.price / 100
                  })
                  this.couponList = res.data.availableCoupons
               }
               this.amountData = res.data
               if (res.data.selectedCoupon) {
                  this.selectedCoupon = res.data.selectedCoupon
                  // 找到对应的优惠券索引
                  if (res.data.availableCoupons) {
                     const index = res.data.availableCoupons.findIndex(coupon => coupon.id === res.data.selectedCoupon.id)
                     if (index !== -1) {
                        this.selectedCouponIndex = index
                     }
                  }
               }
            }
         },
         async calculateRemotePrice() {
            if (!this.sendStore || !this.form.arriveTime || !this.form.pickupTime) {
            if (!this.sendStore) {
               this.amountData = null
               return
            }
            if (!this.receiveStore && !this.receiveAddr) {
               this.amountData = null
               return
            }
            const luggageList = this.luggageTypes
@@ -778,6 +1059,7 @@
                  quantity: item.count
               }))
            if (luggageList.length === 0) {
               this.amountData = null
               return
            }
            let fromLat = ''
@@ -802,10 +1084,9 @@
               toLat: toLat,
               toLgt: toLgt,
               urgent: this.isUrgent,
               depositStartTime: this.form.arriveTime + ':00',
               depositEndTime: this.form.pickupTime + ':00',
               items: luggageList,
               declaredAmount: this.form.insurance || 0
               declaredAmount: this.form.insurance || 0,
               couponId: this.getCouponId()
            })
            if (res.code === 200) {
               res.data.itemList.forEach(item => {
@@ -813,18 +1094,33 @@
               })
               res.data.totalPrice = res.data.totalPrice / 100
               res.data.insuranceFee = res.data.insuranceFee / 100
               if (res.data.selectedCoupon) {
                  res.data.selectedCoupon.value = res.data.selectedCoupon.price / 100
               }
               if (res.data.availableCoupons) {
                  res.data.availableCoupons.forEach(coupon => {
                     coupon.value = coupon.price / 100
                  })
                  this.couponList = res.data.availableCoupons
               }
               this.serviceTimes = [
                  { id: 0, name: '标准达', serviceTime: res.data.standardHours, price: res.data.itemPrice / 100 },
                  { id: 1, name: '急速达', serviceTime: res.data.urgentHours, price: (res.data.urgentFee + res.data.itemPrice) / 100 }
               ]
               this.amountData = res.data
               if (res.data.selectedCoupon) {
                  this.selectedCoupon = res.data.selectedCoupon
                  // 找到对应的优惠券索引
                  if (res.data.availableCoupons) {
                     const index = res.data.availableCoupons.findIndex(coupon => coupon.id === res.data.selectedCoupon.id)
                     if (index !== -1) {
                        this.selectedCouponIndex = index
                     }
                  }
               }
            }
         },
         async createOrder() {
            if (!this.agreementChecked) {
               uni.showToast({ title: '请先阅读并同意用户服务协议及隐私政策', icon: 'none' })
               return
            }
            if (this.activeMode === 'local') {
               if (!this.selectedStore) {
                  uni.showToast({ title: '请选择门店', icon: 'none' })
@@ -840,8 +1136,22 @@
                  return
               }
            }
            if (!this.form.receiver) {
               uni.showToast({ title: '请输入收件人姓名', icon: 'none' })
               return
            }
            if (!this.form.mobile) {
               uni.showToast({ title: '请输入收件人电话', icon: 'none' })
               return
            }
            const mobileRegex = /^1\d{10}$/
            const landlineRegex = /^\d{3,4}-?\d{7,8}$/
            if (!mobileRegex.test(this.form.mobile) && !landlineRegex.test(this.form.mobile)) {
               uni.showToast({ title: '请输入正确的手机号或固定电话', icon: 'none' })
               return
            }
            if (!this.form.arriveTime) {
               uni.showToast({ title: '请选择预计到店时间', icon: 'none' })
               uni.showToast({ title: '请选择到店寄存时间', icon: 'none' })
               return
            }
            if (!this.form.pickupTime) {
@@ -849,7 +1159,7 @@
               return
            }
            if (new Date(this.form.pickupTime) <= new Date(this.form.arriveTime)) {
               uni.showToast({ title: '预计取件时间必须大于预计到店时间', icon: 'none' })
               uni.showToast({ title: '预计取件时间必须大于到店寄存时间', icon: 'none' })
               return
            }
            const luggageList = this.luggageTypes
@@ -860,6 +1170,26 @@
               }))
            if (luggageList.length === 0) {
               uni.showToast({ title: '请选择行李类型', icon: 'none' })
               return
            }
            if (!this.form.goodType) {
               uni.showToast({ title: '请选择物品信息', icon: 'none' })
               return
            }
            if (!this.form.goodsImages ||!this.form.goodsImages.length) {
               uni.showToast({ title: '请上传物品照片', icon: 'none' })
               return
            }
            if (!this.form.goodsImages ||!this.form.goodsImages.length) {
               uni.showToast({ title: '请上传物品照片', icon: 'none' })
               return
            }
            if (this.form.insurance === '' || this.form.insurance <= 0) {
               uni.showToast({ title: '请输入保价费', icon: 'none' })
               return
            }
            if (!this.agreementChecked) {
               uni.showToast({ title: '请先阅读并同意用户服务协议及隐私政策', icon: 'none' })
               return
            }
            const items = luggageList.map(item => ({
@@ -878,7 +1208,8 @@
               takePhone: this.form.mobile,
               takeUser: this.form.receiver,
               type: this.activeMode === 'local' ? 0 : 1,
               isUrgent: this.isUrgent
               isUrgent: this.isUrgent,
               couponId: this.getCouponId()
            }
            if (this.activeMode === 'local') {
               orderParams.depositShopId = this.selectedStore.id
@@ -925,9 +1256,11 @@
                  } else {
                     uni.showToast({ title: '支付失败', icon: 'none' })
                  }
                  uni.redirectTo({
                     url: '/pages/delivery-order-detail/delivery-order-detail?id=' + orderId
                  uni.setStorageSync("orderStatus",-2)
                  uni.switchTab({
                     url: '/pages/itinerary/itinerary'
                  });
               }
            })
         }
@@ -942,10 +1275,40 @@
      background: #f5f6f8;
   }
   .nav-bar {
      position: sticky;
      top: 0;
      left: 0;
      right: 0;
      background: #ffffff;
      z-index: 100;
      .nav-content {
         display: flex;
         align-items: center;
         justify-content: space-between;
         padding: 0 30rpx;
         .nav-left {
            width: 40rpx;
            height: 40rpx;
            display: flex;
            align-items: center;
            justify-content: center;
         }
         .nav-title {
            font-size: 34rpx;
            font-weight: 600;
            color: #333333;
         }
         .nav-right {
            width: 40rpx;
         }
      }
   }
   .top-gradient-bg {
      position: absolute;
      left: 0;
      top: 88rpx;
      top: 0;
      width: 100%;
      height: 480rpx;
      background: linear-gradient(180deg, #15b9f7 0%, #f7f7f7 100%);
@@ -967,8 +1330,8 @@
      position: relative;
      width: 50%;
      text-align: center;
      font-size: 28rpx;
      font-weight: 500;
       font-weight: 600;
       font-size: 32rpx;
      color: #9097a3;
   }
@@ -989,7 +1352,6 @@
   .page-scroll {
      position: relative;
      z-index: 1;
      height: calc(100vh - 88rpx - 186rpx - env(safe-area-inset-bottom));
   }
@@ -1001,8 +1363,7 @@
   .store-popup-wrap {
      background: #ffffff;
      border-radius: 24rpx 24rpx 0 0;
      padding: 0 30rpx;
      box-sizing: border-box;
      padding: 0 30rpx 16rpx 30rpx;
      box-sizing: border-box;
   }
@@ -1061,7 +1422,7 @@
   }
   .store-list-scroll {
      max-height: 70vh;
      max-height: 60vh;
      min-height: 50vh;
      margin-top: 30rpx;
   }
@@ -1126,16 +1487,20 @@
   .store-option-address-row {
      margin-top: 8rpx;
      display: flex;
      align-items: center;
      align-items: flex-start;
      flex-wrap: wrap;
   }
   .store-option-address-icon {
      flex-shrink: 0;
      width: 24rpx;
      height: 24rpx;
      margin-right: 4rpx;
      margin-top: 6rpx;
   }
   .store-option-address {
      flex: 1;
      font-size: 26rpx;
      color: #9ea4af;
   }
@@ -1402,6 +1767,26 @@
      color: #222222;
   }
   .form-value-wrap {
      display: flex;
      align-items: center;
      gap: 8rpx;
      flex: 1;
      justify-content: flex-end;
   }
   .form-value-text {
      font-weight: 400;
      font-size: 28rpx;
      color: #333333;
   }
   .form-value-placeholder {
      font-weight: 400;
      font-size: 28rpx;
      color: #B2B2B2;
   }
   .form-input {
      flex: 1;
      height: 88rpx;
@@ -1444,7 +1829,7 @@
   .luggage-item {
      display: flex;
      align-items: baseline;
      align-items: flex-end;
      justify-content: space-between;
      padding: 24rpx;
      box-sizing: border-box;
@@ -1470,6 +1855,9 @@
      height: 100rpx;
      border-radius: 8rpx;
      margin-right: 18rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #f0f1f4;
      overflow: hidden;
      margin-right: 24rpx;
@@ -1715,6 +2103,9 @@
      font-weight: 500;
      color: #333333;
      border: 2rpx solid transparent;
     white-space: nowrap; /* 防止文本换行 */
     overflow: hidden; /* 隐藏溢出的内容 */
     text-overflow: ellipsis; /* 显示省略号来代表被修剪的文本 */
      box-sizing: border-box;
   }
@@ -1806,6 +2197,24 @@
      color: #222222;
   }
   .amount-row-right {
      display: flex;
      align-items: center;
      gap: 8rpx;
   }
   .amount-row-placeholder {
      font-weight: 400;
      font-size: 30rpx;
      color: #999999;
   }
   .amount-row-discount {
      font-weight: 400;
      font-size: 30rpx;
      color: #FF4D4F;
   }
   .popup-agreement-bar {
      margin-top: 12rpx;
   }
@@ -1832,12 +2241,18 @@
      padding-bottom: 14rpx;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      justify-content: space-between;
      font-size: 22rpx;
   }
   .insurance-tip-label {
      color: #999999;
   }
   .insurance-tip-warning {
      color: #ff4d4f;
      font-size: 22rpx;
      font-weight: 400;
   }
   .insurance-tip-value {
@@ -1875,6 +2290,7 @@
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
      padding: 0 0 env(safe-area-inset-bottom);
      background: #ffffff;
      box-sizing: border-box;
@@ -1929,4 +2345,175 @@
   .active-submit-btn {
      background: #10B2FA;
   }
   /* 优惠券弹窗样式 */
   .coupon-popup-wrap {
      background: #ffffff;
      border-radius: 24rpx 24rpx 0 0;
      padding: 0 30rpx 16rpx 30rpx;
      box-sizing: border-box;
   }
   .coupon-popup-head {
      position: relative;
      height: 96rpx;
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .coupon-popup-title {
      font-weight: 600;
      font-size: 32rpx;
      color: #222222;
   }
   .coupon-popup-close {
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 56rpx;
      height: 56rpx;
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .coupon-list-scroll {
      max-height: 60vh;
      min-height: 20vh;
      padding-bottom: 20rpx;
   }
   .coupon-list-scroll-wu {
      width: 100%;
      height: 20vh;
      line-height: 20vh;
      text-align: center;
      font-weight: 400;
      font-size: 30rpx;
      color: #999999;
   }
   .coupon-item {
      background: #F7F8FA;
      border-radius: 16rpx;
      padding: 24rpx;
      margin-bottom: 16rpx;
      display: flex;
      flex-direction: column;
      gap: 20rpx;
      border: 2rpx solid transparent;
      transition: all 0.3s;
   }
   .coupon-item-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
   }
   .coupon-item-bottom {
      display: flex;
      justify-content: space-between;
      align-items: center;
   }
   .coupon-divider {
      height: 1rpx;
      background: repeating-linear-gradient(to right, #CCCCCC 0, #CCCCCC 8rpx, transparent 8rpx, transparent 16rpx);
      margin: 12rpx 0;
   }
   .coupon-item.active {
      background: #E6F7FF;
      border-color: #1890FF;
   }
   .coupon-item-left {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 12rpx;
   }
   .coupon-name {
      font-weight: 500;
      font-size: 30rpx;
      color: #222222;
   }
   .coupon-validity {
      font-weight: 400;
      font-size: 24rpx;
      color: #999999;
   }
   .coupon-usage {
      display: flex;
      align-items: center;
      gap: 8rpx;
      font-weight: 400;
      font-size: 24rpx;
      color: #666666;
   }
   .coupon-usage-label {
      font-weight: 400;
      font-size: 24rpx;
      color: #666666;
   }
   .coupon-usage-content {
   }
   .coupon-usage-text {
      font-weight: 400;
      font-size: 24rpx;
      color: #666666;
      line-height: 1.5;
   }
   .coupon-item-right {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 12rpx;
   }
   .coupon-amount {
      font-weight: 600;
      font-size: 32rpx;
      color: #FF4D4F;
   }
   .coupon-desc {
      font-weight: 400;
      font-size: 22rpx;
      color: #FF4D4F;
      border-radius: 12rpx;
   }
   .coupon-confirm-btn-wrap {
      padding: 24rpx 0;
   }
   .coupon-confirm-btn {
      height: 88rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      font-size: 32rpx;
      color: #FFFFFF;
      border-radius: 44rpx;
   }
   .coupon-value-red {
      font-weight: 400;
      font-size: 30rpx;
      color: #FF4D4F;
   }
</style>