Merge branch 'dev' of github.com:dataease/dataease into dev

frontend/src/components/DeDrag/index.vue

@@ -451,9 +451,8 @@ export default {
       }
     },
     style() {
-      // console.log('style-top:' + this.y + '--' + this.top)
       return {
-        padding: this.curGap + 'px',
+        padding: this.curGap + 'px!important',
         transform: `translate(${this.left}px, ${this.top}px) rotate(${this.rotate}deg)`,
         width: this.computedWidth,
         height: this.computedHeight,
@@ -529,7 +528,6 @@ export default {
         width: this.computedMainSlotWidth,
         height: this.computedMainSlotHeight
       }
-      // console.log('style=>' + JSON.stringify(style))
       return style
     },
     curComponent() {
@@ -698,7 +696,7 @@ export default {
         const rect = this.$el.parentNode.getBoundingClientRect()
         this.parentX = rect.x
         this.parentY = rect.y
-        return [Math.round(parseFloat(style.getPropertyValue('width'), 10)), 100000]
+        return [Math.round(parseFloat(style.getPropertyValue('width'), 10)) + 6, 100000]
       }
       if (typeof this.parent === 'string') {
         const parentNode = document.querySelector(this.parent)
@@ -1810,35 +1808,8 @@ export default {
   transition: 0.2s
 }
 
-.gap_class{
-  padding:5px;
-}
-
 .de-drag-active{
   outline: 1px solid #70c0ff;
   user-select: none;
 }
-
-/*.mouseOn >>> .icon-shezhi{*/
-/*  z-index: 2;*/
-/*  display:block!important;*/
-/*}*/
-/*.vdr > i{*/
-/*  right: 5px;*/
-/*  color: gray;*/
-/*  position: absolute;*/
-/*}*/
-
-/*.vdr >>> i:hover {*/
-/*  color: red;*/
-/*}*/
-
-/*.vdr:hover >>> i {*/
-/*  z-index: 2;*/
-/*  display:block;*/
-/*}*/
-
-/*.vdr>>>.icon-shezhi {*/
-/*  display:none*/
-/*}*/
 </style>

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

@@ -280,4 +280,9 @@ export default {
     padding: 10px 20px 20px;
   }
 
+  ::-webkit-scrollbar {
+    width: 0px!important;
+    height: 0px!important;
+  }
+
 </style>

frontend/src/components/dataease/DeOutWidget.vue

@@ -139,6 +139,7 @@ export default {
     overflow: auto hidden;
     inset: 33px 0px 0px;
     position: absolute;
+    letter-spacing: 0px!important;
   }
   .condition-content-container {
     position: relative;

frontend/src/lang/en.js

@@ -1161,7 +1161,9 @@ export default {
     edit_union_relation: 'Edit Union Relation',
     add_union_relation: 'Add Union Relation',
     field_select: 'Select Field',
-    add_union_field: 'Add Union Field'
+    add_union_field: 'Add Union Field',
+    union_error: 'Union relation and field can not be empty',
+    union_repeat: 'This dataset is already union，do not union repeat'
   },
   datasource: {
     datasource: 'Data Source',

frontend/src/lang/tw.js

@@ -1162,7 +1162,9 @@ export default {
     edit_union_relation: '編輯關聯關系',
     add_union_relation: '新建關聯關系',
     field_select: '字段選擇',
-    add_union_field: '添加關聯字段'
+    add_union_field: '添加關聯字段',
+    union_error: '關聯關系與關聯字段不能為空',
+    union_repeat: '當前數據集已被關聯，請勿重復關聯'
   },
   datasource: {
     datasource: '數據源',

frontend/src/lang/zh.js

@@ -1164,7 +1164,9 @@ export default {
     edit_union_relation: '编辑关联关系',
     add_union_relation: '新建关联关系',
     field_select: '字段选择',
-    add_union_field: '添加关联字段'
+    add_union_field: '添加关联字段',
+    union_error: '关联关系与关联字段不能为空',
+    union_repeat: '当前数据集已被关联，请勿重复关联'
   },
   datasource: {
     datasource: '数据源',

frontend/src/layout/index.vue

@@ -147,5 +147,10 @@ export default {
   }
   .full-height {
     height: 100vh !important;
+    ::-webkit-scrollbar {
+      width: 0px;
+      height: 0px;
+    }
+
   }
 </style>

frontend/src/views/dataset/add/AddUnion.vue

@@ -8,7 +8,7 @@
         <el-button size="mini" @click="cancel">
           {{ $t('dataset.cancel') }}
         </el-button>
-        <el-button size="mini" type="primary" @click="save">
+        <el-button :disabled="!name || dataset.length === 0" size="mini" type="primary" @click="save">
           {{ $t('dataset.confirm') }}
         </el-button>
       </el-row>
@@ -17,7 +17,7 @@
     <div>
       <el-form :inline="true">
         <el-form-item class="form-item">
-          <el-input v-model="name" size="mini" :placeholder="$t('commons.name')" />
+          <el-input v-model="name" size="mini" :placeholder="$t('commons.name')" clearable />
         </el-form-item>
       </el-form>
       <!--添加第一个数据集按钮-->
@@ -78,6 +78,7 @@ import UnionNode from '@/views/dataset/add/union/UnionNode'
 import NodeItem from '@/views/dataset/add/union/NodeItem'
 import DatasetGroupSelectorTree from '@/views/dataset/common/DatasetGroupSelectorTree'
 import UnionEdit from '@/views/dataset/add/union/UnionEdit'
+import { getTable, post } from '@/api/dataset/dataset'
 export default {
   name: 'AddUnion',
   components: { UnionEdit, DatasetGroupSelectorTree, NodeItem, UnionNode },
@@ -126,7 +127,7 @@ export default {
         },
         allChildCount: 0
       },
-      name: '',
+      name: '关联数据集',
       customType: ['db', 'sql', 'excel'],
       selectDsDialog: false,
       // 弹框临时选中的数据集
@@ -135,11 +136,45 @@ export default {
       unionParam: {}
     }
   },
+  watch: {
+    'param.tableId': function() {
+      this.initTableData()
+    }
+  },
   mounted() {
+    this.initTableData()
   },
   methods: {
     save() {
-
+      if (!this.name || this.name === '') {
+        this.$message({
+          showClose: true,
+          message: this.$t('dataset.pls_input_name'),
+          type: 'error'
+        })
+        return
+      }
+      if (this.name.length > 50) {
+        this.$message({
+          showClose: true,
+          message: this.$t('dataset.char_can_not_more_50'),
+          type: 'error'
+        })
+        return
+      }
+      const table = {
+        id: this.param.tableId,
+        name: this.name,
+        sceneId: this.param.id,
+        dataSourceId: this.dataset[0].currentDs.dataSourceId,
+        type: 'union',
+        mode: this.dataset[0].currentDs.mode,
+        info: '{"list":' + JSON.stringify(this.dataset) + '}'
+      }
+      post('/dataset/table/update', table).then(response => {
+        this.$emit('saveSuccess', table)
+        this.cancel()
+      })
     },
     cancel() {
       if (this.param.tableId) {
@@ -198,11 +233,46 @@ export default {
       }
     },
     confirmEditUnion() {
-      // todo 校验关联关系与字段，必填
-      this.editUnion = false
+      // 校验关联关系与字段，必填
+      if (this.checkUnion()) {
+        this.editUnion = false
+      } else {
+        this.$message({
+          message: this.$t('dataset.union_error'),
+          type: 'error',
+          showClose: true
+        })
+      }
     },
     cancelUnion(val) {
       this.dataset = val
+    },
+
+    checkUnion() {
+      const union = this.unionParam.node.unionToParent
+      if (!union.unionType) {
+        return false
+      }
+      if (!union.unionFields || union.unionFields.length < 1) {
+        return false
+      }
+      for (let i = 0; i < union.unionFields.length; i++) {
+        const ele = union.unionFields[i]
+        if (!ele.parentField || !ele.parentField.id || !ele.currentField || !ele.currentField.id) {
+          return false
+        }
+      }
+      return true
+    },
+
+    initTableData() {
+      if (this.param.tableId) {
+        getTable(this.param.tableId).then(response => {
+          const table = JSON.parse(JSON.stringify(response.data))
+          this.name = table.name
+          this.dataset = JSON.parse(table.info).list
+        })
+      }
     }
   }
 }

frontend/src/views/dataset/add/union/NodeItem.vue

@@ -13,7 +13,7 @@
             <el-button icon="el-icon-more" type="text" size="small" />
           </span>
           <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item icon="el-icon-copy-document" :command="beforeNodeMenuClick('union',currentNode)">
+            <el-dropdown-item :disabled="currentNode.currentDs.mode === 0 && currentNode.currentDs.modelInnerType === 'sql'" icon="el-icon-copy-document" :command="beforeNodeMenuClick('union',currentNode)">
               <span style="font-size: 12px;">{{ $t('dataset.union') }}</span>
             </el-dropdown-item>
             <el-dropdown-item icon="el-icon-edit-outline" :command="beforeNodeMenuClick('edit',currentNode)">
@@ -29,7 +29,7 @@
 
     <!--选择数据集-->
     <el-dialog v-dialogDrag :title="$t('chart.select_dataset')" :visible="selectDsDialog" :show-close="false" width="360px" class="dialog-css" destroy-on-close>
-      <dataset-group-selector-tree :fix-height="true" show-mode="union" :custom-type="customType" @getTable="firstDs" />
+      <dataset-group-selector-tree :fix-height="true" show-mode="union" :custom-type="customType" :mode="currentNode.currentDs.mode" @getTable="firstDs" />
       <div slot="footer" class="dialog-footer">
         <el-button size="mini" @click="closeSelectDs()">{{ $t('dataset.cancel') }}</el-button>
         <el-button :disabled="!tempDs.id" type="primary" size="mini" @click="confirmSelectDs()">{{ $t('dataset.confirm') }}</el-button>
@@ -127,6 +127,16 @@ export default {
     },
 
     selectDs() {
+      // 根据父级node，过滤不同的数据集
+      if (this.currentNode.currentDs.mode === 1) {
+        this.customType = ['db', 'sql', 'excel']
+      } else if (this.currentNode.currentDs.mode === 0) {
+        if (this.currentNode.currentDs.modelInnerType === 'db') {
+          this.customType = ['db']
+        } else {
+          this.customType = []
+        }
+      }
       this.selectDsDialog = true
     },
     // 弹框中选择数据集
@@ -138,6 +148,27 @@ export default {
       this.tempDs = {}
     },
     confirmSelectDs() {
+      // 校验当前数据集是否已被关联，以及直连模式是否属于同一数据源
+      if (this.tempDs.mode === 0) {
+        if (this.tempDs.dataSourceId !== this.tempParentDs.currentDs.dataSourceId) {
+          this.$message({
+            type: 'error',
+            message: this.$t('dataset.can_not_union_diff_datasource'),
+            showClose: true
+          })
+          return
+        }
+      }
+      const arr = this.getAllDs()
+      if (arr.indexOf(this.tempDs.id) > -1) {
+        this.$message({
+          type: 'error',
+          message: this.$t('dataset.union_repeat'),
+          showClose: true
+        })
+        return
+      }
+      // check over
       const ds = JSON.parse(JSON.stringify(this.unionItem))
       ds.currentDs = this.tempDs
       this.tempParentDs.childrenDs.push(ds)
@@ -163,6 +194,25 @@ export default {
     },
     confirmEditField() {
       this.editField = false
+    },
+
+    getAllDs() {
+      const arr = []
+      for (let i = 0; i < this.originData.length; i++) {
+        arr.push(this.originData[0].currentDs.id)
+        if (this.originData[0].childrenDs && this.originData[0].childrenDs.length > 0) {
+          this.getDs(this.originData[0].childrenDs, arr)
+        }
+      }
+      return arr
+    },
+    getDs(dsList, arr) {
+      for (let i = 0; i < dsList.length; i++) {
+        arr.push(dsList[i].currentDs.id)
+        if (dsList[i].childrenDs && dsList[i].childrenDs.length > 0) {
+          this.getDs(dsList[i].childrenDs, arr)
+        }
+      }
     }
   }
 }

frontend/src/views/dataset/add/union/UnionNode.vue

@@ -191,11 +191,37 @@ export default {
       }
     },
     confirmEditUnion() {
-      this.editUnion = false
+      // 校验关联关系与字段，必填
+      if (this.checkUnion()) {
+        this.editUnion = false
+      } else {
+        this.$message({
+          message: this.$t('dataset.union_error'),
+          type: 'error',
+          showClose: true
+        })
+      }
     },
     // 向上级传递
     cancelUnion(val) {
       this.$emit('cancelUnionEdit', val)
+    },
+
+    checkUnion() {
+      const union = this.unionParam.node.unionToParent
+      if (!union.unionType) {
+        return false
+      }
+      if (!union.unionFields || union.unionFields.length < 1) {
+        return false
+      }
+      for (let i = 0; i < union.unionFields.length; i++) {
+        const ele = union.unionFields[i]
+        if (!ele.parentField || !ele.parentField.id || !ele.currentField || !ele.currentField.id) {
+          return false
+        }
+      }
+      return true
     }
   }
 }

frontend/src/views/dataset/common/DatasetChartDetail.vue

@@ -39,6 +39,7 @@
             <p v-if="detail.table.type === 'sql'" class="info-content">{{ $t('dataset.sql_data') }}</p>
             <p v-if="detail.table.type === 'excel'" class="info-content">{{ $t('dataset.excel_data') }}</p>
             <p v-if="detail.table.type === 'custom'" class="info-content">{{ $t('dataset.custom_data') }}</p>
+            <p v-if="detail.table.type === 'union'" class="info-content">{{ $t('dataset.union_data') }}</p>
           </el-col>
           <el-col v-show="detail.table.type === 'db'" class="info-item">
             <p class="info-title">{{ $t('dataset.table') }}</p>
@@ -73,6 +74,14 @@
             <p v-if="detail.datasource.type === 'mysql'" class="info-content">MySQL</p>
             <p v-if="detail.datasource.type === 'sqlServer'" class="info-content">SQL Server</p>
             <p v-if="detail.datasource.type === 'oracle'" class="info-content">Oracle</p>
+            <p v-if="detail.datasource.type === 'hive'" class="info-content">Apache Hive</p>
+            <p v-if="detail.datasource.type === 'pg'" class="info-content">PostgreSQL</p>
+            <p v-if="detail.datasource.type === 'es'" class="info-content">Elasticsearch</p>
+            <p v-if="detail.datasource.type === 'mariadb'" class="info-content">MariaDB</p>
+            <p v-if="detail.datasource.type === 'ds_doris'" class="info-content">Doris</p>
+            <p v-if="detail.datasource.type === 'ck'" class="info-content">ClickHouse</p>
+            <p v-if="detail.datasource.type === 'redshift'" class="info-content">AWS Redshift</p>
+            <p v-if="detail.datasource.type === 'mongo'" class="info-content">MongoDB</p>
           </el-col>
           <el-col class="info-item">
             <p class="info-title">{{ $t('dataset.create_time') }}</p>

frontend/src/views/dataset/data/ViewTable.vue

@@ -36,6 +36,9 @@
         <el-button v-if="table.type ==='sql'" size="mini" @click="editSql">
           {{ $t('dataset.edit_sql') }}
         </el-button>
+        <el-button v-if="table.type ==='union'" size="mini" @click="editUnion">
+          {{ $t('dataset.edit_union') }}
+        </el-button>
         <!--        <el-button size="mini" @click="edit">-->
         <!--          {{ $t('dataset.edit_field') }}-->
         <!--        </el-button>-->
@@ -168,6 +171,9 @@ export default {
     editCustom() {
       this.$emit('switchComponent', { name: 'AddCustom', param: { id: this.table.sceneId, tableId: this.table.id, table: this.table }})
     },
+    editUnion() {
+      this.$emit('switchComponent', { name: 'AddUnion', param: { id: this.table.sceneId, tableId: this.table.id, table: this.table }})
+    },
 
     reSearch(val) {
       this.tableViewRowForm = val.form

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

@@ -699,7 +699,7 @@ export default {
         if (domInfo) {
           this.outStyle.height = domInfo.offsetHeight - this.getGap()
           // 临时处理 确保每次restore 有会更新
-          this.outStyle.width = domInfo.offsetWidth - this.getGap() + (Math.random() * 0.000001)
+          this.outStyle.width = domInfo.offsetWidth - this.getGap() + (Math.random() * 0.000001) + 2
         }
       })
     },
@@ -1057,8 +1057,8 @@ export default {
 }
 
 ::-webkit-scrollbar {
-  width: 0px;
-  height: 0px;
+  width: 2px!important;
+  height: 2px!important;
 }
 
 </style>

frontend/src/views/panel/list/PanelList.vue

@@ -371,7 +371,7 @@ export default {
   mounted() {
     this.$store.commit('setComponentData', [])
     this.$store.commit('setCanvasStyle', DEFAULT_COMMON_CANVAS_STYLE_STRING)
-    this.defaultTree()
+    this.defaultTree(true)
     this.tree(true)
     this.initCache()
   },
@@ -620,17 +620,19 @@ export default {
         }
       })
     },
-    defaultTree() {
+    defaultTree(cache = false) {
       const requestInfo = {
         panelType: 'system'
       }
       const modelInfo = localStorage.getItem('panel-default-tree')
-      if (modelInfo) {
+      const userCache = (modelInfo && cache)
+
+      if (userCache) {
         this.defaultData = JSON.parse(modelInfo)
       }
       defaultTree(requestInfo, false).then(res => {
         localStorage.setItem('panel-default-tree', JSON.stringify(res.data))
-        if (!modelInfo) {
+        if (!userCache) {
           this.defaultData = res.data
         }
       })