Commit f9a7dc46236d595a194c7ce47a24bf7974fc4835

Authored by ww
1 parent db8072d7

fix: DEFECT-1565 修复设备导入上传文件后返回上一步文件消失

1 1 <script lang="ts" setup>
2 2 import { Upload, Button } from 'ant-design-vue';
3 3 import { InboxOutlined } from '@ant-design/icons-vue';
4   - import { computed, ref } from 'vue';
  4 + import { computed } from 'vue';
5 5 import StepContainer from './StepContainer.vue';
6 6 import XLSX, { CellObject } from 'xlsx';
7 7 import { basicProps } from './props';
... ... @@ -9,15 +9,17 @@
9 9
10 10 const props = defineProps({
11 11 ...basicProps,
  12 + fileList: {
  13 + required: true,
  14 + type: Array as PropType<(Record<'uid' | 'name', string> & File)[]>,
  15 + },
12 16 value: {
13 17 require: true,
14 18 type: Object as PropType<UploadFileParseValue>,
15 19 },
16 20 });
17 21
18   - const emit = defineEmits(['update:value']);
19   -
20   - const fileList = ref<Record<'uid' | 'name', string>[]>([]);
  22 + const emit = defineEmits(['update:value', 'update:fileList']);
21 23
22 24 interface FileRequestParams {
23 25 file: File & { uid: string };
... ... @@ -75,19 +77,19 @@
75 77 };
76 78
77 79 const handleParseFile = async ({ file, onSuccess, onError }: FileRequestParams) => {
78   - fileList.value = [];
79 80 const value = await readFile(file);
80 81 if (!value) {
81 82 onError();
82 83 return;
83 84 }
84   - fileList.value = [file];
  85 +
  86 + emit('update:fileList', [file]);
85 87 emit('update:value', value);
86 88 onSuccess({}, file);
87 89 };
88 90
89 91 const canGoNextStep = computed(() => {
90   - return !!fileList.value.length;
  92 + return !!props.fileList.length;
91 93 });
92 94
93 95 const handlePreviousStep = () => {
... ... @@ -97,16 +99,22 @@
97 99 const handleNextStep = () => {
98 100 props.goNextStep?.();
99 101 };
  102 +
  103 + const handleRemove = () => {
  104 + emit('update:fileList', []);
  105 + return true;
  106 + };
100 107 </script>
101 108
102 109 <template>
103 110 <StepContainer>
104 111 <div class="">设备文件</div>
105 112 <Upload.Dragger
106   - v-model:fileList="fileList"
  113 + :fileList="fileList"
107 114 :customRequest="handleParseFile"
108 115 accept=".csv"
109 116 name="file"
  117 + :remove="handleRemove"
110 118 >
111 119 <section class="cursor-pointer flex flex-col justify-center items-center">
112 120 <InboxOutlined class="text-[4rem] !text-blue-400" />
... ...
... ... @@ -17,6 +17,8 @@
17 17
18 18 const basicInfo = ref({});
19 19
  20 + const fileList = ref<(File & Record<'uid' | 'name', string>)[]>([]);
  21 +
20 22 const fileParseValue = ref<UploadFileParseValue>({ header: [], content: [] });
21 23
22 24 const columnConfiguration = ref<Record<'type', string>[]>([]);
... ... @@ -61,6 +63,7 @@
61 63
62 64 const reset = () => {
63 65 basicInfo.value = {};
  66 + fileList.value = [];
64 67 fileParseValue.value = { header: [], content: [] };
65 68 columnConfiguration.value = [];
66 69 importResult.value = {} as unknown as ImportDeviceResponse;
... ... @@ -109,6 +112,7 @@
109 112 />
110 113 <ImportCsv
111 114 v-if="StepsEnum[item] === StepsEnum.IMPORT_FILE && StepsEnum[item] === currentStep"
  115 + v-model:fileList="fileList"
112 116 v-model:value="fileParseValue"
113 117 :go-next-step="goNextStep"
114 118 :go-previous-step="goPreviousStep"
... ...