refactor(project): simplified part of the package, code optimization
parent
5784d718c0
commit
daa31f7156
|
@ -96,7 +96,7 @@ export class MenuController {
|
|||
path: 'access',
|
||||
meta: {
|
||||
icon: 'mdi:cloud-key-outline',
|
||||
title: 'page.demos.access.backendControl',
|
||||
title: 'page.demos.access.backendPermissions',
|
||||
},
|
||||
redirect: '/demos/access/page-control',
|
||||
children: [
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
import type { GeneratorMenuAndRoutesOptions } from '@vben/access';
|
||||
import type { ComponentRecordType } from '@vben/types';
|
||||
import type {
|
||||
ComponentRecordType,
|
||||
GenerateMenuAndRoutesOptions,
|
||||
} from '@vben/types';
|
||||
|
||||
import { generateMenusAndRoutes } from '@vben/access';
|
||||
import { generateAccessible } from '@vben/access';
|
||||
import { preferences } from '@vben-core/preferences';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
|
@ -13,7 +15,7 @@ import { $t } from '#/locales';
|
|||
const forbiddenComponent = () =>
|
||||
import('#/views/_essential/fallback/forbidden.vue');
|
||||
|
||||
async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
|
||||
async function generateAccess(options: GenerateMenuAndRoutesOptions) {
|
||||
const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
|
||||
|
||||
const layoutMap: ComponentRecordType = {
|
||||
|
@ -21,7 +23,7 @@ async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
|
|||
IFrameView,
|
||||
};
|
||||
|
||||
return await generateMenusAndRoutes(preferences.app.accessMode, {
|
||||
return await generateAccessible(preferences.app.accessMode, {
|
||||
...options,
|
||||
fetchMenuListAsync: async () => {
|
||||
message.loading({
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
"demos": {
|
||||
"title": "Demos",
|
||||
"access": {
|
||||
"frontendControl": "Frontend Control",
|
||||
"backendControl": "Backend Control",
|
||||
"frontendPermissions": "Frontend Permissions",
|
||||
"backendPermissions": "Backend Permissions",
|
||||
"pageAccess": "Page Access",
|
||||
"buttonControl": "Button Control",
|
||||
"menuVisible403": "Menu Visible(403)",
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
"demos": {
|
||||
"title": "演示",
|
||||
"access": {
|
||||
"frontendControl": "前端控制",
|
||||
"backendControl": "后端控制",
|
||||
"frontendPermissions": "前端权限",
|
||||
"backendPermissions": "后端权限",
|
||||
"pageAccess": "页面访问",
|
||||
"buttonControl": "按钮控制",
|
||||
"menuVisible403": "菜单可见(403)",
|
||||
|
|
|
@ -19,7 +19,7 @@ const routes: RouteRecordRaw[] = [
|
|||
{
|
||||
meta: {
|
||||
icon: 'mdi:shield-key-outline',
|
||||
title: $t('page.demos.access.frontendControl'),
|
||||
title: $t('page.demos.access.frontendPermissions'),
|
||||
},
|
||||
name: 'Access',
|
||||
path: 'access',
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import type { TabsItem } from '@vben/types';
|
||||
import type { TabsOption } from '@vben/types';
|
||||
import type { AnalysisOverviewItem } from '@vben/universal-ui';
|
||||
|
||||
import {
|
||||
|
@ -53,7 +53,7 @@ const overviewItems: AnalysisOverviewItem[] = [
|
|||
},
|
||||
];
|
||||
|
||||
const chartTabs: TabsItem[] = [
|
||||
const chartTabs: TabsOption[] = [
|
||||
{
|
||||
label: '流量趋势',
|
||||
value: 'trends',
|
||||
|
|
|
@ -3,7 +3,7 @@ import type { LoginAndRegisterParams } from '@vben/universal-ui';
|
|||
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import { CodeAccess, useAccess } from '@vben/access';
|
||||
import { AccessControl, useAccess } from '@vben/access';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
|
||||
|
@ -59,9 +59,9 @@ async function changeAccount(role: string) {
|
|||
|
||||
<div class="card-box mt-5 p-5 font-semibold">
|
||||
<div class="mb-3">
|
||||
<span class="text-lg">当前账号:</span>
|
||||
<span class="text-primary mx-4">
|
||||
{{ accessStore.userRoles }}
|
||||
<span class="text-lg">当前角色:</span>
|
||||
<span class="text-primary mx-4 text-lg">
|
||||
{{ accessStore.userRoles?.[0] }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
@ -82,21 +82,40 @@ async function changeAccount(role: string) {
|
|||
</div>
|
||||
|
||||
<div class="card-box mt-5 p-5 font-semibold">
|
||||
<div class="mb-3 text-lg">组件形式控制</div>
|
||||
<CodeAccess :value="['AC_100100']">
|
||||
<div class="mb-3 text-lg">组件形式控制 - 权限码方式</div>
|
||||
<AccessControl :value="['AC_100100']" type="code">
|
||||
<Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
|
||||
</CodeAccess>
|
||||
<CodeAccess :value="['AC_100030']">
|
||||
</AccessControl>
|
||||
<AccessControl :value="['AC_100030']" type="code">
|
||||
<Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
|
||||
</CodeAccess>
|
||||
<CodeAccess :value="['AC_1000001']">
|
||||
</AccessControl>
|
||||
<AccessControl :value="['AC_1000001']" type="code">
|
||||
<Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
|
||||
</CodeAccess>
|
||||
<CodeAccess :value="['AC_100100', 'AC_100010']">
|
||||
</AccessControl>
|
||||
<AccessControl :value="['AC_100100', 'AC_100010']" type="code">
|
||||
<Button class="mr-4">
|
||||
Super & Admin 账号可见 ["AC_100100","AC_1000001"]
|
||||
</Button>
|
||||
</CodeAccess>
|
||||
</AccessControl>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="accessMode === 'frontend'"
|
||||
class="card-box mt-5 p-5 font-semibold"
|
||||
>
|
||||
<div class="mb-3 text-lg">组件形式控制 - 用户角色方式</div>
|
||||
<AccessControl :value="['super']">
|
||||
<Button class="mr-4"> Super 角色可见 </Button>
|
||||
</AccessControl>
|
||||
<AccessControl :value="['admin']">
|
||||
<Button class="mr-4"> Admin 角色可见 </Button>
|
||||
</AccessControl>
|
||||
<AccessControl :value="['user']">
|
||||
<Button class="mr-4"> User 角色可见 </Button>
|
||||
</AccessControl>
|
||||
<AccessControl :value="['super', 'admin']">
|
||||
<Button class="mr-4"> Super & Admin 角色可见 </Button>
|
||||
</AccessControl>
|
||||
</div>
|
||||
|
||||
<div class="card-box mt-5 p-5 font-semibold">
|
||||
|
|
|
@ -69,7 +69,9 @@ async function handleToggleAccessMode() {
|
|||
|
||||
<div class="card-box mt-5 p-5 font-semibold">
|
||||
<span class="text-lg">当前权限模式:</span>
|
||||
<span class="text-primary mx-4">{{ accessMode }}</span>
|
||||
<span class="text-primary mx-4">{{
|
||||
accessMode === 'frontend' ? '前端权限控制' : '后端权限控制'
|
||||
}}</span>
|
||||
<Button type="primary" @click="handleToggleAccessMode">
|
||||
切换为{{ accessMode === 'frontend' ? '后端' : '前端' }}权限模式
|
||||
</Button>
|
||||
|
@ -77,8 +79,8 @@ async function handleToggleAccessMode() {
|
|||
<div class="card-box mt-5 p-5 font-semibold">
|
||||
<div class="mb-3">
|
||||
<span class="text-lg">当前账号:</span>
|
||||
<span class="text-primary mx-4">
|
||||
{{ accessStore.userRoles }}
|
||||
<span class="text-primary mx-4 text-lg">
|
||||
{{ accessStore.userRoles?.[0] }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import type { LoginExpiredModeType } from '@vben-core/preferences';
|
||||
import type { LoginExpiredModeType } from '@vben/types';
|
||||
|
||||
import { preferences, updatePreferences } from '@vben-core/preferences';
|
||||
|
||||
|
|
|
@ -88,12 +88,6 @@
|
|||
"clsx": "^2.1.1",
|
||||
"vue": "^3.4.31"
|
||||
},
|
||||
"peerDependencyRules": {
|
||||
"allowedVersions": {
|
||||
"eslint": "*",
|
||||
" @typescript-eslint/eslint-plugin": "*"
|
||||
}
|
||||
},
|
||||
"neverBuiltDependencies": [
|
||||
"canvas",
|
||||
"node-gyp",
|
||||
|
|
|
@ -36,6 +36,7 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"vue-router": "^4.4.0"
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import type { ExRouteRecordRaw, MenuRecordRaw } from '@vben/types';
|
||||
import type { ExRouteRecordRaw, MenuRecordRaw } from '@vben-core/typings';
|
||||
import type { RouteRecordRaw, Router } from 'vue-router';
|
||||
|
||||
import { mapTree } from '@vben-core/toolkit';
|
|
@ -1,19 +1,17 @@
|
|||
import type {
|
||||
ComponentRecordType,
|
||||
RouteRecordStringComponent,
|
||||
} from '@vben/types';
|
||||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import type { GeneratorMenuAndRoutesOptions } from '../types';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
import { mapTree } from '@vben-core/toolkit';
|
||||
import {
|
||||
ComponentRecordType,
|
||||
GenerateMenuAndRoutesOptions,
|
||||
RouteRecordStringComponent,
|
||||
} from '@vben-core/typings';
|
||||
|
||||
/**
|
||||
* 动态生成路由 - 后端方式
|
||||
*/
|
||||
async function generateRoutesByBackend(
|
||||
options: GeneratorMenuAndRoutesOptions,
|
||||
options: GenerateMenuAndRoutesOptions,
|
||||
): Promise<RouteRecordRaw[]> {
|
||||
const { fetchMenuListAsync, layoutMap = {}, pageMap = {} } = options;
|
||||
|
||||
|
@ -65,11 +63,6 @@ function convertRoutes(
|
|||
];
|
||||
}
|
||||
|
||||
// 国际化转化
|
||||
if (route.meta?.title) {
|
||||
route.meta.title = $t(route.meta.title);
|
||||
}
|
||||
|
||||
return route;
|
||||
});
|
||||
}
|
||||
|
@ -83,6 +76,7 @@ function normalizeViewPath(path: string): string {
|
|||
? normalizedPath
|
||||
: `/${normalizedPath}`;
|
||||
|
||||
// TODO: 这里耦合了vben-admin的目录结构
|
||||
return viewPath.replace(/^\/views/, '');
|
||||
}
|
||||
export { generateRoutesByBackend };
|
|
@ -1,6 +1,7 @@
|
|||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import { filterTree, mapTree } from '@vben-core/toolkit';
|
||||
|
||||
/**
|
||||
* 动态生成路由 - 前端方式
|
||||
*/
|
|
@ -1,2 +1,5 @@
|
|||
export * from './find-menu-by-path';
|
||||
export * from './generate-menus';
|
||||
export * from './generate-routes-backend';
|
||||
export * from './generate-routes-frontend';
|
||||
export * from './merge-route-modules';
|
||||
|
|
|
@ -29,8 +29,6 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/cache": "workspace:*",
|
||||
"@vben-core/colorful": "workspace:*",
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"@vueuse/core": "^10.11.0",
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import type { BuiltinThemeType } from '@vben-core/typings';
|
||||
|
||||
import type { SupportedLanguagesType } from './types';
|
||||
import type {
|
||||
BuiltinThemeType,
|
||||
SupportedLanguagesType,
|
||||
} from '@vben-core/typings';
|
||||
|
||||
interface Language {
|
||||
key: SupportedLanguagesType;
|
||||
|
|
|
@ -5,17 +5,6 @@ import { PreferenceManager, isDarkTheme } from './preferences';
|
|||
|
||||
describe('preferences', () => {
|
||||
let preferenceManager: PreferenceManager;
|
||||
vi.mock('@vben-core/cache', () => {
|
||||
return {
|
||||
StorageManager: vi.fn().mockImplementation(() => {
|
||||
return {
|
||||
getItem: vi.fn(),
|
||||
removeItem: vi.fn(),
|
||||
setItem: vi.fn(),
|
||||
};
|
||||
}),
|
||||
};
|
||||
});
|
||||
|
||||
// 模拟 window.matchMedia 方法
|
||||
vi.stubGlobal(
|
||||
|
|
|
@ -4,9 +4,12 @@ import type { Preferences } from './types';
|
|||
|
||||
import { markRaw, reactive, readonly, watch } from 'vue';
|
||||
|
||||
import { StorageManager } from '@vben-core/cache';
|
||||
import { generatorColorVariables } from '@vben-core/colorful';
|
||||
import { merge, updateCSSVariables } from '@vben-core/toolkit';
|
||||
import {
|
||||
StorageManager,
|
||||
generatorColorVariables,
|
||||
merge,
|
||||
updateCSSVariables,
|
||||
} from '@vben-core/toolkit';
|
||||
|
||||
import {
|
||||
breakpointsTailwind,
|
||||
|
|
|
@ -1,28 +1,18 @@
|
|||
import type {
|
||||
AccessModeType,
|
||||
AuthPageLayoutType,
|
||||
BreadcrumbStyleType,
|
||||
BuiltinThemeType,
|
||||
ContentCompactType,
|
||||
LayoutHeaderModeType,
|
||||
LayoutType,
|
||||
LoginExpiredModeType,
|
||||
NavigationStyleType,
|
||||
PageTransitionType,
|
||||
SupportedLanguagesType,
|
||||
ThemeModeType,
|
||||
} from '@vben-core/typings';
|
||||
|
||||
/**
|
||||
* 登录过期模式
|
||||
* 'modal' 弹窗模式 | 'page' 页面模式
|
||||
*/
|
||||
type LoginExpiredModeType = 'modal' | 'page';
|
||||
|
||||
type BreadcrumbStyleType = 'background' | 'normal';
|
||||
|
||||
type AccessModeType = 'allow-all' | 'backend' | 'frontend';
|
||||
|
||||
type NavigationStyleType = 'plain' | 'rounded';
|
||||
|
||||
type PageTransitionType = 'fade' | 'fade-down' | 'fade-slide' | 'fade-up';
|
||||
|
||||
type AuthPageLayoutType = 'panel-center' | 'panel-left' | 'panel-right';
|
||||
|
||||
interface AppPreferences {
|
||||
/** 权限模式 */
|
||||
accessMode: AccessModeType;
|
||||
|
@ -236,28 +226,17 @@ interface Preferences {
|
|||
type PreferencesKeys = keyof Preferences;
|
||||
|
||||
export type {
|
||||
AccessModeType,
|
||||
AppPreferences,
|
||||
AuthPageLayoutType,
|
||||
BreadcrumbPreferences,
|
||||
BreadcrumbStyleType,
|
||||
ContentCompactType,
|
||||
FooterPreferences,
|
||||
HeaderPreferences,
|
||||
LayoutHeaderModeType,
|
||||
LayoutType,
|
||||
LoginExpiredModeType,
|
||||
LogoPreferences,
|
||||
NavigationPreferences,
|
||||
NavigationStyleType,
|
||||
PageTransitionType,
|
||||
Preferences,
|
||||
PreferencesKeys,
|
||||
ShortcutKeyPreferences,
|
||||
SidebarPreferences,
|
||||
SupportedLanguagesType,
|
||||
TabbarPreferences,
|
||||
ThemeModeType,
|
||||
ThemePreferences,
|
||||
TransitionPreferences,
|
||||
WidgetPreferences,
|
||||
|
|
|
@ -1,7 +0,0 @@
|
|||
import { defineBuildConfig } from 'unbuild';
|
||||
|
||||
export default defineBuildConfig({
|
||||
clean: true,
|
||||
declaration: true,
|
||||
entries: ['src/index'],
|
||||
});
|
|
@ -1,40 +0,0 @@
|
|||
{
|
||||
"name": "@vben-core/cache",
|
||||
"version": "5.0.0",
|
||||
"homepage": "https://github.com/vbenjs/vue-vben-admin",
|
||||
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/vbenjs/vue-vben-admin.git",
|
||||
"directory": "packages/@vben-core/shared/cache"
|
||||
},
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "pnpm unbuild",
|
||||
"stub": "pnpm unbuild --stub"
|
||||
},
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"sideEffects": false,
|
||||
"main": "./dist/index.mjs",
|
||||
"module": "./dist/index.mjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./src/index.ts",
|
||||
"development": "./src/index.ts",
|
||||
"default": "./dist/index.mjs"
|
||||
}
|
||||
},
|
||||
"publishConfig": {
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./dist/index.d.ts",
|
||||
"default": "./dist/index.mjs"
|
||||
}
|
||||
}
|
||||
},
|
||||
"dependencies": {},
|
||||
"devDependencies": {}
|
||||
}
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/tsconfig",
|
||||
"extends": "@vben/tsconfig/library.json",
|
||||
"include": ["src"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
|
@ -1,7 +0,0 @@
|
|||
import { defineBuildConfig } from 'unbuild';
|
||||
|
||||
export default defineBuildConfig({
|
||||
clean: true,
|
||||
declaration: true,
|
||||
entries: ['src/index'],
|
||||
});
|
|
@ -1,42 +0,0 @@
|
|||
{
|
||||
"name": "@vben-core/colorful",
|
||||
"version": "5.0.0",
|
||||
"homepage": "https://github.com/vbenjs/vue-vben-admin",
|
||||
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/vbenjs/vue-vben-admin.git",
|
||||
"directory": "packages/@vben-core/shared/colorful"
|
||||
},
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "pnpm unbuild",
|
||||
"stub": "pnpm unbuild --stub"
|
||||
},
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"sideEffects": false,
|
||||
"main": "./dist/index.mjs",
|
||||
"module": "./dist/index.mjs",
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./src/index.ts",
|
||||
"development": "./src/index.ts",
|
||||
"default": "./dist/index.mjs"
|
||||
}
|
||||
},
|
||||
"publishConfig": {
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./dist/index.d.ts",
|
||||
"default": "./dist/index.mjs"
|
||||
}
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@ant-design/colors": "^7.1.0",
|
||||
"@ctrl/tinycolor": "^4.1.0"
|
||||
}
|
||||
}
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/tsconfig",
|
||||
"extends": "@vben/tsconfig/library.json",
|
||||
"include": ["src"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
|
@ -1,3 +0,0 @@
|
|||
# @vben-core/design-tokens
|
||||
|
||||
用于维护全局所有的 css 变量,它由 vite 插件在全局注入,不需要手动引入
|
|
@ -1,39 +0,0 @@
|
|||
{
|
||||
"name": "@vben-core/design-tokens",
|
||||
"version": "5.0.0",
|
||||
"homepage": "https://github.com/vbenjs/vue-vben-admin",
|
||||
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/vbenjs/vue-vben-admin.git",
|
||||
"directory": "packages/@vben-core/shared/design-tokens"
|
||||
},
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "pnpm vite build",
|
||||
"dts": "vue-tsc --declaration --emitDeclarationOnly --declarationDir dist",
|
||||
"prepublishOnly": "npm run build"
|
||||
},
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"sideEffects": [
|
||||
"**/*.css"
|
||||
],
|
||||
"main": "./dist/index.css",
|
||||
"exports": {
|
||||
".": {
|
||||
"types": "./src/index.ts",
|
||||
"development": "./src/index.ts",
|
||||
"default": "./dist/index.css"
|
||||
}
|
||||
},
|
||||
"publishConfig": {
|
||||
"exports": {
|
||||
".": {
|
||||
"default": "./dist/index.mjs"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/tsconfig",
|
||||
"extends": "@vben/tsconfig/library.json",
|
||||
"include": ["src"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
|
@ -1,3 +0,0 @@
|
|||
import { defineConfig } from '@vben/vite-config';
|
||||
|
||||
export default defineConfig();
|
|
@ -1,5 +1,6 @@
|
|||
import './scss/index.scss';
|
||||
import './css/tailwind.css';
|
||||
import './css/nprogress.css';
|
||||
import './design-tokens';
|
||||
|
||||
export {};
|
||||
|
|
|
@ -36,6 +36,8 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@ant-design/colors": "^7.1.0",
|
||||
"@ctrl/tinycolor": "^4.1.0",
|
||||
"@vue/shared": "^3.4.31",
|
||||
"clsx": "^2.1.1",
|
||||
"defu": "^6.1.4",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import { convertToHsl, convertToHslCssVar, isValidColor } from './utils';
|
||||
import { convertToHsl, convertToHslCssVar, isValidColor } from './convert';
|
||||
|
||||
describe('color conversion functions', () => {
|
||||
it('should correctly convert color to HSL format', () => {
|
|
@ -1,6 +1,6 @@
|
|||
import { generate } from '@ant-design/colors';
|
||||
|
||||
import { convertToHslCssVar } from './utils';
|
||||
import { convertToHslCssVar } from './convert';
|
||||
|
||||
export * from '@ant-design/colors';
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
export * from './convert';
|
||||
export * from './generator';
|
||||
export * from './utils';
|
|
@ -1,4 +1,6 @@
|
|||
export * from './cache';
|
||||
export * from './cn';
|
||||
export * from './colorful';
|
||||
export * from './diff';
|
||||
export * from './dom';
|
||||
export * from './inference';
|
||||
|
|
|
@ -33,11 +33,33 @@ type ContentCompactType = 'compact' | 'wide';
|
|||
|
||||
type LayoutHeaderModeType = 'auto' | 'auto-scroll' | 'fixed' | 'static';
|
||||
|
||||
/**
|
||||
* 登录过期模式
|
||||
* 'modal' 弹窗模式 | 'page' 页面模式
|
||||
*/
|
||||
type LoginExpiredModeType = 'modal' | 'page';
|
||||
|
||||
type BreadcrumbStyleType = 'background' | 'normal';
|
||||
|
||||
type AccessModeType = 'allow-all' | 'backend' | 'frontend';
|
||||
|
||||
type NavigationStyleType = 'plain' | 'rounded';
|
||||
|
||||
type PageTransitionType = 'fade' | 'fade-down' | 'fade-slide' | 'fade-up';
|
||||
|
||||
type AuthPageLayoutType = 'panel-center' | 'panel-left' | 'panel-right';
|
||||
|
||||
export type {
|
||||
AccessModeType,
|
||||
AuthPageLayoutType,
|
||||
BreadcrumbStyleType,
|
||||
BuiltinThemeType,
|
||||
ContentCompactType,
|
||||
LayoutHeaderModeType,
|
||||
LayoutType,
|
||||
LoginExpiredModeType,
|
||||
NavigationStyleType,
|
||||
PageTransitionType,
|
||||
SupportedLanguagesType,
|
||||
ThemeModeType,
|
||||
};
|
||||
|
|
|
@ -0,0 +1,33 @@
|
|||
interface BasicOption {
|
||||
label: string;
|
||||
value: string;
|
||||
}
|
||||
|
||||
interface SelectOption extends BasicOption {}
|
||||
|
||||
interface TabsOption extends BasicOption {}
|
||||
|
||||
interface BasicUserInfo {
|
||||
/**
|
||||
* 头像
|
||||
*/
|
||||
avatar: string;
|
||||
/**
|
||||
* 用户昵称
|
||||
*/
|
||||
realName: string;
|
||||
/**
|
||||
* 用户角色
|
||||
*/
|
||||
roles?: string[];
|
||||
/**
|
||||
* 用户id
|
||||
*/
|
||||
userId: string;
|
||||
/**
|
||||
* 用户名
|
||||
*/
|
||||
username: string;
|
||||
}
|
||||
|
||||
export type { BasicOption, BasicUserInfo, SelectOption, TabsOption };
|
|
@ -1,4 +1,5 @@
|
|||
export type * from './app';
|
||||
export * from './basic';
|
||||
export type * from './helper';
|
||||
export type * from './menu-record';
|
||||
export type * from './tabs';
|
||||
|
|
|
@ -1,3 +1,7 @@
|
|||
import type { RouteRecordRaw, Router } from 'vue-router';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
|
||||
interface RouteMeta {
|
||||
/**
|
||||
* 是否固定标签页
|
||||
|
@ -91,4 +95,27 @@ interface RouteMeta {
|
|||
title: string;
|
||||
}
|
||||
|
||||
export type { RouteMeta };
|
||||
// 定义递归类型以将 RouteRecordRaw 的 component 属性更改为 string
|
||||
type RouteRecordStringComponent<T = string> = {
|
||||
children?: RouteRecordStringComponent<T>[];
|
||||
component: T;
|
||||
} & Omit<RouteRecordRaw, 'children' | 'component'>;
|
||||
|
||||
type ComponentRecordType = Record<string, () => Promise<Component>>;
|
||||
|
||||
interface GenerateMenuAndRoutesOptions {
|
||||
fetchMenuListAsync?: () => Promise<RouteRecordStringComponent[]>;
|
||||
forbiddenComponent?: RouteRecordRaw['component'];
|
||||
layoutMap?: ComponentRecordType;
|
||||
pageMap?: ComponentRecordType;
|
||||
roles?: string[];
|
||||
router: Router;
|
||||
routes: RouteRecordRaw[];
|
||||
}
|
||||
|
||||
export type {
|
||||
ComponentRecordType,
|
||||
GenerateMenuAndRoutesOptions,
|
||||
RouteMeta,
|
||||
RouteRecordStringComponent,
|
||||
};
|
||||
|
|
|
@ -43,7 +43,6 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@radix-icons/vue": "^1.0.0",
|
||||
"@vben-core/colorful": "workspace:*",
|
||||
"@vben-core/iconify": "workspace:*",
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"@vben-core/typings": "workspace:*",
|
||||
|
|
|
@ -3,7 +3,7 @@ import type { MenuRecordBadgeRaw } from '@vben-core/typings';
|
|||
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { isValidColor } from '@vben-core/colorful';
|
||||
import { isValidColor } from '@vben-core/toolkit';
|
||||
|
||||
import BadgeDot from './menu-badge-dot.vue';
|
||||
|
||||
|
|
|
@ -37,14 +37,11 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/locales": "workspace:*",
|
||||
"@vben-core/helpers": "workspace:*",
|
||||
"@vben-core/preferences": "workspace:*",
|
||||
"@vben-core/stores": "workspace:*",
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"vue": "^3.4.31",
|
||||
"vue-router": "^4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vben/types": "workspace:*"
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"vue": "^3.4.31"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,43 @@
|
|||
<!--
|
||||
Access control component for fine-grained access control.
|
||||
-->
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { useAccess } from './use-access';
|
||||
|
||||
interface Props {
|
||||
/**
|
||||
* 通过什么方式来控制组件,如果是 role,则传入角色,如果是 code,则传入权限码
|
||||
* @default 'role'
|
||||
*/
|
||||
type?: 'code' | 'role';
|
||||
|
||||
/**
|
||||
* Specified codes is visible
|
||||
* @default []
|
||||
*/
|
||||
value?: string[];
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
name: 'AccessControl',
|
||||
});
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
type: 'role',
|
||||
value: () => [],
|
||||
});
|
||||
|
||||
const { hasAuthByCodes, hasAuthByRoles } = useAccess();
|
||||
|
||||
const hasAuth = computed(() => {
|
||||
const { type, value } = props;
|
||||
return type === 'role' ? hasAuthByRoles(value) : hasAuthByCodes(value);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<slot v-if="!value"></slot>
|
||||
<slot v-else-if="hasAuth"></slot>
|
||||
</template>
|
|
@ -1,29 +0,0 @@
|
|||
<!--
|
||||
Access control component for fine-grained access control.
|
||||
-->
|
||||
<script lang="ts" setup>
|
||||
import { useAccess } from './use-access';
|
||||
|
||||
interface Props {
|
||||
/**
|
||||
* Specified codes is visible
|
||||
* @default []
|
||||
*/
|
||||
value?: string[];
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
name: 'CodeAccess',
|
||||
});
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
value: () => [],
|
||||
});
|
||||
|
||||
const { hasAuthByCodes } = useAccess();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<slot v-if="!value"></slot>
|
||||
<slot v-else-if="hasAuthByCodes(value)"></slot>
|
||||
</template>
|
|
@ -1,17 +1,18 @@
|
|||
import type { AccessModeType } from '@vben-core/preferences';
|
||||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import type { GeneratorMenuAndRoutesOptions } from '../types';
|
||||
import type {
|
||||
AccessModeType,
|
||||
GenerateMenuAndRoutesOptions,
|
||||
} from '@vben-core/typings';
|
||||
|
||||
import {
|
||||
generateMenus,
|
||||
generateRoutesByBackend,
|
||||
generateRoutesByFrontend,
|
||||
} from '@vben-core/helpers';
|
||||
import { cloneDepp } from '@vben-core/toolkit';
|
||||
|
||||
import { generateMenus } from './generate-menus';
|
||||
import { generateRoutesByBackend } from './generate-routes-backend';
|
||||
import { generateRoutesByFrontend } from './generate-routes-frontend';
|
||||
|
||||
async function generateMenusAndRoutes(
|
||||
async function generateAccessible(
|
||||
mode: AccessModeType,
|
||||
options: GeneratorMenuAndRoutesOptions,
|
||||
options: GenerateMenuAndRoutesOptions,
|
||||
) {
|
||||
const { router } = options;
|
||||
|
||||
|
@ -25,7 +26,7 @@ async function generateMenusAndRoutes(
|
|||
});
|
||||
|
||||
// 生成菜单
|
||||
const accessibleMenus = await generateMenus1(mode, accessibleRoutes, options);
|
||||
const accessibleMenus = await generateMenus(accessibleRoutes, options.router);
|
||||
|
||||
return { accessibleMenus, accessibleRoutes };
|
||||
}
|
||||
|
@ -36,7 +37,7 @@ async function generateMenusAndRoutes(
|
|||
*/
|
||||
async function generateRoutes(
|
||||
mode: AccessModeType,
|
||||
options: GeneratorMenuAndRoutesOptions,
|
||||
options: GenerateMenuAndRoutesOptions,
|
||||
) {
|
||||
const { forbiddenComponent, roles, routes } = options;
|
||||
|
||||
|
@ -61,22 +62,4 @@ async function generateRoutes(
|
|||
}
|
||||
}
|
||||
|
||||
async function generateMenus1(
|
||||
mode: AccessModeType,
|
||||
routes: RouteRecordRaw[],
|
||||
options: GeneratorMenuAndRoutesOptions,
|
||||
) {
|
||||
const { router } = options;
|
||||
switch (mode) {
|
||||
case 'allow-all':
|
||||
case 'frontend':
|
||||
case 'backend': {
|
||||
return await generateMenus(routes, router);
|
||||
}
|
||||
default: {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { generateMenusAndRoutes };
|
||||
export { generateAccessible };
|
|
@ -1,5 +1,3 @@
|
|||
export { default as CodeAccess } from './code-access.vue';
|
||||
export * from './generate-menu-and-routes';
|
||||
export { default as RoleAccess } from './role-access.vue';
|
||||
export type * from './types';
|
||||
export { default as AccessControl } from './access-control.vue';
|
||||
export * from './generate-accessible';
|
||||
export * from './use-access';
|
||||
|
|
|
@ -1,29 +0,0 @@
|
|||
<!--
|
||||
Access control component for fine-grained access control.
|
||||
-->
|
||||
<script lang="ts" setup>
|
||||
import { useAccess } from './use-access';
|
||||
|
||||
interface Props {
|
||||
/**
|
||||
* Specified role is visible
|
||||
* @default []
|
||||
*/
|
||||
value?: string[];
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
name: 'RoleAccess',
|
||||
});
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
value: undefined,
|
||||
});
|
||||
|
||||
const { hasAuthByRoles } = useAccess();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<slot v-if="!value"></slot>
|
||||
<slot v-else-if="hasAuthByRoles(value)"></slot>
|
||||
</template>
|
|
@ -1,17 +0,0 @@
|
|||
import type {
|
||||
ComponentRecordType,
|
||||
RouteRecordStringComponent,
|
||||
} from '@vben/types';
|
||||
import type { RouteRecordRaw, Router } from 'vue-router';
|
||||
|
||||
interface GeneratorMenuAndRoutesOptions {
|
||||
fetchMenuListAsync?: () => Promise<RouteRecordStringComponent[]>;
|
||||
forbiddenComponent?: RouteRecordRaw['component'];
|
||||
layoutMap?: ComponentRecordType;
|
||||
pageMap?: ComponentRecordType;
|
||||
roles?: string[];
|
||||
router: Router;
|
||||
routes: RouteRecordRaw[];
|
||||
}
|
||||
|
||||
export type { GeneratorMenuAndRoutesOptions };
|
|
@ -1,9 +1,6 @@
|
|||
{
|
||||
"$schema": "https://json.schemastore.org/tsconfig",
|
||||
"extends": "@vben/tsconfig/web.json",
|
||||
"compilerOptions": {
|
||||
"types": ["@vben/types/global"]
|
||||
},
|
||||
"include": ["src"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
|
|
@ -37,7 +37,6 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/colorful": "workspace:*",
|
||||
"@vben-core/helpers": "workspace:*",
|
||||
"@vben-core/iconify": "workspace:*",
|
||||
"@vben-core/layout-ui": "workspace:*",
|
||||
|
@ -48,12 +47,9 @@
|
|||
"@vben-core/stores": "workspace:*",
|
||||
"@vben-core/tabs-ui": "workspace:*",
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"@vueuse/core": "^10.11.0",
|
||||
"vue": "^3.4.31",
|
||||
"vue-router": "^4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"@vben/types": "workspace:*"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -126,6 +126,19 @@ function useTabs() {
|
|||
disabled || !isCurrentTab || tabs.length - affixTabs.length <= 1;
|
||||
|
||||
const menus: IContextMenuItem[] = [
|
||||
{
|
||||
handler: async () => {
|
||||
if (!contentIsMaximize.value) {
|
||||
await router.push(tab.fullPath);
|
||||
}
|
||||
updateContentScreen(!contentIsMaximize.value);
|
||||
},
|
||||
icon: contentIsMaximize.value ? IcRoundFitScreen : IcTwotoneFitScreen,
|
||||
key: contentIsMaximize.value ? 'restore-maximize' : 'maximize',
|
||||
text: contentIsMaximize.value
|
||||
? $t('preferences.tabbar.contextMenu.restoreMaximize')
|
||||
: $t('preferences.tabbar.contextMenu.maximize'),
|
||||
},
|
||||
{
|
||||
disabled: !isCurrentTab,
|
||||
handler: async () => {
|
||||
|
@ -166,22 +179,10 @@ function useTabs() {
|
|||
},
|
||||
icon: IcRoundTableView,
|
||||
key: 'open-in-new-window',
|
||||
separator: true,
|
||||
text: $t('preferences.tabbar.contextMenu.openInNewWindow'),
|
||||
},
|
||||
{
|
||||
handler: async () => {
|
||||
if (!contentIsMaximize.value) {
|
||||
await router.push(tab.fullPath);
|
||||
}
|
||||
updateContentScreen(!contentIsMaximize.value);
|
||||
},
|
||||
icon: contentIsMaximize.value ? IcRoundFitScreen : IcTwotoneFitScreen,
|
||||
key: contentIsMaximize.value ? 'restore-maximize' : 'maximize',
|
||||
separator: true,
|
||||
text: contentIsMaximize.value
|
||||
? $t('preferences.tabbar.contextMenu.restoreMaximize')
|
||||
: $t('preferences.tabbar.contextMenu.maximize'),
|
||||
},
|
||||
|
||||
{
|
||||
disabled: closeLeftDisabled,
|
||||
handler: async () => {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script lang="ts" setup>
|
||||
import type { BreadcrumbStyleType } from '@vben-core/preferences';
|
||||
import type { IBreadcrumb } from '@vben-core/shadcn-ui';
|
||||
import type { BreadcrumbStyleType } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { BuiltinThemeType } from '@vben/types';
|
||||
import type { BuiltinThemeType } from '@vben-core/typings';
|
||||
|
||||
import { IcRoundColorLens } from '@vben-core/iconify';
|
||||
import {
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { MenuRecordRaw } from '@vben/types';
|
||||
import type { MenuRecordRaw } from '@vben-core/typings';
|
||||
|
||||
import { onMounted, onUnmounted, ref, watch } from 'vue';
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { MenuRecordRaw } from '@vben/types';
|
||||
import type { MenuRecordRaw } from '@vben-core/typings';
|
||||
|
||||
import { nextTick, onMounted, ref, shallowRef, watch } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SupportedLanguagesType } from '@vben/types';
|
||||
import type { SupportedLanguagesType } from '@vben-core/typings';
|
||||
|
||||
import { IcBaselineLanguage } from '@vben-core/iconify';
|
||||
import { loadLocaleMessages } from '@vben-core/locales';
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script setup lang="ts">
|
||||
import type { AuthPageLayoutType } from '@vben-core/preferences';
|
||||
import type { VbenDropdownMenuItem } from '@vben-core/shadcn-ui';
|
||||
import type { AuthPageLayoutType } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
import { SUPPORT_LANGUAGES } from '@vben-core/preferences';
|
||||
|
@ -14,7 +14,7 @@ defineOptions({
|
|||
const appLocale = defineModel<string>('appLocale');
|
||||
const appDynamicTitle = defineModel<boolean>('appDynamicTitle');
|
||||
|
||||
const localeItems: SelectListItem[] = SUPPORT_LANGUAGES.map((item) => ({
|
||||
const localeItems: SelectOption[] = SUPPORT_LANGUAGES.map((item) => ({
|
||||
label: item.text,
|
||||
value: item.key,
|
||||
}));
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
|
@ -13,7 +13,7 @@ defineOptions({
|
|||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
|
@ -20,7 +20,7 @@ const breadcrumbStyleType = defineModel<string>('breadcrumbStyleType');
|
|||
const breadcrumbShowHome = defineModel<boolean>('breadcrumbShowHome');
|
||||
const breadcrumbHideOnlyOne = defineModel<boolean>('breadcrumbHideOnlyOne');
|
||||
|
||||
const typeItems: SelectListItem[] = [
|
||||
const typeItems: SelectOption[] = [
|
||||
{ label: $t('preferences.normal'), value: 'normal' },
|
||||
{ label: $t('preferences.breadcrumb.background'), value: 'background' },
|
||||
];
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { LayoutHeaderModeType, SelectListItem } from '@vben/types';
|
||||
import type { LayoutHeaderModeType, SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
|
||||
|
@ -15,7 +15,7 @@ defineProps<{ disabled: boolean }>();
|
|||
const headerEnable = defineModel<boolean>('headerEnable');
|
||||
const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
|
||||
|
||||
const localeItems: SelectListItem[] = [
|
||||
const localeItems: SelectOption[] = [
|
||||
{
|
||||
label: $t('preferences.header.modeStatic'),
|
||||
value: 'static',
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { LayoutType } from '@vben/types';
|
||||
import type { LayoutType } from '@vben-core/typings';
|
||||
|
||||
import { type Component, computed } from 'vue';
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
|
||||
|
@ -16,7 +16,7 @@ const navigationStyleType = defineModel<string>('navigationStyleType');
|
|||
const navigationSplit = defineModel<boolean>('navigationSplit');
|
||||
const navigationAccordion = defineModel<boolean>('navigationAccordion');
|
||||
|
||||
const stylesItems: SelectListItem[] = [
|
||||
const stylesItems: SelectOption[] = [
|
||||
{ label: $t('preferences.rounded'), value: 'rounded' },
|
||||
{ label: $t('preferences.plain'), value: 'plain' },
|
||||
];
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
|
@ -20,7 +20,7 @@ defineOptions({
|
|||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
|
@ -20,7 +20,7 @@ defineOptions({
|
|||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
<script setup lang="ts">
|
||||
import type { BuiltinThemeType } from '@vben/types';
|
||||
import type { BuiltinThemeType } from '@vben-core/typings';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { TinyColor, convertToHsl } from '@vben-core/colorful';
|
||||
import { MdiEditBoxOutline } from '@vben-core/iconify';
|
||||
import { $t } from '@vben-core/locales';
|
||||
import {
|
||||
BUILT_IN_THEME_PRESETS,
|
||||
type BuiltinThemePreset,
|
||||
} from '@vben-core/preferences';
|
||||
import { TinyColor, convertToHsl } from '@vben-core/toolkit';
|
||||
|
||||
defineOptions({
|
||||
name: 'PreferenceBuiltinTheme',
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { ThemeModeType } from '@vben-core/preferences';
|
||||
import type { ThemeModeType } from '@vben-core/typings';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { ToggleGroup, ToggleGroupItem } from '@vben-core/shadcn-ui';
|
||||
|
||||
|
@ -7,7 +7,7 @@ defineOptions({
|
|||
name: 'PreferenceToggleItem',
|
||||
});
|
||||
|
||||
withDefaults(defineProps<{ disabled?: boolean; items: SelectListItem[] }>(), {
|
||||
withDefaults(defineProps<{ disabled?: boolean; items: SelectOption[] }>(), {
|
||||
disabled: false,
|
||||
items: () => [],
|
||||
});
|
||||
|
|
|
@ -1,17 +1,15 @@
|
|||
<script setup lang="ts">
|
||||
import type { SegmentedItem } from '@vben-core/shadcn-ui';
|
||||
import type {
|
||||
BreadcrumbStyleType,
|
||||
BuiltinThemeType,
|
||||
ContentCompactType,
|
||||
LayoutHeaderModeType,
|
||||
LayoutType,
|
||||
NavigationStyleType,
|
||||
SupportedLanguagesType,
|
||||
ThemeModeType,
|
||||
} from '@vben/types';
|
||||
import type {
|
||||
BreadcrumbStyleType,
|
||||
NavigationStyleType,
|
||||
} from '@vben-core/preferences';
|
||||
import type { SegmentedItem } from '@vben-core/shadcn-ui';
|
||||
} from '@vben-core/typings';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { loadLocaleMessages } from '@vben-core/locales';
|
||||
import { preferences, updatePreferences } from '@vben-core/preferences';
|
||||
import { capitalizeFirstLetter } from '@vben-core/toolkit';
|
||||
|
||||
|
@ -29,8 +30,14 @@ const listen = computed(() => {
|
|||
for (const [key, value] of Object.entries(preferences)) {
|
||||
if (typeof value === 'object') {
|
||||
for (const subKey of Object.keys(value)) {
|
||||
result[`update:${key}${capitalizeFirstLetter(subKey)}`] = (val: any) =>
|
||||
result[`update:${key}${capitalizeFirstLetter(subKey)}`] = (
|
||||
val: any,
|
||||
) => {
|
||||
updatePreferences({ [key]: { [subKey]: val } });
|
||||
if (key === 'app' && subKey === 'locale') {
|
||||
loadLocaleMessages(val);
|
||||
}
|
||||
};
|
||||
}
|
||||
} else {
|
||||
result[key] = value;
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
<script lang="ts" setup>
|
||||
import type { ThemeModeType } from '@vben-core/typings';
|
||||
|
||||
import {
|
||||
IcRoundMotionPhotosAuto,
|
||||
IcRoundWbSunny,
|
||||
|
@ -6,7 +8,6 @@ import {
|
|||
} from '@vben-core/iconify';
|
||||
import { $t } from '@vben-core/locales';
|
||||
import {
|
||||
type ThemeModeType,
|
||||
preferences,
|
||||
updatePreferences,
|
||||
usePreferences,
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import type { AnyFunction } from '@vben/types';
|
||||
import type { AnyFunction } from '@vben-core/typings';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
import { computed, ref } from 'vue';
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
<script setup lang="ts">
|
||||
import type { TabsItem } from '@vben/types';
|
||||
import type { TabsOption } from '@vben/types';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@vben-core/shadcn-ui';
|
||||
|
||||
interface Props {
|
||||
tabs: TabsItem[];
|
||||
tabs: TabsOption[];
|
||||
}
|
||||
|
||||
defineOptions({
|
||||
|
|
|
@ -42,12 +42,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@vben-core/design": "workspace:*",
|
||||
"@vben-core/design-tokens": "workspace:*"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/design": "workspace:*",
|
||||
"@vben-core/design-tokens": "workspace:*"
|
||||
"@vben-core/design": "workspace:*"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,2 +1 @@
|
|||
import '@vben-core/design';
|
||||
import '@vben-core/design-tokens';
|
||||
|
|
|
@ -1,4 +1,2 @@
|
|||
export type * from './router';
|
||||
export type * from './ui';
|
||||
export type * from './user';
|
||||
export type * from '@vben-core/typings';
|
||||
|
|
|
@ -1,13 +0,0 @@
|
|||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
|
||||
// 定义递归类型以将 RouteRecordRaw 的 component 属性更改为 string
|
||||
type RouteRecordStringComponent<T = string> = {
|
||||
children?: RouteRecordStringComponent<T>[];
|
||||
component: T;
|
||||
} & Omit<RouteRecordRaw, 'children' | 'component'>;
|
||||
|
||||
type ComponentRecordType = Record<string, () => Promise<Component>>;
|
||||
|
||||
export type { ComponentRecordType, RouteRecordStringComponent };
|
|
@ -1,11 +0,0 @@
|
|||
interface SelectListItem {
|
||||
label: string;
|
||||
value: string;
|
||||
}
|
||||
|
||||
interface TabsItem {
|
||||
label: string;
|
||||
value: string;
|
||||
}
|
||||
|
||||
export type { SelectListItem, TabsItem };
|
|
@ -1,9 +1,7 @@
|
|||
import type { BasicUserInfo } from '@vben-core/typings';
|
||||
|
||||
/** 用户信息 */
|
||||
interface UserInfo {
|
||||
/**
|
||||
* 头像
|
||||
*/
|
||||
avatar: string;
|
||||
interface UserInfo extends BasicUserInfo {
|
||||
/**
|
||||
* 用户描述
|
||||
*/
|
||||
|
@ -12,26 +10,11 @@ interface UserInfo {
|
|||
* 首页地址
|
||||
*/
|
||||
homePath: string;
|
||||
/**
|
||||
* 用户昵称
|
||||
*/
|
||||
realName: string;
|
||||
/**
|
||||
* 用户角色信息
|
||||
*/
|
||||
roles: string[];
|
||||
|
||||
/**
|
||||
* accessToken
|
||||
*/
|
||||
token: string;
|
||||
/**
|
||||
* 用户id
|
||||
*/
|
||||
userId: string;
|
||||
/**
|
||||
* 用户名
|
||||
*/
|
||||
username: string;
|
||||
}
|
||||
|
||||
export type { UserInfo };
|
||||
|
|
|
@ -559,6 +559,9 @@ importers:
|
|||
|
||||
packages/@core/forward/helpers:
|
||||
dependencies:
|
||||
'@vben-core/toolkit':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/toolkit
|
||||
'@vben-core/typings':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/typings
|
||||
|
@ -568,12 +571,6 @@ importers:
|
|||
|
||||
packages/@core/forward/preferences:
|
||||
dependencies:
|
||||
'@vben-core/cache':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/cache
|
||||
'@vben-core/colorful':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/colorful
|
||||
'@vben-core/toolkit':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/toolkit
|
||||
|
@ -642,25 +639,12 @@ importers:
|
|||
specifier: ^9.13.1
|
||||
version: 9.13.1(vue@3.4.31(typescript@5.5.3))
|
||||
|
||||
packages/@core/shared/cache: {}
|
||||
|
||||
packages/@core/shared/colorful:
|
||||
dependencies:
|
||||
'@ant-design/colors':
|
||||
specifier: ^7.1.0
|
||||
version: 7.1.0
|
||||
'@ctrl/tinycolor':
|
||||
specifier: ^4.1.0
|
||||
version: 4.1.0
|
||||
|
||||
packages/@core/shared/design:
|
||||
dependencies:
|
||||
modern-normalize:
|
||||
specifier: ^2.0.0
|
||||
version: 2.0.0
|
||||
|
||||
packages/@core/shared/design-tokens: {}
|
||||
|
||||
packages/@core/shared/iconify:
|
||||
dependencies:
|
||||
'@iconify/vue':
|
||||
|
@ -672,6 +656,12 @@ importers:
|
|||
|
||||
packages/@core/shared/toolkit:
|
||||
dependencies:
|
||||
'@ant-design/colors':
|
||||
specifier: ^7.1.0
|
||||
version: 7.1.0
|
||||
'@ctrl/tinycolor':
|
||||
specifier: ^4.1.0
|
||||
version: 4.1.0
|
||||
'@vue/shared':
|
||||
specifier: ^3.4.31
|
||||
version: 3.4.31
|
||||
|
@ -757,9 +747,6 @@ importers:
|
|||
'@radix-icons/vue':
|
||||
specifier: ^1.0.0
|
||||
version: 1.0.0(vue@3.4.31(typescript@5.5.3))
|
||||
'@vben-core/colorful':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/colorful
|
||||
'@vben-core/iconify':
|
||||
specifier: workspace:*
|
||||
version: link:../../shared/iconify
|
||||
|
@ -808,9 +795,9 @@ importers:
|
|||
|
||||
packages/business/access:
|
||||
dependencies:
|
||||
'@vben-core/locales':
|
||||
'@vben-core/helpers':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/locales
|
||||
version: link:../../@core/forward/helpers
|
||||
'@vben-core/preferences':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/forward/preferences
|
||||
|
@ -820,16 +807,12 @@ importers:
|
|||
'@vben-core/toolkit':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/toolkit
|
||||
'@vben-core/typings':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/typings
|
||||
vue:
|
||||
specifier: ^3.4.31
|
||||
version: 3.4.31(typescript@5.5.3)
|
||||
vue-router:
|
||||
specifier: ^4.4.0
|
||||
version: 4.4.0(vue@3.4.31(typescript@5.5.3))
|
||||
devDependencies:
|
||||
'@vben/types':
|
||||
specifier: workspace:*
|
||||
version: link:../../types
|
||||
|
||||
packages/business/chart-ui:
|
||||
dependencies:
|
||||
|
@ -848,9 +831,6 @@ importers:
|
|||
|
||||
packages/business/layouts:
|
||||
dependencies:
|
||||
'@vben-core/colorful':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/colorful
|
||||
'@vben-core/helpers':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/forward/helpers
|
||||
|
@ -881,6 +861,9 @@ importers:
|
|||
'@vben-core/toolkit':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/toolkit
|
||||
'@vben-core/typings':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/typings
|
||||
'@vueuse/core':
|
||||
specifier: ^10.11.0
|
||||
version: 10.11.0(vue@3.4.31(typescript@5.5.3))
|
||||
|
@ -890,13 +873,6 @@ importers:
|
|||
vue-router:
|
||||
specifier: ^4.4.0
|
||||
version: 4.4.0(vue@3.4.31(typescript@5.5.3))
|
||||
devDependencies:
|
||||
'@vben-core/typings':
|
||||
specifier: workspace:*
|
||||
version: link:../../@core/shared/typings
|
||||
'@vben/types':
|
||||
specifier: workspace:*
|
||||
version: link:../../types
|
||||
|
||||
packages/business/universal-ui:
|
||||
dependencies:
|
||||
|
@ -945,9 +921,6 @@ importers:
|
|||
'@vben-core/design':
|
||||
specifier: workspace:*
|
||||
version: link:../@core/shared/design
|
||||
'@vben-core/design-tokens':
|
||||
specifier: workspace:*
|
||||
version: link:../@core/shared/design-tokens
|
||||
|
||||
packages/types:
|
||||
dependencies:
|
||||
|
|
|
@ -64,22 +64,10 @@
|
|||
"name": "@vben-core/locales",
|
||||
"path": "packages/@core/locales",
|
||||
},
|
||||
{
|
||||
"name": "@vben-core/cache",
|
||||
"path": "packages/@core/shared/cache",
|
||||
},
|
||||
{
|
||||
"name": "@vben-core/colorful",
|
||||
"path": "packages/@core/shared/colorful",
|
||||
},
|
||||
{
|
||||
"name": "@vben-core/design",
|
||||
"path": "packages/@core/shared/design",
|
||||
},
|
||||
{
|
||||
"name": "@vben-core/design-tokens",
|
||||
"path": "packages/@core/shared/design-tokens",
|
||||
},
|
||||
{
|
||||
"name": "@vben-core/iconify",
|
||||
"path": "packages/@core/shared/iconify",
|
||||
|
|
Loading…
Reference in New Issue