qa-regulatory-gwj-app/pages/key-project-management/hidden-management/view.vue

<template>
  <view class="content">
    <view class="card">
      <u-cell-group :border="false">
        <template v-if="hiddenData.hiddenImgs !== undefined && hiddenData.hiddenImgs.length>0">
          <u-cell class="flex-none">
            <view slot="title" class="title">隐患照片：</view>
            <view slot="value" class="mt-10">
              <u-row>
                <u-col span="3" v-for="(item,index) in hiddenData.hiddenImgs" :key="index">
                  <u--image :showLoading="true" :src="item.url"
                            width="80px" height="80px" @click="previewImage(hiddenData.hiddenImgs,item.url)"></u--image>
                </u-col>
              </u-row>
            </view>
          </u-cell>
        </template>
        <template v-if=" hiddenData.hiddenVideos !== undefined && hiddenData.hiddenVideos.length>0">
          <u-cell>
            <view slot="title" class="title">
              隐患视频：
            </view>
            <view slot="value">
              <u-icon v-if="hiddenData.hiddenVideos.length !== 0 && hiddenData.hiddenVideos[0].url"
                      name="play-circle-fill" size="30" @click="previewVideo(hiddenData.hiddenVideos[0].url)"></u-icon>
              <u-modal :show="modalShow" title="视频播放" confirmText="关闭" @confirm="modalShow = false">
                <view>
                  <video v-if="modalShow" :src="videoUrl" :autoplay="true"></video>
                </view>
              </u-modal>
            </view>
          </u-cell>
        </template>
        <u-cell class="flex-none">
          <view slot="title" class="title">隐患描述：</view>
          <view slot="value" class="mt-10">{{hiddenData.HIDDENDESCR}}</view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">隐患部位：</view>
          <view slot="value">{{hiddenData.HIDDENPART}}</view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">隐患级别：</view>
          <view slot="value">
            <text>{{ hiddenData.HIDDENLEVEL_NAME }}</text>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">隐患类型：</view>
          <view slot="value">
            <text>{{ hiddenData.HIDDENTYPE_NAME }}</text>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">隐患处置：</view>
          <view slot="value">限期整改</view>
        </u-cell>
        <view class="card">
          <view class="view-title">
            <u--text text="隐患整改"></u--text>
          </view>
        </view>
        <u-cell>
          <view slot="title" class="title">整改期限：</view>
          <view slot="value">
            <text>{{ hiddenData.RECTIFICATIONDEADLINE }}</text>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">整改部门：</view>
          <view slot="value">
            <text>{{ hiddenData.RECTIFICATIONDEPT_NAME }}</text>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">整改人：</view>
          <view slot="value">
            <text>{{ hiddenData.RECTIFICATIONOR_NAME }}</text>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">整改时间：</view>
          <view slot="value">
            <text>{{ hiddenData.RECTIFICATIONTIME }}</text>
          </view>
        </u-cell>
        <u-cell class="flex-none">
          <view slot="title" class="title">整改照片：</view>
          <view slot="value" class="mt-10">
            <u-row>
              <u-col span="3" v-for="(item,index) in hiddenData.zgImgs" :key="index">
                <u--image :showLoading="true" :src="item.url"
                          width="80px" height="80px" @click="previewImage(hiddenData.zgImgs,item.url)"></u--image>
              </u-col>
            </u-row>
          </view>
        </u-cell>
        <view class="card" v-show="type === 'acceptance'||hiddenData.STATE==='4'">
          <view class="view-title">
            <u--text text="验收信息"></u--text>
          </view>
        </view>
        <u-cell v-if="type === 'acceptance'||hiddenData.STATE==='4'">
          <view slot="title" class="title required">验收时间：</view>
          <view slot="value">
            <text @click="type === 'view' ? null : timeShow = true">{{ CHECKTIME || '请选择' }}</text>
            <u-datetime-picker :show="timeShow" :value="CHECKTIME"
                               :minDate="Number(1970)"
                               @cancel="timeShow = false"
                               @confirm="timeConfirm"></u-datetime-picker>
          </view>
        </u-cell>
        <u-cell class="flex-none" v-if="type === 'acceptance'||hiddenData.STATE==='4'">
          <view slot="title" class="title required">验收图片：</view>
          <view slot="value" class="mt-10">
            <u-upload
                :disabled="type === 'view'"
                :deletable="type === 'acceptance'"
                uploadIcon="plus"
                :fileList="form.ysImgs"
                @afterRead="afterRead"
                @delete="deletePic"
                multiple
                :maxCount="4"
            ></u-upload>
          </view>
        </u-cell>
      <view class="card" v-show="punishForm">
        <view class="view-title">
          <u--text text="处罚信息"></u--text>
        </view>
      </view>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">处罚原因：</view>
        <view slot="value">{{ punishForm.REASON }}</view>
      </u-cell>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">处罚金额：</view>
        <view slot="value">{{ punishForm.AMOUT }}元</view>
      </u-cell>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">被处罚单位：</view>
        <view slot="value">{{ punishForm.UNITS_NAME }}</view>
      </u-cell>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">被处罚人：</view>
        <view slot="value">{{ punishForm.PERSON_NAME }}</view>
      </u-cell>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">下发人：</view>
        <view slot="value">{{punishForm.CREATOR_NAME}}</view>
      </u-cell>
      <u-cell v-if="punishForm">
        <view slot="title" class="title">下发处罚时间：</view>
        <view slot="value">{{punishForm.DATE}}</view>
      </u-cell>
      <template v-if="punishForm">
        <u-cell class="flex-none" v-if="punishForm.HANLDE_TIME">
      	<view slot="title" class="title">罚款缴纳单：</view>
      	<view slot="value" class="mt-10">
      	  <u--image :showLoading="true" :src="punishForm.HANDLE_IMG"
      				width="80px" height="80px" @click="previewImagePunish(punishForm.HANDLE_IMG)"></u--image>
      	</view>
        </u-cell>
        <u-cell v-if="punishForm.HANLDE_TIME">
      	<view slot="title" class="title">处罚处理人：</view>
      	<view slot="value">{{punishForm.PERSON_NAME}}</view>
        </u-cell>
        <u-cell v-if="punishForm.HANLDE_TIME">
      	<view slot="title" class="title">处罚处理时间：</view>
      	<view slot="value">{{punishForm.HANLDE_TIME}}</view>
        </u-cell>
      </template>
        <u-cell class="flex-none" :border="false" v-if="type === 'acceptance'">
          <view slot="value" class="flex-between">
            <u-button type="primary" text="验收" class="bth" @click="fnSubmit"></u-button>
          </view>
        </u-cell>
      </u-cell-group>
    </view>
  </view>
</template>

<script>
import {getKeyProjectsCheckCheck, getKeyProjectsCheckHiddenView, setImgFilesAdd} from "../../../api";

export default {
  data() {
    return {
      HIDDEN_ID: '',
      type:'',
      hiddenData: {
        hiddenVideos:[]
      },
      modalShow:false,
      videoUrl:'',
      form:{
        CHECKTIME:uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM'),
        ysImgs:[],
        ISPUNISH:''
      },
      timeShow:false,
      CHECKTIME: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM'),
	  punishForm: {},
    }
  },
  onLoad(e) {
    this.HIDDEN_ID = e.HIDDEN_ID
    this.type = e.type
    this.fnGetData()
  },
  methods: {
    async fnGetData() {
      let resData = await getKeyProjectsCheckHiddenView({
        HIDDEN_ID: this.HIDDEN_ID,
      })
      for (let j = 0; j < resData.pd.hiddenImgs.length; j++) {
        resData.pd.hiddenImgs[j].url =
            this.$store.state.filePath + resData.pd.hiddenImgs[j].FILEPATH;
      }
      for (let j = 0; j < resData.pd.hiddenVideos.length; j++) {
        resData.pd.hiddenVideos[j].url =
            this.$store.state.filePath + resData.pd.hiddenVideos[j].FILEPATH;
      }
      for (let j = 0; j < resData.pd.zgImgs.length; j++) {
        resData.pd.zgImgs[j].url =
            this.$store.state.filePath + resData.pd.zgImgs[j].FILEPATH;
      }
      for (let j = 0; j < resData.pd.ysImgs.length; j++) {
        resData.pd.ysImgs[j].url =
            this.$store.state.filePath + resData.pd.ysImgs[j].FILEPATH;
      }
      this.hiddenData = resData.pd;
      this.form.ysImgs = resData.pd.ysImgs
      this.form.CHECKTIME = resData.pd.CHECKTIME
      this.form.ISPUNISH = resData.pd.ISPUNISH
	  this.punishForm = resData.pd.punishForm
	  if(this.punishForm){
	  		  this.punishForm.HANDLE_IMG = this.$store.state.filePath +this.punishForm.HANDLE_IMG;
	  }
    },
    previewVideo(videoUrl){
      this.modalShow = true;
      this.videoUrl = videoUrl;
    },
    previewImagePunish(e) {
      let urls = []
      urls.push(e)
      uni.previewImage({
        urls
      });
    },
    previewImage(list,current) {
      let urls = []
      for (let i = 0; i < list.length; i++) {
        urls.push(list[i].url)
      }
      uni.previewImage({
        urls,
        current
      });
    },
    timeConfirm(e){
      this.CHECKTIME = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM')
      this.timeShow = false;
    },
    afterRead(event) {
      this.form.ysImgs = [...this.form.ysImgs, ...event.file]
    },
    deletePic(event) {
      this.form.ysImgs = this.form.ysImgs.filter(item => item.url !== event.file.url)
    },
    async fnSubmit(){
      if(!this.CHECKTIME){
        uni.showToast({
          title: `请选择验收时间`,
          icon: 'none'
        })
        return
      }
      this.$set(this.form, 'CHECKTIME', this.CHECKTIME)
      // if(this.form.ysImgs.length === 0){
      //   uni.showToast({
      //     title: `请上传验收图片`,
      //     icon: 'none'
      //   })
      //   return
      // }
      if(!this.form.ISPUNISH){
        this.form.ISPUNISH=''
      }
      await getKeyProjectsCheckCheck({
        ...this.form,
        HIDDEN_ID:this.HIDDEN_ID
      })
      let PromiseArr = []
      for (let j = 0; j < this.form.ysImgs.length; j++) {
        let imgFiles = []
        imgFiles.push({
          uri: this.form.ysImgs[j].url,
          FFILE: this.form.ysImgs[j].url,
        })
        PromiseArr.push(this.fnSetImgFilesAdd(imgFiles, this.HIDDEN_ID,'5'))
      }
      Promise.all(PromiseArr).then((data) => {
		  console.log(data)
        uni.hideLoading()
        uni.showToast({
          title: '添加成功',
        })
        uni.$u.route({
          type: 'navigateBack'
        })
      }).catch((data) => {
		  console.log(data)
        uni.showToast({
          title: '添加失败！',
          icon: 'error',
          duration: 2000
        });
      })
    },
    async fnSetImgFilesAdd(imgFiles, FOREIGN_KEY,TYPE) {
      return await setImgFilesAdd({
        files: imgFiles,
        formData: {
          FOREIGN_KEY,
          TYPE
        },
        loading:false
      })
    },
  },
}
</script>

<style scoped>

</style>