Merge pull request #3955 from dataease/pr@dev_memory_component

Pr@dev memory component
2022-11-30 13:43:32 +08:00 · 2022-11-30 13:43:32 +08:00 · ae43683a5b
commit ae43683a5b
parent a16555aa24 e96e31048e
14 changed files with 137 additions and 99 deletions
--- a/frontend/src/components/canvas/components/editor/EditBar.vue
+++ b/frontend/src/components/canvas/components/editor/EditBar.vue
@ -372,7 +372,7 @@ export default {
    ])
  },
  mounted() {
-    if (navigator.platform.indexOf('Mac') == -1) {
+    if (navigator.platform.indexOf('Mac') === -1) {
      this.systemOS = 'Other'
    }
    this.initCurFields()
--- a/frontend/src/components/canvas/components/editor/SettingMenu.vue
+++ b/frontend/src/components/canvas/components/editor/SettingMenu.vue
@ -17,8 +17,7 @@
            v-if="curComponent.type != 'custom-button'"
            icon="el-icon-document-copy"
            @click.native="copy"
-          ><span>{{ $t('panel.copy') }}(<span v-show="systemOS==='Mac'"><i class="icon iconfont icon-command"
-          />+ D</span> <span v-show="systemOS!=='Mac'">Control + D</span>)</span>
+          ><span>{{ $t('panel.copy') }}(<span v-show="systemOS==='Mac'"><i class="icon iconfont icon-command" />+ D</span> <span v-show="systemOS!=='Mac'">Control + D</span>)</span>
          </el-dropdown-item>
          <el-dropdown-item
            icon="el-icon-delete"
@ -210,7 +209,7 @@ export default {
    ])
  },
  mounted() {
-    if (navigator.platform.indexOf('Mac') == -1) {
+    if (navigator.platform.indexOf('Mac') === -1) {
      this.systemOS = 'Other'
    }
  },
--- a/frontend/src/components/deCustomCm/DePager.vue
+++ b/frontend/src/components/deCustomCm/DePager.vue
@ -112,9 +112,9 @@ export default {
        }
      }

-      //eslint-disable-next-line
+      // eslint-disable-next-line
      this.showPrevMore = showPrevMore
-      //eslint-disable-next-line
+      // eslint-disable-next-line
      this.showNextMore = showNextMore

      return array
--- a/frontend/src/components/deCustomCm/DeTextarea.vue
+++ b/frontend/src/components/deCustomCm/DeTextarea.vue
@ -1,12 +1,12 @@
 <template>
  <el-input
-    v-count="value"
+    v-count="{value, maxlength}"
    :placeholder="$t('fu.search_bar.please_input')"
    show-word-limit
    :disabled="disabled"
    :value="value"
    type="textarea"
-    maxlength="200"
+    :maxlength="maxlength"
    @input="handleChange"
  />
 </template>
@ -16,14 +16,14 @@ export default {
  directives: {
    count: {
      update: function(el, binding) {
-        const lg = binding.value?.length || 0
+        const lg = binding.value.value?.length || 0
        const count = el.querySelector('.el-input__count')
        if (!count) return
        if (!lg) {
          if (count?.classList?.contains('no-zore')) {
            count.classList.remove('no-zore')
          }
-          count.innerHTML = '0/200'
+          count.innerHTML = `0/${binding.value.maxlength || 200}`
          return
        }
        if (el.querySelector('.no-zore')) {
@ -34,7 +34,7 @@ export default {
        const num = document.createElement('span')
        const total = document.createElement('span')
        num.style.color = '#1F2329'
-        total.innerHTML = '/200'
+        total.innerHTML = `/${binding.value.maxlength || 200}`
        num.innerHTML = lg
        if (!newCount) return
        newCount.classList.add('el-input__count', 'no-zore')
@ -46,7 +46,11 @@ export default {
  },
  props: {
    disabled: Boolean,
-    value: String
+    value: String,
+    maxlength: {
+      type: Number,
+      default: 200
+    }
  },
  methods: {
    handleChange(val) {
--- a/frontend/src/utils/request.js
+++ b/frontend/src/utils/request.js
@ -108,13 +108,16 @@ service.interceptors.response.use(response => {
  const headers = error.response && error.response.headers || error.response || config.headers
  config.loading && tryHideLoading(store.getters.currentPath)

-  let msg
+  let msg = ''
  if (error.response) {
    checkAuth(error.response)
    msg = error.response.data.message || error.response.data
  } else {
    msg = error.message
  }
+  if (msg.length > 600) {
+    msg = msg.slice(0, 600)
+  }
  !config.hideMsg && (!headers['authentication-status']) && $error(msg)
  return Promise.reject(config.url === '/dataset/table/sqlPreview' ? msg : error)
 })
--- a/frontend/src/views/chart/components/ChartTitleUpdate.vue
+++ b/frontend/src/views/chart/components/ChartTitleUpdate.vue
@ -380,8 +380,8 @@ export default {
        if (!viewSave) return
        viewEditSave(this.panelInfo.id, viewSave).then(() => {
          this.chart.title = this.chartTitleUpdate
-          bus.$emit('aside-set-title', this.chart.title)
        })
+        bus.$emit('title-name', this.chart.title, chartView.id)
        bus.$emit('view-in-cache', {
          type: 'styleChange',
          viewId: chartView.id,
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@ -1934,7 +1934,8 @@ export default {
  },

  methods: {
-    setTitle(title) {
+    setTitle(title, id) {
+      if (this.view.id !== id) return
      this.view.customStyle.text = { ...this.view.customStyle.text, title }
      this.view.title = title
      this.view.name = title
--- a/frontend/src/views/dataset/data/FieldEdit.vue
+++ b/frontend/src/views/dataset/data/FieldEdit.vue
@ -860,8 +860,8 @@ export default {
          item.dateFormat = item.dateFormatType
        }
      }
-      if(item.dateFormatType === 'custom' && !item.dateFormat){
-        return;
+      if (item.dateFormatType === 'custom' && !item.dateFormat) {
+        return
      }
      post('/dataset/field/save', item)
        .then((response) => {
--- a/frontend/src/views/dataset/data/UpdateInfo.vue
+++ b/frontend/src/views/dataset/data/UpdateInfo.vue
@ -861,7 +861,7 @@ export default {
    },
    disableExec(task) {
      return (
-        (task.status === 'Stopped' && task.rate !== 'SIMPLE') || task.status === 'Pending' || task.status ==='Exec' || !hasDataPermission('manage', task.privileges)
+        (task.status === 'Stopped' && task.rate !== 'SIMPLE') || task.status === 'Pending' || task.status === 'Exec' || !hasDataPermission('manage', task.privileges)
      )
    },
    disableDelete(task) {
--- a/frontend/src/views/panel/appTemplateMarket/log/index.vue
+++ b/frontend/src/views/panel/appTemplateMarket/log/index.vue
@ -1,8 +1,8 @@
 <template>
  <el-row
+    v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
    style="text-align: left"
    class="de-search-table"
-    v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
  >
    <el-row class="top-operate">
      <el-col :span="12">
@ -36,8 +36,8 @@
          icon="iconfont icon-icon-filter"
          @click="filterShow"
        >{{
-            $t('user.filter')
-          }}
+           $t('user.filter')
+         }}
          <template v-if="filterTexts.length">
            ({{ cacheCondition.length }})
          </template>
@ -50,7 +50,7 @@
    >
      <span class="sum">{{ paginationConfig.total }}</span>
      <span class="title">{{ $t('user.result_one') }}</span>
-      <el-divider direction="vertical"/>
+      <el-divider direction="vertical" />
      <i
        v-if="showScroll"
        class="el-icon-arrow-left arrow-filter"
@ -63,9 +63,9 @@
          class="text"
        >
          {{ ele }} <i
-          class="el-icon-close"
-          @click="clearOneFilter(index)"
-        />
+            class="el-icon-close"
+            @click="clearOneFilter(index)"
+          />
        </p>
      </div>
      <i
@ -180,11 +180,11 @@

    <!--导入templatedialog-->
    <el-dialog
+      v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
      :title="$t('app_template.log_delete_tips')"
      :visible.sync="deleteConfirmDialog"
      :show-close="true"
      width="420px"
-      v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
    >
      <el-row>
        <el-checkbox
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@ -820,7 +820,7 @@ export default {
    bus.$off('change_panel_right_draw', this.changeRightDrawOpen)
    bus.$off('delete-condition', this.deleteCustomComponent)
    bus.$off('current-component-change', this.asideRefresh)
-    bus.$off('aside-set-title', this.asideSetTitle)
+    bus.$off('title-name', this.asideSetTitle)
    const elx = this.$refs.rightPanel
    elx && elx.remove()
  },
@ -851,16 +851,16 @@ export default {
      bus.$on('change_panel_right_draw', this.changeRightDrawOpen)
      bus.$on('delete-condition', this.deleteCustomComponent)
      bus.$on('current-component-change', this.asideRefresh)
-      bus.$on('aside-set-title', this.asideSetTitle)
+      bus.$on('title-name', this.asideSetTitle)
    },
    asideRefresh() {
      if (this.$refs['chartEditRef']) {
        this.$refs['chartEditRef'].resetChartData()
      }
    },
-    asideSetTitle(val) {
+    asideSetTitle(val, id) {
      if (this.$refs['chartEditRef']) {
-        this.$refs['chartEditRef'].setTitle(val)
+        this.$refs['chartEditRef'].setTitle(val, id)
      }
    },
    deleteCustomComponent(param) {
--- a/frontend/src/views/system/datasource/DsForm.vue
+++ b/frontend/src/views/system/datasource/DsForm.vue
@ -182,6 +182,7 @@
            >
              <deTextarea
                v-model="form.desc"
+                :maxlength="50"
                class="w100-textarea"
              />
            </el-form-item>
--- a/frontend/src/views/system/datasource/DsTree.vue
+++ b/frontend/src/views/system/datasource/DsTree.vue
@ -255,15 +255,15 @@
        v-dialogDrag
        :title="$t('datasource.create')"
        :visible.sync="dsTypeRelate"
-        width="1200px"
+        width="1005px"
        class="de-dialog-form none-scroll-bar"
        append-to-body
      >
-        <el-tabs v-model="tabActive">
-          <el-tab-pane
-            :label="$t('datasource.all')"
-            name="all"
-          />
+        <el-tabs
+          v-model="tabActive"
+          class="de-tabs"
+          @tab-click="handleClick"
+        >
          <el-tab-pane
            :label="$t('datasource.relational_database')"
            name="RDBMS"
@ -278,24 +278,36 @@
          />
        </el-tabs>
        <div class="db-container">
-          <div
-            v-for="(db, index) in databaseList"
-            :key="db.type"
-            class="db-card"
-            :class="[{ marLeft: index % 4 === 0 }]"
-            @click="addDb(db)"
-          >
-            <img
-              v-if="!db.isPlugin"
-              :src="require('../../../assets/datasource/' + db.type + '.jpg')"
-              alt=""
+          <template v-for="(list, idx) in databaseList">
+            <div
+              :key="nameMap[idx]"
+              :class="typeList[idx]"
+              class="name"
+            >{{ $t(`datasource.${nameMap[idx]}`) }}</div>
+            <div
+              :key="nameMap[idx] + 'cont'"
+              class="item-container"
            >
-            <img
-              v-if="db.isPlugin"
-              :src="`/api/pluginCommon/staticInfo/${db.type}/jpg`"
-            >
-            <p class="db-name">{{ db.name }}</p>
-          </div>
+              <div
+                v-for="(db, index) in list"
+                :key="db.type"
+                class="db-card"
+                :class="[{ marLeft: index % 5 === 0 }]"
+                @click="addDb(db)"
+              >
+                <img
+                  v-if="!db.isPlugin"
+                  :src="require('../../../assets/datasource/' + db.type + '.jpg')"
+                  alt=""
+                >
+                <img
+                  v-if="db.isPlugin"
+                  :src="`/api/pluginCommon/staticInfo/${db.type}/jpg`"
+                >
+                <p class="db-name">{{ db.name }}</p>
+              </div>
+            </div>
+          </template>
        </div>
      </el-dialog>
    </el-col>
@ -329,11 +341,14 @@ export default {
  },
  data() {
    return {
-      tabActive: 'all',
+      tabActive: 'RDBMS',
+      databaseList: [],
      currentNodeId: '',
      dsTypeRelate: false,
      expandedArray: [],
      tData: [],
+      nameMap: ['relational_database', 'non_relational_database', 'other'],
+      typeList: ['RDBMS', 'NORDBMS', 'OTHER'],
      treeLoading: false,
      dsTypes: [],
      dsTypesForDriver: [],
@ -386,15 +401,7 @@ export default {
    }
  },
  computed: {
-    ...mapGetters(['user']),
-    databaseList() {
-      if (this.tabActive === 'all') {
-        return this.dsTypes
-      }
-      return this.dsTypes.filter(
-        (ele) => ele.databaseClassification === this.tabActive
-      )
-    }
+    ...mapGetters(['user'])
  },
  watch: {
    key(val) {
@ -406,6 +413,9 @@ export default {
    this.datasourceTypes()
  },
  methods: {
+    handleClick() {
+      document.querySelector(`.${this.tabActive}`).scrollIntoView()
+    },
    createDriveOrDs() {
      if (this.showView === 'Driver') {
        this.addDriver()
@ -478,11 +488,17 @@ export default {
    datasourceTypes() {
      listDatasourceType().then((res) => {
        this.dsTypes = res.data
+        const databaseList = [[], [], []]
        this.dsTypes.forEach((item) => {
+          const index = this.typeList.findIndex(ele => ele === item.databaseClassification)
+          if (index !== -1) {
+            databaseList[index].push(item)
+          }
          if (item.isJdbc) {
            this.dsTypesForDriver.push(item)
          }
        })
+        this.databaseList = databaseList
      })
    },
    refreshType(datasource) {
@ -802,24 +818,38 @@ export default {
  width: 100%;
  max-height: 65vh;
  overflow-y: auto;
-  display: flex;
-  flex-wrap: wrap;
-  margin-top: -3px;
+  margin-top: 3px;
  position: relative;
  z-index: 10;
+
+  .name {
+    margin: 16px 0;
+    font-family: PingFang SC;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 24px;
+    color: var(--deTextPrimary, #1F2329);
+  }
+
+  .item-container {
+    display: flex;
+    width: 100%;
+    flex-wrap: wrap;
+  }
+
  .db-card {
-    height: 193px;
-    width: 270px;
+    height: 141px;
+    width: 177.6px;
    display: flex;
    flex-wrap: wrap;
    background: #ffffff;
    border: 1px solid #dee0e3;
    border-radius: 4px;
-    margin-bottom: 24px;
-    margin-left: 22px;
+    margin-bottom: 16px;
+    margin-left: 16px;
    img {
      width: 100%;
-      height: 154.58px;
+      height: 102px;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
    }
--- a/frontend/src/views/system/task/DatasetTaskList.vue
+++ b/frontend/src/views/system/task/DatasetTaskList.vue
@ -36,8 +36,8 @@
          icon="iconfont icon-icon-filter"
          @click="filterShow"
        >{{
-            $t("user.filter")
-          }}
+           $t("user.filter")
+         }}
          <template v-if="filterTexts.length">
            ({{ filterTexts.length }})
          </template>
@ -83,7 +83,7 @@
    >
      <span class="sum">{{ paginationConfig.total }}</span>
      <span class="title">{{ $t("user.result_one") }}</span>
-      <el-divider direction="vertical"/>
+      <el-divider direction="vertical" />
      <i
        v-if="showScroll"
        class="el-icon-arrow-left arrow-filter"
@ -96,9 +96,9 @@
          class="text"
        >
          {{ ele }} <i
-          class="el-icon-close"
-          @click="clearOneFilter(index)"
-        />
+            class="el-icon-close"
+            @click="clearOneFilter(index)"
+          />
        </p>
      </div>
      <i
@ -162,14 +162,14 @@
        >
          <template slot-scope="scope">
            <span v-if="scope.row.rate === 'SIMPLE'">{{
-                $t("dataset.execute_once")
-              }}</span>
+              $t("dataset.execute_once")
+            }}</span>
            <span v-if="scope.row.rate === 'CRON'">{{
-                $t("dataset.cron_config")
-              }}</span>
+              $t("dataset.cron_config")
+            }}</span>
            <span v-if="scope.row.rate === 'SIMPLE_CRON'">{{
-                $t("dataset.simple_cron")
-              }}</span>
+              $t("dataset.simple_cron")
+            }}</span>
          </template>
        </el-table-column>

@ -197,8 +197,8 @@
              v-if="scope.row.lastExecStatus"
              :class="[`de-${scope.row.lastExecStatus}-pre`, 'de-status']"
            >{{
-                $t(`dataset.${scope.row.lastExecStatus.toLocaleLowerCase()}`)
-              }}
+               $t(`dataset.${scope.row.lastExecStatus.toLocaleLowerCase()}`)
+             }}
              <svg-icon
                v-if="scope.row.lastExecStatus === 'Error'"
                style="cursor: pointer;"
@ -333,18 +333,18 @@
          secondary
          @click="show_error_massage = false"
        >{{
-            $t("dataset.close")
-          }}</deBtn>
+          $t("dataset.close")
+        }}</deBtn>
      </span>
    </el-dialog>
  </div>
 </template>

 <script>
-import {columnOptions} from './options'
-import {formatOrders} from '@/utils/index'
-import {datasetTaskList, post} from '@/api/dataset/dataset'
-import {hasDataPermission} from '@/utils/permission'
+import { columnOptions } from './options'
+import { formatOrders } from '@/utils/index'
+import { datasetTaskList, post } from '@/api/dataset/dataset'
+import { hasDataPermission } from '@/utils/permission'
 import GridTable from '@/components/gridTable/index.vue'
 import filterUser from './FilterUser.vue'
 import msgCfm from '@/components/msgCfm/index'
@ -353,7 +353,7 @@ import keyEnter from '@/components/msgCfm/keyEnter.js'

 export default {
  name: 'DatasetTaskList',
-  components: {GridTable, filterUser},
+  components: { GridTable, filterUser },
  mixins: [msgCfm, keyEnter],
  props: {
    transCondition: {
@ -396,7 +396,7 @@ export default {
    }
  },
  created() {
-    const {taskId, name} = this.transCondition
+    const { taskId, name } = this.transCondition
    if (taskId) {
      this.nickName = name
    }
@ -427,7 +427,7 @@ export default {
        document.querySelector('#resize-for-filter')
      )
    },
-    layoutResize: _.debounce(function () {
+    layoutResize: _.debounce(function() {
      this.getScrollStatus()
    }, 200),
    scrollPre() {
@ -501,7 +501,7 @@ export default {
      this.handleCurrentChange(1)
    },
    search(showLoading = true) {
-      const {taskId, name} = this.transCondition
+      const { taskId, name } = this.transCondition
      const param = {
        orders: formatOrders(this.orderConditions),
        conditions: [...this.cacheCondition]
@ -520,7 +520,7 @@ export default {
          field: 'dataset_table_task.id'
        })
      }
-      const {currentPage, pageSize} = this.paginationConfig
+      const { currentPage, pageSize } = this.paginationConfig
      datasetTaskList(currentPage, pageSize, param, showLoading).then(
        (response) => {
          const multipleSelection = this.multipleSelection.map(ele => ele.id)
@ -568,7 +568,7 @@ export default {
      })
    },
    changeTaskStatus(task) {
-      const {status} = task
+      const { status } = task
      if (!['Pending', 'Underway'].includes(status)) {
        return
      }
@ -613,7 +613,7 @@ export default {
    },
    selectDataset(row) {
      if (row) {
-        const {datasetName, id, tableId} = row
+        const { datasetName, id, tableId } = row
        this.$router.push({
          path: '/task-ds-form',
          query: {
@ -634,7 +634,7 @@ export default {
      )
    },
    disableExec(task) {
-      return ((task.status === 'Stopped' && task.rate !== 'SIMPLE') || task.status === 'Pending' || task.status ==='Exec' || !hasDataPermission('manage', task.privileges))
+      return ((task.status === 'Stopped' && task.rate !== 'SIMPLE') || task.status === 'Pending' || task.status === 'Exec' || !hasDataPermission('manage', task.privileges))
    },
    disableDelete(task) {
      return false