组件位置调整

guoshilong

2023-11-12 03e24712b3534ffacd58ac8237237eccd4a4dd02

 subPackage/workbench/views/bailReportDetail.vue

@@ -17,23 +17,23 @@


      <view class="item mt-30">
         <u-form labelPosition="left" :model="info"  ref="form" labelWidth="100"
            :labelStyle="{fontSize:'28rpx'}">
            <u-form-item label="审核结果" prop="confirmFlag" borderBottom  @click="showPicker()">
         <u-form labelPosition="left" :model="info" ref="form" labelWidth="100" :labelStyle="{fontSize:'28rpx'}">
            <u-form-item label="审核结果" prop="confirmFlag" borderBottom @click="showPicker()">
               <u-input v-model="confirmFlag" disabled disabledColor="#ffffff" border="none" placeholder="请输入"
                  placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               <u-icon slot="right" name="arrow-right"></u-icon>
            </u-form-item>
            <u-form-item label="备注"  borderBottom>
            <u-form-item label="备注" borderBottom>
               <u--input type="textarea" v-model="info.confirmNotion" :disabled="isDisabled"
                  disabledColor="#ffffff" placeholderClass="f-28 c-99" border="none" inputAlign="right"></u--input>
                  disabledColor="#ffffff" placeholderClass="f-28 c-99" border="none"
                  inputAlign="right"></u--input>

            </u-form-item>
            <u-form-item label="审核人员" prop="checkUserName" borderBottom >
            <u-form-item label="审核人员" prop="checkUserName" borderBottom>
               <u-input v-model="info.confirmUserName" :disabled="isDisabled" disabledColor="#ffffff" border="none"
                  placeholder="请输入审核人员姓名" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="电话号码" prop="confirmUserTelephone" borderBottom >
            <u-form-item label="电话号码" prop="confirmUserTelephone" borderBottom>
               <u-input v-model="info.confirmUserTelephone" :disabled="isDisabled" disabledColor="#ffffff"
                  border="none" placeholder="请输入审核人员电话号码" placeholderClass="f-28 c-99"
                  inputAlign="right"></u-input>
@@ -41,60 +41,54 @@
         </u-form>
      </view>

      <view  v-if="status == 2 && roleType  == 2">
         <u-subsection :list="tabList" :current="tabIndex"  button-color="#017BFC" @change="changeTab"></u-subsection>
      <view v-if="status == 2 && roleType  == 2">
         <u-subsection :list="tabList" :current="tabIndex" button-color="#017BFC" @change="changeTab"></u-subsection>
         <u-form labelPosition="left" :model="goOutInfo" ref="form" labelWidth="100"
            :labelStyle="{fontSize:'28rpx'}">
            <view class="" v-if="tabIndex == 0">
               <u-form-item label="当前时间" prop="checkUserName" borderBottom   @click="showPickerDate">
                  <u-input v-model="goOutInfo.startTime" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取当前时间" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="当前时间" prop="checkUserName" borderBottom @click="showPickerDate">
                  <u-input v-model="goOutInfo.startTime" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取当前时间" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
               <u-form-item label="报备位置" prop="checkUserName" borderBottom  @click="getLocation('startLocation')">
                  <u-input v-model="goOutInfo.startLocation" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取当前位置" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="报备位置" prop="checkUserName" borderBottom @click="getLocation('startLocation')">
                  <u-input v-model="goOutInfo.startLocation" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取当前位置" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
            </view>
            <view class="" v-if="tabIndex == 1">
               <u-form-item label="到达时间" prop="reachTime" borderBottom  @click="showPickerDate">
                  <u-input v-model="goOutInfo.reachTime" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取当前时间" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="到达时间" prop="reachTime" borderBottom @click="showPickerDate">
                  <u-input v-model="goOutInfo.reachTime" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取当前时间" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
               <u-form-item label="到达位置" prop="reachLocation" borderBottom  @click="getLocation('reachLocation')">
                  <u-input v-model="goOutInfo.reachLocation" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取当前位置" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="到达位置" prop="reachLocation" borderBottom @click="getLocation('reachLocation')">
                  <u-input v-model="goOutInfo.reachLocation" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取当前位置" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
            </view>
            <view class="" v-if="tabIndex == 2">
               <u-form-item label="返回时间" prop="returnTime" borderBottom  @click="showPickerDate">
                  <u-input v-model="goOutInfo.returnTime" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取返回时间" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="返回时间" prop="returnTime" borderBottom @click="showPickerDate">
                  <u-input v-model="goOutInfo.returnTime" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取返回时间" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
               <u-form-item label="返回位置" prop="returnLocation" borderBottom   @click="getLocation('returnLocation')">
                  <u-input v-model="goOutInfo.returnLocation" disabled disabledColor="#ffffff"
                     border="none" placeholder="请获取返回位置" placeholderClass="f-28 c-99"
                     inputAlign="right"></u-input>
               <u-form-item label="返回位置" prop="returnLocation" borderBottom @click="getLocation('returnLocation')">
                  <u-input v-model="goOutInfo.returnLocation" disabled disabledColor="#ffffff" border="none"
                     placeholder="请获取返回位置" placeholderClass="f-28 c-99" inputAlign="right"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
            </view>
         </u-form>
         <view class="upload bgc-ff">
            <view class="f-28 mb-20">位置图片</view>
            <view class="mt-20"  v-if="tabIndex == 0">
            <view class="mt-20" v-if="tabIndex == 0">
               <u-upload :fileList="startImageUrls" :previewFullImage="uploadConfig.previewFullImage"
                  :accept="uploadConfig.acceptImg" :multiple="uploadConfig.multiple"
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture" @afterRead="afterReadImgs($event,'startImageUrls')"
                  @delete="deletePic">
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture"
                  @afterRead="afterReadImgs($event,'startImageUrls')" @delete="deletePic">
                  <view class="upload-item upload-icon flex_base">
                     <u-icon name="/static/icon/upload.png" width="60rpx" height="60rpx"></u-icon>
                  </view>
@@ -103,18 +97,18 @@
            <view class="mt-20" v-if="tabIndex == 1">
               <u-upload :fileList="reachImageUrls" :previewFullImage="uploadConfig.previewFullImage"
                  :accept="uploadConfig.acceptImg" :multiple="uploadConfig.multiple"
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture" @afterRead="afterReadImgs($event,'reachImageUrls')"
                  @delete="deletePic">
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture"
                  @afterRead="afterReadImgs($event,'reachImageUrls')" @delete="deletePic">
                  <view class="upload-item upload-icon flex_base">
                     <u-icon name="/static/icon/upload.png" width="60rpx" height="60rpx"></u-icon>
                  </view>					
                  </view>
               </u-upload>
            </view>
            <view class="mt-20" v-if="tabIndex == 2">
               <u-upload :fileList="returnImageUrls" :previewFullImage="uploadConfig.previewFullImage"
                  :accept="uploadConfig.acceptImg" :multiple="uploadConfig.multiple"
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture" @afterRead="afterReadImgs($event,'returnImageUrls')"
                  @delete="deletePic">
                  :maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture"
                  @afterRead="afterReadImgs($event,'returnImageUrls')" @delete="deletePic">
                  <view class="upload-item upload-icon flex_base">
                     <u-icon name="/static/icon/upload.png" width="60rpx" height="60rpx"></u-icon>
                  </view>
@@ -124,10 +118,10 @@
      </view>


      <view class="bottom-btn"    v-if="roleType == 1 && status == 1">
      <view class="bottom-btn" v-if="roleType == 1 && status == 1">
         <u-button type="primary" @click="submit">提交审核</u-button>
      </view>
      <view class="bottom-btn"    v-if="roleType == 2 && status == 2">
      <view class="bottom-btn" v-if="roleType == 2 && status == 2">
         <u-button type="primary" @click="submit">提交</u-button>
      </view>
      <u-datetime-picker ref="datetimePicker" :show="showSelectDate" v-model="goOutDate[tabIndex]" mode="datetime"
@@ -138,7 +132,7 @@
</template>

<script>
   import boxTitle from '@/components/boxTitle/index.vue'
   import boxTitle from "@/subPackage/workbench/components/boxTitle/index.vue"
   import lineItem from '../components/lineItem.vue'
   import uploadMixin from "@/mixin/uploadMixin";
   import {
@@ -231,11 +225,11 @@
                  name: '返程时'
               }
            ],
            tabIndex:0,
            goOutDate:[new Date(),new Date(),new Date()],
            showSelectDate:false,
            status:1     ,//当前状态   1待审核  2审核通过   3审核不通过
            id:""
            tabIndex: 0,
            goOutDate: [new Date(), new Date(), new Date()],
            showSelectDate: false,
            status: 1, //当前状态   1待审核  2审核通过   3审核不通过
            id: ""

         }
      },
@@ -256,60 +250,60 @@
      },

      methods: {
			
         changeTab(index){

         changeTab(index) {
            this.tabIndex = index;
         },
			
         showPickerDate(){
            if(this.roleType == 2 && this.status != 2) return;

         showPickerDate() {
            if (this.roleType == 2 && this.status != 2) return;
            this.showSelectDate = true;
         },
         cancelPickerDate(){
         cancelPickerDate() {
            this.showSelectDate = false;
         },
         showPicker(){
            if(this.roleType == 2 && this.status != 2) return;
         showPicker() {
            if (this.roleType == 2 && this.status != 2) return;
            this.isPickerShow = true
         },
			
         showConfirmFlag(status){
            if(status == 1){

         showConfirmFlag(status) {
            if (status == 1) {
               this.confirmFlag = "待审核"
            }else if(status == 2){
            } else if (status == 2) {
               this.confirmFlag = "审核通过"
            }else {
            } else {
               this.confirmFlag = "审核不通过"
            }
         },
			

         confirmDate(e) {
            this.showSelectDate = false;
            this.goOutDate[this.tabIndex] = e.value;
            if(this.tabIndex == 0){
            if (this.tabIndex == 0) {
               this.goOutInfo.startTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
					
            }else if(this.tabIndex == 1){

            } else if (this.tabIndex == 1) {
               this.goOutInfo.reachTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
            }else {
            } else {
               this.goOutInfo.returnTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
            }
         },
			
         getLocation(key){

         getLocation(key) {
            console.log(key)
            if(this.roleType == 2 &&  this.status != 2) return;
            if (this.roleType == 2 && this.status != 2) return;
            uni.chooseLocation({
               success:(res)=>{
               success: (res) => {
                  console.log(res);
                  this.$set(this.goOutInfo, key, res.address)
               },
               complete:(err)=> {
               complete: (err) => {
                  console.log(err)
               }
            })
         },
			

         async afterReadImgs(event, key) {
            this.showLoading()
            let lists = [].concat(event.file)
@@ -341,7 +335,7 @@
               this.status = data.confirmFlag
               this.id = data.id;
               this.showConfirmFlag(data.confirmFlag)
               if(data.confirmFlag != 1){
               if (data.confirmFlag != 1) {
                  this.info.confirmFlag = data.confirmFlag;
                  this.info.confirmUserName = data.confirmUserName;
                  this.info.confirmUserTelephone = data.confirmUserTelephone;
@@ -366,7 +360,7 @@
            this.info.confirmFlag = e.value[0].status;
            this.isPickerShow = false
         },
			

         checkImages() {
            if (this.startImageUrls.length) {
               this.$set(this.goOutInfo, "startImageUrls", this.setGoOutImages(this.startImageUrls))
@@ -378,7 +372,7 @@
               this.$set(this.goOutInfo, "returnImageUrls", this.setGoOutImages(this.returnImageUrls))
            }
         },
			

         setGoOutImages(key) {
            let urls = [];
            for (let i of key) {
@@ -386,19 +380,19 @@
            }
            return urls.join(",")
         },
			

         submit() {
            if(this.roleType == 1){
            if (this.roleType == 1) {
               this.submitRequest(this.info);
            }else{
            } else {
               this.checkImages()
               setTimeout(()=>{
               setTimeout(() => {
                  this.submitRequest(this.goOutInfo);
               },1000)
            }		
               }, 1000)
            }
         },
			
         submitRequest(data){

         submitRequest(data) {
            data.taskId = this.taskId;
            data.id = this.id;
            setBailReporting(data).then(res => {
@@ -407,7 +401,7 @@
                     title: '更新失败',
                     icon: 'error'
                  })
               }else {
               } else {
                  uni.showToast({
                     title: '提交成功!',
                     icon: 'success'
@@ -469,17 +463,17 @@
   /deep/ .uni-input-placeholder {
      font-size: 30rpx;
   }
	

   .upload {
      margin: 0 30rpx;
      padding: 30rpx;
	
	


   }

   .upload-item {
      width: 140rpx;
      height: 140rpx;
      border: 1px solid #EEEEEE;
   }
	
</style>