chore: 更新vue editor 添加推荐商品模块

Author: lljj-x

packages/demo/src/vue-editor/views/editor/Editor.vue

@@ -305,9 +305,11 @@
                         return arrayMethods.moveDown(target, arrayItem);
                     },
                     copy(target, arrayItem) {
-                        // 特殊处理
-                        const newItem = generateEditorItem(arrayItem);
-                        return target.splice(target.indexOf(arrayItem) + 1, 0, newItem);
+                        // 不copy数据
+                        // eslint-disable-next-line no-unused-vars
+                        const { componentValue, ...emptyPack } = arrayItem;
+
+                        return target.splice(target.indexOf(arrayItem) + 1, 0, generateEditorItem(emptyPack));
                     },
                     remove(target, arrayItem) {
                         return arrayMethods.remove(target, arrayItem);

packages/demo/src/vue-editor/views/editor/components/ViewComponentWrap.vue

@@ -18,24 +18,28 @@
                     :disabled="editorItem.toolBar.moveUpDisabled"
                     :class="$style.toolBarBtn"
                     class="el-icon-caret-top"
+                    title="上移"
                     @click="$emit('onOperate', { item: editorItem, command: 'moveUp'})"
                 ></button>
                 <button
                     :disabled="editorItem.toolBar.moveDownDisabled"
                     :class="$style.toolBarBtn"
                     class="el-icon-caret-bottom"
+                    title="下移"
                     @click="$emit('onOperate', { item: editorItem, command: 'moveDown'})"
                 ></button>
                 <button
                     :disabled="editorItem.toolBar.copyDisabled"
                     :class="[$style.topLine, $style.toolBarBtn]"
                     class="el-icon-copy-document"
+                    title="复制"
                     @click="$emit('onOperate', { item: editorItem, command: 'copy' })"
                 ></button>
                 <button
                     :disabled="editorItem.toolBar.removeDisabled"
                     :class="$style.toolBarBtn"
                     class="el-icon-delete"
+                    title="移除"
                     @click="$emit('onOperate', { item: editorItem, command: 'remove' })"
                 ></button>
             </div>

packages/demo/src/vue-editor/views/editor/config/defaultItems.js

@@ -116,10 +116,37 @@ export default [
         }
     },
     {
-        // 默认显示所有商品
-        name: 'AllGoodsList',
+        name: 'Text',
         value: {
-            show: true
+            txt: '超值进口新发现',
+            txtColor: '#000'
         }
+    },
+    {
+        name: 'MultipleImg1_3',
+        value: {
+            imgItem1_1: {
+                imgUrl: 'https://aecpm.alicdn.com/simba/img/TB1W4nPJFXXXXbSXpXXSutbFXXX.jpg',
+                imgLink: 'http://127.0.0.1:8800/vue-editor.html#/editor'
+            },
+            imgItem2_1: {
+                imgUrl: 'https://img.alicdn.com/tps/i4/TB1KhvGOAY2gK0jSZFgSuw5OFXa.jpg',
+                imgLink: 'http://127.0.0.1:8800/vue-editor.html#/editor'
+            },
+            imgItem2_2: {
+                imgUrl: 'https://img.alicdn.com/tps/i4/TB17qddaOERMeJjSspiSuvZLFXa.jpg_320x5000q100.jpg_.webp',
+                imgLink: 'http://127.0.0.1:8800/vue-editor.html#/editor'
+            },
+            imgItem2_3: {
+                imgUrl: 'https://img.alicdn.com/tfs/TB1XjMYnfb2gK0jSZK9XXaEgFXa-468-1236.jpg',
+                imgLink: 'http://127.0.0.1:8800/vue-editor.html#/editor'
+            }
+        }
+    },
+    {
+        name: 'RecommendedGoodsList'
+    },
+    {
+        name: 'AllGoodsList'
     }
 ];

packages/demo/src/vue-editor/views/editor/config/tools.js

@@ -17,6 +17,9 @@ import * as componentPackMultipleImg5 from '../viewComponents/MultipleImg5';
 // 多图模块 2-3
 import * as componentPackMultipleImg23 from '../viewComponents/MultipleImg2_3';
 
+// 多图模块 1-2
+import * as componentPackMultipleImg13 from '../viewComponents/MultipleImg1_3';
+
 // 推荐
 import * as componentPackRecommendedGoodsList from '../viewComponents/RecommendedGoodsList';
 
@@ -59,6 +62,11 @@ const tools = [
             maxNum: 10,
             icon: 'el-icon-s-grid',
             componentPack: componentPackMultipleImg23
+        }, {
+            title: '多图(1-3)',
+            maxNum: 10,
+            icon: 'el-icon-s-grid',
+            componentPack: componentPackMultipleImg13
         }, {
             title: '纯文本',
             maxNum: 20,

packages/demo/src/vue-editor/views/editor/fieldComponents/linkImgField/LinkImgField.vue

@@ -138,9 +138,10 @@
                     'https://gw.alicdn.com/tfs/TB1UzOqoWL7gK0jSZFBXXXZZpXa-468-602.jpg',
                     'https://img.alicdn.com/tfs/TB1XjMYnfb2gK0jSZK9XXaEgFXa-468-1236.jpg',
                     'https://img.alicdn.com/tps/i4/TB1MesKcWmWQ1JjSZPhwu0CJFXa.png',
-                    'https://gw.alicdn.com/tfs/TB1xVR9oFP7gK0jSZFjXXc5aXXa-468-602.jpg'
+                    'https://gw.alicdn.com/tfs/TB1xVR9oFP7gK0jSZFjXXc5aXXa-468-602.jpg',
+                    'https://img.alicdn.com/tps/i4/TB1R8tlXxvbeK8jSZPfSuuriXXa.jpg_490x490q100.jpg_.webp'
                 ];
-                this.$message.success('选择图片成功，这里随机一个图片');
+                this.$message.success('选择图片成功，随机一个图片');
                 this.imgUrl = imgs[Math.floor(Math.random() * imgs.length)];
             }
         }

packages/demo/src/vue-editor/views/editor/viewComponents/AllGoodsList/uiSchema.json

@@ -2,7 +2,7 @@
   "show": {
     "ui:options": {
       "title": "添加全部商品",
-      "description": "全部商品模块不可编辑，不可移除，自动置底；系统会获取店铺全部商品做展示。",
+      "description": "全部商品模块不可编辑，不可移除，自动置底；系统会获取全部商品。",
       "label": true,
       "disabled": true
     }