MrShi
2025-07-19 e17698d3d99039b1c3532d490687f8492ca87704
small-program/pages/freight/freight.vue
@@ -6,20 +6,24 @@
               <view class="list-item-label-x"></view>
               <text>车辆及路线</text>
            </view>
            <view class="list-item-row" @click="show = true">
               <view class="list-item-row-label">车辆类型<b>*</b></view>
               <view class="list-item-row-val">
                  <text :style="{ color: form.categoryName ? '#111111' : '' }">{{form.categoryName ? form.categoryName : '请选择'}}</text>
                  <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
            <template v-if="!(info.type !== 2 && info.status === 2)">
               <view class="list-item-row" @click="show = true">
                  <view class="list-item-row-label">车辆类型<b>*</b></view>
                  <view class="list-item-row-val">
                     <text :style="{ color: form.categoryName ? '#111111' : '' }">{{form.categoryName ? form.categoryName : '请选择'}}</text>
                     <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                  </view>
               </view>
            </view>
            <view class="list-item-row" @click="show3 = true">
               <view class="list-item-row-label">货车型号<b>*</b></view>
               <view class="list-item-row-val">
                  <text :style="{ color: form.carUnit ? '#111111' : '' }">{{form.carUnit ? form.carUnit : '请选择'}}</text>
                  <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
               <view class="list-item-row" @click="show3 = true">
                  <view class="list-item-row-label">货车型号<b>*</b></view>
                  <view class="list-item-row-val">
                     <text :style="{ color: form.carUnit ? '#111111' : '' }">{{form.carUnit ? form.carUnit : '请选择'}}</text>
                     <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                  </view>
               </view>
            </view>
            </template>
            <view class="list-item-row" @click="show2 = true">
               <view class="list-item-row-label">用车时间<b>*</b></view>
               <view class="list-item-row-val">
@@ -27,132 +31,138 @@
                  <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 class="list-item-row-label-add" @click="addAddr">+增加途经点</view>
               </view>
               <view class="address">
                  <view class="address-item" @click="selectAddress(2)">
                     <view class="address-item-img">
                        <image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
                        <text :style="{color: form.location ? '#111111' : ''}">{{form.location ? form.location : '请选择起点'}}</text>
                     </view>
                     <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
            <template v-if="!(info.type !== 2 && info.status === 2)">
               <view class="list-item-row">
                  <view class="list-item-row-label">
                     运货地址<b>*</b>
                     <view class="list-item-row-label-add" @click="addAddr">+增加途经点</view>
                  </view>
                  <view class="address-item" v-for="(item, index) in form.wayInfoDTOList" :key="index" @click="selectAddress(4, index)">
                     <view class="address-item-img">
                        <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
                        <text :style="{color: item.location ? '#111111' : ''}">{{item.location ? item.location : '请选择途经地点'}}</text>
                  <view class="address">
                     <view class="address-item" @click="selectAddress(2)">
                        <view class="address-item-img">
                           <image src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
                           <text :style="{color: form.location ? '#111111' : ''}">{{form.location ? form.location : '请选择起点'}}</text>
                        </view>
                        <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                     </view>
                     <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>
                     <view class="address-item" v-for="(item, index) in form.wayInfoDTOList" :key="index" @click="selectAddress(4, index)">
                        <view class="address-item-img">
                           <image src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
                           <text :style="{color: item.location ? '#111111' : ''}">{{item.location ? item.location : '请选择途经地点'}}</text>
                        </view>
                        <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 class="address-item" @click="selectAddress(3)">
                        <view class="address-item-img">
                           <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
                           <text :style="{color: form.locationEnd ? '#111111' : ''}">{{form.locationEnd ? form.locationEnd : '请选择终点'}}</text>
                        </view>
                        <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                     </view>
                  </view>
                  <view class="address-item" @click="selectAddress(3)">
                     <view class="address-item-img">
                        <image src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
                        <text :style="{color: form.locationEnd ? '#111111' : ''}">{{form.locationEnd ? form.locationEnd : '请选择终点'}}</text>
                     </view>
               </view>
            </template>
         </view>
         <template v-if="!(info.type !== 2 && info.status === 2)">
            <view class="list-item">
               <view class="list-item-label">
                  <view class="list-item-label-x"></view>
                  <text>需求</text>
               </view>
               <view class="list-item-row" @click="show1 = true">
                  <view class="list-item-row-label">运输品种<b>*</b></view>
                  <view class="list-item-row-val">
                     <text :style="{ color: form.transportTypeName ? '#111111' : '' }">{{form.transportTypeName ? form.transportTypeName : '请选择'}}</text>
                     <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                  </view>
               </view>
            </view>
         </view>
         <view class="list-item">
            <view class="list-item-label">
               <view class="list-item-label-x"></view>
               <text>需求</text>
            </view>
            <view class="list-item-row" @click="show1 = true">
               <view class="list-item-row-label">运输品种<b>*</b></view>
               <view class="list-item-row-val">
                  <text :style="{ color: form.transportTypeName ? '#111111' : '' }">{{form.transportTypeName ? form.transportTypeName : '请选择'}}</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-val">
                  <input type="number" v-model="form.priceNum2" disabled placeholder="1" />
                  <text>辆</text>
               </view>
            </view>
            <view class="list-item-row">
               <view class="list-item-row-label">运输重量/数量<b>*</b></view>
               <view class="list-item-row-val">
                  <input type="text" v-model="form.transportNum" placeholder="请输入" />
                  <text @click="show4 = true">{{form.transportUnit}}</text>
                  <u-icon name="arrow-down" color="#111111" size="16"></u-icon>
               </view>
            </view>
            <view class="list-item-row" v-if="viewStatus">
               <view class="list-item-row-label">需求补充</view>
               <view class="list-item-row-val">
                  <textarea cols="30" v-model="form.supplement" rows="10" placeholder="请输入" maxlength="200"></textarea>
               </view>
            </view>
            <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" 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 class="list-item-row">
                  <view class="list-item-row-label">用车数量<b>*</b></view>
                  <view class="list-item-row-val">
                     <input type="number" v-model="form.priceNum2" disabled placeholder="1" />
                     <text>辆</text>
                  </view>
                  <view class="upload-item" @click="uploadImg">
                     <u-icon name="plus" color="#999999" size="24"></u-icon>
                     <text>点击上传</text>
               </view>
               <view class="list-item-row">
                  <view class="list-item-row-label">运输重量/数量<b>*</b></view>
                  <view class="list-item-row-val">
                     <input type="text" v-model="form.transportNum" placeholder="请输入" />
                     <text @click="show4 = true">{{form.transportUnit}}</text>
                     <u-icon name="arrow-down" color="#111111" size="16"></u-icon>
                  </view>
               </view>
               <view class="list-item-row" v-if="viewStatus">
                  <view class="list-item-row-label">需求补充</view>
                  <view class="list-item-row-val">
                     <textarea cols="30" v-model="form.supplement" rows="10" placeholder="请输入" maxlength="200"></textarea>
                  </view>
               </view>
               <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" v-for="(item, index) in form.multifileList" :key="index">
                        <image :src="item.url || item.fileurlFull" 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" @click="uploadImg">
                        <u-icon name="plus" color="#999999" size="24"></u-icon>
                        <text>点击上传</text>
                     </view>
                  </view>
               </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 class="list-item-label-x"></view>
                  <text>费用</text>
               </view>
               <view class="list-item-cate">
                  <view :class="item.id === form.carType ? 'list-item-cate-item active' : 'list-item-cate-item'" v-for="(item, index) in ff" :key="index" @click="form.carType = item.id">按天付费</view>
               </view>
               <view class="list-item-row">
                  <view class="list-item-row-label">天数</view>
                  <view class="list-item-row-val">
                     <input type="number" v-model="form.priceNum1" disabled placeholder="请输入" />
                     <text>天</text>
                  </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" @blur="getPrice" v-model="form.price" placeholder="请输入" />
                     <text>{{form.priceUnit}}</text>
                  </view>
               </view>
            </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 class="list-item-label-x"></view>
               <text>费用</text>
            </view>
            <view class="list-item-cate">
               <view :class="item.id === form.carType ? 'list-item-cate-item active' : 'list-item-cate-item'" v-for="(item, index) in ff" :key="index" @click="form.carType = item.id">按天付费</view>
            </view>
            <view class="list-item-row">
               <view class="list-item-row-label">天数</view>
               <view class="list-item-row-val">
                  <input type="number" v-model="form.priceNum1" disabled placeholder="请输入" />
                  <text>天</text>
            <view class="list-item">
               <view class="list-item-label">
                  <view class="list-item-label-x"></view>
                  <text>联系人信息</text>
                  <text class="list-item-label-info">默认发单方联系方式,可修改联系人</text>
               </view>
               <view class="list-item-row">
                  <view class="list-item-row-label">联系人姓名</view>
                  <view class="list-item-row-val">
                     <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="text" v-model="form.linkPhone" maxlength="11" placeholder="请补充" />
                  </view>
               </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" @blur="getPrice" v-model="form.price" placeholder="请输入" />
                  <text>{{form.priceUnit}}</text>
               </view>
            </view>
         </view>
         <view class="list-item">
            <view class="list-item-label">
               <view class="list-item-label-x"></view>
               <text>联系人信息</text>
               <text class="list-item-label-info">默认发单方联系方式,可修改联系人</text>
            </view>
            <view class="list-item-row">
               <view class="list-item-row-label">联系人姓名</view>
               <view class="list-item-row-val">
                  <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="text" v-model="form.linkPhone" maxlength="11" placeholder="请补充" />
               </view>
            </view>
         </view>
         </template>
      </view>
      <view style="width: 100%; height: calc(214rpx + env(safe-area-inset-bottom));"></view>
      <view class="footer">
@@ -228,12 +238,14 @@
      },
      data() {
         return {
            info: {},
            show: false,
            show1: false,
            show2: false,
            show3: false,
            show4: false,
            form: {
               id: null,
               startDate: '',
               endDate: '',
               lat: '',
@@ -284,22 +296,41 @@
            }
         }
      },
      onLoad() {
         const res = uni.getStorageSync('carData');
         this.form.linkPhone = this.userInfo.telephone
         this.form.startDate = res.startDate
         this.form.endDate = res.endDate
         this.form.lat = res.lat
         this.form.lgt = res.lgt
         this.form.priceNum1 = res.days
         this.form.categoryId = res.categoryId
         this.form.categoryName = res.categoryName
         this.form.location = res.location
         this.form.latEnd = res.latEnd
         this.form.lgtEnd = res.lgtEnd
         this.form.locationEnd = res.locationEnd
         this.form.wayInfoDTOList = res.wayInfoDTOList
         uni.removeStorageSync('carData');
      onLoad(option) {
         if (option.id) {
            this.form.id = option.id
            this.$u.api.getDetail({
               orderId: option.id
            }).then(res => {
               this.info = res.data
               for (const key in this.form) {
                  this.form[key] = res.data[key]
               }
               this.form.price = Number(this.form.price) / 100
               if (!this.form.multifileList) {
                  this.form.multifileList = []
               }
               if (!this.form.wayInfoDTOList) {
                  this.form.wayInfoDTOList = []
               }
            })
         } else {
            const res = uni.getStorageSync('carData');
            this.form.linkPhone = this.userInfo.telephone
            this.form.startDate = res.startDate
            this.form.endDate = res.endDate
            this.form.lat = res.lat
            this.form.lgt = res.lgt
            this.form.priceNum1 = res.days
            this.form.categoryId = res.categoryId
            this.form.categoryName = res.categoryName
            this.form.location = res.location
            this.form.latEnd = res.latEnd
            this.form.lgtEnd = res.lgtEnd
            this.form.locationEnd = res.locationEnd
            this.form.wayInfoDTOList = res.wayInfoDTOList
            uni.removeStorageSync('carData');
         }
         this.getCategoryLists()
      },
      methods: {
@@ -349,6 +380,7 @@
            })
         },
         uploadImg() {
            var that = this;
            uni.chooseImage({
               success: (chooseImageRes) => {
                  const tempFilePaths = chooseImageRes.tempFilePaths;
@@ -361,7 +393,7 @@
                     },
                     success: (uploadFileRes) => {
                        const res = JSON.parse(uploadFileRes.data)
                        this.form.multifileList.push({
                        that.form.multifileList.push({
                           fileurl: res.data.imgaddr,
                           name: res.data.originname,
                           url: res.data.url,