diff --git a/web/src/components/fileSelector/index.vue b/web/src/components/fileSelector/index.vue index d3f04fc..e9f18f6 100644 --- a/web/src/components/fileSelector/index.vue +++ b/web/src/components/fileSelector/index.vue @@ -5,7 +5,7 @@ @remove-tag="selectedInit"> -
-
- +
+ + + +
+
+ +
+ + + +
+
+
@@ -95,6 +110,7 @@ const props = defineProps({ tabsShow: { type: Number, default: SHOW.ALL }, // 是否可以多选,默认单选 + // 该值为true时inputType必须是selector(暂不支持其他type的多选) multiple: { type: Boolean, default: false }, // 是否可选,该参数用于只上传和展示而不选择和绑定model的情况 @@ -153,24 +169,16 @@ const onItemClick = async (e: MouseEvent) => { while (!target.dataset.id) target = target.parentElement as HTMLElement; let fileId = target.dataset.id; if (props.multiple) { - if (target.classList.contains('active')) { - target.classList.remove('active'); - flat = -1; - } else { - target.classList.add('active'); - flat = 1; - } + if (target.classList.contains('active')) { target.classList.remove('active'); flat = -1; } + else { target.classList.add('active'); flat = 1; } if (data.value) { if (flat === 1) data.value.push(fileId); else data.value.splice(data.value.indexOf(fileId), 1); - } - else data.value = [fileId]; + } else data.value = [fileId]; // 去重排序,<降序,>升序 data.value = Array.from(new Set(data.value)).sort(); } else { - for (let i of listContainerRef.value?.children) { - (i as HTMLElement).classList.remove('active'); - } + for (let i of listContainerRef.value?.children) (i as HTMLElement).classList.remove('active'); target.classList.add('active'); data.value = fileId; } @@ -183,11 +191,8 @@ const selectedInit = async () => { for (let i of (listContainerRef.value?.children || [])) { i.classList.remove('active'); let fid = (i as HTMLElement).dataset.id; - if (props.multiple) { - if (data.value?.includes(fid)) i.classList.add('active'); - } else { - if (fid === data.value) i.classList.add('active'); - } + if (props.multiple) { if (data.value?.includes(fid)) i.classList.add('active'); } + else { if (fid === data.value) i.classList.add('active'); } } }; const uploadRef = ref(); @@ -219,7 +224,11 @@ const onDataChange = (value: any) => { defineExpose({ data, onDataChange, selectVisiable, clear, dataClear }); -onMounted(() => listRequestAll()); +onMounted(() => { + if (props.multiple && props.inputType !== 'selector') + throw new Error('FileSelector组件属性multiple为true时inputType必须为selector'); + listRequestAll(); +}); \ No newline at end of file