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 cd662a796 [AMORO-2731]: auto import antd-vue component & icons (#2843)
cd662a796 is described below
commit cd662a796294cd5cd8cada89de802e6809da5b13
Author: xiaomo <[email protected]>
AuthorDate: Wed May 22 11:16:08 2024 +0800
[AMORO-2731]: auto import antd-vue component & icons (#2843)
* [AMORO-2731]: auto import antd-vue component & icons
* [AMORO-2731]: fix the terminal style & optimize the login page
* [AMORO-2731]: login message show
---------
Co-authored-by: ZhouJinsong <[email protected]>
---
amoro-ams/amoro-ams-dashboard/package.json | 3 +-
amoro-ams/amoro-ams-dashboard/pnpm-lock.yaml | 58 +++-------
amoro-ams/amoro-ams-dashboard/src/App.vue | 1 -
.../amoro-ams-dashboard/src/components/Sidebar.vue | 9 --
.../amoro-ams-dashboard/src/components/Topbar.vue | 12 +-
.../src/components/VirtualRecycleScroller.vue | 1 -
.../src/components/tables-sub-menu/TablesMenu.vue | 11 --
amoro-ams/amoro-ams-dashboard/src/main.ts | 3 -
.../amoro-ams-dashboard/src/styles/ant-design.less | 5 +
amoro-ams/amoro-ams-dashboard/src/utils/request.ts | 2 +-
amoro-ams/amoro-ams-dashboard/src/views/404.vue | 4 -
.../src/views/catalogs/Properties.vue | 3 -
.../views/hive-details/components/Properties.vue | 3 -
.../src/views/hive-details/upgrade.vue | 4 -
.../amoro-ams-dashboard/src/views/login/index.vue | 27 ++---
.../src/views/resource/components/ScaleOut.vue | 2 +-
.../src/views/tables/components/Files.vue | 4 -
.../src/views/tables/components/Optimizing.vue | 3 -
.../src/views/tables/components/Selector.vue | 4 -
.../src/views/tables/create.vue | 2 -
.../amoro-ams-dashboard/src/views/tables/index.vue | 7 --
.../src/views/terminal/components/sql-result.vue | 1 -
.../src/views/terminal/index.vue | 123 +++++++++++++--------
amoro-ams/amoro-ams-dashboard/vite.config.ts | 10 +-
24 files changed, 120 insertions(+), 182 deletions(-)
diff --git a/amoro-ams/amoro-ams-dashboard/package.json
b/amoro-ams/amoro-ams-dashboard/package.json
index 6da9b93f5..ae94bab80 100644
--- a/amoro-ams/amoro-ams-dashboard/package.json
+++ b/amoro-ams/amoro-ams-dashboard/package.json
@@ -13,12 +13,10 @@
"@ant-design/icons-vue": "6.1.0",
"@antfu/eslint-config": "^2.4.6",
"ant-design-vue": "^4.1.2",
- "ant-design-vue-v3": "npm:[email protected]",
"axios": "^1.6.2",
"dayjs": "^1.11.10",
"echarts": "^5.4.3",
"pinia": "^2.1.7",
- "unplugin-vue-components": "^0.26.0",
"vue": "^3.3.11",
"vue-clipboard3": "^2.0.0",
"vue-i18n": "^9.8.0",
@@ -41,6 +39,7 @@
"qs": "^6.10.1",
"sql-formatter": "^2.3.3",
"typescript": "^5.2.2",
+ "unplugin-vue-components": "^0.26.0",
"vite": "^5.0.8",
"vite-plugin-fake-server": "^2.1.1",
"vite-plugin-svg-icons": "^2.0.1",
diff --git a/amoro-ams/amoro-ams-dashboard/pnpm-lock.yaml
b/amoro-ams/amoro-ams-dashboard/pnpm-lock.yaml
index 61e1655cb..475ca51bc 100644
--- a/amoro-ams/amoro-ams-dashboard/pnpm-lock.yaml
+++ b/amoro-ams/amoro-ams-dashboard/pnpm-lock.yaml
@@ -14,9 +14,6 @@ dependencies:
ant-design-vue:
specifier: ^4.1.2
version: 4.1.2([email protected])
- ant-design-vue-v3:
- specifier: npm:[email protected]
- version: /[email protected]([email protected])
axios:
specifier: ^1.6.2
version: 1.6.2
@@ -29,9 +26,6 @@ dependencies:
pinia:
specifier: ^2.1.7
version: 2.1.7([email protected])([email protected])
- unplugin-vue-components:
- specifier: ^0.26.0
- version: 0.26.0([email protected])
vue:
specifier: ^3.3.11
version: 3.3.11([email protected])
@@ -94,6 +88,9 @@ devDependencies:
typescript:
specifier: ^5.2.2
version: 5.2.2
+ unplugin-vue-components:
+ specifier: ^0.26.0
+ version: 0.26.0([email protected])
vite:
specifier: ^5.0.8
version: 5.0.8(@types/[email protected])([email protected])
@@ -231,7 +228,7 @@ packages:
/@antfu/[email protected]:
resolution: {integrity:
sha512-gFPqTG7otEJ8uP6wrhDv6mqwGWYZKNvAcCq6u9hOj0c+IKCEsY4L1oC9trPq2SaWIzAfHvqfBDxF591JkMf+kg==}
- dev: false
+ dev: true
/@babel/[email protected]:
resolution: {integrity:
sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==}
@@ -994,7 +991,7 @@ packages:
'@types/estree': 1.0.5
estree-walker: 2.0.2
picomatch: 2.3.1
- dev: false
+ dev: true
/@rollup/[email protected]:
resolution: {integrity:
sha512-6vMdBZqtq1dVQ4CWdhFwhKZL6E4L1dV6jUjuBvsavvNJSppzi6dLBbuV+3+IyUREaj9ZFvQefnQm28v4OCXlig==}
@@ -1203,7 +1200,7 @@ packages:
/@types/[email protected]:
resolution: {integrity:
sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
- dev: false
+ dev: true
/@types/[email protected]:
resolution: {integrity:
sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
@@ -1819,32 +1816,6 @@ packages:
dependencies:
color-convert: 2.0.1
- /[email protected]([email protected]):
- resolution: {integrity:
sha512-YWpMfGaGoRastIXEYfCoJiaRiDHk4chqtYhlKQM5GqPt6NfvrM1Vg2e60yHtjxlZjed91wCMm0rAmyUr7Hwzdg==}
- engines: {node: '>=12.22.0'}
- peerDependencies:
- vue: '>=3.2.0'
- dependencies:
- '@ant-design/colors': 6.0.0
- '@ant-design/icons-vue': 6.1.0([email protected])
- '@babel/runtime': 7.23.6
- '@ctrl/tinycolor': 3.6.1
- '@simonwep/pickr': 1.8.2
- array-tree-filter: 2.1.0
- async-validator: 4.2.5
- dayjs: 1.11.10
- dom-align: 1.12.4
- dom-scroll-into-view: 2.0.1
- lodash: 4.17.21
- lodash-es: 4.17.21
- resize-observer-polyfill: 1.5.1
- scroll-into-view-if-needed: 2.2.31
- shallow-equal: 1.2.1
- vue: 3.3.11([email protected])
- vue-types: 3.0.2([email protected])
- warning: 4.0.3
- dev: false
-
/[email protected]([email protected]):
resolution: {integrity:
sha512-ynFkDJLlHgumeK6Hr1UZ7PvQNZ1uBcri/pmejBdS3kRqHeA5VRsxneYDwa8YxA+uYB5YfT2jpYsSHsiMiCjRGg==}
engines: {node: '>=12.22.0'}
@@ -1908,6 +1879,7 @@ packages:
dependencies:
normalize-path: 3.0.0
picomatch: 2.3.1
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==}
@@ -2076,6 +2048,7 @@ packages:
/[email protected]:
resolution: {integrity:
sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
engines: {node: '>=8'}
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
@@ -2425,6 +2398,7 @@ packages:
readdirp: 3.6.0
optionalDependencies:
fsevents: 2.3.3
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==}
@@ -4087,6 +4061,7 @@ packages:
engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
os: [darwin]
requiresBuild: true
+ dev: true
optional: true
/[email protected]:
@@ -4580,6 +4555,7 @@ packages:
engines: {node: '>=8'}
dependencies:
binary-extensions: 2.2.0
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==}
@@ -5063,7 +5039,7 @@ packages:
/[email protected]:
resolution: {integrity:
sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==}
engines: {node: '>=14'}
- dev: false
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==}
@@ -5692,6 +5668,7 @@ packages:
/[email protected]:
resolution: {integrity:
sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
engines: {node: '>=0.10.0'}
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==}
@@ -6361,6 +6338,7 @@ packages:
engines: {node: '>=8.10.0'}
dependencies:
picomatch: 2.3.1
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-XNwrTx77JQCEMXTeb8movBKuK75MgH0RZkujNuDKCezemx/voapl9i2gCSi8WWm8+ox5ycJi1gxF22fR7c0Ciw==}
@@ -7394,7 +7372,7 @@ packages:
transitivePeerDependencies:
- rollup
- supports-color
- dev: false
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-0QkvG13z6RD+1L1FoibQqnvTwVBXvS4XSPwAyinVgoOCl2jAgwzdUKmEj05o4Lt8xwQI85Hb6mSyYkcAGwZPew==}
@@ -7403,7 +7381,7 @@ packages:
chokidar: 3.5.3
webpack-sources: 3.2.3
webpack-virtual-modules: 0.6.1
- dev: false
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-PcA2tsuGSF9cnySLHTLSh2qrQiJ70mn+r+Glzxv2TWZblxsxCC52BDlZoPCsz7STd9pN7EZetkWZBAvk4cgZdQ==}
@@ -7720,11 +7698,11 @@ packages:
/[email protected]:
resolution: {integrity:
sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
engines: {node: '>=10.13.0'}
- dev: false
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg==}
- dev: false
+ dev: true
/[email protected]:
resolution: {integrity:
sha512-td7fYwgLSrky3fI1EuU5cneU4+pbH6GgOfuKNS1tNPcfdGinGELAqsb/BP4nnvZyKSG2i/xFGU7+n2PvZA8HJQ==}
diff --git a/amoro-ams/amoro-ams-dashboard/src/App.vue
b/amoro-ams/amoro-ams-dashboard/src/App.vue
index 5cb89d6cf..122f8e09c 100644
--- a/amoro-ams/amoro-ams-dashboard/src/App.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/App.vue
@@ -23,7 +23,6 @@
</template>
<script lang="ts" setup>
-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';
diff --git a/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
b/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
index 111b16b10..bce83bbe9 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/Sidebar.vue
@@ -50,12 +50,9 @@ import { computed, defineComponent, nextTick, reactive, ref,
toRefs, watchEffect
import { useRoute, useRouter } from 'vue-router'
import useStore from '@/store/index'
import TableMenu from '@/components/tables-sub-menu/TablesMenu.vue'
-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,13 +62,7 @@ interface MenuItem {
export default defineComponent({
name: 'Sidebar',
components: {
- MenuFoldOutlined,
- MenuUnfoldOutlined,
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 ff58745f7..24c57e518 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/Topbar.vue
@@ -36,16 +36,14 @@
</template>
<script lang="ts">
-
import { defineComponent, onMounted, reactive } from 'vue'
-import { QuestionCircleOutlined, LogoutOutlined } from '@ant-design/icons-vue'
+import { Modal } from 'ant-design-vue';
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
@@ -53,12 +51,6 @@ interface IVersion {
export default defineComponent ({
name: 'Topbar',
- components: {
- QuestionCircleOutlined,
- LogoutOutlined,
- AButton,
- ATooltip
- },
setup() {
const verInfo = reactive<IVersion>({
version: '',
diff --git
a/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
b/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
index b7d6f4f3f..fd684c05a 100644
--- a/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/components/VirtualRecycleScroller.vue
@@ -105,7 +105,6 @@ export default defineComponent ({
justify-content: flex-start;
align-items: center;
padding: 10px 12px;
- height: 40px;
color: rgba(255,255,255,0.8);
cursor: pointer;
&.active,
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 8fb28b0a1..7395c7e3f 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,14 +86,7 @@
</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,
- SearchOutlined,
- CloseCircleOutlined
-} from '@ant-design/icons-vue'
import CreateDBModal from './CreateDB.vue'
import { useRoute, useRouter } from 'vue-router'
import useStore from '@/store/index'
@@ -115,12 +108,8 @@ interface ITableItem {
export default defineComponent({
name: 'TablesMenu',
components: {
- // PlusOutlined,
- SearchOutlined,
- CloseCircleOutlined,
CreateDBModal,
virtualRecycleScroller,
- ASelect
},
emits: ['goCreatePage'],
setup(_, { emit }) {
diff --git a/amoro-ams/amoro-ams-dashboard/src/main.ts
b/amoro-ams/amoro-ams-dashboard/src/main.ts
index 2396edd32..5484b7953 100644
--- a/amoro-ams/amoro-ams-dashboard/src/main.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/main.ts
@@ -24,9 +24,6 @@ import router from './router'
import useStore from './store'
import VueI18n from './language/i18n'
-// TODOļ¼ import the global style for v3. Will be removed after migrate to the
ant-design-vue-v4
-import 'ant-design-vue-v3/dist/antd.css';
-
import RegisterComponents from './components/register'
import './styles/index.less'
diff --git a/amoro-ams/amoro-ams-dashboard/src/styles/ant-design.less
b/amoro-ams/amoro-ams-dashboard/src/styles/ant-design.less
index 6399ebe59..ceeeb1414 100644
--- a/amoro-ams/amoro-ams-dashboard/src/styles/ant-design.less
+++ b/amoro-ams/amoro-ams-dashboard/src/styles/ant-design.less
@@ -188,6 +188,11 @@
color: #fff !important;
background-color: @dark-bg-primary-color !important;
}
+
+ .ant-input::placeholder {
+ color: #9ea4aa !important;
+ background-color: @dark-bg-primary-color !important;
+ }
}
.ant-empty-description {
color: #9ea4aa !important;
diff --git a/amoro-ams/amoro-ams-dashboard/src/utils/request.ts
b/amoro-ams/amoro-ams-dashboard/src/utils/request.ts
index 988b0b67b..69b1402ba 100644
--- a/amoro-ams/amoro-ams-dashboard/src/utils/request.ts
+++ b/amoro-ams/amoro-ams-dashboard/src/utils/request.ts
@@ -17,7 +17,7 @@
*/
import axios, { AxiosRequestConfig, AxiosResponse } from 'axios'
-import { message } from 'ant-design-vue-v3'
+import { message } from 'ant-design-vue'
import useStore from '@/store'
import router from '@/router'
diff --git a/amoro-ams/amoro-ams-dashboard/src/views/404.vue
b/amoro-ams/amoro-ams-dashboard/src/views/404.vue
index 9f953d0aa..603ab18ba 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/404.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/404.vue
@@ -30,13 +30,9 @@ limitations under the License.
<script lang="ts">
import { defineComponent } from 'vue'
-import { Button as AButton } from 'ant-design-vue'
export default defineComponent({
name: 'Page404',
- components: {
- AButton
- }
})
</script>
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 f280b71ed..7f0f3035e 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/catalogs/Properties.vue
@@ -71,13 +71,10 @@ limitations under the License.
<script setup lang="ts">
import { computed, onMounted, reactive, ref, shallowReactive, watch } from
'vue'
import { IMap } from '@/types/common.type'
-import { CloseOutlined } from '@ant-design/icons-vue'
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/hive-details/components/Properties.vue
b/amoro-ams/amoro-ams-dashboard/src/views/hive-details/components/Properties.vue
index c454b6a81..6c0117f4b 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
@@ -71,13 +71,10 @@ limitations under the License.
<script setup lang="ts">
import { onMounted, reactive, ref, watch } from 'vue'
import { IMap, IKeyAndValue } from '@/types/common.type'
-import { CloseOutlined } from '@ant-design/icons-vue'
import { getUpgradeProperties } from '@/services/table.service'
import { getUUid } from '@/utils/index'
import { usePlaceholder } from '@/hooks/usePlaceholder'
-import { Button as AButton, Input as AInput, Form as AForm, FormItem as
AFormItem } from 'ant-design-vue'
-
interface IItem {
key: string
value: string
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 e216e4e95..f938d6e40 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
@@ -60,15 +60,12 @@ limitations under the License.
<script lang="ts" setup>
import { computed, onMounted, reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
-import { LeftOutlined } from '@ant-design/icons-vue'
import schemaField from './components/Field.vue'
import partitionField from './components/Partition.vue'
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[]>([])
@@ -80,7 +77,6 @@ const emit = defineEmits<{
(e: 'refresh'): void
}>()
-const router = useRouter()
const route = useRoute()
const params = computed(() => {
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 c95fea1c2..5459158a6 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/login/index.vue
@@ -77,15 +77,13 @@ limitations under the License.
</template>
<script lang="ts">
+import { message } from 'ant-design-vue'
import { computed, defineComponent, onMounted, reactive } from 'vue'
-import { UserOutlined, LockOutlined } from '@ant-design/icons-vue'
import loginService from '@/services/login.service'
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;
@@ -93,15 +91,6 @@ interface FormState {
export default defineComponent({
name: 'Login',
- components: {
- AButton,
- AInput,
- AInputPassword,
- AForm,
- AFormItem,
- UserOutlined,
- LockOutlined
- },
setup() {
const router = useRouter()
const formState = reactive<FormState>({
@@ -146,15 +135,15 @@ export default defineComponent({
<style lang="less" scoped>
.login-wrap {
- height: 100%;
+ width: 100vw;
+ height: 100vh;
margin: 0 auto;
- // padding-top: 100px;
display: flex;
align-items: center;
- background: #f5f6fa;
+ background: linear-gradient(to top right, #0036A1 0%, #fff 100%);
+
.login-content {
- width: 480px;
- height: 490px;
+ width: 400px;
border-radius: 16px;
padding: 64px 60px;
background: #ffffff;
@@ -193,14 +182,14 @@ export default defineComponent({
}
}
.login-form-button {
- margin-top: 66px;
+ margin-top: 36px;
height: 48px;
width: 100%;
border-radius: 8px;
color: #fff;
border-color: transparent;
&.ant-btn-primary {
- background: #0036a1;
+ background: linear-gradient(to right, #2A72FF 0%, #0036A1 100%);
}
&.ant-btn-primary[disabled] {
background: #cdcfd7;
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 77dd78bd7..bd002406a 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
@@ -19,7 +19,7 @@ limitations under the License.
<template>
<a-modal
- :visible="true"
+ :open="true"
:title="$t('scaleOut')"
:confirmLoading="confirmLoading"
:closable="false"
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 ea5784184..b92f03870 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
@@ -93,10 +93,6 @@ import { BreadcrumbPartitionItem, IColumns, PartitionItem }
from '@/types/common
import { getPartitionFiles, getPartitionTable } from '@/services/table.service'
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()
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 7716139f3..18bf9de73 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
@@ -129,11 +129,8 @@ import { usePagination } from '@/hooks/usePagination'
import { IColumns, BreadcrumbOptimizingItem } from '@/types/common.type'
import { getOptimizingProcesses, getTasksByOptimizingProcessId,
cancelOptimizingProcess } from '@/services/table.service'
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' }
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 7b570a8c9..210edd1e6 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,11 +84,7 @@ 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 { CheckOutlined, DownOutlined } from '@ant-design/icons-vue'
import { branchTypeMap, IBranchItem, IServiceBranchItem, operationMap } from
'@/types/common.type'
import { getBranches, getTags } from '@/services/table.service'
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 24461cd22..66e06469e 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,9 @@ limitations under the License.
<script lang="ts" setup>
import { reactive, ref } from 'vue'
-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<{
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 f325f1837..8ea05d1b1 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/tables/index.vue
@@ -57,9 +57,6 @@ 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 UDetails from './components/Details.vue'
import UFiles from './components/Files.vue'
@@ -78,10 +75,6 @@ export default defineComponent({
UOperations,
USnapshots,
UOptimizing,
-
- ATabs: Tabs,
- ATabPane: TabPane,
- ADivider: Divider
},
setup() {
const router = useRouter()
diff --git
a/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
b/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
index 045404550..e6143ef60 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/terminal/components/sql-result.vue
@@ -59,7 +59,6 @@ limitations under the License.
<script lang="ts" setup>
import { IDebugResult, debugResultBgcMap } from '@/types/common.type'
import { computed } from 'vue'
-import { CheckCircleOutlined, CloseCircleOutlined, LoadingOutlined } from
'@ant-design/icons-vue'
const props = defineProps<{ info: IDebugResult}>()
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 2c7486332..35f4da2ad 100644
--- a/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
+++ b/amoro-ams/amoro-ams-dashboard/src/views/terminal/index.vue
@@ -1,4 +1,3 @@
-
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
@@ -19,51 +18,47 @@ limitations under the License.
<template>
<div class="console-wrap">
- <div class="console-content" :class="{'fullscreen': fullscreen }">
+ <div class="console-content" :class="{ 'fullscreen': fullscreen }">
<div :style="{ height: `${sqlResultHeight}px` }" class="sql-wrap">
<div class="sql-block">
<div class="top-ops g-flex-jsb">
<div class="title-left g-flex-ac">
<div class="select-catalog g-mr-12">
- <span class="label">{{$t('use')}}</span>
- <a-select
- v-model:value="curCatalog"
- style="width: 200px"
- :options="catalogOptions"
- @change="changeUseCatalog"
- >
+ <span class="label">{{ $t('use') }}</span>
+ <a-select v-model:value="curCatalog" style="width: 200px"
:options="catalogOptions"
+ @change="changeUseCatalog">
</a-select>
</div>
<a-tooltip v-if="runStatus === 'Running'" :title="$t('pause')"
placement="bottom">
- <svg-icon className="icon-svg" icon-class="sqlpause"
@click="handleIconClick('pause')" class="g-mr-12" :disabled="readOnly" />
+ <svg-icon className="icon-svg" icon-class="sqlpause"
@click="handleIconClick('pause')" class="g-mr-12"
+ :disabled="readOnly" />
</a-tooltip>
<a-tooltip v-else :title="$t('run')" placement="bottom">
- <svg-icon className="icon-svg" icon-class="sqldebug"
@click="handleIconClick('debug')" class="g-mr-12" :disabled="readOnly" />
+ <svg-icon className="icon-svg" icon-class="sqldebug"
@click="handleIconClick('debug')" class="g-mr-12"
+ :disabled="readOnly" />
</a-tooltip>
<a-tooltip :title="$t('format')" placement="bottom">
- <svg-icon className="icon-svg" :isStroke="true"
icon-class="format" @click="handleIconClick('format')" :disabled="readOnly" />
+ <svg-icon className="icon-svg" :isStroke="true"
icon-class="format" @click="handleIconClick('format')"
+ :disabled="readOnly" />
</a-tooltip>
</div>
<div class="title-right">
- <a-tooltip :title="fullscreen ? $t('recovery') :
$t('fullscreen')" placement="bottom" :getPopupContainer="getPopupContainer">
- <svg-icon className="icon-svg" :isStroke="true"
:icon-class="fullscreen ? 'sqlinit' : 'sqlmax'" @click="handleFull"
:disabled="false" class="g-ml-12" />
+ <a-tooltip :title="fullscreen ? $t('recovery') :
$t('fullscreen')" placement="bottom"
+ :getPopupContainer="getPopupContainer">
+ <svg-icon className="icon-svg" :isStroke="true"
:icon-class="fullscreen ? 'sqlinit' : 'sqlmax'"
+ @click="handleFull" :disabled="false" class="g-ml-12" />
</a-tooltip>
</div>
</div>
<div class="sql-content">
<div class="sql-raw">
- <sql-editor
- ref="sqlEditorRef"
- :sqlValue="sqlSource"
- v-model:value="sqlSource"
- :readOnly="readOnly"
+ <sql-editor ref="sqlEditorRef" :sqlValue="sqlSource"
v-model:value="sqlSource" :readOnly="readOnly"
:options="{
readOnly: readOnly,
minimap: { enabled: false }
- }"
- />
+ }" />
</div>
- <div v-if="runStatus" class="run-status" :style="{background:
bgcMap[runStatus]}">
+ <div v-if="runStatus" class="run-status" :style="{ background:
bgcMap[runStatus] }">
<template v-if="runStatus === 'Running' || runStatus ===
'Canceling'">
<loading-outlined style="color: #1890ff" />
</template>
@@ -81,17 +76,23 @@ limitations under the License.
</div>
</div>
<div class="sql-shortcuts">
- <div class="shortcuts">{{$t('sqlShortcuts')}}</div>
- <a-button v-for="code in shortcuts" :key="code" type="link"
:disabled="runStatus === 'Running' || runStatus === 'Canceling'"
@click="generateCode(code)" class="code">{{ code }}</a-button>
+ <div class="shortcuts">{{ $t('sqlShortcuts') }}</div>
+ <a-button v-for="code in shortcuts" :key="code" type="link"
+ :disabled="runStatus === 'Running' || runStatus === 'Canceling'"
@click="generateCode(code)" class="code">{{
+ code
+ }}</a-button>
</div>
</div>
<!-- sql result -->
- <div class="sql-result" :style="{ height: `calc(100% -
${sqlResultHeight}px)` }" :class="resultFullscreen ? 'result-full' : ''">
- <span class="drag-line" @mousedown="dragMounseDown"><svg-icon
class="icon" icon-class="slide"/></span>
+ <div class="sql-result" :style="{ height: `calc(100% -
${sqlResultHeight}px)` }"
+ :class="resultFullscreen ? 'result-full' : ''">
+ <span class="drag-line" @mousedown="dragMounseDown"><svg-icon
class="icon" icon-class="slide" /></span>
<div class="tab-operation">
<div class="tab">
- <span :class="{ active: operationActive === 'log' }"
@click="operationActive = 'log'" class="tab-item">{{$t('log')}}</span>
- <span v-for="item in resultTabList" :key="item.id" :class="{
active: operationActive === item.id }" @click="operationActive = item.id"
class="tab-item">{{item.id}}</span>
+ <span :class="{ active: operationActive === 'log' }"
@click="operationActive = 'log'"
+ class="tab-item">{{ $t('log') }}</span>
+ <span v-for="item in resultTabList" :key="item.id" :class="{
active: operationActive === item.id }"
+ @click="operationActive = item.id" class="tab-item">{{ item.id
}}</span>
</div>
<!-- <div v-if="!fullscreen" class="operation">
<a-tooltip placement="bottom" :title="$t('maximize')">
@@ -118,12 +119,9 @@ import SqlResult from './components/sql-result.vue'
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 { 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
@@ -139,12 +137,7 @@ export default defineComponent({
components: {
SqlEditor,
SqlResult,
- SqlLog,
- CheckCircleOutlined,
- CloseCircleOutlined,
- LoadingOutlined,
- ASelect,
- AButton
+ SqlLog
},
setup() {
const placeholder = reactive(usePlaceholder())
@@ -191,7 +184,7 @@ export default defineComponent({
}
}
- const getCatalogOps = async() => {
+ const getCatalogOps = async () => {
const res: ICatalogItem[] = await getCatalogList();
(res || []).forEach((ele: ICatalogItem) => {
catalogOptions.push({
@@ -206,7 +199,7 @@ export default defineComponent({
}
}
- const getShortcuts = async() => {
+ const getShortcuts = async () => {
const res: string[] = await getShortcutsList()
shortcuts.push(...(res || []))
}
@@ -227,7 +220,7 @@ export default defineComponent({
sqlLogRef.value.initData('')
}
- const handleDebug = async() => {
+ const handleDebug = async () => {
try {
if (!curCatalog.value) {
message.error(placeholder.selectClPh)
@@ -236,7 +229,7 @@ export default defineComponent({
showDebug.value = true
resetResult()
runStatus.value = 'Running'
- const res:ISessionInfo = await executeSql({
+ const res: ISessionInfo = await executeSql({
catalog: curCatalog.value,
sql: sqlSource.value
})
@@ -248,7 +241,7 @@ export default defineComponent({
}
}
- const stopDebug = async() => {
+ const stopDebug = async () => {
if (sessionId.value) {
operationActive.value = 'log'
logInterval.value && clearTimeout(logInterval.value)
@@ -260,13 +253,13 @@ export default defineComponent({
runStatus.value = 'Canceled'
}).catch(() => {
runStatus.value = 'Failed'
- }).finally (() => {
+ }).finally(() => {
readOnly.value = false
})
}
}
- const getDebugResult = async() => {
+ const getDebugResult = async () => {
try {
resultTabList.length = 0
const res: IDebugResult[] = await getJobDebugResult(sessionId.value ||
'0')
@@ -277,7 +270,7 @@ export default defineComponent({
}
}
- const getLogResult = async() => {
+ const getLogResult = async () => {
logInterval.value && clearTimeout(logInterval.value)
if (runStatus.value !== 'Running') {
return
@@ -308,7 +301,7 @@ export default defineComponent({
}
}
- const generateCode = async(code: string) => {
+ const generateCode = async (code: string) => {
try {
operationActive.value = 'log'
if (runStatus.value === 'Running') {
@@ -332,7 +325,7 @@ export default defineComponent({
return document.body
}
- const getLastSqlInfo = async() => {
+ const getLastSqlInfo = async () => {
try {
if (sqlEditorRef.value) {
sqlSource.value = getValueFromStorageByKey(storageSqlSourceKey)
@@ -440,10 +433,12 @@ export default defineComponent({
.console-wrap {
height: 100%;
padding: 16px 24px;
+
.console-content {
background-color: #fff;
height: 100%;
width: 100%;
+
&.fullscreen {
position: fixed;
top: 0;
@@ -451,9 +446,11 @@ export default defineComponent({
right: 0;
bottom: 0;
z-index: 99;
+
.sql-wrap {
flex: 1;
display: flex;
+
.sql-block {
flex: 1;
display: flex;
@@ -461,38 +458,47 @@ export default defineComponent({
}
}
}
+
.sql-wrap {
+ display: flex;
user-select: none;
font-size: 0;
border: 1px solid #e5e5e5;
border-bottom: 0;
+
.sql-block {
font-size: @font-size-base;
display: inline-block;
width: calc(100% - 200px);
height: 100%;
+
.top-ops {
padding: 6px 16px;
align-items: center;
}
+
.icon-svg {
color: #000;
cursor: pointer;
+
&:hover {
color: @primary-color;
}
}
+
.select-catalog {
.label {
padding-right: 8px;
}
}
+
.title-right {
display: flex;
justify-content: flex-end;
height: 32px;
align-items: center;
}
+
.sql-content {
// height: 440px;
height: calc(100% - 44px);
@@ -503,16 +509,19 @@ export default defineComponent({
position: relative;
display: flex;
flex-direction: column;
+
.sql-raw {
height: 100%;
overflow: hidden;
flex: 1;
}
+
.run-status {
height: 32px;
flex-shrink: 0;
}
}
+
.result-full {
height: auto;
position: absolute;
@@ -522,6 +531,7 @@ export default defineComponent({
bottom: 0;
}
}
+
.sql-shortcuts {
font-size: @font-size-base;
display: inline-block;
@@ -530,19 +540,23 @@ export default defineComponent({
// height: 484px;
height: 100%;
border-left: 1px solid #e5e5e5;
+
.shortcuts {
padding: 0 16px;
line-height: 44px;
border-bottom: 1px solid #e5e5e5;
}
+
.code {
width: 100px;
}
+
.ant-btn {
text-align: left;
}
}
}
+
.sql-result {
background-color: #fff;
border: 1px solid #e5e5e5;
@@ -555,6 +569,7 @@ export default defineComponent({
flex-direction: column;
position: relative;
flex: 1;
+
.drag-line {
position: absolute;
top: -1px;
@@ -563,6 +578,7 @@ export default defineComponent({
height: 6px;
font-size: 18px;
border-top: 1px solid #e5e5e5;
+
.icon {
position: absolute;
top: -12px;
@@ -571,21 +587,25 @@ export default defineComponent({
transform: rotate(90deg);
z-index: 3;
}
+
&:hover {
cursor: n-resize;
}
}
+
.debug-result {
flex: 1;
overflow: auto;
}
}
}
+
.debug-icon {
&:hover {
color: #1890ff;
}
}
+
.run-status {
padding: 6px 12px;
position: absolute;
@@ -595,6 +615,7 @@ export default defineComponent({
z-index: 2;
background-color: #fff;
}
+
.tab-operation {
display: flex;
justify-content: space-between;
@@ -602,28 +623,34 @@ export default defineComponent({
line-height: 40px;
border-bottom: 1px solid #e5e5e5;
padding: 0 20px 0 16px;
+
.tab {
display: flex;
+
.tab-item {
padding: 0 16px;
text-align: center;
cursor: pointer;
+
&.active {
border-bottom: 2px solid @primary-color;
}
}
}
+
.operation {
.icon-svg {
margin-right: 16px;
cursor: pointer;
+
&:hover {
color: @primary-color;
}
}
}
}
- .loading-icon{
+
+ .loading-icon {
display: block;
margin-top: 80px;
}
diff --git a/amoro-ams/amoro-ams-dashboard/vite.config.ts
b/amoro-ams/amoro-ams-dashboard/vite.config.ts
index 828720e22..9a954120c 100644
--- a/amoro-ams/amoro-ams-dashboard/vite.config.ts
+++ b/amoro-ams/amoro-ams-dashboard/vite.config.ts
@@ -22,6 +22,7 @@ import { vitePluginFakeServer } from 'vite-plugin-fake-server'
import path from 'node:path'
import {createSvgIconsPlugin} from 'vite-plugin-svg-icons'
import ViteComponents from 'unplugin-vue-components/vite'
+import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'
const css = {
preprocessorOptions: {
@@ -63,7 +64,14 @@ export default defineConfig({
createSvgIconsPlugin({
iconDirs: [path.resolve(process.cwd(), 'src/assets/icons/svg')],
}),
- ViteComponents()
+ ViteComponents({
+ resolvers: [
+ AntDesignVueResolver({
+ importStyle: false,
+ resolveIcons: true
+ })
+ ]
+ })
],
server: {
port: 8080,
