档案移交记录功能

src/views/fileTransfer/accept.vue

@@ -18,18 +18,42 @@
       @on-load="onLoad"
     >
       <template #receiveStatus="{ row }">
-        {{
-          getProgressStatusText(row.receiveStatus)
-        }}
+        <span
+          class="clickable-status"
+          @click="handleTProgress(row)"
+        >
+          {{ getProgressStatusText(row.transferStatus) }}
+        </span>
       </template>
       <template #deptId="{ row }">
         {{ row.deptName }}
       </template>
+
+      <!-- 接收清单操作 -->
+      <template #transferIssue="{ row }">
+         <span
+           class="clickable-status"
+           @click="handleTList(row)"
+         >
+          查看清单
+        </span>
+      </template>
+
     </avue-crud>
   </basic-container>
+
+  <RecordList
+    v-model="recordListVisible"
+    :title="recordListTitle"
+    :row-data="recordListRow"
+    :jump-type="recordListJumpType"
+    @handle-query="onLoad(page, query)"
+    @close="recordListVisible = false"
+  />
 </template>
 
 <script>
+import RecordList from '@/views/fileTransfer/components/recordAcceptList.vue'
 import {
   getTransferReceiceListApi,
 } from '@/api/filesTransfer/accept';
@@ -38,6 +62,9 @@ import website from '@/config/website';
 import { getDeptSelectApi } from '@/api/select';
 
 export default {
+  components: {
+    RecordList
+  },
   data() {
     return {
       form: {},
@@ -102,6 +129,7 @@ export default {
           {
             label: '接收清单',
             prop: 'transferIssue',
+            slot: true // 启用插槽
           },
           {
             label: '接收进度',
@@ -112,6 +140,11 @@ export default {
         ],
       },
       data: [],
+
+      recordListVisible: false,
+      recordListTitle: '',
+      recordListRow: null,
+      recordListJumpType: 'list'
     };
   },
   computed: {
@@ -222,8 +255,31 @@ export default {
         this.selectionClear();
       });
     },
+
+    handleTList(row) {
+      this.recordListTitle = '移交清单';
+      this.recordListRow = row;
+      this.recordListJumpType = 'list';
+      this.recordListVisible = true;
+    },
+
+    handleTProgress(row) {
+      this.recordListTitle = '移交进度';
+      this.recordListRow = row;
+      this.recordListJumpType = 'progress';
+      this.recordListVisible = true;
+    }
   },
 };
 </script>
 
-<style></style>
+<style scoped>
+.clickable-status {
+  color: #409eff;
+  cursor: pointer;
+  text-decoration: none;
+}
+.clickable-status:hover {
+  text-decoration: underline;
+}
+</style>

src/views/fileTransfer/components/recordAcceptList.vue

@@ -0,0 +1,193 @@
+<template>
+  <!-- 小型弹窗，用于查看移交清单/进度 -->
+  <el-dialog
+    class="l-dialog"
+    :class="lDialog"
+    :title="title"
+    v-model="dialogVisible"
+    :show-close="true"
+    :close-on-click-modal="false"
+    @close="handleClose"
+    append-to-body
+    width="700px"
+  >
+    <el-table
+      :data="tableData"
+      style="width: 100%"
+      border
+      header-align="center"
+      max-height="600"
+    >
+      <el-table-column type="index" label="序号" width="80" align="center" />
+
+      <el-table-column
+        v-for="item in tableColumns"
+        :key="item.prop"
+        :prop="item.prop"
+        :label="item.label"
+        align="center"
+      >
+        <template #default="scope">
+          <span
+            v-if="item.prop === 'fileName'"
+            class="file-name-link"
+            @click="viewFile(scope.row)"
+            style="color: #409eff; cursor: pointer"
+          >
+            {{ scope.row.fileName }}
+          </span>
+          <span v-else>
+            {{ scope.row[item.prop] }}
+          </span>
+        </template>
+      </el-table-column>
+
+
+    </el-table>
+
+    <!-- 预览文件 -->
+    <ViewFile
+      v-if="isViewFlag"
+      :row-data="currentRow"
+      title="预览"
+      @close-dialog="isViewFlag = false"
+      :width="600"
+    />
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, computed, onMounted, watch } from 'vue';
+import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
+import { getTransferReceiceFilesApi } from '@/api/filesTransfer/accept';
+import ViewFile from '@/views/viewFile/viewFile.vue';
+
+// ================== Props & Emits ==================
+const props = defineProps({
+  modelValue: Boolean, // v-model:visible
+  title: String,
+  rowData: Object,
+  jumpType: {
+    type: String,
+    required: true,
+    validator: (val) => ['list', 'progress'].includes(val)
+  }
+});
+
+const emit = defineEmits(['update:modelValue', 'close', 'handle-query']);
+
+// ================== Refs ==================
+const dialogVisible = ref(false);
+const tableData = ref([]);
+const currentRow = ref(null);
+const isViewFlag = ref(false);
+const isMaintenanceVisible = ref(false);
+const maintenanceRow = ref(null);
+
+const lDialog = computed(() => (props.title?.length > 10 ? 'w700' : 'w500'));
+
+// 动态列
+const tableColumns = computed(() => {
+  if (props.jumpType === 'list') {
+    return [
+      { prop: 'parParentName', label: '所属分类' },
+      { prop: 'parentName', label: '所属案卷' },
+      { prop: 'fileName', label: '文件名称' }
+    ];
+  } else {
+    return [
+      { prop: 'parParentName', label: '所属分类' },
+      { prop: 'parentName', label: '所属案卷' },
+      { prop: 'fileName', label: '文件名称' },
+      { prop: 'transferStatus', label: '进度' }
+    ];
+  }
+});
+
+// ================== Methods ==================
+const initFormData = async () => {
+  if (!props.rowData?.id) return;
+  const res = await getTransferReceiceFilesApi({ transferApplyId: props.rowData.id });
+  if (Array.isArray(res.data.data)) {
+    tableData.value = res.data.data.map(item => ({
+      ...item,
+      transferStatus: (item.transferStatus ?? '0') === '0' ? '进行中' : '已完成'
+    }));
+  }
+};
+
+const viewFile = (row) => {
+  currentRow.value = row;
+  isViewFlag.value = true;
+};
+
+const handleMaintenance = (row) => {
+  maintenanceRow.value = row;
+  isMaintenanceVisible.value = true;
+};
+
+const transfer = (row) => {
+  ElMessageBox.confirm(`是否确认移交文件名称为 "${row.fileName}" 的数据项？`, '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(async () => {
+    const loading = ElLoading.service({ text: '正在移交，请稍候...' });
+    try {
+      const res = await updateTransferRecordFilesStatusApi({
+        transferApplyId: props.rowData.id,
+        id: row.fileId,
+        transferStatus: '1'
+      });
+      loading.close();
+      if (res.data.code === 200) {
+        ElMessage.success(res.data.msg);
+        await handleQuery();
+        emit('handle-query');
+      } else {
+        ElMessage.error(res.data.msg);
+      }
+    } catch (error) {
+      loading.close();
+    }
+  });
+};
+
+const handleQuery = async () => {
+  await initFormData();
+};
+
+const handleClose = () => {
+  dialogVisible.value = false;
+  emit('update:modelValue', false);
+  emit('close');
+};
+
+// ================== Watch & Lifecycle ==================
+watch(
+  () => props.modelValue,
+  (val) => {
+    dialogVisible.value = val;
+    if (val) {
+      initFormData();
+    }
+  },
+  { immediate: true }
+);
+
+onMounted(() => {
+  if (props.modelValue) {
+    initFormData();
+  }
+});
+</script>
+
+<style scoped>
+.l-dialog .el-dialog__header .el-dialog__title {
+  font-size: 16px;
+}
+.file-name-link {
+  color: #409eff;
+  cursor: pointer;
+}
+</style>