This is an automated email from the ASF dual-hosted git repository.
jinsongzhou pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/amoro.git
The following commit(s) were added to refs/heads/master by this push:
new 9d8255f5d [AMORO-2730]: replace component to antd-vue 4.x (#2773)
9d8255f5d is described below
commit 9d8255f5d98675617fa1417d17c0b2cc8b517d65
Author: xiaomo <[email protected]>
AuthorDate: Wed May 8 17:38:09 2024 +0800
[AMORO-2730]: replace component to antd-vue 4.x (#2773)
* [AMORO-2730]: replace tabs & tabPane & divider to antd-vue 4.x
* [AMORO-2730]: replace configProexport
PATH=/Users/ssa-user/Desktop/study/amoro/ams/dashboard/node_modules/.bin:/Users/ssa-user/.nvm/versions/node/v19.7.0/bin:/Users/ssa-user/Library/pnpm:/usr/local/bin:/usr/local/sbin:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bo
[...]
* [AMORO-2730]: replace select to antd-vue 4.x
* [AMORO-2730]: replace spin to antd-vue 4.x
* [AMORO-2730]: replace button to antd-vue 4.x
* [AMORO-2730]: rename dashboard
* [AMORO-2730]: rename dashboard
* [AMORO-2730]: rename dashboard
* [AMORO-2730]: replace table to antd-vue 4.x
* [AMORO-2730]: replace tooltip to antd-vue 4.x
* [AMORO-2730]: replace input group to antd-vue 4.x
* [AMORO-2730]: replace form to antd-vue 4.x
* [AMORO-2730]: replace breadcrumb & list & pagenation to antd-vue 4.x
* [AMORO-2730]: replace checkbox & row & upload to antd-vue 4.x
* [AMORO-2730]: replace col & collapse to antd-vue 4.x
* [AMORO-2730]: replace modal to antd-vue 4.x
* [AMORO-2730]: replace message to antd-vue 4.x
* [AMORO-2730]: fix the build error
---------
Co-authored-by: ZhouJinsong <[email protected]>
---
amoro-ams/amoro-ams-dashboard/src/App.vue | 12 +-
.../amoro-ams-dashboard/src/components/Sidebar.vue | 8 +-
.../amoro-ams-dashboard/src/components/Topbar.vue | 3 +-
.../src/components/VirtualRecycleScroller.vue | 3 +-
.../src/components/ant-design/index.ts | 77 -------
.../src/components/echarts/Chart.vue | 1 +
.../src/components/loading/loading.vue | 1 +
.../amoro-ams-dashboard/src/components/register.ts | 3 -
.../src/components/tables-sub-menu/CreateDB.vue | 9 +-
.../src/components/tables-sub-menu/TablesMenu.vue | 5 +-
amoro-ams/amoro-ams-dashboard/src/language/en.ts | 3 -
amoro-ams/amoro-ams-dashboard/src/views/404.vue | 6 +-
.../src/views/catalogs/Detail.vue | 227 ++++++++++-----------
.../src/views/catalogs/Properties.vue | 2 +
.../src/views/catalogs/index.vue | 3 +-
.../src/views/hive-details/components/Details.vue | 2 +
.../src/views/hive-details/components/ErrorMsg.vue | 5 +-
.../src/views/hive-details/components/Field.vue | 2 +
.../views/hive-details/components/Partition.vue | 2 +
.../views/hive-details/components/Properties.vue | 3 +-
.../src/views/hive-details/index.vue | 9 +-
.../src/views/hive-details/upgrade.vue | 2 +
.../amoro-ams-dashboard/src/views/login/index.vue | 3 +-
.../src/views/optimize/components/List.vue | 3 +-
.../src/views/optimize/components/ScaleOut.vue | 2 +
.../src/views/resource/components/GroupModal.vue | 3 +-
.../src/views/resource/components/List.vue | 14 +-
.../src/views/resource/components/ScaleOut.vue | 2 +
.../src/views/resource/index.vue | 15 +-
.../src/views/settings/index.vue | 3 +
.../src/views/tables/components/Details.vue | 2 +
.../src/views/tables/components/Files.vue | 3 +
.../src/views/tables/components/Operations.vue | 3 +-
.../src/views/tables/components/Optimizing.vue | 88 ++++----
.../src/views/tables/components/Selector.vue | 6 +-
.../src/views/tables/components/Snapshots.vue | 2 +
.../src/views/tables/create.vue | 4 +-
.../amoro-ams-dashboard/src/views/tables/index.vue | 34 ++-
.../src/views/terminal/index.vue | 6 +-
39 files changed, 280 insertions(+), 301 deletions(-)
diff --git a/amoro-ams/amoro-ams-dashboard/src/App.vue
b/amoro-ams/amoro-ams-dashboard/src/App.vue
index de2413a54..5cb89d6cf 100644
--- a/amoro-ams/amoro-ams-dashboard/src/App.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/App.vue
@@ -23,12 +23,18 @@
</template>
<script lang="ts" setup>
-import enUS from 'ant-design-vue-v3/es/locale/en_US'
-import zhCN from 'ant-design-vue-v3/es/locale/zh_CN'
-import { ref } from 'vue'
+import { ConfigProvider as AConfigProvider } from "ant-design-vue"
+import zhCN from 'ant-design-vue/es/locale/zh_CN'
+import enUS from 'ant-design-vue/es/locale/en_US'
+import dayjs from 'dayjs';
+import { ref, watch } from 'vue'
const locale = ref(enUS.locale)
+dayjs.locale('en')
+watch(locale, val => {
+ dayjs.locale(val);
+});
</script>
<style>
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
b/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
index 105ee4a1b..111b16b10 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
@@ -54,6 +54,8 @@ import { MenuFoldOutlined, MenuUnfoldOutlined } from
'@ant-design/icons-vue'
import { useI18n } from 'vue-i18n'
import { getQueryString } from '@/utils'
+import { Menu as AMenu, MenuItem as AMenuItem, Button as AButton } from
'ant-design-vue'
+
interface MenuItem {
key: string
title: string
@@ -65,7 +67,11 @@ export default defineComponent({
components: {
MenuFoldOutlined,
MenuUnfoldOutlined,
- TableMenu
+ TableMenu,
+
+ AMenu,
+ AMenuItem,
+ AButton
},
setup () {
const { t } = useI18n()
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
b/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
index be8036352..8b5579a58 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
@@ -39,12 +39,13 @@
import { defineComponent, onMounted, reactive } from 'vue'
import { QuestionCircleOutlined, LogoutOutlined } from '@ant-design/icons-vue'
-import { Modal } from 'ant-design-vue-v3'
import { useI18n } from 'vue-i18n'
import useStore from '@/store'
import { getVersionInfo } from '@/services/global.service'
import loginService from '@/services/login.service'
+import { Modal, Button as AButton, Tooltip as ATooltip } from 'ant-design-vue'
+
interface IVersion {
version: string
commitTime: string
diff --git
a/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
b/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
index 4e6eb8dcd..269b1a8a2 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
@@ -41,7 +41,8 @@ import { defineComponent } from 'vue'
import { RecycleScroller } from 'vue-virtual-scroller'
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
import { IMap, tableTypeIconMap } from '@/types/common.type'
-import { Empty } from 'ant-design-vue-v3'
+
+import { Empty as AEmpty } from 'ant-design-vue'
export default defineComponent ({
components: {
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/ant-design/index.ts
b/amoro-ams/amoro-ams-dashboard/src/components/ant-design/index.ts
deleted file mode 100644
index 7db9074e0..000000000
--- a/amoro-ams/amoro-ams-dashboard/src/components/ant-design/index.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { App } from 'vue'
-import {
- ConfigProvider,
- Select,
- Menu,
- Button,
- Table,
- Tooltip,
- Input,
- Modal,
- Form,
- InputNumber,
- Pagination,
- Spin,
- Divider,
- Tabs,
- List,
- Breadcrumb,
- Checkbox,
- AutoComplete,
- Empty,
- Upload,
- Radio,
- Collapse,
- Row,
- Col,
- Dropdown
-} from 'ant-design-vue-v3'
-
-const compontens = [
- ConfigProvider,
- Spin,
- Divider,
- Tabs,
- InputNumber,
- Select,
- Menu,
- Button,
- Tooltip,
- Table,
- Input,
- Modal,
- Form,
- Pagination,
- List,
- Breadcrumb,
- Checkbox,
- AutoComplete,
- Empty,
- Upload,
- Radio,
- Collapse,
- Row,
- Col,
- Dropdown
-]
-export default function (app: App): void {
- compontens.forEach(app.use)
-}
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/echarts/Chart.vue
b/amoro-ams/amoro-ams-dashboard/src/components/echarts/Chart.vue
index 477d017a6..7227ed4f9 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/echarts/Chart.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/echarts/Chart.vue
@@ -22,6 +22,7 @@
</a-spin>
</template>
<script lang="ts">
+import { Spin as ASpin } from 'ant-design-vue'
import { defineComponent, onMounted, onBeforeUnmount, watch, ref, toRefs,
reactive } from 'vue'
import echarts from './index'
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/loading/loading.vue
b/amoro-ams/amoro-ams-dashboard/src/components/loading/loading.vue
index 8d4b93e28..c67fe1563 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/loading/loading.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/loading/loading.vue
@@ -18,6 +18,7 @@
<script setup lang="ts">
import { onBeforeUnmount, ref } from 'vue'
+import { Spin as ASpin } from 'ant-design-vue'
// name: 'ULoading',
// props: {
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/register.ts
b/amoro-ams/amoro-ams-dashboard/src/components/register.ts
index 76dd076e8..25f19ddcf 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/register.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/components/register.ts
@@ -16,12 +16,9 @@
* limitations under the License.
*/
-import AntDesign from './ant-design'
import { App } from 'vue'
import ULoading from './loading'
export default function Register (app: App<Element>): void {
- // Global registration ant-design-vue components
- app.use(AntDesign)
app.use(ULoading)
}
diff --git
a/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/CreateDB.vue
b/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/CreateDB.vue
index f115154e9..fd207e8d0 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/CreateDB.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/CreateDB.vue
@@ -17,7 +17,7 @@
/-->
<template>
- <a-modal :visible="visible" :title="$t('createDatabase')" @ok="handleOk"
@cancel="handleCancel">
+ <a-modal v-model:open="visible" :title="$t('createDatabase')" @ok="handleOk"
@cancel="handleCancel">
<a-form ref="formRef" :model="formState" class="label-120">
<a-form-item name="catalog" :label="$t('catalog')" :rules="[{ required:
true, message: `${placeholder.selectClPh}` }]">
<a-select
@@ -33,6 +33,8 @@
</a-modal>
</template>
<script lang="ts">
+import { Modal as AModal, Select as ASelect, Input as AInput, Form as AForm,
FormItem as AFormItem } from 'ant-design-vue'
+
import { defineComponent, reactive, ref } from 'vue'
import { usePlaceholder } from '@/hooks/usePlaceholder'
@@ -42,6 +44,9 @@ interface FormState {
}
export default defineComponent({
+ components: {
+ ASelect
+ },
props: {
visible: {
type: Boolean,
@@ -53,7 +58,7 @@ export default defineComponent({
}
},
emits: ['cancel'],
- setup(props, { emit }) {
+ setup(_, { emit }) {
const placeholder = reactive(usePlaceholder())
const formRef = ref()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/TablesMenu.vue
b/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/TablesMenu.vue
index 82acf24bc..8fb28b0a1 100644
---
a/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/TablesMenu.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/components/tables-sub-menu/TablesMenu.vue
@@ -86,6 +86,8 @@
</template>
<script lang="ts">
+import { Select as ASelect, InputSearch as AInputSearch } from 'ant-design-vue'
+
import { defineComponent, onBeforeMount, reactive, toRefs, computed } from
'vue'
import {
// PlusOutlined,
@@ -117,7 +119,8 @@ export default defineComponent({
SearchOutlined,
CloseCircleOutlined,
CreateDBModal,
- virtualRecycleScroller
+ virtualRecycleScroller,
+ ASelect
},
emits: ['goCreatePage'],
setup(_, { emit }) {
diff --git a/amoro-ams/amoro-ams-dashboard/src/language/en.ts
b/amoro-ams/amoro-ams-dashboard/src/language/en.ts
index 790f57525..2596f0931 100644
--- a/amoro-ams/amoro-ams-dashboard/src/language/en.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/language/en.ts
@@ -34,7 +34,6 @@ export default {
logout: 'Logout',
logoutModalTitle: 'Log out of the ams?',
order: 'Order',
- token: 'Token',
cluster: 'Cluster',
database: 'Database | Databases',
table: 'Table | Tables',
@@ -84,7 +83,6 @@ export default {
fileContent: 'File Content',
startTime: 'Start Time',
finishTime: 'Finish Time',
- touchTime: 'Touch Time',
duration: 'Duration',
optimizeType: 'Optimize Type',
parallelism: 'Parallelism',
@@ -96,7 +94,6 @@ export default {
operationDetails: 'Operation Details',
copy: 'Copy',
optimizer: 'Optimizer',
- optimizerId: 'Optimizer Id',
optimizers: 'Optimizers',
container: 'Container',
status: 'Status',
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/404.vue
b/amoro-ams/amoro-ams-dashboard/src/views/404.vue
index 353e52652..9f953d0aa 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/404.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/404.vue
@@ -30,9 +30,13 @@ limitations under the License.
<script lang="ts">
import { defineComponent } from 'vue'
+import { Button as AButton } from 'ant-design-vue'
export default defineComponent({
- name: 'Page404'
+ name: 'Page404',
+ components: {
+ AButton
+ }
})
</script>
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Detail.vue
b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Detail.vue
index 7576e084e..daf514490 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Detail.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Detail.vue
@@ -1,4 +1,3 @@
-
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
@@ -23,144 +22,119 @@ limitations under the License.
<div class="content-wrap">
<a-form ref="formRef" :model="formState" class="catalog-form">
<a-form-item>
- <p class="header">{{$t('basic')}}</p>
+ <p class="header">{{ $t('basic') }}</p>
</a-form-item>
- <a-form-item :label="$t('name')" :name="['catalog', 'name']"
:rules="[{ required: isEdit && isNewCatalog, validator: validatorName }]">
+ <a-form-item :label="$t('name')" :name="['catalog', 'name']"
+ :rules="[{ required: isEdit && isNewCatalog, validator:
validatorName }]">
<a-input v-if="isEdit && isNewCatalog"
v-model:value="formState.catalog.name" />
- <span v-else class="config-value">{{formState.catalog.name}}</span>
+ <span v-else class="config-value">{{ formState.catalog.name
}}</span>
</a-form-item>
<a-form-item :label="$t('type')" :name="['catalog', 'typeshow']">
- <a-select
- v-if="isEdit && isNewCatalog"
- v-model:value="formState.catalog.typeshow"
- :options="typwShowOptions"
- :placeholder="placeholder.selectPh"
- @change="changeTypeShow"
- />
- <span v-else>{{formState.catalog.typeshow}}</span>
+ <a-select v-if="isEdit && isNewCatalog"
v-model:value="formState.catalog.typeshow"
+ :options="typwShowOptions" :placeholder="placeholder.selectPh"
@change="changeTypeShow" />
+ <span v-else>{{ formState.catalog.typeshow }}</span>
</a-form-item>
- <a-form-item :label="$t('metastore')"
v-if="formState.catalog.typeshow === typeShowMap['External Catalog']"
:name="['catalog', 'type']" :rules="[{ required: isEdit && isNewCatalog }]">
- <a-select
- v-if="isEdit && isNewCatalog"
- v-model:value="formState.catalog.type"
- :options="catalogTypeOps"
- :placeholder="placeholder.selectPh"
- @change="changeMetastore"
- />
- <span v-else>{{metastoreType}}</span>
+ <a-form-item :label="$t('metastore')"
v-if="formState.catalog.typeshow === typeShowMap['External Catalog']"
+ :name="['catalog', 'type']" :rules="[{ required: isEdit &&
isNewCatalog }]">
+ <a-select v-if="isEdit && isNewCatalog"
v-model:value="formState.catalog.type" :options="catalogTypeOps"
+ :placeholder="placeholder.selectPh" @change="changeMetastore" />
+ <span v-else>{{ metastoreType }}</span>
</a-form-item>
- <a-form-item :label="$t('tableFormat')" :name="['tableFormatList']"
:rules="[{ required: isEdit && isNewCatalog }]">
- <a-checkbox-group :disabled="!isEdit || !isNewCatalog"
v-model:value="formState.tableFormatList" @change="changeTableFormat">
- <a-checkbox v-for="item in formatOptions" :key="item"
:value="item">{{tableFormatText[item]}}</a-checkbox>
+ <a-form-item :label="$t('tableFormat')" :name="['tableFormatList']"
+ :rules="[{ required: isEdit && isNewCatalog }]">
+ <a-checkbox-group :disabled="!isEdit || !isNewCatalog"
v-model:value="formState.tableFormatList"
+ @change="changeTableFormat">
+ <a-checkbox v-for="item in formatOptions" :key="item"
:value="item">{{ tableFormatText[item] }}</a-checkbox>
</a-checkbox-group>
</a-form-item>
- <a-form-item :label="$t('optimizerGroup')" :name="['catalog',
'optimizerGroup']" :rules="[{ required: isEdit }]">
- <a-select
- v-if="isEdit"
- v-model:value="formState.catalog.optimizerGroup"
- :options="optimizerGroupList"
- :placeholder="placeholder.selectPh"
- />
- <span v-else>{{formState.catalog.optimizerGroup}}</span>
+ <a-form-item :label="$t('optimizerGroup')" :name="['catalog',
'optimizerGroup']"
+ :rules="[{ required: isEdit }]">
+ <a-select v-if="isEdit"
v-model:value="formState.catalog.optimizerGroup" :options="optimizerGroupList"
+ :placeholder="placeholder.selectPh" />
+ <span v-else>{{ formState.catalog.optimizerGroup }}</span>
</a-form-item>
<a-form-item>
- <p class="header">{{$t('storageConfigName')}}</p>
+ <p class="header">{{ $t('storageConfigName') }}</p>
</a-form-item>
<a-form-item label="Type" :name="['storageConfig', 'storage.type']"
:rules="[{ required: isEdit }]">
- <a-select
- v-if="isEdit"
- v-model:value="formState.storageConfig['storage.type']"
- :placeholder="placeholder.selectPh"
- :options="storageConfigTypeOps"
- />
- <span v-else
class="config-value">{{formState.storageConfig['storage.type']}}</span>
+ <a-select v-if="isEdit"
v-model:value="formState.storageConfig['storage.type']"
+ :placeholder="placeholder.selectPh"
:options="storageConfigTypeOps" />
+ <span v-else class="config-value">{{
formState.storageConfig['storage.type'] }}</span>
</a-form-item>
- <a-form-item v-if="formState.storageConfig['storage.type'] === 'S3'"
label="Endpoint" :name="['storageConfig', 'storage.s3.endpoint']" :rules="[{
required: false }]">
+ <a-form-item v-if="formState.storageConfig['storage.type'] === 'S3'"
label="Endpoint"
+ :name="['storageConfig', 'storage.s3.endpoint']" :rules="[{
required: false }]">
<a-input v-if="isEdit"
v-model:value="formState.storageConfig['storage.s3.endpoint']" />
- <span v-else
class="config-value">{{formState.storageConfig['storage.s3.endpoint']}}</span>
+ <span v-else class="config-value">{{
formState.storageConfig['storage.s3.endpoint'] }}</span>
</a-form-item>
- <a-form-item v-if="formState.storageConfig['storage.type'] === 'S3'"
label="Region" :name="['storageConfig', 'storage.s3.region']" :rules="[{
required: false }]">
+ <a-form-item v-if="formState.storageConfig['storage.type'] === 'S3'"
label="Region"
+ :name="['storageConfig', 'storage.s3.region']" :rules="[{
required: false }]">
<a-input v-if="isEdit"
v-model:value="formState.storageConfig['storage.s3.region']" />
- <span v-else
class="config-value">{{formState.storageConfig['storage.s3.region']}}</span>
+ <span v-else class="config-value">{{
formState.storageConfig['storage.s3.region'] }}</span>
</a-form-item>
<div v-if="formState.storageConfig['storage.type'] === 'Hadoop'">
- <a-form-item
- v-for="config in formState.storageConfigArray"
- :key="config.label"
- :label="config.label"
+ <a-form-item v-for="config in formState.storageConfigArray"
:key="config.label" :label="config.label"
class="g-flex-ac">
- <a-upload
- v-if="isEdit"
- v-model:file-list="config.fileList"
- name="file"
- accept=".xml"
- :showUploadList="false"
- :action="uploadUrl"
- :disabled="config.uploadLoading"
- @change="(args) => uploadFile(args, config, 'STORAGE')"
- >
- <a-button type="primary" ghost :loading="config.uploadLoading"
class="g-mr-12">{{ $t('upload') }}</a-button>
+ <a-upload v-if="isEdit" v-model:file-list="config.fileList"
name="file" accept=".xml"
+ :showUploadList="false" :action="uploadUrl"
:disabled="config.uploadLoading"
+ @change="(args) => uploadFile(args, config, 'STORAGE')">
+ <a-button type="primary" ghost :loading="config.uploadLoading"
class="g-mr-12">{{ $t('upload')
+ }}</a-button>
</a-upload>
- <span v-if="config.isSuccess || config.fileName"
class="config-value" :class="{ 'view-active': !!config.fileUrl }"
@click="viewFileDetail(config.fileUrl)">{{ config.fileName }}</span>
+ <span v-if="config.isSuccess || config.fileName"
class="config-value"
+ :class="{ 'view-active': !!config.fileUrl }"
@click="viewFileDetail(config.fileUrl)">{{ config.fileName
+ }}</span>
</a-form-item>
</div>
<a-form-item>
- <p class="header">{{$t('authenticationConfig')}}</p>
+ <p class="header">{{ $t('authenticationConfig') }}</p>
</a-form-item>
<a-form-item label="Type" :name="['authConfig', 'auth.type']"
:rules="[{ required: isEdit }]">
- <a-select
- v-if="isEdit"
- v-model:value="formState.authConfig['auth.type']"
- :placeholder="placeholder.selectPh"
- :options="authTypeOptions"
- />
- <span v-else
class="config-value">{{formState.authConfig['auth.type']}}</span>
+ <a-select v-if="isEdit"
v-model:value="formState.authConfig['auth.type']"
+ :placeholder="placeholder.selectPh" :options="authTypeOptions" />
+ <span v-else class="config-value">{{
formState.authConfig['auth.type'] }}</span>
</a-form-item>
- <a-form-item v-if="formState.authConfig['auth.type'] === 'SIMPLE'"
label="Hadoop Username" :name="['authConfig', 'auth.simple.hadoop_username']"
:rules="[{ required: isEdit }]">
+ <a-form-item v-if="formState.authConfig['auth.type'] === 'SIMPLE'"
label="Hadoop Username"
+ :name="['authConfig', 'auth.simple.hadoop_username']" :rules="[{
required: isEdit }]">
<a-input v-if="isEdit"
v-model:value="formState.authConfig['auth.simple.hadoop_username']" />
- <span v-else
class="config-value">{{formState.authConfig['auth.simple.hadoop_username']}}</span>
+ <span v-else class="config-value">{{
formState.authConfig['auth.simple.hadoop_username'] }}</span>
</a-form-item>
- <a-form-item v-if="formState.authConfig['auth.type'] === 'KERBEROS'"
label="Kerberos Principal" :name="['authConfig', 'auth.kerberos.principal']"
:rules="[{ required: isEdit }]">
+ <a-form-item v-if="formState.authConfig['auth.type'] === 'KERBEROS'"
label="Kerberos Principal"
+ :name="['authConfig', 'auth.kerberos.principal']" :rules="[{
required: isEdit }]">
<a-input v-if="isEdit"
v-model:value="formState.authConfig['auth.kerberos.principal']" />
- <span v-else
class="config-value">{{formState.authConfig['auth.kerberos.principal']}}</span>
+ <span v-else class="config-value">{{
formState.authConfig['auth.kerberos.principal'] }}</span>
</a-form-item>
<div v-if="formState.authConfig['auth.type'] === 'KERBEROS'">
- <a-form-item
- v-for="config in formState.authConfigArray"
- :key="config.label"
- :label="config.label"
+ <a-form-item v-for="config in formState.authConfigArray"
:key="config.label" :label="config.label"
class="g-flex-ac">
- <a-upload
- v-if="isEdit"
- v-model:file-list="config.fileList"
- name="file"
- :accept="config.key === 'auth.kerberos.keytab' ? '.keytab' :
'.conf'"
- :showUploadList="false"
- :action="uploadUrl"
- :disabled="config.uploadLoading"
- @change="(args) => uploadFile(args, config)"
- >
- <a-button type="primary" ghost :loading="config.uploadLoading"
class="g-mr-12">{{$t('upload')}}</a-button>
+ <a-upload v-if="isEdit" v-model:file-list="config.fileList"
name="file"
+ :accept="config.key === 'auth.kerberos.keytab' ? '.keytab' :
'.conf'" :showUploadList="false"
+ :action="uploadUrl" :disabled="config.uploadLoading"
@change="(args) => uploadFile(args, config)">
+ <a-button type="primary" ghost :loading="config.uploadLoading"
+ class="g-mr-12">{{ $t('upload') }}</a-button>
</a-upload>
- <span v-if="config.isSuccess || config.fileName"
class="config-value auth-filename" :class="{'view-active': !!config.fileUrl}"
@click="viewFileDetail(config.fileUrl)"
:title="config.fileName">{{config.fileName}}</span>
+ <span v-if="config.isSuccess || config.fileName"
class="config-value auth-filename"
+ :class="{ 'view-active': !!config.fileUrl }"
@click="viewFileDetail(config.fileUrl)"
+ :title="config.fileName">{{ config.fileName }}</span>
</a-form-item>
</div>
- <a-form-item v-if="formState.authConfig['auth.type'] === 'AK/SK'"
label="Access Key" :name="['authConfig', 'auth.ak_sk.access_key']" :rules="[{
required: isEdit }]">
+ <a-form-item v-if="formState.authConfig['auth.type'] === 'AK/SK'"
label="Access Key"
+ :name="['authConfig', 'auth.ak_sk.access_key']" :rules="[{
required: isEdit }]">
<a-input v-if="isEdit"
v-model:value="formState.authConfig['auth.ak_sk.access_key']" />
- <span v-else
class="config-value">{{formState.authConfig['auth.ak_sk.access_key']}}</span>
+ <span v-else class="config-value">{{
formState.authConfig['auth.ak_sk.access_key'] }}</span>
</a-form-item>
- <a-form-item v-if="formState.authConfig['auth.type'] === 'AK/SK'"
label="Secret Key" :name="['authConfig', 'auth.ak_sk.secret_key']" :rules="[{
required: isEdit }]">
+ <a-form-item v-if="formState.authConfig['auth.type'] === 'AK/SK'"
label="Secret Key"
+ :name="['authConfig', 'auth.ak_sk.secret_key']" :rules="[{
required: isEdit }]">
<a-input v-if="isEdit"
v-model:value="formState.authConfig['auth.ak_sk.secret_key']" />
- <span v-else
class="config-value">{{formState.authConfig['auth.ak_sk.secret_key']}}</span>
+ <span v-else class="config-value">{{
formState.authConfig['auth.ak_sk.secret_key'] }}</span>
</a-form-item>
<a-form-item>
- <p class="header">{{$t('properties')}}</p>
+ <p class="header">{{ $t('properties') }}</p>
</a-form-item>
<a-form-item>
<Properties :propertiesObj="formState.properties" :isEdit="isEdit"
ref="propertiesRef" />
</a-form-item>
<a-form-item>
- <p class="header">{{$t('tableProperties')}}</p>
+ <p class="header">{{ $t('tableProperties') }}</p>
</a-form-item>
<a-form-item>
<Properties :propertiesObj="formState.tableProperties"
:isEdit="isEdit" ref="tablePropertiesRef" />
@@ -169,12 +143,12 @@ limitations under the License.
</div>
</div>
<div v-if="isEdit" class="footer-btn">
- <a-button type="primary" @click="handleSave" class="save-btn
g-mr-12">{{$t('save')}}</a-button>
- <a-button @click="handleCancle">{{$t('cancel')}}</a-button>
+ <a-button type="primary" @click="handleSave" class="save-btn g-mr-12">{{
$t('save') }}</a-button>
+ <a-button @click="handleCancle">{{ $t('cancel') }}</a-button>
</div>
<div v-if="!isEdit" class="footer-btn">
- <a-button type="primary" @click="handleEdit" class="edit-btn
g-mr-12">{{$t('edit')}}</a-button>
- <a-button @click="handleRemove"
class="remove-btn">{{$t('remove')}}</a-button>
+ <a-button type="primary" @click="handleEdit" class="edit-btn g-mr-12">{{
$t('edit') }}</a-button>
+ <a-button @click="handleRemove" class="remove-btn">{{ $t('remove')
}}</a-button>
</div>
<u-loading v-if="loading" />
</div>
@@ -184,13 +158,26 @@ limitations under the License.
import { computed, onMounted, reactive, ref, watch } from 'vue'
import { getCatalogsTypes, getCatalogsSetting, saveCatalogsSetting,
checkCatalogStatus, delCatalog } from '@/services/setting.services'
import { ILableAndValue, ICatalogItem, IMap, IIOptimizeGroupItem } from
'@/types/common.type'
-import { Modal, message, UploadChangeParam } from 'ant-design-vue-v3'
import { useI18n } from 'vue-i18n'
import Properties from './Properties.vue'
import { usePlaceholder } from '@/hooks/usePlaceholder'
import { useRoute } from 'vue-router'
import { getResourceGroupsListAPI } from '@/services/optimize.service'
+import {
+ UploadChangeParam,
+ message,
+ Modal,
+ Select as ASelect,
+ Button as AButton,
+ Input as AInput,
+ Form as AForm,
+ FormItem as AFormItem,
+ Checkbox as ACheckbox,
+ CheckboxGroup as ACheckboxGroup,
+ Upload as AUpload
+} from 'ant-design-vue'
+
interface IStorageConfigItem {
label: string
value: string
@@ -218,8 +205,8 @@ const typeShowMap = { 'Internal Catalog': 'Internal
Catalog', 'External Catalog'
const props = defineProps<{ isEdit: boolean }>()
const emit = defineEmits<{
- (e: 'updateEdit', val: boolean, catalog?: ICatalogItem): void,
- (e: 'updateCatalogs'): void
+ (e: 'updateEdit', val: boolean, catalog?: ICatalogItem): void,
+ (e: 'updateCatalogs'): void
}>()
const { t } = useI18n()
@@ -242,9 +229,6 @@ const isNewCatalog = computed(() => {
const isHiveMetastore = computed(() => {
return formState.catalog.type === 'hive'
})
-const isArcticMetastore = computed(() => {
- return formState.catalog.type === 'ams'
-})
const loading = ref<boolean>(false)
const formRef = ref()
const propertiesRef = ref()
@@ -263,7 +247,7 @@ const tableFormatText = {
[tableFormatMap.MIXED_ICEBERG]: 'Mixed Iceberg',
[tableFormatMap.PAIMON]: 'Paimon'
}
-const storeSupportFormat: {[prop:string]: string[]} = {
+const storeSupportFormat: { [prop: string]: string[] } = {
ams: [tableFormatMap.MIXED_ICEBERG, tableFormatMap.ICEBERG],
hive: [tableFormatMap.MIXED_HIVE, tableFormatMap.MIXED_ICEBERG,
tableFormatMap.ICEBERG, tableFormatMap.PAIMON],
hadoop: [tableFormatMap.MIXED_ICEBERG, tableFormatMap.ICEBERG,
tableFormatMap.PAIMON],
@@ -290,7 +274,7 @@ const typwShowOptions = ref([
{ label: typeShowMap['Internal Catalog'], value: typeShowMap['Internal
Catalog'] },
{ label: typeShowMap['External Catalog'], value: typeShowMap['External
Catalog'] }
])
-const formState:FormState = reactive({
+const formState: FormState = reactive({
catalog: {
name: '',
type: 'ams',
@@ -344,16 +328,16 @@ watch(() => route.query,
(value) => {
value && initData()
}, {
- immediate: true,
- deep: true
- }
+ immediate: true,
+ deep: true
+}
)
const catalogTypeOps = reactive<ILableAndValue[]>([])
const optimizerGroupList = ref<ILableAndValue[]>([])
function initData() {
getConfigInfo()
}
-const getOptimizerGroupList = async() => {
+const getOptimizerGroupList = async () => {
const res = await getResourceGroupsListAPI()
const list = (res || []).map((item: IIOptimizeGroupItem) => ({ lable:
item.resourceGroup.name, value: item.resourceGroup.name }))
optimizerGroupList.value = list
@@ -610,7 +594,7 @@ function getFileIdParams() {
function handleSave() {
formRef.value
.validateFields()
- .then(async() => {
+ .then(async () => {
const { catalog, tableFormatList, storageConfig, authConfig } = formState
const properties = await propertiesRef.value.getProperties()
const tableProperties = await tablePropertiesRef.value.getProperties()
@@ -641,7 +625,7 @@ function handleSave() {
formRef.value.resetFields()
}).catch(() => {
message.error(`${t('save')} ${t('failed')}`)
- }).finally (() => {
+ }).finally(() => {
loading.value = false
})
})
@@ -656,7 +640,7 @@ function handleCancle() {
async function deleteCatalogModal() {
Modal.confirm({
title: t('deleteCatalogModalTitle'),
- onOk: async() => {
+ onOk: async () => {
await delCatalog(formState.catalog.name)
message.success(`${t('remove')} ${t('success')}`)
emit('updateEdit', false, {})
@@ -709,38 +693,47 @@ onMounted(() => {
flex-direction: column;
border: 1px solid #e8e8f0;
border-left: 0;
+
.detail-content-wrap {
height: 100%;
padding-right: 200px;
overflow: auto;
}
+
.content-wrap {
display: flex;
flex: 1;
overflow: auto;
flex-direction: column;
+
.ant-form-item {
margin-bottom: 8px;
}
+
:deep(.ant-form-item-label) {
- > label {
+ >label {
word-break: break-all;
white-space: pre-wrap;
}
+
width: 280px;
margin-right: 16px;
}
+
.header {
font-size: 16px;
font-weight: 600;
color: #102048;
}
+
.view-active {
color: @primary-color;
cursor: pointer;
}
+
.config-value {
word-break: break-all;
+
&.auth-filename {
max-width: 72%;
overflow: hidden;
@@ -752,14 +745,18 @@ onMounted(() => {
}
}
}
+
.footer-btn {
height: 44px;
flex-shrink: 0;
padding-top: 12px;
background-color: #fff;
- .edit-btn, .save-btn {
+
+ .edit-btn,
+ .save-btn {
min-width: 60px;
}
+
.remove-btn {
&:hover {
background-color: #ff4d4f;
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
index 0c5509cc6..f280b71ed 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
@@ -76,6 +76,8 @@ import { getUUid } from '@/utils/index'
import { usePlaceholder } from '@/hooks/usePlaceholder'
import { useI18n } from 'vue-i18n'
+import { Button as AButton, Table as ATable, Input as AInput, Form as AForm,
FormItem as AFormItem } from 'ant-design-vue'
+
const { t } = useI18n()
const props = defineProps<{ propertiesObj: IMap<string>, isEdit: boolean }>()
const propertiesColumns = shallowReactive([
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/index.vue
index f77489020..60aa38850 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/index.vue
@@ -40,10 +40,11 @@ import { onMounted, reactive, ref } from 'vue'
import { ICatalogItem } from '@/types/common.type'
import { getCatalogList } from '@/services/table.service'
import Detail from './Detail.vue'
-import { Modal, Empty } from 'ant-design-vue-v3'
import { useI18n } from 'vue-i18n'
import { onBeforeRouteLeave, useRoute, useRouter } from 'vue-router'
+import { Modal, Button as AButton, Empty as AEmpty } from 'ant-design-vue'
+
const { t } = useI18n()
const router = useRouter()
const route = useRoute()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Details.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Details.vue
index e374593a9..67d5ff3b7 100644
---
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Details.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Details.vue
@@ -47,6 +47,8 @@ import { shallowReactive } from 'vue'
import { useI18n } from 'vue-i18n'
import { IColumns, DetailColumnItem } from '@/types/common.type'
+import { Table as ATable } from 'ant-design-vue'
+
const { t } = useI18n()
const primaryColumns: IColumns[] = shallowReactive([
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
index c8d03e994..adad523f3 100644
---
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/ErrorMsg.vue
@@ -19,7 +19,7 @@ limitations under the License.
<template>
<a-modal
- :visible="true"
+ v-model:open="open"
:width="560"
:title="`${$t('errorMessage')}`"
:footer="null"
@@ -30,7 +30,10 @@ limitations under the License.
</a-modal>
</template>
<script lang="ts" setup>
+import { Modal as AModal } from "ant-design-vue";
+import { ref } from "vue";
+const open = ref(true)
const props = defineProps<{ msg: string }>()
const emit = defineEmits<{
(e: 'cancle'): void
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Field.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Field.vue
index 58be2b164..923f69e43 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Field.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Field.vue
@@ -39,6 +39,8 @@ import { shallowReactive } from 'vue'
import { useI18n } from 'vue-i18n'
import { DetailColumnItem } from '@/types/common.type'
+import { Table as ATable, Checkbox as ACheckbox } from 'ant-design-vue'
+
const { t } = useI18n()
const props = defineProps<{ fields: DetailColumnItem[], loading: boolean }>()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Partition.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Partition.vue
index 4ce6ae263..15379dfa6 100644
---
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Partition.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Partition.vue
@@ -34,6 +34,8 @@ import { shallowReactive } from 'vue'
import { useI18n } from 'vue-i18n'
import { DetailColumnItem } from '@/types/common.type'
+import { Table as ATable } from 'ant-design-vue'
+
const { t } = useI18n()
const props = defineProps<{ partitionFields: DetailColumnItem[], loading:
boolean }>()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Properties.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Properties.vue
index 8e0ba1d1a..c454b6a81 100644
---
a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Properties.vue
+++
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Properties.vue
@@ -75,7 +75,8 @@ import { CloseOutlined } from '@ant-design/icons-vue'
import { getUpgradeProperties } from '@/services/table.service'
import { getUUid } from '@/utils/index'
import { usePlaceholder } from '@/hooks/usePlaceholder'
-// import { useI18n } from 'vue-i18n'
+
+import { Button as AButton, Input as AInput, Form as AForm, FormItem as
AFormItem } from 'ant-design-vue'
interface IItem {
key: string
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/index.vue
index c02cfbbde..d082c72cb 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/index.vue
@@ -43,6 +43,9 @@ limitations under the License.
</template>
<script lang="ts">
+// TODO: replace to antv-4. After all replacements are completed, switch to
automatic import.
+import { Tabs, TabPane, Button as AButton } from 'ant-design-vue'
+
import { computed, defineComponent, onBeforeUnmount, onMounted, reactive, ref,
toRefs, watch } from 'vue'
import UDetails from './components/Details.vue'
import errorMsg from './components/ErrorMsg.vue'
@@ -55,7 +58,11 @@ export default defineComponent({
name: 'Tables',
components: {
UDetails,
- errorMsg
+ errorMsg,
+
+ ATabs: Tabs,
+ ATabPane: TabPane,
+ AButton
},
setup() {
const upgradeStatus = upgradeStatusMap
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
index 09fbc8822..e216e4e95 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/upgrade.vue
@@ -67,6 +67,8 @@ import otherProperties from './components/Properties.vue'
import { DetailColumnItem, IMap } from '@/types/common.type'
import { getHiveTableDetail, upgradeHiveTable } from '@/services/table.service'
+import { Button as AButton, Form as AForm, FormItem as AFormItem } from
'ant-design-vue'
+
const loading = ref<boolean>(false)
const field = reactive<DetailColumnItem[]>([])
const partitionFields = reactive<DetailColumnItem[]>([])
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
index a291c3deb..8349561e9 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
@@ -80,11 +80,12 @@ limitations under the License.
import { computed, defineComponent, onMounted, reactive } from 'vue'
import { UserOutlined, LockOutlined } from '@ant-design/icons-vue'
import loginService from '@/services/login.service'
-import { message } from 'ant-design-vue-v3'
import { useRouter } from 'vue-router'
import { usePlaceholder } from '@/hooks/usePlaceholder'
import useStore from '@/store'
+import { message, Button as AButton, Input as AInput, InputPassword as
AInputPassword, Form as AForm, FormItem as AFormItem } from 'ant-design-vue'
+
interface FormState {
username: string;
password: string;
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
index 1d756e5a1..a96fb5cf5 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/List.vue
@@ -58,9 +58,10 @@ import { getOptimizerTableList, getResourceGroupsListAPI,
releaseResource } from
import { useI18n } from 'vue-i18n'
import { usePagination } from '@/hooks/usePagination'
import { bytesToSize, formatMS2Time, formatMS2DisplayTime } from '@/utils'
-import { Modal } from 'ant-design-vue-v3'
import { useRouter } from 'vue-router'
+import { Modal, Select as ASelect, Table as ATable } from 'ant-design-vue'
+
const { t } = useI18n()
const router = useRouter()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
index f0f406b77..8856e63c0 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/optimize/components/ScaleOut.vue
@@ -40,6 +40,8 @@ import { usePlaceholder } from '@/hooks/usePlaceholder'
import { IGroupItem } from '@/types/common.type'
import { getOptimizerGroups, scaleoutResource } from
'@/services/optimize.service'
+import { Modal as AModal, Select as ASelect, Input as AInput, Form as AForm,
FormItem as AFormItem } from 'ant-design-vue'
+
interface FormState {
resourceGroup: undefined | string
parallelism: number
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
index 84f4571d5..7076d389c 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/GroupModal.vue
@@ -73,7 +73,8 @@ import {
updateResourceGroupsAPI
} from '@/services/optimize.service'
import Properties from '@/views/catalogs/Properties.vue'
-import { message } from 'ant-design-vue-v3'
+
+import { message, Modal as AModal, Select as ASelect, Input as AInput, Form as
AForm, FormItem as AFormItem } from 'ant-design-vue'
import { useI18n } from 'vue-i18n'
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
index 3d068abf0..523da332c 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/List.vue
@@ -66,10 +66,11 @@ import { getOptimizerResourceList,
getResourceGroupsListAPI, groupDeleteCheckAPI
import { useI18n } from 'vue-i18n'
import { usePagination } from '@/hooks/usePagination'
import { mbToSize } from '@/utils'
-import { Modal, message } from 'ant-design-vue-v3'
+
+import { message, Modal, Table as ATable } from 'ant-design-vue'
+
import { useRouter } from 'vue-router'
import ScaleOut from '@/views/resource/components/ScaleOut.vue'
-import { dateFormat } from '@/utils/index'
const { t } = useI18n()
const router = useRouter()
@@ -97,14 +98,11 @@ const tableColumns = shallowReactive([
{ dataIndex: 'operationGroup', title: t('operation'), key: 'operationGroup',
ellipsis: true, width: 230, scopedSlots: { customRender: 'operationGroup' } }
])
const optimizerColumns = shallowReactive([
- { dataIndex: 'jobId', title: t('optimizerId'), width: '15%', ellipsis: true
},
- { dataIndex: 'token', title: t('token'), width: '10%', ellipsis: true },
+ { dataIndex: 'index', title: t('order'), width: 80, ellipsis: true },
{ dataIndex: 'groupName', title: t('optimizerGroup'), ellipsis: true },
{ dataIndex: 'container', title: t('container'), ellipsis: true },
{ dataIndex: 'jobStatus', title: t('status'), ellipsis: true },
- { dataIndex: 'resourceAllocation', title: t('resourceAllocation'), width:
'10%', ellipsis: true },
- { dataIndex: 'startTime', title: t('startTime'), width: 172, ellipsis: true
},
- { dataIndex: 'touchTime', title: t('touchTime'), width: 172, ellipsis: true
},
+ { dataIndex: 'resourceAllocation', title: t('resourceAllocation'), width:
'20%', ellipsis: true },
{ dataIndex: 'operation', title: t('operation'), key: 'operation', ellipsis:
true, width: 160, scopedSlots: { customRender: 'operationGroup' } }
])
const pagination = reactive(usePagination())
@@ -173,8 +171,6 @@ async function getOptimizersList () {
(list || []).forEach((p: IOptimizeResourceTableItem, index: number) => {
p.resourceAllocation = `${p.coreNumber} ${t('core')}
${mbToSize(p.memory)}`
p.index = (pagination.current - 1) * pagination.pageSize + index + 1
- p.startTime = p.startTime ? dateFormat(p.startTime) : '-'
- p.touchTime = p.touchTime ? dateFormat(p.touchTime) : '-'
optimizersList.push(p)
})
} catch (error) {
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/ScaleOut.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/ScaleOut.vue
index 9876af5d5..77dd78bd7 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/components/ScaleOut.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/components/ScaleOut.vue
@@ -50,6 +50,8 @@ import { usePlaceholder } from '@/hooks/usePlaceholder'
import { IIOptimizeGroupItem } from '@/types/common.type'
import { scaleoutResource } from '@/services/optimize.service'
+import { Modal as AModal, Input as AInput, Form as AForm, FormItem as
AFormItem } from 'ant-design-vue'
+
interface FormState {
resourceGroup: undefined | string;
parallelism: number;
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/resource/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/resource/index.vue
index b6aa3aaab..2ae00d815 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/resource/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/resource/index.vue
@@ -71,6 +71,9 @@ limitations under the License.
</template>
<script lang="ts">
+// TODO: replace to antv-4. After all replacements are completed, switch to
automatic import.
+import { Tabs, TabPane, Button as AButton } from 'ant-design-vue'
+
import { ILableAndValue, IIOptimizeGroupItem } from '@/types/common.type'
import {
defineComponent,
@@ -93,7 +96,11 @@ export default defineComponent({
components: {
List,
GroupModal,
- TableList
+ TableList,
+
+ ATabs: Tabs,
+ ATabPane: TabPane,
+ AButton
},
setup() {
const { t } = useI18n()
@@ -178,12 +185,6 @@ export default defineComponent({
padding: 0 12px;
border: 1px solid #e5e5e5;
}
- :deep(.ant-tabs-content-holder) {
- // padding: 0 24px;
- }
- :deep(.ant-tabs-nav) {
- // padding: 0 12px;
- }
.table-name {
color: @primary-color;
&:hover {
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/settings/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/settings/index.vue
index 9070ccb33..6874926b0 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/settings/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/settings/index.vue
@@ -73,6 +73,9 @@ limitations under the License.
</template>
<script lang="ts" setup>
+// TODO: replace to antv-4. After all replacements are completed, switch to
automatic import.
+import { Tabs as ATabs, TabPane as ATabPane, Table as ATable, Collapse as
ACollapse, CollapsePanel as ACollapsePanel } from 'ant-design-vue'
+
import { reactive, ref, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { IColumns, IKeyAndValue, IContainerSetting } from '@/types/common.type'
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Details.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Details.vue
index cc7eea117..359983779 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Details.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Details.vue
@@ -86,6 +86,8 @@ import { DetailColumnItem, IBaseDetailInfo, IColumns, IMap,
PartitionColumnItem
import { getTableDetail } from '@/services/table.service'
import { dateFormat } from '@/utils'
+import { Table as ATable } from 'ant-design-vue'
+
const { t } = useI18n()
const emit = defineEmits<{
(e: 'setBaseDetailInfo', data: IBaseDetailInfo): void
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Files.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Files.vue
index ec4d09cc4..ea5784184 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Files.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Files.vue
@@ -95,6 +95,9 @@ import { useRoute } from 'vue-router'
import { dateFormat } from '@/utils'
import { SearchOutlined, CloseCircleOutlined } from '@ant-design/icons-vue'
+import { Button as AButton, Table as ATable, Tooltip as ATooltip, InputSearch
as AInputSearch, Breadcrumb as ABreadcrumb, BreadcrumbItem as ABreadcrumbItem }
from 'ant-design-vue'
+
+
const hasBreadcrumb = ref<boolean>(false)
const { t } = useI18n()
const columns: IColumns[] = shallowReactive([
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
index 89db217ae..d4ffdb94e 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Operations.vue
@@ -59,7 +59,8 @@ import { getOperations } from '@/services/table.service'
import { useRoute } from 'vue-router'
import { dateFormat } from '@/utils'
import useClipboard from 'vue-clipboard3'
-import { message } from 'ant-design-vue-v3'
+
+import { message, Modal as AModal, Button as AButton, Table as ATable } from
'ant-design-vue'
const { toClipboard } = useClipboard()
const { t } = useI18n()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
index 6f6c845a6..7716139f3 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Optimizing.vue
@@ -1,4 +1,3 @@
-
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
@@ -20,14 +19,8 @@ limitations under the License.
<template>
<div class="table-optimizing">
<template v-if="!hasBreadcrumb">
- <a-table
- rowKey="processId"
- :columns="columns"
- :data-source="dataSource"
- :pagination="pagination"
- :loading="loading"
- @change="change"
- >
+ <a-table rowKey="processId" :columns="columns" :data-source="dataSource"
:pagination="pagination"
+ :loading="loading" @change="change">
<template #headerCell="{ column }">
<template v-if="column.dataIndex === 'tasks'">
<div class="">{{ column.title }}</div>
@@ -45,15 +38,19 @@ limitations under the License.
<template #bodyCell="{ record, column }">
<template v-if="column.dataIndex === 'processId'">
<a-button type="link" @click="toggleBreadcrumb(record.processId,
record.status)">
- {{record.processId}}
+ {{ record.processId }}
</a-button>
</template>
<template v-if="column.dataIndex === 'status'">
<div class="g-flex-ac">
- <span :style="{ 'background-color':
(STATUS_CONFIG[record.status] || {}).color }" class="status-icon"></span>
+ <span :style="{ 'background-color':
(STATUS_CONFIG[record.status] || {}).color }"
+ class="status-icon"></span>
<span>{{ record.status }}</span>
- <a-tooltip v-if="record.status === 'FAILED'"
placement="topRight" class="g-ml-4" overlayClassName="table-failed-tip">
- <template #title><div class="tip-title">{{ record.failReason
}}</div></template>
+ <a-tooltip v-if="record.status === 'FAILED'"
placement="topRight" class="g-ml-4"
+ overlayClassName="table-failed-tip">
+ <template #title>
+ <div class="tip-title">{{ record.failReason }}</div>
+ </template>
<question-circle-outlined />
</a-tooltip>
</div>
@@ -68,26 +65,20 @@ limitations under the License.
</a-table>
</template>
<template v-else>
- <a-row>
- <a-col :span="18">
- <a-breadcrumb separator=">">
- <a-breadcrumb-item @click="toggleBreadcrumb"
class="text-active">All</a-breadcrumb-item>
- <a-breadcrumb-item>{{ `${$t('processId')}
${processId}`}}</a-breadcrumb-item>
- </a-breadcrumb>
- </a-col>
- <a-col :span="6">
- <a-button type="primary" v-model:disabled="cancelDisabled"
class="g-mb-16" @click="cancel" style="float: right">{{ t("cancelProcess")
}}</a-button>
- </a-col>
- </a-row>
- <a-table
- rowKey="taskId"
- :columns="breadcrumbColumns"
- :data-source="breadcrumbDataSource"
- :pagination="breadcrumbPagination"
- :loading="loading"
- @change="change"
- class="g-mt-8"
- >
+ <a-row>
+ <a-col :span="18">
+ <a-breadcrumb separator=">">
+ <a-breadcrumb-item @click="toggleBreadcrumb"
class="text-active">All</a-breadcrumb-item>
+ <a-breadcrumb-item>{{ `${$t('processId')} ${processId}`
}}</a-breadcrumb-item>
+ </a-breadcrumb>
+ </a-col>
+ <a-col :span="6">
+ <a-button type="primary" v-model:disabled="cancelDisabled"
class="g-mb-16" @click="cancel"
+ style="float: right">{{ t("cancelProcess") }}</a-button>
+ </a-col>
+ </a-row>
+ <a-table rowKey="taskId" :columns="breadcrumbColumns"
:data-source="breadcrumbDataSource"
+ :pagination="breadcrumbPagination" :loading="loading" @change="change"
class="g-mt-8">
<template #headerCell="{ column }">
<template v-if="column.dataIndex === 'inputFilesDesc'">
<div class="">{{ column.title }}</div>
@@ -101,16 +92,20 @@ limitations under the License.
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'partitionData'">
<a-tooltip>
- <template #title>{{record.partitionData}}</template>
- <span>{{record.partitionData}}</span>
+ <template #title>{{ record.partitionData }}</template>
+ <span>{{ record.partitionData }}</span>
</a-tooltip>
</template>
<template v-if="column.dataIndex === 'status'">
<div class="g-flex-ac">
- <span :style="{ 'background-color':
(TASK_STATUS_CONFIG[record.status] || {}).color }" class="status-icon"></span>
+ <span :style="{ 'background-color':
(TASK_STATUS_CONFIG[record.status] || {}).color }"
+ class="status-icon"></span>
<span>{{ record.status }}</span>
- <a-tooltip v-if="record.status === 'FAILED'"
placement="topRight" class="g-ml-4" overlayClassName="table-failed-tip">
- <template #title><div class="tip-title">{{ record.failReason
}}</div></template>
+ <a-tooltip v-if="record.status === 'FAILED'"
placement="topRight" class="g-ml-4"
+ overlayClassName="table-failed-tip">
+ <template #title>
+ <div class="tip-title">{{ record.failReason }}</div>
+ </template>
<question-circle-outlined />
</a-tooltip>
</div>
@@ -133,11 +128,12 @@ import { useI18n } from 'vue-i18n'
import { usePagination } from '@/hooks/usePagination'
import { IColumns, BreadcrumbOptimizingItem } from '@/types/common.type'
import { getOptimizingProcesses, getTasksByOptimizingProcessId,
cancelOptimizingProcess } from '@/services/table.service'
-import { Modal, message } from 'ant-design-vue-v3'
import { useRoute } from 'vue-router'
import { QuestionCircleOutlined } from '@ant-design/icons-vue'
import { bytesToSize, dateFormat, formatMS2Time } from '@/utils/index'
+import { Modal, Col as ACol, Row as ARow, Button as AButton, Table as ATable,
Tooltip as ATooltip, Breadcrumb as ABreadcrumb, BreadcrumbItem as
ABreadcrumbItem } from 'ant-design-vue'
+
const hasBreadcrumb = ref<boolean>(false)
// const statusMap = { RUNNING: 'RUNNING', CLOSED: 'CLOSED', SUCCESS:
'SUCCESS', FAILED: 'FAILED' }
@@ -237,7 +233,7 @@ async function cancel() {
content: '',
okText: '',
cancelText: '',
- onOk: async() => {
+ onOk: async () => {
try {
loading.value = true
const result = await cancelOptimizingProcess({
@@ -328,19 +324,24 @@ onMounted(() => {
<style lang="less" scoped>
.table-optimizing {
padding: 18px 24px;
+
:deep(.ant-table-thead > tr >
th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before)
{
height: 100% !important;
}
+
:deep(.ant-table-thead > tr:not(:last-child) > th[colspan]) {
border-bottom: 1px solid #e8e8f0;
}
+
:deep(.ant-table-thead > tr > th) {
padding: 4px 16px !important;
}
+
:deep(.ant-table-thead > tr > th) {
padding: 4px 16px !important;
}
}
+
.status-icon {
width: 8px;
height: 8px;
@@ -356,15 +357,18 @@ onMounted(() => {
color: #1890ff;
cursor: pointer;
}
+
.ant-btn-link {
padding: 0;
}
}
+
.table-failed-tip {
- .ant-tooltip-content{
+ .ant-tooltip-content {
width: 800px;
}
- .tip-title{
+
+ .tip-title {
display: block;
max-height: 700px;
overflow: auto;
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
index 9781f1ef4..7b570a8c9 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Selector.vue
@@ -84,14 +84,14 @@ limitations under the License.
</template>
<script lang="ts" setup>
+// TODO: replace to antv-4. After all replacements are completed, switch to
automatic import.
+import { Dropdown as ADropdown, Tabs as ATabs, TabPane as ATabPane, Select as
ASelect, SelectOption as ASelectOption, Button as AButton, Input as AInput }
from 'ant-design-vue'
+
import { computed, onMounted, reactive, ref } from 'vue'
-import { useI18n } from 'vue-i18n'
import { CheckOutlined, DownOutlined } from '@ant-design/icons-vue'
import { branchTypeMap, IBranchItem, IServiceBranchItem, operationMap } from
'@/types/common.type'
import { getBranches, getTags } from '@/services/table.service'
-const { t } = useI18n()
-
const props = defineProps({ catalog: String, db: String, table: String,
disabled: Boolean })
const disabled = computed(() => props.disabled)
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Snapshots.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Snapshots.vue
index 8f250a0ed..19a02ea0a 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Snapshots.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/components/Snapshots.vue
@@ -87,6 +87,8 @@ limitations under the License.
</template>
<script lang="ts" setup>
+import { Col as ACol, Row as ARow, Button as AButton, Table as ATable, Tooltip
as ATooltip, Breadcrumb as ABreadcrumb, BreadcrumbItem as ABreadcrumbItem }
from 'ant-design-vue'
+
import { onMounted, reactive, ref, shallowReactive } from 'vue'
import { useI18n } from 'vue-i18n'
import { usePagination } from '@/hooks/usePagination'
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/tables/create.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/create.vue
index 9aba0ae50..24461cd22 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/create.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/create.vue
@@ -56,11 +56,13 @@ limitations under the License.
<script lang="ts" setup>
import { reactive, ref } from 'vue'
-import type { SelectProps } from 'ant-design-vue-v3'
import { LeftOutlined } from '@ant-design/icons-vue'
import { TableBasicInfo } from '@/types/common.type'
import { usePlaceholder } from '@/hooks/usePlaceholder'
+import { Select as ASelect, Input as AInput, Form as AForm, FormItem as
AFormItem } from 'ant-design-vue'
+import type { SelectProps } from 'ant-design-vue'
+
const emit = defineEmits<{
(e: 'goBack'): void
}>()
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
index de2c6b7c8..f325f1837 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
@@ -36,10 +36,6 @@ limitations under the License.
<p>{{$t('tableFormat')}}: <span
class="text-color">{{baseInfo.tableFormat}}</span></p>
</div>
</div>
- <!-- <div class="table-edit">
- <edit-outlined @click="editTable" class="g-mr-8" />
- <delete-outlined @click="delTable" />
- </div> -->
</div>
<div class="content">
<a-tabs v-model:activeKey="activeKey" destroyInactiveTabPane
@change="onChangeTab">
@@ -61,8 +57,10 @@ limitations under the License.
</template>
<script lang="ts">
+// TODO: replace to antv-4. After all replacements are completed, switch to
automatic import.
+import { Tabs, TabPane, Divider } from 'ant-design-vue'
+
import { defineComponent, reactive, toRefs, watch, shallowReactive, computed,
onMounted, ref, nextTick } from 'vue'
-// import { EditOutlined, DeleteOutlined } from '@ant-design/icons-vue'
import UDetails from './components/Details.vue'
import UFiles from './components/Files.vue'
import UOperations from './components/Operations.vue'
@@ -70,18 +68,20 @@ import USnapshots from './components/Snapshots.vue'
import UOptimizing from './components/Optimizing.vue'
import { useRoute, useRouter } from 'vue-router'
import useStore from '@/store/index'
-import { IBaseDetailInfo, IMap } from '@/types/common.type'
+import { IBaseDetailInfo } from '@/types/common.type'
export default defineComponent({
name: 'Tables',
components: {
- // EditOutlined,
- // DeleteOutlined,
UDetails,
UFiles,
UOperations,
USnapshots,
- UOptimizing
+ UOptimizing,
+
+ ATabs: Tabs,
+ ATabPane: TabPane,
+ ADivider: Divider
},
setup() {
const router = useRouter()
@@ -91,8 +91,6 @@ export default defineComponent({
const detailRef = ref()
const tabConfigs = shallowReactive([
- // { key: 'Details' },
- // { key: 'Files' },
{ key: 'Snapshots', label: 'Snapshots' },
{ key: 'Optimizing', label: 'Optimizing' },
{ key: 'Operations', label: 'Operations' }
@@ -122,17 +120,17 @@ export default defineComponent({
state.detailLoaded = true
state.baseInfo = { ...baseInfo }
}
- const onChangeTab = (key: string) => {
+
+ const onChangeTab = (key: string | number) => {
const query = { ...route.query }
- query.tab = key
+ query.tab = key.toString()
router.replace({ query: { ...query } })
}
- const editTable = () => {}
- const delTable = () => {}
const hideTablesMenu = () => {
store.updateTablesMenu(false)
}
+
const goBack = () => {
state.isSecondaryNav = false
router.back()
@@ -172,8 +170,6 @@ export default defineComponent({
tabConfigs,
store,
isIceberg,
- editTable,
- delTable,
setBaseDetailInfo,
hideTablesMenu,
goBack,
@@ -213,10 +209,6 @@ export default defineComponent({
.text-color {
color: #7CB305;
}
- .ant-divider-vertical {
- height: 1.2em;
- margin: 0 12px;
- }
}
.table-edit {
font-size: 18px;
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
b/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
index 7121d4578..3e85ebebd 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
@@ -119,10 +119,11 @@ import SqlLog from './components/sql-log.vue'
import { ICatalogItem, IDebugResult, ILableAndValue, IMap, debugResultBgcMap }
from '@/types/common.type'
import { executeSql, getExampleSqlCode, getJobDebugResult, getLogsResult,
getShortcutsList, stopSql, getLastDebugInfo } from '@/services/terminal.service'
import { CheckCircleOutlined, CloseCircleOutlined, LoadingOutlined } from
'@ant-design/icons-vue'
-import { message } from 'ant-design-vue-v3'
import { getCatalogList } from '@/services/table.service'
import { usePlaceholder } from '@/hooks/usePlaceholder'
+import { message, Select as ASelect, Button as AButton, Tooltip as ATooltip }
from 'ant-design-vue'
+
interface ISessionInfo {
sessionId: string
sqlNumber: number
@@ -141,7 +142,8 @@ export default defineComponent({
SqlLog,
CheckCircleOutlined,
CloseCircleOutlined,
- LoadingOutlined
+ LoadingOutlined,
+ ASelect
},
setup() {
const placeholder = reactive(usePlaceholder())