| | |
| | | :tableData="list" |
| | | :columns="columns" |
| | | :autoHeight="false" |
| | | :operationBtns="operationBtns" |
| | | :operationBtns="columnsProps.operationBtns" |
| | | :operationColumnWidth="240" |
| | | :showTableColumnSetting="false" |
| | | > |
| | | <template #fileBusinessType="{ row }"> |
| | | {{ AllEnterpriseMaterialFileBusinessTypeEnumText[row.fileBusinessType] }} |
| | | {{ FourStreamsMaterialFileBusinessTypeEnumText[row.fileBusinessType] }} |
| | | </template> |
| | | <template #operationBtn-uploadBtn="{ data, row }"> |
| | | <BlFileUpload |
| | |
| | | </template> |
| | | |
| | | <script setup lang="ts"> |
| | | import { FourStreamsMaterialFileTableProps, FourStreamsMaterialFileTableItem } from './types'; |
| | | import { |
| | | FourStreamsMaterialFileTableProps, |
| | | FourStreamsMaterialFileTableItem, |
| | | FourStreamsMaterialFileBusinessTypeEnumText, |
| | | } from './types'; |
| | | import { |
| | | ProTableV2, |
| | | defineColumns, |
| | |
| | | BlFileUpload, |
| | | bolePreview, |
| | | } from '@bole-core/components'; |
| | | import { AllEnterpriseMaterialFileBusinessTypeEnumText } from '@/constants'; |
| | | import { downloadFileByUrl } from '@/utils'; |
| | | import { Message, isFileCanPreview } from '@bole-core/core'; |
| | | import { useDefineColumns } from '@/hooks'; |
| | | |
| | | defineOptions({ |
| | | name: 'FourStreamsMaterialFileTable', |
| | |
| | | showCheckBtn: true, |
| | | showDownloadBtn: true, |
| | | showDeleteBtn: true, |
| | | downloadBtnText: '下载', |
| | | }); |
| | | |
| | | const list = defineModel<FourStreamsMaterialFileTableItem[]>('list'); |
| | |
| | | }, |
| | | ]); |
| | | |
| | | const operationBtns = defineOperationBtns([ |
| | | { |
| | | data: { |
| | | enCode: 'uploadBtn', |
| | | name: '上传', |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | if (!props.showUploadBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | return fileList?.length > 0; |
| | | const columnsProps = useDefineColumns({ |
| | | operationBtns: [ |
| | | { |
| | | data: { |
| | | enCode: 'uploadBtn', |
| | | name: '上传', |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | 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: FourStreamsMaterialFileTableItem) => { |
| | | 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; |
| | | { |
| | | data: { |
| | | enCode: 'detailBtn', |
| | | name: '查看', |
| | | }, |
| | | emits: { |
| | | onClick: (row) => handlePreview(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | if (!props.showCheckBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | if (!fileList?.length) { |
| | | return true; |
| | | } else { |
| | | return !isFileCanPreview(fileList[0].path); |
| | | if (fileList.length > 1) { |
| | | return false; |
| | | } else { |
| | | return !isFileCanPreview(fileList[0].path); |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }, |
| | | }, |
| | | { |
| | | data: { |
| | | enCode: 'downloadBtn', |
| | | name: '下载', |
| | | }, |
| | | emits: { |
| | | onClick: (row) => handleBatchDownload(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | return ( |
| | | !props.showDownloadBtn || |
| | | !row?.fileList?.filter?.((item) => item.status === 'success')?.length |
| | | ); |
| | | { |
| | | data: { |
| | | enCode: 'downloadBtn', |
| | | name: props.downloadBtnText, |
| | | }, |
| | | emits: { |
| | | onClick: (row) => handleBatchDownload(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | 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: FourStreamsMaterialFileTableItem) => { |
| | | if (!props.showDeleteBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | return !fileList?.length; |
| | | { |
| | | data: { |
| | | enCode: 'delBtn', |
| | | name: '删除', |
| | | }, |
| | | props: { |
| | | type: 'danger', |
| | | }, |
| | | emits: { |
| | | onClick: (row) => handleDelete(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: FourStreamsMaterialFileTableItem) => { |
| | | if (!props.showDeleteBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | return !fileList?.length; |
| | | }, |
| | | }, |
| | | }, |
| | | }, |
| | | ]); |
| | | ], |
| | | }); |
| | | |
| | | async function handleDelete(row: FourStreamsMaterialFileTableItem) { |
| | | try { |