diff --git a/apps/backend-mock/api/table/list.ts b/apps/backend-mock/api/table/list.ts new file mode 100644 index 00000000..4a0db94e --- /dev/null +++ b/apps/backend-mock/api/table/list.ts @@ -0,0 +1,48 @@ +import { faker } from '@faker-js/faker'; +import { verifyAccessToken } from '~/utils/jwt-utils'; +import { unAuthorizedResponse } from '~/utils/response'; + +function generateMockDataList(count: number) { + const dataList = []; + + for (let i = 0; i < count; i++) { + const dataItem = { + id: faker.string.uuid(), + imageUrl: faker.image.avatar(), + imageUrl2: faker.image.avatar(), + open: faker.datatype.boolean(), + status: faker.helpers.arrayElement(['success', 'error', 'warning']), + productName: faker.commerce.productName(), + price: faker.commerce.price(), + currency: faker.finance.currencyCode(), + quantity: faker.number.int({ min: 1, max: 100 }), + available: faker.datatype.boolean(), + category: faker.commerce.department(), + releaseDate: faker.date.past(), + rating: faker.number.float({ min: 1, max: 5 }), + description: faker.commerce.productDescription(), + weight: faker.number.float({ min: 0.1, max: 10 }), + color: faker.color.human(), + inProduction: faker.datatype.boolean(), + tags: Array.from({ length: 3 }, () => faker.commerce.productAdjective()), + }; + + dataList.push(dataItem); + } + + return dataList; +} + +const mockData = generateMockDataList(100); + +export default eventHandler(async (event) => { + const userinfo = verifyAccessToken(event); + if (!userinfo) { + return unAuthorizedResponse(event); + } + + await sleep(600); + + const { page, pageSize } = getQuery(event); + return usePageResponseSuccess(page as string, pageSize as string, mockData); +}); diff --git a/apps/backend-mock/package.json b/apps/backend-mock/package.json index 2700d89c..cc0b8d53 100644 --- a/apps/backend-mock/package.json +++ b/apps/backend-mock/package.json @@ -10,6 +10,7 @@ "start": "nitro dev" }, "dependencies": { + "@faker-js/faker": "catalog:", "jsonwebtoken": "catalog:", "nitropack": "catalog:" }, diff --git a/apps/backend-mock/utils/response.ts b/apps/backend-mock/utils/response.ts index dea14724..aa6d18cc 100644 --- a/apps/backend-mock/utils/response.ts +++ b/apps/backend-mock/utils/response.ts @@ -9,6 +9,27 @@ export function useResponseSuccess(data: T) { }; } +export function usePageResponseSuccess( + page: number | string, + pageSize: number | string, + list: T[], + { message = 'ok' } = {}, +) { + const pageData = pagination( + Number.parseInt(`${page}`), + Number.parseInt(`${pageSize}`), + list, + ); + + return { + ...useResponseSuccess({ + items: pageData, + total: list.length, + }), + message, + }; +} + export function useResponseError(message: string, error: any = null) { return { code: -1, @@ -27,3 +48,18 @@ export function unAuthorizedResponse(event: H3Event) { setResponseStatus(event, 401); return useResponseError('UnauthorizedException', 'Unauthorized Exception'); } + +export function sleep(ms: number) { + return new Promise((resolve) => setTimeout(resolve, ms)); +} + +export function pagination( + pageNo: number, + pageSize: number, + array: T[], +): T[] { + const offset = (pageNo - 1) * Number(pageSize); + return offset + Number(pageSize) >= array.length + ? array.slice(offset) + : array.slice(offset, offset + Number(pageSize)); +} diff --git a/apps/web-antd/package.json b/apps/web-antd/package.json index b73d6644..48a8d727 100644 --- a/apps/web-antd/package.json +++ b/apps/web-antd/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-antd", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/apps/web-antd/src/adapter/index.ts b/apps/web-antd/src/adapter/index.ts index 698d687b..6a9391be 100644 --- a/apps/web-antd/src/adapter/index.ts +++ b/apps/web-antd/src/adapter/index.ts @@ -1 +1,2 @@ export * from './form'; +export * from './vxe-table'; diff --git a/apps/web-antd/src/adapter/vxe-table.ts b/apps/web-antd/src/adapter/vxe-table.ts new file mode 100644 index 00000000..969ec750 --- /dev/null +++ b/apps/web-antd/src/adapter/vxe-table.ts @@ -0,0 +1,59 @@ +import { h } from 'vue'; + +import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table'; + +import { Button, Image } from 'ant-design-vue'; + +import { useVbenForm } from './form'; + +setupVbenVxeTable({ + configVxeTable: (vxeUI) => { + vxeUI.setConfig({ + grid: { + align: 'center', + border: true, + minHeight: 180, + proxyConfig: { + autoLoad: true, + response: { + result: 'items', + total: 'total', + list: 'items', + }, + showActiveMsg: true, + showResponseMsg: false, + }, + round: true, + size: 'small', + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellImage' }, + vxeUI.renderer.add('CellImage', { + renderDefault(_renderOpts, params) { + const { column, row } = params; + return h(Image, { src: row[column.field] }); + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellLink' }, + vxeUI.renderer.add('CellLink', { + renderDefault(renderOpts) { + const { props } = renderOpts; + return h( + Button, + { size: 'small', type: 'link' }, + { default: () => props?.text }, + ); + }, + }); + + // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化 + // vxeUI.formats.add + }, + useVbenForm, +}); + +export { useVbenVxeGrid }; + +export type * from '@vben/plugins/vxe-table'; diff --git a/apps/web-ele/package.json b/apps/web-ele/package.json index 4a1286c1..5d29e439 100644 --- a/apps/web-ele/package.json +++ b/apps/web-ele/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-ele", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/apps/web-ele/src/adapter/index.ts b/apps/web-ele/src/adapter/index.ts index 698d687b..6a9391be 100644 --- a/apps/web-ele/src/adapter/index.ts +++ b/apps/web-ele/src/adapter/index.ts @@ -1 +1,2 @@ export * from './form'; +export * from './vxe-table'; diff --git a/apps/web-ele/src/adapter/vxe-table.ts b/apps/web-ele/src/adapter/vxe-table.ts new file mode 100644 index 00000000..177408c4 --- /dev/null +++ b/apps/web-ele/src/adapter/vxe-table.ts @@ -0,0 +1,60 @@ +import { h } from 'vue'; + +import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table'; + +import { ElButton, ElImage } from 'element-plus'; + +import { useVbenForm } from './form'; + +setupVbenVxeTable({ + configVxeTable: (vxeUI) => { + vxeUI.setConfig({ + grid: { + align: 'center', + border: true, + minHeight: 180, + proxyConfig: { + autoLoad: true, + response: { + result: 'items', + total: 'total', + list: 'items', + }, + showActiveMsg: true, + showResponseMsg: false, + }, + round: true, + size: 'small', + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellImage' }, + vxeUI.renderer.add('CellImage', { + renderDefault(_renderOpts, params) { + const { column, row } = params; + const src = row[column.field]; + return h(ElImage, { src, previewSrcList: [src] }); + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellLink' }, + vxeUI.renderer.add('CellLink', { + renderDefault(renderOpts) { + const { props } = renderOpts; + return h( + ElButton, + { size: 'small', link: true }, + { default: () => props?.text }, + ); + }, + }); + + // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化 + // vxeUI.formats.add + }, + useVbenForm, +}); + +export { useVbenVxeGrid }; + +export type * from '@vben/plugins/vxe-table'; diff --git a/apps/web-naive/package.json b/apps/web-naive/package.json index b6ead495..45ea2af4 100644 --- a/apps/web-naive/package.json +++ b/apps/web-naive/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-naive", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/apps/web-naive/src/adapter/index.ts b/apps/web-naive/src/adapter/index.ts index 423f6308..9617430f 100644 --- a/apps/web-naive/src/adapter/index.ts +++ b/apps/web-naive/src/adapter/index.ts @@ -1,2 +1,3 @@ export * from './form'; export * from './naive'; +export * from './vxe-table'; diff --git a/apps/web-naive/src/adapter/vxe-table.ts b/apps/web-naive/src/adapter/vxe-table.ts new file mode 100644 index 00000000..23c74d71 --- /dev/null +++ b/apps/web-naive/src/adapter/vxe-table.ts @@ -0,0 +1,59 @@ +import { h } from 'vue'; + +import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table'; + +import { NButton, NImage } from 'naive-ui'; + +import { useVbenForm } from './form'; + +setupVbenVxeTable({ + configVxeTable: (vxeUI) => { + vxeUI.setConfig({ + grid: { + align: 'center', + border: true, + minHeight: 180, + proxyConfig: { + autoLoad: true, + response: { + result: 'items', + total: 'total', + list: 'items', + }, + showActiveMsg: true, + showResponseMsg: false, + }, + round: true, + size: 'small', + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellImage' }, + vxeUI.renderer.add('CellImage', { + renderDefault(_renderOpts, params) { + const { column, row } = params; + return h(NImage, { src: row[column.field] }); + }, + }); + + // 表格配置项可以用 cellRender: { name: 'CellLink' }, + vxeUI.renderer.add('CellLink', { + renderDefault(renderOpts) { + const { props } = renderOpts; + return h( + NButton, + { size: 'small', type: 'primary', quaternary: true }, + { default: () => props?.text }, + ); + }, + }); + + // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化 + // vxeUI.formats.add + }, + useVbenForm, +}); + +export { useVbenVxeGrid }; + +export type * from '@vben/plugins/vxe-table'; diff --git a/cspell.json b/cspell.json index 428db62f..f89cb492 100644 --- a/cspell.json +++ b/cspell.json @@ -27,8 +27,7 @@ "lucide", "mkdist", "mockjs", - "naiveui", - "nocheck", + "vitejs", "noopener", "noreferrer", "nprogress", diff --git a/docs/package.json b/docs/package.json index 2b9f1c2f..1ab6abc7 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,6 +1,6 @@ { "name": "@vben/docs", - "version": "5.3.1", + "version": "5.3.2", "private": true, "scripts": { "build": "vitepress build", @@ -13,9 +13,7 @@ "dependencies": { "@vben-core/shadcn-ui": "workspace:*", "@vben/common-ui": "workspace:*", - "@vben/hooks": "workspace:*", "@vben/locales": "workspace:*", - "@vben/preferences": "workspace:*", "@vben/styles": "workspace:*", "ant-design-vue": "catalog:", "lucide-vue-next": "catalog:", diff --git a/docs/src/components/common-ui/vben-form.md b/docs/src/components/common-ui/vben-form.md index 5b4c12ce..ccb438c9 100644 --- a/docs/src/components/common-ui/vben-form.md +++ b/docs/src/components/common-ui/vben-form.md @@ -267,6 +267,7 @@ useVbenForm 返回的第二个参数，是一个对象，包含了一些表单 | submitButtonOptions | 提交按钮组件参数 | `ActionButtonOptions` | - | | showDefaultActions | 是否显示默认操作按钮 | `boolean` | `true` | | collapsed | 是否折叠，在`是否展开，在showCollapseButton=true`时生效 | `boolean` | `false` | +| collapseTriggerResize | 折叠时，触发`resize`事件 | `boolean` | `false` | | collapsedRows | 折叠时保持的行数 | `number` | `1` | | commonConfig | 表单项的通用配置，每个配置都会传递到每个表单项，表单项可覆盖 | `FormCommonConfig` | - | | schema | 表单项的每一项配置 | `FormSchema` | - | diff --git a/docs/src/en/guide/essentials/development.md b/docs/src/en/guide/essentials/development.md index 5e168e47..287c0a96 100644 --- a/docs/src/en/guide/essentials/development.md +++ b/docs/src/en/guide/essentials/development.md @@ -95,7 +95,7 @@ The execution command is: `pnpm run [script]` or `npm run [script]`. // Lint code "lint": "vsh lint", // After installing dependencies, execute the stub script for all packages - "postinstall": "turbo run stub", + "postinstall": "pnpm -r run stub --if-present", // Only allow using pnpm "preinstall": "npx only-allow pnpm", // Install husky diff --git a/docs/src/guide/essentials/development.md b/docs/src/guide/essentials/development.md index 2af6a357..7e64564f 100644 --- a/docs/src/guide/essentials/development.md +++ b/docs/src/guide/essentials/development.md @@ -95,7 +95,7 @@ npm 脚本是项目常见的配置，用于执行一些常见的任务，比如 // lint 代码 "lint": "vsh lint", // 依赖安装完成之后，执行所有包的stub脚本 - "postinstall": "turbo run stub", + "postinstall": "pnpm -r run stub --if-present", // 只允许使用pnpm "preinstall": "npx only-allow pnpm", // husky的安装 diff --git a/internal/lint-configs/commitlint-config/package.json b/internal/lint-configs/commitlint-config/package.json index f2dd4715..8224a072 100644 --- a/internal/lint-configs/commitlint-config/package.json +++ b/internal/lint-configs/commitlint-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/commitlint-config", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/lint-configs/stylelint-config/package.json b/internal/lint-configs/stylelint-config/package.json index 4f4c3d19..3d5dbec4 100644 --- a/internal/lint-configs/stylelint-config/package.json +++ b/internal/lint-configs/stylelint-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/stylelint-config", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/node-utils/package.json b/internal/node-utils/package.json index 680835ec..1455e492 100644 --- a/internal/node-utils/package.json +++ b/internal/node-utils/package.json @@ -1,6 +1,6 @@ { "name": "@vben/node-utils", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/tailwind-config/package.json b/internal/tailwind-config/package.json index e40645ed..9148f7bb 100644 --- a/internal/tailwind-config/package.json +++ b/internal/tailwind-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/tailwind-config", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/tailwind-config/src/index.ts b/internal/tailwind-config/src/index.ts index 08cfde2d..528998cb 100644 --- a/internal/tailwind-config/src/index.ts +++ b/internal/tailwind-config/src/index.ts @@ -91,7 +91,10 @@ const customColors = { main: { DEFAULT: 'hsl(var(--main))', }, - overlay: 'hsl(var(--overlay))', + overlay: { + content: 'hsl(var(--overlay-content))', + DEFAULT: 'hsl(var(--overlay))', + }, red: { ...createColorsPalette('red'), foreground: 'hsl(var(--destructive-foreground))', diff --git a/internal/tsconfig/package.json b/internal/tsconfig/package.json index e7bcef34..4c8a1934 100644 --- a/internal/tsconfig/package.json +++ b/internal/tsconfig/package.json @@ -1,6 +1,6 @@ { "name": "@vben/tsconfig", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/vite-config/package.json b/internal/vite-config/package.json index 52cda1a2..7c43ff0b 100644 --- a/internal/vite-config/package.json +++ b/internal/vite-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/vite-config", - "version": "5.3.1", + "version": "5.3.2", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", @@ -53,6 +53,7 @@ "vite": "catalog:", "vite-plugin-compression": "catalog:", "vite-plugin-dts": "catalog:", - "vite-plugin-html": "catalog:" + "vite-plugin-html": "catalog:", + "vite-plugin-lazy-import": "catalog:" } } diff --git a/internal/vite-config/src/config/application.ts b/internal/vite-config/src/config/application.ts index c6809399..f323e662 100644 --- a/internal/vite-config/src/config/application.ts +++ b/internal/vite-config/src/config/application.ts @@ -47,6 +47,7 @@ function defineApplicationConfig(userConfigPromise?: DefineApplicationOptions) { }, pwa: true, pwaOptions: getDefaultPwaOptions(appTitle), + vxeTableLazyImport: true, ...envConfig, ...application, }); diff --git a/internal/vite-config/src/plugins/index.ts b/internal/vite-config/src/plugins/index.ts index de559fd3..1a8e7c26 100644 --- a/internal/vite-config/src/plugins/index.ts +++ b/internal/vite-config/src/plugins/index.ts @@ -26,6 +26,7 @@ import { viteMetadataPlugin } from './inject-metadata'; import { viteLicensePlugin } from './license'; import { viteNitroMockPlugin } from './nitro-mock'; import { vitePrintPlugin } from './print'; +import { viteVxeTableImportsPlugin } from './vxe-table'; /** * 获取条件成立的 vite 插件 @@ -110,6 +111,7 @@ async function loadApplicationPlugins( printInfoMap, pwa, pwaOptions, + vxeTableLazyImport, ...commonOptions } = options; @@ -135,6 +137,12 @@ async function loadApplicationPlugins( return [await vitePrintPlugin({ infoMap: printInfoMap })]; }, }, + { + condition: vxeTableLazyImport, + plugins: async () => { + return [await viteVxeTableImportsPlugin()]; + }, + }, { condition: nitroMock, plugins: async () => { diff --git a/internal/vite-config/src/plugins/vxe-table.ts b/internal/vite-config/src/plugins/vxe-table.ts new file mode 100644 index 00000000..3c107a7f --- /dev/null +++ b/internal/vite-config/src/plugins/vxe-table.ts @@ -0,0 +1,20 @@ +import type { PluginOption } from 'vite'; + +import { lazyImport, VxeResolver } from 'vite-plugin-lazy-import'; + +async function viteVxeTableImportsPlugin(): Promise { + return [ + lazyImport({ + resolvers: [ + VxeResolver({ + libraryName: 'vxe-table', + }), + VxeResolver({ + libraryName: 'vxe-pc-ui', + }), + ], + }), + ]; +} + +export { viteVxeTableImportsPlugin }; diff --git a/internal/vite-config/src/typing.ts b/internal/vite-config/src/typing.ts index 37da46d2..69e9fd37 100644 --- a/internal/vite-config/src/typing.ts +++ b/internal/vite-config/src/typing.ts @@ -123,6 +123,8 @@ interface ApplicationPluginOptions extends CommonPluginOptions { pwa?: boolean; /** pwa 插件配置 */ pwaOptions?: Partial; + /** 是否开启vxe-table懒加载 */ + vxeTableLazyImport?: boolean; } interface LibraryPluginOptions extends CommonPluginOptions { diff --git a/package.json b/package.json index 940fbfba..cb1d13ae 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vben-admin-pro", - "version": "5.3.1", + "version": "5.3.2", "private": true, "keywords": [ "monorepo", @@ -49,7 +49,7 @@ "dev:play": "pnpm -F @vben/playground run dev", "format": "vsh lint --format", "lint": "vsh lint", - "postinstall": "turbo run stub", + "postinstall": "pnpm -r run stub --if-present", "preinstall": "npx only-allow pnpm", "prepare": "is-ci || husky", "preview": "turbo-run preview", diff --git a/packages/@core/base/design/package.json b/packages/@core/base/design/package.json index 3b7eaa3b..9f1ac6ab 100644 --- a/packages/@core/base/design/package.json +++ b/packages/@core/base/design/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/design", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/design/src/design-tokens/dark/index.css b/packages/@core/base/design/src/design-tokens/dark/index.css index 0e48e5f6..5f244442 100644 --- a/packages/@core/base/design/src/design-tokens/dark/index.css +++ b/packages/@core/base/design/src/design-tokens/dark/index.css @@ -79,6 +79,7 @@ /* 遮罩颜色 */ --overlay: 0deg 0% 0% / 40%; + --overlay-content: 0deg 0% 0% / 40%; /* 基本文字大小 */ --font-size-base: 16px; diff --git a/packages/@core/base/design/src/design-tokens/default/index.css b/packages/@core/base/design/src/design-tokens/default/index.css index 2309e925..aa41d23e 100644 --- a/packages/@core/base/design/src/design-tokens/default/index.css +++ b/packages/@core/base/design/src/design-tokens/default/index.css @@ -79,7 +79,7 @@ /* 遮罩颜色 */ --overlay: 0 0% 0% / 45%; - --overlay-light: 0 0% 95% / 45%; + --overlay-content: 0 0% 95% / 45%; /* 基本文字大小 */ --font-size-base: 16px; diff --git a/packages/@core/base/icons/build.config.ts b/packages/@core/base/icons/build.config.ts index 97e572c5..18eaa604 100644 --- a/packages/@core/base/icons/build.config.ts +++ b/packages/@core/base/icons/build.config.ts @@ -3,5 +3,19 @@ import { defineBuildConfig } from 'unbuild'; export default defineBuildConfig({ clean: true, declaration: true, - entries: ['src/index'], + entries: [ + { + builder: 'mkdist', + input: './src', + loaders: ['vue'], + pattern: ['**/*.vue'], + }, + { + builder: 'mkdist', + format: 'esm', + input: './src', + loaders: ['js'], + pattern: ['**/*.ts'], + }, + ], }); diff --git a/packages/@core/base/icons/package.json b/packages/@core/base/icons/package.json index ba2f2f9d..2c61bc42 100644 --- a/packages/@core/base/icons/package.json +++ b/packages/@core/base/icons/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/icons", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/icons/src/components/empty.vue b/packages/@core/base/icons/src/components/empty.vue new file mode 100644 index 00000000..444a765e --- /dev/null +++ b/packages/@core/base/icons/src/components/empty.vue @@ -0,0 +1,27 @@ + diff --git a/packages/@core/base/icons/src/index.ts b/packages/@core/base/icons/src/index.ts index d533cd58..89ebd9af 100644 --- a/packages/@core/base/icons/src/index.ts +++ b/packages/@core/base/icons/src/index.ts @@ -1,4 +1,5 @@ +export { default as EmptyIcon } from './components/empty.vue'; export * from './create-icon'; -export * from './lucide'; +export * from './lucide'; export * from '@iconify/vue'; diff --git a/packages/@core/base/shared/package.json b/packages/@core/base/shared/package.json index 57d593fc..5d7cd4e1 100644 --- a/packages/@core/base/shared/package.json +++ b/packages/@core/base/shared/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/shared", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/shared/src/constants/globals.ts b/packages/@core/base/shared/src/constants/globals.ts index 1d9d2f45..17941de1 100644 --- a/packages/@core/base/shared/src/constants/globals.ts +++ b/packages/@core/base/shared/src/constants/globals.ts @@ -1,9 +1,11 @@ -/** - * @zh_CN 布局内容高度 css变量 - * @en_US Layout content height - */ +/** layout content 组件的高度 */ export const CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT = `--vben-content-height`; +/** layout content 组件的宽度 */ export const CSS_VARIABLE_LAYOUT_CONTENT_WIDTH = `--vben-content-width`; +/** layout header 组件的高度 */ +export const CSS_VARIABLE_LAYOUT_HEADER_HEIGHT = `--vben-header-height`; +/** layout footer 组件的高度 */ +export const CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT = `--vben-footer-height`; /** * @zh_CN 默认命名空间 diff --git a/packages/@core/base/shared/src/utils/dom.ts b/packages/@core/base/shared/src/utils/dom.ts index aa39597d..69617176 100644 --- a/packages/@core/base/shared/src/utils/dom.ts +++ b/packages/@core/base/shared/src/utils/dom.ts @@ -85,3 +85,11 @@ export function needsScrollbar() { // 在其他情况下，根据 scrollHeight 和 innerHeight 比较判断 return doc.scrollHeight > window.innerHeight; } + +export function triggerWindowResize(): void { + // 创建一个新的 resize 事件 + const resizeEvent = new Event('resize'); + + // 触发 window 的 resize 事件 + window.dispatchEvent(resizeEvent); +} diff --git a/packages/@core/base/typings/package.json b/packages/@core/base/typings/package.json index 3c39e5ad..8057b85f 100644 --- a/packages/@core/base/typings/package.json +++ b/packages/@core/base/typings/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/typings", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/composables/package.json b/packages/@core/composables/package.json index 450c4660..06cb810c 100644 --- a/packages/@core/composables/package.json +++ b/packages/@core/composables/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/composables", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/composables/src/index.ts b/packages/@core/composables/src/index.ts index abfd9501..146ff005 100644 --- a/packages/@core/composables/src/index.ts +++ b/packages/@core/composables/src/index.ts @@ -1,5 +1,5 @@ -export * from './use-content-style'; export * from './use-is-mobile'; +export * from './use-layout-style'; export * from './use-namespace'; export * from './use-priority-value'; export * from './use-scroll-lock'; diff --git a/packages/@core/composables/src/use-content-style.ts b/packages/@core/composables/src/use-layout-style.ts similarity index 68% rename from packages/@core/composables/src/use-content-style.ts rename to packages/@core/composables/src/use-layout-style.ts index 4aea499c..ac599c4f 100644 --- a/packages/@core/composables/src/use-content-style.ts +++ b/packages/@core/composables/src/use-layout-style.ts @@ -4,6 +4,8 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'; import { CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT, CSS_VARIABLE_LAYOUT_CONTENT_WIDTH, + CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT, + CSS_VARIABLE_LAYOUT_HEADER_HEIGHT, } from '@vben-core/shared/constants'; import { getElementVisibleRect, @@ -15,7 +17,7 @@ import { useCssVar, useDebounceFn } from '@vueuse/core'; /** * @zh_CN content style */ -function useContentStyle() { +export function useLayoutContentStyle() { let resizeObserver: null | ResizeObserver = null; const contentElement = ref(null); const visibleDomRect = ref(null); @@ -40,7 +42,7 @@ function useContentStyle() { contentHeight.value = `${visibleDomRect.value.height}px`; contentWidth.value = `${visibleDomRect.value.width}px`; }, - 100, + 16, ); onMounted(() => { @@ -58,4 +60,28 @@ function useContentStyle() { return { contentElement, overlayStyle, visibleDomRect }; } -export { useContentStyle }; +export function useLayoutHeaderStyle() { + const headerHeight = useCssVar(CSS_VARIABLE_LAYOUT_HEADER_HEIGHT); + + return { + getLayoutHeaderHeight: () => { + return Number.parseInt(`${headerHeight.value}`, 10); + }, + setLayoutHeaderHeight: (height: number) => { + headerHeight.value = `${height}px`; + }, + }; +} + +export function useLayoutFooterStyle() { + const footerHeight = useCssVar(CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT); + + return { + getLayoutFooterHeight: () => { + return Number.parseInt(`${footerHeight.value}`, 10); + }, + setLayoutFooterHeight: (height: number) => { + footerHeight.value = `${height}px`; + }, + }; +} diff --git a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap index fba6d31d..139f23e4 100644 --- a/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap +++ b/packages/@core/preferences/__tests__/__snapshots__/config.test.ts.snap @@ -39,7 +39,7 @@ exports[`defaultPreferences immutability test > should not modify the config obj "icpLink": "", }, "footer": { - "enable": true, + "enable": false, "fixed": false, }, "header": { diff --git a/packages/@core/preferences/package.json b/packages/@core/preferences/package.json index 66b262e1..d7eca4c5 100644 --- a/packages/@core/preferences/package.json +++ b/packages/@core/preferences/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/preferences", - "version": "5.3.1", + "version": "5.3.2", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/preferences/src/config.ts b/packages/@core/preferences/src/config.ts index e68f4922..4e2dd28a 100644 --- a/packages/@core/preferences/src/config.ts +++ b/packages/@core/preferences/src/config.ts @@ -39,7 +39,7 @@ const defaultPreferences: Preferences = { icpLink: '', }, footer: { - enable: true, + enable: false, fixed: false, }, header: { diff --git a/packages/@core/preferences/src/use-preferences.ts b/packages/@core/preferences/src/use-preferences.ts index a5068771..fc1e2de5 100644 --- a/packages/@core/preferences/src/use-preferences.ts +++ b/packages/@core/preferences/src/use-preferences.ts @@ -28,6 +28,10 @@ function usePreferences() { return isDarkTheme(preferences.theme.mode); }); + const locale = computed(() => { + return preferences.app.locale; + }); + const isMobile = computed(() => { return appPreferences.value.isMobile; }); @@ -218,6 +222,7 @@ function usePreferences() { isSideNav, keepAlive, layout, + locale, preferencesButtonPosition, sidebarCollapsed, theme, diff --git a/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts b/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts index 69126420..31aa3554 100644 --- a/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts +++ b/packages/@core/ui-kit/form-ui/__tests__/form-api.test.ts @@ -109,7 +109,7 @@ describe('formApi', () => { }); it('should unmount form and reset state', () => { - formApi.unmounted(); + formApi.unmount(); expect(formApi.isMounted).toBe(false); }); diff --git a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue index 2f2b95ec..3c03c757 100644 --- a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue +++ b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue @@ -1,9 +1,9 @@