MrShi
2025-07-18 f650319d7175f764cd5286c383a72d6e6d2e8a87
small-program/pages/index/index.vue
@@ -5,23 +5,14 @@
         <view class="index-j-head">
            <view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
            <view class="index-c-title" :style="{ height: navHeight + 'px' }">
               <text>近快</text>
               <text>接单大厅</text>
            </view>
         </view>
         <view class="search" :style="{ top: statusbarHeight + navHeight + 'px' }">
            <view class="index-j-cate">
               <view class="index-j-cate-item">
                  <text>全部</text>
                  <view class="index-j-cate-item-x"></view>
               </view>
               <view class="index-j-cate-item">
                  <text>用工</text>
               </view>
               <view class="index-j-cate-item">
                  <text>运货</text>
               </view>
               <view class="index-j-cate-item">
                  <text>订餐</text>
               <view class="index-j-cate-item" v-for="(item, index) in searchType" :key="index" @click="clickCate(item.id)">
                  <text :style="{ color: typeVal === item.id ? '##222222' : '' }">{{item.name}}</text>
                  <view class="index-j-cate-item-x" v-if="typeVal === item.id"></view>
               </view>
            </view>
            <view class="index-j-search">
@@ -31,96 +22,49 @@
            </view>
         </view>
         <view class="index-j-list">
            <view class="index-list-item">
            <view class="index-list-item" v-for="(item, index) in orderList" :key="index">
               <view class="index-list-item-head">
                  <view class="index-list-item-head-l">
                     <view class="xoam"></view>
                     <text>订餐单</text>
                     <text v-if="item.type === 0 && item.workType === 0">用工单 - 采摘工</text>
                     <text v-else-if="item.type === 0 && item.workType === 1">用工单 - 分拣工</text>
                     <text v-else-if="item.type === 0 && item.workType === 2">用工单 - 包装工</text>
                     <text v-else-if="item.type === 1">运货单-{{item.categoryName}}-{{item.carUnit}}</text>
                     <text v-else-if="item.type === 2">订餐单</text>
                  </view>
                  <view class="index-list-item-head-r">距离 1.3km</view>
                  <view class="index-list-item-head-r">距离 {{item.distance}}km</view>
               </view>
               <view class="index-list-item-info">
                  午餐5元(30份)|晚餐8元(20份)
               <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 0">
                  {{item.categoryName}}|{{item.priceNum1}}斤
               </view>
               <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 1">
                  {{item.categoryName}}|{{item.priceNum1}}斤
               </view>
               <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2">
                  {{item.categoryName}}|{{item.priceNum1}}斤
               </view>
               <view class="index-list-item-info" v-if="item.type === 1">
                  {{item.categoryName}}|{{item.priceNum1}}斤
               </view>
               <view class="index-list-item-info" v-if="item.type === 2">
                  {{item.wayInfoCopy}}
               </view>
               <view class="index-list-item-dz">
                  <image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
                  <text>长江西路大蜀山森林公园西门保安室</text>
                  <text>{{item.location}}</text>
               </view>
               <view class="index-list-item-dz">
                  <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
                  <text>07-26 至 07-27(2天)</text>
                  <text>{{item.startDate}} 至 {{item.endDate}}({{item.priceNum1}}天)</text>
               </view>
               <view class="index-list-item-price">
                  <text>预估:</text>
                  <text>¥1000.00</text>
                  <text>¥{{item.estimatedAccount / 100}}</text>
               </view>
               <view class="eidt">
                  <sunui-mverify @change="mverify"></sunui-mverify>
               </view>
            </view>
            <view class="index-list-item">
               <view class="index-list-item-head">
                  <view class="index-list-item-head-l">
                     <view class="xoam"></view>
                     <text>运货单-小货车-厢式</text>
                  </view>
                  <view class="index-list-item-head-r">待接单方接单</view>
               </view>
               <view class="index-list-item-info">
                  葡萄|20000斤|需2辆
               </view>
               <view class="index-list-item-date">
                  <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
                  <text>07-26 至 07-27(2天)</text>
               </view>
               <view class="address">
                  <view class="address-xian"></view>
                  <view class="address-row">
                     <image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
                     <text>长江西路大蜀山森林公园西门保安室</text>
                  </view>
                  <view class="address-row">
                     <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
                     <text>长江西路大蜀山森林公园东门保安室</text>
                  </view>
                  <view class="address-row">
                     <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
                     <text>安徽莲花科技产业园豆米科技有限公司</text>
                  </view>
               </view>
               <view class="index-list-item-price">
                  <text>预估:</text>
                  <text>¥1000.00</text>
               </view>
               <view class="eidt">
                  <sunui-mverify @change="mverify"></sunui-mverify>
               </view>
            </view>
            <view class="index-list-item">
               <view class="index-list-item-head">
                  <view class="index-list-item-head-l">
                     <view class="xoam"></view>
                     <text>用工单-采摘工</text>
                  </view>
                  <view class="index-list-item-head-r">待接单</view>
               </view>
               <view class="index-list-item-info">
                  葡萄|2000斤
               </view>
               <view class="index-list-item-dz">
                  <image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
                  <text>长江西路大蜀山森林公园西门保安室</text>
               </view>
               <view class="index-list-item-dz">
                  <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
                  <text>07-26 至 07-27(2天)</text>
               </view>
               <view class="index-list-item-price">
                  <text>预估:</text>
                  <text>¥1000.00</text>
               </view>
               <view class="eidt">
                  <sunui-mverify @change="mverify"></sunui-mverify>
                  <sunui-mverify @change="mverify($event, item.id)"></sunui-mverify>
               </view>
            </view>
         </view>
@@ -146,119 +90,71 @@
            </view>
         </view>
         
         <!-- 订餐 -->
         <template v-if="typeId === 2">
            <view class="list">
               <view class="list-item">
                  <view class="list-item-label">时间地点</view>
                  <view class="list-item-row">
                  <view class="list-item-row" @click="show = true">
                     <view class="list-item-row-label">用餐日期<b>*</b></view>
                     <view class="list-item-row-val">
                        <text>请选择</text>
                        <text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate + '(' + form.days + '天)' : '请选择'}}</text>
                        <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                     </view>
                  </view>
                  <view class="list-item-row">
                     <view class="list-item-row-label">用餐时间<b>*</b></view>
                     <view class="list-item-row-radio">
                        <view class="radio-item">
                           <view class="radio-item-label">早餐</view>
                        <view class="radio-item" v-for="(item, index) in orderFood" :key="index">
                           <view class="radio-item-label">{{item.name}}</view>
                           <view class="radio-item-list">
                              <view class="radio-item-list-l">
                                 <view class="radio-item-list-item active">5元</view>
                                 <view class="radio-item-list-item">8元</view>
                                 <view class="radio-item-list-item">10元</view>
                                 <view :class="child.active ? 'radio-item-list-item active' : 'radio-item-list-item'" v-for="(child, childIndex) in item.list" :key="childIndex" @click="selectMenu(index, childIndex)">{{child.price}}元</view>
                              </view>
                              <view class="radio-item-list-data">
                                 <text>份数:</text>
                                 <input type="number" placeholder="0">
                                 <text style="color: #999999;">份</text>
                              </view>
                           </view>
                        </view>
                        <view class="radio-item">
                           <view class="radio-item-label">午餐</view>
                           <view class="radio-item-list">
                              <view class="radio-item-list-l">
                                 <view class="radio-item-list-item active">5元</view>
                                 <view class="radio-item-list-item">8元</view>
                                 <view class="radio-item-list-item">10元</view>
                              </view>
                              <view class="radio-item-list-data">
                                 <text>份数:</text>
                                 <input type="number" placeholder="0">
                                 <text style="color: #999999;">份</text>
                              </view>
                           </view>
                        </view>
                        <view class="radio-item">
                           <view class="radio-item-label">晚餐</view>
                           <view class="radio-item-list">
                              <view class="radio-item-list-l">
                                 <view class="radio-item-list-item active">5元</view>
                                 <view class="radio-item-list-item">8元</view>
                                 <view class="radio-item-list-item">10元</view>
                              </view>
                              <view class="radio-item-list-data">
                                 <text>份数:</text>
                                 <input type="number" placeholder="0">
                                 <input type="number" v-model="item.num" placeholder="请输入">
                                 <text style="color: #999999;">份</text>
                              </view>
                           </view>
                        </view>
                     </view>
                  </view>
                  <view class="list-item-row">
                  <view class="list-item-row" @click="selectAddress(1)">
                     <view class="list-item-row-label">用餐地点<b>*</b></view>
                     <view class="list-item-row-val">
                        <text>请选择</text>
                        <text>{{form.address ? form.address : '请选择'}}</text>
                        <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                     </view>
                  </view>
                  <view class="list-item-row">
                     <view class="list-item-row-label">地点描述</view>
                     <view class="list-item-row-val">
                        <input type="text" placeholder="请输入" />
                        <input type="text" v-model="form.locationRemark" placeholder="请输入" />
                     </view>
                  </view>
               </view>
               <view class="list-item">
                  <view class="list-item-label">需求</view>
                  <view class="list-item-row">
                     <view class="list-item-row-label">用餐人数<b>*</b></view>
                     <view class="list-item-row-user">
                        <view class="user-item">
                           <text>早餐</text>
                           <input type="text" placeholder="请输入" />
                           <text>份</text>
                        </view>
                        <view class="user-item">
                           <text>午餐</text>
                           <input type="text" placeholder="请输入" />
                           <text>份</text>
                        </view>
                     </view>
                  </view>
                  <view class="list-item-row">
                  <view class="list-item-row" v-if="viewStatus">
                     <view class="list-item-row-label">需求补充</view>
                     <view class="list-item-row-val">
                        <textarea cols="30" rows="10" placeholder="请输入" maxlength="200"></textarea>
                        <textarea v-model="form.supplement" cols="30" rows="10" placeholder="请输入" maxlength="200"></textarea>
                     </view>
                  </view>
                  <view class="list-item-row">
                  <view class="list-item-row" v-if="viewStatus">
                     <view class="list-item-row-label">图片</view>
                     <view class="list-item-row-upload">
                        <view class="upload-item">
                           <image src="/static/logo.png" mode="widthFix"></image>
                        <view class="upload-item" v-for="(item, index) in form.multifileList" :key="index">
                           <image :src="item.url" mode="widthFix"></image>
                           <image class="upload-item-dele" @click="form.multifileList.splice(index, 1)" src="/static/icon/ic_delete1@2x.png" mode="widthFix"></image>
                        </view>
                        <view class="upload-item">
                        <view class="upload-item" @click="uploadImg">
                           <u-icon name="plus" color="#999999" size="24"></u-icon>
                           <text>点击上传</text>
                        </view>
                     </view>
                  </view>
                  <view class="list-item-zk">
                     <text>补充需求</text>
                     <u-icon name="arrow-down" color="#00BC12" size="16"></u-icon>
                  <view class="list-item-zk" @click="viewStatus = !viewStatus">
                     <text>{{viewStatus ? '收起' : '补充需求'}}</text>
                     <u-icon :name="viewStatus ? 'arrow-up' : 'arrow-down'" color="#00BC12" size="16"></u-icon>
                  </view>
               </view>
               <view class="list-item">
@@ -266,13 +162,13 @@
                  <view class="list-item-row">
                     <view class="list-item-row-label">联系人</view>
                     <view class="list-item-row-val">
                        <input type="text" placeholder="请输入" />
                        <input type="text" v-model="form.linkName" placeholder="请输入" />
                     </view>
                  </view>
                  <view class="list-item-row">
                     <view class="list-item-row-label">联系电话<b>*</b></view>
                     <view class="list-item-row-val">
                        <input type="number" placeholder="请输入" maxlength="11" />
                        <input type="number" v-model="form.linkPhone" placeholder="请输入" maxlength="11" />
                     </view>
                  </view>
               </view>
@@ -282,19 +178,13 @@
               <view class="footer-price">
                  <view class="footer-price-info">预估总费用</view>
                  <view class="footer-price-num">
                     <text>0</text>
                     <text>{{totalPrice}}</text>
                     <text>元</text>
                  </view>
               </view>
               <view class="footer-bottom">
                  <view class="footer-bottom-kf">
                     <image src="/static/logo.png" mode="widthFix"></image>
                     <text>客服</text>
                  </view>
                  <div class="footer-bottom-btn">
                     <text>立即下单</text>
                     <text>(服务完成后付款)</text>
                  </div>
               <view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
                  <view class="box-hz-btn-kf">客服</view>
                  <view class="box-hz-btn-next" @click="submit">下一步</view>
               </view>
            </view>
         </template>
@@ -412,7 +302,6 @@
      
      <!-- 选择日期范围 -->
      <u-calendar :show="show" color="#00BC12" mode="range" @close="show = false" @confirm="confirmDate"></u-calendar>
   </view>
</template>
@@ -422,7 +311,10 @@
   export default {
      components: { sunuiMverify },
      computed: {
         ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid'])
         ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid']),
         totalPrice() {
            return this.form.estimatedAccount / 100
         }
      },
      onShow(options){
         this.typeViewId = 0
@@ -443,6 +335,12 @@
               { name: '运货', id: 1 },
               { name: '订餐', id: 2 }
            ],
            searchType: [
               { name: '全部', id: '' },
               { name: '用工', id: 0 },
               { name: '运货', id: 1 },
               { name: '订餐', id: 2 }
            ],
            typeWork: [
               { name: '采摘工', id: 0 },
               { name: '分拣工', id: 1 },
@@ -453,6 +351,9 @@
            typeViewId: 0,
            carImage: '',
            carRemark: '',
            orderFood: [],
            viewStatus: false,
            
            form: {
               startDate: '',
@@ -465,14 +366,207 @@
               workType: 0,
               categoryId: '',
               categoryName: '',
               days: ''
            }
               days: '',
               locationRemark: '',
               supplement: '',
               multifileList: [],
               linkName: '',
               linkPhone: '',
               estimatedAccount: '',
               price: ''
            },
            orderList: [],
            typeVal: '',
            page: 1
         }
      },
      onLoad() {
         this.getCategoryLists()
         this.getOrderList()
         this.form.linkPhone = this.userInfo.telephone
      },
      watch: {
         typeId: {
            handler(news, old) {
               this.form = {
                  startDate: '',
                  endDate: '',
                  latitude: '',
                  longitude: '',
                  location: '',
                  locationEnd: '',
                  wayInfoDTOList: [],
                  workType: 0,
                  categoryId: '',
                  categoryName: '',
                  days: '',
                  locationRemark: '',
                  supplement: '',
                  multifileList: [],
                  linkName: '',
                  linkPhone: '',
                  estimatedAccount: '',
                  price: ''
               }
               this.viewStatus = false
               this.carImage = ''
               this.carRemark = ''
            }
         },
         orderFood: {
            deep: true,
            handler(news, old) {
               let price = 0
               news.forEach(item => {
                  let num = 0
                  item.list.forEach(child => {
                     if (child.active) {
                        num = Number(child.price)
                     }
                  })
                  if (item.num && num > 0) {
                     price += num * item.num
                  }
               })
               this.form.price = price
            }
         },
         'form.price': {
            handler(news, old) {
               if (news > 0) {
                  this.getPrice()
               }
            }
         }
      },
      methods: {
         clickCate(id) {
            this.typeVal = id
            this.page = 1
            this.list = []
            this.getOrderList()
         },
         // 订单分页
         getOrderList() {
            this.$u.api.orderPage({
               capacity: 10,
               page: this.page,
               model: {
                  queryMyOrderType: 2,
                  type: this.typeVal
               }
            }).then(res => {
               res.data.records.forEach(item => {
                  // 订餐单
                  if (item.type === 2) {
                     item.wayInfoCopy = JSON.parse(item.wayInfo).map(item => {
                        return `${item.name}${item.price / 100}元(${item.num}份)`
                     }).join(' | ')
                  }
               })
               console.log(res.data.records)
               this.orderList = [...this.orderList, ...res.data.records]
            })
         },
         // 提交订单
         submit() {
            if (!this.form.startDate) {
               return uni.showToast({ title: '请选择用餐时间', icon: 'none' })
            }
            if (this.form.price === 0) {
               return uni.showToast({ title: '请选择用餐时间', icon: 'none' })
            }
            if (!this.form.address) {
               return uni.showToast({ title: '请选择用餐地点', icon: 'none' })
            }
            if (!this.form.linkPhone) {
               return uni.showToast({ title: '请输入联系电话', icon: 'none' })
            }
            let cateringDTOList = []
            this.orderFood.forEach(item => {
               item.list.forEach(child => {
                  if (child.active) {
                     cateringDTOList.push({
                        name: item.name,
                        num: item.num,
                        price: (Number(child.price) * Number(item.num)) * 100
                     })
                  }
               })
            })
            this.$u.api.release({
               ...this.form,
               type: 2,
               price: Number(this.form.price) * 100,
               priceNum1: this.form.days,
               location: this.form.address,
               lat: this.form.latitude,
               lgt: this.form.longitude,
               cateringDTOList
            }).then(res => {
               if (res.code == 200) {
                  wx.requestPayment({
                     timeStamp: res.data.object.timeStamp,
                     nonceStr: res.data.object.nonceStr,
                     package: res.data.object.packageVal,
                     signType: res.data.object.signType,
                     paySign: res.data.object.paySign,
                     success (res1) {
                        if (res1.errMsg = 'requestPayment:ok') {
                           uni.showToast({ title: '支付成功', icon: 'success', duration: 2000 });
                           setTimeout(() => {
                              uni.navigateTo({
                                 url: `/pages/success/success?orderId=${res.data.id}`
                              })
                           }, 1500)
                        }
                     },
                     fail(err) {
                        console.log(err)
                     }
                  })
               }
            })
            console.log(cateringDTOList)
         },
         uploadImg() {
            uni.chooseImage({
               success: (chooseImageRes) => {
                  const tempFilePaths = chooseImageRes.tempFilePaths;
                  uni.uploadFile({
                     url: this.$baseUrl + '/web/public/upload',
                     filePath: tempFilePaths[0],
                     name: 'file',
                     formData: {
                        'folder': 'orders'
                     },
                     success: (uploadFileRes) => {
                        const res = JSON.parse(uploadFileRes.data)
                        this.form.multifileList.push({
                           fileurl: res.data.imgaddr,
                           name: res.data.originname,
                           url: res.data.url,
                           type: 0
                        })
                     }
                  });
               }
            });
         },
         // 计算金额
         getPrice() {
            var that = this
            if (that.form.price && that.form.days) {
               that.$u.api.getTotal({
                  price: Number(that.form.price) * 100,
                  priceNum1: that.form.days,
                  type: 2
               }).then(res => {
                  that.form.estimatedAccount = res.data
               })
            }
         },
         addAddr() {
            this.form.wayInfoDTOList.push({
               lat: '',
@@ -485,6 +579,9 @@
            this.form.endDate = e[e.length - 1]
            this.form.days = e.length;
            this.show = false
            if (this.typeId === 2) {
               this.getPrice()
            }
         },
         selectAddress(type, index) {
            uni.chooseLocation({
@@ -585,8 +682,18 @@
               })
            }
         },
         mverify(e){
            console.log('验证结果:',e);
         mverify(e, id){
            console.log('验证结果:', e, id);
         },
         // 选择套餐
         selectMenu(a, b) {
            this.orderFood.forEach((item, index) => {
               if (index === a) {
                  item.list.forEach((child, childIndex) => {
                     child.active = b === childIndex
                  })
               }
            })
         },
         getCategoryLists() {
            this.$u.api.getCategoryList({ type: 1 })
@@ -596,6 +703,19 @@
                  this.form.categoryName = res.data[0].name
                  this.carRemark = res.data[0].remark
                  this.carImage = res.data[0].iconFull
               })
            this.$u.api.getCategoryList({ type: 2 })
               .then(res => {
                  res.data.forEach(item => {
                     item.num = ''
                     item.list = item.detailList.map(child => {
                        return {
                           active: false,
                           price: child
                        }
                     })
                  })
                  this.orderFood = res.data
               })
         }
      }
@@ -982,7 +1102,7 @@
                     .radio-item {
                        width: 100%;
                        display: flex;
                        align-items: center;
                        align-items: self-end;
                        margin-bottom: 30rpx;
                        &:last-child {
                           margin: 0 !important;
@@ -1002,6 +1122,8 @@
                              width: 100%;
                              display: flex;
                              align-items: center;
                              justify-content: space-between;
                              flex-wrap: wrap;
                              .active {
                                 background: #00BC12 !important;
                                 color: #ffffff !important;
@@ -1016,9 +1138,15 @@
                                 font-weight: 400;
                                 font-size: 28rpx;
                                 color: #111111;
                                 margin-right: 30rpx;
                                 &:last-child {
                                    margin: 0 !important;
                                 margin-top: 30rpx;
                                 &:nth-child(1) {
                                    margin-top: 0 !important;
                                 }
                                 &:nth-child(2) {
                                    margin-top: 0 !important;
                                 }
                                 &:nth-child(3) {
                                    margin-top: 0 !important;
                                 }
                              }
                           }
@@ -1040,6 +1168,10 @@
                                 color: #222222;
                                 text-align: right;
                                 margin: 0 30rpx;
                                 &::-webkit-input-placeholder {
                                    color: #999999;
                                    font-weight: 400;
                                 }
                              }
                           }
                        }
@@ -1063,6 +1195,7 @@
                        border-radius: 8rpx;
                        margin-right: 20rpx;
                        border: 2rpx solid #EEEEEE;
                        position: relative;
                        &:last-child {
                           margin: 0 !important;
                        }
@@ -1074,6 +1207,14 @@
                           font-size: 26rpx;
                           color: #666666;
                           margin-top: 16rpx;
                        }
                        .upload-item-dele {
                           position: absolute;
                           top: -20rpx;
                           right: -20rpx;
                           width: 40rpx;
                           height: 40rpx;
                           z-index: 9;
                        }
                     }
                  }
@@ -1171,52 +1312,82 @@
                  }
               }
            }
            .footer-bottom {
            .box-hz-btn {
               width: 100%;
               height: 88rpx;
               background-repeat: no-repeat;
               background-size: 100% 100%;
               display: flex;
               align-items: center;
               justify-content: space-between;
               .footer-bottom-kf {
               .box-hz-btn-kf {
                  flex-shrink: 0;
                  margin-right: 40rpx;
                  width: 188rpx;
                  height: 100%;
                  display: flex;
                  flex-direction: column;
                  align-items: center;
                  justify-content: center;
                  image {
                     width: 36rpx;
                     height: 36rpx;
                  font-weight: 500;
                  font-size: 32rpx;
                  color: #8B2300;
                  }
                  text {
                     font-weight: 400;
                     font-size: 24rpx;
                     color: #222222;
                     margin-top: 8rpx;
                  }
               }
               .footer-bottom-btn {
               .box-hz-btn-next {
                  flex: 1;
                  height: 88rpx;
                  height: 100%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  background: #00BC12;
                  box-shadow: 0rpx 8rpx 12rpx 0rpx rgba(91,190,56,0.16);
                  border-radius: 44rpx;
                  text {
                     &:nth-child(1) {
                        font-weight: 500;
                        font-size: 32rpx;
                        color: #FFFFFF;
                     }
                     &:nth-child(2) {
                        font-weight: 500;
                        font-size: 26rpx;
                        color: #FFFFFF;
                     }
                  }
               }
            }
            // .footer-bottom {
            //    width: 100%;
            //    display: flex;
            //    align-items: center;
            //    justify-content: space-between;
            //    .footer-bottom-kf {
            //       flex-shrink: 0;
            //       margin-right: 40rpx;
            //       display: flex;
            //       flex-direction: column;
            //       align-items: center;
            //       justify-content: center;
            //       image {
            //          width: 36rpx;
            //          height: 36rpx;
            //       }
            //       text {
            //          font-weight: 400;
            //          font-size: 24rpx;
            //          color: #222222;
            //          margin-top: 8rpx;
            //       }
            //    }
            //    .footer-bottom-btn {
            //       flex: 1;
            //       height: 88rpx;
            //       display: flex;
            //       align-items: center;
            //       justify-content: center;
            //       background: #00BC12;
            //       box-shadow: 0rpx 8rpx 12rpx 0rpx rgba(91,190,56,0.16);
            //       border-radius: 44rpx;
            //       text {
            //          &:nth-child(1) {
            //             font-weight: 500;
            //             font-size: 32rpx;
            //             color: #FFFFFF;
            //          }
            //          &:nth-child(2) {
            //             font-weight: 500;
            //             font-size: 26rpx;
            //             color: #FFFFFF;
            //          }
            //       }
            //    }
            // }
         }
         .box {
            width: 100%;