Przeglądaj źródła

fix: 素材管理新增编辑页面,回显上传的素材,并添加预览素材的功能

mnisting 2 miesięcy temu
rodzic
commit
b3960ccb39

+ 21 - 3
src/views/interactVideo/sourceMaterialManage/index.vue

@@ -135,7 +135,7 @@
             <el-option :value="1" label="图片" />
           </el-select>
         </el-form-item>
-        <el-form-item label="素材文件">
+        <el-form-item label="素材文件" prop="fileList">
           <el-upload
             ref="uploadRef"
             action=""
@@ -144,6 +144,8 @@
             :on-remove="uploadRemove"
             :auto-upload="false"
             :limit="1"
+            :on-exceed="handleExceed"
+            :on-preview="handlePreview"
           >
             <template #trigger>
               <el-button type="primary">选择文件</el-button>
@@ -240,6 +242,9 @@ const data = reactive({
     materialType: [
       { required: true, message: "素材类型不能为空", trigger: "change" },
     ],
+    fileList: [
+      { required: true, message: "素材文件不能为空", trigger: "change" },
+    ],
   },
   libraryType: {
     0: "视频",
@@ -324,7 +329,9 @@ function handleUpdate(row) {
         materialId: res.data.materialId,
         materialName: res.data.materialName,
         materialType: res.data.materialType,
-        fileList: [],
+        fileList: res.data.accessory
+          ? [{ ...res.data.accessory, name: res.data.accessory.originFileName }]
+          : [],
       };
     })
     .finally(() => {
@@ -342,7 +349,7 @@ function dialogSubmit() {
       formData.append("materialName", materialName);
       formData.append("materialType", materialType);
       fileList.forEach((file) => {
-        formData.append("file", file.raw);
+        file.raw && formData.append("file", file.raw || "");
       });
       if (form.value.materialId) {
         formData.append("materialId", form.value.materialId);
@@ -390,6 +397,17 @@ function uploadRemove() {
   form.value.fileList = [];
 }
 
+// 文件上传超出限制
+function handleExceed() {
+  proxy.$modal.msgError("最多上传一个素材文件");
+}
+
+// 下载文件
+function handlePreview(file) {
+  let url = import.meta.env.VITE_APP_BASE_API + file.filePath;
+  window.open(url);
+}
+
 function handlepreview(row) {
   if (!row.url) {
     proxy.$modal.msgError("视频文件错误,请重新上传视频");