linwe
2024-08-08 3c738f4fe2762bba8087e5a22fc0dc06560eab0e
subPackage/workbench/views/bailReportDetail.vue
@@ -1,39 +1,51 @@
<template>
   <view class="container">
      <view class="basic">
         <box-title title="基本信息" class="box-title"></box-title>
         <view class="info">
         <!-- <box-title title="基本信息" class="box-title"></box-title> -->
         <view class="info mt-20 bgc-ff">
            <lineItem :dataInfo="basicData"></lineItem>
            <view class="licence" v-if="locationImageUrls.length">
               <!-- <box-title title="位置图片" class="box-title"></box-title> -->
               <view class="f-30 mb-20">位置图片</view>
               <view class="flex-wrap">
                  <view v-for="(i,k) in locationImageUrls" :key="k" class="mr-20 mt-20"
                     @click="previewImg(i,locationImageUrls)">
                     <u-image :src="i" width="80" height="80"></u-image>
                  </view>
               </view>
            </view>
         </view>
      </view>
      <view class="licence" v-if="locationImageUrls.length">
      <!-- <view class="licence" v-if="locationImageUrls.length">
         <box-title title="位置图片" class="box-title"></box-title>
         <view class="flex-wrap">
            <view v-for="(i,k) in locationImageUrls" :key="k" class="ml-20 mt-20">
            <view v-for="(i,k) in locationImageUrls" :key="k" class="ml-20 mt-20"
               @click="previewImg(i,locationImageUrls)">
               <u-image :src="i" width="80" height="80"></u-image>
            </view>
         </view>
      </view>
      </view> -->
      <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()">
      <view class="item mt-20 bgc-ff">
         <u-form labelPosition="left" :model="info" ref="form" labelWidth="100" :labelStyle="{fontSize:'28rpx'}">
            <u-form-item label="审核结果" prop="confirmFlag" borderBottom>
               <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-icon slot="right" name="arrow-right"></u-icon> -->
            </u-form-item>
            <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>
            <u-form-item label="备注" borderBottom v-if="info.confirmNotion">
               <u--input type="textarea" v-model="info.confirmNotion" :disabled="true" 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 +53,55 @@
         </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" class="section bgc-ff mt-20 mb-20">
         <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="f-30 mb-20">位置图片</view>
            <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="deletePics($event,'startImageUrls')">
                  <view class="upload-item upload-icon flex_base">
                     <u-icon name="/static/icon/upload.png" width="60rpx" height="60rpx"></u-icon>
                  </view>
@@ -103,18 +110,20 @@
            <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="deletePics($event,'reachImageUrls')">
                  <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="deletePics($event,'returnImageUrls')">
                  <view class="upload-item upload-icon flex_base">
                     <u-icon name="/static/icon/upload.png" width="60rpx" height="60rpx"></u-icon>
                  </view>
@@ -124,12 +133,20 @@
      </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>
      </view> -->
      <!-- <footer-btn   v-if="roleType == 1 && status == 1" text="提交审核"  @click="submit" /> -->
      <audit-action @handle="submit" v-if="roleType == 1 && status == 1"></audit-action>
      <footer-btn v-if="roleType == 2 && status == 2" text="提交" @click="submit" />
      <footer-btn v-if="roleType == 2 && status == 3" text="重新编辑" @click="navToEdit" />
      <u-datetime-picker ref="datetimePicker" :show="showSelectDate" v-model="goOutDate[tabIndex]" mode="datetime"
         :formatter="formatter" @confirm="confirmDate" @cancel="cancelPickerDate"></u-datetime-picker>
      <u-picker :closeOnClickOverlay="true" @close="isPickerShow = false" :show="isPickerShow" ref="uPicker"
@@ -138,17 +155,19 @@
</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 {
      getBailReportingDetail,
      setBailReporting
   } from '@/api/reporting/reporting'
   import auditAction from '../components/actionBtn.vue'
   export default {
      components: {
         boxTitle,
         lineItem
         lineItem,
         auditAction
      },
      mixins: [uploadMixin],
      data() {
@@ -164,7 +183,7 @@
                  value: '未完善'
               },
               {
                  label: '申请名称',
                  label: '申请事由',
                  name: 'applyName',
                  value: '未完善'
               },
@@ -231,11 +250,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 +275,61 @@
      },
      methods: {
         changeTab(index){
         changeTab(index) {
            this.tabIndex = index;
         },
         showPickerDate(){
            if(this.roleType == 2 && this.status != 2) return;
         showPickerDate() {
            if (this.roleType == 1 && this.status != 1) return;
            this.showSelectDate = true;
         },
         cancelPickerDate(){
         cancelPickerDate() {
            this.showSelectDate = false;
         },
         showPicker(){
            if(this.roleType == 2 && this.status != 2) return;
            this.isPickerShow = true
         showPicker() {
            if (this.roleType == 1) {
               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,24 +361,29 @@
               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;
                  for (let i in this.goOutInfo) {
                     this.goOutInfo[i] = data[i];
                  }
                  this.startImageUrls = this.$setImageUrl(data.startImageUrls, 2);
                  this.reachImageUrls = this.$setImageUrl(data.reachImageUrls, 2);
                  this.returnImageUrls = this.$setImageUrl(data.returnImageUrls, 2);
               }
               this.basicData.forEach(item => {
                  item.value = data[item.name]
               })
               this.locationImageUrls = this.setImages(data.locationImageUrls);
               this.locationImageUrls = this.$setImageUrl(data.locationImageUrls);
            })
         },
         setImages(str) {
            if (str) {
               return str.split(",")
            } else {
               return []
            }
         previewImg(current, urls) {
            uni.previewImage({
               current,
               urls
            })
         },
         handleConfirm(e) {
@@ -366,7 +391,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,27 +403,44 @@
               this.$set(this.goOutInfo, "returnImageUrls", this.setGoOutImages(this.returnImageUrls))
            }
         },
         setGoOutImages(key) {
            let urls = [];
            for (let i of key) {
               urls.push(i.url);
               urls.push(i.name);
            }
            return urls.join(",")
         },
         submit() {
            if(this.roleType == 1){
         submit(val) {
            if (this.roleType == 1) {
               if (!this.info.confirmUserName) {
                  uni.showToast({
                     title: "请输入审核人员姓名",
                     icon: "none"
                  })
                  return
               }
               if (!this.info.confirmUserTelephone) {
                  uni.showToast({
                     title: "请输入审核人员手机号",
                     icon: "none"
                  })
                  return;
               }
               this.info.status = val.type;
               this.info.confirmNotion = val.remark;
               this.info.confirmFlag = 2;
               this.submitRequest(this.info);
            }else{
            } else {
               this.checkImages()
               setTimeout(()=>{
               setTimeout(() => {
                  this.submitRequest(this.goOutInfo);
               },1000)
            }
               }, 300)
            }
         },
         submitRequest(data){
         submitRequest(data) {
            data.taskId = this.taskId;
            data.id = this.id;
            setBailReporting(data).then(res => {
@@ -407,7 +449,7 @@
                     title: '更新失败',
                     icon: 'error'
                  })
               }else {
               } else {
                  uni.showToast({
                     title: '提交成功!',
                     icon: 'success'
@@ -416,12 +458,23 @@
               }
               // uni.navigateBack()
            })
         },
         navToEdit() {
            uni.navigateTo({
               url: `/subPackage/label/bail?id=${this.taskId}`
            })
         }
      }
   }
</script>
<style lang="scss">
   page {
      background-color: #f5f5f5;
   }
   .container {
      padding: 0 20rpx 130rpx;
@@ -468,18 +521,33 @@
   /deep/ .u-form-item__body__left__content__label,
   /deep/ .uni-input-placeholder {
      font-size: 30rpx;
      color: #000;
   }
   .upload {
      margin: 0 30rpx;
      padding: 30rpx;
      // margin: 0 30rpx;
      padding: 20rpx 0 0;
   }
   .upload-item {
      width: 140rpx;
      height: 140rpx;
      border: 1px solid #EEEEEE;
   }
   .section {
      padding: 20rpx;
   }
   .item,
   .licence {
      padding: 0 20rpx;
   }
   /deep/ .line-item-container .text .r {
      color: #000 !important;
   }
</style>