后期管理详情页面增加意见历史记录表格

src/components/customComponent/hqglProgress.vue

+<template>
+  <table style="width: 100%; table-layout: fixed" border="1" cellspacing="1" v-if="List.length > 0">
+    <tbody>
+      <template v-for="(item, index) in List" :key="index">
+        <tr class="ant-table-cell ant-table-cell-ellipsis">
+          <td class="ant-table-cell ant-table-cell-ellipsis bgColor bg1" width="10%">处理时间</td>
+          <td class="ant-table-cell ant-table-cell-ellipsis bg1" colspan="3">{{ item.createTsamp }}</td>
+        </tr>
+        <tr class="">
+          <td class="bgColor" width="10%">
+            <span>指导意见</span>
+          </td>
+          <td style="width: 90%; word-wrap: break-word; word-break: break-all" colspan="3">
+            {{ item.clyj }}
+          </td>
+        </tr>
+        <!-- 判断字段是否显示 -->
+        <tr class="ant-table-cell ant-table-cell-ellipsis" v-if="item.clyjfj">
+          <td class="ant-table-cell ant-table-cell-ellipsis bgColor" width="10%">文件</td>
+          <td class="ant-table-cell ant-table-cell-ellipsis" colspan="3">
+            <a-button preIcon="ant-design:vertical-align-bottom-outlined" @click="down(item)" style="margin-left: 10px" type="primary">
+              下载
+            </a-button>
+          </td>
+        </tr>
+        <tr class="ant-table-cell ant-table-cell-ellipsis">
+          <td class="ant-table-cell ant-table-cell-ellipsis bgColor" width="10%">意见下达人</td>
+          <td class="ant-table-cell ant-table-cell-ellipsis">{{ item.realname }}</td>
+        </tr>
+      </template>
+    </tbody>
+  </table>
+  <div v-else class="text-center">暂无填报记录</div>
+</template>
+
+<script lang="ts" setup>
+  import { defineProps } from 'vue';
+  import { downloadFile } from '/@/api/common/api';
+  const props = defineProps({
+    List: {
+      type: Array,
+      default: () => [],
+    },
+    // 定义传值对象
+  });
+  // 下载
+  function down(item) {
+    let fileExtension = item.clyjfj.split('.').pop();
+    downloadFile('/sys/common/static' + item.clyjfj, `指导意见文件.${fileExtension}`);
+  }
+</script>
+
+<style scoped>
+  table {
+    border-collapse: collapse;
+    border: 1px #dfe6ec solid;
+  }
+
+  tbody tr td {
+    padding: 6px;
+    height: 40px;
+  }
+
+  .bgColor {
+    background-color: rgba(244, 247, 249, 0.8);
+    text-align: center;
+  }
+
+  .bg1 {
+    background-color: #c8d1d1;
+  }
+</style>

src/views/dkgl/hqgl/add.vue

@@ -24,7 +24,12 @@
         <a-button type="primary" class="ml-5" v-if="index != 0" @click.prevent="del($event, index)">删除</a-button>
       </template>
     </a-collapse-panel>
+    <a-collapse-panel header="意见" key="150">
+      <hqglProgress :List="data.yjList" />
+    </a-collapse-panel>
   </a-collapse>
+  
+  
   <AdviceModal @register="registerAdviceModal"></AdviceModal>
 </template>
 
@@ -33,9 +38,10 @@
   import Environment from './components/environment.vue';
   import TestingUnit from './components/TestingUnit.vue';
   import AdviceModal from '@/components/customComponent/AdviceModal.vue';
+  import hqglProgress from '/@/components/customComponent/hqglProgress.vue';
   import { useRouter } from 'vue-router';
   import { addGljl } from './api';
-  const activeKey = ref(['1', '2', '3', '4', '5']);
+  const activeKey = ref(['1', '2', '3', '4', '5', '150']);
   let router = useRouter();
   const wrdkid = ref(router.currentRoute.value.query.wrdkid);
   const data = ref<any>({});

src/views/dkgl/hqgl/jgInfor.vue

@@ -25,6 +25,9 @@
       <a-collapse-panel key="5" header="后期监管监测数据">
         <PointInfor ref="trwrjc" :type="type" :data="data?.jcsjList" />
       </a-collapse-panel>
+      <a-collapse-panel header="意见" key="150">
+        <hqglProgress :List="data.yjList" />
+      </a-collapse-panel>
     </a-collapse>
     <AdviceModal @register="registerAdviceModal"></AdviceModal>
   </div>
@@ -35,6 +38,7 @@
   import Environment from './components/environment.vue';
   import TestingUnit from './components/TestingUnit.vue';
   import AdviceModal from '@/components/customComponent/AdviceModal.vue';
+  import hqglProgress from '/@/components/customComponent/hqglProgress.vue';
 
   import PointInfor from '/@/components/customComponent/jgdk/PointInfor.vue';
   import { useRouter } from 'vue-router';
@@ -43,7 +47,7 @@
   import { useModal } from '/@/components/Modal';
   const [registerAdviceModal, { openModal: openAdviceModal }] = useModal();
   let router = useRouter();
-  const activeKey = ref(['1', '2', '3', '4', '5']);
+  const activeKey = ref(['1', '2', '3', '4', '5', '150']);
   const wrdkid = ref(router.currentRoute.value.query.wrdkid);
   const data = ref<any>({});
   const type = ref<any>(router.currentRoute.value.query.type) || 'edit';