升级:升级 Arco Design Pro Vue 版本为 2.6.0(新增 TopMenu 顶部菜单栏功能,并修复部分 Bug,详情请参阅官方 CHANGELOG)

This commit is contained in:
Charles7c 2023-01-10 21:22:57 +08:00
parent 76fb698a37
commit 519124a3c7
13 changed files with 136 additions and 23 deletions

View File

@ -3,6 +3,7 @@ module.exports = {
'stylelint-config-standard',
'stylelint-config-rational-order',
'stylelint-config-prettier',
'stylelint-config-recommended-vue',
],
defaultSeverity: 'warning',
plugins: ['stylelint-order'],

View File

@ -31,7 +31,7 @@
"dependencies": {
"@arco-design/web-vue": "^2.40.1",
"@vueuse/core": "^9.9.0",
"arco-design-pro-vue": "^2.5.15",
"arco-design-pro-vue": "^2.6.0",
"axios": "^0.24.0",
"crypto-js": "^4.1.1",
"dayjs": "^1.11.7",
@ -73,17 +73,19 @@
"less": "^4.1.3",
"lint-staged": "^13.1.0",
"mockjs": "^1.1.0",
"postcss-html": "^1.5.0",
"prettier": "^2.8.1",
"rollup": "^2.79.1",
"rollup": "^3.9.1",
"rollup-plugin-visualizer": "^5.8.2",
"stylelint": "^14.13.0",
"stylelint-config-prettier": "^9.0.3",
"stylelint-config-rational-order": "^0.1.2",
"stylelint-config-recommended-vue": "^1.4.0",
"stylelint-config-standard": "^29.0.0",
"stylelint-order": "^5.0.0",
"typescript": "^4.9.4",
"unplugin-vue-components": "^0.22.8",
"vite": "3.1.7",
"vite": "^3.2.5",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-eslint": "^1.8.1",
"vite-plugin-imagemin": "^0.6.1",

View File

@ -50,6 +50,11 @@
if (key === 'menuFromServer' && value) {
await appStore.fetchServerMenuConfig();
}
if (key === 'topMenu') {
appStore.updateSettings({
menuCollapse: false,
});
}
appStore.updateSettings({ [key]: value });
};
</script>

View File

@ -43,6 +43,11 @@
key: 'menu',
defaultVal: appStore.menu,
},
{
name: 'settings.topMenu',
key: 'topMenu',
defaultVal: appStore.topMenu,
},
{ name: 'settings.footer', key: 'footer', defaultVal: appStore.footer },
{ name: 'settings.tabBar', key: 'tabBar', defaultVal: appStore.tabBar },
{

View File

@ -26,6 +26,7 @@
},
});
const topMenu = computed(() => appStore.topMenu);
const openKeys = ref<string[]>([]);
const selectedKey = ref<string[]>([]);
@ -126,6 +127,7 @@
return () => (
<a-menu
mode={topMenu.value ? 'horizontal' : 'vertical'}
v-model:collapsed={collapsed.value}
v-model:open-keys={openKeys.value}
show-collapse-button={appStore.device !== 'mobile'}
@ -133,7 +135,7 @@
selected-keys={selectedKey.value}
auto-open-selected={true}
level-indent={34}
style="height: 100%"
style="height: 100%; width:100%;"
onCollapse={setCollapse}
>
{renderSubMenu()}

View File

@ -13,12 +13,15 @@
ContiNew Admin
</a-typography-title>
<icon-menu-fold
v-if="appStore.device === 'mobile'"
v-if="!topMenu && appStore.device === 'mobile'"
style="font-size: 22px; cursor: pointer"
@click="toggleDrawerMenu"
/>
</a-space>
</div>
<div class="center-side">
<Menu v-if="topMenu" />
</div>
<ul class="right-side">
<li>
<a-tooltip :content="$t('settings.search')">
@ -186,6 +189,7 @@
import { LOCALE_OPTIONS } from '@/locale';
import useLocale from '@/hooks/locale';
import useUser from '@/hooks/user';
import Menu from '@/components/menu/index.vue';
import getAvatar from "@/utils/avatar";
import MessageBox from '../message-box/index.vue';
@ -198,6 +202,7 @@
const theme = computed(() => {
return appStore.theme;
});
const topMenu = computed(() => appStore.topMenu && appStore.menu);
const isDark = useDark({
selector: 'body',
attribute: 'arco-theme',
@ -259,6 +264,10 @@
padding-left: 20px;
}
.center-side {
flex: 1;
}
.right-side {
display: flex;
padding-right: 20px;

View File

@ -3,6 +3,7 @@
"colorWeak": false,
"navbar": true,
"menu": true,
"topMenu": false,
"hideMenu": false,
"menuCollapse": false,
"footer": true,

View File

@ -64,7 +64,7 @@
useResponsive(true);
const navbarHeight = `60px`;
const navbar = computed(() => appStore.navbar);
const renderMenu = computed(() => appStore.menu);
const renderMenu = computed(() => appStore.menu && !appStore.topMenu);
const hideMenu = computed(() => appStore.hideMenu);
const footer = computed(() => appStore.footer);
const menuWidth = computed(() => {

View File

@ -12,6 +12,7 @@ export default {
'settings.navbar.screen.toExit': 'Click to exit the full screen mode',
'settings.navbar.alerts': 'alerts',
'settings.menu': 'Menu',
'settings.topMenu': 'Top Menu',
'settings.tabBar': 'Tab Bar',
'settings.footer': 'Footer',
'settings.otherSettings': 'Other Settings',

View File

@ -12,6 +12,7 @@ export default {
'settings.navbar.screen.toExit': '点击退出全屏模式',
'settings.navbar.alerts': '消息通知',
'settings.menu': '菜单栏',
'settings.topMenu': '顶部菜单栏',
'settings.tabBar': '多页签',
'settings.footer': '底部',
'settings.otherSettings': '其他设置',

View File

@ -5,6 +5,7 @@ export interface AppState {
colorWeak: boolean;
navbar: boolean;
menu: boolean;
topMenu: boolean;
hideMenu: boolean;
menuCollapse: boolean;
footer: boolean;

View File

@ -70,7 +70,7 @@
<a-checkbox
checked="rememberMe"
:model-value="loginConfig.rememberMe"
@change="(setRememberMe as any)"
@change="setRememberMe as any"
>
{{ $t('login.form.rememberMe') }}
</a-checkbox>

View File

@ -1271,10 +1271,10 @@ archive-type@^4.0.0:
dependencies:
file-type "^4.2.0"
arco-design-pro-vue@^2.5.15:
version "2.5.15"
resolved "https://registry.npmmirror.com/arco-design-pro-vue/-/arco-design-pro-vue-2.5.15.tgz#f841641b09edaa009560308aac22782dea1c7733"
integrity sha512-FbLsKs3G9OWHVLb3o8GeD2MLFnoOzxd3O4e4amoOXiWcZFdHM05yTmcYCurpgs5lsacTzdoGigRye7SDDJxrxw==
arco-design-pro-vue@^2.6.0:
version "2.6.0"
resolved "https://registry.npmmirror.com/arco-design-pro-vue/-/arco-design-pro-vue-2.6.0.tgz#547c966ffa3efb35af08b8cb4064b837d9718bd0"
integrity sha512-WZipk+X/ceq9ER+1TwgoDEkWZWwg2xwq5sbsPx48H8jn/2d6uzVlRCar4y4wmfNIoPaLNGWuHN+d7H1ri/0xng==
dependencies:
fs-extra "^10.0.0"
minimist "^1.2.5"
@ -2429,14 +2429,23 @@ dom-serializer@^1.0.1:
domhandler "^4.2.0"
entities "^2.0.0"
dom-serializer@^2.0.0:
version "2.0.0"
resolved "https://registry.npmmirror.com/dom-serializer/-/dom-serializer-2.0.0.tgz#e41b802e1eedf9f6cae183ce5e622d789d7d8e53"
integrity sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==
dependencies:
domelementtype "^2.3.0"
domhandler "^5.0.2"
entities "^4.2.0"
domelementtype@1, domelementtype@^1.3.1:
version "1.3.1"
resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.1.tgz#d048c44b37b0d10a7f2a3d5fee3f4333d790481f"
integrity sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==
domelementtype@^2.0.1, domelementtype@^2.2.0:
domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
resolved "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==
domhandler@^2.3.0:
@ -2453,6 +2462,13 @@ domhandler@^4.2.0, domhandler@^4.3.1:
dependencies:
domelementtype "^2.2.0"
domhandler@^5.0.1, domhandler@^5.0.2:
version "5.0.3"
resolved "https://registry.npmmirror.com/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31"
integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==
dependencies:
domelementtype "^2.3.0"
domutils@^1.5.1:
version "1.7.0"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
@ -2470,6 +2486,15 @@ domutils@^2.8.0:
domelementtype "^2.2.0"
domhandler "^4.2.0"
domutils@^3.0.1:
version "3.0.1"
resolved "https://registry.npmmirror.com/domutils/-/domutils-3.0.1.tgz#696b3875238338cb186b6c0612bd4901c89a4f1c"
integrity sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==
dependencies:
dom-serializer "^2.0.0"
domelementtype "^2.3.0"
domhandler "^5.0.1"
dot-case@^3.0.4:
version "3.0.4"
resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751"
@ -2583,6 +2608,11 @@ entities@^2.0.0:
resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
entities@^4.2.0, entities@^4.3.0:
version "4.4.0"
resolved "https://registry.npmmirror.com/entities/-/entities-4.4.0.tgz#97bdaba170339446495e653cfd2db78962900174"
integrity sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==
errno@^0.1.1:
version "0.1.8"
resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.8.tgz#8bb3e9c7d463be4976ff888f76b4809ebc2e811f"
@ -4038,6 +4068,16 @@ htmlparser2@^3.10.0:
inherits "^2.0.1"
readable-stream "^3.1.1"
htmlparser2@^8.0.0:
version "8.0.1"
resolved "https://registry.npmmirror.com/htmlparser2/-/htmlparser2-8.0.1.tgz#abaa985474fcefe269bc761a779b544d7196d010"
integrity sha512-4lVbmc1diZC7GUJQtRQ5yBAeUCL1exyMwmForWkRLnwyzWBFxN633SALPMGYaWZvKe9j1pRZJpauvmxENSp/EA==
dependencies:
domelementtype "^2.3.0"
domhandler "^5.0.2"
domutils "^3.0.1"
entities "^4.3.0"
http-cache-semantics@3.8.1:
version "3.8.1"
resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-3.8.1.tgz#39b0e16add9b605bf0a9ef3d9daaf4843b4cacd2"
@ -4700,6 +4740,11 @@ js-tokens@^4.0.0:
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
js-tokens@^8.0.0:
version "8.0.0"
resolved "https://registry.npmmirror.com/js-tokens/-/js-tokens-8.0.0.tgz#5dbe2cdfa9afc93251d3a77bf18c3ad6fa8a4de4"
integrity sha512-PC7MzqInq9OqKyTXfIvQNcjMkODJYC8A17kAaQgeW79yfhqTWSOfjHYQ2mDDcwJ96Iibtwkfh0C7R/OvqPlgVA==
js-yaml@^3.13.1:
version "3.14.1"
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.14.1.tgz#dae812fdb3825fa306609a8717383c50c36a0537"
@ -6052,6 +6097,16 @@ postcss-html@^0.36.0:
dependencies:
htmlparser2 "^3.10.0"
postcss-html@^1.5.0:
version "1.5.0"
resolved "https://registry.npmmirror.com/postcss-html/-/postcss-html-1.5.0.tgz#57a43bc9e336f516ecc448a37d2e8c2290170a6f"
integrity sha512-kCMRWJRHKicpA166kc2lAVUGxDZL324bkj/pVOb6RhjB0Z5Krl7mN0AsVkBhVIRZZirY0lyQXG38HCVaoKVNoA==
dependencies:
htmlparser2 "^8.0.0"
js-tokens "^8.0.0"
postcss "^8.4.0"
postcss-safe-parser "^6.0.0"
postcss-jsx@^0.36.0:
version "0.36.4"
resolved "https://registry.yarnpkg.com/postcss-jsx/-/postcss-jsx-0.36.4.tgz#37a68f300a39e5748d547f19a747b3257240bd50"
@ -6174,7 +6229,7 @@ postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.13, postcss@^7.0.14, postcss@^7.0.2
picocolors "^0.2.1"
source-map "^0.6.1"
postcss@^8.1.10, postcss@^8.3.11, postcss@^8.4.16, postcss@^8.4.19:
postcss@^8.1.10, postcss@^8.3.11, postcss@^8.4.19:
version "8.4.20"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.20.tgz#64c52f509644cecad8567e949f4081d98349dc56"
integrity sha512-6Q04AXR1212bXr5fh03u8aAwbLxAQNGQ/Q1LNa0VfOI06ZAlhPHtQvE4OIdpj4kLThXilalPnmDSOD65DcHt+g==
@ -6183,6 +6238,15 @@ postcss@^8.1.10, postcss@^8.3.11, postcss@^8.4.16, postcss@^8.4.19:
picocolors "^1.0.0"
source-map-js "^1.0.2"
postcss@^8.4.0, postcss@^8.4.18:
version "8.4.21"
resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
dependencies:
nanoid "^3.3.4"
picocolors "^1.0.0"
source-map-js "^1.0.2"
prelude-ls@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
@ -6602,13 +6666,20 @@ rollup-plugin-visualizer@^5.8.2:
source-map "^0.7.4"
yargs "^17.5.1"
rollup@^2.56.3, rollup@^2.77.2, rollup@^2.79.1, rollup@~2.78.0:
rollup@^2.56.3, rollup@^2.77.2, rollup@^2.79.1:
version "2.79.1"
resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.79.1.tgz#bedee8faef7c9f93a2647ac0108748f497f081c7"
integrity sha512-uKxbd0IhMZOhjAiD5oAFp7BqvkA4Dv47qpOCtaNvng4HBwdbWtdOh8f5nZNuk2rp51PMGk3bzfWu5oayNEuYnw==
optionalDependencies:
fsevents "~2.3.2"
rollup@^3.9.1:
version "3.9.1"
resolved "https://registry.npmmirror.com/rollup/-/rollup-3.9.1.tgz#27501d3d026418765fe379d5620d25954ff2a011"
integrity sha512-GswCYHXftN8ZKGVgQhTFUJB/NBXxrRGgO2NCy6E8s1rwEJ4Q9/VttNqcYfEvx4dTo4j58YqdC3OVztPzlKSX8w==
optionalDependencies:
fsevents "~2.3.2"
run-parallel@^1.1.9:
version "1.2.0"
resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"
@ -7192,6 +7263,11 @@ style-search@^0.1.0:
resolved "https://registry.yarnpkg.com/style-search/-/style-search-0.1.0.tgz#7958c793e47e32e07d2b5cafe5c0bf8e12e77902"
integrity sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==
stylelint-config-html@>=1.0.0:
version "1.1.0"
resolved "https://registry.npmmirror.com/stylelint-config-html/-/stylelint-config-html-1.1.0.tgz#999db19aea713b7ff6dde92ada76e4c1bd812b66"
integrity sha512-IZv4IVESjKLumUGi+HWeb7skgO6/g4VMuAYrJdlqQFndgbj6WJAXPhaysvBiXefX79upBdQVumgYcdd17gCpjQ==
stylelint-config-prettier@^9.0.3:
version "9.0.4"
resolved "https://registry.yarnpkg.com/stylelint-config-prettier/-/stylelint-config-prettier-9.0.4.tgz#1b1dda614d5b3ef6c1f583fa6fa55f88245eb00b"
@ -7205,9 +7281,18 @@ stylelint-config-rational-order@^0.1.2:
stylelint "^9.10.1"
stylelint-order "^2.2.1"
stylelint-config-recommended@^9.0.0:
stylelint-config-recommended-vue@^1.4.0:
version "1.4.0"
resolved "https://registry.npmmirror.com/stylelint-config-recommended-vue/-/stylelint-config-recommended-vue-1.4.0.tgz#0a182da17dc9e846e4bec65a7676ccf882b35964"
integrity sha512-DVJqyX2KvMCn9U0+keL12r7xlsH26K4Vg8NrIZuq5MoF7g82DpMp326Om4E0Q+Il1o+bTHuUyejf2XAI0iD04Q==
dependencies:
semver "^7.3.5"
stylelint-config-html ">=1.0.0"
stylelint-config-recommended ">=6.0.0"
stylelint-config-recommended@>=6.0.0, stylelint-config-recommended@^9.0.0:
version "9.0.0"
resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz#1c9e07536a8cd875405f8ecef7314916d94e7e40"
resolved "https://registry.npmmirror.com/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz#1c9e07536a8cd875405f8ecef7314916d94e7e40"
integrity sha512-9YQSrJq4NvvRuTbzDsWX3rrFOzOlYBmZP+o513BJN/yfEmGSr0AxdvrWs0P/ilSpVV/wisamAHu5XSk8Rcf4CQ==
stylelint-config-standard@^29.0.0:
@ -7984,15 +8069,15 @@ vite-svg-loader@^3.6.0:
"@vue/compiler-sfc" "^3.2.20"
svgo "^2.7.0"
vite@3.1.7:
version "3.1.7"
resolved "https://registry.npmmirror.com/vite/-/vite-3.1.7.tgz#9fc2b57a395f79175d38fa3cffd15080b0d9cbfc"
integrity sha512-5vCAmU4S8lyVdFCInu9M54f/g8qbOMakVw5xJ4pjoaDy5wgy9sLLZkGdSLN52dlsBqh0tBqxjaqqa8LgPqwRAA==
vite@^3.2.5:
version "3.2.5"
resolved "https://registry.npmmirror.com/vite/-/vite-3.2.5.tgz#dee5678172a8a0ab3e547ad4148c3d547f90e86a"
integrity sha512-4mVEpXpSOgrssFZAOmGIr85wPHKvaDAcXqxVxVRZhljkJOMZi1ibLibzjLHzJvcok8BMguLc7g1W6W/GqZbLdQ==
dependencies:
esbuild "^0.15.9"
postcss "^8.4.16"
postcss "^8.4.18"
resolve "^1.22.1"
rollup "~2.78.0"
rollup "^2.79.1"
optionalDependencies:
fsevents "~2.3.2"