From ff14fa5e4efaf4e3e6a307473e9bd2881da265c1 Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期五, 18 四月 2025 12:55:34 +0800 Subject: [PATCH] 支持文件&图片组件自定义地址&参数 --- src/components/FileUpload/index.vue | 39 +++++++++++++++++++++++++++++++-------- 1 files changed, 31 insertions(+), 8 deletions(-) diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue index 2deb0b4..3a83b3a 100644 --- a/src/components/FileUpload/index.vue +++ b/src/components/FileUpload/index.vue @@ -5,6 +5,7 @@ :action="uploadFileUrl" :before-upload="handleBeforeUpload" :file-list="fileList" + :data="data" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed" @@ -13,12 +14,13 @@ :headers="headers" class="upload-file-uploader" ref="fileUpload" + v-if="!disabled" > <!-- 涓婁紶鎸夐挳 --> <el-button type="primary">閫夊彇鏂囦欢</el-button> </el-upload> <!-- 涓婁紶鎻愮ず --> - <div class="el-upload__tip" v-if="showTip"> + <div class="el-upload__tip" v-if="showTip && !disabled"> 璇蜂笂浼� <template v-if="fileSize"> 澶у皬涓嶈秴杩� <b style="color: #f56c6c">{{ fileSize }}MB</b> </template> <template v-if="fileType"> 鏍煎紡涓� <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template> @@ -31,7 +33,7 @@ <span class="el-icon-document"> {{ getFileName(file.name) }} </span> </el-link> <div class="ele-upload-list__item-content-action"> - <el-link :underline="false" @click="handleDelete(index)" type="danger">鍒犻櫎</el-link> + <el-link :underline="false" @click="handleDelete(index)" type="danger" v-if="!disabled">鍒犻櫎</el-link> </div> </li> </transition-group> @@ -43,25 +45,39 @@ const props = defineProps({ modelValue: [String, Object, Array], + // 涓婁紶鎺ュ彛鍦板潃 + action: { + type: String, + default: "/common/upload" + }, + // 涓婁紶鎼哄甫鐨勫弬鏁� + data: { + type: Object + }, // 鏁伴噺闄愬埗 limit: { type: Number, - default: 5, + default: 5 }, // 澶у皬闄愬埗(MB) fileSize: { type: Number, - default: 5, + default: 5 }, // 鏂囦欢绫诲瀷, 渚嬪['png', 'jpg', 'jpeg'] fileType: { type: Array, - default: () => ["doc", "xls", "ppt", "txt", "pdf"], + default: () => ["doc", "docx", "xls", "xlsx", "ppt", "pptx", "txt", "pdf"] }, // 鏄惁鏄剧ず鎻愮ず isShowTip: { type: Boolean, default: true + }, + // 绂佺敤缁勪欢锛堜粎鏌ョ湅鏂囦欢锛� + disabled: { + type: Boolean, + default: false } }); @@ -70,7 +86,7 @@ const number = ref(0); const uploadList = ref([]); const baseUrl = import.meta.env.VITE_APP_BASE_API; -const uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 涓婁紶鏂囦欢鏈嶅姟鍣ㄥ湴鍧� +const uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + props.action); // 涓婁紶鏂囦欢鏈嶅姟鍣ㄥ湴鍧� const headers = ref({ Authorization: "Bearer " + getToken() }); const fileList = ref([]); const showTip = computed( @@ -104,9 +120,14 @@ const fileExt = fileName[fileName.length - 1]; const isTypeOk = props.fileType.indexOf(fileExt) >= 0; if (!isTypeOk) { - proxy.$modal.msgError(`鏂囦欢鏍煎紡涓嶆纭�, 璇蜂笂浼�${props.fileType.join("/")}鏍煎紡鏂囦欢!`); + proxy.$modal.msgError(`鏂囦欢鏍煎紡涓嶆纭紝璇蜂笂浼�${props.fileType.join("/")}鏍煎紡鏂囦欢!`); return false; } + } + // 鏍℃鏂囦欢鍚嶆槸鍚﹀寘鍚壒娈婂瓧绗� + if (file.name.includes(',')) { + proxy.$modal.msgError('鏂囦欢鍚嶄笉姝g‘锛屼笉鑳藉寘鍚嫳鏂囬�楀彿!'); + return false; } // 鏍℃鏂囦欢澶у皬 if (props.fileSize) { @@ -129,6 +150,7 @@ // 涓婁紶澶辫触 function handleUploadError(err) { proxy.$modal.msgError("涓婁紶鏂囦欢澶辫触"); + proxy.$modal.closeLoading(); } // 涓婁紶鎴愬姛鍥炶皟 @@ -164,10 +186,11 @@ // 鑾峰彇鏂囦欢鍚嶇О function getFileName(name) { + // 濡傛灉鏄痷rl閭d箞鍙栨渶鍚庣殑鍚嶅瓧 濡傛灉涓嶆槸鐩存帴杩斿洖 if (name.lastIndexOf("/") > -1) { return name.slice(name.lastIndexOf("/") + 1); } else { - return ""; + return name; } } -- Gitblit v1.9.3