Merge pull request #886 from dataease/pr@dev@style_de_tabs

style: 调整仪表板tabs组件样式

frontend/src/components/canvas/components/Editor/SettingMenu.vue

@@ -12,7 +12,7 @@
           <el-dropdown-item icon="el-icon-arrow-up" @click.native="upComponent">{{ $t('panel.upComponent') }}</el-dropdown-item>
           <el-dropdown-item icon="el-icon-arrow-down" @click.native="downComponent">{{ $t('panel.downComponent') }}</el-dropdown-item>
           <el-dropdown-item v-if="'view'===curComponent.type" icon="el-icon-link" @click.native="linkageSetting">{{ $t('panel.linkage_setting') }}</el-dropdown-item>
-          <el-dropdown-item v-if="'de-tabs'===curComponent.type" icon="el-icon-link" @click.native="addTab">新增Tab</el-dropdown-item>
+          <el-dropdown-item v-if="'de-tabs'===curComponent.type" icon="el-icon-link" @click.native="addTab">{{ $t('panel.add_tab') }}</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
     </div>

frontend/src/components/widget/DeWidget/DeTabs.vue

@@ -46,12 +46,16 @@
       :append-to-body="true"
       :visible.sync="dialogVisible"
       width="30%"
+      :show-close="false"
+      :close-on-click-modal="false"
       center
     >
       <el-input
         v-model="textarea"
         type="textarea"
         :rows="2"
+        maxlength="10"
+        show-word-limit
         :placeholder="$t('dataset.input_content')"
       />
       <span slot="footer" class="dialog-footer">
@@ -66,6 +70,8 @@
       :visible.sync="viewDialogVisible"
       width="20%"
       height="400px"
+      :show-close="false"
+      :close-on-click-modal="false"
       center
     >
       <div style="width: 100%;min-height: 250px; max-height: 300px; overflow-y: auto;">
@@ -251,8 +257,8 @@ export default {
         }
     }
   }
-  .de-tab-i {
-    transition: 0.3s;
+  /* .de-tab-i {
+    transition: 0.1s;
     opacity: 0;
     transform:  translateY(100%);
   }
@@ -260,7 +266,7 @@ export default {
   .de-tab-drop:hover .de-tab-i {
     opacity: 1;
     transform:  translateY(0);
-  }
+  } */
   .de-tab-content {
     width: 100%;
     height: 100%;

frontend/src/lang/en.js

@@ -1257,6 +1257,7 @@ export default {
     upComponent: 'Up One Level',
     downComponent: 'Down One Level',
     linkage_setting: 'Linkage Setting',
+    add_tab: 'Add Tab',
     open_aided_design: 'Open Component Aided Design',
     close_aided_design: 'Close Component Aided Design',
     open_style_design: 'Open Style Design',

frontend/src/lang/tw.js

@@ -1260,6 +1260,7 @@ export default {
     upComponent: '上移',
     downComponent: '下移',
     linkage_setting: '聯動設置',
+    add_tab: '新增Tab',
     open_aided_design: '打開組件輔助設計',
     close_aided_design: '關閉組件輔助設計',
     open_style_design: '打開樣式設計',

frontend/src/lang/zh.js

@@ -1265,6 +1265,7 @@ export default {
     upComponent: '上移',
     downComponent: '下移',
     linkage_setting: '联动设置',
+    add_tab: '新增Tab',
     open_aided_design: '打开组件辅助设计',
     close_aided_design: '关闭组件辅助设计',
     open_style_design: '打开样式设计',

frontend/src/views/panel/ViewSelect/index.vue

@@ -36,7 +36,6 @@
           @check="checkChanged"
 
           @node-drag-end="dragEnd"
-
         >
           <span slot-scope="{ node, data }" class="custom-tree-node">
             <span>
@@ -84,7 +83,8 @@ export default {
       defaultExpandedKeys: [],
       defaultProps: {
         children: 'children',
-        label: 'name'
+        label: 'name',
+        disabled: 'disabled'
       },
       data: [],
       showdetail: false,
@@ -114,7 +114,11 @@ export default {
       const param = {}
       this.loading = true
       tree(param).then(res => {
-        this.data = res.data
+        const nodeDatas = res.data
+        if (this.selectModel) {
+          this.setParentDisable(nodeDatas)
+        }
+        this.data = nodeDatas
         this.loading = false
       })
     },
@@ -156,6 +160,16 @@ export default {
       const nodes = this.$refs.templateTree.getCheckedNodes(true, false)
       return nodes
     },
+    setParentDisable(nodes) {
+      nodes.forEach(node => {
+        if (node.type === 'group') {
+          node.disabled = true
+        }
+        if (node.children && node.children.length > 0) {
+          this.setParentDisable(node.children)
+        }
+      })
+    },
     viewComponentInfo() {
       let component
       // 用户视图设置 复制一个模板