chore: merge branch 'main' of https://github.com/anncwb/vue-vben-admin into main

This commit is contained in:
vben 2021-04-08 23:37:12 +08:00
commit f473ba7754
18 changed files with 127 additions and 71 deletions

View File

@ -1,3 +1,10 @@
## Wip
### 🐛 Bug Fixes
- 登录页样式修复
- 修复菜单已知问题
## 2.2.0 (2021-04-06)
### ✨ Features

View File

@ -3,6 +3,7 @@
* https://github.com/anncwb/vite-plugin-theme
*/
import type { Plugin } from 'vite';
import path from 'path';
import {
viteThemePlugin,
antdDarkThemePlugin,
@ -25,12 +26,11 @@ export function configThemePlugin(isBuild: boolean): Plugin[] {
colorVariables: [...getThemeColors(), ...colors],
}),
antdDarkThemePlugin({
filter: (id) => {
if (isBuild) {
return !id.endsWith('antd.less');
}
return true;
},
preloadFiles: [
path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.less'),
path.resolve(process.cwd(), 'src/design/index.less'),
],
filter: (id) => (isBuild ? !id.endsWith('antd.less') : true),
// extractCss: false,
darkModifyVars: {
...generateModifyVars(true),

View File

@ -32,7 +32,7 @@
},
"dependencies": {
"@iconify/iconify": "^2.0.0-rc.6",
"@vueuse/core": "^4.7.0",
"@vueuse/core": "^4.8.0",
"@zxcvbn-ts/core": "^0.3.0",
"ant-design-vue": "^2.1.2",
"axios": "^0.21.1",
@ -45,7 +45,7 @@
"qrcode": "^1.4.4",
"sortablejs": "^1.13.0",
"vue": "3.0.11",
"vue-i18n": "^9.0.0",
"vue-i18n": "9.0.0",
"vue-router": "^4.0.6",
"vue-types": "^3.0.2",
"vuex": "^4.0.0",
@ -54,7 +54,7 @@
"devDependencies": {
"@commitlint/cli": "^12.1.1",
"@commitlint/config-conventional": "^12.1.1",
"@iconify/json": "^1.1.325",
"@iconify/json": "^1.1.327",
"@purge-icons/generated": "^0.7.0",
"@types/crypto-js": "^4.0.1",
"@types/fs-extra": "^9.0.10",
@ -100,17 +100,17 @@
"stylelint-config-standard": "^21.0.0",
"stylelint-order": "^4.1.0",
"ts-node": "^9.1.1",
"typescript": "4.2.3",
"typescript": "4.2.4",
"vite": "2.1.5",
"vite-plugin-compression": "^0.2.4",
"vite-plugin-html": "^2.0.6",
"vite-plugin-imagemin": "^0.3.0",
"vite-plugin-mock": "^2.5.0",
"vite-plugin-purge-icons": "^0.7.0",
"vite-plugin-pwa": "^0.6.5",
"vite-plugin-pwa": "^0.7.0",
"vite-plugin-style-import": "^0.9.2",
"vite-plugin-svg-icons": "^0.4.1",
"vite-plugin-theme": "^0.6.0",
"vite-plugin-theme": "^0.6.3",
"vite-plugin-windicss": "0.12.5",
"vue-eslint-parser": "^7.6.0"
},

View File

@ -3,7 +3,6 @@
v-if="getShowDarkModeToggle"
:class="[
prefixCls,
`${prefixCls}--${size}`,
{
[`${prefixCls}--dark`]: isDark,
},
@ -30,13 +29,13 @@
export default defineComponent({
name: 'DarkModeToggle',
components: { SvgIcon },
props: {
size: {
type: String,
default: 'default',
validate: (val) => ['default', 'large'].includes(val),
},
},
// props: {
// size: {
// type: String,
// default: 'default',
// validate: (val) => ['default', 'large'].includes(val),
// },
// },
setup() {
const { prefixCls } = useDesign('dark-mode-toggle');
const { getDarkMode, setDarkMode, getShowDarkModeToggle } = useRootSetting();
@ -97,15 +96,15 @@
}
}
&--large {
width: 72px;
height: 34px;
padding: 0 10px;
// &--large {
// width: 70px;
// height: 34px;
// padding: 0 10px;
.@{prefix-cls}-inner {
width: 26px;
height: 26px;
}
}
// .@{prefix-cls}-inner {
// width: 26px;
// height: 26px;
// }
// }
}
</style>

View File

@ -210,7 +210,7 @@
props.setFormModel(field, value);
},
};
const Comp = componentMap.get(component) as typeof defineComponent;
const Comp = componentMap.get(component) as ReturnType<typeof defineComponent>;
const { autoSetPlaceHolder, size } = props.formProps;
const propsData: Recordable = {

View File

@ -78,9 +78,10 @@
if (isString(size)) {
fs = parseInt(size, 10);
}
return {
fontSize: `${fs}px`,
color,
color: color,
display: 'inline-flex',
};
}

View File

@ -1,11 +1,12 @@
<template>
<Menu
v-bind="getBindValues"
@select="handleSelect"
:activeName="activeName"
:openNames="getOpenKeys"
:class="prefixCls"
:activeSubMenuNames="activeSubMenuNames"
@select="handleSelect"
@open-change="handleOpenChange"
>
<template v-for="item in items" :key="item.path">
<SimpleSubMenu
@ -53,6 +54,7 @@
beforeClickFn: {
type: Function as PropType<(key: string) => Promise<boolean>>,
},
isSplitMenu: propTypes.bool,
},
emits: ['menuClick'],
setup(props, { attrs, emit }) {
@ -94,6 +96,9 @@
watch(
() => props.items,
() => {
if (!props.isSplitMenu) {
return;
}
setOpenKeys(currentRoute.value.path);
},
{ flush: 'post' }
@ -135,11 +140,17 @@
menuState.activeName = key;
}
function handleOpenChange(v) {
console.log('======================');
console.log(v);
console.log('======================');
}
return {
prefixCls,
getBindValues,
handleSelect,
getOpenKeys,
handleOpenChange,
...toRefs(menuState),
};
},

View File

@ -138,6 +138,15 @@
});
emit('select', name);
});
rootMenuEmitter.on('open-name-change', ({ name, opened }) => {
if (opened && !openedNames.value.includes(name)) {
openedNames.value.push(name);
} else if (!opened) {
const index = openedNames.value.findIndex((item) => item === name);
index !== -1 && openedNames.value.splice(index, 1);
}
});
});
return { getClass, openedNames };

View File

@ -66,11 +66,16 @@
function handleClickItem() {
const { disabled } = props;
if (disabled) return;
if (disabled) {
return;
}
rootMenuEmitter.emit('on-menu-item-select', props.name);
if (unref(getCollapse)) return;
if (unref(getCollapse)) {
return;
}
const { uidList } = getParentList();
rootMenuEmitter.emit('on-update-opened', {
opend: false,
parent: instance?.parent,

View File

@ -43,8 +43,9 @@
:class="`${prefixCls}-submenu-title-icon`"
/>
</div>
<template #content>
<div v-bind="getEvents(true)" v-show="opened">
<!-- eslint-disable-next-line -->
<template #content v-show="opened">
<div v-bind="getEvents(true)">
<ul :class="[prefixCls, `${prefixCls}-${getTheme}`, `${prefixCls}-popup`]">
<slot></slot>
</ul>
@ -78,7 +79,7 @@
import { isBoolean, isObject } from '/@/utils/is';
import Mitt from '/@/utils/mitt';
const DELAY = 250;
const DELAY = 200;
export default defineComponent({
name: 'SubMenu',
components: {
@ -189,6 +190,7 @@
const { disabled } = props;
if (disabled || unref(getCollapse)) return;
const opened = state.opened;
if (unref(getAccordion)) {
const { uidList } = getParentList();
rootMenuEmitter.emit('on-update-opened', {
@ -196,6 +198,11 @@
parent: instance?.parent,
uidList: uidList,
});
} else {
rootMenuEmitter.emit('open-name-change', {
name: props.name,
opened: !opened,
});
}
state.opened = !opened;
}

View File

@ -8,7 +8,7 @@ import { uniq } from 'lodash-es';
import { getAllParentPath } from '/@/router/helper/menuHelper';
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
import { useDebounce } from '../../../hooks/core/useDebounce';
import { useDebounce } from '/@/hooks/core/useDebounce';
export function useOpenKeys(
menuState: MenuState,

View File

@ -28,7 +28,7 @@ export function useECharts(
return cacheOptions.value;
}
return {
backgroundColor: '#151515',
backgroundColor: 'transparent',
...cacheOptions.value,
};
}

View File

@ -49,6 +49,7 @@
getAccordion,
getIsHorizontal,
getIsSidebarType,
getSplit,
} = useMenuSetting();
const { getShowLogo } = useRootSetting();
@ -144,7 +145,7 @@
// console.log(menus);
if (!menus || !menus.length) return null;
return !props.isHorizontal ? (
<SimpleMenu {...menuProps} items={menus} />
<SimpleMenu {...menuProps} isSplitMenu={unref(getSplit)} items={menus} />
) : (
<BasicMenu
{...menuProps}

View File

@ -408,7 +408,7 @@ export default defineComponent({
wrapClassName="setting-drawer"
>
{unref(getShowDarkModeToggle) && <Divider>{() => t('layout.setting.darkMode')}</Divider>}
{unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" size="large" />}
{unref(getShowDarkModeToggle) && <AppDarkModeToggle class="mx-auto" />}
<Divider>{() => t('layout.setting.navMode')}</Divider>
{renderSidebar()}
<Divider>{() => t('layout.setting.sysTheme')}</Divider>

View File

@ -82,7 +82,7 @@ html[data-theme='dark'] {
.ant-tabs-tab-active {
position: relative;
padding-left: 18px;
color: @white;
color: @white !important;
background: @primary-color;
border: 0;
transition: none;

View File

@ -30,6 +30,7 @@
</div>
<div class="h-full xl:h-auto flex py-5 xl:py-0 xl:my-0 w-full xl:w-6/12">
<div
:class="`${prefixCls}-form`"
class="my-auto mx-auto xl:ml-20 xl:bg-transparent px-5 py-8 sm:px-8 xl:p-4 rounded-md shadow-md xl:shadow-none w-full sm:w-3/4 lg:w-2/4 xl:w-auto enter-x relative"
>
<LoginForm />
@ -89,10 +90,11 @@
@prefix-cls: ~'@{namespace}-login';
@logo-prefix-cls: ~'@{namespace}-app-logo';
@countdown-prefix-cls: ~'@{namespace}-countdown-input';
@dark-bg: #293146;
html[data-theme='dark'] {
.@{prefix-cls} {
background: #293146;
background: @dark-bg;
&::before {
background-image: url(/@/assets/svg/login-bg-dark.svg);
@ -106,12 +108,25 @@
.ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
border: 1px solid #4a5569;
}
&-form {
background: transparent !important;
}
.app-iconify {
color: #fff;
}
}
}
.@{prefix-cls} {
overflow: hidden;
@media (max-width: @screen-xl) {
background: linear-gradient(180deg, #1c3faa, #1c3faa);
background: #293146;
.@{prefix-cls}-form {
background: #fff;
}
}
&::before {

View File

@ -46,7 +46,7 @@
{{ t('sys.login.mobileSignInFormTitle') }}
</Button>
</ACol>
<ACol :md="8" :xs="24" class="xs:my-2 md:my-0 xs:mx-0 md:mx-2">
<ACol :md="8" :xs="24" class="!my-2 !md:my-0 xs:mx-0 md:mx-2">
<Button block @click="setLoginState(LoginStateEnum.QR_CODE)">
{{ t('sys.login.qrSignInFormTitle') }}
</Button>

View File

@ -1136,10 +1136,10 @@
dependencies:
cross-fetch "^3.0.6"
"@iconify/json@^1.1.325":
version "1.1.325"
resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.325.tgz#99127b4b467e04a9817d066a9237fea47fdb8925"
integrity sha512-lqLTB9p6qQxL9vH794xnY+MIty08vkrUflxLXM2uykH7Pt/LU8Pk5DDd3XgJS/L4lnkBgOuXM27uvejSSGupMw==
"@iconify/json@^1.1.327":
version "1.1.327"
resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.327.tgz#78d021a7f730c01863e56ee5b4c0eaf4ca69db43"
integrity sha512-S4Zw/5yqQaGpkYe8ubB+0PRXQl5UZOdsYhvShzI2FSqOjwjhpPG4X6DUTH6WD8oGkCpRa/B7tK9asYefjCax7w==
"@intlify/core-base@9.0.0":
version "9.0.0"
@ -1762,18 +1762,18 @@
resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==
"@vueuse/core@^4.7.0":
version "4.7.0"
resolved "https://registry.npmjs.org/@vueuse/core/-/core-4.7.0.tgz#733f4b86832346a014dfdf818e3773ebfcbaebc4"
integrity sha512-0Kmo+Gqn47aCg6HHFUvXabD/T5haWyC5pk2PEzaGay9dGE7D+sc05Y1h2MylzcFzRX/2G4anOxSuDqmvQ/GunQ==
"@vueuse/core@^4.8.0":
version "4.8.0"
resolved "https://registry.npmjs.org/@vueuse/core/-/core-4.8.0.tgz#d86e36956521c0f9b6571cb58b27f0e2535259b3"
integrity sha512-nUH4Hn1DN4kkuF1r5ZcfGnjoAKDD0Kw9oFnt/TUo1aueNijq4KujagtoQN8OC4Pei10TeTDdqhmZAWnaCE1NbA==
dependencies:
"@vueuse/shared" "4.7.0"
"@vueuse/shared" "4.8.0"
vue-demi latest
"@vueuse/shared@4.7.0":
version "4.7.0"
resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-4.7.0.tgz#b18de574f4b42382441765fb510f26421c3a72ca"
integrity sha512-a9wmH6g+dh6ALeOejIL53s1HkASyOldbHunwEUEtRdgQyUCnU+RRiYTZlNLEyt1r79kPtnBjp5fHq0X36H96MA==
"@vueuse/shared@4.8.0":
version "4.8.0"
resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-4.8.0.tgz#abf3da96ca81b4be82e885928193fef2c676cdbc"
integrity sha512-g1lSbHD4ptiS74qBUvffJ98QjRsoCH7ILjxVzJF488EPAmp5z3taLnoggt6NXfonnYve7fEPuqsJqd2BLOxT1A==
dependencies:
vue-demi latest
@ -8813,10 +8813,10 @@ typedarray-to-buffer@^3.1.5:
dependencies:
is-typedarray "^1.0.0"
typescript@4.2.3:
version "4.2.3"
resolved "https://registry.npmjs.org/typescript/-/typescript-4.2.3.tgz#39062d8019912d43726298f09493d598048c1ce3"
integrity sha512-qOcYwxaByStAWrBf4x0fibwZvMRG+r4cQoTjbPtUlrWjBHbmCAww1i448U0GJ+3cNNEtebDteo/cHOR3xJ4wEw==
typescript@4.2.4:
version "4.2.4"
resolved "https://registry.npmjs.org/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==
uglify-js@^3.1.4:
version "3.13.1"
@ -9133,14 +9133,15 @@ vite-plugin-purge-icons@^0.7.0:
"@purge-icons/generated" "^0.7.0"
rollup-plugin-purge-icons "^0.7.0"
vite-plugin-pwa@^0.6.5:
version "0.6.5"
resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.6.5.tgz#04bb01c7363260bfb6ee8d6b976ef954e23b8adc"
integrity sha512-OBp1hIuVVwA0gEVCF3RsfaRrZWlIUOS4yYttLpznCH69BoGvgPH8M9qVGMj7/KbMI4+2YbTo7YzwSl+LWHX49A==
vite-plugin-pwa@^0.7.0:
version "0.7.0"
resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.7.0.tgz#cde774b2a65dbd84dc8831c964898563f7e2c22c"
integrity sha512-Mf7O5Ecubv25nSSdkfpeackVKX9+SOpH7U2I6IFPb/NupG7wn3KzBOke3ksu+bA8GzN5923vD/kw1GWOsLZL4w==
dependencies:
debug "^4.3.2"
fast-glob "^3.2.5"
pretty-bytes "^5.6.0"
rollup "^2.44.0"
workbox-build "^6.1.2"
workbox-window "^6.1.2"
@ -9167,10 +9168,10 @@ vite-plugin-svg-icons@^0.4.1:
svg-baker "1.7.0"
svgo "^2.3.0"
vite-plugin-theme@^0.6.0:
version "0.6.0"
resolved "https://registry.npmjs.org/vite-plugin-theme/-/vite-plugin-theme-0.6.0.tgz#7abba80f0f615c245dd7385fdea00b008b89d769"
integrity sha512-ZG6QLET0QbwGTTXxRQOjXNMKY8iEzUMu0mls4vBIhKc30Rq3NHl6Kxg0Zgd+BvOyQva8joP2fVsxr+1CV4383Q==
vite-plugin-theme@^0.6.3:
version "0.6.3"
resolved "https://registry.npmjs.org/vite-plugin-theme/-/vite-plugin-theme-0.6.3.tgz#77be00b039eb53452c9adfce7fd90e39a39a81ee"
integrity sha512-ffhnqCtCG/0Y7egfiF9upJRo5ZEKS6lQOQsSztqu8gA2/SGsNTm3lsmEWvARMeUAj/8aF5PYzAv5EikfhcPENQ==
dependencies:
"@types/node" "^14.14.37"
"@types/tinycolor2" "^1.4.2"
@ -9220,7 +9221,7 @@ vue-eslint-parser@^7.6.0:
esquery "^1.4.0"
lodash "^4.17.15"
vue-i18n@^9.0.0:
vue-i18n@9.0.0:
version "9.0.0"
resolved "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.0.0.tgz#a04c41d5ed3d5a068e923517bfaa0abcbc84e174"
integrity sha512-iks0eJDv/4cK/7tl/ooMUroNVVIGOK4kKS1PIHmPQk7QjT/sDfFM84vjPKgpARbw0GjJsOiADL43jufNfs9e9A==