feat: 1.仪表盘页面动态添加目录，新建仪表盘无需刷新直接展开，2.新建仪表盘直接进入编辑界面，3.【【仪表盘】右键点开的功能顺序调整】4.【【仪表盘】仪表盘画板中，视图层级操作的文案调整】

2021-05-25 12:36:35 +08:00 · 2021-05-25 12:36:35 +08:00 · 133f5dcae9
commit 133f5dcae9
parent bb30f4b068
10 changed files with 120 additions and 56 deletions
--- a/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java
+++ b/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java
@ -104,7 +104,14 @@ public class PanelGroupService {
            }
            panelGroupMapper.updateByPrimaryKeySelective(request);
        }
-        return panelGroupMapper.selectByPrimaryKey(panelId);
+
+        //带有权限的返回
+        PanelGroupRequest authRequest = new PanelGroupRequest();
+        authRequest.setId(panelId);
+        authRequest.setUserId(String.valueOf(AuthUtils.getUser().getUserId()));
+        List<PanelGroupDTO> panelGroupDTOList = extPanelGroupMapper.panelGroupList(authRequest);
+
+        return panelGroupDTOList.get(0);
    }


--- a/backend/src/main/resources/db/migration/V5__auth.sql
+++ b/backend/src/main/resources/db/migration/V5__auth.sql
@ -1,18 +1,3 @@
-/*
- Navicat Premium Data Transfer
-
- Source Server         : A-LOCAL-本机数据库
- Source Server Type    : MySQL
- Source Server Version : 50726
- Source Host           : localhost:3306
- Source Schema         : data_ease
-
- Target Server Type    : MySQL
- Target Server Version : 50726
- File Encoding         : 65001
-
- Date: 18/05/2021 18:37:45
-*/

 SET NAMES utf8mb4;
 SET FOREIGN_KEY_CHECKS = 0;
@ -191,7 +176,7 @@ delimiter ;
 -- ----------------------------
 DROP FUNCTION IF EXISTS `get_auths`;
 delimiter ;;
-CREATE DEFINER=`root`@`%` FUNCTION `get_auths`(authSource varchar(255),modelType varchar(255),userId varchar(255)) RETURNS longtext CHARSET utf8
+CREATE  FUNCTION `get_auths`(authSource varchar(255),modelType varchar(255),userId varchar(255)) RETURNS longtext CHARSET utf8
    READS SQL DATA
 BEGIN

@ -302,7 +287,9 @@ delimiter ;
 -- ----------------------------
 -- Function structure for GET_V_AUTH_MODEL_ID_P_USE
 -- ----------------------------
-CREATE DEFINER=`root`@`%` FUNCTION `GET_V_AUTH_MODEL_ID_P_USE`(userId longtext,modelType varchar(255)) RETURNS longtext CHARSET utf8
+DROP FUNCTION IF EXISTS `GET_V_AUTH_MODEL_ID_P_USE`;
+delimiter ;;
+CREATE  FUNCTION `GET_V_AUTH_MODEL_ID_P_USE`(userId longtext,modelType varchar(255)) RETURNS longtext CHARSET utf8
    READS SQL DATA
 BEGIN

--- a/frontend/src/components/canvas/components/Editor/ContextMenu.vue
+++ b/frontend/src/components/canvas/components/Editor/ContextMenu.vue
@ -3,16 +3,16 @@
    <ul @mouseup="handleMouseUp">
      <template v-if="curComponent">
        <template v-if="!curComponent.isLock">
-          <li @click="edit">编辑</li>
-          <li @click="copy">复制</li>
-          <li @click="paste">粘贴</li>
-          <li @click="cut">剪切</li>
-          <li @click="deleteComponent">删除</li>
-          <li @click="lock">锁定</li>
-          <li @click="topComponent">置顶</li>
-          <li @click="bottomComponent">置底</li>
-          <li @click="upComponent">上移</li>
-          <li @click="downComponent">下移</li>
+          <li @click="edit"> {{ $t('panel.edit') }}</li>
+          <li @click="copy"> {{ $t('panel.copy') }}</li>
+          <li @click="paste"> {{ $t('panel.paste') }}</li>
+          <li @click="cut"> {{ $t('panel.cut') }}</li>
+          <li @click="deleteComponent"> {{ $t('panel.delete') }}</li>
+          <li @click="lock"> {{ $t('panel.lock') }}</li>
+          <li @click="topComponent"> {{ $t('panel.topComponent') }}</li>
+          <li @click="bottomComponent"> {{ $t('panel.bottomComponent') }}</li>
+          <li @click="upComponent"> {{ $t('panel.upComponent') }}</li>
+          <li @click="downComponent"> {{ $t('panel.downComponent') }}</li>
        </template>
        <li v-else @click="unlock">解锁</li>
      </template>
--- a/frontend/src/components/canvas/components/Toolbar.vue
+++ b/frontend/src/components/canvas/components/Toolbar.vue
@ -34,7 +34,7 @@
      </el-tooltip>

      <span style="float: right;margin-left: 10px">
-         <el-button size="mini" @click="save">
+        <el-button size="mini" @click="save">
          {{ $t('commons.save') }}
        </el-button>
        <el-button size="mini" @click="closePanelEdit">
@ -54,6 +54,9 @@ import eventBus from '@/components/canvas/utils/eventBus'
 import { deepCopy } from '@/components/canvas/utils/utils'
 import { post } from '@/api/panel/panel'
 import bus from '@/utils/bus'
+import {
+  DEFAULT_COMMON_CANVAS_STYLE
+} from '@/views/panel/panel'

 export default {
  data() {
@ -213,6 +216,7 @@ export default {
    },
    clearCanvas() {
      this.$store.commit('setComponentData', [])
+      this.$store.commit('setCanvasStyle', DEFAULT_COMMON_CANVAS_STYLE)
      this.$store.commit('recordSnapshot')
    },

--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@ -893,7 +893,15 @@ export default {
    insert_picture: 'Insert Picture',
    redo: 'Redo',
    undo: 'Undo',
-    panelNull: 'This is a Empty Panel，You Can Edit and Enrich It'
+    panelNull: 'This is a Empty Panel，You Can Edit and Enrich It',
+    copy: 'Copy',
+    paste: 'Paste',
+    cut: 'Cut',
+    lock: 'Lock',
+    topComponent: 'Top Component',
+    bottomComponent: 'Bottom Component',
+    upComponent: 'Up One Level',
+    downComponent: 'Down One Level'
  },
  plugin: {
    local_install: 'Local installation',
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@ -892,7 +892,15 @@ export default {
    insert_picture: '插入圖片',
    redo: '重做',
    undo: '撤銷',
-    panelNull: '这是个空的儀表盤，可以通过编辑来丰富内容'
+    panelNull: '这是个空的儀表盤，可以通过编辑来丰富内容',
+    copy: '复制',
+    paste: '粘贴',
+    cut: '剪切',
+    lock: '锁定',
+    topComponent: '置于顶层',
+    bottomComponent: '置于底层',
+    upComponent: '上移一层',
+    downComponent: '下移一层'
  },
  plugin: {
    local_install: '本地安裝',
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@ -894,7 +894,16 @@ export default {
    insert_picture: '插入图片',
    redo: '重做',
    undo: '撤销',
-    panelNull: '这是个空的仪表板，可以通过编辑来丰富内容'
+    panelNull: '这是个空的仪表板，可以通过编辑来丰富内容',
+    copy: '复制',
+    paste: '粘贴',
+    cut: '剪切',
+    lock: '锁定',
+    topComponent: '置于顶层',
+    bottomComponent: '置于底层',
+    upComponent: '上移一层',
+    downComponent: '下移一层'
+
  },
  plugin: {
    local_install: '本地安装',
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@ -138,7 +138,7 @@ import { listenGlobalKeyDown } from '@/components/canvas/utils/shortcutKey'
 import { mapState } from 'vuex'
 import { uuid } from 'vue-uuid'
 import Toolbar from '@/components/canvas/components/Toolbar'
-import { get } from '@/api/panel/panel'
+import { findOne } from '@/api/panel/panel'
 import PreviewFullScreen from '@/components/canvas/components/Editor/PreviewFullScreen'
 import Preview from '@/components/canvas/components/Editor/Preview'

@ -243,7 +243,7 @@ export default {
        this.$store.commit('setComponentData', this.resetID(JSON.parse(componentDataTemp)))
        this.$store.commit('setCanvasStyle', JSON.parse(canvasStyleDataTemp))
      } else if (panelId) {
-        get('panel/group/findOne/' + panelId).then(response => {
+        findOne(panelId).then(response => {
          this.$store.commit('setComponentData', this.resetID(JSON.parse(response.data.panelData)))
          const panelStyle = JSON.parse(response.data.panelStyle)
          this.$store.commit('setCanvasStyle', panelStyle)
@ -257,7 +257,6 @@ export default {
      this.$router.replace('/panel/index')
    },
    showPanel(type) {
-
      if (this.showIndex === -1 || this.showIndex === type) {
        this.$nextTick(() => (this.show = !this.show))
      }
--- a/frontend/src/views/panel/list/EditPanel/index.vue
+++ b/frontend/src/views/panel/list/EditPanel/index.vue
@ -110,7 +110,7 @@ export default {
          type: 'success',
          showClose: true
        })
-        this.$emit('closeEditPanelDialog')
+        this.$emit('closeEditPanelDialog', response.data)
      })
    },
    handleFileChange(e) {
--- a/frontend/src/views/panel/list/PanelList.vue
+++ b/frontend/src/views/panel/list/PanelList.vue
@ -8,7 +8,7 @@
            :default-expanded-keys="expandedArray"
            :data="defaultData"
            node-key="id"
-            highlight-current
+            :highlight-current="activeTree==='system'"
            :expand-on-click-node="true"
            @node-click="nodeClick"
          >
@ -55,10 +55,11 @@
      <el-col class="custom-tree-container">
        <div class="block">
          <el-tree
+            ref="panel_list_tree"
            :default-expanded-keys="expandedArray"
            :data="tData"
            node-key="id"
-            highlight-current
+            :highlight-current="activeTree==='self'"
            :expand-on-click-node="true"
            @node-click="nodeClick"
          >
@ -102,24 +103,24 @@
                      />
                    </span>
                    <el-dropdown-menu slot="dropdown">
+                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-edit" :command="beforeClickMore('edit',data,node)">
+                        {{ $t('panel.edit') }}
+                      </el-dropdown-item>
+                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-share" :command="beforeClickMore('share',data,node)">
+                        {{ $t('panel.share') }}
+                      </el-dropdown-item>
+                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('link',data,node)">
+                        {{ $t('panel.create_public_links') }}
+                      </el-dropdown-item>
+                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('toDefaultPanel',data,node)">
+                        {{ $t('panel.to_default_panel') }}
+                      </el-dropdown-item>
                      <el-dropdown-item icon="el-icon-edit-outline" :command="beforeClickMore('rename',data,node)">
                        {{ $t('panel.rename') }}
                      </el-dropdown-item>
                      <el-dropdown-item icon="el-icon-delete" :command="beforeClickMore('delete',data,node)">
                        {{ $t('panel.delete') }}
                      </el-dropdown-item>
-                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-share" :command="beforeClickMore('share',data,node)">
-                        {{ $t('panel.share') }}
-                      </el-dropdown-item>
-                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('toDefaultPanel',data,node)">
-                        {{ $t('panel.to_default_panel') }}
-                      </el-dropdown-item>
-                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-edit" :command="beforeClickMore('edit',data,node)">
-                        {{ $t('panel.edit') }}
-                      </el-dropdown-item>
-                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('link',data,node)">
-                        {{ $t('panel.create_public_links') }}
-                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>
                </span>
@ -184,6 +185,9 @@ import {
  DEFAULT_YAXIS_STYLE,
  DEFAULT_BACKGROUND_COLOR
 } from '@/views/chart/chart/chart'
+import {
+  DEFAULT_COMMON_CANVAS_STYLE
+} from '@/views/panel/panel'

 import { DEFAULT_PANEL_STYLE } from '@/views/panel/panel'

@ -192,6 +196,9 @@ export default {
  components: { GrantAuth, LinkGenerate, EditPanel },
  data() {
    return {
+      lastActiveNode: null, // 激活的节点 在这个节点下面动态放置子节点
+      lastActiveNodeData: null,
+      activeTree: 'self', // 识别当前操作的树类型self 是仪表盘列表树 system 是默认仪表盘树
      editPanelModel: {
        titlePre: null,
        titleSuf: null,
@ -332,19 +339,31 @@ export default {
    }
  },
  watch: {
-
  },
  mounted() {
+    this.$store.commit('setComponentData', [])
+    this.$store.commit('setCanvasStyle', DEFAULT_COMMON_CANVAS_STYLE)
    this.defaultTree()
    this.tree(this.groupForm)
  },
  methods: {
-    closeEditPanelDialog() {
+    closeEditPanelDialog(panelInfo) {
      this.editPanel.visible = false
+      debugger
      this.defaultTree()
-      this.tree(this.groupForm)
+      // 默认展开 同时点击 新增的节点
+      if (panelInfo && this.lastActiveNodeData.id) {
+        if (!this.lastActiveNodeData.children) {
+          this.$set(this.lastActiveNodeData, 'children', [])
+        }
+        this.lastActiveNodeData.children.push(panelInfo)
+        this.lastActiveNode.expanded = true
+        this.activeNodeAndClick(panelInfo)
+      }
    },
    showEditPanel(param) {
+      this.lastActiveNode = param.node
+      this.lastActiveNodeData = param.data
      this.editPanel = JSON.parse(JSON.stringify(this.editPanelModel))
      this.editPanel.optType = param.optType
      this.editPanel.panelInfo.nodeType = param.type
@ -425,7 +444,7 @@ export default {
          this.share(param.data)
          break
        case 'edit':
-          this.edit(param.data)
+          this.edit(param.data, param.node)
          break
        case 'link':
          this.link(param.data)
@ -525,6 +544,9 @@ export default {
    },

    nodeClick(data, node) {
+      this.lastActiveNode = node
+      this.lastActiveNodeData = data
+      this.activeTree = data.panelType
      if (data.nodeType === 'panel') {
        // 加载视图数据
        findOne(data.id).then(response => {
@ -564,8 +586,12 @@ export default {
      this.authResourceId = null
      this.authVisible = false
    },
-    edit(data) {
-      debugger
+    edit(data, node) {
+      this.lastActiveNodeData = data
+      this.lastActiveNode = node
+      // 清空当前缓存
+      this.$store.commit('setComponentData', [])
+      this.$store.commit('setCanvasStyle', DEFAULT_COMMON_CANVAS_STYLE)
      this.$store.dispatch('panel/setPanelInfo', data)
      bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
    },
@ -587,6 +613,22 @@ export default {
    },
    newPanelSave(id) {

+    },
+    // 激活并点击当前节点
+    activeNodeAndClick(panelInfo) {
+      if (panelInfo) {
+        this.$nextTick(() => {
+          // 延迟设置CurrentKey
+          this.$refs.panel_list_tree.setCurrentKey(panelInfo.id)
+          this.$nextTick(() => {
+            document.querySelector('.is-current').firstChild.click()
+            // 如果是仪表盘列表的仪表盘 直接进入编辑界面
+            if (panelInfo.nodeType === 'panel' && panelInfo.panelType === 'self') {
+              this.edit(this.lastActiveNodeData, this.lastActiveNode)
+            }
+          })
+        })
+      }
    }
  }
 }