From bbd3fd4b0366fc13e73db6025908d57f5ee6be0b Mon Sep 17 00:00:00 2001
From: zhufu <17863654727@163.com>
Date: Thu, 20 Mar 2025 14:19:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8E=86=E5=8F=B2=E4=B8=BE=E8=AF=81=20?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=E5=92=8C=E9=99=84=E4=BB=B6=E5=8F=AF=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E5=85=B6=E4=BB=96=E4=B8=93=E9=A2=98=E6=88=96=E5=8E=86?=
 =?UTF-8?q?=E5=8F=B2=E5=9B=BE=E7=89=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/tiankongdi/index.ts                   |  30 ++++
 .../Upload/src/components/FileUpload.vue      |  97 +++++++++---
 .../components/FileUploadSelectOtherModal.vue | 144 ++++++++++++++++++
 .../Upload/src/components/ImageUpload.vue     |  41 +++++
 .../ImageUploadSelectOtherModal.vue           | 130 ++++++++++++++++
 src/utils/global.ts                           |  24 +++
 .../demo/workflow/task/process/audit.vue      |   3 +
 7 files changed, 446 insertions(+), 23 deletions(-)
 create mode 100644 src/components/Upload/src/components/FileUploadSelectOtherModal.vue
 create mode 100644 src/components/Upload/src/components/ImageUploadSelectOtherModal.vue

diff --git a/src/api/tiankongdi/index.ts b/src/api/tiankongdi/index.ts
index 59799df4..ce630a0b 100644
--- a/src/api/tiankongdi/index.ts
+++ b/src/api/tiankongdi/index.ts
@@ -59,6 +59,12 @@ enum Api {
   GetIntersects = "/api/GeoTiffManager/GetIntersects",
   // 获取网络环境
   GetNetWorkEev = "/api/DroneCloudQuery/IsPublic",
+  // 获取其他专题或历史图斑图片
+  rebackzhuantipic = "/api/DroneCaseInfoSingle/rebackzhuantipic",
+  CopyImg = "/api/DroneCaseInfoSingle/CopyImg",
+  // 获取其他专题或历史图斑附件
+  rebackzhuantifujian = "/api/DroneCaseInfoSingle/rebackzhuantifujian",
+  Copyfujian = "/api/DroneCaseInfoSingle/Copyfujian"
 }
 
 /**
@@ -175,4 +181,28 @@ export function getIntersectTif(params){
 
 export function getNetworkType(){
   return defHttp.get({ url: Api.GetNetWorkEev }); 
+}
+export function rebackzhuantipic(params:{ zhuanti, CaseId }){
+  return defHttp.get({ 
+    url: Api.rebackzhuantipic,
+    params
+  }); 
+}
+export function CopyImg(params:string[]){
+  return defHttp.post({ 
+    url: Api.CopyImg,
+    data:params,
+  }); 
+}
+export function rebackzhuantifujian(params:{ zhuanti, CaseId }){
+  return defHttp.get({ 
+    url: Api.rebackzhuantifujian,
+    params
+  }); 
+}
+export function Copyfujian(params:string[]){
+  return defHttp.post({ 
+    url: Api.Copyfujian,
+    data:params,
+  }); 
 }
\ No newline at end of file
diff --git a/src/components/Upload/src/components/FileUpload.vue b/src/components/Upload/src/components/FileUpload.vue
index 1ab12a03..4c9e2d4f 100644
--- a/src/components/Upload/src/components/FileUpload.vue
+++ b/src/components/Upload/src/components/FileUpload.vue
@@ -1,27 +1,27 @@
 <template>
   <div>
-    <UploadDragger
-      v-bind="$attrs"
-      :list-type="listType"
-      :accept="getStringAccept"
-      :multiple="multiple"
-      :showUploadList="false"
-      :maxCount="maxNumber"
-      :before-upload="beforeUpload"
-      :custom-request="customRequest"
-      @preview="handlePreview"
-      @remove="handleRemove"
-    >
-      <!-- <div v-if="fileList && fileList.length < maxNumber">
-        <plus-outlined />
-        <div style="margin-top: 8px">{{ t('component.upload.upload') }}</div>
-      </div> -->
-      <p class="ant-upload-drag-icon">
-        <inbox-outlined></inbox-outlined>
-      </p>
-      <p class="ant-upload-text">单击或拖动文件到此区域进行上传</p>
-      <p class="ant-upload-hint"> 支持单次或批量上传。 </p>
-    </UploadDragger>
+    <div style="display: flex;">
+      <UploadDragger
+        class="upload-file"
+        v-bind="$attrs"
+        :list-type="listType"
+        :accept="getStringAccept"
+        :multiple="multiple"
+        :showUploadList="false"
+        :maxCount="maxNumber"
+        :before-upload="beforeUpload"
+        :custom-request="customRequest"
+        @preview="handlePreview"
+        @remove="handleRemove"
+      >
+        <p class="ant-upload-drag-icon">
+          <inbox-outlined></inbox-outlined>
+        </p>
+        <p class="ant-upload-text">单击或拖动文件到此区域进行上传</p>
+        <p class="ant-upload-hint"> 支持单次或批量上传。 </p>
+      </UploadDragger>
+      <div :class="`copy-other ${$attrs.disabled? 'copy-other-disabled': ''}`" @click="openSelectOther">历史举证</div>
+    </div>
 
     <div class="file-item" v-for="(item, index) in fileList" :key="index">
       {{ handlerDealFileName(item.name) }}
@@ -38,11 +38,17 @@
     <Modal :open="previewOpen" :title="previewTitle" :footer="null" @cancel="handleCancel">
       <img alt="" style="width: 100%" :src="previewImage" />
     </Modal>
+    <a-modal v-model:open="openSelectOtherModal" title="历史举证" :footer="null" :destroyOnClose="true">
+      <FileUploadSelectOtherModal
+        :server="props.server"
+        @save="saveOtherFile"
+      />
+    </a-modal>
   </div>
 </template>
 
 <script lang="ts" setup>
-  import { ref, toRefs, watch } from 'vue';
+  import { ref, toRefs, watch, useAttrs } from 'vue';
   import {
     PlusOutlined,
     InboxOutlined,
@@ -63,6 +69,7 @@
   import { UploadResultStatus } from '@/components/Upload/src/types/typing';
   import { fileUploadApi } from '@/api/sys/upload';
   import axios from 'axios';
+  import FileUploadSelectOtherModal from './FileUploadSelectOtherModal.vue'
 
   defineOptions({ name: 'ImageUpload' });
 
@@ -70,6 +77,7 @@
   const props = defineProps({
     ...uploadContainerProps,
   });
+  const attrs = useAttrs()
   const { t } = useI18n();
   const { createMessage } = useMessage();
   const { accept, helpText, maxNumber, maxSize } = toRefs(props);
@@ -87,6 +95,7 @@
   const fileList = ref<UploadProps['fileList']>([]);
   const isLtMsg = ref<boolean>(true);
   const isActMsg = ref<boolean>(true);
+  const openSelectOtherModal = ref(false)
 
   watch(
     () => props.value,
@@ -288,6 +297,24 @@
     });
     return path;
   }
+  const openSelectOther = () => {
+    if(attrs.disabled) return
+    openSelectOtherModal.value = true
+  }
+  const saveOtherFile = (list:string[]) => {
+    const { server } = props;
+    list.forEach(item => {
+      fileList.value?.push({
+        uid: '-1',
+        name: item,
+        status: 'done',
+        url: server + '/' + item,
+      });
+    })
+    const value = getValue();
+    emit('change', value);
+    openSelectOtherModal.value = false
+  }
 </script>
 
 <style lang="less">
@@ -319,3 +346,27 @@
     color: #999;
   }
 </style>
+<style lang="scss" scoped>
+.upload-file{
+  width: calc(100% - 161px);
+}
+.copy-other{
+  width: 161px;
+  // height: 100px;
+  border: 1px dashed #d9d9d9;
+  background-color: rgba(0, 0, 0, 0.02);
+  cursor: pointer;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 10px;
+}
+.copy-other:hover{
+  border-color: #0960bd;
+}
+.copy-other-disabled{
+  cursor: no-drop;
+  border-color: #d9d9d9 !important;
+}
+</style>
diff --git a/src/components/Upload/src/components/FileUploadSelectOtherModal.vue b/src/components/Upload/src/components/FileUploadSelectOtherModal.vue
new file mode 100644
index 00000000..63cd5b8a
--- /dev/null
+++ b/src/components/Upload/src/components/FileUploadSelectOtherModal.vue
@@ -0,0 +1,144 @@
+<template>
+  <a-spin :spinning="loading">
+    <div class="modal-content">
+      <div class="subject" v-for="subject in fileList">
+        <div class="subject-name">{{ subject.zname }}</div>
+        <div class="show-file-div">
+          <div class="item-file" v-for="(item, index) in subject.val">
+            <a-checkbox
+              style="margin-right: 10px;"
+              :checked="selectFile.some(obj => obj === item.path)" 
+              @change="changeSelect(selectFile.some(obj => obj === item.path)? 1: 2,item.path)">
+            </a-checkbox>
+            <Icon icon="material-symbols:attach-file" :size="20" style="cursor: pointer;" @click="hanlderPreViewFile(item.path)"/>
+            {{ item.path }}
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="button-div">
+      <a-button type="primary" @click="save">保存</a-button>
+    </div>
+    <a-modal
+      v-model:open="previewFileModalVisible"
+      style="width: 100vw"
+      title="文件预览"
+      wrap-class-name="full-modal"
+    >
+      <FilePreview v-if="previewFileModalVisible" :fileUrl="previewFileUrl"></FilePreview>
+      <template #footer>
+        <a-button key="cancel" @click="handleCancelPreviewFile">取消</a-button>
+        <a-button key="confirm" type="primary" @click="handlerDownloadFle">下载</a-button>
+      </template>
+    </a-modal>
+  </a-spin>
+  </template>
+  
+  <script setup lang="ts">
+  import { defineProps, onMounted, ref, defineEmits } from "vue"
+  import { rebackzhuantifujian, Copyfujian } from '@/api/tiankongdi/index'
+  import Icon from '@/components/Icon/Icon.vue';
+  import { message } from "ant-design-vue";
+  import { getZhuantiName } from '@/utils/global'
+  import FilePreview from '@/components/Upload/src/components/FilePreview.vue';
+  
+  const props = defineProps(['server'])
+  const emits = defineEmits(['save'])
+  const fileList = ref<string[]>([])
+  const selectFile = ref<string[]>([])
+  const loading = ref(false)
+  const previewFileModalVisible = ref(false)
+  const previewFileUrl = ref("")
+  onMounted(() => {
+    loading.value = true
+    let caseid = sessionStorage.getItem('SelectOtherId')
+    rebackzhuantifujian({CaseId:caseid,zhuanti:getZhuantiName()}).then(res => {
+      console.log('res',res)
+      fileList.value = res
+    }).finally(() => {
+      loading.value = false
+    })
+  })
+  
+  const changeSelect = (type,item) => {
+    switch(type){
+      case 1: 
+      selectFile.value = selectFile.value.filter(useItem => useItem !== item);
+        break;
+      case 2:
+      selectFile.value.push(item)
+        break
+    }
+  }
+  const save = () => {
+    if(selectFile.value.length <= 0){
+      message.warning('至少选择一个文件')
+      return
+    }
+    loading.value = true
+    Copyfujian(selectFile.value).then(res => {
+      console.log(res)
+      emits('save', res)
+    }).finally(() => {
+      loading.value = false
+    })
+  }
+  const hanlderPreViewFile = (url)=>{
+    previewFileUrl.value = `${props.server}/${url}`;
+    previewFileModalVisible.value = true;
+  }
+
+  const handlerDownloadFle = ()=>{
+    window.open(previewFileUrl.value, 'mozillaTab');
+  }
+  const handleCancelPreviewFile = ()=>{
+    previewFileModalVisible.value = false;
+  }
+  </script>
+  
+  <style lang="scss" scoped>
+  .modal-content{
+    min-height: 500px;
+    padding: 0px 20px;
+    max-height: 678px;
+    overflow: auto;
+    scrollbar-width: none; 
+    ::-webkit-scrollbar {
+      width: 0;
+      height: 0;
+    }
+    .subject{
+      margin-bottom: 10px;
+      .subject-name{
+        height: 30px;
+        background-color: #8b8b8b;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: #fff;
+        font-size: 20px;
+        font-weight: 500;
+        margin-bottom: 10px;
+      }
+      .show-file-div{
+        width: 100%;
+        .item-file{
+          display: flex;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis; 
+        }
+        .item-file:hover{
+          background-color: #f4f4f4;
+        }
+      }
+    }
+  
+  }
+  .button-div{
+    display: flex;
+    justify-content: end;
+    padding: 20px;
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/src/components/Upload/src/components/ImageUpload.vue b/src/components/Upload/src/components/ImageUpload.vue
index 9214e4b1..c5094f6f 100644
--- a/src/components/Upload/src/components/ImageUpload.vue
+++ b/src/components/Upload/src/components/ImageUpload.vue
@@ -39,9 +39,16 @@
         <div style="margin-top: 8px">{{ t('component.upload.upload') }}</div>
       </div>
     </Upload>
+    <div v-if="!$attrs.disabled" class="copy-other" @click="openSelectOther">历史举证</div>
     <!-- <Modal :open="previewOpen" :title="previewTitle" :footer="null" @cancel="handleCancel">
       <img alt="" style="width: 100%" :src="previewImage" />
     </Modal> -->
+    <a-modal v-model:open="openSelectOtherModal" title="历史举证" :footer="null" :destroyOnClose="true">
+      <ImageUploadSelectOtherModal
+        :server="props.server"
+        @save="saveOtherImage"
+      />
+    </a-modal>
   </div>
 </template>
 
@@ -63,6 +70,7 @@
   import { fileUploadApi } from '@/api/sys/upload';
   import ImagePreview from '@/components/Upload/src/components/image_preview.vue';
   import { userFormFileStore } from '@/store/modules/formFileUrl';
+  import ImageUploadSelectOtherModal from './ImageUploadSelectOtherModal.vue'
 
   const formFileStore = userFormFileStore();
 
@@ -83,6 +91,7 @@
   const props = defineProps({
     ...uploadContainerProps,
   });
+  const openSelectOtherModal = ref(false)
 
 
   const { t } = useI18n();
@@ -327,6 +336,23 @@
       }, 250);
     }
   }
+  const openSelectOther = () => {
+    openSelectOtherModal.value = true
+  }
+  const saveOtherImage = (list:string[]) => {
+    const { server } = props;
+    list.forEach(item => {
+      fileList.value?.push({
+        uid: '-1',
+        name: item,
+        status: 'done',
+        url: server + '/' + item,
+      });
+    })
+    const value = getValue();
+    emit('change', value);
+    openSelectOtherModal.value = false
+  }
 
 </script>
 
@@ -434,4 +460,19 @@
       }
     }
   }
+  .copy-other{
+    width: 100px;
+    height: 100px;
+    border: 1px dashed #d9d9d9;
+    background-color: rgba(0, 0, 0, 0.02);
+    cursor: pointer;
+    border-radius: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 10px;
+  }
+  .copy-other:hover{
+    border-color: #0960bd;
+  }
 </style>
diff --git a/src/components/Upload/src/components/ImageUploadSelectOtherModal.vue b/src/components/Upload/src/components/ImageUploadSelectOtherModal.vue
new file mode 100644
index 00000000..eb4fa45c
--- /dev/null
+++ b/src/components/Upload/src/components/ImageUploadSelectOtherModal.vue
@@ -0,0 +1,130 @@
+<template>
+<a-spin :spinning="loading">
+  <div class="modal-content">
+    <div class="subject" v-for="subject in imageList">
+      <div class="subject-name">{{ subject.zname }}</div>
+      <div class="show-image-div">
+        <div class="image-item" v-for="(item, index) in subject.val">
+          <a-image
+            style="width:100px;height:100px;"
+            :src="`${props.server}/${item.FilePath}`"
+          ></a-image>
+          <div class="select-div" @click="changeSelect(selectImage.some(obj => obj === item.FilePath)? 1: 2,item.FilePath)">
+            <Icon v-if="selectImage.some(obj => obj === item.FilePath)" icon="material-symbols-light:check-circle" :size="25" style="color: #18a058;"/>
+            <Icon v-else icon="material-symbols-light:check-circle-outline" :size="25" style="color: #cacdcd;"/>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="button-div">
+    <a-button type="primary" @click="save">保存</a-button>
+  </div>
+</a-spin>
+</template>
+
+<script setup lang="ts">
+import { defineProps, onMounted, ref, defineEmits } from "vue"
+import { rebackzhuantipic, CopyImg } from '@/api/tiankongdi/index'
+import Icon from '@/components/Icon/Icon.vue';
+import { message } from "ant-design-vue";
+  import { getZhuantiName } from '@/utils/global'
+
+const props = defineProps(['caseid','server','zhuanti'])
+const emits = defineEmits(['save'])
+const imageList = ref<string[]>([])
+const selectImage = ref<string[]>([])
+const loading = ref(false)
+onMounted(() => {
+  loading.value = true
+  let caseid = sessionStorage.getItem('SelectOtherId')
+  rebackzhuantipic({CaseId:caseid,zhuanti:getZhuantiName()}).then(res => {
+    imageList.value = res
+  }).finally(() => {
+    loading.value = false
+  })
+})
+
+const changeSelect = (type,item) => {
+  switch(type){
+    case 1: 
+    selectImage.value = selectImage.value.filter(useItem => useItem !== item);
+      break;
+    case 2:
+    selectImage.value.push(item)
+      break
+  }
+}
+const save = () => {
+  if(selectImage.value.length <= 0){
+    message.warning('至少选择一张图片')
+    return
+  }
+  loading.value = true
+  CopyImg(selectImage.value).then(res => {
+    emits('save', res)
+  }).finally(() => {
+    loading.value = false
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.modal-content{
+  min-height: 500px;
+  padding: 0px 20px;
+  max-height: 678px;
+  overflow: auto;
+  scrollbar-width: none; 
+  ::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+  }
+  .subject{
+    margin-bottom: 10px;
+    .subject-name{
+      height: 30px;
+      background-color: #8b8b8b;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #fff;
+      font-size: 20px;
+      font-weight: 500;
+      margin-bottom: 10px;
+    }
+    .show-image-div{
+      width: 100%;
+      // height: 100%;
+      display: flex;
+      flex-wrap: wrap;
+      align-content: flex-start;
+      .image-item{
+        position: relative;
+        width: 100px;
+        height: 100px;
+        margin-right: 12px;
+        margin-bottom: 10px;
+        .select-div{
+          position: absolute;
+          bottom: 0px;
+          height: 20px;
+          width: 100%;
+          height: 30px;
+          background-color: #00000075;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+
+}
+.button-div{
+  display: flex;
+  justify-content: end;
+  padding: 20px;
+}
+</style>
diff --git a/src/utils/global.ts b/src/utils/global.ts
index ff262423..910c07c0 100644
--- a/src/utils/global.ts
+++ b/src/utils/global.ts
@@ -230,3 +230,27 @@ export const keyIssusesIIPatchSourceOptions = await asyncGetOptions('zd2tbly');
 export const inspectionAuditPatchSourceOptions = await asyncGetOptions('xcsjtbly');
 export const degrainingPatchSourceOptions = await asyncGetOptions('gdflhbly');
 export const redLinePatchSourceOptions = await asyncGetOptions('redlinetbly');
+
+export const getZhuantiName = () => {
+  let code = sessionStorage.getItem('SelectOtherZhuantiCode')
+  switch(code){
+    case "0000001":
+      return '违法用地'
+    case "0000002":
+      return '巡察审计'
+    case "0000003":
+      return '非法采矿卫片下发'
+    case "0000004":
+      return '耕地非粮化'
+    case "0000005":
+      return '重点问题Ⅰ类'
+    case "0000006":
+      return '重点问题Ⅱ类'
+    case "0000007":
+      return '生态保护红线监管'
+    case "0000008":
+      return '生态修复'
+    case "100001":
+      return '非法采矿'
+  }
+}
\ No newline at end of file
diff --git a/src/views/demo/workflow/task/process/audit.vue b/src/views/demo/workflow/task/process/audit.vue
index cdab6a44..e86206d2 100644
--- a/src/views/demo/workflow/task/process/audit.vue
+++ b/src/views/demo/workflow/task/process/audit.vue
@@ -1098,6 +1098,9 @@
 
   onBeforeMount(() => {
     getTaskInfo();
+    // 表单附件和图片组件 历史举证功能获取专题和ID 在进入审核时将数据放到session
+    sessionStorage.setItem('SelectOtherId',props.processId)
+    sessionStorage.setItem('SelectOtherZhuantiCode',props.auditData.processcode)
   });
 
   function onFormContainerMouseOver(event) {}