111

rk

2025-09-28 42c0d9901e9adbfbeea4a5abb1d901196ea0ffcb

 small-program/pages/using-workers/using-workers.vue

@@ -6,109 +6,355 @@
               <view class="list-item-label-x"></view>
               <text>时间地点</text>
            </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-val">
                  <text>请选择</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="请输入" />
               </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">
               <view class="list-item-row-label">采摘品种<b>*</b></view>
               <view class="list-item-row-val">
                  <text>请选择</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">
                  <text>请选择</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">
                  <textarea cols="30" rows="10" placeholder="请输入" maxlength="200"></textarea>
               </view>
            </view>
            <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>
            <template v-if="!(info.type !== 2 && info.status === 2)">
               <view class="list-item-row" @click="selectAddress()">
                  <view class="list-item-row-label">用工地点<b>*</b></view>
                  <view class="list-item-row-val">
                     <text style="width:80%;">{{form.location ? form.location : '请选择'}}</text>
                     <u-icon name="arrow-right" color="#111111" size="16"></u-icon>
                  </view>
                  <view class="upload-item">
                     <u-icon name="plus" color="#999999" size="24"></u-icon>
                     <text>点击上传</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.locationRemark" placeholder="请输入" />
                  </view> -->
                  <view class="list-item-row-val">
                     <textarea v-model="form.locationRemark" cols="30" rows="10" placeholder="请输入" maxlength="200"></textarea>
                  </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>{{form.categoryName ? form.categoryName : '请选择'}}</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="digit" v-model="form.priceNum1" @blur="getPrice" placeholder="请输入" />
                     <text>斤</text>
                  </view>
               </view>
               <view class="list-item-row"  >
                  <view class="list-item-row-label">需求补充</view>
                  <view class="list-item-row-val">
                     <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-label">图片</view>
                  <view class="list-item-row-upload">
                     <view class="upload-item" v-for="(item, index) in form.multifileList" :key="index" @click="preview(index, form.multifileList)">
                        <image :src="item.url || item.fileurlFull" 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" @click="uploadImg">
                        <u-icon name="plus" color="#999999" size="24"></u-icon>
                        <text>点击上传</text>
                     </view>
                     <view style="width: 215rpx; height: 0;"></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-row">
                  <view class="list-item-row-label">费用标准<b>*</b></view>
                  <view class="list-item-row-val">
                     <input v-model="form.price" type="digit" @blur="getPrice" placeholder="请输入" />
                     <text>元/斤</text>
                  </view>
               </view>
            </view>
            <view class="list-item-zk">
               <text>补充需求</text>
               <u-icon name="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-row">
               <view class="list-item-row-label">费用标准<b>*</b></view>
               <view class="list-item-row-val">
                  <input type="text" 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>
         </template>
			
      </view>
      <view style="width: 100%; height: calc(214rpx + env(safe-area-inset-bottom));"></view>
      <view class="footer">
         <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">
            <div class="footer-bottom-btn">
               <text>立即下单</text>
               <text>（服务完成后付款）</text>
            <div class="footer-bottom-btn" @click="submit" >
               <text>{{form.id?'确认修改':'立即下单'}}</text>
               <text v-if="!form.id">（服务完成后付款）</text>
            </div>
         </view>
         <view style="width: 100%; height: env(safe-area-inset-bottom);"></view>
      </view>
		
      <!-- 选择日期范围 -->
      <u-calendar
         :show="show"
         color="#00BC12"
         mode="range"
          :allowSameDay="true"
         @close="show = false"
         @confirm="confirmDate" />
		
      <!-- 选择品种 -->
      <u-picker
         :show="show1"
         :immediateChange="true"
         :columns="cateList"
         confirmColor="#00BC12"
         @confirm="confirmCategary"
         @cancel="show1 = false"
         keyName="name" />
   </view>
</template>

<script>
   import { mapState } from 'vuex'
   export default {
      computed: {
         ...mapState(['userInfo']),
         totalPrice() {
            return this.form.estimatedAccount / 100
         }
      },
      data() {
         return {
				
            info: {},
            show: false,
            show1: false,
            form: {
               id: null,
               days: '',
               startDate: '',
               endDate: '',
               lat: '',
               lgt: '',
               location: '',
               workType: 0,
               locationRemark: '',
               categoryId: '',
               categoryName: '',
               priceNum1: '',
               price: '',
               supplement: '',
               multifileList: [],
               linkName: '',
               linkPhone: '',
               priceUnit: '斤',
               estimatedAccount: '',
               type: 0
            },
            modify: false,
            cateList: [],
            viewStatus: true
         };
      },
      onLoad(option) {
         // 编辑
         if (option.id) {
            this.form.id = option.id
            this.$u.api.getDetail({
               orderId: option.id
            }).then(res => {
               if (res.code === 200) {
                  this.info = res.data
                  for (const key in this.form) {
                     this.form[key] = res.data[key]
                  }
                  this.form.days = res.data.totalDays
                  this.form.price = Number(this.form.price) / 100
                  if (!this.form.multifileList) {
                     this.form.multifileList = []
                  }
               }
					
            })
         } else {
            this.form.linkPhone = this.userInfo.telephone
            this.form.linkName = this.userInfo.name
            this.form.days = option.days
            this.form.startDate = option.startDate
            this.form.endDate = option.endDate
            this.form.lat = option.latitude
            this.form.lgt = option.longitude
            this.form.location = option.address
            this.form.workType = option.workType
         }
         this.getCateList()
      },
      methods: {
         preview(current, arr) {
            let urls = arr.map(item => item.url || item.fileurlFull)
            uni.previewImage({ current, urls })
         },
         // 提交订单
         submit() {
            var that = this;
            if (!this.form.categoryId) {
               return uni.showToast({ title: '请选择采摘品种', icon: 'none' })
            }
            if (!this.form.priceNum1) {
               return uni.showToast({ title: '请输入采摘重量', icon: 'none' })
            }
            if (!this.form.price) {
               return uni.showToast({ title: '请输入费用标准', icon: 'none' })
            }
            if (!this.form.linkPhone) {
               return uni.showToast({ title: '请输入联系电话', icon: 'none' })
            }
            if (!that.form.id) {
               uni.requestSubscribeMessage({
                  tmplIds: ['oVjOBLcHxIlGzOMJsdInmgI5CHGXh-UTvMzQqfFOnIg','AA97cHjvlPiNO4viMkVe4JifCf9TD5b5Eb7s6El3VS8'],
                  success(res) {
                     that.$u.api.release({ ...that.form, price: Number(that.form.price) * 100 })
                        .then(res => {
                           if (res.code == 200) {
                              uni.navigateTo({
                                 url: `/pages/success/success?orderId=${res.data.id}`
                              })
                           }
                        })
                  }
               })
            } else {
               // uni.requestSubscribeMessage({
               //    tmplIds: ['3YSC7gouRlSjHXz4CrWOGFzPmGwEBtFj4snwdfMvKHk'],
               //    success(res) {
                     that.$u.api.updateOrder({ ...that.form, price: Number(that.form.price) * 100  })
                        .then(res => {
                           if (res.code == 200) {
                              uni.showToast({
                                 title: '编辑成功',
                                 icon: 'success',
                                 mask: true,
                                 duration: 2000
                              })
                              setTimeout(() => {
                                 uni.navigateBack({ delta: 1 });
                                 // uni.$emit('refresh')
                              }, 1500)
                           }
                        })
               //    }
               // })
            }
         },
         // 计算金额
         getPrice() {
            if (this.form.price && this.form.priceNum1) {
               this.$u.api.getTotal({
                  price: Number(this.form.price) * 100,
                  priceUnit: this.form.priceUnit,
                  priceNum1: this.form.priceNum1,
                  priceNum2: 1,
                  type: this.form.type,
                  workType: this.form.workType
               }).then(res => {
                  if (res.code === 200) {
                     this.modify = true
                     this.form.estimatedAccount = res.data
                  }
               })
            }
         },
         confirmDate(e) {
            this.form.startDate = e[0]
            this.form.endDate = e[e.length - 1]
            this.form.days = e.length;
            this.show = false
         },
         selectAddress() {
            uni.chooseLocation({
               success: (res) => {
                  this.form.lat = res.latitude
                  this.form.lgt = res.longitude
                  this.form.address = res.name || res.address
               }
            });
         },
         confirmCategary(e) {
            this.form.categoryId = e.value[0].id
            this.form.categoryName = e.value[0].name
            this.show1 = false
         },
         getCateList() {
            this.$u.api.getCategoryList({
               type: 0
            }).then(res => {
               if (res.code === 200) {
                  this.cateList = [res.data]
               }
            })
         },
         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
                           })
                        }
                     });
                  }
               }
            });
         }
      }
   }
</script>
@@ -233,6 +479,12 @@
                  font-weight: 600;
                  font-size: 32rpx;
                  color: #222222;
               }
               .list-item-label-info {
                  font-weight: 400;
                  font-size: 26rpx;
                  color: #999999;
                  margin-left: 26rpx;
               }
               .list-item-label-x {
                  width: 6rpx;
@@ -382,20 +634,22 @@
                  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: 215rpx;
                     height: 215rpx;
                     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;
                     margin-bottom: 15rpx;
                     &:last-child {
                        margin: 0 !important;
                     }
@@ -408,6 +662,14 @@
                        color: #666666;
                        margin-top: 16rpx;
                     }
                     .upload-item-dele {
                        position: absolute;
                        top: -20rpx;
                        right: -20rpx;
                        width: 40rpx;
                        height: 40rpx;
                        z-index: 9;
                     }
                  }
               }
               .list-item-row-val {