urbanu il y a 1 mois
Parent
commit
33e5bd611f
2 fichiers modifiés avec 23 ajouts et 19 suppressions
  1. 20 17
      src/components/WangEditor/index.vue
  2. 3 2
      src/views/daytask/task/taskList.vue

+ 20 - 17
src/components/WangEditor/index.vue

@@ -17,7 +17,7 @@
 import {nextTick, computed, inject, shallowRef, onBeforeUnmount, ref} from "vue";
 import {IToolbarConfig, IEditorConfig} from "@wangeditor/editor";
 import {Editor, Toolbar} from "@wangeditor/editor-for-vue";
-import {UploadFiles} from "../../api/uploadFile.js";
+import {uploadImg} from "../../api/modules/upload.js";
 
 import "@wangeditor/editor/dist/css/style.css";
 import {ElNotification, formContextKey, formItemContextKey} from "element-plus";
@@ -28,6 +28,10 @@ const editorRef = shallowRef();
 // 实列化编辑器
 const handleCreated = (editor: any) => {
   editorRef.value = editor;
+  // 如果需要禁用,在编辑器创建后执行
+  if (self_disabled.value) {
+    editor.disable();
+  }
 };
 
 // 接收父组件参数,并设置默认值
@@ -68,8 +72,7 @@ const self_disabled = computed(() => {
   return props.disabled || formContext?.disabled;
 });
 
-// 判断当前富文本编辑器是否禁用
-if (self_disabled.value) nextTick(() => editorRef.value.disable());
+// 注意:禁用逻辑已移至 handleCreated 中处理
 
 // 富文本的内容监听,触发父组件改变,实现双向数据绑定
 const emit = defineEmits<{
@@ -97,15 +100,17 @@ props.editorConfig.MENU_CONF!["uploadImage"] = {
   async customUpload(file: File, insertFn: InsertFnTypeImg) {
     if (!uploadImgValidate(file)) return;
     try {
-      const res = await UploadFiles(file);
-      if (res?.res?.requestUrls?.length) {
-        insertFn(res.res.requestUrls[0]);
+      const formData = new FormData();
+      formData.append("file", file);
+      const res = await uploadImg(formData);
+      if (res?.code === 200 && res?.data?.path) {
+        insertFn(res.data.path);
       } else {
-
+        ElNotification.error(res?.msg || "上传失败");
       }
-      
     } catch (error) {
       console.log(error);
+      ElNotification.error("上传失败");
     }
   }
 };
@@ -152,20 +157,18 @@ type InsertFnTypeVideo = (url: string, poster?: string) => void;
 props.editorConfig.MENU_CONF!["uploadVideo"] = {
   async customUpload(file: File, insertFn: InsertFnTypeVideo) {
     if (!uploadVideoValidate(file)) return;
-    let formData = new FormData();
-    formData.append("file", file);
     try {
-      //const {data} = await UploadFiles(file);
-      //insertFn(data.fileUrl);
-      const res = await UploadFiles(file);
-      console.log(res, 333)
-      if (res?.res?.requestUrls?.length) {
-        insertFn(res.res.requestUrls[0]);
+      const formData = new FormData();
+      formData.append("file", file);
+      const res = await uploadImg(formData);
+      if (res?.code === 200 && res?.data?.path) {
+        insertFn(res.data.path);
       } else {
-
+        ElNotification.error(res?.msg || "上传失败");
       }
     } catch (error) {
       console.log(error);
+      ElNotification.error("上传失败");
     }
   }
 };

+ 3 - 2
src/views/daytask/task/taskList.vue

@@ -93,7 +93,7 @@
   </div>
 
   <!-- 编辑任务弹窗 -->
-  <el-dialog v-model="dialogVisible" :title="isEdit ? '编辑任务' : '新增任务'" width="600px" center destroy-on-close>
+  <el-dialog v-model="dialogVisible" :title="isEdit ? '编辑任务' : '新增任务'" width="900px" center destroy-on-close>
     <el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px">
       <el-form-item label="任务名称" prop="title">
         <el-input v-model="formData.title" placeholder="请输入任务名称" />
@@ -127,7 +127,7 @@
         <div class="upload-tip">建议尺寸: 100 x 100 px,支持 jpg/png/gif 格式</div>
       </el-form-item>
       <el-form-item label="描述" prop="description">
-        <el-input v-model="formData.description" type="textarea" :rows="3" placeholder="请输入描述" />
+        <WangEditor v-model:value="formData.description" height="300px" />
       </el-form-item>
       <el-form-item label="任务链接" prop="url">
         <el-input v-model="formData.url" placeholder="请输入任务链接" />
@@ -337,6 +337,7 @@ import {
   createMaterial, getMaterialGroupList
 } from "@/api/modules/daytask.js";
 import { uploadImg } from "@/api/modules/upload.js";
+import WangEditor from "@/components/WangEditor/index.vue";
 
 const searchForm = ref({ title: null, category_id: null, status: null });
 const tableData = ref([]);