From 6bac509f8e6efc205d9f37a84c9b019ec828467a Mon Sep 17 00:00:00 2001
From: wupengfei <834520024@qq.com>
Date: 星期三, 07 五月 2025 14:22:26 +0800
Subject: [PATCH] feat: 接口

---
 src/components/commonView/FourStreamsMaterialFileTableV2.vue |  206 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 206 insertions(+), 0 deletions(-)

diff --git a/src/components/commonView/FourStreamsMaterialFileTableV2.vue b/src/components/commonView/FourStreamsMaterialFileTableV2.vue
new file mode 100644
index 0000000..eff3fc1
--- /dev/null
+++ b/src/components/commonView/FourStreamsMaterialFileTableV2.vue
@@ -0,0 +1,206 @@
+<template>
+  <div>
+    <ProTableV2
+      :tableData="list"
+      :columns="columns"
+      :autoHeight="false"
+      :operationBtns="columnsProps.operationBtns"
+      :operationColumnWidth="240"
+      :showTableColumnSetting="false"
+    >
+      <template #fileBusinessType="{ row }">
+        {{ BusinessTypeEnumText[row.fileBusinessType] }}
+      </template>
+      <template #operationBtn-uploadBtn="{ data, row }">
+        <BlFileUpload
+          v-model:file-url="row.fileList"
+          multiple
+          :limit="1"
+          ref="uploadRef"
+          :showTip="false"
+          :show-file-list="false"
+          class="pro-table-operation-btn upload-style-btn"
+        >
+          <el-button text type="primary" class="pro-table-operation-btn">涓婁紶</el-button>
+        </BlFileUpload>
+      </template>
+    </ProTableV2>
+    <FourStreamsBatchMaterialFileDialog
+      v-bind="dialogProps"
+      :name="''"
+      :zipName="`${BusinessTypeEnumText[currentFourStreamsMaterialFileTableItem.fileBusinessType as any]}`"
+      v-model:fileList="currentFourStreamsMaterialFileTableItem.fileList"
+      :showDeleteBtn="showDeleteBtn"
+    />
+  </div>
+</template>
+
+<script setup lang="ts" generic="T">
+import { FourStreamsMaterialFileTableProps, BaseMaterialFileTableItem } from './types';
+import {
+  ProTableV2,
+  defineColumns,
+  defineOperationBtns,
+  BlFileUpload,
+  bolePreview,
+  useDialog,
+} from '@bole-core/components';
+import { downloadFileByUrl } from '@/utils';
+import { Message, isFileCanPreview, downloadWithZip } from '@bole-core/core';
+import { useDefineColumns } from '@/hooks';
+import FourStreamsBatchMaterialFileDialog from './FourStreamsBatchMaterialFileDialog.vue';
+import { FourStreamsMaterialFileBusinessTypeEnumText } from '@/constants';
+
+defineOptions({
+  name: 'FourStreamsMaterialFileTableV2',
+});
+
+type Props = FourStreamsMaterialFileTableProps & {
+  BusinessTypeEnumText: { [key: number]: string };
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  showUploadBtn: true,
+  showCheckBtn: true,
+  showDownloadBtn: true,
+  showDeleteBtn: true,
+  downloadBtnText: '涓嬭浇',
+  BusinessTypeEnumText: () => FourStreamsMaterialFileBusinessTypeEnumText,
+});
+
+const list = defineModel<BaseMaterialFileTableItem<T>[]>('list');
+
+const columns = defineColumns([
+  {
+    id: '1',
+    enCode: 'fileBusinessType',
+    name: '鏉愭枡鍚嶇О',
+  },
+]);
+
+const columnsProps = useDefineColumns({
+  operationBtns: [
+    {
+      data: {
+        enCode: 'uploadBtn',
+        name: '涓婁紶',
+      },
+      extraProps: {
+        hide: (row: BaseMaterialFileTableItem<T>) => {
+          if (!props.showUploadBtn) return true;
+          let fileList = row?.fileList?.filter?.((item) => item.status === 'success');
+          return fileList?.length > 0;
+        },
+      },
+    },
+    {
+      data: {
+        enCode: 'detailBtn',
+        name: '鏌ョ湅',
+      },
+      emits: {
+        onClick: (row) => handlePreview(row),
+      },
+      extraProps: {
+        hide: (row: BaseMaterialFileTableItem<T>) => {
+          if (!props.showCheckBtn) return true;
+          let fileList = row?.fileList?.filter?.((item) => item.status === 'success');
+          if (!fileList?.length) {
+            return true;
+          } else {
+            if (fileList.length > 1) {
+              return false;
+            } else {
+              return !isFileCanPreview(fileList[0].path);
+            }
+          }
+        },
+      },
+    },
+    {
+      data: {
+        enCode: 'downloadBtn',
+        name: props.downloadBtnText,
+      },
+      emits: {
+        onClick: (row) => handleBatchDownload(row),
+      },
+      extraProps: {
+        hide: (row: BaseMaterialFileTableItem<T>) => {
+          return (
+            !props.showDownloadBtn ||
+            !row?.fileList?.filter?.((item) => item.status === 'success')?.length
+          );
+        },
+      },
+    },
+    {
+      data: {
+        enCode: 'delBtn',
+        name: '鍒犻櫎',
+      },
+      props: {
+        type: 'danger',
+      },
+      emits: {
+        onClick: (row) => handleDelete(row),
+      },
+      extraProps: {
+        hide: (row: BaseMaterialFileTableItem<T>) => {
+          if (!props.showDeleteBtn) return true;
+          let fileList = row?.fileList?.filter?.((item) => item.status === 'success');
+          return !fileList?.length;
+        },
+      },
+    },
+  ],
+});
+
+async function handleDelete(row: BaseMaterialFileTableItem<T>) {
+  try {
+    await Message.deleteMessage();
+    row.fileList = [];
+  } catch (error) {}
+}
+
+const currentFourStreamsMaterialFileTableItem = ref<BaseMaterialFileTableItem<T>>({
+  fileBusinessType: 0 as any,
+  fileList: [],
+});
+const { dialogProps, dialogState } = useDialog();
+
+async function handlePreview(row: BaseMaterialFileTableItem<T>) {
+  if (row.fileList.length > 1) {
+    currentFourStreamsMaterialFileTableItem.value = row;
+    await nextTick();
+    dialogState.dialogVisible = true;
+  } else {
+    bolePreview({
+      fileUrl: row.fileList[0].url,
+    });
+  }
+}
+
+async function handleBatchDownload(row: BaseMaterialFileTableItem<T>) {
+  const successFileList = row.fileList.filter((item) => item.status === 'success');
+  if (successFileList.length === 0) {
+    Message.errorMessage('娌℃湁鍙笅杞界殑鏂囦欢');
+    return;
+  }
+  if (successFileList.length === 1) {
+    downloadFileByUrl(successFileList[0].url);
+  } else {
+    // downloadWithZip(
+    //   successFileList.map((item) => ({ data: item.url })),
+    //   `${props.BusinessTypeEnumText[row.fileBusinessType as any]}`
+    // );
+    currentFourStreamsMaterialFileTableItem.value = row;
+    await nextTick();
+    dialogState.dialogVisible = true;
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@use '@/style/common.scss' as *;
+</style>

--
Gitblit v1.9.1