| | |
| | | :operationColumnWidth="240" |
| | | :showTableColumnSetting="false" |
| | | > |
| | | <template #fileBusinessType="{ row }"> |
| | | {{ BusinessTypeEnumText[row.fileBusinessType] }} |
| | | </template> |
| | | <template #operationBtn-uploadBtn="{ data, row }"> |
| | | <BlFileUpload |
| | | v-model:file-url="row.fileList" |
| | | v-model:file-url="row.listFiles" |
| | | multiple |
| | | :limit="1" |
| | | :limit="99" |
| | | ref="uploadRef" |
| | | :showTip="false" |
| | | :show-file-list="false" |
| | |
| | | <FourStreamsBatchMaterialFileDialog |
| | | v-bind="dialogProps" |
| | | :name="''" |
| | | :zipName="`${BusinessTypeEnumText[currentFourStreamsMaterialFileTableItem.fileBusinessType as any]}`" |
| | | v-model:fileList="currentFourStreamsMaterialFileTableItem.fileList" |
| | | :zipName="currentFourStreamsMaterialFileTableItem.fileTypeName" |
| | | v-model:fileList="currentFourStreamsMaterialFileTableItem.listFiles" |
| | | :showDeleteBtn="showDeleteBtn" |
| | | :yearMonth="date" |
| | | :onDelete="(file) => handleDialogDelete(currentFourStreamsMaterialFileTableItem, file)" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup lang="ts" generic="T"> |
| | | import { |
| | | FourStreamsMaterialFileTableProps, |
| | | BaseMaterialFileTableItem, |
| | | FourStreamsMaterialFileBusinessTypeEnumText, |
| | | } from './types'; |
| | | import { FourStreamsMaterialFileTableProps } from './types'; |
| | | import { |
| | | ProTableV2, |
| | | defineColumns, |
| | |
| | | BlFileUpload, |
| | | bolePreview, |
| | | useDialog, |
| | | UploadUserFile, |
| | | } 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 { CustomerApplyFileTypeListItem } from './utils'; |
| | | |
| | | defineOptions({ |
| | | name: 'FourStreamsMaterialFileTable', |
| | |
| | | showDownloadBtn: true, |
| | | showDeleteBtn: true, |
| | | downloadBtnText: '下载', |
| | | BusinessTypeEnumText: () => FourStreamsMaterialFileBusinessTypeEnumText, |
| | | }); |
| | | |
| | | const list = defineModel<BaseMaterialFileTableItem<T>[]>('list'); |
| | | const list = defineModel<CustomerApplyFileTypeListItem[]>('list'); |
| | | |
| | | const columns = defineColumns([ |
| | | { |
| | | id: '1', |
| | | enCode: 'fileBusinessType', |
| | | enCode: 'fileTypeName', |
| | | name: '材料名称', |
| | | }, |
| | | ]); |
| | |
| | | name: '上传', |
| | | }, |
| | | extraProps: { |
| | | hide: (row: BaseMaterialFileTableItem<T>) => { |
| | | if (!props.showUploadBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | return fileList?.length > 0; |
| | | hide: (row: CustomerApplyFileTypeListItem) => { |
| | | return !props.showUploadBtn; |
| | | // if (!props.showUploadBtn) return true; |
| | | // let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | // return fileList?.length > 0; |
| | | }, |
| | | }, |
| | | }, |
| | |
| | | onClick: (row) => handlePreview(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: BaseMaterialFileTableItem<T>) => { |
| | | hide: (row: CustomerApplyFileTypeListItem) => { |
| | | if (!props.showCheckBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | let fileList = row?.listFiles?.filter?.((item) => item.status === 'success'); |
| | | if (!fileList?.length) { |
| | | return true; |
| | | } else { |
| | |
| | | onClick: (row) => handleBatchDownload(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: BaseMaterialFileTableItem<T>) => { |
| | | hide: (row: CustomerApplyFileTypeListItem) => { |
| | | return ( |
| | | !props.showDownloadBtn || |
| | | !row?.fileList?.filter?.((item) => item.status === 'success')?.length |
| | | !row?.listFiles?.filter?.((item) => item.status === 'success')?.length |
| | | ); |
| | | }, |
| | | }, |
| | |
| | | onClick: (row) => handleDelete(row), |
| | | }, |
| | | extraProps: { |
| | | hide: (row: BaseMaterialFileTableItem<T>) => { |
| | | hide: (row: CustomerApplyFileTypeListItem) => { |
| | | if (!props.showDeleteBtn) return true; |
| | | let fileList = row?.fileList?.filter?.((item) => item.status === 'success'); |
| | | let fileList = row?.listFiles?.filter?.((item) => item.status === 'success'); |
| | | return !fileList?.length; |
| | | }, |
| | | }, |
| | |
| | | ], |
| | | }); |
| | | |
| | | async function handleDelete(row: BaseMaterialFileTableItem<T>) { |
| | | async function handleDelete(row: CustomerApplyFileTypeListItem) { |
| | | try { |
| | | await Message.deleteMessage(); |
| | | row.fileList = []; |
| | | if (row.listFiles.length > 1) { |
| | | currentFourStreamsMaterialFileTableItem.value = row; |
| | | await nextTick(); |
| | | dialogState.dialogVisible = true; |
| | | } else { |
| | | await Message.deleteMessage(); |
| | | if (props.onDelete) { |
| | | await props.onDelete(row, row.listFiles[0].id); |
| | | } |
| | | row.listFiles = []; |
| | | } |
| | | } catch (error) {} |
| | | } |
| | | |
| | | const currentFourStreamsMaterialFileTableItem = ref<BaseMaterialFileTableItem<T>>({ |
| | | fileBusinessType: 0 as any, |
| | | fileList: [], |
| | | async function handleDialogDelete( |
| | | row: CustomerApplyFileTypeListItem, |
| | | listFile: API.CustomerUploadMonthApplyFileTypeDto & UploadUserFile |
| | | ) { |
| | | if (props.onDelete) { |
| | | await props.onDelete(row, listFile.id); |
| | | } |
| | | } |
| | | |
| | | const currentFourStreamsMaterialFileTableItem = ref<CustomerApplyFileTypeListItem>({ |
| | | fileSearchTypeId: '', |
| | | fileTypeName: '', |
| | | lastUpdateTime: '', |
| | | listFiles: [], |
| | | }); |
| | | const { dialogProps, dialogState } = useDialog(); |
| | | |
| | | async function handlePreview(row: BaseMaterialFileTableItem<T>) { |
| | | if (row.fileList.length > 1) { |
| | | async function handlePreview(row: CustomerApplyFileTypeListItem) { |
| | | if (row.listFiles.length > 1) { |
| | | currentFourStreamsMaterialFileTableItem.value = row; |
| | | await nextTick(); |
| | | dialogState.dialogVisible = true; |
| | | } else { |
| | | bolePreview({ |
| | | fileUrl: row.fileList[0].url, |
| | | fileUrl: row.listFiles[0].url, |
| | | }); |
| | | } |
| | | } |
| | | |
| | | async function handleBatchDownload(row: BaseMaterialFileTableItem<T>) { |
| | | const successFileList = row.fileList.filter((item) => item.status === 'success'); |
| | | async function handleBatchDownload(row: CustomerApplyFileTypeListItem) { |
| | | const successFileList = row.listFiles.filter((item) => item.status === 'success'); |
| | | if (successFileList.length === 0) { |
| | | Message.errorMessage('没有可下载的文件'); |
| | | return; |