fix(editor): 问题修复

app/web/page/editor/component/BasicPageFormModal/index.ts

@@ -28,7 +28,7 @@ export default class DynamicForm extends Vue {
   };
 
   get enableShare() {
-    return this.pageData.props?.btAttachVal.some(item => item.perset === '分享');
+    return this.pageData.props?.btAttachVal.some(item => item.persets === '分享');
   }
 
   @Watch('pageData', { immediate: true })

app/web/page/editor/component/DynamicForm/component/BackTopPicker/index.vue

@@ -53,6 +53,14 @@ const CONFIG_MAP = {
           object.name = '自定义-' + uuid().slice(19);
         }
         this.list.push(object);
+      },
+      del(index) {
+        const list = JSON.parse(JSON.stringify(this.list));
+        list.splice(index, 1);
+        this.list = [];
+        this.$nextTick(() => {
+          this.list = list;
+        });
       }
     }
   }
@@ -61,24 +69,27 @@ const CONFIG_MAP = {
   .form-list {
     /deep/ .ivu-card {
       margin-bottom: 16px;
+
       .ivu-form {
         .ivu-form-item {
           display: flex;
           margin-bottom: 12px;
         }
+
         .ivu-form-item-label {
           text-align: left;
           width: 60px !important;
           font-size: 12px;
         }
+
         .ivu-form-item-content {
           flex: 1 !important;
         }
       }
 
       &:hover {
-        box-shadow: 0 0 14px 0 rgba(46,140,240,0.20);
-        border: 1px solid #2E8CF0 !important;
+        box-shadow: 0 0 14px 0 rgba(46, 140, 240, 0.2);
+        border: 1px solid #2e8cf0 !important;
       }
     }
 
@@ -88,12 +99,14 @@ const CONFIG_MAP = {
     }
 
     &-card {
-      /deep/ .ivu-card-head{
+      /deep/ .ivu-card-head {
         background: #f0f2f5;
       }
+
       /deep/ .ivu-card-body {
         padding: 10px !important;
       }
+
       .Fl-card-title {
         display: flex;
         justify-content: space-between;

app/web/page/editor/component/DynamicForm/component/BaseSelect/index.vue

@@ -28,6 +28,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
+
     &-input {
       flex-basis: 150px;
     }

app/web/page/editor/component/DynamicForm/component/ComponentSelect/index.ts

@@ -39,7 +39,7 @@ export default class DynamicForm extends Vue {
         list = this.pageData?.elements?.filter(v => pointY < v?.point?.y);
       }
       this.list = list.map((element, index) => ({ id: element.id, label: element.title + '-' + element.id}));
-      console.log('curEleIndex', pointY, this.pageData?.elements?.filter(v => pointY < v?.point?.y), this.list);
+      // console.log('curEleIndex', pointY, this.pageData?.elements?.filter(v => pointY < v?.point?.y), this.list);
     }
   }
 

app/web/page/editor/mixins/autoSave.mixin.ts

@@ -13,9 +13,13 @@ export default class AutoSaveMixin extends Vue {
   hasCompared: boolean = false;
   timer: NodeJS.Timeout | null = null;
 
+  get pageId() {
+    return this.pageInfo.uuid || 'new';
+  }
+
   showRecord() {
     // console.log('showRecord');
-    const record = localStorage.get(`${this.account}-${this.pageInfo.id}`);
+    const record = localStorage.get(`${this.account}-${this.pageId}`);
     if (record && !isEqual(record, this.pageInfo)) {
       this.showRecordModal = true;
       // console.log('showRecord', record, this.pageInfo);
@@ -30,7 +34,7 @@ export default class AutoSaveMixin extends Vue {
       // console.log('autoSave');
       if (this.account && this.pageInfo && this.hasCompared) {
         // console.log('autoSave in', this.pageInfo);
-        localStorage.set(`${this.account}-${this.pageInfo.id}`, this.pageInfo);
+        localStorage.set(`${this.account}-${this.pageId}`, this.pageInfo);
       }
     }, interval);
     this.$once('hook:beforeDestroy', () => {
@@ -38,7 +42,7 @@ export default class AutoSaveMixin extends Vue {
     });
   }
 
-  removeDefaultCache(id = 0) {
+  removeDefaultCache(id = '') {
     this.clearTimer();
     localStorage.remove(`${this.account}-${id}`);
     this.autoSave();
@@ -51,7 +55,7 @@ export default class AutoSaveMixin extends Vue {
 
   recover() {
     // console.log('recover');
-    const record = localStorage.get(`${this.account}-${this.pageInfo.id}`);
+    const record = localStorage.get(`${this.account}-${this.pageId}`);
     this.setPageInfo(record);
     this.hasCompared = true;
   }
@@ -59,6 +63,6 @@ export default class AutoSaveMixin extends Vue {
   cancel() {
     // console.log('cancel');
     this.hasCompared = true;
-    localStorage.remove(`${this.account}-${this.pageInfo.id}`);
+    localStorage.remove(`${this.account}-${this.pageId}`);
   }
 }
\ No newline at end of file

app/web/page/editor/mixins/contextMenu.mixin.ts

 import {Component, Vue } from 'vue-property-decorator';
-import { Mutation } from 'vuex-class';
+import { Mutation, Getter } from 'vuex-class';
 import { getStyle } from '@/service/utils.service';
 
 @Component({ name: 'ContextMenuMixin' })
 export default class ContextMenuMixin extends Vue {
+  @Getter('pageData') pageData;
   @Mutation('COPY_OR_DELETE_PAGE_INFO') updatePageData;
   @Mutation('UPDATE_PAGE_INFO') updatePageInfo;
   @Mutation('UPDATE_COMMON_STYLE') updateCommonStyle;
 
   show(event, containerIndex, childIndex) {
-    console.log('删除', event, containerIndex, childIndex);
+    // console.log('删除', event, containerIndex, childIndex);
     this.$contextmenu({
       items: [
         {
           label: '复制',
           onClick: () => {
+            // PERF 可以抽象
+            const searchBarCom = this.pageData.elements[containerIndex];
+            if (searchBarCom.name === 'cs-search-bar') {
+              this.$Notice.warning({
+                title: '搜索框只能添加一个'
+              });
+              return;
+            }
             this.updatePageData({type: 'copy', containerIndex, childIndex});
-            console.log('复制');
+            // console.log('复制');
           }
         },
         {
           label: '删除',
           onClick: () => {
-            console.log('删除', event, containerIndex, childIndex);
+            // console.log('删除', event, containerIndex, childIndex);
             this.updatePageData({type: 'delete', containerIndex, childIndex});
           }
         },

app/web/page/editor/view/dashboard/index.ts

@@ -53,6 +53,10 @@ export default class DashBoard extends Mixins(ContextMenuMixin, GoodsTabsMixin,
   inTheSave: boolean = false;
   searchBarComNum: number = 0;
 
+  get HasSearchBarCom() {
+    return this.pageData.elements.some(item => item.name === 'cs-search-bar');
+  }
+
   get pageDataInject() {
     return this.pageData;
   }
@@ -223,13 +227,11 @@ export default class DashBoard extends Mixins(ContextMenuMixin, GoodsTabsMixin,
   // 过滤搜索框
   addEleFilter(el) {
     if (el.data.name === 'cs-search-bar') {
-      if (this.searchBarComNum === 1) {
+      if (this.HasSearchBarCom) {
         this.$Notice.warning({
           title: '搜索框只能添加一个'
         });
         return;
-      } else {
-        this.searchBarComNum = 1;
       }
     }
     this.addElements(el);

app/web/page/store/modules/editor/index.ts

@@ -18,7 +18,7 @@ import {
   UPDATE_PAGE_PROPS,
   SET_CUR_RIGHT_TAB_NAME
 } from './type';
-
+import { v4 as uuid } from 'uuid';
 import RootState from '../../state';
 import EditorState, { PageInfo, defaultState, Page, PageElement } from './state';
 
@@ -140,11 +140,13 @@ export default class EditorModule implements Module<EditorState, RootState> {
       } else if (type === 'copy') {
         let eleCopyed = {} as PageElement;
         if (childIndex || childIndex === 0) {
-          eleCopyed = page[containerIndex].child[childIndex];
+          eleCopyed = JSON.parse(JSON.stringify(page[containerIndex].child[childIndex] || {}));
+          eleCopyed.id = uuid().slice(19);
           const { left, top } = eleCopyed.commonStyle;
           page[containerIndex].child.push({ ...eleCopyed, commonStyle: { ...eleCopyed.commonStyle, left: left + 10, top: top + 10 } });
         } else {
-          eleCopyed = page[containerIndex];
+          eleCopyed = JSON.parse(JSON.stringify(page[containerIndex] || {}));
+          eleCopyed.id = uuid().slice(19);
           page.push({ ...eleCopyed, point: { ...eleCopyed.point, i: page.length }});
         }
       }

app/web/page/store/modules/editor/state.ts

@@ -29,6 +29,7 @@ export interface GridLayout {
 export interface PageElement {
   name: string;
   title: string;
+  id: string;
   schame: Schame[];
   props: object;
   point: Point;

package-lock.json

@@ -1501,9 +1501,9 @@
       }
     },
     "@qg/citrus-ui": {
-      "version": "0.3.5",
-      "resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.3.5.tgz",
-      "integrity": "sha512-gdJ0T3TGeUQU50oyb76J47/xIqJzbBZWSe7KNIo4aMZHKTzAqJhEfNfoberT8oJcVXnfAtcHJazfgi9uENUKHw==",
+      "version": "0.3.5-bata1",
+      "resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.3.5-bata1.tgz",
+      "integrity": "sha512-4l8sFBS9UIcEc4WMOJGyH88dxrO3pVJyvcyk8OLjsfdcEM915rmNeXC//wZL7ZGcJyT0MI13A217EEwpiMCFjg==",
       "requires": {
         "@better-scroll/core": "^2.1.1",
         "@qg/cherry-ui": "^2.23.8",

package.json

@@ -27,7 +27,7 @@
     "@hubcarl/json-typescript-mapper": "^2.0.0",
     "@qg/apollo-nodejs": "^2.1.2",
     "@qg/cherry-ui": "2.23.8",
-    "@qg/citrus-ui": "0.3.5",
+    "@qg/citrus-ui": "0.3.5-bata1",
     "@riophae/vue-treeselect": "^0.4.0",
     "@types/lodash": "^4.14.117",
     "@types/node": "^10.12.0",