#

whycq

2023-11-23 dffe79023e4adca58b226ac277736939231a318a

 pages/business/goBusiness/addgoBusiness.vue

@@ -1,36 +1,52 @@
<template>
   <view>
		

      <view class="card" v-for="item in form2">
         <!-- head -->
         <view class="card-head flex">
            <view class="card-head-title">{{item.title}}</view>
         </view>
         <!-- body -->
         <view class="card-body flex-column" v-for="subItem in item.info">
            <view class="flex"><text class="card-required" v-show="subItem.required">*</text>{{subItem.subTitle}}</view>
            <view class="flex">
               <view style="flex: 1;">
                  <input type="text" :placeholder="subItem.placeholder" :placeholder-style="subItem.placeholderStyle" v-model="subItem.value" :disabled="subItem.disabled" v-show="subItem.inputType != 'data'">
                  <uni-datetime-picker  v-model="subItem.value" :border="false" :red-color="subItem.placeholderStyle" v-if="subItem.inputType == 'data'" />
               </view>
					
               <view class="flex" style="width: 50rpx;" v-show="subItem.inputType == 'select'" @click="showPicker(subItem.type)"><uni-icons type="right" color="#000" ></uni-icons></view>
         <view class="card-body flex-column" v-for="subItem in item.info" v-show="!subItem.unshow">
            <view class="flex"><text class="card-required" v-show="subItem.required">*</text>{{subItem.subTitle}}
            </view>
            <view class="flex">
               <uni-combox :candidates="orderIds" placeholder="请选择项目" v-model="subItem.value"
                  @input="getOrderId(subItem.value)" v-show="subItem.inputType == 'chose'">
               </uni-combox>
					
               <view style="flex: 1;"  v-show="subItem.inputType != 'chose'">
						
                  <input type="text" :placeholder="subItem.placeholder"
                     :placeholder-style="subItem.placeholderStyle" v-model="subItem.value"
                     :disabled="subItem.disabled" v-show="subItem.inputType != 'data'">
                  <uni-datetime-picker v-model="subItem.value" :border="false"
                     :red-color="subItem.placeholderStyle" v-if="subItem.inputType == 'data'" />
               </view>

               <view class="flex" style="width: 50rpx;" v-show="subItem.inputType == 'select'"
                  @click="showPicker(subItem.type)"><uni-icons type="right" color="#000"></uni-icons></view>
            </view>
				
         </view>
			

      </view>
		
		
      <u-picker :show="businessTransportationShow" :columns="businessTransportations" @confirm="businessTransportationConfirm"></u-picker>


      <u-picker :show="businessTransportationShow" :columns="businessTransportations"
         @confirm="businessTransportationConfirm"></u-picker>
      <u-picker :show="businessReturnShow" :columns="businessReturns" @confirm="businessReturnConfirm"></u-picker>
      <u-picker :show="pcdShow" ref="uPicker" :columns="columns" @confirm="pcdStartConfirm" @change="changeHandler" :defaultIndex="defaultIndex"></u-picker>
      <u-picker :show="pcdEndShow" ref="uPicker" :columns="columns" @confirm="pcdEndConfirm" @change="changeHandler" :defaultIndex="defaultIndex"></u-picker>
      <u-picker :show="businessStartTimeDayShow" :columns="businessStartTimeDays" @confirm="businessStartTimeDayConfirm"></u-picker>
      <u-picker :show="businessEndTimeDayShow" :columns="businessEndTimeDays" @confirm="businessEndTimeDayConfirm"></u-picker>
		
      <u-picker :show="pcdShow" ref="uPicker" :columns="columns" @confirm="pcdStartConfirm" @change="changeHandler"
         :defaultIndex="defaultIndex"></u-picker>
      <u-picker :show="pcdEndShow" ref="uPicker" :columns="columns" @confirm="pcdEndConfirm" @change="changeHandler"
         :defaultIndex="defaultIndex"></u-picker>
      <u-picker :show="businessStartTimeDayShow" :columns="businessStartTimeDays"
         @confirm="businessStartTimeDayConfirm"></u-picker>
      <u-picker :show="businessEndTimeDayShow" :columns="businessEndTimeDays"
         @confirm="businessEndTimeDayConfirm"></u-picker>

      <view style="height: 120rpx;"></view>
		

      <view class="floor">
         <view class="default">重置</view>
         <view class="primary" @click="submit()">提交</view>
@@ -44,6 +60,11 @@
   export default {
      data() {
         return {
            id: 0,
            type: 'add',
            orderIds: [],
            orderId: '',
            orderIdList: [],
            year: '2021-5-3',
            placeholderStyle: 'font-size:20rpx',
            form: {
@@ -54,52 +75,293 @@
            defaultIndex: [],
            citysData: data.citysData,
            businessTransportationShow: false,
            businessTransportations: [['飞机','高铁','火车','汽车','摩托','电车','其他']],
            businessTransportations: [
               ['飞机', '高铁', '火车', '汽车', '摩托', '电车', '其他']
            ],
            businessReturnShow: false,
            businessReturns: [['单程','往返']],
            businessReturns: [
               ['单程', '往返']
            ],
            pcdShow: false,
            pcdEndShow: false,
            pcds: data.citysData,
            businessStartTimeDayShow: false,
            businessStartTimeDays: [['上午','下午']],
            businessEndTimeDayShow: false,
            businessEndTimeDays: [['上午','下午']],
            form2: [
               {title: '基本信息',info:[
                  {subTitle: '出差事由',placeholder: '请输入出差事由',placeholderStyle: 'font-size:20rpx', value: '',submitVal: '出差事由',type: 'businessTripReasons',inputType: 'input',required: true}
               ]},
               {title: '行程信息',info:[
                  {subTitle: '交通工具',placeholder: '请选择交通工具',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessTransportation',inputType: 'select',disabled:true,required: true},
                  {subTitle: '单程往返',placeholder: '请选择单程单程',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessReturn',inputType: 'select',disabled:true,required: true},
                  {subTitle: '车牌号',placeholder: '请输入车牌号',placeholderStyle: 'font-size:20rpx',value: '',type: 'carNumber',inputType: 'input',required: true},
                  {subTitle: '行程明细及公里数',placeholder: '请输入行程明细及公里数',placeholderStyle: 'font-size:20rpx',value: '',type: 'kilometers',inputType: 'input',required: true},
                  {subTitle: '出发地',placeholder: '请选择出发地',placeholderStyle: 'font-size:20rpx',value: '',type: 'pcdStart',inputType: 'select',disabled:true,required: true},
                  {subTitle: '出发地详细地址',placeholder: '请输入出发地详细地址',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessStartAddr',inputType: 'input',required: true},
                  {subTitle: '目的地',placeholder: '请选择目的地',placeholderStyle: 'font-size:20rpx',value: '',type: 'pcdEnd',inputType: 'select',disabled:true,required: true},
                  {subTitle: '目的地详细地址',placeholder: '请输入目的地详细地址',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessEndAddr',inputType: 'input',required: true},
               ]},
               {title: '日期信息',info:[
                  {subTitle: '出发日期',placeholder: '请选择出发日期',placeholderStyle: 'font-size:20rpx',value: '2021-5-3',type: 'businessStartTime',inputType: 'data',required: true},
                  {subTitle: '出发时辰',placeholder: '请选择出发时辰',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessStartTimeDay',inputType: 'select',disabled:true,required: true},
                  {subTitle: '结束日期',placeholder: '请选择结束日期',placeholderStyle: 'font-size:20rpx',value: '2021-5-3',type: 'businessEndTime',inputType: 'data',required: true},
                  {subTitle: '结束时辰',placeholder: '请选择结束时辰',placeholderStyle: 'font-size:20rpx',value: '',type: 'businessEndTimeDay',inputType: 'select',disabled:true,required: true}
               ]},
               {title: '基本信息',info:[
                  {subTitle: '同行人',placeholder: '请输入同行人',placeholderStyle: 'font-size:20rpx',value: '同行人',type: 'businessPeers',inputType: 'input',required: true},
                  {subTitle: '备注',placeholder: '备注信息',placeholderStyle: 'font-size:20rpx',value: '备注',inputType: 'input',type: 'businessNotes'}
               ]},
            businessStartTimeDays: [
               ['上午', '下午']
            ],
				
            businessEndTimeDayShow: false,
            businessEndTimeDays: [
               ['上午', '下午']
            ],
            form2: [{
                  title: '基本信息',
                  info: [{
                        subTitle: '项目名称',
                        placeholder: '请输入项目名称',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        submitVal: '',
                        type: 'orderId',
                        inputType: 'chose',
                        required: true,
                        unshow: false
                     },
                     {
                        subTitle: '出差事由',
                        placeholder: '请输入出差事由',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        submitVal: '出差事由',
                        type: 'businessTripReasons',
                        inputType: 'input',
                        required: true
                     },
                  ]
               },
               {
                  title: '行程信息',
                  info: [{
                        subTitle: '交通工具',
                        placeholder: '请选择交通工具',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessTransportation',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     },
                     {
                        subTitle: '单程往返',
                        placeholder: '请选择单程单程',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessReturn',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     },
                     {
                        subTitle: '车牌号',
                        placeholder: '请输入车牌号',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'carNumber',
                        inputType: 'input',
                        required: true
                     },
                     {
                        subTitle: '行程明细及公里数',
                        placeholder: '请输入行程明细及公里数',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'kilometers',
                        inputType: 'input',
                        required: true
                     },
                     {
                        subTitle: '出发地',
                        placeholder: '请选择出发地',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'pcdStart',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     },
                     {
                        subTitle: '出发地详细地址',
                        placeholder: '请输入出发地详细地址',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessStartAddr',
                        inputType: 'input',
                        required: true
                     },
                     {
                        subTitle: '目的地',
                        placeholder: '请选择目的地',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'pcdEnd',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     },
                     {
                        subTitle: '目的地详细地址',
                        placeholder: '请输入目的地详细地址',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessEndAddr',
                        inputType: 'input',
                        required: true
                     },
                  ]
               },
               {
                  title: '日期信息',
                  info: [{
                        subTitle: '出发日期',
                        placeholder: '请选择出发日期',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessStartTime',
                        inputType: 'data',
                        required: true
                     },
                     {
                        subTitle: '出发时辰',
                        placeholder: '请选择出发时辰',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessStartTimeDay',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     },
                     {
                        subTitle: '结束日期',
                        placeholder: '请选择结束日期',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessEndTime',
                        inputType: 'data',
                        required: true
                     },
                     {
                        subTitle: '结束时辰',
                        placeholder: '请选择结束时辰',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessEndTimeDay',
                        inputType: 'select',
                        disabled: true,
                        required: true
                     }
                  ]
               },
               {
                  title: '基本信息',
                  info: [{
                        subTitle: '同行人',
                        placeholder: '请输入同行人',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        type: 'businessPeers',
                        inputType: 'input',
                        required: true
                     },
                     {
                        subTitle: '备注',
                        placeholder: '备注信息',
                        placeholderStyle: 'font-size:20rpx',
                        value: '',
                        inputType: 'input',
                        type: 'businessNotes'
                     }
                  ]
               },
            ],

         }
      },
      onLoad(option) {
         let _this = this
         const eventChannel = this.getOpenerEventChannel();
         eventChannel.on('goBusinessDel', function(data) {
            if (data.data == 'add') {
               _this.getOrderId('')
            }
         })
         // 项目跟踪传过来的
         eventChannel.on('addType', function(data) {
            if (data.data.comeFrom == 'saleManage') {
               _this.form2[0].info[0].submitVal = data.data.orderId
               _this.form2[0].info[0].unshow = true
               _this.form2[0].info[0].required = false
            }
         })
         // 修改页面回传
			
         eventChannel.on('modiGoBusinessDetl', function(data) {
            if (data.data == 'modi') {
               _this.form2[0].info[0].unshow = true
               _this.form2[0].info[0].required = false
               _this.form2[0].info[0].submitVal = data.detl.orderId
               _this.type = 'modi'
               _this.id = data.detl.id
               for (let item of _this.form2) {
                  for (let subItem of item.info) {
                     // 输入框直接赋值
                     if (subItem.inputType == 'input') {
                        subItem.value = data.detl[subItem.type]
                     } else if (subItem.inputType == 'select' || subItem.inputType == 'data') {
                        if (subItem.type == 'businessTransportation') {
                           subItem.value = _this.businessTransportations[0][data.detl[subItem.type] - 1]
                           subItem.submitVal = data.detl[subItem.type]
                        } else if (subItem.type == 'businessReturn') {
                           subItem.value = _this.businessReturns[0][data.detl[subItem.type]]
                           subItem.submitVal = data.detl[subItem.type]
                        } else if (subItem.type == 'businessStartTimeDay') {
                           subItem.value = _this.businessStartTimeDays[0][data.detl[subItem.type] - 1]
                           subItem.submitVal = data.detl[subItem.type]
                        } else if (subItem.type == 'businessEndTimeDay') {
                           subItem.value = _this.businessEndTimeDays[0][data.detl[subItem.type] - 1]
                           subItem.submitVal = data.detl[subItem.type]
                        } else if (subItem.type == 'pcdStart') {
                           subItem.value = data.detl.pcdStart$
                           subItem.submitVal = data.detl.pcdStart
                        } else if (subItem.type == 'pcdEnd') {
                           subItem.value = data.detl.pcdEnd$
                           subItem.submitVal = data.detl.pcdEnd
                        } else {
                           subItem.value = data.detl[subItem.type]
                        }
                     } else {
                        subItem.value = data.detl[subItem.type]
                     }
							
                  }
               }
            }
				
         })
      },
      mounted() {
         this.handlePcd();
      },
      methods: {
         getOrderId(condition) {
            let _this = this
            uni.request({
               url: `${_this.baseUrl}/orderQueryName/auth`,
               sslVerify: false,
               header: { 
                  'token': uni.getStorageSync('token'),
                   'content-type': 'application/x-www-form-urlencoded;charset=UTF-8',
                },
               method: 'POST',
               data: {condition: condition},
               success(res) {
                  res = res.data
                  _this.orderIds = []
                  _this.orderIdList = []
                  if (res.code === 200 && res.data) {
                     _this.orderIds2 = res.data
                     for (let k of res.data) {
                        _this.orderIds.push(k.value)
                        _this.orderIdList.push(k)
                     }
							
                  }
               }
					
            })
         },
         handlePcd() {
            let sheng_s = '110000';  
            let shi_s = '110100';  
            let qu_s = '110101';  
            let sheng_s = '110000';
            let shi_s = '110100';
            let qu_s = '110101';

            let sheng = [];
            let shi = [];
@@ -111,13 +373,13 @@
                     if (shi_item.value === shi_s) {
                        this.defaultIndex[1] = shi_index
                        shi_item.children.forEach((qu_item, qu_index) => {
                        if (qu_item.value === qu_s) {
                           this.defaultIndex[2] = qu_index
                        }
                        qu.push(qu_item.text);
                     })
                           if (qu_item.value === qu_s) {
                              this.defaultIndex[2] = qu_index
                           }
                           qu.push(qu_item.text);
                        })
                     }
                  shi.push(shi_item.text);
                     shi.push(shi_item.text);
                  })
               }
               sheng.push(sheng_item.text);
@@ -184,31 +446,102 @@
            let subPass = true
            for (let k of this.form2) {
               for (let sub of k.info) {
                  console.log(sub);
                  if (sub.inputType == 'select') {
                     this.form[sub.type] = sub.submitVal
                  } else if (sub.inputType == 'chose') {
                     if (!sub.unshow) {
                        for (let odd of this.orderIdList) {
                           if (sub.value == odd.value) {
                              this.form[sub.type] = odd.id
                           }
                        }
                     } else {
                        this.form[sub.type] = sub.submitVal
                     }
                  } else {
                     this.form[sub.type] = sub.value
                  }
						
                  if (sub.required) {
                     sub.placeholderStyle = 'font-size:20rpx;'
                     if (sub.value == '' || (sub.submitVal == '' && sub.submitVal < 0)) {
                        console.log(sub);
                        sub.placeholderStyle = 'font-size:20rpx;color:red'
                        subPass = false
                     } 
                     }
                  }
						

               }
            }
            console.log(this.form);
            console.log(subPass);
            if(subPass) {
               console.log(this.form);
            // subPass 表单是否填写完成
            if (subPass) {
               if (this.type == 'add') {
                  this.formAdd(this.form)
               } else {
                  this.form['id'] = this.id
                  this.formModi(this.form)
               }
            }
				
         },
         formAdd(form) {
            let _this = this
            uni.request({
               url: `${_this.baseUrl}/businessTrip/add/auth`,
               header: {
                  'token': uni.getStorageSync('token'),
                  'content-type': 'application/x-www-form-urlencoded;charset=UTF-8'
               },
               sslVerify: false,
               data: form,
               method: 'POST',
               success(res) {
                  res = res.data
                  if (res.code === 200) {
                     uni.showToast({title: '添加成功', icon: "none", position: 'top'})
                     setTimeout(()=>{
                        uni.navigateBack({})
                     },1000)
                  } else if (res.code === 500) {
                     uni.showToast({title: res.msg, icon: "none", position: 'top'})
                  } else {
							
                  }
               }
					
					
            })
         },
         formModi(form) {
            let _this = this
            uni.request({
               url: `${_this.baseUrl}/businessTrip/update/auth`,
               header: {
                  'token': uni.getStorageSync('token'),
                  'content-type': 'application/x-www-form-urlencoded;charset=UTF-8'
               },
               sslVerify: false,
               data: form,
               method: 'POST',
               success(res) {
                  res = res.data
                  if (res.code === 200) {
                     uni.showToast({title: '修改成功', icon: "none", position: 'top'})
                     setTimeout(()=>{
                        uni.navigateBack({delta:2})
                     },1000)
                  } else if (res.code === 500) {
                     uni.showToast({title: res.msg, icon: "none", position: 'top'})
                  } else {
							
                  }
               }
					
					
            })
         },
         showPicker(e) {
            switch(e) {
            switch (e) {
               case 'businessTransportation':
                  this.businessTransportationShow = true
                  break;
@@ -216,41 +549,41 @@
                  this.businessReturnShow = true
                  break
               case 'pcdStart':
                  this.pcdShow = true  
                  this.pcdShow = true
                  break
               case 'pcdEnd':
                  this.pcdEndShow = true  
                  this.pcdEndShow = true
                  break
               case 'businessStartTimeDay':
                  this.businessStartTimeDayShow = true  
                  this.businessStartTimeDayShow = true
                  break
               case 'businessEndTimeDay':
                  this.businessEndTimeDayShow = true  
                  this.businessEndTimeDayShow = true
                  break
            }
         },
         businessTransportationConfirm(e) {
            console.log('confirm', e)
            // console.log('confirm', e)
            this.form2[1].info[0].value = e.value[0]
            this.form2[1].info[0].submitVal = e.indexs[0]
            this.form2[1].info[0].submitVal = e.indexs[0] + 1
            this.businessTransportationShow = false
         },
         businessReturnConfirm(e) {
            console.log('confirm', e)
            // console.log('confirm', e)
            this.form2[1].info[1].value = e.value[0]
            this.form2[1].info[1].submitVal = e.indexs[0]
            this.businessReturnShow = false
         },
         businessStartTimeDayConfirm(e) {
            console.log('confirm', e)
            // console.log('confirm', e)
            this.form2[2].info[1].value = e.value[0]
            this.form2[2].info[1].submitVal = e.indexs[0]
            this.form2[2].info[1].submitVal = e.indexs[0] + 1
            this.businessStartTimeDayShow = false
         },
         businessEndTimeDayConfirm(e) {
            console.log('confirm', e)
            // console.log('confirm', e)
            this.form2[2].info[3].value = e.value[0]
            this.form2[2].info[3].submitVal = e.indexs[0]
            this.form2[2].info[3].submitVal = e.indexs[0] + 1
            this.businessEndTimeDayShow = false
         },
         pcdChangeHandler(e) {
@@ -274,7 +607,7 @@
            pcd[e.indexs[0]]
            // console.log(pcd[e.indexs[0]]);
            this.pcdShow = false
				

            // console.log(e.indexs)
            let shen = data.citysData[e.indexs[0]]
            // console.log(shen.value, shen.text)
@@ -284,8 +617,8 @@
            // console.log(qu.value, qu.code)
            // console.log(shen.value , shi.value, qu.value);
            this.form2[1].info[4].value = e.value[0] + '/' + e.value[1] + '/' + e.value[2]
            this.form2[1].info[4].submitVal = shen.value + ',' +  shi.value  + ',' + qu.value
            console.log(this.form2[1].info[4].value,this.form2[1].info[4].submitVal);
            this.form2[1].info[4].submitVal = shen.value + ',' + shi.value + ',' + qu.value
            // console.log(this.form2[1].info[4].value, this.form2[1].info[4].submitVal);
         },
         pcdEndConfirm(e) {
            // console.log('confirm', e)
@@ -293,7 +626,7 @@
            pcd[e.indexs[0]]
            // console.log(pcd[e.indexs[0]]);
            this.pcdEndShow = false
				

            // console.log(e.indexs)
            let shen = data.citysData[e.indexs[0]]
            // console.log(shen.value, shen.text)
@@ -303,8 +636,8 @@
            // console.log(qu.value, qu.code)
            // console.log(shen.value , shi.value, qu.value);
            this.form2[1].info[6].value = e.value[0] + '/' + e.value[1] + '/' + e.value[2]
            this.form2[1].info[6].submitVal = shen.value + ',' +  shi.value  + ',' + qu.value
            console.log(this.form2[1].info[6].value,this.form2[1].info[6].submitVal);
            this.form2[1].info[6].submitVal = shen.value + ',' + shi.value + ',' + qu.value
            // console.log(this.form2[1].info[6].value, this.form2[1].info[6].submitVal);
         }
      }
   }
@@ -313,34 +646,41 @@
<style scoped>
   .card {
      min-height: 100rpx;
      margin: 16rpx 0 0 0;
      margin: 16rpx 20rpx 0 20rpx;
      background-color: #fff;
   }

   .card-head {
      min-height: 60rpx;
      width: calc(100%-5px);
      margin-left: 4px;
      box-shadow: -4px 0 0px #2d8cf0;
   }

   .card-head-title {
      /* background-color: #556655; */
      padding-left: 6px;
   }

   .card-body {
      margin: 8rpx 8rpx 0 8rpx ;
      margin: 8rpx 8rpx 0 8rpx;
   }

   .card-required {
      color: red;
      padding-right: 4rpx;
   }

   .flex {
      display: flex;
      align-items: center;
   }

   .flex-column {
      display: flex;
      flex-direction: column;
   }

   .floor {
      height: 100rpx;
      line-height: 100rpx;
@@ -354,18 +694,22 @@
      text-align: center;
      letter-spacing: 10rpx;
   }

   .default {
      flex: 2;
   }

   .default:active {
      background-color: #eff0f1;
   }

   .primary {
      flex: 3;
      background-color: #2d8cf0;
      color: #fff;
   }

   .primary:active {
      background-color: #007dea;
   }
</style>
</style>