From d43ae50abc9461a9b20b3f015ba3679ba699dfa2 Mon Sep 17 00:00:00 2001 From: LiuHao <liuhaoai545@gmail.com> Date: 星期二, 06 六月 2023 22:52:24 +0800 Subject: [PATCH] update 修改组件 去除无用引用和代码缩进 --- src/components/FileUpload/index.vue | 60 +++++++++++++++++++++++++----------------------------------- 1 files changed, 25 insertions(+), 35 deletions(-) diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue index a46d5ee..32e871f 100644 --- a/src/components/FileUpload/index.vue +++ b/src/components/FileUpload/index.vue @@ -45,31 +45,18 @@ <script setup lang="ts"> import { getToken } from "@/utils/auth"; import { listByIds, delOss } from "@/api/system/oss"; -import { ComponentInternalInstance } from "vue"; -import { ElUpload, UploadFile } from "element-plus"; +import { propTypes } from '@/utils/propTypes'; const props = defineProps({ modelValue: [String, Object, Array], // 鏁伴噺闄愬埗 - limit: { - type: Number, - default: 5, - }, + limit: propTypes.number.def(5), // 澶у皬闄愬埗(MB) - fileSize: { - type: Number, - default: 5, - }, + fileSize: propTypes.number.def(5), // 鏂囦欢绫诲瀷, 渚嬪['png', 'jpg', 'jpeg'] - fileType: { - type: Array, - default: () => ["doc", "xls", "ppt", "txt", "pdf"], - }, + fileType: propTypes.array.def(["doc", "xls", "ppt", "txt", "pdf"]), // 鏄惁鏄剧ず鎻愮ず - isShowTip: { - type: Boolean, - default: true - } + isShowTip: propTypes.bool.def(true), }); const { proxy } = getCurrentInstance() as ComponentInternalInstance; @@ -86,7 +73,7 @@ () => props.isShowTip && (props.fileType || props.fileSize) ); -const fileUploadRef = ref(ElUpload); +const fileUploadRef = ref<ElUploadInstance>(); watch(() => props.modelValue, async val => { if (val) { @@ -96,7 +83,7 @@ if (Array.isArray(val)) { list = val; } else { - const res = await listByIds(val as string) + const res = await listByIds(val as string) list = res.data.map((oss) => { const data = { name: oss.originalName, url: oss.url, ossId: oss.ossId }; return data; @@ -104,7 +91,7 @@ } // 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁� fileList.value = list.map(item => { - item = {name: item.name, url: item.url, ossId: item.ossId}; + item = { name: item.name, url: item.url, ossId: item.ossId }; item.uid = item.uid || new Date().getTime() + temp++; return item; }); @@ -112,7 +99,7 @@ fileList.value = []; return []; } -},{ deep: true, immediate: true }); +}, { deep: true, immediate: true }); // 涓婁紶鍓嶆牎妫�鏍煎紡鍜屽ぇ灏� const handleBeforeUpload = (file: any) => { @@ -150,7 +137,7 @@ } // 涓婁紶鎴愬姛鍥炶皟 -const handleUploadSuccess = (res:any, file: UploadFile) => { +const handleUploadSuccess = (res: any, file: UploadFile) => { if (res.code === 200) { uploadList.value.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId }); uploadedSuccessfully(); @@ -158,7 +145,7 @@ number.value--; proxy?.$modal.closeLoading(); proxy?.$modal.msgError(res.msg); - fileUploadRef.value.handleRemove(file); + fileUploadRef.value?.handleRemove(file); uploadedSuccessfully(); } } @@ -172,7 +159,7 @@ } // 涓婁紶缁撴潫澶勭悊 -const uploadedSuccessfully =() => { +const uploadedSuccessfully = () => { if (number.value > 0 && uploadList.value.length === number.value) { fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value); uploadList.value = []; @@ -207,21 +194,24 @@ <style scoped lang="scss"> .upload-file-uploader { - margin-bottom: 5px; + margin-bottom: 5px; } + .upload-file-list .el-upload-list__item { - border: 1px solid #e4e7ed; - line-height: 2; - margin-bottom: 10px; - position: relative; + border: 1px solid #e4e7ed; + line-height: 2; + margin-bottom: 10px; + position: relative; } + .upload-file-list .ele-upload-list__item-content { - display: flex; - justify-content: space-between; - align-items: center; - color: inherit; + display: flex; + justify-content: space-between; + align-items: center; + color: inherit; } + .ele-upload-list__item-content-action .el-link { - margin-right: 10px; + margin-right: 10px; } </style> -- Gitblit v1.9.3