refactor(components): 优化内容可编辑组件中的图片处理逻辑

- 修改了图片宽度和高度的计算方式，使用原始尺寸和宽高比
- 更新了矩阵问题的默认选项文本
- 调整了部分组件的样式和布局

src/components/contenteditable.vue

@@ -75,7 +75,7 @@ const functions = {
     document.execCommand('italic', false, null);
   },
 
-  uploadImage: async() => {
+  uploadImage: async () => {
     // 保存当前光标位置
     savedRange.value = saveSelection();
 
@@ -84,7 +84,7 @@ const functions = {
 
     fileInput.click();
 
-    fileInput.onchange = async(e) => {
+    fileInput.onchange = async (e) => {
       const [file] = e.target.files;
       if (!file) return;
       if (file.size > 2 * 1024 * 1024) {
@@ -96,12 +96,28 @@ const functions = {
       const img = document.createElement('img');
       img.src = data.url;
       img.onload = () => {
-        const scale = img.naturalHeight / 50;
+        // const scale = img.naturalHeight / 50;
-        const width = (img.naturalWidth / scale).toFixed(0);
+        // const width = (img.naturalWidth / scale).toFixed(0);
-        const height = 50;
+        // const height = 50;
+        // const maxWidth = img.naturalWidth;
+        // const maxHeight = img.naturalHeight;
+        // eslint-disable-next-line standard/no-callback-literal
+        // const style = `style="width:${width}px;
+        // height:${height}px;
+        // max-width:${maxWidth}px;
+        // max-height:${maxHeight}px"`;
+        // 使用原始高度
+        const height = img.naturalHeight;
+        // 根据宽高比计算宽度
+        const width = (height * 3) / 4;
         const maxWidth = img.naturalWidth;
         const maxHeight = img.naturalHeight;
-        const style = `style="width:${width}px;height:${height}px;max-width:${maxWidth}px;max-height:${maxHeight}px"`;
+        // eslint-disable-next-line standard/no-callback-literal
+        const style = `style="width:${width}px;
+        height:${height}px;
+        max-width:${maxWidth}px;
+        max-height:${maxHeight}px"`;
+        // eslint-disable-next-line standard/no-callback-literal
         insertImageAtCaret(`<img src=${data.url} ${style}/>`);
 
         // 恢复光标位置
@@ -146,10 +162,10 @@ const isEmptyContent = (html) => {
   const trimmedHtml = html.trim();
   // 检查是否为空字符串、仅包含 <br> 或仅包含 <p><br></p>
   return (
-    trimmedHtml === ''
+    trimmedHtml === '' ||
-    || trimmedHtml === '<br>'
+    trimmedHtml === '<br>' ||
-    || trimmedHtml === '<p><br></p>'
+    trimmedHtml === '<p><br></p>' ||
-    || trimmedHtml === '<p></p>'
+    trimmedHtml === '<p></p>'
   );
 };
 

src/utils/QuestionJsons/MartrixQuestion.js

@@ -12,7 +12,7 @@ export default {
         is_fixed: 0,
         is_other: 0,
         is_remove_other: 0,
-        option: '<p>选项1</p>',
+        option: '<p>行标签1</p>',
         option_config: {
           image_url: [],
           title: '',
@@ -22,26 +22,7 @@ export default {
         },
         option_index: 1,
         parent_id: 0,
-        type: 0,
+        type: 1,
-        cascade: [],
-        config: []
-      },
-      {
-        id: '',
-        is_fixed: 0,
-        is_other: 0,
-        is_remove_other: 0,
-        option: '<p>选项2</p>',
-        option_config: {
-          image_url: [],
-          title: '',
-          instructions: [],
-          option_type: 0,
-          limit_right_content: ''
-        },
-        option_index: 1,
-        parent_id: 0,
-        type: 0,
         cascade: [],
         config: []
       }
@@ -67,35 +48,7 @@ export default {
           gradient: '',
           image_url: [],
           option_type: 0,
-          type: 0,
+          type: 2,
-          limit_right_content: '',
-          child_area: null,
-          binding_goods_id: ''
-        },
-        disable_option_update: null,
-        cascade: []
-      },
-      {
-        option: '<p style="text-align:center">列标签2</p>',
-        id: '1049202',
-        type: 2,
-        is_other: 0,
-        is_fixed: 0,
-        is_remove_other: 0,
-        created_at: null,
-        created_user_id: null,
-        parent_id: null,
-        option_index: 4,
-        list_id: 74491,
-        option_code: '',
-        option_config: {
-          title: '',
-          instructions: [],
-          price: 0,
-          gradient: '',
-          image_url: [],
-          option_type: 0,
-          type: 0,
           limit_right_content: '',
           child_area: null,
           binding_goods_id: ''
@@ -103,6 +56,34 @@ export default {
         disable_option_update: null,
         cascade: []
       }
+      // {
+      //   option: '<p style="text-align:center">列标签2</p>',
+      //   id: '1049202',
+      //   type: 2,
+      //   is_other: 0,
+      //   is_fixed: 0,
+      //   is_remove_other: 0,
+      //   created_at: null,
+      //   created_user_id: null,
+      //   parent_id: null,
+      //   option_index: 4,
+      //   list_id: 74491,
+      //   option_code: '',
+      //   option_config: {
+      //     title: '',
+      //     instructions: [],
+      //     price: 0,
+      //     gradient: '',
+      //     image_url: [],
+      //     option_type: 0,
+      //     type: 0,
+      //     limit_right_content: '',
+      //     child_area: null,
+      //     binding_goods_id: ''
+      //   },
+      //   disable_option_update: null,
+      //   cascade: []
+      // }
     ]
   ],
   last_option_index: 1,

src/views/Design/Index.vue

@@ -52,8 +52,8 @@
           <martrix-question
             v-if="
               element.question_type === 8 ||
-              element.question_type === 9 ||
+                element.question_type === 9 ||
-              element.question_type === 10
+                element.question_type === 10
             "
             :element="computedElement(element)"
             :index="index"

src/views/Design/components/ActionCompoents/components/QuestionItemAction/QuestionBefore.vue

@@ -144,8 +144,8 @@
               <BeforeRate
                 v-if="
                   log.logic !== 'always' &&
-                  log.is_answer !== 0 &&
+                    log.is_answer !== 0 &&
-                  [5, 106].includes(log.question_type)
+                    [5, 106].includes(log.question_type)
                 "
                 :activeQuestion="activeQuestion"
                 :logic="log"

src/views/Home/Index.vue

@@ -10,7 +10,7 @@ import { showFailToast } from 'vant';
 import appBridge from '@/assets/js/appBridge';
 const contentShow = ref(false);
 
-onMounted(async () => {
+onMounted(async() => {
   if (appBridge.isInReactNative()) {
     const appToken = utils.getSessionStorage('xToken');
     getUserInfo(appToken)

src/views/Home/components/Market/components/MarketItem.vue

@@ -101,7 +101,7 @@ const deleteItem = (item) => {
     showCancelButton: true,
     confirmButtonColor: '#03B03C'
   })
-    .then(async () => {
+    .then(async() => {
       const res = await deleteTemplate(item.sn);
       if (res.data.code === 0) {
         showSuccessToast('删除成功');

src/views/Survey/Index.vue

@@ -141,7 +141,7 @@ const onLoad = () => {
     fetchSurveys();
   }, 500);
 };
-const fetchSurveys = async () => {
+const fetchSurveys = async() => {
   const params = {
     page: form.value.page,
     per_page: form.value.pageSize,
@@ -179,7 +179,7 @@ const deleteItem = (item) => {
     showCancelButton: true,
     confirmButtonColor: '#03B03C'
   })
-    .then(async () => {
+    .then(async() => {
       const res = await deleteSurveys(item.sn);
       if (res.data.message) {
         showToast(res.data.message);
@@ -203,7 +203,7 @@ const copyItem = (item) => {
     showCancelButton: true,
     confirmButtonColor: '#03B03C'
   })
-    .then(async () => {
+    .then(async() => {
       const res = await copySurveys(item.sn);
       if (res.data.code === 200 || res.data.code === 201) {
         showSuccessToast('复制成功');
@@ -252,7 +252,7 @@ const editItem = (item) => {
   });
 };
 // 保存为模板
-const saveTemplate = async (item) => {
+const saveTemplate = async(item) => {
   const data = JSON.parse(JSON.stringify(item));
   const res = await saveTemplates(item.sn, data);
   if (res.data.code === 200 || res.data.code === 201) {

src/views/Survey/views/Create/Index.vue

@@ -60,7 +60,7 @@
           </div>
         </template>
       </Design>
-      <div class="design-button" v-if="!activeId && questionInfo.questions.length > 0">
+      <div v-if="!activeId && questionInfo.questions.length > 0" class="design-button">
         <van-button size="small" class="theme-background" @click="show = true">
           + 添加题目
         </van-button>
@@ -431,14 +431,14 @@ const questionEvent = (item) => {
       options:
         item.json.options.length > 0
           ? item.json.options.map((item) => {
-              return item.map((it) => {
+            return item.map((it) => {
-                return {
+              return {
-                  ...it,
+                ...it,
-                  // 主键生成
+                // 主键生成
-                  id: uuidv4()
+                id: uuidv4()
-                };
+              };
-              });
+            });
-            })
+          })
           : []
     })
   );
@@ -577,7 +577,7 @@ const previewQuestion = () => {
   router.push({ name: 'preview', query: { ...route.query } });
 };
 
-onMounted(async () => {
+onMounted(async() => {
   await getQuestionDetail();
 });
 </script>
@@ -750,6 +750,7 @@ onMounted(async () => {
     font-weight: bold;
     font-size: 16px;
   }
+
   .ques_list {
     margin-bottom: 10px;
   }