Skip to content

B
basic-vue-admin
提交 55e9d9fc 作者: Vben
操作

perf: optimize components and add comments

上级 84d9300e
正在显示 包含 533 行增加 和 527 行删除
package.json
......@@ -35,7 +35,7 @@
"@iconify/iconify": "^2.0.1",
"@logicflow/core": "^0.4.11",
"@logicflow/extension": "^0.4.12",
"@vueuse/core": "^4.11.2",
"@vueuse/core": "^5.0.1",
"@zxcvbn-ts/core": "^0.3.0",
"ant-design-vue": "2.1.2",
"axios": "^0.21.1",
......@@ -63,7 +63,7 @@
"devDependencies": {
"@commitlint/cli": "^12.1.4",
"@commitlint/config-conventional": "^12.1.4",
"@iconify/json": "^1.1.353",
"@iconify/json": "^1.1.354",
"@purge-icons/generated": "^0.7.0",
"@types/codemirror": "^5.60.0",
"@types/crypto-js": "^4.0.1",
......@@ -71,13 +71,13 @@
"@types/inquirer": "^7.3.1",
"@types/lodash-es": "^4.17.4",
"@types/mockjs": "^1.0.3",
"@types/node": "^15.12.1",
"@types/node": "^15.12.2",
"@types/nprogress": "^0.2.0",
"@types/qrcode": "^1.4.0",
"@types/qs": "^6.9.6",
"@types/sortablejs": "^1.10.6",
"@typescript-eslint/eslint-plugin": "^4.26.0",
"@typescript-eslint/parser": "^4.26.0",
"@typescript-eslint/eslint-plugin": "^4.26.1",
"@typescript-eslint/parser": "^4.26.1",
"@vitejs/plugin-legacy": "^1.4.1",
"@vitejs/plugin-vue": "^1.2.3",
"@vitejs/plugin-vue-jsx": "^1.1.5",
......@@ -92,7 +92,7 @@
"eslint-define-config": "^1.0.8",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-vue": "^7.10.0",
"esno": "^0.7.0",
"esno": "^0.7.1",
"fs-extra": "^10.0.0",
"http-server": "^0.12.3",
"husky": "^6.0.0",
......@@ -121,14 +121,14 @@
"vite-plugin-style-import": "^0.10.1",
"vite-plugin-svg-icons": "^0.7.0",
"vite-plugin-theme": "^0.8.1",
"vite-plugin-windicss": "^1.0.1",
"vite-plugin-windicss": "^1.0.2",
"vue-eslint-parser": "^7.6.0",
"vue-tsc": "^0.1.7"
},
"resolutions": {
"//": "Used to install imagemin dependencies, because imagemin may not be installed in China. If it is abroad, you can delete it",
"bin-wrapper": "npm:bin-wrapper-china",
"rollup": "^2.51.0"
"rollup": "^2.51.1"
},
"repository": {
"type": "git",
......
src/components/Application/index.ts
import AppLogo from './src/AppLogo.vue';
import AppProvider from './src/AppProvider.vue';
import AppSearch from './src/search/AppSearch.vue';
import AppLocalePicker from './src/AppLocalePicker.vue';
import AppDarkModeToggle from './src/AppDarkModeToggle.vue';
import { withInstall } from '/@/utils';
import appLogo from './src/AppLogo.vue';
import appProvider from './src/AppProvider.vue';
import appSearch from './src/search/AppSearch.vue';
import appLocalePicker from './src/AppLocalePicker.vue';
import appDarkModeToggle from './src/AppDarkModeToggle.vue';
export { useAppProviderContext } from './src/useAppContext';
export { AppLogo, AppProvider, AppSearch, AppLocalePicker, AppDarkModeToggle };
export const AppLogo = withInstall(appLogo);
export const AppProvider = withInstall(appProvider);
export const AppSearch = withInstall(appSearch);
export const AppLocalePicker = withInstall(appLocalePicker);
export const AppDarkModeToggle = withInstall(appDarkModeToggle);
src/components/Application/src/AppDarkModeToggle.vue
<template>
<div
v-if="getShowDarkModeToggle"
:class="[
prefixCls,
{
[`${prefixCls}--dark`]: isDark,
},
]"
@click="toggleDarkMode"
>
<div v-if="getShowDarkModeToggle" :class="getClass" @click="toggleDarkMode">
<div :class="`${prefixCls}-inner`"> </div>
<SvgIcon size="14" name="sun" />
<SvgIcon size="14" name="moon" />
......@@ -16,25 +7,29 @@
</template>
<script lang="ts">
import { defineComponent, computed } from 'vue';
import { useDesign } from '/@/hooks/web/useDesign';
import { SvgIcon } from '/@/components/Icon';
import { useDesign } from '/@/hooks/web/useDesign';
import { useRootSetting } from '/@/hooks/setting/useRootSetting';
import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground';
import { updateDarkTheme } from '/@/logics/theme/dark';
import { ThemeEnum } from '/@/enums/appEnum';
export default defineComponent({
name: 'DarkModeToggle',
components: { SvgIcon },
setup() {
const { prefixCls } = useDesign('dark-mode-toggle');
const { prefixCls } = useDesign('dark-switch');
const { getDarkMode, setDarkMode, getShowDarkModeToggle } = useRootSetting();
const isDark = computed(() => getDarkMode.value === ThemeEnum.DARK);
const getClass = computed(() => [
prefixCls,
{
[`${prefixCls}--dark`]: isDark,
},
]);
function toggleDarkMode() {
const darkMode = getDarkMode.value === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK;
setDarkMode(darkMode);
......@@ -44,6 +39,7 @@
}
return {
getClass,
isDark,
prefixCls,
toggleDarkMode,
......@@ -53,7 +49,7 @@
});
</script>
<style lang="less" scoped>
@prefix-cls: ~'@{namespace}-dark-mode-toggle';
@prefix-cls: ~'@{namespace}-dark-switch';
html[data-theme='dark'] {
.@{prefix-cls} {
......
src/components/Application/src/AppLocalePicker.vue
......@@ -13,39 +13,44 @@
>
<span class="cursor-pointer flex items-center">
<Icon icon="ion:language" />
<span v-if="showText" class="ml-1">{{ getLangText }}</span>
<span v-if="showText" class="ml-1">{{ getLocaleText }}</span>
</span>
</Dropdown>
</template>
<script lang="ts">
import type { LocaleType } from '/#/config';
import type { DropMenu } from '/@/components/Dropdown';
import { defineComponent, ref, watchEffect, unref, computed } from 'vue';
import { Dropdown } from '/@/components/Dropdown';
import Icon from '/@/components/Icon';
import { Icon } from '/@/components/Icon';
import { useLocale } from '/@/locales/useLocale';
import { localeList } from '/@/settings/localeSetting';
import { propTypes } from '/@/utils/propTypes';
const props = {
/**
* Whether to display text
*/
showText: { type: Boolean, default: true },
/**
* Whether to refresh the interface when changing
*/
reload: { type: Boolean },
};
export default defineComponent({
name: 'AppLocalPicker',
components: { Dropdown, Icon },
props: {
// Whether to display text
showText: propTypes.bool.def(true),
// Whether to refresh the interface when changing
reload: propTypes.bool,
},
props,
setup(props) {
const selectedKeys = ref<string[]>([]);
const { changeLocale, getLocale } = useLocale();
const getLangText = computed(() => {
const getLocaleText = computed(() => {
const key = selectedKeys.value[0];
if (!key) return '';
if (!key) {
return '';
}
return localeList.find((item) => item.event === key)?.text;
});
......@@ -60,11 +65,13 @@
}
function handleMenuEvent(menu: DropMenu) {
if (unref(getLocale) === menu.event) return;
if (unref(getLocale) === menu.event) {
return;
}
toggleLocale(menu.event as string);
}
return { localeList, handleMenuEvent, selectedKeys, getLangText };
return { localeList, handleMenuEvent, selectedKeys, getLocaleText };
},
});
</script>
......
src/components/Application/src/AppLogo.vue
......@@ -3,63 +3,69 @@
* @Description: logo component
-->
<template>
<div
class="anticon"
:class="[prefixCls, theme, { 'collapsed-show-title': getCollapsedShowTitle }]"
@click="handleGoHome"
>
<div class="anticon" :class="getAppLogoClass" @click="goHome">
<img src="../../../assets/images/logo.png" />
<div
class="ml-2 truncate md:opacity-100"
:class="[
`${prefixCls}__title`,
{
'xs:opacity-0': !alwaysShowTitle,
},
]"
v-show="showTitle"
>
<div class="ml-2 truncate md:opacity-100" :class="getTitleClass" v-show="showTitle">
{{ title }}
</div>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, computed, unref } from 'vue';
import { useGlobSetting } from '/@/hooks/setting';
import { useGo } from '/@/hooks/web/usePage';
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
import { useDesign } from '/@/hooks/web/useDesign';
import { PageEnum } from '/@/enums/pageEnum';
import { propTypes } from '/@/utils/propTypes';
const props = {
/**
* The theme of the current parent component
*/
theme: { type: String, validator: (v) => ['light', 'dark'].includes(v) },
/**
* Whether to show title
*/
showTitle: { type: Boolean, default: true },
/**
* The title is also displayed when the menu is collapsed
*/
alwaysShowTitle: { type: Boolean },
};
export default defineComponent({
name: 'AppLogo',
props: {
/**
* The theme of the current parent component
*/
theme: propTypes.oneOf(['light', 'dark']),
// Whether to show title
showTitle: propTypes.bool.def(true),
alwaysShowTitle: propTypes.bool.def(false),
},
setup() {
props: props,
setup(props) {
const { prefixCls } = useDesign('app-logo');
const { getCollapsedShowTitle } = useMenuSetting();
const { title } = useGlobSetting();
const go = useGo();
function handleGoHome(): void {
const getAppLogoClass = computed(() => [
prefixCls,
props.theme,
{ 'collapsed-show-title': unref(getCollapsedShowTitle) },
]);
const getTitleClass = computed(() => [
`${prefixCls}__title`,
{
'xs:opacity-0': !props.alwaysShowTitle,
},
]);
function goHome() {
go(PageEnum.BASE_HOME);
}
return {
handleGoHome,
getAppLogoClass,
getTitleClass,
getCollapsedShowTitle,
goHome,
title,
prefixCls,
getCollapsedShowTitle,
};
},
});
......
src/components/Application/src/AppProvider.vue
<script lang="ts">
import { defineComponent, toRefs, ref, unref } from 'vue';
import { createAppProviderContext } from './useAppContext';
import { prefixCls } from '/@/settings/designSetting';
import { createBreakpointListen } from '/@/hooks/event/useBreakpoint';
import { propTypes } from '/@/utils/propTypes';
import { prefixCls } from '/@/settings/designSetting';
import { useAppStore } from '/@/store/modules/app';
import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
const props = {
/**
* class style prefix
*/
prefixCls: { type: String, default: prefixCls },
};
export default defineComponent({
name: 'AppProvider',
inheritAttrs: false,
props: {
prefixCls: propTypes.string.def(prefixCls),
},
props,
setup(props, { slots }) {
const isMobile = ref(false);
const isSetState = ref(false);
const appStore = useAppStore();
// Monitor screen breakpoint information changes
createBreakpointListen(({ screenMap, sizeEnum, width }) => {
const lgWidth = screenMap.get(sizeEnum.LG);
if (lgWidth) {
......@@ -30,8 +33,13 @@
});
const { prefixCls } = toRefs(props);
// Inject variables into the global
createAppProviderContext({ prefixCls, isMobile });
/**
* Used to maintain the state before the window changes
*/
function handleRestoreState() {
if (unref(isMobile)) {
if (!unref(isSetState)) {
......
src/components/Application/src/search/AppSearch.vue
......@@ -4,11 +4,11 @@
import { SearchOutlined } from '@ant-design/icons-vue';
import AppSearchModal from './AppSearchModal.vue';
import { useI18n } from '/@/hooks/web/useI18n';
export default defineComponent({
name: 'AppSearch',
setup() {
const showModal = ref(false);
const { t } = useI18n();
function changeModal(show: boolean) {
......
src/components/Application/src/search/AppSearchFooter.vue
<template>
<div :class="`${prefixCls}`">
<AppSearchKeyItem :class="`${prefixCls}__item`" icon="ant-design:enter-outlined" />
<AppSearchKeyItem :class="`${prefixCls}-item`" icon="ant-design:enter-outlined" />
<span>{{ t('component.app.toSearch') }}</span>
<AppSearchKeyItem :class="`${prefixCls}__item`" icon="ion:arrow-up-outline" />
<AppSearchKeyItem :class="`${prefixCls}__item`" icon="ion:arrow-down-outline" />
<AppSearchKeyItem :class="`${prefixCls}-item`" icon="ion:arrow-up-outline" />
<AppSearchKeyItem :class="`${prefixCls}-item`" icon="ion:arrow-down-outline" />
<span>{{ t('component.app.toNavigate') }}</span>
<AppSearchKeyItem :class="`${prefixCls}__item`" icon="mdi:keyboard-esc" />
<AppSearchKeyItem :class="`${prefixCls}-item`" icon="mdi:keyboard-esc" />
<span>{{ t('common.closeText') }}</span>
</div>
</template>
......@@ -21,10 +21,7 @@
setup() {
const { prefixCls } = useDesign('app-search-footer');
const { t } = useI18n();
return {
prefixCls,
t,
};
return { prefixCls, t };
},
});
</script>
......@@ -44,7 +41,7 @@
align-items: center;
flex-shrink: 0;
&__item {
&-item {
display: flex;
width: 20px;
height: 18px;
......
src/components/Application/src/search/AppSearchKeyItem.vue
......@@ -8,8 +8,6 @@
import { Icon } from '/@/components/Icon';
export default defineComponent({
components: { Icon },
props: {
icon: String,
},
props: { icon: String },
});
</script>
src/components/Application/src/search/AppSearchModal.vue
......@@ -12,7 +12,6 @@
@change="handleSearch"
>
<template #prefix>
<!-- <Icon icon="ion:search"/> -->
<SearchOutlined />
</template>
</Input>
......@@ -59,21 +58,20 @@
</template>
<script lang="ts">
import { defineComponent, computed, unref, ref, watch, nextTick } from 'vue';
import { SearchOutlined } from '@ant-design/icons-vue';
import { Input } from 'ant-design-vue';
import AppSearchFooter from './AppSearchFooter.vue';
import Icon from '/@/components/Icon';
import clickOutside from '/@/directives/clickOutside';
import { useDesign } from '/@/hooks/web/useDesign';
import { useRefs } from '/@/hooks/core/useRefs';
import { useMenuSearch } from './useMenuSearch';
import { useI18n } from '/@/hooks/web/useI18n';
import { useAppInject } from '/@/hooks/web/useAppInject';
import { propTypes } from '/@/utils/propTypes';
const props = {
visible: { type: Boolean },
};
export default defineComponent({
name: 'AppSearchModal',
......@@ -81,17 +79,16 @@
directives: {
clickOutside,
},
props: {
visible: propTypes.bool,
},
props,
emits: ['close'],
setup(props, { emit }) {
const scrollWrap = ref<ElRef>(null);
const { prefixCls } = useDesign('app-search-modal');
const inputRef = ref<Nullable<HTMLElement>>(null);
const { t } = useI18n();
const { prefixCls } = useDesign('app-search-modal');
const [refs, setRefs] = useRefs();
const { getIsMobile } = useAppInject();
const inputRef = ref<Nullable<HTMLElement>>(null);
const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } =
useMenuSearch(refs, scrollWrap, emit);
......@@ -109,8 +106,8 @@
watch(
() => props.visible,
(v: boolean) => {
v &&
(visible: boolean) => {
visible &&
nextTick(() => {
unref(inputRef)?.focus();
});
......
src/components/Application/src/search/useMenuSearch.ts
import type { Menu } from '/@/router/types';
import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue';
import { getMenus } from '/@/router/menus';
import { cloneDeep } from 'lodash-es';
import { filter, forEach } from '/@/utils/helper/treeHelper';
import { useGo } from '/@/hooks/web/usePage';
import { useScrollTo } from '/@/hooks/event/useScrollTo';
import { onKeyStroke, useDebounceFn } from '@vueuse/core';
......@@ -67,7 +63,6 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
function handlerSearchResult(filterMenu: Menu[], reg: RegExp, parent?: Menu) {
const ret: SearchResult[] = [];
filterMenu.forEach((item) => {
const { name, path, icon, children } = item;
if (reg.test(name) && !children?.length) {
......@@ -84,11 +79,13 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
return ret;
}
// Activate when the mouse moves to a certain line
function handleMouseenter(e: any) {
const index = e.target.dataset.index;
activeIndex.value = Number(index);
}
// Arrow key up
function handleUp() {
if (!searchResult.value.length) return;
activeIndex.value--;
......@@ -98,6 +95,7 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
handleScroll();
}
// Arrow key down
function handleDown() {
if (!searchResult.value.length) return;
activeIndex.value++;
......@@ -107,15 +105,23 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
handleScroll();
}
// When the keyboard up and down keys move to an invisible place
// the scroll bar needs to scroll automatically
function handleScroll() {
const refList = unref(refs);
if (!refList || !Array.isArray(refList) || refList.length === 0 || !unref(scrollWrap)) return;
if (!refList || !Array.isArray(refList) || refList.length === 0 || !unref(scrollWrap)) {
return;
}
const index = unref(activeIndex);
const currentRef = refList[index];
if (!currentRef) return;
if (!currentRef) {
return;
}
const wrapEl = unref(scrollWrap);
if (!wrapEl) return;
if (!wrapEl) {
return;
}
const scrollHeight = currentRef.offsetTop + currentRef.offsetHeight;
const wrapHeight = wrapEl.offsetHeight;
const { start } = useScrollTo({
......@@ -126,8 +132,11 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
start();
}
// enter keyboard event
async function handleEnter() {
if (!searchResult.value.length) return;
if (!searchResult.value.length) {
return;
}
const result = unref(searchResult);
const index = unref(activeIndex);
if (result.length === 0 || index < 0) {
......@@ -139,14 +148,18 @@ export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>,
go(to.path);
}
// close search modal
function handleClose() {
searchResult.value = [];
emit('close');
}
// enter search
onKeyStroke('Enter', handleEnter);
// Monitor keyboard arrow keys
onKeyStroke('ArrowUp', handleUp);
onKeyStroke('ArrowDown', handleDown);
// esc close
onKeyStroke('Escape', handleClose);
return { handleSearch, searchResult, keyword, activeIndex, handleMouseenter, handleEnter };
......
src/components/Application/src/useAppContext.ts
......@@ -3,7 +3,6 @@ import { createContext, useContext } from '/@/hooks/core/useContext';
export interface AppProviderContextProps {
prefixCls: Ref<string>;
isMobile: Ref<boolean>;
}
......
src/components/Authority/index.ts
import Authority from './src/Authority.vue';
import { withInstall } from '/@/utils';
import authority from './src/Authority.vue';
export { Authority };
export const Authority = withInstall(authority);
src/components/Authority/src/Authority.vue
......@@ -4,11 +4,8 @@
<script lang="ts">
import type { PropType } from 'vue';
import { defineComponent } from 'vue';
import { RoleEnum } from '/@/enums/roleEnum';
import { usePermission } from '/@/hooks/web/usePermission';
import { getSlot } from '/@/utils/helper/tsxHelper';
export default defineComponent({
......
src/components/Basic/index.ts
import BasicArrow from './src/BasicArrow.vue';
import BasicTitle from './src/BasicTitle.vue';
import BasicHelp from './src/BasicHelp.vue';
import { withInstall } from '/@/utils';
import basicArrow from './src/BasicArrow.vue';
import basicTitle from './src/BasicTitle.vue';
import basicHelp from './src/BasicHelp.vue';
export { BasicArrow, BasicTitle, BasicHelp };
export const BasicArrow = withInstall(basicArrow);
export const BasicTitle = withInstall(basicTitle);
export const BasicHelp = withInstall(basicHelp);
src/components/Basic/src/BasicArrow.vue
......@@ -9,41 +9,50 @@
</template>
<script lang="ts">
import { defineComponent, computed } from 'vue';
import { Icon } from '/@/components/Icon';
import { useDesign } from '/@/hooks/web/useDesign';
import { propTypes } from '/@/utils/propTypes';
import { Icon } from '/@/components/Icon';
const props = {
/**
* Arrow expand state
*/
expand: { type: Boolean },
/**
* Arrow up by default
*/
up: { type: Boolean },
/**
* Arrow down by default
*/
down: { type: Boolean },
/**
* Cancel padding/margin for inline
*/
inset: { type: Boolean },
};
export default defineComponent({
name: 'BasicArrow',
components: { Icon },
props: {
expand: propTypes.bool,
top: propTypes.bool,
bottom: propTypes.bool,
inset: propTypes.bool,
},
props,
setup(props) {
const { prefixCls } = useDesign('basic-arrow');
// get component class
const getClass = computed(() => {
const { expand, top, bottom, inset } = props;
const { expand, up, down, inset } = props;
return [
prefixCls,
{
[`${prefixCls}--active`]: expand,
top,
up,
inset,
bottom,
down,
},
];
});
return {
getClass,
};
return { getClass };
},
});
</script>
......@@ -65,19 +74,19 @@
line-height: 0px;
}
&.top {
&.up {
transform: rotate(-90deg);
}
&.bottom {
&.down {
transform: rotate(90deg);
}
&.top.@{prefix-cls}--active {
&.up.@{prefix-cls}--active {
transform: rotate(90deg);
}
&.bottom.@{prefix-cls}--active {
&.down.@{prefix-cls}--active {
transform: rotate(-90deg);
}
}
......
src/components/Basic/src/BasicHelp.vue
<script lang="tsx">
import type { CSSProperties, PropType } from 'vue';
import { defineComponent, computed, unref } from 'vue';
import { Tooltip } from 'ant-design-vue';
import { InfoCircleOutlined } from '@ant-design/icons-vue';
import { getPopupContainer } from '/@/utils';
import { isString, isArray } from '/@/utils/is';
import { getSlot } from '/@/utils/helper/tsxHelper';
import { propTypes } from '/@/utils/propTypes';
import { useDesign } from '/@/hooks/web/useDesign';
const props = {
/**
* Help text max-width
* @default: 600px
*/
maxWidth: { type: String, default: '600px' },
/**
* Whether to display the serial number
* @default: false
*/
showIndex: { type: Boolean },
/**
* Help text font color
* @default: #ffffff
*/
color: { type: String, default: '#ffffff' },
/**
* Help text font size
* @default: 14px
*/
fontSize: { type: String, default: '14px' },
/**
* Help text list
*/
placement: { type: String, default: 'right' },
/**
* Help text list
*/
text: { type: [Array, String] as PropType<string[] | string> },
};
export default defineComponent({
name: 'BasicHelp',
components: { Tooltip },
props: {
// max-width
maxWidth: propTypes.string.def('600px'),
// Whether to display the serial number
showIndex: propTypes.bool,
// color
color: propTypes.string.def('#ffffff'),
fontSize: propTypes.string.def('14px'),
placement: propTypes.string.def('right'),
absolute: propTypes.bool,
// Text list
text: {
type: [Array, String] as PropType<string[] | string>,
},
// 定位
position: {
type: [Object] as PropType<any>,
default: () => ({
position: 'absolute',
left: 0,
bottom: 0,
}),
},
},
props,
setup(props, { slots }) {
const { prefixCls } = useDesign('basic-help');
const getOverlayStyle = computed(
(): CSSProperties => {
return {
maxWidth: props.maxWidth,
};
}
);
const getWrapStyle = computed(
(): CSSProperties => {
return {
color: props.color,
fontSize: props.fontSize,
};
}
const getTooltipStyle = computed(
(): CSSProperties => ({ color: props.color, fontSize: props.fontSize })
);
const getMainStyleRef = computed(() => {
return props.absolute ? props.position : {};
});
const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth }));
const renderTitle = () => {
const list = props.text;
function renderTitle() {
const textList = props.text;
if (isString(list)) {
return <p>{list}</p>;
if (isString(textList)) {
return <p>{textList}</p>;
}
if (isArray(list)) {
return list.map((item, index) => {
if (isArray(textList)) {
return textList.map((text, index) => {
return (
<p key={item}>
<p key={text}>
<>
{props.showIndex ? `${index + 1}. ` : ''}
{item}
{text}
</>
</p>
);
});
}
return null;
};
}
return () => {
return (
<Tooltip
title={<div style={unref(getWrapStyle)}>{renderTitle()}</div>}
overlayClassName={`${prefixCls}__wrap`}
title={<div style={unref(getTooltipStyle)}>{renderTitle()}</div>}
autoAdjustOverflow={true}
overlayStyle={unref(getOverlayStyle)}
placement={props.placement as 'left'}
placement={props.placement as 'right'}
getPopupContainer={() => getPopupContainer()}
>
<span class={prefixCls} style={unref(getMainStyleRef)}>
{getSlot(slots) || <InfoCircleOutlined />}
</span>
<span class={prefixCls}>{getSlot(slots) || <InfoCircleOutlined />}</span>
</Tooltip>
);
};
......
src/components/Basic/src/BasicTitle.vue
<template>
<span :class="getClass">
<slot></slot>
<BasicHelp :class="`${prefixCls}__help`" v-if="helpMessage" :text="helpMessage" />
<BasicHelp :class="`${prefixCls}-help`" v-if="helpMessage" :text="helpMessage" />
</span>
</template>
<script lang="ts">
import type { PropType } from 'vue';
import { defineComponent, computed } from 'vue';
import BasicHelp from './BasicHelp.vue';
import { useDesign } from '/@/hooks/web/useDesign';
import { propTypes } from '/@/utils/propTypes';
const props = {
/**
* Help text list or string
* @default: ''
*/
helpMessage: {
type: [String, Array] as PropType<string | string[]>,
default: '',
},
/**
* Whether the color block on the left side of the title
* @default: false
*/
span: { type: Boolean },
/**
* Whether to default the text, that is, not bold
* @default: false
*/
normal: { type: Boolean },
};
export default defineComponent({
name: 'BasicTitle',
components: { BasicHelp },
props: {
helpMessage: {
type: [String, Array] as PropType<string | string[]>,
default: '',
},
span: propTypes.bool,
normal: propTypes.bool.def(false),
},
props,
setup(props, { slots }) {
const { prefixCls } = useDesign('basic-title');
......@@ -33,6 +43,7 @@
{ [`${prefixCls}-show-span`]: props.span && slots.default },
{ [`${prefixCls}-normal`]: props.normal },
]);
return { prefixCls, getClass };
},
});
......@@ -67,7 +78,7 @@
content: '';
}
&__help {
&-help {
margin-left: 10px;
}
}
......
src/components/Button/index.ts
import Button from './src/BasicButton.vue';
import PopConfirmButton from './src/PopConfirmButton.vue';
import { withInstall } from '/@/utils';
import button from './src/BasicButton.vue';
import popConfirmButton from './src/PopConfirmButton.vue';
export { Button, PopConfirmButton };
export const Button = withInstall(button);
export const PopConfirmButton = withInstall(popConfirmButton);
src/components/Button/src/BasicButton.vue
......@@ -13,11 +13,21 @@
import { Icon } from '/@/components/Icon';
const props = {
color: { type: String, validate: (v) => ['error', 'warning', 'success', ''].includes(v) },
color: { type: String, validator: (v) => ['error', 'warning', 'success', ''].includes(v) },
loading: { type: Boolean },
disabled: { type: Boolean },
/**
* Text before icon.
*/
preIcon: { type: String },
/**
* Text after icon.
*/
postIcon: { type: String },
/**
* preIcon and postIcon icon size.
* @default: 14
*/
iconSize: { type: Number, default: 14 },
onClick: { type: Function as PropType<(...args) => any>, default: null },
};
......
src/components/Button/src/PopConfirmButton.vue
<script lang="ts">
import { defineComponent, h, unref, computed } from 'vue';
import { Popconfirm } from 'ant-design-vue';
import BasicButton from './BasicButton.vue';
import { Popconfirm } from 'ant-design-vue';
import { extendSlots } from '/@/utils/helper/tsxHelper';
import { omit } from 'lodash-es';
import { useAttrs } from '/@/hooks/core/useAttrs';
......
src/components/ClickOutSide/index.ts
import ClickOutSide from './src/ClickOutSide.vue';
import { withInstall } from '/@/utils';
import clickOutSide from './src/ClickOutSide.vue';
export { ClickOutSide };
export const ClickOutSide = withInstall(clickOutSide);
src/components/CodeEditor/index.ts
import { install } from '/@/utils/install';
import { withInstall } from '/@/utils';
import codeEditor from './src/CodeEditor.vue';
import jsonPreview from './src/json-preview/JsonPreview.vue';
export const CodeEditor = install(codeEditor);
export const JsonPreview = install(jsonPreview);
export const CodeEditor = withInstall(codeEditor);
export const JsonPreview = withInstall(jsonPreview);
src/components/CodeEditor/src/CodeEditor.vue
<template>
<div class="h-full">
<CodeMirrorEditor :value="getValue" @change="handleValueChange" :mode="mode" :readonly="readonly" />
<CodeMirrorEditor
:value="getValue"
@change="handleValueChange"
:mode="mode"
:readonly="readonly"
/>
</div>
</template>
<script lang="ts">
......@@ -13,43 +18,34 @@
html: 'htmlmixed',
js: 'javascript',
};
const props = {
value: { type: [Object, String] as PropType<Record<string, any> | string> },
mode: { type: String, default: MODE.JSON },
readonly: { type: Boolean },
};
export default defineComponent({
name: 'CodeEditor',
components: { CodeMirrorEditor },
props: {
value: {
type: [Object, String],
},
mode: {
type: String,
default: MODE.JSON,
},
readonly: {
type: Boolean,
default: false,
},
},
props,
emits: ['change'],
setup(props, { emit }) {
const getValue = computed(() => {
const { value, mode } = props;
if (mode === MODE.JSON) {
return isString(value)
? JSON.stringify(JSON.parse(value), null, 2)
: JSON.stringify(value, null, 2);
if (mode !== MODE.JSON) {
return value as string;
}
return value;
return isString(value)
? JSON.stringify(JSON.parse(value), null, 2)
: JSON.stringify(value, null, 2);
});
function handleValueChange(v) {
emit('change', v);
}
return {
handleValueChange,
getValue,
};
return { handleValueChange, getValue };
},
});
</script>
src/components/CodeEditor/src/codemirror/CodeMirror.vue
......@@ -15,31 +15,25 @@
} from 'vue';
import { useDebounceFn } from '@vueuse/core';
import { useAppStore } from '/@/store/modules/app';
import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
import CodeMirror from 'codemirror';
// css
import './codemirror.css';
import 'codemirror/theme/idea.css';
import 'codemirror/theme/material-palenight.css';
// modes
import 'codemirror/mode/javascript/javascript';
import 'codemirror/mode/css/css';
import 'codemirror/mode/htmlmixed/htmlmixed';
const props = {
mode: { type: String, default: 'application/json' },
value: { type: String, default: '' },
readonly: { type: Boolean, default: false },
};
export default defineComponent({
props: {
mode: {
type: String,
default: 'application/json',
},
value: {
type: String,
default: '',
},
readonly: {
type: Boolean,
default: false,
},
},
props,
emits: ['change'],
setup(props, { emit }) {
const el = ref();
......@@ -50,11 +44,11 @@
watch(
() => props.value,
async (v) => {
async (value) => {
await nextTick();
const oldValue = editor?.getValue();
if (v !== oldValue) {
editor?.setValue(v ? v : '');
if (value !== oldValue) {
editor?.setValue(value ? value : '');
}
},
{ flush: 'post' }
......@@ -113,13 +107,13 @@
onMounted(async () => {
await nextTick();
init();
window.addEventListener('resize', debounceRefresh);
useWindowSizeFn(debounceRefresh);
});
onUnmounted(() => {
window.removeEventListener('resize', debounceRefresh);
editor = null;
});
return { el };
},
});
......
src/components/CodeEditor/src/codemirror/codemirror.css
......@@ -12,20 +12,21 @@
--qualifier: #ff6032;
--important: var(--string);
position: relative;
height: auto;
height: 100%;
overflow: hidden;
font-family: var(--font-code);
background: white;
direction: ltr;
}
/* PADDING */
.CodeMirror-lines {
min-height: 1px; /* prevents collapsing before first draw */
padding: 4px 0; /* Vertical padding around content */
}
.CodeMirror pre {
padding: 0 4px; /* Horizontal padding of content */
cursor: text;
}
.CodeMirror-scrollbar-filler,
......@@ -36,6 +37,11 @@
/* GUTTER */
.CodeMirror-gutters {
position: absolute;
top: 0;
left: 0;
z-index: 3;
min-height: 100%;
white-space: nowrap;
background-color: transparent;
border-right: 1px solid #ddd;
......@@ -96,7 +102,9 @@
/* CURSOR */
.CodeMirror-cursor {
position: absolute;
width: 0;
pointer-events: none;
border-right: none;
border-left: 1px solid black;
}
......@@ -132,37 +140,19 @@
animation: blink 1.06s steps(1) infinite;
}
@-moz-keyframes blink {
0% {
}
50% {
background-color: transparent;
}
100% {
}
}
@-webkit-keyframes blink {
0% {
}
50% {
background-color: transparent;
}
100% {
}
}
@keyframes blink {
0% {
}
50% {
background-color: transparent;
}
100% {
}
}
.cm-tab {
......@@ -316,12 +306,6 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {
/* The rest of this file contains styles related to the mechanics of
the editor. You probably shouldn't touch them. */
.CodeMirror {
position: relative;
overflow: hidden;
background: white;
}
.CodeMirror-scroll {
position: relative;
height: 100%;
......@@ -378,14 +362,6 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {
left: 0;
}
.CodeMirror-gutters {
position: absolute;
top: 0;
left: 0;
z-index: 3;
min-height: 100%;
}
.CodeMirror-gutter {
display: inline-block;
height: 100%;
......@@ -422,14 +398,10 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {
background-color: transparent;
}
.CodeMirror-lines {
min-height: 1px; /* prevents collapsing before first draw */
cursor: text;
}
.CodeMirror pre {
position: relative;
z-index: 2;
padding: 0 4px; /* Horizontal padding of content */
margin: 0;
overflow: visible;
font-family: inherit;
......@@ -497,11 +469,6 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {
visibility: hidden;
}
.CodeMirror-cursor {
position: absolute;
pointer-events: none;
}
.CodeMirror-measure pre {
position: static;
}
......
src/components/CodeEditor/src/json-preview/JsonPreview.vue
......@@ -8,11 +8,7 @@
import { defineComponent } from 'vue';
export default defineComponent({
name: 'JsonPreview',
components: {
VueJsonPretty,
},
props: {
data: Object,
},
components: { VueJsonPretty },
props: { data: Object },
});
</script>
src/components/Container/index.ts
import CollapseContainer from './src/collapse/CollapseContainer.vue';
import ScrollContainer from './src/ScrollContainer.vue';
import LazyContainer from './src/LazyContainer.vue';
import { withInstall } from '/@/utils';
import collapseContainer from './src/collapse/CollapseContainer.vue';
import scrollContainer from './src/ScrollContainer.vue';
import lazyContainer from './src/LazyContainer.vue';
export { CollapseContainer, ScrollContainer, LazyContainer };
export * from './src/types';
export const CollapseContainer = withInstall(collapseContainer);
export const ScrollContainer = withInstall(scrollContainer);
export const LazyContainer = withInstall(lazyContainer);
export * from './src/typing';
src/components/Container/src/LazyContainer.vue
......@@ -18,13 +18,10 @@
</template>
<script lang="ts">
import type { PropType } from 'vue';
import { defineComponent, reactive, onMounted, ref, toRef, toRefs } from 'vue';
import { Skeleton } from 'ant-design-vue';
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver';
import { propTypes } from '/@/utils/propTypes';
interface State {
isInit: boolean;
......@@ -32,36 +29,47 @@
intersectionObserverInstance: IntersectionObserver | null;
}
const props = {
/**
* Waiting time, if the time is specified, whether visible or not, it will be automatically loaded after the specified time
*/
timeout: { type: Number },
/**
* The viewport where the component is located.
* If the component is scrolling in the page container, the viewport is the container
*/
viewport: {
type: (typeof window !== 'undefined' ? window.HTMLElement : Object) as PropType<HTMLElement>,
default: () => null,
},
/**
* Preload threshold, css unit
*/
threshold: { type: String, default: '0px' },
/**
* The scroll direction of the viewport, vertical represents the vertical direction, horizontal represents the horizontal direction
*/
direction: {
type: String,
default: 'vertical',
validator: (v) => ['vertical', 'horizontal'].includes(v),
},
/**
* The label name of the outer container that wraps the component
*/
tag: { type: String, default: 'div' },
maxWaitingTime: { type: Number, default: 80 },
/**
* transition name
*/
transitionName: { type: String, default: 'lazy-container' },
};
export default defineComponent({
name: 'LazyContainer',
components: { Skeleton },
inheritAttrs: false,
props: {
// Waiting time, if the time is specified, whether visible or not, it will be automatically loaded after the specified time
timeout: propTypes.number,
// The viewport where the component is located. If the component is scrolling in the page container, the viewport is the container
viewport: {
type: (typeof window !== 'undefined'
? window.HTMLElement
: Object) as PropType<HTMLElement>,
default: () => null,
},
// Preload threshold, css unit
threshold: propTypes.string.def('0px'),
// The scroll direction of the viewport, vertical represents the vertical direction, horizontal represents the horizontal direction
direction: propTypes.oneOf(['vertical', 'horizontal']).def('vertical'),
// The label name of the outer container that wraps the component
tag: propTypes.string.def('div'),
maxWaitingTime: propTypes.number.def(80),
// transition name
transitionName: propTypes.string.def('lazy-container'),
},
props,
emits: ['init'],
setup(props, { emit }) {
const elRef = ref();
......
src/components/Container/src/ScrollContainer.vue
......@@ -7,7 +7,6 @@
<script lang="ts">
import { defineComponent, ref, unref, nextTick } from 'vue';
import { Scrollbar, ScrollbarType } from '/@/components/Scrollbar';
import { useScrollTo } from '/@/hooks/event/useScrollTo';
export default defineComponent({
......@@ -16,12 +15,14 @@
setup() {
const scrollbarRef = ref<Nullable<ScrollbarType>>(null);
/**
* Scroll to the specified position
*/
function scrollTo(to: number, duration = 500) {
const scrollbar = unref(scrollbarRef);
if (!scrollbar) {
return;
}
nextTick(() => {
const wrap = unref(scrollbar.wrap);
if (!wrap) {
......@@ -44,12 +45,14 @@
return scrollbar.wrap;
}
/**
* Scroll to the bottom
*/
function scrollBottom() {
const scrollbar = unref(scrollbarRef);
if (!scrollbar) {
return;
}
nextTick(() => {
const wrap = unref(scrollbar.wrap);
if (!wrap) {
......
src/components/Container/src/collapse/CollapseContainer.vue
<template>
<div :class="prefixCls">
<CollapseHeader
v-bind="getBindValues"
:prefixCls="prefixCls"
:show="show"
@expand="handleExpand"
>
<CollapseHeader v-bind="$props" :prefixCls="prefixCls" :show="show" @expand="handleExpand">
<template #title>
<slot name="title"></slot>
</template>
......@@ -16,13 +11,12 @@
<div class="p-2">
<CollapseTransition :enable="canExpan">
<Skeleton v-if="loading" :active="active" />
<Skeleton v-if="loading" :active="loading" />
<div :class="`${prefixCls}__body`" v-else v-show="show">
<slot></slot>
</div>
</CollapseTransition>
</div>
<div :class="`${prefixCls}__footer`" v-if="$slots.footer">
<slot name="footer"></slot>
</div>
......@@ -30,20 +24,41 @@
</template>
<script lang="ts">
import type { PropType } from 'vue';
import { defineComponent, ref, computed } from 'vue';
import { defineComponent, ref } from 'vue';
// component
import { Skeleton } from 'ant-design-vue';
import { CollapseTransition } from '/@/components/Transition';
import CollapseHeader from './CollapseHeader.vue';
import { triggerWindowResize } from '/@/utils/event';
// hook
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
import { propTypes } from '/@/utils/propTypes';
import { useDesign } from '/@/hooks/web/useDesign';
const props = {
title: { type: String, default: '' },
loading: { type: Boolean },
/**
* Can it be expanded
*/
canExpan: { type: Boolean, default: true },
/**
* Warm reminder on the right side of the title
*/
helpMessage: {
type: [Array, String] as PropType<string[] | string>,
default: '',
},
/**
* Whether to trigger window.resize when expanding and contracting,
* Can adapt to tables and forms, when the form shrinks, the form triggers resize to adapt to the height
*/
triggerWindowResize: { type: Boolean },
/**
* Delayed loading time
*/
lazyTime: { type: Number, default: 0 },
};
export default defineComponent({
name: 'CollapseContainer',
components: {
......@@ -51,23 +66,7 @@
CollapseHeader,
CollapseTransition,
},
props: {
title: propTypes.string.def(''),
// Can it be expanded
canExpan: propTypes.bool.def(true),
// Warm reminder on the right side of the title
helpMessage: {
type: [Array, String] as PropType<string[] | string>,
default: '',
},
// Whether to trigger window.resize when expanding and contracting,
// Can adapt to tables and forms, when the form shrinks, the form triggers resize to adapt to the height
triggerWindowResize: propTypes.bool,
loading: propTypes.bool.def(false),
active: propTypes.bool.def(true),
// Delayed loading time
lazyTime: propTypes.number.def(0),
},
props,
setup(props) {
const show = ref(true);
......@@ -84,15 +83,10 @@
}
}
const getBindValues = computed((): any => {
return props;
});
return {
show,
handleExpand,
prefixCls,
getBindValues,
};
},
});
......
src/components/Container/src/collapse/CollapseHeader.vue
......@@ -8,28 +8,31 @@
<slot name="title"></slot>
</template>
</BasicTitle>
<div :class="`${prefixCls}__action`">
<slot name="action"></slot>
<BasicArrow v-if="canExpan" top :expand="show" @click="$emit('expand')" />
<BasicArrow v-if="canExpan" up :expand="show" @click="$emit('expand')" />
</div>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { BasicArrow, BasicTitle } from '/@/components/Basic';
import { propTypes } from '/@/utils/propTypes';
const props = {
prefixCls: { type: String },
helpMessage: {
type: [Array, String] as PropType<string[] | string>,
default: '',
},
title: { type: String },
show: { type: Boolean },
canExpan: { type: Boolean },
};
export default defineComponent({
components: { BasicArrow, BasicTitle },
inheritAttrs: false,
props: {
prefixCls: propTypes.string,
helpMessage: propTypes.string,
title: propTypes.string,
show: propTypes.bool,
canExpan: propTypes.bool,
},
props,
emits: ['expand'],
});
</script>
src/components/FlowChart/index.ts
import { install } from '/@/utils/install';
import { withInstall } from '/@/utils';
import flowChart from './src/FlowChart.vue';
export const FlowChart = install(flowChart);
export const FlowChart = withInstall(flowChart);
src/components/Form/src/components/FormAction.vue
......@@ -31,7 +31,7 @@
v-if="showAdvancedButton && !hideAdvanceBtn"
>
{{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
<BasicArrow class="ml-1" :expand="!isAdvanced" top />
<BasicArrow class="ml-1" :expand="!isAdvanced" up />
</Button>
<slot name="advanceAfter"></slot>
</FormItem>
......@@ -99,16 +99,14 @@
return actionColOpt;
});
const getResetBtnOptions = computed(
(): ButtonOptions => {
return Object.assign(
{
text: t('common.resetText'),
},
props.resetButtonOptions
);
}
);
const getResetBtnOptions = computed((): ButtonOptions => {
return Object.assign(
{
text: t('common.resetText'),
},
props.resetButtonOptions
);
});
const getSubmitBtnOptions = computed(() => {
return Object.assign(
......
src/utils/index.ts
import type { RouteLocationNormalized, RouteRecordNormalized } from 'vue-router';
import type { App, Plugin } from 'vue';
import { unref } from 'vue';
import { isObject } from '/@/utils/is';
......@@ -76,3 +78,14 @@ export function getRawRoute(route: RouteLocationNormalized): RouteLocationNormal
: undefined) as RouteRecordNormalized[],
};
}
export const withInstall = <T>(component: T, alias?: string) => {
const comp = component as any;
comp.install = (app: App) => {
app.component(comp.name || comp.displayName, component);
if (alias) {
app.config.globalProperties[alias] = component;
}
};
return component as T & Plugin;
};
src/utils/install.ts deleted 100644 → 0
import { App, Plugin } from 'vue';
export const install = <T>(component: T, alias?: string) => {
const C = component as any;
C.install = (app: App) => {
app.component(C.name, component);
if (alias) {
app.config.globalProperties[alias] = component;
}
};
return component as T & Plugin;
};
src/views/sys/login/Login.vue
......@@ -35,8 +35,7 @@
class="
my-auto
mx-auto
xl:ml-20
xl:bg-transparent
xl:ml-20 xl:bg-transparent
px-5
py-8
sm:px-8
......
types/module.d.ts
declare module '*.vue' {
import { defineComponent } from 'vue';
const Component: ReturnType<typeof defineComponent>;
import { DefineComponent } from 'vue';
const Component: DefineComponent<{}, {}, any>;
export default Component;
}
......
yarn.lock
......@@ -1191,10 +1191,10 @@
dependencies:
cross-fetch "^3.0.6"
"@iconify/json@^1.1.353":
version "1.1.353"
resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.353.tgz#f9fb632da9b13cd79bcbea09b289610c46b87426"
integrity sha512-gN+DccJUhO6iB7gBPbZXodDaaxZpZTLORixrXaXNmkSW7N/jqfzMCCogoeRWOydZzSgR7VESc2tMI4llEonkjg==
"@iconify/json@^1.1.354":
version "1.1.354"
resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.354.tgz#a2024ba18a48931e46121413ea743cddd3638fa6"
integrity sha512-zFW5iV4FQmu/Mhn5fUNDtESLJFuQ8Mr9B0vBM2DmKbWJmTuMoF3sfV1w3tXMCvKFAXSTUcBTdXeEYP2rWnA8jA==
"@intlify/core-base@9.1.6":
version "9.1.6"
......@@ -1688,10 +1688,10 @@
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.17.1.tgz#5e07e0cb2ff793aa7a1b41deae76221e6166049f"
integrity sha512-/tpUyFD7meeooTRwl3sYlihx2BrJE7q9XF71EguPFIySj9B7qgnRtHsHTho+0AUm4m1SvWGm6uSncrR94q6Vtw==
"@types/node@^15.12.1":
version "15.12.1"
resolved "https://registry.npmjs.org/@types/node/-/node-15.12.1.tgz#9b60797dee1895383a725f828a869c86c6caa5c2"
integrity sha512-zyxJM8I1c9q5sRMtVF+zdd13Jt6RU4r4qfhTd7lQubyThvLfx6yYekWSQjGCGV2Tkecgxnlpl/DNlb6Hg+dmEw==
"@types/node@^15.12.2":
version "15.12.2"
resolved "https://registry.npmjs.org/@types/node/-/node-15.12.2.tgz#1f2b42c4be7156ff4a6f914b2fb03d05fa84e38d"
integrity sha512-zjQ69G564OCIWIOHSXyQEEDpdpGl+G348RAKY0XXy9Z5kU9Vzv1GMNnkar/ZJ8dzXB3COzD9Mo9NtRZ4xfgUww==
"@types/normalize-package-data@^2.4.0":
version "2.4.0"
......@@ -1787,13 +1787,13 @@
"@types/unist" "*"
"@types/vfile-message" "*"
"@typescript-eslint/eslint-plugin@^4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.26.0.tgz#12bbd6ebd5e7fabd32e48e1e60efa1f3554a3242"
integrity sha512-yA7IWp+5Qqf+TLbd8b35ySFOFzUfL7i+4If50EqvjT6w35X8Lv0eBHb6rATeWmucks37w+zV+tWnOXI9JlG6Eg==
"@typescript-eslint/eslint-plugin@^4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.26.1.tgz#b9c7313321cb837e2bf8bebe7acc2220659e67d3"
integrity sha512-aoIusj/8CR+xDWmZxARivZjbMBQTT9dImUtdZ8tVCVRXgBUuuZyM5Of5A9D9arQPxbi/0rlJLcuArclz/rCMJw==
dependencies:
"@typescript-eslint/experimental-utils" "4.26.0"
"@typescript-eslint/scope-manager" "4.26.0"
"@typescript-eslint/experimental-utils" "4.26.1"
"@typescript-eslint/scope-manager" "4.26.1"
debug "^4.3.1"
functional-red-black-tree "^1.0.1"
lodash "^4.17.21"
......@@ -1801,60 +1801,60 @@
semver "^7.3.5"
tsutils "^3.21.0"
"@typescript-eslint/experimental-utils@4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.26.0.tgz#ba7848b3f088659cdf71bce22454795fc55be99a"
integrity sha512-TH2FO2rdDm7AWfAVRB5RSlbUhWxGVuxPNzGT7W65zVfl8H/WeXTk1e69IrcEVsBslrQSTDKQSaJD89hwKrhdkw==
"@typescript-eslint/experimental-utils@4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/experimental-utils/-/experimental-utils-4.26.1.tgz#a35980a2390da9232aa206b27f620eab66e94142"
integrity sha512-sQHBugRhrXzRCs9PaGg6rowie4i8s/iD/DpTB+EXte8OMDfdCG5TvO73XlO9Wc/zi0uyN4qOmX9hIjQEyhnbmQ==
dependencies:
"@types/json-schema" "^7.0.7"
"@typescript-eslint/scope-manager" "4.26.0"
"@typescript-eslint/types" "4.26.0"
"@typescript-eslint/typescript-estree" "4.26.0"
"@typescript-eslint/scope-manager" "4.26.1"
"@typescript-eslint/types" "4.26.1"
"@typescript-eslint/typescript-estree" "4.26.1"
eslint-scope "^5.1.1"
eslint-utils "^3.0.0"
"@typescript-eslint/parser@^4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.26.0.tgz#31b6b732c9454f757b020dab9b6754112aa5eeaf"
integrity sha512-b4jekVJG9FfmjUfmM4VoOItQhPlnt6MPOBUL0AQbiTmm+SSpSdhHYlwayOm4IW9KLI/4/cRKtQCmDl1oE2OlPg==
"@typescript-eslint/parser@^4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-4.26.1.tgz#cecfdd5eb7a5c13aabce1c1cfd7fbafb5a0f1e8e"
integrity sha512-q7F3zSo/nU6YJpPJvQveVlIIzx9/wu75lr6oDbDzoeIRWxpoc/HQ43G4rmMoCc5my/3uSj2VEpg/D83LYZF5HQ==
dependencies:
"@typescript-eslint/scope-manager" "4.26.0"
"@typescript-eslint/types" "4.26.0"
"@typescript-eslint/typescript-estree" "4.26.0"
"@typescript-eslint/scope-manager" "4.26.1"
"@typescript-eslint/types" "4.26.1"
"@typescript-eslint/typescript-estree" "4.26.1"
debug "^4.3.1"
"@typescript-eslint/scope-manager@4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.26.0.tgz#60d1a71df162404e954b9d1c6343ff3bee496194"
integrity sha512-G6xB6mMo4xVxwMt5lEsNTz3x4qGDt0NSGmTBNBPJxNsrTXJSm21c6raeYroS2OwQsOyIXqKZv266L/Gln1BWqg==
"@typescript-eslint/scope-manager@4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-4.26.1.tgz#075a74a15ff33ee3a7ed33e5fce16ee86689f662"
integrity sha512-TW1X2p62FQ8Rlne+WEShyd7ac2LA6o27S9i131W4NwDSfyeVlQWhw8ylldNNS8JG6oJB9Ha9Xyc+IUcqipvheQ==
dependencies:
"@typescript-eslint/types" "4.26.0"
"@typescript-eslint/visitor-keys" "4.26.0"
"@typescript-eslint/types" "4.26.1"
"@typescript-eslint/visitor-keys" "4.26.1"
"@typescript-eslint/types@4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.26.0.tgz#7c6732c0414f0a69595f4f846ebe12616243d546"
integrity sha512-rADNgXl1kS/EKnDr3G+m7fB9yeJNnR9kF7xMiXL6mSIWpr3Wg5MhxyfEXy/IlYthsqwBqHOr22boFbf/u6O88A==
"@typescript-eslint/types@4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/types/-/types-4.26.1.tgz#9e7c523f73c34b04a765e4167ca5650436ef1d38"
integrity sha512-STyMPxR3cS+LaNvS8yK15rb8Y0iL0tFXq0uyl6gY45glyI7w0CsyqyEXl/Fa0JlQy+pVANeK3sbwPneCbWE7yg==
"@typescript-eslint/typescript-estree@4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.26.0.tgz#aea17a40e62dc31c63d5b1bbe9a75783f2ce7109"
integrity sha512-GHUgahPcm9GfBuy3TzdsizCcPjKOAauG9xkz9TR8kOdssz2Iz9jRCSQm6+aVFa23d5NcSpo1GdHGSQKe0tlcbg==
"@typescript-eslint/typescript-estree@4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-4.26.1.tgz#b2ce2e789233d62283fae2c16baabd4f1dbc9633"
integrity sha512-l3ZXob+h0NQzz80lBGaykdScYaiEbFqznEs99uwzm8fPHhDjwaBFfQkjUC/slw6Sm7npFL8qrGEAMxcfBsBJUg==
dependencies:
"@typescript-eslint/types" "4.26.0"
"@typescript-eslint/visitor-keys" "4.26.0"
"@typescript-eslint/types" "4.26.1"
"@typescript-eslint/visitor-keys" "4.26.1"
debug "^4.3.1"
globby "^11.0.3"
is-glob "^4.0.1"
semver "^7.3.5"
tsutils "^3.21.0"
"@typescript-eslint/visitor-keys@4.26.0":
version "4.26.0"
resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.26.0.tgz#26d2583169222815be4dcd1da4fe5459bc3bcc23"
integrity sha512-cw4j8lH38V1ycGBbF+aFiLUls9Z0Bw8QschP3mkth50BbWzgFS33ISIgBzUMuQ2IdahoEv/rXstr8Zhlz4B1Zg==
"@typescript-eslint/visitor-keys@4.26.1":
version "4.26.1"
resolved "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-4.26.1.tgz#0d55ea735cb0d8903b198017d6d4f518fdaac546"
integrity sha512-IGouNSSd+6x/fHtYRyLOM6/C+QxMDzWlDtN41ea+flWuSF9g02iqcIlX8wM53JkfljoIjP0U+yp7SiTS1onEkw==
dependencies:
"@typescript-eslint/types" "4.26.0"
"@typescript-eslint/types" "4.26.1"
eslint-visitor-keys "^2.0.0"
"@vitejs/plugin-legacy@^1.4.1":
......@@ -2033,25 +2033,25 @@
resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==
"@vueuse/core@^4.11.2":
version "4.11.2"
resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-4.11.2.tgz#d4f54bd38e7c289c6f6357992c02423774cb26d9"
integrity sha512-4A17XvKXpMR6829EVWvrdSKEeAjTWaiC3+xh51KEtlyCwvWQwZ0xwKDrbMj+e15ANxjHrTw/0bJVaWDfPQt/Pw==
"@vueuse/core@^5.0.1":
version "5.0.1"
resolved "https://registry.npmjs.org/@vueuse/core/-/core-5.0.1.tgz#94bbb6c71d95b79efbdb24111915775e61723f1b"
integrity sha512-hzcyYNvW1p9ZEwm+oBaWrHgGx6S93pJBiXLZUj2pgCNiJZjaedoePT9xzesi1SBxeKcYxwToaTISLeKdE4VKeg==
dependencies:
"@vueuse/shared" "4.11.2"
"@vueuse/shared" "5.0.1"
vue-demi "*"
"@vueuse/shared@4.11.2":
version "4.11.2"
resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-4.11.2.tgz#1d56e08937600e3e65abf76f27cb4a1bc182adfd"
integrity sha512-vTbTi6ou7ljH3CkKVoaIaCAoWB5T1ewSogpL6VnO1duMPNuiv7x8K/LunMbnTg4tVyt6QwaiCuEq/kyS6AUBRg==
"@vueuse/shared@5.0.1":
version "5.0.1"
resolved "https://registry.npmjs.org/@vueuse/shared/-/shared-5.0.1.tgz#3b6607ffc9e19b322c39be8a2f6b584d203a7c5e"
integrity sha512-/+kRII9chn45PhFfRuPVbSQApJHhhqXFhPrWjnYKckMfQE9ZOuNMb1bmQnDTqzuNkoS/ENeHBMq0rnV/cfz/3Q==
dependencies:
vue-demi "*"
"@windicss/plugin-utils@1.0.1":
version "1.0.1"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-1.0.1.tgz#f6281c91a37be5ea48eb4573cb511ccb82cce16a"
integrity sha512-EHsGC9LGHC/3rWNiOHzkgkexwgmxfHsqvxBoh0hLJv1MPPhEsKv8dQbt34pVZgRsS/rAjiVe4bRRM5NLTy8cWA==
"@windicss/plugin-utils@1.0.2":
version "1.0.2"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-1.0.2.tgz#c34d6498058d5f4291805027d2ef6e34638a572a"
integrity sha512-W9fZoPNsD3NMVyqzt9eNb1DNp9p4oy7EscCfGVIg1KBxAC8S+AnXtkaR/rad09y+aqzbILKNfzDKdimDR2FA9g==
dependencies:
"@antfu/utils" "^0.1.6"
debug "^4.3.2"
......@@ -2059,7 +2059,7 @@
jiti "^1.10.1"
magic-string "^0.25.7"
micromatch "^4.0.4"
windicss "^3.1.0"
windicss "^3.1.3"
"@zxcvbn-ts/core@^0.3.0":
version "0.3.0"
......@@ -4237,11 +4237,6 @@ esbuild@^0.11.5:
resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.11.10.tgz#f5d39e4d9cc130b78d751664fef1b663240f5545"
integrity sha512-XvGbf+UreVFA24Tlk6sNOqNcvF2z49XAZt4E7A4H80+yqn944QOLTTxaU0lkdYNtZKFiITNea+VxmtrfjvnLPA==
esbuild@^0.12.5:
version "0.12.5"
resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.12.5.tgz#36076a6bc1966ba2741981d30512e95e8aaff495"
integrity sha512-vcuP53pA5XiwUU4FnlXM+2PnVjTfHGthM7uP1gtp+9yfheGvFFbq/KyuESThmtoHPUrfZH5JpxGVJIFDVD1Egw==
esbuild@^0.12.6:
version "0.12.6"
resolved "https://registry.npmjs.org/esbuild/-/esbuild-0.12.6.tgz#85bc755c7cf3005d4f34b4f10f98049ce0ee67ce"
......@@ -4371,13 +4366,13 @@ eslint@^7.28.0:
text-table "^0.2.0"
v8-compile-cache "^2.0.3"
esno@^0.7.0:
version "0.7.0"
resolved "https://registry.npmjs.org/esno/-/esno-0.7.0.tgz#2bec5e80eff53b60d528d6cf244445677cce7d4c"
integrity sha512-tOcvMYheRc7dfrxWkm4bYgmMkcNZUSt892qVY66int4L+jkEJGc64fZLx8+cZffMIcHp+4IfaTB+r+X7SoRh+g==
esno@^0.7.1:
version "0.7.1"
resolved "https://registry.npmjs.org/esno/-/esno-0.7.1.tgz#ccd08436e0ca6e452fac1a994a7f08c61d07b7f1"
integrity sha512-LzI42UXMSWtt9Z7iLfytY1jqO5Mz0980NI/y8txwpBCQmXLOpkA+KFzhD3IAY+QjBOOtvFmGh2j0VR8EHY57Ww==
dependencies:
cross-spawn "^7.0.3"
esbuild "^0.12.5"
esbuild "^0.12.6"
esbuild-node-loader "^0.0.0"
esbuild-register "^2.5.0"
......@@ -8876,10 +8871,10 @@ rollup-plugin-visualizer@5.5.0:
source-map "^0.7.3"
yargs "^16.2.0"
rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.51.0:
version "2.51.0"
resolved "https://registry.npmjs.org/rollup/-/rollup-2.51.0.tgz#ffd847882283998fc8611cd57af917f173b4ab5c"
integrity sha512-ITLt9sScNCBVspSHauw/W49lEZ0vjN8LyCzSNsNaqT67vTss2lYEfOyxltX8hjrhr1l/rQwmZ2wazzEqhZ/fUg==
rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.51.1:
version "2.51.1"
resolved "https://registry.npmjs.org/rollup/-/rollup-2.51.1.tgz#87bcd4095fe79b14c9bec0edc7ffa44e4827f793"
integrity sha512-8xfDbAtBleXotb6qKEHWuo/jkn94a9dVqGc7Rwl3sqspCVlnCfbRek7ldhCARSi7h32H0xR4QThm1t9zHN+3uw==
optionalDependencies:
fsevents "~2.3.1"
......@@ -10652,15 +10647,15 @@ vite-plugin-theme@^0.8.1:
esbuild-plugin-alias "^0.1.2"
tinycolor2 "^1.4.2"
vite-plugin-windicss@^1.0.1:
version "1.0.1"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-1.0.1.tgz#6e455228b6c1cb7ad52ed8fb9408b39888d572c0"
integrity sha512-+6iFKUC00G9xkR967xqbbAquaWAmgYT1rlBP7Bp6XCd9ire3b7tJTETtwSPAPAIp38OA/Xbp1MSaHhbl2LRxJg==
vite-plugin-windicss@^1.0.2:
version "1.0.2"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-1.0.2.tgz#0d0fd1ff36dc81d348be755e59a8ee471941095c"
integrity sha512-iTmkxm8Yp+ZCFWLOs//9q3d4hYaBVDlkRGLzNBUNvRW9AQFVea57ZPhglMm9xOt1nW/O68n5Rkg4/In8rrEjHQ==
dependencies:
"@windicss/plugin-utils" "1.0.1"
"@windicss/plugin-utils" "1.0.2"
chalk "^4.1.1"
debug "^4.3.2"
windicss "^3.1.0"
windicss "^3.1.3"
vite@2.3.3:
version "2.3.3"
......@@ -10952,10 +10947,10 @@ widest-line@^2.0.0:
dependencies:
string-width "^2.1.1"
windicss@^3.1.0:
version "3.1.0"
resolved "https://registry.npmjs.org/windicss/-/windicss-3.1.0.tgz#bd679d51b7cabeba09077085706b48dbc1515730"
integrity sha512-z49xITq4X1ltHIZyL4NwFTR2LXPJ0rbOOrhDXfLX+OfG4Au7+GAzqvNlzUfAaIbA8HSpnI04alQHUWH24KfNYA==
windicss@^3.1.3:
version "3.1.3"
resolved "https://registry.npmjs.org/windicss/-/windicss-3.1.3.tgz#a4b80af48bdd5d4be13520f700b497af455df700"
integrity sha512-l7fpoba2LY9AYRy4UgcuOpbPsed8UsbpEQYUVWRR1wdAwiKxK6bGIMfpiKJtjPAPdh0GOGUqr6KJar0EDZSxzg==
with@^7.0.0:
version "7.0.2"
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论