doum
2025-09-15 82735e4d46ac7b9969facef2acc8f8e793b68f71
small-program/pages/index/index.vue
@@ -1,142 +1,111 @@
<template>
   <view class="index">
      <!-- 接单方 -->
      <view class="index-j" v-if="type === 1">
      <view class="index-j" v-if="userInfo && userInfo.useIdentity === 1">
         <view class="kefubtn" @click="contactPhone()">
            <image style="width: 36rpx;height: 36rpx" src="/static/icon/ic_kefu.png" mode="widthFix"></image>
            <text>客服</text>
         </view>
         <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' : '', fontSize: typeVal === item.id ? '36rpx' : '', fontWeight: typeVal === item.id ? '600' : '' }">{{item.name}}</text>
                  <view class="index-j-cate-item-x" v-if="typeVal === item.id"></view>
               </view>
            </view>
            <view class="index-j-search">
               <view class="index-j-search-item active">最新发布</view>
               <view class="index-j-search-item">距离优先</view>
               <view class="index-j-search-item">价格从高到低</view>
               <view :class="sortType === item.id ? 'index-j-search-item active' : 'index-j-search-item'" v-for="(item, index) in sortList" :key="index" @click="clickSort(item.id)">{{item.name}}</view>
            </view>
         </view>
         <view class="index-j-list">
            <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 class="index-list-item" v-if="orderList && orderList.length" v-for="(item, index) in orderList" :key="index">
               <view  @click="goOrderDetail(item.id)">
                  <view class="index-list-item-head" >
                     <view class="index-list-item-head-l">
                        <view class="xoam"></view>
                        <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}}</text>
                        <text v-else-if="item.type === 2">订餐单</text>
                     </view>
                     <view class="index-list-item-head-r">{{item.distance}}km</view>
                  </view>
                  <view class="index-list-item-head-r">距离 1.3km</view>
               </view>
               <view class="index-list-item-info">
                  午餐5元(30份)|晚餐8元(20份)
               </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 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.priceNum2}}人
                  </view>
                  <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2&& item.carType === 0">
                     {{item.categoryName}}|{{item.priceNum1}}天 |{{item.priceNum2}}人
                  </view>
                  <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2&& item.carType === 1">
                     {{item.categoryName}}|{{item.priceNum1}}小时 |{{item.priceNum2}}人
                  </view>
                  <view class="index-list-item-info" v-if="item.type === 0 && item.workType === 2&& item.carType === 2">
                     {{item.categoryName}}|{{item.priceNum1}}斤
                  </view>
                  <view class="index-list-item-info" v-if="item.type === 1">
                     {{item.carUnit}} | {{item.transportTypeName}} | {{item.transportNum}}{{item.transportUnit}}|用车{{item.priceNum1}}{{item.carType === 0?"天":"次"}}
                  </view>
                  <view class="index-list-item-info" v-if="item.type === 2">
                     {{item.wayInfoCopy}}
                  </view>
                  <view class="address" v-if="item.type === 1">
                     <view class="address-xian"></view>
                     <view class="address-row" v-if="item.wayInfo" v-for="(address, i) in item.wayInfo" :key="i">
                        <image src="/static/icon/ic_qidian@2x.png" mode="widthFix" v-if="i === 0"></image>
                        <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix" v-else-if="i !== 0 && i !== item.wayInfo.length - 1"></image>
                        <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix" v-else-if="i === item.wayInfo.length - 1"></image>
                        <text>{{address.location}}</text>
                     </view>
                  </view>
                  <template v-if="[0, 2].includes(item.type)">
                     <view class="index-list-item-dz">
                        <image src="/static/icon/order_ic_location@2x.png" mode="widthFix"></image>
                        <text>{{item.location}}</text>
                     </view>
                     <view class="index-list-item-dz">
                        <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
                        <text>{{item.startDate}} 至 {{item.endDate}}({{item.totalDays}}天)</text>
                     </view>
                  </template>
                  <view class="index-list-item-price">
                     <text>预估:</text>
                     <text>¥{{item.estimatedAccount / 100}}</text>
                  </view>
               </view>
               <view class="eidt">
                  <sunui-mverify @change="mverify"></sunui-mverify>
                  <!-- <sunui-mverify @change="getaccept($event, item.id, index)"></sunui-mverify> -->
                  <view class="eidt-btn" @click="show1 = true, orderId = item.id">抢单</view>
               </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>
               </view>
            </view>
            <view v-if="orderList && orderList.length&& !next" class="more">已加载全部</view>
            <view v-if="(!orderList || !orderList.length)&& !next"  class="more">暂无订单哦</view>
         </view>
      </view>
      <!-- 发单方 -->
      <view class="index-c" v-if="type === 0">
      <!-- 发单方  -->
      <view class="index-c" v-if="!isLogin || !userInfo || userInfo.useIdentity === 0">
         <view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
         <view class="index-c-title" :style="{ height: navHeight + 'px' }">
         <view class="index-c-title" :style="{ height: navHeight + 'px' }" @click="selectAddress(-1)">
            <text class="index-c-title-logo">近快</text>
            <image class="dingwei" src="/static/icon/home_ic_location@2x.png" mode="widthFix"></image>
            <text>西湖国际广场</text>
            <text>{{location.address || address || '获取地址失败'}}</text>
            <image class="qu" src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
         </view>
         
         <view class="index-c-cate">
            <view
               v-if="type"
               :class="typeId === item.id ? 'index-c-cate-item active' : 'index-c-cate-item'"
               v-for="(item, index) in type"
               :key="index"
@@ -145,133 +114,87 @@
            </view>
         </view>
         
         <template v-if="typeId === 3">
         <!-- 订餐 -->
         <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-if="orderFood" 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 v-if="item.list" :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||0}}元</view>
                              </view>
                              <view class="radio-item-list-data">
                                 <text>份数:</text>
                                 <input type="number" placeholder="0">
                                 <text style="flex-shrink: 0;">份数:</text>
                                 <input type="digit" v-model="item.num" placeholder="请输入">
                                 <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">
                                 <text style="color: #999999;">份</text>
                                 <view class="radio-item-list-data-btn" @click="clear(index)">取消</view>
                              </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"  >
                     <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"  >
                     <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-if=" form.multifileList" v-for="(item, index) in form.multifileList" :key="index" @click="preview(index, form.multifileList)">
                           <image :src="item.url" mode="widthFix"></image>
                           <image class="upload-item-dele" @click.stop="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 style="width: 208rpx; height: 0;"></view>
                     </view>
                  </view>
                  <view class="list-item-zk">
                     <text>补充需求</text>
                     <u-icon name="arrow-down" color="#00BC12" size="16"></u-icon>
                  </view>
                  <!-- <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">
                  <view class="list-item-label">联系人信息</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.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>
@@ -281,187 +204,831 @@
               <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" @click="contactPhone()">客服</view>
                  <view class="box-hz-btn-next" @click="submit">立即下单</view>
               </view>
            </view>
         </template>
         
         <view class="box" v-if="typeId !== 3">
         <view class="box" v-if="typeId !== 2">
            <view class="box-hz" :style="{ minHeight: 'calc(100vh - env(safe-area-inset-bottom) - 94rpx - ' + ((navHeight + statusbarHeight) + 'px') + ')' }">
               
               <!-- 用工 -->
               <template v-if="typeId === 1">
               <template v-if="typeId === 0">
                  <view class="box-hz-cate">
                     <view :class="typeWorkId === item.id ? 'box-hz-cate-item active' : 'box-hz-cate-item'" v-for="(item, index) in typeWork" :key="index" @click="clickTypeWork(item.id)">
                     <view v-if="typeWork" :class="form.workType === item.id ? 'box-hz-cate-item active' : 'box-hz-cate-item'" v-for="(item, index) in typeWork" :key="index" @click="clickTypeWork(item.id)">
                        <text>{{item.name}}</text>
                        <view class="box-hz-cate-item-x" v-if="typeWorkId === item.id"></view>
                        <view class="box-hz-cate-item-x" v-if="form.workType === item.id"></view>
                     </view>
                  </view>
                  <view class="box-hz-list">
                     <view class="box-hz-list-item">
                     <view class="box-hz-list-item" @click="show = true">
                        <view class="box-hz-list-item-label"><text>用工时间:</text></view>
                        <view class="box-hz-list-item-val">
                        <view :class="form.startDate ? 'box-hz-list-item-val active' : 'box-hz-list-item-val'">
                           <view class="box-hz-list-item-val-left">
                              <image class="icon" src="/static/icon/ic_time@2x.png" mode="widthFix"></image>
                              <text>请选择用工时间</text>
                              <text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate : '请选择用工时间'}}</text>
                           </view>
                           <image class="icon1" src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                           <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                        </view>
                     </view>
                     <view class="box-hz-list-item">
                     <view class="box-hz-list-item" @click="selectAddress(1)">
                        <view class="box-hz-list-item-label"><text>用工地点:</text></view>
                        <view class="box-hz-list-item-val">
                        <view :class="form.address ? 'box-hz-list-item-val active' :'box-hz-list-item-val'">
                           <view class="box-hz-list-item-val-left">
                              <image class="icon" src="/static/icon/ic_location@2x.png" mode="widthFix"></image>
                              <text>请选择用工地点</text>
                              <text>{{form.address ? form.address : '请选择用工地点'}}</text>
                           </view>
                           <image class="icon1" src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                           <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                        </view>
                     </view>
                  </view>
               </template>
               
               <!-- 运货 -->
               <template v-if="typeId === 2">
                  <view class="box-hz-cate">
                     <view :class="carId === item.id ? 'box-hz-cate-item active' : 'box-hz-cate-item'" v-for="(item, index) in car" :key="index" @click="clickCar(item.id)">
               <template v-if="typeId === 1">
                  <scroll-view class="nav-scroll" scroll-x="true">
                     <view v-if="car" :class="form.categoryId === item.id ? 'nav-item active' : 'nav-item'" v-for="(item, index) in car" :key="index" @click="clickCar(item)">
                        <text>{{item.name}}</text>
                        <view class="box-hz-cate-item-x" v-if="carId === item.id"></view>
                        <view class="nav-item-x" v-if="form.categoryId === item.id"></view>
                     </view>
                  </view>
                  </scroll-view>
                  <view class="box-hz-car">
                     <view class="box-hz-car-image">
                        <image src="/static/image/ic_sanlunche@2x.png" mode="widthFix" v-if="carId === 1"></image>
                        <image src="/static/image/ic_xiaohuoche@2x.png" mode="widthFix" v-else-if="carId === 2"></image>
                        <image :src="carImage" mode="widthFix"></image>
                     </view>
                     <view class="box-hz-car-info" v-if="carId === 1">
                        厢长3.8~4.0米  载重1.5~2.0吨  载方12.3~18.4方
                     </view>
                     <view class="box-hz-car-info" v-else-if="carId === 2">
                        厢长3.8~4.0米  载重1.5~2.0吨  载方12.3~18.4方
                     <view class="box-hz-car-info" v-if="carRemark">
                        {{carRemark || ''}}
                     </view>
                  </view>
                  <view class="box-hz-list">
                     <view class="box-hz-list-item">
                     <view class="box-hz-list-item" @click="show = true">
                        <view class="box-hz-list-item-label"><text>用车时间:</text></view>
                        <view class="box-hz-list-item-val">
                        <view :class="form.startDate ? 'box-hz-list-item-val active' : 'box-hz-list-item-val'">
                           <view class="box-hz-list-item-val-left">
                              <image class="icon" src="/static/icon/ic_time@2x.png" mode="widthFix"></image>
                              <text>请选择用车时间</text>
                              <text>{{ form.startDate ? form.startDate + ' 至 ' + form.endDate : '请选择用车时间'}}</text>
                           </view>
                           <image class="icon1" src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                           <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                        </view>
                     </view>
                     <view class="box-hz-list-item">
                        <view class="box-hz-list-item-label">
                           <text>用车时间:</text>
                           <text>+增加途经点</text>
                           <text>用车地点:</text>
                           <text @click="addAddr">+增加途经点</text>
                        </view>
                        <view class="item-d">
                           <view class="item-d-row">
                           <view class="item-d-row" @click="selectAddress(2)">
                              <view class="item-d-row-icon">
                                 <image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
                              </view>
                              <view class="item-d-row-val">
                                 <text>请选择用车起点</text>
                                 <image src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                                 <text>{{form.address ? form.address : '请选择用车起点'}}</text>
                                 <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                              </view>
                           </view>
                           <view class="item-d-row">
                           <view class="item-d-row" v-if="form.wayInfoDTOList" v-for="(item, index) in form.wayInfoDTOList" :key="index" @click="selectAddress(4, index)">
                              <view class="item-d-row-icon">
                                 <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
                              </view>
                              <view class="item-d-row-val">
                                 <text style="color: #999999;">请选择途经地点</text>
                                 <image src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                                 <text>{{item.location ? item.location : '请选择途经地点'}}</text>
                                 <view style="display: flex; align-items: center; flex-shrink: 0;">
                                    <image src="/static/icon/ic_delete@2x.png" style="margin-right: 22rpx; width: 32rpx; height: 32rpx;" @click.stop="form.wayInfoDTOList.splice(index, 1)" mode="widthFix"></image>
                                    <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                                 </view>
                              </view>
                           </view>
                           <view class="item-d-row">
                           <view class="item-d-row" @click="selectAddress(3)">
                              <view class="item-d-row-icon">
                                 <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
                              </view>
                              <view class="item-d-row-val">
                                 <text>请选择用车终点</text>
                                 <image src="/static/icon/home_ar_next@2x.png" mode="widthFix"></image>
                                 <text>{{form.locationEnd ? form.locationEnd : '请选择用车终点'}}</text>
                                 <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                              </view>
                           </view>
                        </view>
                     </view>
                  </view>
               </template>
               <view class="box-hz-btn" :style="{ backgroundImage: 'url(' + btn + ')' }">
                  <view class="box-hz-btn-kf">客服</view>
                  <view class="box-hz-btn-next" @click="jump()">下一步</view>
                  <view class="box-hz-btn-kf"  @click="contactPhone()" >客服</view>
                  <view class="box-hz-btn-next"  @click="jump()" v-if="typeId  == 2">立即下单</view>
                  <view class="box-hz-btn-next"  @click="jump()" v-if="typeId !== 2">下一步</view>
               </view>
            </view>
         </view>
      </view>
      <!-- 选择日期范围 -->
      <u-calendar :show="show" color="#00BC12" :allowSameDay="true" mode="range" @close="show = false" @confirm="confirmDate"></u-calendar>
      <u-popup :show="showPhone" round="15" mode="bottom" :safeAreaInsetBottom="true"  @close="contactPhone()" :closeable="true" :closeOnClickOverlay="true">
         <view class="phone">
            <view class="phone-head">
               <view></view>
               <text>联系客服</text>
            </view>
            <view class="phone-item">
               <view>
                  <image style="width: 36rpx;height: 36rpx" src="/static/icon/ic_kefu.png" mode="widthFix"></image>
                  <button open-type="contact" plain="true" bindcontact="handleContact">在线客服</button>
               </view>
                <view class="line" v-if="serverPhone && serverPhone.length"></view>
            </view>
             <view class="phone-item" v-if="serverPhone" v-for="(item,index) in serverPhone"  :key="item" @click="contactPhoneDo(item)">
                <view>
                  <image src="/static/icon/ic_call@2x.png" mode="widthFix"></image>
                  <text>{{item}}</text>
               </view>
                <view class="line" v-if="index<serverPhone.length-1"></view>
             </view>
             <view style="width: 100%; height: 30rpx;"></view>
            <!-- <view class="phone-botton"  @click="contactPhone()" >关闭</view> -->
         </view>
      </u-popup>
      <u-modal
         title="温馨提示"
         :show="show1"
         closeOnClickOverlay
         showCancelButton
      >
         <view class="slot-content">
            是否确认抢单?
         </view>
         <view slot="confirmButton" style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
            <view class="btn1" @click="show1 = false">取消</view>
            <view class="btn2" @click="getaccept1">确认</view>
         </view>
      </u-modal>
      <u-modal
         title="支付未成功"
         :show="show2"
         closeOnClickOverlay
         showCancelButton
      >
         <view class="slot-content">
            请确认是否取消支付或查看订单继续支付?
         </view>
         <view slot="confirmButton" style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
            <view class="btn1" @click="show2 = false;payOrderId=null">取消支付</view>
            <view class="btn2" @click="goOrderDetail(payOrderId)">查看订单</view>
         </view>
      </u-modal>
   </view>
</template>
<script>
   import { mapState } from 'vuex'
   import sunuiMverify from '@/components/sunui-mverify/sunui-mverify.vue';
   var QQMapWX = require('@/utils/qqmap-wx-jssdk.js');
   export default {
      components: { sunuiMverify },
      computed: {
         ...mapState(['navHeight', 'statusbarHeight'])
         ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid', 'latitude', 'longitude','address']),
         totalPrice() {
            return this.form.estimatedAccount / 100
         }
      },
      data() {
         return {
            typeId: 1,
            typeWorkId: 1,
            carId: 1,
            showPhone:false,
            serverPhone:[],
            show: false,
            isLogin: false,
            typeId: 0,
            qqmapsdk: null,
            location:{
               latitude:null,
               longitude:null,
               address:null,
            },
            type: [
               { name: '用工', id: 1 },
               { name: '运货', id: 2 },
               { name: '订餐', id: 3 }
               { name: '用工', id: 0 },
               { name: '运货', id: 1 },
               { name: '订餐', id: 2 }
            ],
            searchType: [
               { name: '全部', id: '' },
               { name: '用工', id: 0 },
               { name: '运货', id: 1 },
               { name: '订餐', id: 2 }
            ],
            typeWork: [
               { name: '采摘工', id: 1 },
               { name: '分拣工', id: 2 },
               { name: '包装工', id: 3 }
               { name: '采摘工', id: 0 },
               { name: '分拣工', id: 1 },
               { name: '包装工', id: 2 }
            ],
            car: [
               { name: '三轮车', id: 1 },
               { name: '小货车', id: 2 }
            sortList: [
               { name: '最新发布', id: 0 },
               { name: '距离优先', id: 1 },
               { name: '价格从高到低', id: 2 }
            ],
            car: [],
            btn: require('@/static/image/btn.png'),
            type: 1
            typeViewId: 0,
            carImage: '',
            carRemark: '',
            orderFood: [],
            viewStatus: true,
            form: {
               startDate: '',
               endDate: '',
               latitude: '',
               longitude: '',
               location: '',
               locationEnd: '',
               wayInfoDTOList: [],
               workType: 0,
               categoryId: '',
               categoryName: '',
               days: '',
               locationRemark: '',
               supplement: '',
               multifileList: [],
               linkName: '',
               linkPhone: '',
               estimatedAccount: '',
               price: '',
               address: ''
            },
            sortType: 0,
            orderList: [],
            typeVal: '',
            page: 1,
            next: true,
            isOnce: true,
            show1: false,
            show2: false,
            orderId: null,
            payOrderId:null
         }
      },
      async onLoad() {
         await this.$onLaunched;
         console.log('2')
         // if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}' && this.userInfo.useIdentity === 1) {
         //    this.getOrderList()
         // }
         this.getCategoryLists()
         this.getDictInfo()
         if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
            this.form.linkPhone = this.userInfo.telephone || ''
            this.form.linkName = this.userInfo.name || ''
         }
         this.qqmapsdk = new QQMapWX({
            key: '4PXBZ-JLBC7-LCLXG-P2SZX-C4HYE-LDBLQ'
         });
         uni.$on('clear', (data) => {
            this.form.startDate = ''
            this.form.endDate = ''
            this.form.latitude = ''
            this.form.longitude = ''
            this.form.location = ''
            this.form.locationEnd = ''
            this.form.wayInfoDTOList = []
            this.form.workType = 0
            this.form.days = ''
            this.form.locationRemark = ''
            this.form.supplement = ''
            this.form.multifileList = []
            this.form.estimatedAccount = ''
            this.form.price = ''
            this.form.address = ''
            this.clearAll()
         })
         // 刷新首页数据
         uni.$on('refresh', () => {
            this.getCategoryLists()
            this.getDictInfo()
            if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
               this.form.linkPhone = this.userInfo.telephone
            }
         })
      },
      async onShow(options) {
         await this.$onLaunched;
         if(this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}') {
            console.log('已登陆')
            this.isLogin = true
            // this.typeViewId = this.userInfo.useIdentity
            // !this.isOnce &&
            if (this.userInfo.useIdentity === 1) {
               console.log('已登陆111')
               this.page = 1
               this.next = true
               this.orderList = []
               this.getOrderList()
            }
         } else {
            this.isLogin = false
            console.log('未登陆')
         }
         // this.payOrderId=null
      },
      watch: {
         typeId: {
            handler(news, old) {
               this.clearFormParam()
            }
         },
         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
                  }
               })
               console.log("========================",price)
               this.form.price = price
            }
         },
         'form.price': {
            handler(news, old) {
               console.log(news,"==========",old)
               if (news != old) {
                  this.getPrice()
               }
            }
         }
      },
      onReachBottom() {
         if (this.token && this.token != '' && this.userInfo && JSON.stringify(this.userInfo) != '{}' && this.userInfo.useIdentity === 1) {
            this.getOrderList()
         }
      },
      methods: {
         clickType(e) {
            this.typeId = e
         preview(current, arr) {
            let urls = arr.map(item => item.url || item.fileurlFull)
            uni.previewImage({ current, urls })
         },
         clickTypeWork(e) {
            this.typeWorkId = e
         goOrderDetail(id){
            uni.navigateTo({
               url: '/pages/order-details/order-details?id='+id
            })
            var that =this
            setTimeout(function(){
               that.orderId=null
               that.payOrderId=null
               that.show2=false
            },1000)
         },
         clickCar(e) {
            this.carId = e
         clearFormParam(){
            this.form.startDate = ''
            this.form.address = ''
            this.form.endDate = ''
            this.form.latitude = ''
            this.form.longitude = ''
            this.form.location = ''
            this.form.locationEnd = ''
            this.form.wayInfoDTOList = []
            this.form.workType = 0
            this.form.days = ''
            this.form.locationRemark = ''
            this.form.supplement = ''
            this.form.multifileList = []
            this.form.estimatedAccount = ''
            this.form.price = ''
            this.viewStatus = false
            this.clearAll()
         },
         jump() {
            if (this.typeId === 1) {
               uni.navigateTo({
                  url: '/pages/using-workers/using-workers'
         clear(index) {
            this.orderFood[index].num = ''
            this.orderFood[index].list.forEach(item => {
               item.active = false
            })
         },
         clearAll() {
            this.orderFood.forEach(p=>{
               p.num=null
               p.list.forEach(item => {
                  item.active = false
               })
            })
         },
         getDictInfo(){
            var that = this;
            this.$u.api.getPlatformAboutUs({}).then(res =>{
                 that.serverPhone = (res.data.serverPhone||'').split(",")
            })
         },
         contactPhone(){
             this.showPhone = !this.showPhone
             console.log("==================================",this.showPhone)
         },
         contactPhoneDo(phone){
            if(phone !=null && phone!=''){
               uni.makePhoneCall({
                  phoneNumber: phone
               })
            }
         },
         mverify(e){
            console.log('验证结果:',e);
         // 手动接单
         getaccept() {
            var that = this;
            that.$u.api.accept({ orderId: this.orderId })
               .then(res1 => {
                  if (res1.code === 200) {
                     uni.showToast({ title: '抢单成功!', icon: 'success', duration: 2000 })
                     setTimeout(() => {
                        that.page = 1
                        that.next = true
                        that.orderList = []
                        that.getOrderList()
                        that.goOrderDetail(that.orderId)
                     }, 2000)
                  }
               })
         },
         getaccept1() {
            var that = this;
            this.show1 = false
            uni.requestSubscribeMessage({
               tmplIds: ['AA97cHjvlPiNO4viMkVe4JifCf9TD5b5Eb7s6El3VS8','3YSC7gouRlSjHXz4CrWOGFzPmGwEBtFj4snwdfMvKHk','tDpYImlrdv-0d3euTrHbYZ1cEZvjVHTNlqHvV0tpLHg'],
               success(res) {
                  that.getaccept()
               },
               fail(err) {
                  that.getaccept()
               }
            })
         },
         clickSort(id) {
            this.sortType = id
            this.page = 1
            this.next = true
            this.orderList = []
            this.getOrderList()
         },
         clickCate(id) {
            this.typeVal = id
            this.page = 1
            this.next = true
            this.orderList = []
            this.getOrderList()
         },
         // 订单分页
         getOrderList() {
            if (!this.next) return;
            this.$u.api.orderPage({
               capacity: 10,
               page: this.page,
               model: {
                  queryMyOrderType: 2,
                  type: this.typeVal,
                  sortType: this.sortType,
                  queryLat: uni.getStorageSync('address').latitude,
                  queryLgt: uni.getStorageSync('address').longitude
               }
            }).then(res => {
               if (res.code !== 200) return;
               this.isOnce = false
               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(' | ')
                  // 运货
                  } else if (item.type === 1) {
                     item.wayInfo = JSON.parse(item.wayInfo)
                  }
               })
               this.orderList = [...this.orderList, ...res.data.records]
               if (this.orderList.length === res.data.total) {
                  this.next = false
               } else {
                  this.page += 1
               }
            })
         },
         // 提交订单
         submit() {
            var that = this
            this.payOrderId=null
            if (!this.form.startDate) {
               return uni.showToast({ title: '请选择用餐时间', icon: 'none' })
            }
            let cateringDTOList = []
            let valid = true
            let msg ='请选择'
            that.orderFood.forEach(item => {
               item.list.forEach(child => {
                  if (child.active) {
                     // (Number(child.price) * Number(item.num))
                     if( !item.num){
                        msg =msg +'【'+item.name+'】';
                        valid =false
                     }
                     cateringDTOList.push({
                        id:item.id,
                        name: item.name,
                        num: item.num,
                        price: child.price * 100
                     })
                  }
               })
            })
            if(!valid){
               return uni.showToast({ title: msg+'用餐份数', icon: 'none' })
            }
            if (cateringDTOList.length === 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' })
            }
            uni.requestSubscribeMessage({
               tmplIds: ['oVjOBLcHxIlGzOMJsdInmgI5CHGXh-UTvMzQqfFOnIg','AA97cHjvlPiNO4viMkVe4JifCf9TD5b5Eb7s6El3VS8'],
               success(res) {
                  that.$u.api.release({
                     ...that.form,
                     type: 2,
                     price: Number(that.form.price) * 100,
                     priceNum1: that.form.days,
                     location: that.form.address,
                     lat: that.form.latitude,
                     lgt: that.form.longitude,
                     cateringDTOList
                  }).then(res => {
                     if (res.code == 200) {
                        that.clearFormParam();
                        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) {
                              that.payOrderId = res.data.id
                              that.show2=true
                              console.log("=====================",    res.data.id,that.payOrderId,err)
                           }
                        })
                     }
                  })
                  console.log(cateringDTOList)
               },
               fail(err) {
                  console.log(err)
               }
            })
         },
         uploadImg() {
            uni.chooseImage({
               success: (chooseImageRes) => {
                  for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
                     uni.uploadFile({
                        url: this.$baseUrl + '/web/public/upload',
                        filePath: chooseImageRes.tempFilePaths[i],
                        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 => {
                  if (res.code === 200) {
                     that.form.estimatedAccount = res.data
                  }
               })
            }else{
               that.form.estimatedAccount = 0
            }
         },
         addAddr() {
            this.form.wayInfoDTOList.push({
               lat: '',
               lgt: '',
               location: ''
            })
         },
         confirmDate(e) {
            this.form.startDate = e[0]
            this.form.endDate = e[e.length - 1]
            let time = this.form.startDate == this.form.endDate ? 1 : 0
            this.form.days = e.length - time;
            this.show = false
            if (this.typeId === 2) {
               this.getPrice()
            }
         },
         selectAddress(type, index) {
            uni.chooseLocation({
               success: (res) => {
                  console.log("==================",res)
                  if ([1,2].includes(type)) {
                     this.form.latitude = res.latitude
                     this.form.longitude = res.longitude
                     this.form.address = res.name ||res.address
                  } else if (type === 3) {
                     this.form.locationEnd = res.name ||res.address
                     this.form.latEnd = res.latitude
                     this.form.lgtEnd = res.longitude
                  } else if (type === 4) {
                     this.form.wayInfoDTOList[index].lat = res.latitude
                     this.form.wayInfoDTOList[index].lgt = res.longitude
                     this.form.wayInfoDTOList[index].location = res.name||  res.address
                  }else if (type == -1) {
                     console.log(res)
                     this.location.latitude = res.latitude
                     this.location.longitude = res.longitude
                     this.location.address =res.name ||  res.address
                  }
               }
            });
         },
         clickType(e) {
            if (!this.token) {
               uni.navigateTo({
                  url: '/pages/login/login'
               })
               return
            }
            this.typeId = e
            if (e === 2) {
               this.form.categoryId = this.car[0].id
               this.form.categoryName = this.car[0].name
               this.carRemark = this.car[0].remark
               this.carImage = this.car[0].iconFull
            }
         },
         clickTypeWork(e) {
            this.form.workType = e
         },
         clickCar(item) {
            this.form.categoryId = item.id
            this.form.categoryName = item.name
            this.carImage = item.iconFull
            this.carRemark = item.remark
         },
         jump() {
            if(!this.userInfo || !this.token){
               uni.navigateTo({
                  url: '/pages/login/login'
               })
               return
            }
            const { form } = this;
            // 用工
            if (this.typeId === 0) {
               if (!form.startDate || !form.endDate) {
                  return uni.showToast({ title: '请选择用工时间', icon: 'none' })
               } else if (!form.latitude || !form.longitude) {
                  return uni.showToast({ title: '请选择用工地点', icon: 'none' })
               }
               // 采摘工
               if (this.form.workType === 0) {
                  uni.navigateTo({
                     url: `/pages/using-workers/using-workers?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
                  })
               // 分拣工
               } else if (this.form.workType === 1) {
                  uni.navigateTo({
                     url: `/pages/sorting/sorting?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
                  })
               // 包装工
               } else if (this.form.workType === 2) {
                  uni.navigateTo({
                     url: `/pages/packaging-worker/packaging-worker?days=${form.days}&startDate=${form.startDate}&endDate=${form.endDate}&latitude=${form.latitude}&longitude=${form.longitude}&address=${form.address}&workType=${form.workType}`
                  })
               }
            // 运货
            } else if (this.typeId === 1) {
               if (!form.startDate || !form.endDate) {
                  return uni.showToast({ title: '请选择用车时间', icon: 'none' })
               } else if (!form.latitude || !form.longitude) {
                  return uni.showToast({ title: '请选择用车起点', icon: 'none' })
               } else if (!form.latEnd || !form.lgtEnd) {
                  return uni.showToast({ title: '请选择用车终点', icon: 'none' })
               }
               let carData = {
                  startDate: form.startDate,
                  endDate: form.endDate,
                  lat: form.latitude,
                  lgt: form.longitude,
                  location: form.address,
                  latEnd: form.latEnd,
                  lgtEnd: form.lgtEnd,
                  locationEnd: form.locationEnd,
                  wayInfoDTOList: form.wayInfoDTOList,
                  categoryId: form.categoryId,
                  categoryName: form.categoryName,
                  days: form.days
               }
               uni.setStorageSync('carData', carData);
               uni.navigateTo({
                  url: `/pages/freight/freight`
               })
            }
         },
         // 选择套餐
         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 })
               .then(res => {
                  if (res.code === 200) {
                     this.car = res.data
                     this.form.categoryId = res.data[0].id
                     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 => {
                  if (res.code === 200) {
                     res.data.forEach(item => {
                        item.num = ''
                        item.list = item.detailList.map(child => {
                           return {
                              active: false,
                              price: child
                           }
                        })
                     })
                     this.orderFood = res.data
                  }
               })
         }
      }
   }
@@ -476,7 +1043,64 @@
<style lang="scss" scoped>
   .index {
      width: 100%;
      .slot-content {
         width: 100%;
         text-align: center;
         font-weight: 400;
         font-size: 30rpx;
         color: #333333;
         margin: 30rpx 0;
      }
      .btn1 {
         width: 264rpx;
         height: 88rpx;
         line-height: 88rpx;
         text-align: center;
         font-weight: 400;
         font-size: 32rpx;
         color: #666666;
         border-radius: 44rpx;
         border: 1rpx solid #B2B2B2;
      }
      .btn2 {
         width: 264rpx;
         height: 88rpx;
         line-height: 88rpx;
         text-align: center;
         font-weight: 500;
         font-size: 32rpx;
         color: #FFFFFF;
         background: #00BC12;
         border-radius: 44rpx;
      }
      .index-j {
         .kefubtn{
            background-color: white;
            display: flex;
            justify-content: center;
            align-items: center;
            position: fixed;
            bottom: 100rpx;
            flex-direction: column;
            right:30rpx;
            height: 88rpx;
            width: 88rpx;
            border: 1rpx solid #f2f2f2;
            border-radius: 50%;
            image{
               width: 36rpx;
               width: 36rpx;
            }
            text{
               width: 44rpx;
               height: 32rpx;
               font-weight: 400;
               font-size: 22rpx;
               color: #222222;
               line-height: 32rpx;
               text-align: center;
            }
         }
         width: 100%;
         .index-j-head {
            width: 100%;
@@ -564,6 +1188,13 @@
            width: 100%;
            padding: 24rpx 30rpx;
            box-sizing: border-box;
            .more{
               width: 100%;
               margin-top: 40rpx;
               text-align: center;
               font-size: 24rpx;
               color: #666666;
            }
            .index-list-item {
               width: 100%;
               padding: 30rpx;
@@ -582,6 +1213,17 @@
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  .eidt-btn {
                     width: 100%;
                     height: 88rpx;
                     line-height: 88rpx;
                     text-align: center;
                     background: #00BC12;
                     border-radius: 44rpx;
                     font-weight: 500;
                     font-size: 32rpx;
                     color: #FFFFFF;
                  }
                  // background: #00BC12;
                  // border-radius: 50rpx;
                  // text {
@@ -728,7 +1370,7 @@
            padding: 0 30rpx;
            box-sizing: border-box;
            display: flex;
            align-items: center;
            align-items: center;
            .index-c-title-logo {
               font-weight: bold;
               font-size: 40rpx;
@@ -745,6 +1387,10 @@
               font-size: 32rpx;
               color: #ffffff;
               margin-right: 12rpx;
               max-width: 280rpx;
               white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;
            }
            .qu {
               width: 22rpx;
@@ -843,12 +1489,16 @@
                     padding: 30rpx 0;
                     box-sizing: border-box;
                     flex-direction: column;
                     border-bottom: 1rpx solid #E5E5E5;
                     // border-bottom: 1rpx solid #E5E5E5;
                     .radio-item {
                        width: 100%;
                        display: flex;
                        align-items: center;
                        align-items: flex-start;
                        margin-bottom: 30rpx;
                        border-bottom: 1rpx solid #E5E5E5;
                        &:last-child {
                           border: none;
                        }
                        &:last-child {
                           margin: 0 !important;
                        }
@@ -867,6 +1517,8 @@
                              width: 100%;
                              display: flex;
                              align-items: center;
                              justify-content: space-between;
                              flex-wrap: wrap;
                              .active {
                                 background: #00BC12 !important;
                                 color: #ffffff !important;
@@ -881,9 +1533,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;
                                 }
                              }
                           }
@@ -893,6 +1551,19 @@
                              align-items: center;
                              justify-content: flex-end;
                              margin-top: 42rpx;
                              margin-bottom: 34rpx;
                              .radio-item-list-data-btn {
                                 width: 110rpx;
                                 height: 64rpx;
                                 line-height: 64rpx;
                                 margin-left: 20rpx;
                                 font-weight: 400;
                                 font-size: 24rpx;
                                 color: #666666;
                                 text-align: center;
                                 border: 1rpx solid #B2B2B2;
                                 border-radius: 34rpx;
                              }
                              text {
                                 font-weight: 400;
                                 font-size: 30rpx;
@@ -905,6 +1576,10 @@
                                 color: #222222;
                                 text-align: right;
                                 margin: 0 30rpx;
                                 &::-webkit-input-placeholder {
                                    color: #999999;
                                    font-weight: 400;
                                 }
                              }
                           }
                        }
@@ -914,20 +1589,21 @@
                     width: 100%;
                     display: flex;
                     align-items: center;
                     justify-content: space-between;
                     flex-wrap: wrap;
                     padding: 30rpx 0;
                     box-sizing: border-box;
                     .upload-item {
                        width: 156rpx;
                        height: 156rpx;
                        width: 208rpx;
                        height: 208rpx;
                        display: flex;
                        align-items: center;
                        flex-direction: column;
                        justify-content: center;
                        background: #F8F9FB;
                        border-radius: 8rpx;
                        margin-right: 20rpx;
                        border: 2rpx solid #EEEEEE;
                        position: relative;
                        &:last-child {
                           margin: 0 !important;
                        }
@@ -939,6 +1615,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;
                        }
                     }
                  }
@@ -1036,52 +1720,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;
                  }
                  text {
                     font-weight: 400;
                     font-size: 24rpx;
                     color: #222222;
                     margin-top: 8rpx;
                  }
                  font-weight: 500;
                  font-size: 32rpx;
                  color: #8B2300;
               }
               .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;
                     }
                  }
                  font-weight: 500;
                  font-size: 32rpx;
                  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%;
@@ -1105,9 +1819,12 @@
                  .box-hz-car-image {
                     width: 432rpx;
                     height: 200rpx;
                     display: flex;
                     align-items: center;
                     justify-content: center;
                     overflow: hidden;
                     image {
                        width: 100%;
                        height: 100%;
                     }
                  }
                  .box-hz-car-info {
@@ -1121,6 +1838,44 @@
                     border-radius: 16rpx;
                     margin-top: 30rpx;
                  }
               }
               .nav-scroll {
                   white-space: nowrap; /* 防止导航项换行 */
                  margin-bottom: 50rpx;
                  height: 66rpx;
                   overflow: auto; /* 允许滚动条出现 */
                  .nav-item {
                    display: inline-block; /* 使导航项水平排列 */
                    margin-right: 60rpx;
                    position: relative;
                    text {
                       font-weight: 400;
                       font-size: 30rpx;
                       color: #666666;
                    }
                    .nav-item-x {
                       width: 40rpx;
                       height: 6rpx;
                       position: absolute;
                       bottom: -10rpx;
                       left: 50%;
                       transform: translate(-50%, 0);
                       background: #FF5A40;
                       border-radius: 3rpx;
                    }
                    // padding: 10px 20px; /* 设置内边距 */
                    // margin-right: 10px; /* 设置右边距 */
                    // background-color: #f0f0f0; /* 设置背景色 */
                    // border: 1px solid #ddd; /* 设置边框 */
                    // border-radius: 5px; /* 设置圆角 */
                 }
                 .active {
                    text {
                       font-weight: 600 !important;
                       font-size: 32rpx !important;
                       color: #222222 !important;
                    }
                 }
               }
               .box-hz-cate {
                  width: 100%;
@@ -1170,7 +1925,8 @@
                        border: 2rpx solid #FD9E24;
                        .item-d-row {
                           width: 100%;
                           height: 100rpx;
                           // height: 100rpx;
                           height: auto;
                           display: flex;
                           align-items: center;
                           justify-content: space-between;
@@ -1186,7 +1942,9 @@
                           }
                           .item-d-row-val {
                              flex: 1;
                              height: 100%;
                              // height: 100%;
                              padding: 30rpx 0;
                              box-sizing: border-box;
                              display: flex;
                              align-items: center;
                              justify-content: space-between;
@@ -1251,7 +2009,7 @@
                              flex-shrink: 0;
                           }
                           text {
                              flex: 1;
                              width: 470rpx;
                              overflow: hidden;
                              text-overflow: ellipsis;
                              white-space: nowrap;
@@ -1259,11 +2017,6 @@
                              font-size: 32rpx;
                              color: #111111;
                           }
                        }
                        .icon1 {
                           flex-shrink: 0;
                           width: 30rpx;
                           height: 30rpx;
                        }
                     }
                  }
@@ -1311,5 +2064,68 @@
            }
         }
      }
      .phone {
         width: 100%;
         padding-top: 40rpx;
         box-sizing: border-box;
         .phone-botton {
            width: 100%;
            height: 88rpx;
            line-height: 88rpx;
            text-align: center;
            font-weight: 500;
            font-size: 32rpx;
            color: #FFFFFF;
            background: #00BC12;
            border-radius: 44rpx;
            margin-top: 60rpx;
         }
         .phone-head {
            width: 100%;
            text-align: center;
            justify-content: space-between;
            margin-bottom: 40rpx;
            text {
               font-weight: 800;
               font-size: 32rpx;
               color: #222222;
            }
         }
         .phone-item {
            width: 100%;
            text-align: center;
            display: flex;
            justify-content: center;
            flex-direction: column;
            // border-bottom: 1rpx solid #eeeeee;
            line-height: 78rpx;
            button{
               border: 1rpx white solid;
               display: inline;
               width: 300rpx;
               font-weight: 500;
               font-size: 32rpx;
               line-height: 32rpx;
               color: #222222;
            }
            image{
               width: 28rpx;
               height: 28rpx;
               margin-right: 30rpx;
            }
            .line{
               width: 100%;
               height: 1rpx;
               background-color: #f2f2f2
            }
            text {
               font-weight: 500;
               font-size: 28rpx;
               line-height: 28rpx;
               color: #222222;
            }
         }
      }
   }
</style>