Merge pull request #406 from tapdata/develop

Develop

Author: cn-xufei

apps/daas/package.json

@@ -55,9 +55,9 @@
     "nodemon": "^2.0.7",
     "rollup-plugin-visualizer": "^5.14.0",
     "sass": "^1.86.2",
-    "unplugin-auto-import": "^0.17.6",
+    "unplugin-auto-import": "^19.2.0",
     "unplugin-icons": "^0.19.0",
-    "unplugin-vue-components": "^0.27.0",
+    "unplugin-vue-components": "^28.5.0",
     "vite": "^6.2.4",
     "vue-tsc": "^2.0.21"
   },

apps/daas/src/auto-imports.d.ts

@@ -3,6 +3,7 @@
 // @ts-nocheck
 // noinspection JSUnusedGlobalSymbols
 // Generated by unplugin-auto-import
+// biome-ignore lint: disable
 export {}
 declare global {
   const ElIcon: typeof import('element-plus/es')['ElIcon']

apps/daas/src/components.d.ts

@@ -34,7 +34,6 @@ declare module 'vue' {
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
-    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElHeader: typeof import('element-plus/es')['ElHeader']
@@ -65,6 +64,7 @@ declare module 'vue' {
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSelectLoading: typeof import('element-plus/es')['ElSelectLoading']
     ElSelectV2: typeof import('element-plus/es')['ElSelectV2']
     ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
     ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']

apps/daas/src/layouts/Header.vue

@@ -244,7 +244,11 @@ defineExpose({
 </script>
 
 <template>
-  <ElHeader v-if="!IS_IFRAME" class="flex align-center gap-4" height="64px">
+  <ElHeader
+    v-if="!IS_IFRAME"
+    class="flex align-center gap-4 layout-header"
+    height="64px"
+  >
     <a
       v-if="isOP"
       class="logo w-auto text-white flex align-center gap-2"
@@ -379,6 +383,11 @@ defineExpose({
 </template>
 
 <style lang="scss" scoped>
+.layout-header {
+  :deep(.el-button .el-icon:only-child) {
+    color: var(--icon-n1);
+  }
+}
 .divider {
   height: 1.8em;
   border-color: rgba(60, 60, 67, 0.12);

apps/daas/src/views/user/List.vue

@@ -3,7 +3,7 @@ import { roleApi, roleMappingsApi, usersApi } from '@tap/api'
 import { TablePage } from '@tap/business'
 
 import PageContainer from '@tap/business/src/components/PageContainer.vue'
-import { FilterBar } from '@tap/component'
+import { DownBoldOutlined, FilterBar } from '@tap/component'
 import dayjs from 'dayjs'
 import { escapeRegExp } from 'lodash-es'
 
@@ -12,6 +12,7 @@ export default {
     PageContainer,
     TablePage,
     FilterBar,
+    DownBoldOutlined,
   },
   data() {
     return {
@@ -344,14 +345,18 @@ export default {
 
     // 选择分类
     handleSelectTag() {
-      const tagList = {}
+      const tagList = []
+      const tagMap = {}
+
       this.multipleSelection.forEach((row) => {
-        if (row.listtags && row.listtags.length > 0) {
-          tagList[row.listtags[0].id] = {
-            value: row.listtags[0].value,
+        row.listtags.forEach((item) => {
+          if (!tagMap[item.id]) {
+            tagList.push(item)
+            tagMap[item.id] = true
           }
-        }
+        })
       })
+
       return tagList
     },
     // 分类设置保存
@@ -655,40 +660,6 @@ export default {
 <template>
   <PageContainer>
     <template #actions>
-      <el-button
-        v-show="multipleSelection.length > 0"
-        v-readonlybtn="'user_category_application'"
-        class="btn"
-        @click="$refs.table.showClassify(handleSelectTag())"
-      >
-        <span> {{ $t('public_button_bulk_tag') }}</span>
-      </el-button>
-      <el-dropdown
-        v-show="multipleSelection.length > 0"
-        v-readonlybtn="'user_edition'"
-        @command="handleCommand($event)"
-      >
-        <el-button class="btn btn-dropdowm">
-          <i class="iconfont icon-piliang back-btn-icon" />
-          <span> {{ $t('public_button_bulk_operation') }}</span>
-        </el-button>
-        <template #dropdown>
-          <el-dropdown-menu>
-            <el-dropdown-item v-if="$has('user_edition')" command="activated">
-              {{ $t('user_list_bulk_activation') }}
-            </el-dropdown-item>
-            <el-dropdown-item v-if="$has('user_edition')" command="rejected">{{
-              $t('user_list_bulk_freeze')
-            }}</el-dropdown-item>
-            <el-dropdown-item
-              v-if="$has('user_edition')"
-              command="notActivated"
-            >
-              {{ $t('user_list_bulk_check') }}
-            </el-dropdown-item>
-          </el-dropdown-menu>
-        </template>
-      </el-dropdown>
       <el-button
         v-readonlybtn="'new_model_creation'"
         class="btn btn-create"
@@ -702,16 +673,35 @@ export default {
     <TablePage
       ref="table"
       row-key="id"
-      class="user-list"
-      :classify="{ authority: 'user_category_management', types: ['user'] }"
+      class="user-table-page"
+      :classify="{
+        authority: 'user_category_management',
+        types: ['user'],
+        hideIcon: true,
+      }"
       :remote-method="getData"
       @selection-change="handleSelectionChange"
       @classify-submit="handleOperationClassify"
       @sort-change="handleSortTable"
     >
-      <template #nav>
-        <div class="tapNav">
-          <ElTabs v-model="activePanel" @tab-change="handleTapClick">
+      <template #nav="{ openClassify }">
+        <div class="tapNav position-relative">
+          <el-button
+            class="position-absolute z-10 start-0"
+            text
+            style="top: 4px"
+            @click="openClassify"
+          >
+            <template #icon>
+              <VIcon>expand-list</VIcon>
+            </template>
+          </el-button>
+
+          <ElTabs
+            v-model="activePanel"
+            style="--el-tabs-padding-left: 36px; --el-tabs-header-height: 36px"
+            @tab-change="handleTapClick"
+          >
             <ElTabPane
               v-for="item in muneList"
               :key="item.icon"
@@ -757,6 +747,45 @@ export default {
         </div>
       </template>
 
+      <template #multipleSelectionActions>
+        <el-button
+          v-readonlybtn="'user_category_application'"
+          class="btn"
+          @click="$refs.table.showClassify(handleSelectTag())"
+        >
+          <span> {{ $t('public_button_bulk_tag') }}</span>
+        </el-button>
+        <el-dropdown
+          v-readonlybtn="'user_edition'"
+          @command="handleCommand($event)"
+        >
+          <el-button class="btn btn-dropdowm">
+            <span> {{ $t('public_button_bulk_operation') }}</span>
+            <el-icon class="ml-1">
+              <DownBoldOutlined />
+            </el-icon>
+          </el-button>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item v-if="$has('user_edition')" command="activated">
+                {{ $t('user_list_bulk_activation') }}
+              </el-dropdown-item>
+              <el-dropdown-item
+                v-if="$has('user_edition')"
+                command="rejected"
+                >{{ $t('user_list_bulk_freeze') }}</el-dropdown-item
+              >
+              <el-dropdown-item
+                v-if="$has('user_edition')"
+                command="notActivated"
+              >
+                {{ $t('user_list_bulk_check') }}
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </template>
+
       <el-table-column type="selection" width="45" :reserve-selection="true" />
       <el-table-column
         :label="$t('user_list_user_name')"
@@ -1039,6 +1068,12 @@ export default {
 </template>
 
 <style lang="scss" scoped>
+.user-table-page {
+  :deep(.classification) {
+    margin-top: -6px !important;
+  }
+}
+
 .user-list-wrap {
   .tapNav {
     :deep(.el-tabs__header) {
@@ -1078,35 +1113,3 @@ export default {
   }
 }
 </style>
-
-<style lang="scss">
-.user-list-wrap {
-  .table-page-container {
-    .table-page-body {
-      .table-page-topbar {
-        padding-inline: 16px;
-        background-color: map.get($bgColor, white);
-      }
-      .el-table,
-      .el-pagination {
-        padding-inline: 16px;
-        box-sizing: border-box;
-        overflow: hidden;
-      }
-      .table-page-pagination {
-        margin-top: 0;
-        //padding: 5px 20px;
-        background-color: map.get($bgColor, white);
-        box-sizing: border-box;
-      }
-      .status {
-        padding: 5px 10px;
-        border-radius: 4px;
-      }
-    }
-  }
-  .classification {
-    margin-left: 16px;
-  }
-}
-</style>

apps/daas/src/vuex/modules/feature.js

@@ -1,5 +1,4 @@
 import { licensesApi } from '@tap/api'
-import { SettingList } from '@/router/menu'
 
 const MENU_FEATURE_MAP = {
   dataService: 'dataService',

package.json

@@ -66,7 +66,8 @@
       "vue-virtual-scroller": "2.0.0-beta.8"
     },
     "patchedDependencies": {
-      "@formily/element-plus@1.1.0": "patches/@formily__element-plus@1.1.0.patch"
+      "@formily/element-plus@1.1.0": "patches/@formily__element-plus@1.1.0.patch",
+      "@formily/vue@2.3.3": "patches/@formily__vue@2.3.3.patch"
     }
   },
   "prettier": "@sxzz/prettier-config"

packages/api/src/Connections.ts

@@ -1,5 +1,5 @@
-import Http from './Http'
 import { isPlainObj } from '@tap/shared'
+import Http from './Http'
 
 export default class Connections extends Http {
   constructor() {
@@ -8,10 +8,10 @@ export default class Connections extends Http {
   get(params = {}, filter) {
     if (Array.isArray(params)) {
       filter = typeof filter === 'object' ? JSON.stringify(filter) : filter
-      let qs = filter ? '?filter=' + encodeURIComponent(filter) : ''
-      return this.axios.get(this.url + '/' + params.join('/') + qs)
+      const qs = filter ? `?filter=${encodeURIComponent(filter)}` : ''
+      return this.axios.get(`${this.url}/${params.join('/')}${qs}`)
     } else if (typeof params === 'string') {
-      return this.axios.get(this.url + '/' + params, { params: filter })
+      return this.axios.get(`${this.url}/${params}`, { params: filter })
     }
 
     const config = { params }
@@ -23,12 +23,12 @@ export default class Connections extends Http {
   customQuery(id: string, params: { [key: string]: unknown }) {
     let url = `${this.url}/${id}` + '/customQuery?'
     for (const item in params) {
-      url += item + '=' + params[item] + '&'
+      url += `${item}=${params[item]}&`
     }
     return this.axios.get(url)
   }
   copy(id: string, params: unknown) {
-    return this.axios.post(this.url + '/' + id + '/copy', params)
+    return this.axios.post(`${this.url}/${id}/copy`, params)
   }
   batchUpdateListtags(params: unknown) {
     return this.axios.patch(`${this.url}/batchUpdateListtags`, params)
@@ -50,17 +50,25 @@ export default class Connections extends Http {
     return this.axios.patch(`${this.url}/${id}`, params)
   }
   findAll(filter: unknown) {
-    return this.axios.get(`${this.url}/findAll?filter=` + encodeURIComponent(JSON.stringify(filter)))
+    return this.axios.get(
+      `${this.url}/findAll?filter=${encodeURIComponent(
+        JSON.stringify(filter),
+      )}`,
+    )
   }
   listAll(filter: unknown) {
-    return this.axios.get(`${this.url}/listAll?filter=` + encodeURIComponent(JSON.stringify(filter)))
+    return this.axios.get(
+      `${this.url}/listAll?filter=${encodeURIComponent(
+        JSON.stringify(filter),
+      )}`,
+    )
   }
   checkConnectionTask(id: string) {
-    return this.axios.get(`${this.url}/task/` + id + '/10')
+    return this.axios.get(`${this.url}/task/${id}/10`)
   }
 
   getStats() {
-    return this.axios.get(this.url + '/stats')
+    return this.axios.get(`${this.url}/stats`)
   }
   create(params: unknown, urlParams: any) {
     let url = this.url
@@ -73,7 +81,13 @@ export default class Connections extends Http {
     return this.axios.get(`${this.url}/${connectionId}/heartbeat-task`)
   }
   usingDigginTaskByConnectionId(connectionId) {
-    return this.axios.get(`${this.url}/${connectionId}/usingDigginTaskByConnectionId`)
+    return this.axios.get(
+      `${this.url}/${connectionId}/usingDigginTaskByConnectionId`,
+    )
+  }
+
+  getDatabaseTypes() {
+    return this.axios.get(`${this.url}/databaseTypes`)
   }
 }