quanyawei
2024-01-09 4462b1bf81d82cf690b16aad2cc0955a7c6e0b01
src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue
@@ -1,37 +1,137 @@
<template>
  <div>
    <el-dialog :title="dialogData.title" top="30px" :visible.sync="visible" width="900px" center :before-close="close">
      <div slot="title" class="titBox">
    <el-dialog
      :title="dialogData.title"
      top="30px"
      :visible.sync="visible"
      width="900px"
      center
      :before-close="close"
    >
      <div
        slot="title"
        class="titBox"
      >
        <div>{{ parentFormData.allocationNum }}</div>
        <div>{{ dialogData.title }}</div>
      </div>
      <div>
        <div v-if="dialogData.pageType !=='delay'" class="stepsList">
          <el-steps :space="200" :active="activeLeng" align-center>
            <el-step v-for="(item,index) in setepList" :key="index" :title="'' + item.createName + ' ' + item.stateName" :description="item.createTime" />
        <div
          v-if="dialogData.pageType !=='delay'"
          class="stepsList"
        >
          <el-steps
            :space="200"
            :active="activeLeng"
            align-center
          >
            <el-step
              v-for="(item,index) in setepList"
              :key="index"
              :title="'' + item.createName + ' ' + item.stateName"
              :description="item.createTime"
            />
          </el-steps>
        </div>
        <div class="inforData">
          <el-descriptions title="基本信息" :column="parseInt('4')">
            <el-descriptions-item label="上报时间" label-class-name="itemSpan">{{ parentFormData.escalationTime }}</el-descriptions-item>
            <el-descriptions-item label="责任单位" label-class-name="itemSpan">{{ unitIdFormatter }}</el-descriptions-item>
            <el-descriptions-item label="污染分类" label-class-name="itemSpan">{{ polluteTypeFormatter }}</el-descriptions-item>
            <el-descriptions-item label="整改类型" label-class-name="itemSpan">{{ dictObj.changeEnum[parentFormData.changeType] }}</el-descriptions-item>
            <el-descriptions-item label="期限天数" label-class-name="itemSpan">{{ parentFormData.changeDay }}</el-descriptions-item>
            <el-descriptions-item label="上报单位" label-class-name="itemSpan">{{ updataUnitIdFormatter }}</el-descriptions-item>
            <el-descriptions-item label="上报人" label-class-name="itemSpan">{{ parentFormData.escalationName }}</el-descriptions-item>
          <el-descriptions
            title="基本信息"
          >
            <el-descriptions-item
              label="上报时间"
              label-class-name="itemSpan"
            >
              {{ parentFormData.escalationTime }}
            </el-descriptions-item>
            <el-descriptions-item
              label="责任单位"
              label-class-name="itemSpan"
            >
              {{ unitIdFormatter }}
            </el-descriptions-item>
            <el-descriptions-item
              label="污染分类"
              label-class-name="itemSpan"
            >
              {{ polluteTypeFormatter }}
            </el-descriptions-item>
            <el-descriptions-item
              label="整改类型"
              label-class-name="itemSpan"
            >
              {{ dictObj.changeEnum[parentFormData.changeType] }}
            </el-descriptions-item>
            <el-descriptions-item
              label="期限天数"
              label-class-name="itemSpan"
            >
              {{ parentFormData.changeDay }}
            </el-descriptions-item>
            <el-descriptions-item
              label="上报单位"
              label-class-name="itemSpan"
            >
              {{ updataUnitIdFormatter }}
            </el-descriptions-item>
            <el-descriptions-item
              label="上报人"
              label-class-name="itemSpan"
            >
              {{ parentFormData.escalationName }}
            </el-descriptions-item>
            <el-descriptions-item
              label="任务分类"
              label-class-name="itemSpan"
            >
              {{ dictObj.emphasisEnum[parentFormData.keyPoint] }}
            </el-descriptions-item>
          </el-descriptions>
          <el-descriptions :column="parseInt('2')">
            <el-descriptions-item label="污染位置" label-class-name="itemSpan">{{ parentFormData.pollutePosition }}</el-descriptions-item>
            <el-descriptions-item label="任务分类" label-class-name="itemSpan">{{ dictObj.emphasisEnum[parentFormData.keyPoint]  }}</el-descriptions-item>
          <el-descriptions>
            <el-descriptions-item
              label="污染位置"
              label-class-name="itemSpan"
            >
              {{ parentFormData.pollutePosition }}
              <i
                v-if="parentFormData.latitude&&parentFormData.longitude"
                style="color:#409EFF;margin-left:10px;font-size:18px;cursor:pointer"
                class="el-icon-location-outline"
                @click="toMap"
              />
            </el-descriptions-item>
          </el-descriptions>
          <el-descriptions :column="parseInt('1')">
            <el-descriptions-item label="问题描述" label-class-name="itemSpan" :content-style="{'width': '80%'}">{{ parentFormData.problemDescribe }}</el-descriptions-item>
            <el-descriptions-item label="附件" label-class-name="itemSpan" :content-style="{'width': '80%'}">
            <el-descriptions-item
              label="问题描述"
              label-class-name="itemSpan"
              :content-style="{'width': '80%'}"
            >
              {{ parentFormData.problemDescribe }}
            </el-descriptions-item>
            <el-descriptions-item
              label="附件"
              label-class-name="itemSpan"
              :content-style="{'width': '80%'}"
            >
              <div>
                <div v-for="(file,index) in fileBaseListCover" :key="file.id+index" class="block">
                  <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileBaseList)" :initial-index="index" />
                  <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                <div
                  v-for="(file,index) in fileBaseListCover"
                  :key="file.id+index"
                  class="block"
                >
                  <el-image
                    v-if="file.fileType ===1"
                    style="width: 100px; height: 100px"
                    :src="file.url"
                    :preview-src-list="getPreviewImages(file.id,fileBaseList)"
                    :initial-index="index"
                  />
                  <video
                    v-else
                    :src="file.url"
                    style="width: 100px; height: 100px"
                    @click="openVideo(file)"
                  >
                    您的浏览器不支持 video 标签。
                  </video>
                </div>
@@ -40,29 +140,50 @@
          </el-descriptions>
        </div>
        <!-- 整改部分操作 -->
        <div v-if="dialogData.pageType ==='work'" class="rectification">
        <div
          v-if="dialogData.pageType ==='work'"
          class="rectification"
        >
          <div>
            <el-form label-width="90px" class="demo-form-inline">
            <el-form
              label-width="90px"
              class="demo-form-inline"
            >
              <div style="display: flex;">
                <el-form-item label="是否整改:">
                  <el-radio-group v-model="workForme.isChange">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                    <el-radio :label="1">
                      是
                    </el-radio>
                    <el-radio :label="0">
                      否
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="整改人:">
                  <el-input v-model="workForme.changeName" size="mini" placeholder="请输入整改人" />
                  <el-input
                    v-model="workForme.changeName"
                    size="mini"
                    placeholder="请输入整改人"
                  />
                </el-form-item>
              </div>
              <el-form-item label="整改反馈:">
                <el-input v-model="workForme.changeDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
                <el-input
                  v-model="workForme.changeDescribe"
                  type="textarea"
                  :autosize="{ minRows: 2, maxRows: 4}"
                  placeholder="请输入内容"
                />
              </el-form-item>
              <el-row>
                <el-form-item label="附件:">
                  <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" />
                  <uploadFile
                    :upload-url="uploadTermExcelUrl"
                    :sys-code="dialogData.sysCode"
                  />
                </el-form-item>
              </el-row>
            </el-form>
          </div>
        </div>
@@ -71,26 +192,62 @@
          <el-row class="rectificationContent">
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="整改信息" :column="parseInt('2')">
                <el-descriptions-item label="是否整改" label-class-name="itemSpan">{{ dictObj.yesOrNo[parentFormData.isChange] }}</el-descriptions-item>
                <el-descriptions-item label="整改人" label-class-name="itemSpan">{{ parentFormData.changeName }}</el-descriptions-item>
              <el-descriptions
                title="整改信息"
                :column="parseInt('2')"
              >
                <el-descriptions-item
                  label="是否整改"
                  label-class-name="itemSpan"
                >
                  {{ dictObj.yesOrNo[parentFormData.isChange] }}
                </el-descriptions-item>
                <el-descriptions-item
                  label="整改人"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.changeName }}
                </el-descriptions-item>
              </el-descriptions>
              <el-descriptions :column="parseInt('1')">
                <el-descriptions-item label="整改反馈" label-class-name="itemSpan">{{ parentFormData.changeDescribe }}</el-descriptions-item>
                <el-descriptions-item
                  label="整改反馈"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.changeDescribe }}
                </el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                <el-col
                  :span="3"
                  style="margin-top: 40px;font-size: 15px;color: #101010;"
                >
                  <div class="grid-content bg-purple" />附件:
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div v-for="(file,index) in fileChangeListCover" :key="file.id+index" class="block">
                      <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileChangeList)" :initial-index="index" />
                      <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                    <div
                      v-for="(file,index) in fileChangeListCover"
                      :key="file.id+index"
                      class="block"
                    >
                      <el-image
                        v-if="file.fileType ===1"
                        style="width: 100px; height: 100px"
                        :src="file.url"
                        :preview-src-list="getPreviewImages(file.id,fileChangeList)"
                        :initial-index="index"
                      />
                      <video
                        v-else
                        :src="file.url"
                        style="width: 100px; height: 100px"
                        @click="openVideo(file)"
                      >
                        您的浏览器不支持 video 标签。
                      </video>
                    </div>
@@ -105,26 +262,57 @@
          <el-row class="rectificationContent">
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="审批信息" :column="2">
                <el-descriptions-item label="考核打分" label-class-name="itemSpan">{{ parentFormData.checkScore }}</el-descriptions-item>
              <el-descriptions
                title="审批信息"
                :column="2"
              >
                <el-descriptions-item
                  label="考核打分"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.checkScore }}
                </el-descriptions-item>
              </el-descriptions>
              <el-descriptions :column="1">
                <el-descriptions-item label="理由" label-class-name="itemSpan">{{ parentFormData.checkDescribe }}</el-descriptions-item>
                <el-descriptions-item
                  label="理由"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.checkDescribe }}
                </el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                <el-col
                  :span="3"
                  style="margin-top: 40px;font-size: 15px;color: #101010;"
                >
                  <div class="grid-content bg-purple" />附件:
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div>
                      <div v-for="(file,index) in fileApproveListCover" :key="file.id+index" class="block">
                        <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileApproveList)" :initial-index="index" />
                        <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                      <div
                        v-for="(file,index) in fileApproveListCover"
                        :key="file.id+index"
                        class="block"
                      >
                        <el-image
                          v-if="file.fileType ===1"
                          style="width: 100px; height: 100px"
                          :src="file.url"
                          :preview-src-list="getPreviewImages(file.id,fileApproveList)"
                          :initial-index="index"
                        />
                        <video
                          v-else
                          :src="file.url"
                          style="width: 100px; height: 100px"
                          @click="openVideo(file)"
                        >
                          您的浏览器不支持 video 标签。
                        </video>
                      </div>
@@ -140,23 +328,54 @@
          <el-row class="rectificationContent">
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="延期信息" :column="1">
                <el-descriptions-item label="延期天数" label-class-name="itemSpan">{{ parentFormData.extensionNum }}</el-descriptions-item>
                <el-descriptions-item label="延期理由" label-class-name="itemSpan">{{ parentFormData.remake }}</el-descriptions-item>
              <el-descriptions
                title="延期信息"
                :column="1"
              >
                <el-descriptions-item
                  label="延期天数"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.extensionNum }}
                </el-descriptions-item>
                <el-descriptions-item
                  label="延期理由"
                  label-class-name="itemSpan"
                >
                  {{ parentFormData.remake }}
                </el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                <el-col
                  :span="3"
                  style="margin-top: 40px;font-size: 15px;color: #101010;"
                >
                  <div class="grid-content bg-purple" />附件:
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div v-for="(file,index) in fileDelayListCover" :key="file.id+index" class="block">
                      <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileDelayList)" :initial-index="index" />
                      <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                    <div
                      v-for="(file,index) in fileDelayListCover"
                      :key="file.id+index"
                      class="block"
                    >
                      <el-image
                        v-if="file.fileType ===1"
                        style="width: 100px; height: 100px"
                        :src="file.url"
                        :preview-src-list="getPreviewImages(file.id,fileDelayList)"
                        :initial-index="index"
                      />
                      <video
                        v-else
                        :src="file.url"
                        style="width: 100px; height: 100px"
                        @click="openVideo(file)"
                      >
                        您的浏览器不支持 video 标签。
                      </video>
                    </div>
@@ -167,47 +386,131 @@
          </el-row>
        </div>
        <!-- 审批操作 -->
        <div v-if="dialogData.pageType ==='approve'" class="examineAndApprove">
          <el-form label-width="90px" :model="rectificationFromData" class="demo-form-inline">
        <div
          v-if="dialogData.pageType ==='approve'"
          class="examineAndApprove"
        >
          <el-form
            label-width="90px"
            :model="rectificationFromData"
            class="demo-form-inline"
          >
            <el-form-item label="考核打分:">
              <el-input v-model="approveForm.checkScore" style="width: 120px;" size="mini" />
              <el-input
                v-model="approveForm.checkScore"
                style="width: 120px;"
                size="mini"
              />
            </el-form-item>
            <el-form-item label="理由:">
              <el-input v-model="approveForm.checkDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
              <el-input
                v-model="approveForm.checkDescribe"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 4}"
                placeholder="请输入内容"
              />
            </el-form-item>
            <el-form-item label="附件:">
              <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" />
              <uploadFile
                :upload-url="uploadTermExcelUrl"
                :sys-code="dialogData.sysCode"
              />
            </el-form-item>
          </el-form>
        </div>
        <!-- 延期操作 -->
        <div v-if="dialogData.pageType ==='delay' && ( dialogData.pageState ==='approve')" class="examineAndApprove">
          <el-form label-width="90px" :model="rectificationFromData" class="demo-form-inline">
        <div
          v-if="dialogData.pageType ==='delay' && ( dialogData.pageState ==='approve')"
          class="examineAndApprove"
        >
          <el-form
            label-width="90px"
            :model="rectificationFromData"
            class="demo-form-inline"
          >
            <el-form-item label="延期天数:">
              <el-input v-model="delayForm.extensionNum" style="width: 200px;" />
              <el-input
                v-model="delayForm.extensionNum"
                style="width: 200px;"
              />
            </el-form-item>
            <el-form-item label="延期理由:">
              <el-input v-model="delayForm.remake" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
              <el-input
                v-model="delayForm.remake"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 4}"
                placeholder="请输入内容"
              />
            </el-form-item>
            <el-form-item label="附件:">
              <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" />
              <uploadFile
                :upload-url="uploadTermExcelUrl"
                :sys-code="dialogData.sysCode"
              />
            </el-form-item>
          </el-form>
        </div>
      </div>
      <el-alert v-if="parentFormData.isInvalid===1" title="已作废" type="warning" show-icon :description="`理由:${parentFormData.invalidReason}`" :closable="false">
      </el-alert>
      <div slot="footer" class="dialog-footer">
        <el-button @click="close()">关闭</el-button>
        <el-button v-if="dialogData.pageType ==='approve'" type="danger" @click="handleSubmit(50)">拒绝</el-button>
        <el-button v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" type="danger" @click="handleDelaySubmit(50)">拒绝</el-button>
        <el-button v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'" type="primary" @click="handleDelaySubmit(40)">提交</el-button>
        <el-button v-if="dialogData.pageType !=='detail'&& dialogData.pageState ==='approve'" type="primary" @click="handleSubmit(40)">提交</el-button>
      <el-alert
        v-if="parentFormData.isInvalid===1"
        title="已作废"
        type="warning"
        show-icon
        :description="`理由:${parentFormData.invalidReason}`"
        :closable="false"
      />
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="close()">
          关闭
        </el-button>
        <el-button
          v-if="dialogData.pageType ==='approve'"
          type="danger"
          @click="handleSubmit(50)"
        >
          拒绝
        </el-button>
        <el-button
          v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'"
          type="danger"
          @click="handleDelaySubmit(50)"
        >
          拒绝
        </el-button>
        <el-button
          v-if="dialogData.pageType ==='delay'&& dialogData.pageState ==='edit'"
          type="primary"
          @click="handleDelaySubmit(40)"
        >
          提交
        </el-button>
        <el-button
          v-if="dialogData.pageType !=='detail'&& dialogData.pageState ==='approve'"
          type="primary"
          @click="handleSubmit(40)"
        >
          提交
        </el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="videoVisible" width="600px" :modal-append-to-body="false" :destroy-on-close="true" @close="handleCancel">
    <el-dialog
      :visible.sync="videoVisible"
      width="600px"
      :modal-append-to-body="false"
      :destroy-on-close="true"
      @close="handleCancel"
    >
      <div style="text-align: center;">
        <video ref="video" style="width: 300px;height: 500px" :src="dialogImageUrl" controls autoplay />
        <video
          ref="video"
          style="width: 300px;height: 500px"
          :src="dialogImageUrl"
          controls
          autoplay
        />
      </div>
    </el-dialog>
  </div>
@@ -224,10 +527,11 @@
    uploadFile
  },
  props: {
    isToMap: { type: Boolean, required: true, default: false },
    dialogData: { type: Object, default: () => {} },
    visible: { type: Boolean, required: true }
  },
  data() {
  data () {
    return {
      centerDialogVisible: true,
      workForme: {
@@ -277,11 +581,11 @@
    }
  },
  computed: {
    uploadTermExcelUrl() {
    uploadTermExcelUrl () {
      return `${requestObj.baseUrl}/file/upload`
    },
    parentFormData() {
      console.log('parentFormData.approveList', this.dialogData.parentFormData)
    parentFormData () {
      console.log('parentFormData.approveList', this.dialogData)
      return this.dialogData.parentFormData
    },
    updataUnitIdFormatter: function () {
@@ -306,20 +610,22 @@
      )
      return data ? data.dataValue : ''
    },
    setepList() {
    setepList () {
      const leng = this.dialogData.parentFormData.approveList.length
      let data = _.cloneDeep(this.dialogData.parentFormData.approveList)
      console.log('setepList', this.dialogData.parentFormData.approveList)
      if (leng === 1) {
        data = [...data, ...this.setepListAdd.set1]
        // eslint-disable-next-line vue/no-side-effects-in-computed-properties
        this.activeLeng = 1
      }
      if (leng === 2) {
        data = [...data, ...this.setepListAdd.set2]
        // eslint-disable-next-line vue/no-side-effects-in-computed-properties
        this.activeLeng = 2
      }
      if (leng === 3) {
        data = [...data, ...this.setepListAdd.set3]
        // eslint-disable-next-line vue/no-side-effects-in-computed-properties
        this.activeLeng = 4
      }
      console.log('datadata', data)
@@ -328,14 +634,14 @@
  },
  watch: {
    parentFormData: {
      handler(newVal) {
      handler (newVal) {
        this.searchthisFileList(newVal)
      },
      deep: true,
      immediate: true
    }
  },
  created() {
  created () {
    const name = this.$store.state.user.name
    this.workForme.changeName = name
    this.getContaminateList()
@@ -353,7 +659,10 @@
    })
  },
  methods: {
    getPreviewImages(index, list) {
    toMap () {
      this.$emit('update:isToMap', true)
    },
    getPreviewImages (index, list) {
      let startIndex = 0
      const chechList = _.cloneDeep(list)
      chechList.forEach((item, i) => {
@@ -369,16 +678,16 @@
      var remain = imgList.splice(0, startIndex)
      return start.concat(remain)
    },
    openVideo(item) {
    openVideo (item) {
      console.log('item', item)
      this.dialogImageUrl = item.url
      this.videoVisible = true
    },
    handleCancel() {
    handleCancel () {
      this.dialogImageUrl = ''
      this.videoVisible = false
    },
    searchthisFileList(newVal) {
    searchthisFileList (newVal) {
      if (newVal.fileBaseList && newVal.fileBaseList.length > 0) {
        newVal.fileBaseList.forEach(item => {
          if (item.fileType === 1) {
@@ -456,11 +765,11 @@
        })
      }
    },
    close() {
    close () {
      this.$emit('update:visible', false)
    },
    // 获取责任单位list
    getUnitList() {
    getUnitList () {
      this.$request({
        url: '/allocation/unit',
        method: 'get'
@@ -468,7 +777,7 @@
        this.unitList = res.data
      })
    },
    handleDelaySubmit(state) {
    handleDelaySubmit (state) {
      this.$request({
        url: '/allocationExtension/check',
        method: 'get',
@@ -485,7 +794,7 @@
        }
      })
    },
    handleSubmit(state) {
    handleSubmit (state) {
      // 整改
      let api = '/allocation/change'
      let data = {}
@@ -527,7 +836,7 @@
        }
      })
    },
    getContaminateList() {
    getContaminateList () {
      this.$request({
        url: '/allocation/contaminate',
        method: 'get'