diff --git a/frontend/src/components/canvas/components/Editor/EditBar.vue b/frontend/src/components/canvas/components/Editor/EditBar.vue index 7241c5b53c..7194ec93af 100644 --- a/frontend/src/components/canvas/components/Editor/EditBar.vue +++ b/frontend/src/components/canvas/components/Editor/EditBar.vue @@ -24,7 +24,7 @@ - + diff --git a/frontend/src/components/canvas/components/Editor/EditBarView.vue b/frontend/src/components/canvas/components/Editor/EditBarView.vue index db57a2f0ba..4131ff84cd 100644 --- a/frontend/src/components/canvas/components/Editor/EditBarView.vue +++ b/frontend/src/components/canvas/components/Editor/EditBarView.vue @@ -5,7 +5,7 @@ - +
diff --git a/frontend/src/components/canvas/components/Toolbar.vue b/frontend/src/components/canvas/components/Toolbar.vue index c748496fa3..e09281d739 100644 --- a/frontend/src/components/canvas/components/Toolbar.vue +++ b/frontend/src/components/canvas/components/Toolbar.vue @@ -36,10 +36,10 @@
- + - + @@ -49,19 +49,24 @@ - + - + {{ $t('panel.new_element_distribution') }} - {{ $t('panel.suspension') }} + {{ $t('panel.suspension') }} @@ -72,20 +77,27 @@ - + {{ $t('panel.aided_grid') }}:{{ canvasStyleData.aidedDesign.showGrid?$t('panel.aided_grid_open'):$t('panel.aided_grid_close') }} {{ $t('panel.params_setting') }} - {{ $t('panel.clean_canvas') }} + {{ $t('panel.clean_canvas') }} - {{ $t('panel.panel_style') }} - {{ $t('panel.batch_opt') }} + {{ $t('panel.panel_style') + }} + + {{ + $t('panel.batch_opt') }} + {{ $t('commons.save') }} @@ -94,7 +106,13 @@ - + @@ -321,8 +339,12 @@ export default { } const components = deepCopy(this.componentData) components.forEach(view => { - if (view.DetailAreaCode) { view.DetailAreaCode = null } - if (view.filters && view.filters.length > 0) { view.filters = [] } + if (view.DetailAreaCode) { + view.DetailAreaCode = null + } + if (view.filters && view.filters.length > 0) { + view.filters = [] + } if (view.type === 'de-tabs') { view.options.tabList && view.options.tabList.length > 0 && view.options.tabList.forEach(tab => { if (tab.content && tab.content.filters && tab.content.filters.length > 0) { @@ -485,6 +507,7 @@ export default { height: 35px; line-height: 32px; min-width: 400px; + .canvas-config { display: inline-block; margin-left: 10px; @@ -519,7 +542,7 @@ export default { transition: .1s; font-weight: 500; padding: 5px 5px; - font-size: 16px!important; + font-size: 16px !important; border-radius: 3px; margin-left: 10px; @@ -537,23 +560,24 @@ export default { } } - .button-show{ - background-color: #ebf2fe!important; + .button-show { + background-color: #ebf2fe !important; } - .button-closed{ - background-color: #ffffff!important; + .button-closed { + background-color: #ffffff !important; + } + + > > > .el-switch__core { + width: 30px !important; + height: 15px; } - >>>.el-switch__core{ - width:30px!important; - height:15px; - } /*设置圆*/ - >>>.el-switch__core::after{ - width:14px; - height:14px; - margin-top:-1px; + > > > .el-switch__core::after { + width: 14px; + height: 14px; + margin-top: -1px; margin-bottom: 2px; } @@ -565,36 +589,44 @@ export default { -moz-osx-font-smoothing: grayscale; } - .switch-position{ + .switch-position { position: absolute; top: 3px; right: 50%; width: 100px; } - .button_self{ + + .button_self { margin-right: 5px; } - .button_self ::v-deep .el-button--mini{ + .button_self ::v-deep .el-button--mini { padding: 7px 7px !important; } - .font-active{ - font-color: #3a8ee6!important; + + .font-active { + font-color: #3a8ee6 !important; } - .icon-active{ + + .icon-active { color: #3a8ee6; } - .icon-unactivated{ + + .icon-unactivated { display: none; } - .panel-info-area{ + + .panel-info-area { position: absolute; left: 10px; - .text{ + + .text { font-size: 16px; color: var(--TextPrimary, #606266); - }; - .icon-back{ + } + ; + + .icon-back { font-size: 18px; font-weight: bold; color: var(--TextPrimary, #606266); diff --git a/frontend/src/components/canvas/store/snapshot.js b/frontend/src/components/canvas/store/snapshot.js index 4dcb1a7f8b..3c5937278e 100644 --- a/frontend/src/components/canvas/store/snapshot.js +++ b/frontend/src/components/canvas/store/snapshot.js @@ -3,8 +3,8 @@ import { deepCopy } from '@/components/canvas/utils/utils' export default { state: { - snapshotData: [], // 编辑器快照数据 - snapshotStyleData: [], // 样式改变也记录快照 + snapshotData: [{}], // 编辑器快照数据 + snapshotStyleData: [{}], // 样式改变也记录快照 snapshotIndex: -1, // 快照索引 changeTimes: -1, // 修改次数 lastSaveSnapshotIndex: 0, // 最后保存是snapshotIndex的索引 @@ -47,9 +47,9 @@ export default { refreshSnapshot(state) { // console.log('refreshSnapshot') // 刷新快照 - state.snapshotData = [] - state.snapshotStyleData = [] - state.snapshotIndex = -1 + state.snapshotData = [deepCopy(state.componentData)] + state.snapshotStyleData = [deepCopy(state.canvasStyleData)] + state.snapshotIndex = 0 state.changeTimes = -1 state.lastSaveSnapshotIndex = 0 }, diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js index c6402644d5..29f0ac10fb 100644 --- a/frontend/src/store/index.js +++ b/frontend/src/store/index.js @@ -659,8 +659,6 @@ const data = { this.commit('clearLinkageSettingInfo', false) this.commit('resetViewEditInfo') this.commit('initCurMultiplexingComponents') - // 清空当前缓存,快照 - this.commit('refreshSnapshot') state.batchOptStatus = false // Currently selected components state.curBatchOptComponents = [] diff --git a/frontend/src/styles/deicon/demo_index.html b/frontend/src/styles/deicon/demo_index.html index 6c8ed8f898..5766d02025 100644 --- a/frontend/src/styles/deicon/demo_index.html +++ b/frontend/src/styles/deicon/demo_index.html @@ -54,6 +54,42 @@
    +
  • + +
    更多
    +
    
    +
    • + +
  • + +
    清空
    +
    
    +
    • + +
  • + +
    查看
    +
    
    +
    • + +
  • + +
    outline-redo
    +
    
    +
    • + +
  • + +
    outline-undo
    +
    
    +
    • + +
  • + +
    定位
    +
    
    +
    • +
  • 富文本框
    @@ -594,9 +630,9 @@ 
    @font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1652937715816') format('woff2'),
-       url('iconfont.woff?t=1652937715816') format('woff'),
-       url('iconfont.ttf?t=1652937715816') format('truetype');
+  src: url('iconfont.woff2?t=1655095335340') format('woff2'),
+       url('iconfont.woff?t=1655095335340') format('woff'),
+       url('iconfont.ttf?t=1655095335340') format('truetype');
 }

    第二步：定义使用 iconfont 的样式

    @@ -622,6 +658,60 @@
      +
    • + +
      + 更多 +
      +
      .icon-gengduo +
      +
      • + +
    • + +
      + 清空 +
      +
      .icon-qingkong +
      +
      • + +
    • + +
      + 查看 +
      +
      .icon-chakan +
      +
      • + +
    • + +
      + outline-redo +
      +
      .icon-outline-redo +
      +
      • + +
    • + +
      + outline-undo +
      +
      .icon-outline-undo +
      +
      • + +
    • + +
      + 定位 +
      +
      .icon-dingwei +
      +
      • +
    • @@ -1432,6 +1522,54 @@
        +
      • + +
        更多
        +
        #icon-gengduo
        +
        • + +
      • + +
        清空
        +
        #icon-qingkong
        +
        • + +
      • + +
        查看
        +
        #icon-chakan
        +
        • + +
      • + +
        outline-redo
        +
        #icon-outline-redo
        +
        • + +
      • + +
        outline-undo
        +
        #icon-outline-undo
        +
        • + +
      • + +
        定位
        +
        #icon-dingwei
        +
        • +