three-trees-ui 1.0.53 → 1.0.55

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-trees-ui",
-  "version": "1.0.53",
+  "version": "1.0.55",
   "publicPath": "/ui",
   "author": "hotent",
   "private": false,

package/packages/DataLists/index.js

@@ -0,0 +1,7 @@
+import DataLists from './src/main.vue'
+
+DataLists.install = function(Vue) {
+  Vue.component(DataLists.name, DataLists)
+}
+
+export default DataLists

package/packages/DataLists/src/main.vue

@@ -0,0 +1,117 @@
+<template>
+  <div v-if="permission != 'n'" class="ht-data-lists">
+    <div class="column-content">
+      <el-tabs
+        v-if="tabPaneList.length > 1"
+        v-model="activeName"
+        @tab-click="handleTabClick"
+      >
+        <el-tab-pane
+          v-for="item in tabPaneList"
+          :key="item.dataTemplateKey"
+          :name="item.dataTemplateKey"
+        >
+          <span slot="label">{{ item.name }}</span>
+        </el-tab-pane>
+      </el-tabs>
+      <div
+        v-if="tabPaneList && tabPaneList.length == 1"
+        class="ht-data-lists-title"
+      >
+        {{ tabPaneList[0].name }}
+      </div>
+      <div class="table-wrap" :class="{ 'no-tabs': tabPaneList.length <= 1 }">
+        <ht-query-sql-preview
+          :key="viewId"
+          :view-id="viewId"
+          :query-view-options="queryViewOptions"
+          :show-query-view-name="false"
+        ></ht-query-sql-preview>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+  import permission from '@/mixins/permission.js'
+export default {
+    name: 'HtDataLists',
+    mixins: [permission],
+    props: {
+      pageSize: {
+        type: Number,
+        default: 10,
+      },
+      options: {
+        type: String,
+      },
+    },
+    data() {
+      return {
+        tabPaneList: [],
+        activeName: '',
+        viewId: '',
+        queryViewOptions: {},
+      }
+    },
+    watch: {
+      options: {
+        handler(val) {
+          debugger
+          if (val) {
+            this.tabPaneList = JSON.parse(val)
+            this.activeName = this.tabPaneList[0].dataTemplateKey
+            this.viewId = this.tabPaneList[0].dataTemplateId
+            this.queryViewOptions = this.tabPaneList[0].bindOptions
+          }
+        },
+        immediate: true,
+        deep: true,
+      },
+    },
+    methods: {
+      handleTabClick() {
+        let data = this.tabPaneList.filter((item) => {
+          return item.dataTemplateKey === this.activeName
+        })
+        this.viewId = data[0].dataTemplateId
+        this.queryView = data[0].bindOptions
+      },
+    },
+  }
+</script>
+
+<style lang="scss" scoped>
+  .ht-data-lists {
+    .el-tabs {
+      padding: 24px 0;
+      .el-tabs__content {
+        padding: 0;
+      }
+    }
+    .el-tabs__header {
+      margin: 0;
+      .el-tabs__nav-wrap::after {
+        height: 0px;
+        background: #eeeeee;
+      }
+      .el-tabs__item {
+        font-size: 14px;
+      }
+    }
+    .no-tabs {
+      padding: 24px 0;
+    }
+    .el-tabs__header {
+      margin: 0;
+    }
+    ::v-deep .is-vertical {
+      border: none !important;
+    }
+    .ht-data-lists-title {
+      font-size: 16px;
+      font-weight: 550;
+      color: #262626;
+      margin-top: 24px;
+    }
+  }
+</style>

package/packages/QuerySqlPreview/src/QuerySqlPreview.vue

@@ -9,6 +9,7 @@
         :alias="alias"
         :single="single"
         :query-view="queryView"
+        :query-view-options="queryViewOptions"
         class="data-preview-wrap"
       />
     </template>
@@ -20,13 +21,14 @@
 <script>
   import Vue from 'vue'
   import querySqlPreview from '@/mixins/querySqlPreview.js'
-  export default {
+export default {
     name: 'HtQuerySqlPreview',
     props: {
       viewId: {
         type: String,
         default: '',
       },
+      queryViewOptions: Object,
     },
     data() {
       return {
@@ -77,6 +79,7 @@
             sqlAlias: String,
             alias: String,
             queryView: Object,
+            queryViewOptions: Object,
           },
           data() {
             return {}
@@ -160,4 +163,4 @@
     font-weight: bold;
     color: #f56c6c;
   }
-</style>
+</style>

package/packages/Subtable/src/SubExportDialog.vue

@@ -47,6 +47,33 @@
       }
     },
     methods: {
+      // 配置的数据字典 导出时翻译为汉字
+      changeDictionary(data) {
+        return new Promise(async (resolve, reject) => {
+          for (let i = 0; i < data.length; i++) {
+            for (let j = 0; j < this.columns.length; j++) {
+              if (
+                data[i][this.columns[j].name] &&
+                this.columns[j].ctrlType == 'dic' &&
+                this.columns[j].alias
+              ) {
+                let result = await this.$requestConfig.getDictionaryByKey(
+                  this.columns[j].alias
+                )
+                if (result) {
+                  let dictionary = result.find((item) => {
+                    return item.key == data[i][this.columns[j].name]
+                  })
+                  if (dictionary) {
+                    data[i][this.columns[j].name] = dictionary.name
+                  }
+                }
+              }
+            }
+          }
+          resolve()
+        })
+      },
       changeRowKey(rows) {
         var exportData = []
         rows.forEach((row) => {
@@ -68,7 +95,10 @@
           pInst,
           this.subtablePagination
         )
-          .then((data) => {
+          .then(async (data) => {
+            data = JSON.parse(JSON.stringify(data))
+            // 导出时 字典转换
+            await this.changeDictionary(data)
             let exportData = this.changeRowKey(data)
             const sheet = this.$XLSX.utils.json_to_sheet(exportData),
               blob = this.sheet2blob(sheet)

package/packages/Subtable/src/SubImportDialog.vue

@@ -115,6 +115,7 @@
           { mode: 'override', desc: '覆盖导入' },
           { mode: 'merge', desc: '合并导入', disabled: true },
         ],
+        cacheDicData: {}, // 缓存字典数据
       }
     },
     computed: {
@@ -172,6 +173,44 @@
       SubPagination.clear(this.dataSubname)
     },
     methods: {
+      changeDictionary(data) {
+        return new Promise(async (resolve) => {
+          for (let i = 0; i < data.length; i++) {
+            for (let j = 0; j < this.columns.length; j++) {
+              if (
+                data[i][this.columns[j].name] &&
+                this.columns[j].ctrlType == 'dic' &&
+                this.columns[j].alias
+              ) {
+                // 将数据缓存，如果相同别名就不去请求字典数据
+                let result = null
+                if (this.cacheDicData[this.columns[j].alias]) {
+                  result = this.cacheDicData[this.columns[j].alias]
+                } else {
+                  result = await this.$requestConfig.getDictionaryByKey(
+                    this.columns[j].alias
+                  )
+                }
+                if (result) {
+                  this.cacheDicData[this.columns[j].alias] = result
+                  let dictionary = result.find((item) => {
+                    return (
+                      item.name == data[i][this.columns[j].name] ||
+                      item.key == data[i][this.columns[j].name]
+                    )
+                  })
+                  if (dictionary) {
+                    data[i][this.columns[j].name] = dictionary.key
+                  } else {
+                    data[i][this.columns[j].name] = ''
+                  }
+                }
+              }
+            }
+          }
+          resolve(data)
+        })
+      },
       //子表模板导出
       exportFormSub() {
         let columns = this.columns.filter((item) => {
@@ -211,7 +250,7 @@
         })
         return importRows
       },
-      dialogConfirm() {
+      async dialogConfirm() {
         if (this.importRows.length == 0) {
           this.$message.error('请选择要导入的文件')
           return
@@ -250,9 +289,10 @@
             }
           }
         }
+        let importRows = await this.changeDictionary(this.importRows)
         SubPagination.importData(
           this.dataSubname,
-          this.importRows,
+          importRows,
           this.mode,
           this.mergeFunc
         )

package/src/index.js

@@ -83,6 +83,7 @@ import HtChart from '../packages/Chart/index'
 import HtMap from '../packages/Map/index'
 import HtQrcode from '../packages/Qrcode/index'
 import HtDataView from '../packages/DataView/index'
+import HtDataLists from '../packages/DataLists/index'
 import HtRelevantFlow from '../packages/RelevantFlow/index'
 import HtMilepost from '../packages/Milepost/index'
 import HtText from '../packages/Text/index'
@@ -199,6 +200,7 @@ const HotentUi = {
   HtMap,
   HtQrcode,
   HtDataView,
+  HtDataLists,
   HtTemplatePreview,
   HtTemplatePreviewFile,
   HtTemplatePreviewImage,

package/src/mixins/onlineSubtable.js

@@ -105,6 +105,9 @@ export default {
       if (newOne.id_) {
         delete newOne.id_
       }
+      if (newOne.id) {
+        delete newOne.id
+      }
       if (newOne.sub_row_readonly) {
         delete newOne.sub_row_readonly
       }

package/src/mixins/querySqlPreview.js

@@ -116,8 +116,76 @@ export default {
       },
       immediate: true,
     },
+    queryViewOptions: {
+      handler(newVal) {
+        this.handelBindFiledValua()
+      },
+      immediate: true,
+      deep: true,
+    },
   },
   methods: {
+    handelBindFiledValua() {
+      //数据视图控件
+      let _me = this
+      if (this.queryViewOptions) {
+        const pInst = utils.getOnlineFormInstance(
+          this.$parent.$parent.$parent.$parent
+        )
+        if (
+          pInst.data &&
+          !pInst.data[this.queryViewOptions.boDefAlias] &&
+          this.queryViewOptions.boDefAlias
+        ) {
+          this.queryViewOptions.boDefAlias = Object.keys(pInst.data)[0]
+        }
+        //关联查询字段
+        let selectList = this.queryViewOptions.selectList
+        if (selectList && selectList.length > 0) {
+          for (let i = 0; i < selectList.length; i++) {
+            if (selectList[i].selectField) {
+              const path =
+                'data.' +
+                this.queryViewOptions.boDefAlias +
+                '.' +
+                selectList[i].selectField
+
+              let value = utils.getValueByPath(pInst, path)
+              //获取绑定的类型，判断是否和选择的类型一致，此处针对时间格式和字符串格式匹配的兼容处理
+              const selectFieldType = selectList[i].selectFieldType
+              const bindSelectdType = selectList[i].bindSelectdType
+              if (
+                selectFieldType &&
+                bindSelectdType &&
+                selectFieldType !== bindSelectdType
+              ) {
+                if (
+                  bindSelectdType.includes('date') ||
+                  selectFieldType.includes('date')
+                ) {
+                  //如果不为日期格式，则给一个空字符串 isNaN(value) && !isNaN(Date.parse(value))
+                  // 可以判断是个字符串是否是时间格式，取反则表示无法转换成字符串，则改一默认值
+                  if (!(isNaN(value) && !isNaN(Date.parse(value)))) {
+                    value = ''
+                  }
+                }
+              }
+              selectList[i].selectValue = value
+
+              //添加监听
+              pInst.$watch(path, function(newVal, oldVal) {
+                _.debounce(() => {
+                  if (newVal !== oldVal) {
+                    _me.queryViewOptions.selectList[i].selectValue = newVal
+                    _me.search()
+                  }
+                }, 500)()
+              })
+            }
+          }
+        }
+      }
+    },
     filterOldSummaryValByType(type) {
       const keys = this.summaryTableData.map((item) => item.key)
       if (keys && keys.length && keys.includes(type)) {
@@ -276,18 +344,33 @@ export default {
       }
     },
     search(param, cb) {
-      !param && (param = {})
+       !param && (param = {})
       param.pageBean = this.pagination
+      const dataTemplateQueryVo = {
+        queryFilter: param,
+      }
       //保存查询参数，用于作为导出的查询参数
+      if (this.queryViewOptions) {
+        //关联查询字段
+        if (
+          this.queryViewOptions.selectList &&
+          this.queryViewOptions.selectList.length > 0
+        ) {
+          dataTemplateQueryVo.selectList = this.queryViewOptions.selectList
+        }
+      }
       this.queryParam = { ...param }
       let obj = {
         sqlAlias: this.sqlAlias || this.queryView.sqlAlias,
         alias: this.alias || this.queryView.alias,
-        param: param,
+        param: dataTemplateQueryVo,
       }
       this.getQuerySqlViewByPagination(obj, cb)
+
+     
     },
     getQuerySqlViewByPagination(param, cb) {
+      debugger
       this.$requestConfig
         .getQueryViewDataList(param)
         .then((response) => {