From 0427a8f88a8df11697f47632fa2be899fcee4c09 Mon Sep 17 00:00:00 2001 From: bootx Date: Tue, 2 Jul 2024 22:01:39 +0800 Subject: [PATCH] =?UTF-8?q?ref=20=E7=BB=84=E4=BB=B6=E9=85=8D=E7=BD=AE?= =?UTF-8?q?=E5=BE=AE=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Bootx/Query/BQuery.vue | 83 ++++++++++++++++ src/components/Bootx/Query/Query.ts | 74 ++++++++++++++ src/components/Bootx/Query/QueryItem.vue | 96 +++++++++++++++++++ src/components/SimpleMenu/src/SimpleMenu.vue | 8 +- src/enums/appEnum.ts | 4 - src/hooks/web/usePermission.ts | 47 +-------- .../header/components/user-dropdown/index.vue | 6 +- src/router/guard/paramMenuGuard.ts | 23 +---- src/router/helper/routeHelper.ts | 2 +- src/router/menus/index.ts | 16 +--- src/router/routes/project.ts | 16 ++-- src/settings/projectSetting.ts | 2 +- src/views/sys/login/Login.vue | 4 +- src/views/sys/login/SessionTimeoutLogin.vue | 9 +- types/vue-router.d.ts | 2 +- 15 files changed, 280 insertions(+), 112 deletions(-) create mode 100644 src/components/Bootx/Query/BQuery.vue create mode 100644 src/components/Bootx/Query/Query.ts create mode 100644 src/components/Bootx/Query/QueryItem.vue diff --git a/src/components/Bootx/Query/BQuery.vue b/src/components/Bootx/Query/BQuery.vue new file mode 100644 index 00000000..91fd04ad --- /dev/null +++ b/src/components/Bootx/Query/BQuery.vue @@ -0,0 +1,83 @@ + + + + + diff --git a/src/components/Bootx/Query/Query.ts b/src/components/Bootx/Query/Query.ts new file mode 100644 index 00000000..a0153453 --- /dev/null +++ b/src/components/Bootx/Query/Query.ts @@ -0,0 +1,74 @@ +import { LabeledValue } from 'ant-design-vue/lib/select' + +// 数字 +export const NUMBER = 'number' +// 字符串 +export const STRING = 'string' +// 布尔 +export const BOOLEAN = 'boolean' +// 日期 +export const DATE = 'date' +// 时间 +export const TIME = 'time' +// 日期时间 +export const DATE_TIME = 'date_time' +// 列表 +export const LIST = 'list' + +/** + * 查询属性 + */ +export interface QueryField { + //类型 + type?: 'number' | 'string' | 'boolean' | 'date' | 'time' | 'date_time' | 'list' + // 提示 + placeholder?: string + // 字段名称 + field?: string + // 栅格宽度 + md?: number + // 显示名称 + name?: string + // 精度 + precision?: number + // 查询列表 + selectList?: LabeledValue[] | null + // 时间格式化 + format?: string | null + // 默认值 未启用 + defaultValue?: number | string +} + +/** + * 查询参数 + */ +export interface QueryParam { + // antd select 组件限制原因导致不能使用bool + or?: 'true' | 'false' + // 参数名称 + paramName?: string + // 格式化 主要用于时间格式化 + format?: string + // 精度 + precision?: number + // 比较类型 + compareType?: + | 'eq' + | 'ne' + | 'like' + | 'like_left' + | 'like_right' + | 'not_like' + | 'gt' + | 'ge' + | 'lt' + | 'le' + | 'is_null' + | 'not_null' + // 参数类型 + paramType?: string + // 参数值 + paramValue?: object + // 嵌套查询 + nestedParams?: QueryParam[] +} diff --git a/src/components/Bootx/Query/QueryItem.vue b/src/components/Bootx/Query/QueryItem.vue new file mode 100644 index 00000000..3abdecf5 --- /dev/null +++ b/src/components/Bootx/Query/QueryItem.vue @@ -0,0 +1,96 @@ + + + + + diff --git a/src/components/SimpleMenu/src/SimpleMenu.vue b/src/components/SimpleMenu/src/SimpleMenu.vue index a1fb7d17..88f94366 100644 --- a/src/components/SimpleMenu/src/SimpleMenu.vue +++ b/src/components/SimpleMenu/src/SimpleMenu.vue @@ -29,7 +29,7 @@ import { propTypes } from '@/utils/propTypes' import { REDIRECT_NAME } from '@/router/constant' import { useRouter } from 'vue-router' - import { isFunction, isHttpUrl } from '@/utils/is' + import { isFunction, isOutsideUrl } from '@/utils/is' import { openWindow } from '@/utils' import { useOpenKeys } from './useOpenKeys' @@ -126,8 +126,10 @@ } async function handleSelect(key: string) { - if (isHttpUrl(key)) { - openWindow(key) + // 判断是否需要通过外部打开 + const path = isOutsideUrl(key) + if (path) { + openWindow(path) return } const { beforeClickFn } = props diff --git a/src/enums/appEnum.ts b/src/enums/appEnum.ts index d55234ef..25b3e76e 100644 --- a/src/enums/appEnum.ts +++ b/src/enums/appEnum.ts @@ -30,11 +30,7 @@ export enum SessionTimeoutProcessingEnum { */ export enum PermissionModeEnum { // 角色权限 - ROLE = 'ROLE', - // 后端 BACK = 'BACK', - // 路由映射 - ROUTE_MAPPING = 'ROUTE_MAPPING', } // Route switching animation diff --git a/src/hooks/web/usePermission.ts b/src/hooks/web/usePermission.ts index cf243c25..1a51956c 100644 --- a/src/hooks/web/usePermission.ts +++ b/src/hooks/web/usePermission.ts @@ -5,52 +5,14 @@ import { usePermissionStore } from '@/store/modules/permission' import { useTabs } from './useTabs' -import { router, resetRouter } from '@/router' - -import projectSetting from '@/settings/projectSetting' -import { PermissionModeEnum } from '@/enums/appEnum' import { RoleEnum } from '@/enums/roleEnum' import { intersection } from 'lodash-es' import { isArray } from '@/utils/is' -import { useMultipleTabStore } from '@/store/modules/multipleTab' // User permissions related operations export function usePermission() { - const appStore = useAppStore() const permissionStore = usePermissionStore() - const { closeAll } = useTabs(router) - - /** - * Change permission mode - */ - async function togglePermissionMode() { - appStore.setProjectConfig({ - permissionMode: - projectSetting.permissionMode === PermissionModeEnum.BACK - ? PermissionModeEnum.ROUTE_MAPPING - : PermissionModeEnum.BACK, - }) - location.reload() - } - - /** - * Reset and regain authority resource information - * 重置和重新获得权限资源信息 - * @param id - */ - async function resume() { - console.log('重置和重新获得权限资源信息') - const tabStore = useMultipleTabStore() - tabStore.clearCacheTabs() - resetRouter() - const routes = await permissionStore.buildRoutesAction() - routes.forEach((route) => { - router.addRoute(route as unknown as RouteRecordRaw) - }) - permissionStore.setLastBuildMenuTime() - closeAll() - } /** * Determine whether there is permission @@ -68,12 +30,5 @@ export function usePermission() { return (intersection(value, allCodeList) as string[]).length > 0 } - /** - * refresh menu data - */ - async function refreshMenu() { - resume() - } - - return { hasPermission, togglePermissionMode, refreshMenu } + return { hasPermission } } diff --git a/src/layouts/default/header/components/user-dropdown/index.vue b/src/layouts/default/header/components/user-dropdown/index.vue index ff058d7e..0862f155 100644 --- a/src/layouts/default/header/components/user-dropdown/index.vue +++ b/src/layouts/default/header/components/user-dropdown/index.vue @@ -55,7 +55,6 @@ userStore.confirmLoginOut() } - // open doc function openDoc() { openWindow(DOC_URL) } @@ -116,5 +115,10 @@ color: @header-light-desc-color; } } + &-dropdown-overlay { + .ant-dropdown-menu-item { + min-width: 160px; + } + } } diff --git a/src/router/guard/paramMenuGuard.ts b/src/router/guard/paramMenuGuard.ts index c458d6a5..0f62d270 100644 --- a/src/router/guard/paramMenuGuard.ts +++ b/src/router/guard/paramMenuGuard.ts @@ -1,8 +1,5 @@ import type { Router } from 'vue-router' import { configureDynamicParamsMenu } from '../helper/menuHelper' -import { Menu } from '../types' -import { PermissionModeEnum } from '@/enums/appEnum' -import { useAppStoreWithOut } from '@/store/modules/app' import { usePermissionStoreWithOut } from '@/store/modules/permission' @@ -21,27 +18,9 @@ export function createParamMenuGuard(router: Router) { return } - let menus: Menu[] = [] - if (isBackMode()) { - menus = permissionStore.getBackMenuList - } else if (isRouteMappingMode()) { - menus = permissionStore.getFrontMenuList - } + const menus = permissionStore.getBackMenuList menus.forEach((item) => configureDynamicParamsMenu(item, to.params)) next() }) } - -const getPermissionMode = () => { - const appStore = useAppStoreWithOut() - return appStore.getProjectConfig.permissionMode -} -// 后端模式 -const isBackMode = () => { - return getPermissionMode() === PermissionModeEnum.BACK -} -// 路由映射 -const isRouteMappingMode = () => { - return getPermissionMode() === PermissionModeEnum.ROUTE_MAPPING -} diff --git a/src/router/helper/routeHelper.ts b/src/router/helper/routeHelper.ts index 275afede..70ef3351 100644 --- a/src/router/helper/routeHelper.ts +++ b/src/router/helper/routeHelper.ts @@ -7,7 +7,7 @@ import { warn } from '@/utils/log' import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router' import XEUtils from 'xe-utils' -const IFRAME = () => import('/@/views/sys/iframe/FrameBlank.vue') +const IFRAME = () => import('@/views/sys/iframe/FrameBlank.vue') const LayoutMap = new Map Promise>() diff --git a/src/router/menus/index.ts b/src/router/menus/index.ts index de4f4b86..bdcf6a02 100644 --- a/src/router/menus/index.ts +++ b/src/router/menus/index.ts @@ -1,13 +1,11 @@ import type { Menu, MenuModule } from '@/router/types' import type { RouteRecordNormalized } from 'vue-router' -import { useAppStoreWithOut } from '@/store/modules/app' import { usePermissionStore } from '@/store/modules/permission' import { transformMenuModule, getAllParentPath } from '@/router/helper/menuHelper' import { filter } from '@/utils/helper/treeHelper' import { isHttpUrl } from '@/utils/is' import { router } from '@/router' -import { PermissionModeEnum } from '@/enums/appEnum' import { pathToRegexp } from 'path-to-regexp' const modules = import.meta.glob('./modules/**/*.ts', { eager: true }) @@ -24,20 +22,8 @@ Object.keys(modules).forEach((key) => { // ==========Helper=========== // =========================== -const getPermissionMode = () => { - const appStore = useAppStoreWithOut() - return appStore.getProjectConfig.permissionMode -} -const isBackMode = () => { - return getPermissionMode() === PermissionModeEnum.BACK -} - -const isRouteMappingMode = () => { - return getPermissionMode() === PermissionModeEnum.ROUTE_MAPPING -} - const isRoleMode = () => { - return getPermissionMode() === PermissionModeEnum.ROLE + return false } const staticMenus: Menu[] = [] diff --git a/src/router/routes/project.ts b/src/router/routes/project.ts index 3291f8b1..bbf9fb05 100644 --- a/src/router/routes/project.ts +++ b/src/router/routes/project.ts @@ -16,15 +16,15 @@ export const INTERNAL: AppRouteModule = { // { // path: '/account/setting', // name: 'AccountSettingPage', - // component: () => import('/@/views/account/setting/index.vue'), + // component: () => import('@/views/account/setting/index.vue'), // meta: { title: '个人设置' }, // }, - // { - // path: '/about/index', - // name: 'AboutPage', - // component: () => import('/@/views/sys/about/index.vue'), - // meta: { title: '关于' }, - // }, + { + path: '/about/index', + name: 'AboutPage', + component: () => import('@/views/sys/about/index.vue'), + meta: { title: '关于' }, + }, ], } @@ -39,7 +39,7 @@ export const OUTSIDE: AppRouteModule = { // { // path: '/cashier', // name: 'cashier', - // component: () => import('/@/views/demo/cashier/Cashier.vue'), + // component: () => import('@/views/demo/cashier/Cashier.vue'), // meta: { title: '收银台演示', ignoreAuth: true }, // }, ], diff --git a/src/settings/projectSetting.ts b/src/settings/projectSetting.ts index 01b02c44..ddf48156 100644 --- a/src/settings/projectSetting.ts +++ b/src/settings/projectSetting.ts @@ -14,7 +14,7 @@ import { APP_PRESET_COLOR_LIST } from './designSetting' // ! You need to clear the browser cache after the change const setting: ProjectConfig = { // 是否显示配置按钮 - showSettingButton: true, + showSettingButton: false, // 是否显示主题切换按钮 showDarkModeToggle: true, diff --git a/src/views/sys/login/Login.vue b/src/views/sys/login/Login.vue index 6cd1dfdb..38c2d2d7 100644 --- a/src/views/sys/login/Login.vue +++ b/src/views/sys/login/Login.vue @@ -69,7 +69,7 @@ background-color: @dark-bg; &::before { - background-image: url(/@/assets/svg/login-bg-dark.svg); + background-image: url(@/assets/svg/login-bg-dark.svg); } .ant-input, @@ -115,7 +115,7 @@ width: 100%; height: 100%; margin-left: -48%; - background-image: url(/@/assets/svg/login-bg.svg); + background-image: url(@/assets/svg/login-bg.svg); background-position: 100%; background-repeat: no-repeat; background-size: auto 100%; diff --git a/src/views/sys/login/SessionTimeoutLogin.vue b/src/views/sys/login/SessionTimeoutLogin.vue index 33442339..522030c8 100644 --- a/src/views/sys/login/SessionTimeoutLogin.vue +++ b/src/views/sys/login/SessionTimeoutLogin.vue @@ -11,20 +11,13 @@ import { useDesign } from '@/hooks/web/useDesign' import { useUserStore } from '@/store/modules/user' import { usePermissionStore } from '@/store/modules/permission' - import { useAppStore } from '@/store/modules/app' - import { PermissionModeEnum } from '@/enums/appEnum' import { type Nullable } from '@vben/types' const { prefixCls } = useDesign('st-login') const userStore = useUserStore() const permissionStore = usePermissionStore() - const appStore = useAppStore() const userId = ref>(0) - const isBackMode = () => { - return appStore.getProjectConfig.permissionMode === PermissionModeEnum.BACK - } - onMounted(() => { // 记录当前的UserId userId.value = userStore.getUserInfo?.userId @@ -35,7 +28,7 @@ if (userId.value && userId.value !== userStore.getUserInfo.userId) { // 登录的不是同一个用户，刷新整个页面以便丢弃之前用户的页面状态 document.location.reload() - } else if (isBackMode() && permissionStore.getLastBuildMenuTime === 0) { + } else if (permissionStore.getLastBuildMenuTime === 0) { // 后台权限模式下，没有成功加载过菜单，就重新加载整个页面。这通常发生在会话过期后按F5刷新整个页面后载入了本模块这种场景 document.location.reload() } diff --git a/types/vue-router.d.ts b/types/vue-router.d.ts index 64f5e44b..b118343b 100644 --- a/types/vue-router.d.ts +++ b/types/vue-router.d.ts @@ -35,7 +35,7 @@ declare module 'vue-router' { currentActiveMenu?: string // Never show in tab hideTab?: boolean - // Never show in menu + // 隐藏菜单 hideMenu?: boolean isLink?: boolean // only build for Menu