build(projects): update tsconfig、eslintrc
This commit is contained in:
Soybean
@ -53,7 +53,7 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
emptyDesc: '暂无数据',
|
||||
iconClass: 'text-320px text-primary',
|
||||
descClass: 'text-16px text-[#666]',
|
||||
showNetworkReload: false
|
||||
showNetworkReload: false,
|
||||
});
|
||||
|
||||
// 网络状态
|
||||
@ -79,7 +79,7 @@ function handleReload() {
|
||||
|
||||
const stopHandle = watch(
|
||||
() => props.loading,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
// 结束加载判断一下网络状态
|
||||
if (!newValue) {
|
||||
setNetwork(window.navigator.onLine);
|
||||
|
||||
@ -23,7 +23,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
value: true
|
||||
value: true,
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -34,7 +34,7 @@ const checked = computed({
|
||||
},
|
||||
set(newValue: boolean) {
|
||||
emit('update:value', newValue);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleClickProtocol() {
|
||||
|
||||
@ -18,7 +18,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
dark: false
|
||||
dark: false,
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -29,7 +29,7 @@ const darkMode = computed({
|
||||
},
|
||||
set(newValue: boolean) {
|
||||
emit('update:dark', newValue);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleSwitch() {
|
||||
|
||||
@ -29,7 +29,7 @@ interface Props {
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
tooltipContent: '',
|
||||
placement: 'bottom',
|
||||
contentClass: ''
|
||||
contentClass: '',
|
||||
});
|
||||
|
||||
const showTooltip = computed(() => Boolean(props.tooltipContent));
|
||||
|
||||
@ -29,7 +29,7 @@ const NaiveProviderContent = defineComponent({
|
||||
},
|
||||
render() {
|
||||
return h('div');
|
||||
}
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -10,7 +10,7 @@ interface Props {
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
fill: false
|
||||
fill: false,
|
||||
});
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -42,7 +42,7 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
separator: ',',
|
||||
decimal: '.',
|
||||
useEasing: true,
|
||||
transition: 'linear'
|
||||
transition: 'linear',
|
||||
});
|
||||
|
||||
const emit = defineEmits<{
|
||||
@ -61,7 +61,7 @@ function run() {
|
||||
duration: props.duration,
|
||||
onStarted: () => emit('on-started'),
|
||||
onFinished: () => emit('on-finished'),
|
||||
...(props.useEasing ? { transition: TransitionPresets[props.transition] } : {})
|
||||
...(props.useEasing ? { transition: TransitionPresets[props.transition] } : {}),
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -43,7 +43,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
emptyIcon: 'mdi:apps'
|
||||
emptyIcon: 'mdi:apps',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -51,7 +51,7 @@ const emit = defineEmits<Emits>();
|
||||
const theme = useThemeStore();
|
||||
|
||||
const searchValue = ref('');
|
||||
const iconsList = computed(() => props.icons.filter(v => v.includes(searchValue.value)));
|
||||
const iconsList = computed(() => props.icons.filter((v) => v.includes(searchValue.value)));
|
||||
|
||||
const modelValue = computed({
|
||||
get() {
|
||||
@ -59,7 +59,7 @@ const modelValue = computed({
|
||||
},
|
||||
set(val: string) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function handleChange(iconItem: string) {
|
||||
|
||||
@ -17,7 +17,7 @@ interface Emits {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
code: ''
|
||||
code: '',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -26,11 +26,11 @@ const { domRef, imgCode, setImgCode, getImgCode } = useImageVerify();
|
||||
|
||||
watch(
|
||||
() => props.code,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
setImgCode(newValue);
|
||||
}
|
||||
);
|
||||
watch(imgCode, newValue => {
|
||||
watch(imgCode, (newValue) => {
|
||||
emit('update:code', newValue);
|
||||
});
|
||||
|
||||
|
||||
@ -19,23 +19,23 @@ export function useBasicLayout() {
|
||||
vertical: {
|
||||
showLogo: false,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: true
|
||||
showMenuCollape: true,
|
||||
},
|
||||
'vertical-mix': {
|
||||
showLogo: false,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: false
|
||||
showMenuCollape: false,
|
||||
},
|
||||
horizontal: {
|
||||
showLogo: true,
|
||||
showHeaderMenu: true,
|
||||
showMenuCollape: false
|
||||
showMenuCollape: false,
|
||||
},
|
||||
'horizontal-mix': {
|
||||
showLogo: true,
|
||||
showHeaderMenu: false,
|
||||
showMenuCollape: true
|
||||
}
|
||||
showMenuCollape: true,
|
||||
},
|
||||
};
|
||||
|
||||
const headerProps = computed(() => layoutHeaderProps[theme.layout.mode]);
|
||||
@ -65,6 +65,6 @@ export function useBasicLayout() {
|
||||
headerProps,
|
||||
siderVisible,
|
||||
siderWidth,
|
||||
siderCollapsedWidth
|
||||
siderCollapsedWidth,
|
||||
};
|
||||
}
|
||||
|
||||
@ -7,7 +7,7 @@ import type { LoginModuleKey } from '@/interface';
|
||||
* 路由跳转
|
||||
* @param inSetup - 是否在vue页面/组件的setup里面调用，在axios里面无法使用useRouter和useRoute
|
||||
*/
|
||||
export function useRouterPush(inSetup: boolean = true) {
|
||||
export function useRouterPush(inSetup = true) {
|
||||
const router = inSetup ? useRouter() : globalRouter;
|
||||
const route = globalRouter.currentRoute;
|
||||
|
||||
@ -47,7 +47,7 @@ export function useRouterPush(inSetup: boolean = true) {
|
||||
const module: LoginModuleKey = loginModule || 'pwd-login';
|
||||
const routeLocation: RouteLocationRaw = {
|
||||
name: routeName('login'),
|
||||
params: { module }
|
||||
params: { module },
|
||||
};
|
||||
const redirect = redirectUrl || route.value.fullPath;
|
||||
Object.assign(routeLocation, { query: { redirect } });
|
||||
@ -81,6 +81,6 @@ export function useRouterPush(inSetup: boolean = true) {
|
||||
toHome,
|
||||
toLogin,
|
||||
toLoginModule,
|
||||
toLoginRedirect
|
||||
toLoginRedirect,
|
||||
};
|
||||
}
|
||||
|
||||
@ -16,7 +16,7 @@ export function useAppInfo(): AppInfo {
|
||||
return {
|
||||
name,
|
||||
title,
|
||||
desc
|
||||
desc,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -36,7 +36,7 @@ export const ERROR_STATUS = {
|
||||
503: '503: 服务不可用~',
|
||||
504: '504: 网关超时~',
|
||||
505: '505: http版本不支持该请求~',
|
||||
[DEFAULT_REQUEST_ERROR_CODE]: DEFAULT_REQUEST_ERROR_MSG
|
||||
[DEFAULT_REQUEST_ERROR_CODE]: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
/** 不弹出错误信息的code */
|
||||
|
||||
@ -20,7 +20,7 @@ export default function setupLoginDirective(app: App) {
|
||||
unmounted(el: HTMLElement, binding) {
|
||||
if (binding.value === false) return;
|
||||
el.removeEventListener('click', listenerHandler);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
app.directive('login', loginDirective);
|
||||
|
||||
@ -18,7 +18,7 @@ export default function setupNetworkDirective(app: App) {
|
||||
unmounted(el: HTMLElement, binding) {
|
||||
if (binding.value === false) return;
|
||||
el.removeEventListener('click', listenerHandler);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
app.directive('network', networkDirective);
|
||||
|
||||
@ -2,5 +2,5 @@
|
||||
export enum ContentType {
|
||||
json = 'application/json',
|
||||
formUrlencoded = 'application/x-www-form-urlencoded',
|
||||
formData = 'multipart/form-data'
|
||||
formData = 'multipart/form-data',
|
||||
}
|
||||
|
||||
@ -8,5 +8,5 @@ export enum EnumStorageKey {
|
||||
/** 用户信息 */
|
||||
'user-info' = '__USER_INFO__',
|
||||
/** 多页签路由信息 */
|
||||
'tab-routes' = '__TAB_ROUTES__'
|
||||
'tab-routes' = '__TAB_ROUTES__',
|
||||
}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
/** 布局组件的名称 */
|
||||
export enum EnumLayoutComponentName {
|
||||
basic = 'basic-layout',
|
||||
blank = 'blank-layout'
|
||||
blank = 'blank-layout',
|
||||
}
|
||||
|
||||
/** 登录模块 */
|
||||
@ -10,5 +10,5 @@ export enum EnumLoginModule {
|
||||
'code-login' = '手机验证码登录',
|
||||
'register' = '注册',
|
||||
'reset-pwd' = '重置密码',
|
||||
'bind-wechat' = '微信绑定'
|
||||
'bind-wechat' = '微信绑定',
|
||||
}
|
||||
|
||||
@ -3,20 +3,20 @@ export enum EnumThemeLayoutMode {
|
||||
'vertical' = '左侧菜单模式',
|
||||
'horizontal' = '顶部菜单模式',
|
||||
'vertical-mix' = '左侧菜单混合模式',
|
||||
'horizontal-mix' = '顶部菜单混合模式'
|
||||
'horizontal-mix' = '顶部菜单混合模式',
|
||||
}
|
||||
|
||||
/** 多页签风格 */
|
||||
export enum EnumThemeTabMode {
|
||||
'chrome' = '谷歌风格',
|
||||
'button' = '按钮风格'
|
||||
'button' = '按钮风格',
|
||||
}
|
||||
|
||||
/** 水平模式的菜单位置 */
|
||||
export enum EnumThemeHorizontalMenuPosition {
|
||||
'flex-start' = '居左',
|
||||
'center' = '居中',
|
||||
'flex-end' = '居右'
|
||||
'flex-end' = '居右',
|
||||
}
|
||||
|
||||
/** 过渡动画类型 */
|
||||
@ -26,5 +26,5 @@ export enum EnumThemeAnimateMode {
|
||||
'fade-slide' = '滑动',
|
||||
'fade' = '消退',
|
||||
'fade-bottom' = '底部消退',
|
||||
'fade-scale' = '缩放消退'
|
||||
'fade-scale' = '缩放消退',
|
||||
}
|
||||
|
||||
@ -10,5 +10,5 @@ export enum EnumDataType {
|
||||
date = '[object Date]',
|
||||
regexp = '[object RegExp]',
|
||||
set = '[object Set]',
|
||||
map = '[object Map]'
|
||||
map = '[object Map]',
|
||||
}
|
||||
|
||||
@ -47,6 +47,6 @@ export default function useCountDown(second: number) {
|
||||
isCounting,
|
||||
start,
|
||||
stop,
|
||||
isComplete
|
||||
isComplete,
|
||||
};
|
||||
}
|
||||
|
||||
@ -26,7 +26,7 @@ export default function useImageVerify(width = 152, height = 40) {
|
||||
domRef,
|
||||
imgCode,
|
||||
setImgCode,
|
||||
getImgCode
|
||||
getImgCode,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -54,6 +54,6 @@ export default function useSmsCode() {
|
||||
start,
|
||||
isCounting,
|
||||
getSmsCode,
|
||||
loading
|
||||
loading,
|
||||
};
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ interface ScrollBodyStyle {
|
||||
export default function useBodyScroll(duration = 300) {
|
||||
const defaultStyle: ScrollBodyStyle = {
|
||||
overflow: '',
|
||||
paddingRight: ''
|
||||
paddingRight: '',
|
||||
};
|
||||
function getInitBodyStyle() {
|
||||
const { overflow, paddingRight } = document.body.style;
|
||||
@ -42,6 +42,6 @@ export default function useBodyScroll(duration = 300) {
|
||||
getInitBodyStyle();
|
||||
|
||||
return {
|
||||
scrollBodyHandler
|
||||
scrollBodyHandler,
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { ref } from 'vue';
|
||||
|
||||
export default function useBoolean(initValue: boolean = false) {
|
||||
export default function useBoolean(initValue = false) {
|
||||
const bool = ref(initValue);
|
||||
|
||||
function setBool(value: boolean) {
|
||||
@ -21,6 +21,6 @@ export default function useBoolean(initValue: boolean = false) {
|
||||
setBool,
|
||||
setTrue,
|
||||
setFalse,
|
||||
toggle
|
||||
toggle,
|
||||
};
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@ import { provide, inject } from 'vue';
|
||||
import type { InjectionKey } from 'vue';
|
||||
|
||||
/** 创建共享上下文状态 */
|
||||
export default function useContext<T>(contextName: string = 'context') {
|
||||
export default function useContext<T>(contextName = 'context') {
|
||||
const injectKey: InjectionKey<T> = Symbol(contextName);
|
||||
|
||||
function useProvide(context: T) {
|
||||
@ -10,11 +10,11 @@ export default function useContext<T>(contextName: string = 'context') {
|
||||
}
|
||||
|
||||
function useInject() {
|
||||
return inject(injectKey)!;
|
||||
return inject(injectKey) as T;
|
||||
}
|
||||
|
||||
return {
|
||||
useProvide,
|
||||
useInject
|
||||
useInject,
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import useBoolean from './useBoolean';
|
||||
|
||||
export default function useLoading(initValue: boolean = false) {
|
||||
export default function useLoading(initValue = false) {
|
||||
const { bool: loading, setTrue: startLoading, setFalse: endLoading } = useBoolean(initValue);
|
||||
|
||||
return {
|
||||
loading,
|
||||
startLoading,
|
||||
endLoading
|
||||
endLoading,
|
||||
};
|
||||
}
|
||||
|
||||
@ -9,6 +9,6 @@ export default function useLoadingEmpty(initLoading = false, initEmpty = false)
|
||||
startLoading,
|
||||
endLoading,
|
||||
empty,
|
||||
setEmpty
|
||||
setEmpty,
|
||||
};
|
||||
}
|
||||
|
||||
@ -11,7 +11,7 @@ export default function useModalVisible(hideScroll = true) {
|
||||
const { scrollBodyHandler } = useBodyScroll();
|
||||
|
||||
function modalVisibleWatcher() {
|
||||
const stopHandle = watch(visible, async newValue => {
|
||||
const stopHandle = watch(visible, async (newValue) => {
|
||||
scrollBodyHandler(newValue);
|
||||
});
|
||||
|
||||
@ -28,6 +28,6 @@ export default function useModalVisible(hideScroll = true) {
|
||||
visible,
|
||||
openModal,
|
||||
closeModal,
|
||||
toggleModal
|
||||
toggleModal,
|
||||
};
|
||||
}
|
||||
|
||||
@ -24,6 +24,6 @@ export default function useReload() {
|
||||
|
||||
return {
|
||||
reloadFlag,
|
||||
handleReload
|
||||
handleReload,
|
||||
};
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ import type {
|
||||
EnumThemeTabMode,
|
||||
EnumThemeHorizontalMenuPosition,
|
||||
EnumThemeAnimateMode,
|
||||
EnumLoginModule
|
||||
EnumLoginModule,
|
||||
} from '@/enum';
|
||||
|
||||
/** 布局组件名称 */
|
||||
|
||||
@ -2,7 +2,7 @@ import type {
|
||||
EnumThemeLayoutMode,
|
||||
EnumThemeTabMode,
|
||||
EnumThemeHorizontalMenuPosition,
|
||||
EnumThemeAnimateMode
|
||||
EnumThemeAnimateMode,
|
||||
} from '@/enum';
|
||||
import type { ThemeLayoutMode, ThemeTabMode, ThemeHorizontalMenuPosition, ThemeAnimateMode } from './enum';
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@ interface Props {
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
showPadding: true
|
||||
showPadding: true,
|
||||
});
|
||||
|
||||
const app = useAppStore();
|
||||
|
||||
@ -20,17 +20,17 @@ const options = [
|
||||
{
|
||||
label: '用户中心',
|
||||
key: 'user-center',
|
||||
icon: iconifyRender('carbon:user-avatar')
|
||||
icon: iconifyRender('carbon:user-avatar'),
|
||||
},
|
||||
{
|
||||
type: 'divider',
|
||||
key: 'divider'
|
||||
key: 'divider',
|
||||
},
|
||||
{
|
||||
label: '退出登录',
|
||||
key: 'logout',
|
||||
icon: iconifyRender('carbon:logout')
|
||||
}
|
||||
icon: iconifyRender('carbon:logout'),
|
||||
},
|
||||
];
|
||||
|
||||
function handleDropdown(optionKey: string) {
|
||||
@ -43,7 +43,7 @@ function handleDropdown(optionKey: string) {
|
||||
negativeText: '取消',
|
||||
onPositiveClick: () => {
|
||||
auth.resetAuthStore();
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -31,7 +31,7 @@ import {
|
||||
GithubSite,
|
||||
FullScreen,
|
||||
ThemeMode,
|
||||
UserAvatar
|
||||
UserAvatar,
|
||||
} from './components';
|
||||
|
||||
interface Props {
|
||||
|
||||
@ -61,10 +61,10 @@ const show = computed({
|
||||
},
|
||||
set(val: boolean) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
watch(show, async val => {
|
||||
watch(show, async (val) => {
|
||||
if (val) {
|
||||
/** 自动聚焦 */
|
||||
await nextTick();
|
||||
@ -75,7 +75,7 @@ watch(show, async val => {
|
||||
/** 查询 */
|
||||
function search() {
|
||||
resultOptions.value = routeStore.searchMenus.filter(
|
||||
menu => keyword.value && menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
||||
(menu) => keyword.value && menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
||||
);
|
||||
if (resultOptions.value?.length > 0) {
|
||||
activePath.value = resultOptions.value[0].path;
|
||||
@ -97,7 +97,7 @@ function handleClose() {
|
||||
function handleUp() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0) return;
|
||||
const index = resultOptions.value.findIndex(item => item.path === activePath.value);
|
||||
const index = resultOptions.value.findIndex((item) => item.path === activePath.value);
|
||||
if (index === 0) {
|
||||
activePath.value = resultOptions.value[length - 1].path;
|
||||
} else {
|
||||
@ -109,7 +109,7 @@ function handleUp() {
|
||||
function handleDown() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0) return;
|
||||
const index = resultOptions.value.findIndex(item => item.path === activePath.value);
|
||||
const index = resultOptions.value.findIndex((item) => item.path === activePath.value);
|
||||
if (index + 1 === length) {
|
||||
activePath.value = resultOptions.value[0].path;
|
||||
} else {
|
||||
@ -121,8 +121,8 @@ function handleDown() {
|
||||
function handleEnter() {
|
||||
const { length } = resultOptions.value;
|
||||
if (length === 0 || activePath.value === '') return;
|
||||
const item = resultOptions.value.find(item => item.path === activePath.value);
|
||||
if (item?.meta?.href) {
|
||||
const routeItem = resultOptions.value.find((item) => item.path === activePath.value);
|
||||
if (routeItem?.meta?.href) {
|
||||
window.open(activePath.value, '__blank');
|
||||
} else {
|
||||
router.push(activePath.value);
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
class="bg-[#e5e7eb] dark:bg-dark h-56px mt-8px px-14px rounded-4px cursor-pointer flex-y-center justify-between"
|
||||
:style="{
|
||||
background: item.path === active ? theme.themeColor : '',
|
||||
color: item.path === active ? '#fff' : ''
|
||||
color: item.path === active ? '#fff' : '',
|
||||
}"
|
||||
@click="handleTo"
|
||||
@mouseenter="handleMouse(item)"
|
||||
@ -48,7 +48,7 @@ const active = computed({
|
||||
},
|
||||
set(val: string) {
|
||||
emit('update:value', val);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
/** 鼠标移入 */
|
||||
|
||||
@ -35,7 +35,7 @@ interface Props {
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
icon: undefined,
|
||||
isMini: false
|
||||
isMini: false,
|
||||
});
|
||||
|
||||
const { bool: isHover, setTrue, setFalse } = useBoolean();
|
||||
|
||||
@ -44,7 +44,7 @@ function setActiveParentRouteName(routeName: string) {
|
||||
}
|
||||
|
||||
const firstDegreeMenus = computed(() =>
|
||||
routeStore.menus.map(item => {
|
||||
routeStore.menus.map((item) => {
|
||||
const { routeName, label } = item;
|
||||
const icon = item?.icon;
|
||||
const hasChildren = Boolean(item.children && item.children.length);
|
||||
@ -53,13 +53,13 @@ const firstDegreeMenus = computed(() =>
|
||||
routeName,
|
||||
label,
|
||||
icon,
|
||||
hasChildren
|
||||
hasChildren,
|
||||
};
|
||||
})
|
||||
);
|
||||
|
||||
function getActiveParentRouteName() {
|
||||
firstDegreeMenus.value.some(item => {
|
||||
firstDegreeMenus.value.some((item) => {
|
||||
const routeName = route.name as string;
|
||||
const flag = routeName?.includes(item.routeName);
|
||||
if (flag) {
|
||||
@ -85,10 +85,10 @@ function resetFirstDegreeMenus() {
|
||||
|
||||
const activeChildMenus = computed(() => {
|
||||
const menus: GlobalMenuOption[] = [];
|
||||
routeStore.menus.some(item => {
|
||||
routeStore.menus.some((item) => {
|
||||
const flag = item.routeName === activeParentRouteName.value && Boolean(item.children?.length);
|
||||
if (flag) {
|
||||
menus.push(...item.children!);
|
||||
menus.push(...(item.children || []));
|
||||
}
|
||||
return flag;
|
||||
});
|
||||
|
||||
@ -38,7 +38,7 @@ type Option = DropdownOption & {
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
visible: false,
|
||||
currentPath: ''
|
||||
currentPath: '',
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
@ -52,7 +52,7 @@ const dropdownVisible = computed({
|
||||
},
|
||||
set(visible: boolean) {
|
||||
emit('update:visible', visible);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
function hide() {
|
||||
@ -64,29 +64,29 @@ const options = computed<Option[]>(() => [
|
||||
label: '重新加载',
|
||||
key: 'reload-current',
|
||||
disabled: props.currentPath !== tab.activeTab,
|
||||
icon: iconifyRender('ant-design:reload-outlined')
|
||||
icon: iconifyRender('ant-design:reload-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭',
|
||||
key: 'close-current',
|
||||
disabled: props.currentPath === tab.homeTab.path,
|
||||
icon: iconifyRender('ant-design:close-outlined')
|
||||
icon: iconifyRender('ant-design:close-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭其他',
|
||||
key: 'close-other',
|
||||
icon: iconifyRender('ant-design:column-width-outlined')
|
||||
icon: iconifyRender('ant-design:column-width-outlined'),
|
||||
},
|
||||
{
|
||||
label: '关闭左侧',
|
||||
key: 'close-left',
|
||||
icon: iconifyRender('mdi:format-horizontal-align-left')
|
||||
icon: iconifyRender('mdi:format-horizontal-align-left'),
|
||||
},
|
||||
{
|
||||
label: '关闭右侧',
|
||||
key: 'close-right',
|
||||
icon: iconifyRender('mdi:format-horizontal-align-right')
|
||||
}
|
||||
icon: iconifyRender('mdi:format-horizontal-align-right'),
|
||||
},
|
||||
]);
|
||||
|
||||
const actionMap = new Map<DropdownKey, () => void>([
|
||||
@ -94,32 +94,32 @@ const actionMap = new Map<DropdownKey, () => void>([
|
||||
'reload-current',
|
||||
() => {
|
||||
app.reloadPage();
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-current',
|
||||
() => {
|
||||
tab.removeTab(props.currentPath);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-other',
|
||||
() => {
|
||||
tab.clearTab([props.currentPath]);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-left',
|
||||
() => {
|
||||
tab.clearLeftTab(props.currentPath);
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
'close-right',
|
||||
() => {
|
||||
tab.clearRightTab(props.currentPath);
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
]);
|
||||
|
||||
function handleDropdown(optionKey: string) {
|
||||
|
||||
@ -64,7 +64,7 @@ const dropdown = reactive({
|
||||
visible: false,
|
||||
x: 0,
|
||||
y: 0,
|
||||
currentPath: ''
|
||||
currentPath: '',
|
||||
});
|
||||
function showDropdown() {
|
||||
dropdown.visible = true;
|
||||
@ -92,7 +92,7 @@ watch(
|
||||
getActiveTabClientX();
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
immediate: true,
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
@ -45,23 +45,23 @@ const layoutConfig: LayoutConfig = {
|
||||
vertical: {
|
||||
placement: 'bottom-start',
|
||||
menuClass: 'w-1/3 h-full',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
'vertical-mix': {
|
||||
placement: 'bottom',
|
||||
menuClass: 'w-1/4 h-full',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
horizontal: {
|
||||
placement: 'bottom',
|
||||
menuClass: 'w-full h-1/4',
|
||||
mainClass: 'w-full h-3/4'
|
||||
mainClass: 'w-full h-3/4',
|
||||
},
|
||||
'horizontal-mix': {
|
||||
placement: 'bottom-end',
|
||||
menuClass: 'w-full h-1/4',
|
||||
mainClass: 'w-2/3 h-3/4'
|
||||
}
|
||||
mainClass: 'w-2/3 h-3/4',
|
||||
},
|
||||
};
|
||||
|
||||
const activeConfig = computed(() => layoutConfig[props.mode]);
|
||||
|
||||
@ -17,7 +17,7 @@ interface Props {
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
iconClass: 'text-14px'
|
||||
iconClass: 'text-14px',
|
||||
});
|
||||
|
||||
const whiteColors = ['#ffffff', '#fff', 'rgb(255,255,255)'];
|
||||
|
||||
@ -30,12 +30,13 @@ function handleResetConfig() {
|
||||
}
|
||||
|
||||
function clipboardEventListener() {
|
||||
const copy = new Clipboard(copyRef.value!);
|
||||
if (!copyRef.value) return;
|
||||
const copy = new Clipboard(copyRef.value);
|
||||
copy.on('success', () => {
|
||||
window.$dialog?.success({
|
||||
title: '操作成功',
|
||||
content: '复制成功,请替换 src/settings/theme.json的内容！',
|
||||
positiveText: '确定'
|
||||
positiveText: '确定',
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -5,4 +5,6 @@ import 'swiper/css/pagination';
|
||||
import '../styles/css/global.css';
|
||||
|
||||
/** 引入静态资源(全局引入css、字体等) */
|
||||
export default function setupAssets() {}
|
||||
export default function setupAssets() {
|
||||
//
|
||||
}
|
||||
|
||||
@ -45,7 +45,7 @@ import {
|
||||
NThing,
|
||||
NTimeline,
|
||||
NTimelineItem,
|
||||
NTooltip
|
||||
NTooltip,
|
||||
} from 'naive-ui';
|
||||
|
||||
/** 按需引入naiveUI */
|
||||
@ -96,8 +96,8 @@ export default function setupNaiveUI(app: App) {
|
||||
NThing,
|
||||
NTimeline,
|
||||
NTimelineItem,
|
||||
NTooltip
|
||||
]
|
||||
NTooltip,
|
||||
],
|
||||
});
|
||||
app.use(naive);
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@ export function createRouterGuard(router: Router) {
|
||||
// 页面跳转权限处理
|
||||
await createPermissionGuard(to, from, next, router);
|
||||
});
|
||||
router.afterEach(to => {
|
||||
router.afterEach((to) => {
|
||||
// 设置document title
|
||||
useTitle(to.meta.title);
|
||||
// 结束 loadingBar
|
||||
|
||||
@ -34,14 +34,14 @@ export async function createPermissionGuard(
|
||||
isLogin && to.name === routeName('login'),
|
||||
() => {
|
||||
next({ name: routeName('root') });
|
||||
}
|
||||
},
|
||||
],
|
||||
// 不需要登录权限的页面直接通行
|
||||
[
|
||||
!needLogin,
|
||||
() => {
|
||||
next();
|
||||
}
|
||||
},
|
||||
],
|
||||
// 未登录状态进入需要登录权限的页面
|
||||
[
|
||||
@ -49,22 +49,22 @@ export async function createPermissionGuard(
|
||||
() => {
|
||||
const redirect = to.fullPath;
|
||||
next({ name: routeName('login'), query: { redirect } });
|
||||
}
|
||||
},
|
||||
],
|
||||
// 登录状态进入需要登录权限的页面，有权限直接通行
|
||||
[
|
||||
isLogin && needLogin && hasPermission,
|
||||
() => {
|
||||
next();
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 登录状态进入需要登录权限的页面，无权限，重定向到无权限页面
|
||||
isLogin && needLogin && !hasPermission,
|
||||
() => {
|
||||
next({ name: routeName('no-permission') });
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
exeStrategyActions(actions);
|
||||
|
||||
@ -2,20 +2,20 @@ import type { RouterScrollBehavior } from 'vue-router';
|
||||
import { useTabStore } from '@/store';
|
||||
|
||||
export const scrollBehavior: RouterScrollBehavior = (to, from) => {
|
||||
return new Promise(resolve => {
|
||||
return new Promise((resolve) => {
|
||||
const tab = useTabStore();
|
||||
|
||||
if (to.hash) {
|
||||
resolve({
|
||||
el: to.hash,
|
||||
behavior: 'smooth'
|
||||
behavior: 'smooth',
|
||||
});
|
||||
}
|
||||
|
||||
const { left, top } = tab.getTabScrollPosition(to.path);
|
||||
const scrollPosition = {
|
||||
left,
|
||||
top
|
||||
top,
|
||||
};
|
||||
const { scrollLeft, scrollTop } = document.documentElement;
|
||||
|
||||
|
||||
@ -11,7 +11,7 @@ const history = VITE_HASH_ROUTE === 'true' ? createWebHashHistory(VITE_BASE_URL)
|
||||
export const router = createRouter({
|
||||
history,
|
||||
routes: transformAuthRoutesToVueRoutes(constantRoutes),
|
||||
scrollBehavior
|
||||
scrollBehavior,
|
||||
});
|
||||
|
||||
export async function setupRouter(app: App) {
|
||||
|
||||
@ -8,24 +8,24 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
path: '/',
|
||||
redirect: '/dashboard/analysis',
|
||||
meta: {
|
||||
title: 'Root'
|
||||
}
|
||||
title: 'Root',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'login',
|
||||
path: '/login',
|
||||
component: 'self',
|
||||
props: route => {
|
||||
props: (route) => {
|
||||
const moduleType = (route.params.module as LoginModuleKey) || 'pwd-login';
|
||||
return {
|
||||
module: moduleType
|
||||
module: moduleType,
|
||||
};
|
||||
},
|
||||
meta: {
|
||||
title: '登录',
|
||||
dynamicPath: `/login/:module(${getLoginModuleRegExp()})?`,
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'no-permission',
|
||||
@ -33,8 +33,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '无权限',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'not-found',
|
||||
@ -42,8 +42,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '未找到',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'service-error',
|
||||
@ -51,8 +51,8 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'self',
|
||||
meta: {
|
||||
title: '服务器错误',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
// 匹配无效路径的路由
|
||||
{
|
||||
@ -61,9 +61,9 @@ export const constantRoutes: AuthRoute.Route[] = [
|
||||
component: 'blank',
|
||||
meta: {
|
||||
title: '未找到',
|
||||
singleLayout: 'blank'
|
||||
}
|
||||
}
|
||||
singleLayout: 'blank',
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
/** 路由名称 */
|
||||
|
||||
@ -9,8 +9,8 @@ import { fetchUpdateToken } from '../api';
|
||||
*/
|
||||
export async function refreshToken(axiosConfig: AxiosRequestConfig) {
|
||||
const { resetAuthStore } = useAuthStore();
|
||||
const refreshToken = getRefreshToken();
|
||||
const { data } = await fetchUpdateToken(refreshToken);
|
||||
const rToken = getRefreshToken();
|
||||
const { data } = await fetchUpdateToken(rToken);
|
||||
if (data) {
|
||||
setToken(data.token);
|
||||
setRefreshToken(data.refreshToken);
|
||||
|
||||
@ -7,7 +7,7 @@ import {
|
||||
handleAxiosError,
|
||||
handleResponseError,
|
||||
handleBackendError,
|
||||
handleServiceResult
|
||||
handleServiceResult,
|
||||
} from '@/utils';
|
||||
import { refreshToken } from './helpers';
|
||||
|
||||
@ -31,7 +31,7 @@ export default class CustomAxiosInstance {
|
||||
codeKey: 'code',
|
||||
dataKey: 'data',
|
||||
msgKey: 'message',
|
||||
successCode: 200
|
||||
successCode: 200,
|
||||
}
|
||||
) {
|
||||
this.backendConfig = backendConfig;
|
||||
@ -42,7 +42,7 @@ export default class CustomAxiosInstance {
|
||||
/** 设置请求拦截器 */
|
||||
setInterceptor() {
|
||||
this.instance.interceptors.request.use(
|
||||
async config => {
|
||||
async (config) => {
|
||||
const handleConfig = { ...config };
|
||||
if (handleConfig.headers) {
|
||||
// 数据转换
|
||||
@ -59,7 +59,7 @@ export default class CustomAxiosInstance {
|
||||
}
|
||||
);
|
||||
this.instance.interceptors.response.use(
|
||||
async response => {
|
||||
async (response) => {
|
||||
const { status } = response;
|
||||
if (status === 200 || status < 300 || status === 304) {
|
||||
const backend = response.data;
|
||||
|
||||
@ -85,7 +85,7 @@ export function createRequest(axiosConfig: AxiosRequestConfig, backendConfig?: S
|
||||
get,
|
||||
post,
|
||||
put,
|
||||
delete: handleDelete
|
||||
delete: handleDelete,
|
||||
};
|
||||
}
|
||||
|
||||
@ -138,7 +138,7 @@ export function createHookRequest(axiosConfig: AxiosRequestConfig, backendConfig
|
||||
data,
|
||||
error,
|
||||
loading,
|
||||
network
|
||||
network,
|
||||
};
|
||||
}
|
||||
|
||||
@ -183,7 +183,7 @@ export function createHookRequest(axiosConfig: AxiosRequestConfig, backendConfig
|
||||
get,
|
||||
post,
|
||||
put,
|
||||
delete: handleDelete
|
||||
delete: handleDelete,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -13,8 +13,8 @@ interface TraditionColor {
|
||||
export const traditionColors = colorJson as TraditionColor[];
|
||||
|
||||
export function isInTraditionColors(color: string) {
|
||||
return traditionColors.some(item => {
|
||||
const flag = item.data.some(v => v.color === color);
|
||||
return traditionColors.some((item) => {
|
||||
const flag = item.data.some((v) => v.color === color);
|
||||
return flag;
|
||||
});
|
||||
}
|
||||
|
||||
@ -26,7 +26,7 @@ const themeColorList = [
|
||||
'#ffb300',
|
||||
'#fdd835',
|
||||
'#6d4c41',
|
||||
'#546e7a'
|
||||
'#546e7a',
|
||||
];
|
||||
|
||||
const defaultThemeSetting: ThemeSetting = {
|
||||
@ -38,8 +38,8 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
{ value: 'vertical', label: EnumThemeLayoutMode.vertical },
|
||||
{ value: 'vertical-mix', label: EnumThemeLayoutMode['vertical-mix'] },
|
||||
{ value: 'horizontal', label: EnumThemeLayoutMode.horizontal },
|
||||
{ value: 'horizontal-mix', label: EnumThemeLayoutMode['horizontal-mix'] }
|
||||
]
|
||||
{ value: 'horizontal-mix', label: EnumThemeLayoutMode['horizontal-mix'] },
|
||||
],
|
||||
},
|
||||
themeColor: themeColorList[0],
|
||||
themeColorList,
|
||||
@ -47,7 +47,7 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
info: '#2080f0',
|
||||
success: '#52c41a',
|
||||
warning: '#faad14',
|
||||
error: '#f5222d'
|
||||
error: '#f5222d',
|
||||
},
|
||||
isCustomizeInfoColor: false,
|
||||
fixedHeaderAndTab: true,
|
||||
@ -56,8 +56,8 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
height: 56,
|
||||
crumb: {
|
||||
visible: true,
|
||||
showIcon: true
|
||||
}
|
||||
showIcon: true,
|
||||
},
|
||||
},
|
||||
tab: {
|
||||
visible: true,
|
||||
@ -65,28 +65,28 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
mode: 'chrome',
|
||||
modeList: [
|
||||
{ value: 'chrome', label: EnumThemeTabMode.chrome },
|
||||
{ value: 'button', label: EnumThemeTabMode.button }
|
||||
{ value: 'button', label: EnumThemeTabMode.button },
|
||||
],
|
||||
isCache: true
|
||||
isCache: true,
|
||||
},
|
||||
sider: {
|
||||
width: 220,
|
||||
collapsedWidth: 64,
|
||||
mixWidth: 80,
|
||||
mixCollapsedWidth: 48,
|
||||
mixChildMenuWidth: 200
|
||||
mixChildMenuWidth: 200,
|
||||
},
|
||||
menu: {
|
||||
horizontalPosition: 'flex-start',
|
||||
horizontalPositionList: [
|
||||
{ value: 'flex-start', label: EnumThemeHorizontalMenuPosition['flex-start'] },
|
||||
{ value: 'center', label: EnumThemeHorizontalMenuPosition.center },
|
||||
{ value: 'flex-end', label: EnumThemeHorizontalMenuPosition['flex-end'] }
|
||||
]
|
||||
{ value: 'flex-end', label: EnumThemeHorizontalMenuPosition['flex-end'] },
|
||||
],
|
||||
},
|
||||
footer: {
|
||||
fixed: false,
|
||||
height: 48
|
||||
height: 48,
|
||||
},
|
||||
page: {
|
||||
animate: true,
|
||||
@ -97,9 +97,9 @@ const defaultThemeSetting: ThemeSetting = {
|
||||
{ value: 'fade-bottom', label: EnumThemeAnimateMode['fade-bottom'] },
|
||||
{ value: 'fade-scale', label: EnumThemeAnimateMode['fade-scale'] },
|
||||
{ value: 'zoom-fade', label: EnumThemeAnimateMode['zoom-fade'] },
|
||||
{ value: 'zoom-out', label: EnumThemeAnimateMode['zoom-out'] }
|
||||
]
|
||||
}
|
||||
{ value: 'zoom-out', label: EnumThemeAnimateMode['zoom-out'] },
|
||||
],
|
||||
},
|
||||
};
|
||||
|
||||
export const themeSetting = (jsonSetting as ThemeSetting) || defaultThemeSetting;
|
||||
|
||||
@ -17,7 +17,7 @@ export const useAppStore = defineStore('app-store', {
|
||||
reloadFlag: true,
|
||||
settingDrawerVisible: false,
|
||||
siderCollapse: false,
|
||||
mixSiderFixed: false
|
||||
mixSiderFixed: false,
|
||||
}),
|
||||
actions: {
|
||||
/**
|
||||
@ -65,6 +65,6 @@ export const useAppStore = defineStore('app-store', {
|
||||
/** 设置 vertical-mix模式下 侧边栏的固定状态 */
|
||||
toggleMixSiderFixed() {
|
||||
this.mixSiderFixed = !this.mixSiderFixed;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -18,13 +18,13 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
state: (): AuthState => ({
|
||||
userInfo: getUserInfo(),
|
||||
token: getToken(),
|
||||
loginLoding: false
|
||||
loginLoding: false,
|
||||
}),
|
||||
getters: {
|
||||
/** 是否登录 */
|
||||
isLogin(state) {
|
||||
return Boolean(state.token);
|
||||
}
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/** 重置auth状态 */
|
||||
@ -67,7 +67,7 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
window.$notification?.success({
|
||||
title: '登录成功!',
|
||||
content: `欢迎回来，${data.userName}!`,
|
||||
duration: 3000
|
||||
duration: 3000,
|
||||
});
|
||||
} else {
|
||||
// 不成功则重置状态
|
||||
@ -87,6 +87,6 @@ export const useAuthStore = defineStore('auth-store', {
|
||||
await this.loginByToken(data);
|
||||
}
|
||||
this.loginLoding = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -6,7 +6,7 @@ import {
|
||||
transformAuthRouteToMenu,
|
||||
transformAuthRoutesToVueRoutes,
|
||||
transformAuthRoutesToSearchMenus,
|
||||
getCacheRoutes
|
||||
getCacheRoutes,
|
||||
} from '@/utils';
|
||||
import type { GlobalMenuOption, SearchMenu } from '@/interface';
|
||||
import { useTabStore } from '../tab';
|
||||
@ -30,7 +30,7 @@ export const useRouteStore = defineStore('route-store', {
|
||||
routeHomeName: 'dashboard_analysis',
|
||||
menus: [],
|
||||
searchMenus: [],
|
||||
cacheRoutes: []
|
||||
cacheRoutes: [],
|
||||
}),
|
||||
actions: {
|
||||
/**
|
||||
@ -49,7 +49,7 @@ export const useRouteStore = defineStore('route-store', {
|
||||
this.searchMenus = transformAuthRoutesToSearchMenus(data.routes);
|
||||
|
||||
const vueRoutes = transformAuthRoutesToVueRoutes(data.routes);
|
||||
vueRoutes.forEach(route => {
|
||||
vueRoutes.forEach((route) => {
|
||||
router.addRoute(route);
|
||||
});
|
||||
|
||||
@ -58,6 +58,6 @@ export const useRouteStore = defineStore('route-store', {
|
||||
initHomeTab(data.home, router);
|
||||
this.isAddedDynamicRoute = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -12,8 +12,8 @@ export function getTabRouteByVueRoute(route: RouteRecordNormalized | RouteLocati
|
||||
meta: route.meta,
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
};
|
||||
return tabRoute;
|
||||
}
|
||||
@ -24,7 +24,7 @@ export function getTabRouteByVueRoute(route: RouteRecordNormalized | RouteLocati
|
||||
* @param path - 该页签的路径
|
||||
*/
|
||||
export function getIndexInTabRoutes(tabs: GlobalTabRoute[], path: string) {
|
||||
return tabs.findIndex(tab => tab.path === path);
|
||||
return tabs.findIndex((tab) => tab.path === path);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -22,21 +22,21 @@ export const useTabStore = defineStore('tab-store', {
|
||||
name: 'root',
|
||||
path: '/',
|
||||
meta: {
|
||||
title: 'root'
|
||||
title: 'root',
|
||||
},
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
},
|
||||
activeTab: ''
|
||||
activeTab: '',
|
||||
}),
|
||||
getters: {
|
||||
/** 当前激活状态的页签索引 */
|
||||
activeTabIndex(state) {
|
||||
const { tabs, activeTab } = state;
|
||||
return tabs.findIndex(tab => tab.path === activeTab);
|
||||
}
|
||||
return tabs.findIndex((tab) => tab.path === activeTab);
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/**
|
||||
@ -53,7 +53,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
*/
|
||||
initHomeTab(routeHomeName: string, router: Router) {
|
||||
const routes = router.getRoutes();
|
||||
const findHome = routes.find(item => item.name === routeHomeName);
|
||||
const findHome = routes.find((item) => item.name === routeHomeName);
|
||||
if (findHome) {
|
||||
this.homeTab = getTabRouteByVueRoute(findHome);
|
||||
}
|
||||
@ -75,7 +75,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
const { routerPush } = useRouterPush(false);
|
||||
|
||||
const isActive = this.activeTab === path;
|
||||
const updateTabs = this.tabs.filter(tab => tab.path !== path);
|
||||
const updateTabs = this.tabs.filter((tab) => tab.path !== path);
|
||||
this.tabs = updateTabs;
|
||||
if (isActive && updateTabs.length) {
|
||||
const activePath = updateTabs[updateTabs.length - 1].path;
|
||||
@ -93,7 +93,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
const homePath = this.homeTab.path;
|
||||
const remain = [homePath, ...excludes];
|
||||
const hasActive = remain.includes(this.activeTab);
|
||||
const updateTabs = this.tabs.filter(tab => remain.includes(tab.path));
|
||||
const updateTabs = this.tabs.filter((tab) => remain.includes(tab.path));
|
||||
this.tabs = updateTabs;
|
||||
if (!hasActive && updateTabs.length) {
|
||||
const activePath = updateTabs[updateTabs.length - 1].path;
|
||||
@ -108,7 +108,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
clearLeftTab(path: string) {
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
const excludes = this.tabs.slice(index).map(item => item.path);
|
||||
const excludes = this.tabs.slice(index).map((item) => item.path);
|
||||
this.clearTab(excludes);
|
||||
}
|
||||
},
|
||||
@ -119,7 +119,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
clearRightTab(path: string) {
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
const excludes = this.tabs.slice(0, index + 1).map(item => item.path);
|
||||
const excludes = this.tabs.slice(0, index + 1).map((item) => item.path);
|
||||
this.clearTab(excludes);
|
||||
}
|
||||
},
|
||||
@ -154,7 +154,7 @@ export const useTabStore = defineStore('tab-store', {
|
||||
getTabScrollPosition(path: string) {
|
||||
const position = {
|
||||
left: 0,
|
||||
top: 0
|
||||
top: 0,
|
||||
};
|
||||
const index = getIndexInTabRoutes(this.tabs, path);
|
||||
if (index > -1) {
|
||||
@ -178,6 +178,6 @@ export const useTabStore = defineStore('tab-store', {
|
||||
}
|
||||
this.tabs = tabs;
|
||||
this.setActiveTab(currentRoute.path);
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -26,17 +26,17 @@ interface ColorAction {
|
||||
/** 获取主题颜色的各种场景对应的颜色 */
|
||||
function getThemeColors(colors: [ColorType, string][]) {
|
||||
const colorActions: ColorAction[] = [
|
||||
{ scene: '', handler: color => color },
|
||||
{ scene: 'Suppl', handler: color => color },
|
||||
{ scene: 'Hover', handler: color => getColorPalette(color, 5) },
|
||||
{ scene: 'Pressed', handler: color => getColorPalette(color, 7) },
|
||||
{ scene: 'Active', handler: color => addColorAlpha(color, 0.1) }
|
||||
{ scene: '', handler: (color) => color },
|
||||
{ scene: 'Suppl', handler: (color) => color },
|
||||
{ scene: 'Hover', handler: (color) => getColorPalette(color, 5) },
|
||||
{ scene: 'Pressed', handler: (color) => getColorPalette(color, 7) },
|
||||
{ scene: 'Active', handler: (color) => addColorAlpha(color, 0.1) },
|
||||
];
|
||||
|
||||
const themeColor: ThemeColor = {};
|
||||
|
||||
colors.forEach(color => {
|
||||
colorActions.forEach(action => {
|
||||
colors.forEach((color) => {
|
||||
colorActions.forEach((action) => {
|
||||
const [colorType, colorValue] = color;
|
||||
const colorKey: ColorKey = `${colorType}Color${action.scene}`;
|
||||
themeColor[colorKey] = action.handler(colorValue);
|
||||
@ -57,18 +57,18 @@ export function getNaiveThemeOverrides(colors: Record<ColorType, string>): Globa
|
||||
['info', info],
|
||||
['success', success],
|
||||
['warning', warning],
|
||||
['error', error]
|
||||
['error', error],
|
||||
]);
|
||||
|
||||
const colorLoading = primary;
|
||||
|
||||
return {
|
||||
common: {
|
||||
...themeColors
|
||||
...themeColors,
|
||||
},
|
||||
LoadingBar: {
|
||||
colorLoading
|
||||
}
|
||||
colorLoading,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@ -79,7 +79,7 @@ type ThemeVarsKeys = keyof ThemeVars;
|
||||
export function addThemeCssVarsToHtml(themeVars: ThemeVars) {
|
||||
const keys = Object.keys(themeVars) as ThemeVarsKeys[];
|
||||
const style: string[] = [];
|
||||
keys.forEach(key => {
|
||||
keys.forEach((key) => {
|
||||
style.push(`--${kebabCase(key)}: ${themeVars[key]}`);
|
||||
});
|
||||
const styleStr = style.join(';');
|
||||
@ -97,6 +97,6 @@ export function handleWindicssDarkMode() {
|
||||
}
|
||||
return {
|
||||
addDarkClass,
|
||||
removeDarkClass
|
||||
removeDarkClass,
|
||||
};
|
||||
}
|
||||
|
||||
@ -5,7 +5,7 @@ import type {
|
||||
ThemeLayoutMode,
|
||||
ThemeTabMode,
|
||||
ThemeHorizontalMenuPosition,
|
||||
ThemeAnimateMode
|
||||
ThemeAnimateMode,
|
||||
} from '@/interface';
|
||||
import { getThemeSettings, getNaiveThemeOverrides, addThemeCssVarsToHtml } from './helpers';
|
||||
|
||||
@ -17,13 +17,15 @@ export const useThemeStore = defineStore('theme-store', {
|
||||
/** naiveUI的主题配置 */
|
||||
naiveThemeOverrides(state) {
|
||||
const overrides = getNaiveThemeOverrides({ primary: state.themeColor, ...state.otherColor });
|
||||
addThemeCssVarsToHtml(overrides.common!);
|
||||
if (overrides.common) {
|
||||
addThemeCssVarsToHtml(overrides.common);
|
||||
}
|
||||
return overrides;
|
||||
},
|
||||
/** naive-ui暗黑主题 */
|
||||
naiveTheme(state) {
|
||||
return state.darkMode ? darkTheme : undefined;
|
||||
}
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
/** 重置theme状态 */
|
||||
@ -133,6 +135,6 @@ export const useThemeStore = defineStore('theme-store', {
|
||||
/** 设置页面过渡动画类型 */
|
||||
setPageAnimateMode(mode: ThemeAnimateMode) {
|
||||
this.page.animateMode = mode;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
@ -10,7 +10,7 @@ export default function subscribeAppStore() {
|
||||
// 弹窗打开时禁止滚动条
|
||||
const stopHandle = watch(
|
||||
() => app.settingDrawerVisible,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
scrollBodyHandler(newValue);
|
||||
}
|
||||
);
|
||||
|
||||
@ -13,7 +13,7 @@ export default function subscribeThemeStore() {
|
||||
|
||||
const stopThemeColor = watch(
|
||||
() => theme.themeColor,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
setThemeColor(newValue);
|
||||
},
|
||||
{ immediate: true }
|
||||
@ -22,7 +22,7 @@ export default function subscribeThemeStore() {
|
||||
// 监听暗黑模式
|
||||
const stopDarkMode = watch(
|
||||
() => theme.darkMode,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
if (newValue) {
|
||||
addDarkClass();
|
||||
} else {
|
||||
@ -34,7 +34,7 @@ export default function subscribeThemeStore() {
|
||||
// 监听操作系统主题模式
|
||||
const stopOsTheme = watch(
|
||||
osTheme,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
const isDark = newValue === 'dark';
|
||||
theme.setDarkMode(isDark);
|
||||
},
|
||||
@ -42,7 +42,7 @@ export default function subscribeThemeStore() {
|
||||
);
|
||||
|
||||
// 禁用横向滚动(页面切换时,过渡动画会产生水平方向的滚动条, 小于最小宽度时，不禁止)
|
||||
const stopWidth = watch(width, newValue => {
|
||||
const stopWidth = watch(width, (newValue) => {
|
||||
if (newValue < theme.layout.minWidth) {
|
||||
document.documentElement.style.overflowX = 'auto';
|
||||
} else {
|
||||
@ -69,6 +69,6 @@ function handleWindicssDarkMode() {
|
||||
}
|
||||
return {
|
||||
addDarkClass,
|
||||
removeDarkClass
|
||||
removeDarkClass,
|
||||
};
|
||||
}
|
||||
|
||||
2
src/typings/common/env.d.ts
vendored
2
src/typings/common/env.d.ts
vendored
@ -3,7 +3,7 @@
|
||||
declare module '*.vue' {
|
||||
import { DefineComponent } from 'vue';
|
||||
|
||||
const component: DefineComponent<{}, {}, any>;
|
||||
const component: DefineComponent<object, object, any>;
|
||||
export default component;
|
||||
}
|
||||
|
||||
|
||||
7
src/typings/common/route.d.ts
vendored
7
src/typings/common/route.d.ts
vendored
@ -136,11 +136,12 @@ declare namespace AuthRoute {
|
||||
| `${Path}/:module(${string})?`;
|
||||
|
||||
/** 获取一级路由(包括有子路由的一级路由) */
|
||||
type GetSingleRouteKey<Key extends RouteKey> =
|
||||
Key extends `${infer IgnoredLeft}${RouteSplitMark}${infer IgnoredRight}` ? never : Key;
|
||||
type GetSingleRouteKey<Key extends RouteKey> = Key extends `${infer _Left}${RouteSplitMark}${infer _Right}`
|
||||
? never
|
||||
: Key;
|
||||
|
||||
/** 获取子路由的一级父路由 */
|
||||
type GetRouteFirstParentKey<Key extends RouteKey> = Key extends `${infer Left}${RouteSplitMark}${infer IgnoredRight}`
|
||||
type GetRouteFirstParentKey<Key extends RouteKey> = Key extends `${infer Left}${RouteSplitMark}${infer _Right}`
|
||||
? Left
|
||||
: never;
|
||||
}
|
||||
|
||||
2
src/typings/common/window.d.ts
vendored
2
src/typings/common/window.d.ts
vendored
@ -2,7 +2,7 @@ import type {
|
||||
LoadingBarProviderInst,
|
||||
DialogProviderInst,
|
||||
MessageProviderInst,
|
||||
NotificationProviderInst
|
||||
NotificationProviderInst,
|
||||
} from 'naive-ui';
|
||||
|
||||
declare global {
|
||||
|
||||
@ -37,7 +37,7 @@ export function getUserInfo() {
|
||||
userId: '',
|
||||
userName: '',
|
||||
userPhone: '',
|
||||
userRole: 'visitor'
|
||||
userRole: 'visitor',
|
||||
};
|
||||
const userInfo: Auth.UserInfo = getLocal<Auth.UserInfo>(EnumStorageKey['user-info']) || emptyInfo;
|
||||
return userInfo;
|
||||
|
||||
@ -30,7 +30,7 @@ export function getColorPalette(color: string, index: ColorIndex) {
|
||||
const newHsv: HsvColor = {
|
||||
h: getHue(hsv, i, isLight),
|
||||
s: getSaturation(hsv, i, isLight),
|
||||
v: getValue(hsv, i, isLight)
|
||||
v: getValue(hsv, i, isLight),
|
||||
};
|
||||
|
||||
return colord(newHsv).toHex();
|
||||
@ -42,7 +42,7 @@ export function getColorPalette(color: string, index: ColorIndex) {
|
||||
*/
|
||||
export function getAllColorPalette(color: string) {
|
||||
const indexs: ColorIndex[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
||||
return indexs.map(index => getColorPalette(color, index));
|
||||
return indexs.map((index) => getColorPalette(color, index));
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
/** 执行策略模式 */
|
||||
export function exeStrategyActions(actions: Common.StrategyAction[]) {
|
||||
actions.some(item => {
|
||||
actions.some((item) => {
|
||||
const [flag, action] = item;
|
||||
if (flag) {
|
||||
action();
|
||||
|
||||
@ -27,7 +27,7 @@ export function transformToTimeCountDown(seconds: number) {
|
||||
* @param start - 开始范围
|
||||
* @param end - 结束范围
|
||||
*/
|
||||
export function getRandomInterger(end: number, start: number = 0) {
|
||||
export function getRandomInterger(end: number, start = 0) {
|
||||
const range = end - start;
|
||||
const random = Math.floor(Math.random() * range + start);
|
||||
return random;
|
||||
|
||||
@ -18,17 +18,17 @@ interface CustomFormRules {
|
||||
export const formRules: CustomFormRules = {
|
||||
phone: [
|
||||
{ required: true, message: '请输入手机号码' },
|
||||
{ pattern: REGEXP_PHONE, message: '手机号码格式错误', trigger: 'input' }
|
||||
{ pattern: REGEXP_PHONE, message: '手机号码格式错误', trigger: 'input' },
|
||||
],
|
||||
pwd: [
|
||||
{ required: true, message: '请输入密码' },
|
||||
{ pattern: REGEXP_PWD, message: '密码为8-18位数字/字符/符号，至少2种组合', trigger: 'input' }
|
||||
{ pattern: REGEXP_PWD, message: '密码为8-18位数字/字符/符号，至少2种组合', trigger: 'input' },
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: '请输入验证码' },
|
||||
{ pattern: REGEXP_CODE_SIX, message: '验证码格式错误', trigger: 'input' }
|
||||
{ pattern: REGEXP_CODE_SIX, message: '验证码格式错误', trigger: 'input' },
|
||||
],
|
||||
email: [{ pattern: REGEXP_EMAIL, message: '邮箱格式错误', trigger: 'blur' }]
|
||||
email: [{ pattern: REGEXP_EMAIL, message: '邮箱格式错误', trigger: 'blur' }],
|
||||
};
|
||||
|
||||
/** 获取确认密码的表单规则 */
|
||||
@ -43,8 +43,8 @@ export function getConfirmPwdRule(pwd: Ref<string>) {
|
||||
return Promise.resolve();
|
||||
},
|
||||
message: '输入的值与密码不一致',
|
||||
trigger: 'input'
|
||||
}
|
||||
trigger: 'input',
|
||||
},
|
||||
];
|
||||
return confirmPwdRule;
|
||||
}
|
||||
@ -61,8 +61,8 @@ export function getImgCodeRule(imgCode: Ref<string>) {
|
||||
return Promise.resolve();
|
||||
},
|
||||
message: '验证码不正确',
|
||||
trigger: 'blur'
|
||||
}
|
||||
trigger: 'blur',
|
||||
},
|
||||
];
|
||||
return imgCodeRule;
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@ import type { GlobalMenuOption, GlobalBreadcrumb } from '@/interface';
|
||||
*/
|
||||
export function getBreadcrumbByRouteKey(activeKey: string, menus: GlobalMenuOption[], rootPath: string) {
|
||||
const breadcrumbMenu = getBreadcrumbMenu(activeKey, menus);
|
||||
const breadcrumb = breadcrumbMenu.map(item => transformBreadcrumbMenuToBreadcrumb(item, rootPath));
|
||||
const breadcrumb = breadcrumbMenu.map((item) => transformBreadcrumbMenuToBreadcrumb(item, rootPath));
|
||||
return breadcrumb;
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@ export function getBreadcrumbByRouteKey(activeKey: string, menus: GlobalMenuOpti
|
||||
*/
|
||||
function getBreadcrumbMenu(activeKey: string, menus: GlobalMenuOption[]) {
|
||||
const breadcrumbMenu: GlobalMenuOption[] = [];
|
||||
menus.some(menu => {
|
||||
menus.some((menu) => {
|
||||
const flag = activeKey.includes(menu.routeName);
|
||||
if (flag) {
|
||||
breadcrumbMenu.push(...getBreadcrumbMenuItem(activeKey, menu));
|
||||
@ -42,7 +42,7 @@ function getBreadcrumbMenuItem(activeKey: string, menu: GlobalMenuOption) {
|
||||
if (activeKey.includes(menu.routeName) && menu.children && menu.children.length) {
|
||||
breadcrumbMenu.push(menu);
|
||||
breadcrumbMenu.push(
|
||||
...menu.children.map(item => getBreadcrumbMenuItem(activeKey, item as GlobalMenuOption)).flat(1)
|
||||
...menu.children.map((item) => getBreadcrumbMenuItem(activeKey, item as GlobalMenuOption)).flat(1)
|
||||
);
|
||||
}
|
||||
|
||||
@ -61,13 +61,13 @@ function transformBreadcrumbMenuToBreadcrumb(menu: GlobalMenuOption, rootPath: s
|
||||
label: menu.label as string,
|
||||
routeName: menu.routeName,
|
||||
disabled: menu.routePath === rootPath,
|
||||
hasChildren
|
||||
hasChildren,
|
||||
};
|
||||
if (menu.icon) {
|
||||
breadcrumb.icon = menu.icon;
|
||||
}
|
||||
if (hasChildren) {
|
||||
breadcrumb.children = menu.children?.map(item =>
|
||||
breadcrumb.children = menu.children?.map((item) =>
|
||||
transformBreadcrumbMenuToBreadcrumb(item as GlobalMenuOption, rootPath)
|
||||
);
|
||||
}
|
||||
|
||||
@ -6,10 +6,10 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
*/
|
||||
export function getCacheRoutes(routes: RouteRecordRaw[]) {
|
||||
const cacheNames: string[] = [];
|
||||
routes.forEach(route => {
|
||||
routes.forEach((route) => {
|
||||
// 只需要获取二级路由的缓存的组件名
|
||||
if (hasChildren(route)) {
|
||||
route.children!.forEach(item => {
|
||||
(route.children as RouteRecordRaw[]).forEach((item) => {
|
||||
if (isKeepAlive(item)) {
|
||||
cacheNames.push(item.name as string);
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@ type LayoutComponent = Record<LayoutComponentName, () => Promise<Component>>;
|
||||
export function getLayoutComponent(layoutType: LayoutComponentName) {
|
||||
const layoutComponent: LayoutComponent = {
|
||||
basic: BasicLayout,
|
||||
blank: BlankLayout
|
||||
blank: BlankLayout,
|
||||
};
|
||||
return () => setViewComponentName(layoutComponent[layoutType], EnumLayoutComponentName[layoutType]);
|
||||
}
|
||||
|
||||
@ -10,7 +10,7 @@ type ComponentAction = Record<AuthRoute.RouteComponent, () => void>;
|
||||
* @description 所有多级路由都会被转换成二级路由
|
||||
*/
|
||||
export function transformAuthRoutesToVueRoutes(routes: AuthRoute.Route[]) {
|
||||
return routes.map(route => transformAuthRouteToVueRoute(route)).flat(1);
|
||||
return routes.map((route) => transformAuthRouteToVueRoute(route)).flat(1);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -70,10 +70,14 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
},
|
||||
self() {
|
||||
itemRoute.component = getViewComponent(item.name);
|
||||
}
|
||||
},
|
||||
};
|
||||
try {
|
||||
action[item.component!]();
|
||||
if (item.component) {
|
||||
action[item.component]();
|
||||
} else {
|
||||
consoleError('路由组件解析失败: ', item);
|
||||
}
|
||||
} catch {
|
||||
consoleError('路由组件解析失败: ', item);
|
||||
}
|
||||
@ -91,8 +95,8 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
{
|
||||
path: '',
|
||||
name: item.name,
|
||||
component: getViewComponent('not-found-page')
|
||||
}
|
||||
component: getViewComponent('not-found-page'),
|
||||
},
|
||||
];
|
||||
} else {
|
||||
const parentPath = `${itemRoute.path}-parent` as AuthRoute.SingleRouteParentPath;
|
||||
@ -103,7 +107,7 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
path: parentPath,
|
||||
component: layout,
|
||||
redirect: item.path,
|
||||
children: [itemRoute]
|
||||
children: [itemRoute],
|
||||
};
|
||||
|
||||
return [parentRoute];
|
||||
@ -112,10 +116,10 @@ function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
||||
|
||||
// 子路由
|
||||
if (hasChildren(item)) {
|
||||
const children = item.children!.map(child => transformAuthRouteToVueRoute(child)).flat();
|
||||
const children = (item.children as AuthRoute.Route[]).map((child) => transformAuthRouteToVueRoute(child)).flat();
|
||||
|
||||
// 找出第一个不为多级路由中间级的子路由路径作为重定向路径
|
||||
const redirectPath: AuthRoute.RoutePath = (children.find(item => !item.meta?.multi)?.path ||
|
||||
const redirectPath: AuthRoute.RoutePath = (children.find((v) => !v.meta?.multi)?.path ||
|
||||
'/') as AuthRoute.RoutePath;
|
||||
if (redirectPath === '/') {
|
||||
consoleError('该多级路由没有有效的子路径', item);
|
||||
|
||||
@ -24,7 +24,7 @@ function addPartialProps(menuItem: GlobalMenuOption, icon?: string, children?: G
|
||||
*/
|
||||
export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuOption[] {
|
||||
const globalMenu: GlobalMenuOption[] = [];
|
||||
routes.forEach(route => {
|
||||
routes.forEach((route) => {
|
||||
const { name, path, meta } = route;
|
||||
const routeName = name as string;
|
||||
let menuChildren: GlobalMenuOption[] | undefined;
|
||||
@ -36,7 +36,7 @@ export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuO
|
||||
key: routeName,
|
||||
label: meta.title,
|
||||
routeName,
|
||||
routePath: path
|
||||
routePath: path,
|
||||
},
|
||||
meta?.icon,
|
||||
menuChildren
|
||||
@ -56,7 +56,7 @@ export function transformAuthRouteToMenu(routes: AuthRoute.Route[]): GlobalMenuO
|
||||
* @param menus - 菜单数据
|
||||
*/
|
||||
export function getActiveKeyPathsOfMenus(activeKey: string, menus: GlobalMenuOption[]) {
|
||||
const keys = menus.map(menu => getActiveKeyPathsOfMenu(activeKey, menu)).flat(1);
|
||||
const keys = menus.map((menu) => getActiveKeyPathsOfMenu(activeKey, menu)).flat(1);
|
||||
return keys;
|
||||
}
|
||||
|
||||
@ -66,7 +66,7 @@ function getActiveKeyPathsOfMenu(activeKey: string, menu: GlobalMenuOption) {
|
||||
keys.push(menu.routeName);
|
||||
}
|
||||
if (menu.children) {
|
||||
keys.push(...menu.children.map(item => getActiveKeyPathsOfMenu(activeKey, item)).flat(1));
|
||||
keys.push(...menu.children.map((item) => getActiveKeyPathsOfMenu(activeKey, item)).flat(1));
|
||||
}
|
||||
return keys;
|
||||
}
|
||||
|
||||
@ -12,12 +12,12 @@ export function getTabRoutes() {
|
||||
const routes: GlobalTabRoute[] = [];
|
||||
const data = getLocal<GlobalTabRoute[]>(EnumStorageKey['tab-routes']);
|
||||
if (data) {
|
||||
const defaultTabRoutes = data.map(item => ({
|
||||
const defaultTabRoutes = data.map((item) => ({
|
||||
...item,
|
||||
scrollPosition: {
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
top: 0,
|
||||
},
|
||||
}));
|
||||
routes.push(...defaultTabRoutes);
|
||||
}
|
||||
|
||||
@ -6,7 +6,7 @@ import {
|
||||
NETWORK_ERROR_MSG,
|
||||
REQUEST_TIMEOUT_CODE,
|
||||
REQUEST_TIMEOUT_MSG,
|
||||
ERROR_STATUS
|
||||
ERROR_STATUS,
|
||||
} from '@/config';
|
||||
import { exeStrategyActions } from '../common';
|
||||
import { showErrorMsg } from './msg';
|
||||
@ -21,7 +21,7 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
const error: Service.RequestError = {
|
||||
type: 'axios',
|
||||
code: DEFAULT_REQUEST_ERROR_CODE,
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
const actions: Common.StrategyAction[] = [
|
||||
@ -30,14 +30,14 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
!window.navigator.onLine || axiosError.message === 'Network Error',
|
||||
() => {
|
||||
Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG });
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 超时错误
|
||||
axiosError.code === REQUEST_TIMEOUT_CODE && axiosError.message.includes('timeout'),
|
||||
() => {
|
||||
Object.assign(error, { code: REQUEST_TIMEOUT_CODE, msg: REQUEST_TIMEOUT_MSG });
|
||||
}
|
||||
},
|
||||
],
|
||||
[
|
||||
// 请求不成功的错误
|
||||
@ -46,8 +46,8 @@ export function handleAxiosError(axiosError: AxiosError) {
|
||||
const errorCode: ErrorStatus = (axiosError.response?.status as ErrorStatus) || 'DEFAULT';
|
||||
const msg = ERROR_STATUS[errorCode];
|
||||
Object.assign(error, { code: errorCode, msg });
|
||||
}
|
||||
]
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
exeStrategyActions(actions);
|
||||
@ -65,7 +65,7 @@ export function handleResponseError(response: AxiosResponse) {
|
||||
const error: Service.RequestError = {
|
||||
type: 'axios',
|
||||
code: DEFAULT_REQUEST_ERROR_CODE,
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG
|
||||
msg: DEFAULT_REQUEST_ERROR_MSG,
|
||||
};
|
||||
|
||||
if (!window.navigator.onLine) {
|
||||
@ -92,7 +92,7 @@ export function handleBackendError(backendResult: Record<string, any>, config: S
|
||||
const error: Service.RequestError = {
|
||||
type: 'backend',
|
||||
code: backendResult[codeKey],
|
||||
msg: backendResult[msgKey]
|
||||
msg: backendResult[msgKey],
|
||||
};
|
||||
|
||||
showErrorMsg(error);
|
||||
|
||||
@ -3,13 +3,13 @@ export async function handleServiceResult<T = any>(error: Service.RequestError |
|
||||
if (error) {
|
||||
const fail: Service.FailedResult = {
|
||||
error,
|
||||
data: null
|
||||
data: null,
|
||||
};
|
||||
return fail;
|
||||
}
|
||||
const success: Service.SuccessResult<T> = {
|
||||
error: null,
|
||||
data
|
||||
data,
|
||||
};
|
||||
return success;
|
||||
}
|
||||
|
||||
@ -34,7 +34,7 @@ async function transformFile(file: File[] | File, key: string) {
|
||||
if (isArray(file)) {
|
||||
// 多文件
|
||||
await Promise.all(
|
||||
(file as File[]).map(item => {
|
||||
(file as File[]).map((item) => {
|
||||
formData.append(key, item);
|
||||
return true;
|
||||
})
|
||||
|
||||
@ -27,13 +27,13 @@ function transformVersionData(tuple: [string, string]): PkgVersionInfo {
|
||||
const [name, version] = tuple;
|
||||
return {
|
||||
name,
|
||||
version
|
||||
version,
|
||||
};
|
||||
}
|
||||
|
||||
export const pkgJson: PkgJson = {
|
||||
name: pkgWithType.name,
|
||||
version: pkgWithType.version,
|
||||
dependencies: Object.entries(pkgWithType.dependencies).map(item => transformVersionData(item)),
|
||||
devDependencies: Object.entries(pkgWithType.devDependencies).map(item => transformVersionData(item))
|
||||
dependencies: Object.entries(pkgWithType.dependencies).map((item) => transformVersionData(item)),
|
||||
devDependencies: Object.entries(pkgWithType.devDependencies).map((item) => transformVersionData(item)),
|
||||
};
|
||||
|
||||
@ -63,40 +63,40 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {},
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
desc: '按钮的 type 分别为 default、primary、info、success、warning 和 error。'
|
||||
desc: '按钮的 type 分别为 default、primary、info、success、warning 和 error。',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
@ -105,74 +105,74 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { strong: true, secondary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { strong: true, secondary: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { strong: true, secondary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { strong: true, secondary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { strong: true, secondary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { strong: true, secondary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { strong: true, secondary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { strong: true, secondary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { strong: true, secondary: true, round: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { strong: true, secondary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { strong: true, secondary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { strong: true, secondary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
props: { strong: true, secondary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
props: { strong: true, secondary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@ -181,64 +181,64 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { tertiary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { tertiary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { tertiary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { tertiary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { tertiary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { tertiary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { tertiary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { tertiary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { tertiary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { tertiary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { tertiary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { tertiary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
@ -247,64 +247,64 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { quaternary: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { quaternary: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { quaternary: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { quaternary: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { quaternary: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { quaternary: true, type: 'error' },
|
||||
label: 'Error'
|
||||
label: 'Error',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { quaternary: true, round: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
props: { quaternary: true, round: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
props: { quaternary: true, round: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
props: { quaternary: true, round: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
props: { quaternary: true, round: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
props: { quaternary: true, round: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
@ -313,39 +313,39 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { dashed: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { dashed: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { dashed: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { dashed: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { dashed: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { dashed: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { dashed: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
]
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@ -354,24 +354,24 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { size: 'tiny', strong: true },
|
||||
label: '小小'
|
||||
label: '小小',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { size: 'small', strong: true },
|
||||
label: '小'
|
||||
label: '小',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { size: 'medium', strong: true },
|
||||
label: '不小'
|
||||
label: '不小',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { size: 'large', strong: true },
|
||||
label: '不不小'
|
||||
}
|
||||
]
|
||||
label: '不不小',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
@ -381,9 +381,9 @@ const buttonExample: ButtonExample[] = [
|
||||
id: 0,
|
||||
props: { text: true },
|
||||
label: '那车头依然吐着烟',
|
||||
icon: 'mdi:train'
|
||||
}
|
||||
]
|
||||
icon: 'mdi:train',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
@ -396,12 +396,12 @@ const buttonExample: ButtonExample[] = [
|
||||
tag: 'a',
|
||||
href: 'https://github.com/honghuangdc/soybean-admin',
|
||||
target: '_blank',
|
||||
type: 'primary'
|
||||
type: 'primary',
|
||||
},
|
||||
label: 'soybean-admin'
|
||||
}
|
||||
label: 'soybean-admin',
|
||||
},
|
||||
],
|
||||
desc: '你可以把按钮渲染成不同的标签，比如 a标签 。'
|
||||
desc: '你可以把按钮渲染成不同的标签，比如 a标签 。',
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
@ -410,12 +410,12 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
disabled: true
|
||||
disabled: true,
|
||||
},
|
||||
label: '不许点'
|
||||
}
|
||||
label: '不许点',
|
||||
},
|
||||
],
|
||||
desc: '按钮可以被禁用'
|
||||
desc: '按钮可以被禁用',
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
@ -425,23 +425,23 @@ const buttonExample: ButtonExample[] = [
|
||||
id: 0,
|
||||
props: {
|
||||
secondary: true,
|
||||
strong: true
|
||||
strong: true,
|
||||
},
|
||||
label: '+100元',
|
||||
icon: 'mdi:cash-100'
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
iconPlacement: 'right',
|
||||
secondary: true,
|
||||
strong: true
|
||||
strong: true,
|
||||
},
|
||||
label: '+100元',
|
||||
icon: 'mdi:cash-100'
|
||||
}
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
],
|
||||
desc: '在按钮上使用图标。'
|
||||
desc: '在按钮上使用图标。',
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
@ -450,24 +450,24 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
circle: true
|
||||
circle: true,
|
||||
},
|
||||
icon: 'mdi:cash-100'
|
||||
icon: 'mdi:cash-100',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: {
|
||||
round: true
|
||||
round: true,
|
||||
},
|
||||
label: '圆角'
|
||||
label: '圆角',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: {},
|
||||
label: '方'
|
||||
}
|
||||
label: '方',
|
||||
},
|
||||
],
|
||||
desc: '按钮拥有不同的形状。'
|
||||
desc: '按钮拥有不同的形状。',
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
@ -476,40 +476,40 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: { ghost: true },
|
||||
label: 'Default'
|
||||
label: 'Default',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: { ghost: true, type: 'tertiary' },
|
||||
label: 'Tertiary'
|
||||
label: 'Tertiary',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: { ghost: true, type: 'primary' },
|
||||
label: 'Primary'
|
||||
label: 'Primary',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: { ghost: true, type: 'info' },
|
||||
label: 'Info'
|
||||
label: 'Info',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: { ghost: true, type: 'success' },
|
||||
label: 'Success'
|
||||
label: 'Success',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: { ghost: true, type: 'warning' },
|
||||
label: 'Warning'
|
||||
label: 'Warning',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
props: { ghost: true, type: 'error' },
|
||||
label: 'Error'
|
||||
}
|
||||
label: 'Error',
|
||||
},
|
||||
],
|
||||
desc: 'Ghost 按钮有透明的背景。'
|
||||
desc: 'Ghost 按钮有透明的背景。',
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
@ -518,58 +518,58 @@ const buttonExample: ButtonExample[] = [
|
||||
{
|
||||
id: 0,
|
||||
props: {
|
||||
color: '#8a2be2'
|
||||
color: '#8a2be2',
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
props: {
|
||||
color: '#ff69b4'
|
||||
color: '#ff69b4',
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
props: {
|
||||
color: '#8a2be2',
|
||||
ghost: true
|
||||
ghost: true,
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
props: {
|
||||
color: '#ff69b4',
|
||||
ghost: true
|
||||
ghost: true,
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
props: {
|
||||
color: '#8a2be2',
|
||||
text: true
|
||||
text: true,
|
||||
},
|
||||
label: '#8a2be2',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
props: {
|
||||
color: '#ff69b4',
|
||||
text: true
|
||||
text: true,
|
||||
},
|
||||
label: '#ff69b4',
|
||||
icon: 'ic:baseline-color-lens'
|
||||
}
|
||||
icon: 'ic:baseline-color-lens',
|
||||
},
|
||||
],
|
||||
desc: '这两个颜色看起来像毒蘑菇。'
|
||||
}
|
||||
desc: '这两个颜色看起来像毒蘑菇。',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -23,7 +23,7 @@
|
||||
title="卡片分段示例"
|
||||
:segmented="{
|
||||
content: true,
|
||||
footer: 'soft'
|
||||
footer: 'soft',
|
||||
}"
|
||||
>
|
||||
<template #header-extra>#header-extra</template>
|
||||
|
||||
@ -33,16 +33,16 @@ const columns: DataTableColumn[] = [
|
||||
{
|
||||
title: 'Name',
|
||||
key: 'name',
|
||||
align: 'center'
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: 'Age',
|
||||
key: 'age'
|
||||
key: 'age',
|
||||
},
|
||||
{
|
||||
title: 'Address',
|
||||
key: 'address'
|
||||
}
|
||||
key: 'address',
|
||||
},
|
||||
];
|
||||
|
||||
const dataSource = ref<DataSource[]>([]);
|
||||
@ -54,7 +54,7 @@ function createDataSource(): DataSource[] {
|
||||
return {
|
||||
name: `Name${index}`,
|
||||
age: getRandomInterger(30, 20),
|
||||
address: '中国'
|
||||
address: '中国',
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
@ -43,43 +43,43 @@ const timelines: TimelineData[] = [
|
||||
{ type: 'success', title: '成功', content: '哪里成功', time: '2021-10-10 20:46' },
|
||||
{ type: 'error', title: '错误', content: '哪里错误', time: '2021-10-10 20:46' },
|
||||
{ type: 'warning', title: '警告', content: '哪里警告', time: '2021-10-10 20:46' },
|
||||
{ type: 'info', title: '信息', content: '是的', time: '2021-10-10 20:46' }
|
||||
{ type: 'info', title: '信息', content: '是的', time: '2021-10-10 20:46' },
|
||||
];
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'Name',
|
||||
key: 'name'
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
title: 'Age',
|
||||
key: 'age'
|
||||
key: 'age',
|
||||
},
|
||||
{
|
||||
title: 'Address',
|
||||
key: 'address'
|
||||
key: 'address',
|
||||
},
|
||||
{
|
||||
title: 'Tags',
|
||||
key: 'tags',
|
||||
render(row: TableData) {
|
||||
const tags = row.tags.map(tagKey => {
|
||||
const tags = row.tags.map((tagKey) => {
|
||||
return h(
|
||||
NTag,
|
||||
{
|
||||
style: {
|
||||
marginRight: '6px'
|
||||
marginRight: '6px',
|
||||
},
|
||||
type: 'info'
|
||||
type: 'info',
|
||||
},
|
||||
{
|
||||
default: () => tagKey
|
||||
default: () => tagKey,
|
||||
}
|
||||
);
|
||||
});
|
||||
return tags;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const tableData: TableData[] = [
|
||||
@ -88,50 +88,50 @@ const tableData: TableData[] = [
|
||||
name: 'John Brown',
|
||||
age: 32,
|
||||
address: 'New York No. 1 Lake Park',
|
||||
tags: ['nice', 'developer']
|
||||
tags: ['nice', 'developer'],
|
||||
},
|
||||
{
|
||||
key: 1,
|
||||
name: 'Jim Green',
|
||||
age: 42,
|
||||
address: 'London No. 1 Lake Park',
|
||||
tags: ['wow']
|
||||
tags: ['wow'],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
name: 'Joe Black',
|
||||
age: 32,
|
||||
address: 'Sidney No. 1 Lake Park',
|
||||
tags: ['cool', 'teacher']
|
||||
tags: ['cool', 'teacher'],
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
name: 'Soybean',
|
||||
age: 25,
|
||||
address: 'China Shenzhen',
|
||||
tags: ['handsome', 'programmer']
|
||||
tags: ['handsome', 'programmer'],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
name: 'John Brown',
|
||||
age: 32,
|
||||
address: 'New York No. 1 Lake Park',
|
||||
tags: ['nice', 'developer']
|
||||
tags: ['nice', 'developer'],
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
name: 'Jim Green',
|
||||
age: 42,
|
||||
address: 'London No. 1 Lake Park',
|
||||
tags: ['wow']
|
||||
tags: ['wow'],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
name: 'Joe Black',
|
||||
age: 32,
|
||||
address: 'Sidney No. 1 Lake Park',
|
||||
tags: ['cool', 'teacher']
|
||||
}
|
||||
tags: ['cool', 'teacher'],
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -16,7 +16,7 @@ interface Props {
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
startColor: '#56cdf3',
|
||||
endColor: '#719de3'
|
||||
endColor: '#719de3',
|
||||
});
|
||||
|
||||
const gradientStyle = computed(() => `linear-gradient(to bottom right, ${props.startColor}, ${props.endColor})`);
|
||||
|
||||
@ -38,7 +38,7 @@ const cardData: CardData[] = [
|
||||
value: 1000000,
|
||||
unit: '',
|
||||
colors: ['#ec4786', '#b955a4'],
|
||||
icon: 'ant-design:bar-chart-outlined'
|
||||
icon: 'ant-design:bar-chart-outlined',
|
||||
},
|
||||
{
|
||||
id: 'amount',
|
||||
@ -46,7 +46,7 @@ const cardData: CardData[] = [
|
||||
value: 234567.89,
|
||||
unit: '$',
|
||||
colors: ['#865ec0', '#5144b4'],
|
||||
icon: 'ant-design:money-collect-outlined'
|
||||
icon: 'ant-design:money-collect-outlined',
|
||||
},
|
||||
{
|
||||
id: 'download',
|
||||
@ -54,7 +54,7 @@ const cardData: CardData[] = [
|
||||
value: 666666,
|
||||
unit: '',
|
||||
colors: ['#56cdf3', '#719de3'],
|
||||
icon: 'carbon:document-download'
|
||||
icon: 'carbon:document-download',
|
||||
},
|
||||
{
|
||||
id: 'trade',
|
||||
@ -62,8 +62,8 @@ const cardData: CardData[] = [
|
||||
value: 999999,
|
||||
unit: '',
|
||||
colors: ['#fcbc25', '#f68057'],
|
||||
icon: 'ant-design:trademark-circle-outlined'
|
||||
}
|
||||
icon: 'ant-design:trademark-circle-outlined',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -50,54 +50,55 @@ function renderLineChart() {
|
||||
yField: 'value',
|
||||
seriesField: 'type',
|
||||
lineStyle: {
|
||||
lineWidth: 4
|
||||
lineWidth: 4,
|
||||
},
|
||||
area: {
|
||||
style: {
|
||||
fill: 'l(270) 0:#ffffff 0.5:#7ec2f3 1:#1890ff'
|
||||
}
|
||||
fill: 'l(270) 0:#ffffff 0.5:#7ec2f3 1:#1890ff',
|
||||
},
|
||||
},
|
||||
smooth: true,
|
||||
animation: {
|
||||
appear: {
|
||||
animation: 'wave-in',
|
||||
duration: 2000
|
||||
}
|
||||
}
|
||||
duration: 2000,
|
||||
},
|
||||
},
|
||||
});
|
||||
line.value.render();
|
||||
}
|
||||
function renderPieChart() {
|
||||
const data = [
|
||||
if (!pieRef.value) return;
|
||||
const pieData = [
|
||||
{ type: '学习', value: 20 },
|
||||
{ type: '娱乐', value: 10 },
|
||||
{ type: '工作', value: 30 },
|
||||
{ type: '休息', value: 40 }
|
||||
{ type: '休息', value: 40 },
|
||||
];
|
||||
pie.value = new Pie(pieRef.value!, {
|
||||
pie.value = new Pie(pieRef.value, {
|
||||
appendPadding: 10,
|
||||
data,
|
||||
data: pieData,
|
||||
angleField: 'value',
|
||||
colorField: 'type',
|
||||
radius: 0.8,
|
||||
innerRadius: 0.65,
|
||||
meta: {
|
||||
value: {
|
||||
formatter: v => `${v}%`
|
||||
}
|
||||
formatter: (v) => `${v}%`,
|
||||
},
|
||||
},
|
||||
label: {
|
||||
type: 'inner',
|
||||
autoRotate: false,
|
||||
formatter: ({ percent }) => `${(percent * 100).toFixed(0)}%`
|
||||
formatter: ({ percent }) => `${(percent * 100).toFixed(0)}%`,
|
||||
},
|
||||
statistic: undefined,
|
||||
pieStyle: {
|
||||
radius: [20]
|
||||
radius: [20],
|
||||
},
|
||||
color: ['#025DF4', '#DB6BCF', '#2498D1', '#FF745A', '#007E99', '#FFA8A8', '#2391FF'],
|
||||
legend: {
|
||||
position: 'bottom'
|
||||
position: 'bottom',
|
||||
},
|
||||
interactions: [
|
||||
{ type: 'element-selected' },
|
||||
@ -107,15 +108,15 @@ function renderPieChart() {
|
||||
cfg: {
|
||||
start: [
|
||||
{ trigger: 'element:mouseenter', action: 'pie-statistic:change' },
|
||||
{ trigger: 'legend-item:mouseenter', action: 'pie-statistic:change' }
|
||||
{ trigger: 'legend-item:mouseenter', action: 'pie-statistic:change' },
|
||||
],
|
||||
end: [
|
||||
{ trigger: 'element:mouseleave', action: 'pie-statistic:reset' },
|
||||
{ trigger: 'legend-item:mouseleave', action: 'pie-statistic:reset' }
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
{ trigger: 'legend-item:mouseleave', action: 'pie-statistic:reset' },
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
pie.value.render();
|
||||
|
||||
@ -30,18 +30,18 @@ const statisticData: StatisticData[] = [
|
||||
{
|
||||
id: 0,
|
||||
label: '项目数',
|
||||
value: '25'
|
||||
value: '25',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
label: '待办',
|
||||
value: '4/16'
|
||||
value: '4/16',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
label: '消息',
|
||||
value: '12'
|
||||
}
|
||||
value: '12',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -77,7 +77,7 @@ const technology: Technology[] = [
|
||||
description: '一套用于构建用户界面的渐进式框架',
|
||||
author: '尤雨溪 - Evan You',
|
||||
site: 'https://v3.cn.vuejs.org/',
|
||||
icon: 'vscode-icons:file-type-vue'
|
||||
icon: 'vscode-icons:file-type-vue',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
@ -85,7 +85,7 @@ const technology: Technology[] = [
|
||||
description: 'JavaScript类型的超集，它可以编译成纯JavaScript',
|
||||
author: '微软 - Microsoft',
|
||||
site: 'https://www.typescriptlang.org/',
|
||||
icon: 'vscode-icons:file-type-typescript-official'
|
||||
icon: 'vscode-icons:file-type-typescript-official',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@ -93,7 +93,7 @@ const technology: Technology[] = [
|
||||
description: '下一代前端开发与构建工具',
|
||||
author: '尤雨溪 - Evan You',
|
||||
site: 'https://vitejs.cn/',
|
||||
icon: 'vscode-icons:file-type-vite'
|
||||
icon: 'vscode-icons:file-type-vite',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
@ -102,7 +102,7 @@ const technology: Technology[] = [
|
||||
author: '图森未来 - TuSimple',
|
||||
site: 'https://www.naiveui.com/zh-CN/os-theme',
|
||||
icon: 'mdi:alpha-n-box-outline',
|
||||
iconColor: '#5fbc22'
|
||||
iconColor: '#5fbc22',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
@ -111,7 +111,7 @@ const technology: Technology[] = [
|
||||
author: 'Windicss',
|
||||
site: 'https://windicss.org/',
|
||||
icon: 'file-icons:windi',
|
||||
iconColor: '#48b0f1'
|
||||
iconColor: '#48b0f1',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@ -120,8 +120,8 @@ const technology: Technology[] = [
|
||||
author: 'Posva',
|
||||
site: 'https://pinia.esm.dev/',
|
||||
icon: 'mdi:fruit-pineapple',
|
||||
iconColor: '#fecf48'
|
||||
}
|
||||
iconColor: '#fecf48',
|
||||
},
|
||||
];
|
||||
|
||||
const activity: Activity[] = [
|
||||
@ -129,7 +129,7 @@ const activity: Activity[] = [
|
||||
{ id: 3, content: 'Soybean 正在忙于为soybean-admin写项目说明文档！', time: '2021-11-03 20:33:31' },
|
||||
{ id: 2, content: 'Soybean 准备为soybean-admin 1.0的发布做充分的准备工作！', time: '2021-10-31 22:43:12' },
|
||||
{ id: 1, content: '@yanbowe 向soybean-admin提交了一个bug，多标签栏不会自适应。', time: '2021-10-27 10:24:54' },
|
||||
{ id: 0, content: 'Soybean 在2021年5月28日创建了开源项目soybean-admin！', time: '2021-05-28 22:22:22' }
|
||||
{ id: 0, content: 'Soybean 在2021年5月28日创建了开源项目soybean-admin！', time: '2021-05-28 22:22:22' },
|
||||
];
|
||||
|
||||
const shortcuts: Shortcuts[] = [
|
||||
@ -138,7 +138,7 @@ const shortcuts: Shortcuts[] = [
|
||||
{ id: 2, label: '权限管理', icon: 'mdi:family-tree', iconColor: '#f56c6c' },
|
||||
{ id: 3, label: '组件', icon: 'fluent:app-store-24-filled', iconColor: '#19a2f1' },
|
||||
{ id: 4, label: '表格', icon: 'mdi:table-large', iconColor: '#fab251' },
|
||||
{ id: 5, label: '图表', icon: 'mdi:chart-areaspline', iconColor: '#8aca6b' }
|
||||
{ id: 5, label: '图表', icon: 'mdi:chart-areaspline', iconColor: '#8aca6b' },
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
@ -13,11 +13,11 @@ const ROUTE_KEY_SPLIT_MARK = '_';
|
||||
const SYSTEM_VIEW = 'system-view_';
|
||||
|
||||
/** 过滤掉组件文件 */
|
||||
const viewKeys = Object.keys(importViews).filter(key => !key.includes(COMPONENTS_KEY));
|
||||
const viewKeys = Object.keys(importViews).filter((key) => !key.includes(COMPONENTS_KEY));
|
||||
|
||||
function getViewComponent() {
|
||||
const components: ViewComponent = {};
|
||||
viewKeys.forEach(key => {
|
||||
viewKeys.forEach((key) => {
|
||||
const routeKey = key
|
||||
.replace(PREFIX, '')
|
||||
.replace(SUFFIX, '')
|
||||
|
||||
@ -22,17 +22,18 @@ const vditor = ref<Vditor>();
|
||||
const domRef = ref<HTMLElement>();
|
||||
|
||||
function renderVditor() {
|
||||
vditor.value = new Vditor(domRef.value!, {
|
||||
if (!domRef.value) return;
|
||||
vditor.value = new Vditor(domRef.value, {
|
||||
minHeight: 400,
|
||||
theme: theme.darkMode ? 'dark' : 'classic',
|
||||
icon: 'material',
|
||||
cache: { enable: false }
|
||||
cache: { enable: false },
|
||||
});
|
||||
}
|
||||
|
||||
const stopHandle = watch(
|
||||
() => theme.darkMode,
|
||||
newValue => {
|
||||
(newValue) => {
|
||||
const themeMode = newValue ? 'dark' : 'classic';
|
||||
vditor.value?.setTheme(themeMode);
|
||||
}
|
||||
|
||||
@ -24,7 +24,9 @@ function renderWangEditor() {
|
||||
}
|
||||
|
||||
function setEditorConfig() {
|
||||
editor.value!.config.zIndex = 10;
|
||||
if (editor.value?.config?.zIndex) {
|
||||
editor.value.config.zIndex = 10;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@ -28,7 +28,7 @@ export const icons = [
|
||||
'ic:baseline-filter-7',
|
||||
'ic:baseline-filter-8',
|
||||
'ic:baseline-filter-9',
|
||||
'ic:baseline-filter-9-plus'
|
||||
'ic:baseline-filter-9-plus',
|
||||
];
|
||||
|
||||
// const assetsSvg = import.meta.glob('../../../assets/svg/*.svg');
|
||||
|
||||
@ -12,8 +12,9 @@ const { load } = useScriptTag(BAIDU_MAP_SDK_URL);
|
||||
const domRef = ref<HTMLDivElement>();
|
||||
|
||||
async function renderBaiduMap() {
|
||||
if (!domRef.value) return;
|
||||
await load(true);
|
||||
const map = new BMap.Map(domRef.value!);
|
||||
const map = new BMap.Map(domRef.value);
|
||||
const point = new BMap.Point(114.05834626586915, 22.546789983033168);
|
||||
map.centerAndZoom(point, 15);
|
||||
map.enableScrollWheelZoom();
|
||||
|
||||
@ -12,14 +12,14 @@ const { load } = useScriptTag(GAODE_MAP_SDK_URL);
|
||||
const domRef = ref<HTMLDivElement>();
|
||||
|
||||
async function renderBaiduMap() {
|
||||
if (!domRef.value) return;
|
||||
await load(true);
|
||||
const map = new AMap.Map(domRef.value!, {
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const map = new AMap.Map(domRef.value, {
|
||||
zoom: 11,
|
||||
center: [114.05834626586915, 22.546789983033168],
|
||||
viewMode: '3D'
|
||||
viewMode: '3D',
|
||||
});
|
||||
|
||||
return map;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@ -12,14 +12,14 @@ const { load } = useScriptTag(TENCENT_MAP_SDK_URL);
|
||||
const domRef = ref<HTMLDivElement | null>(null);
|
||||
|
||||
async function renderBaiduMap() {
|
||||
if (!domRef.value) return;
|
||||
await load(true);
|
||||
const map = new TMap.Map(domRef.value!, {
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const map = new TMap.Map(domRef.value, {
|
||||
center: new TMap.LatLng(39.98412, 116.307484),
|
||||
zoom: 11,
|
||||
viewMode: '3D'
|
||||
viewMode: '3D',
|
||||
});
|
||||
|
||||
return map;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@ -22,7 +22,7 @@ interface Map {
|
||||
|
||||
const maps: Map[] = [
|
||||
{ id: 'gaode', label: '高德地图', component: GaodeMap },
|
||||
{ id: 'tencent', label: '腾讯地图', component: TencentMap }
|
||||
{ id: 'tencent', label: '腾讯地图', component: TencentMap },
|
||||
];
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user