From 3201b843a8407d2c27971b6d33b7044f82f23c49 Mon Sep 17 00:00:00 2001 From: Journey <52627267+chengazhen@users.noreply.github.com> Date: Thu, 19 Dec 2024 09:34:42 +0800 Subject: [PATCH 1/6] fix: resolve eslint errors as well as TS type errors (#5172) * fix: remove TypeScript error suppression for missing types in Vue ESLint config * fix: enhance application configuration with CSS options type support --- internal/lint-configs/eslint-config/src/configs/vue.ts | 1 - internal/vite-config/src/config/application.ts | 4 ++-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/internal/lint-configs/eslint-config/src/configs/vue.ts b/internal/lint-configs/eslint-config/src/configs/vue.ts index 27cc3cf2..d1c6521c 100644 --- a/internal/lint-configs/eslint-config/src/configs/vue.ts +++ b/internal/lint-configs/eslint-config/src/configs/vue.ts @@ -4,7 +4,6 @@ import { interopDefault } from '../util'; export async function vue(): Promise { const [pluginVue, parserVue, parserTs] = await Promise.all([ - // @ts-expect-error missing types interopDefault(import('eslint-plugin-vue')), interopDefault(import('vue-eslint-parser')), // @ts-expect-error missing types diff --git a/internal/vite-config/src/config/application.ts b/internal/vite-config/src/config/application.ts index f2276094..f9808cc7 100644 --- a/internal/vite-config/src/config/application.ts +++ b/internal/vite-config/src/config/application.ts @@ -1,4 +1,4 @@ -import type { UserConfig } from 'vite'; +import type { CSSOptions, UserConfig } from 'vite'; import type { DefineApplicationOptions } from '../typing'; @@ -100,7 +100,7 @@ function defineApplicationConfig(userConfigPromise?: DefineApplicationOptions) { }); } -function createCssOptions(injectGlobalScss = true) { +function createCssOptions(injectGlobalScss = true): CSSOptions { const root = findMonorepoRoot(); return { preprocessorOptions: injectGlobalScss From 968c44572aef7fbfbec27facd7b775740ce106aa Mon Sep 17 00:00:00 2001 From: booshaw <34653030@qq.com> Date: Thu, 19 Dec 2024 09:35:25 +0800 Subject: [PATCH 2/6] docs: fix typos (#5169) --- docs/src/guide/in-depth/ui-framework.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/src/guide/in-depth/ui-framework.md b/docs/src/guide/in-depth/ui-framework.md index ce05608f..6a7508e1 100644 --- a/docs/src/guide/in-depth/ui-framework.md +++ b/docs/src/guide/in-depth/ui-framework.md @@ -4,7 +4,7 @@ ## 新增组件库应用 -如果你想用其他别的组件库，你只需要按一下步骤进行操作： +如果你想用其他别的组件库，你只需要按以下步骤进行操作： 1. 在`apps`内创建一个新的文件夹，例如`apps/web-xxx`。 2. 更改`apps/web-xxx/package.json`的`name`字段为`web-xxx`。 From 85cbb3b84246172805594adec209bb7c592007a4 Mon Sep 17 00:00:00 2001 From: OldDriver Date: Thu, 19 Dec 2024 09:36:36 +0800 Subject: [PATCH 3/6] fix: remove the overlap caused by border-b (#5160) --- .../common-ui/src/ui/dashboard/workbench/workbench-project.vue | 2 +- .../src/ui/dashboard/workbench/workbench-quick-nav.vue | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue index b7062929..0a3fb7c2 100644 --- a/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue +++ b/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue @@ -38,7 +38,7 @@ defineEmits(['click']); 'border-b-0': index < 3, 'pb-4': index > 2, }" - class="border-border group w-full cursor-pointer border-b border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3" + class="border-border group w-full cursor-pointer border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3" >
2, 'border-b-0': index < 3, }" - class="flex-col-center border-border group w-1/3 cursor-pointer border-b border-r border-t py-8 hover:shadow-xl" + class="flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl" @click="$emit('click', item)" > Date: Thu, 19 Dec 2024 11:45:32 +0800 Subject: [PATCH 4/6] fix: sidebar header height (#5183) --- .../@core/ui-kit/layout-ui/src/components/layout-sidebar.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue index 5f7fe3bf..3d868190 100644 --- a/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue +++ b/packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue @@ -166,7 +166,7 @@ const headerStyle = computed((): CSSProperties => { return { ...(isSidebarMixed ? { display: 'flex', justifyContent: 'center' } : {}), - height: `${headerHeight}px`, + height: `${headerHeight - 1}px`, ...contentWidthStyle.value, }; }); From acd87b22508270209d481f335418e8e93e97e7b6 Mon Sep 17 00:00:00 2001 From: Netfan Date: Thu, 19 Dec 2024 20:37:42 +0800 Subject: [PATCH 5/6] feat: add `resizable` and `ColPage` component (#5188) * feat: add component resizable * feat: component `ColPage` with demo --- packages/@core/base/icons/src/lucide.ts | 1 + .../@core/ui-kit/shadcn-ui/src/ui/index.ts | 1 + .../src/ui/resizable/ResizableHandle.vue | 48 ++++++++ .../src/ui/resizable/ResizablePanelGroup.vue | 38 +++++++ .../shadcn-ui/src/ui/resizable/index.ts | 3 + .../src/components/col-page/col-page.vue | 107 ++++++++++++++++++ .../src/components/col-page/index.ts | 2 + .../src/components/col-page/types.ts | 26 +++++ .../effects/common-ui/src/components/index.ts | 1 + .../common-ui/src/components/page/index.ts | 1 + .../common-ui/src/components/page/page.vue | 16 +-- .../common-ui/src/components/page/types.ts | 11 ++ .../src/locales/langs/en-US/examples.json | 6 + .../src/locales/langs/zh-CN/examples.json | 3 + .../src/router/routes/modules/examples.ts | 11 ++ .../src/views/examples/layout/col-page.vue | 106 +++++++++++++++++ 16 files changed, 368 insertions(+), 13 deletions(-) create mode 100644 packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue create mode 100644 packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue create mode 100644 packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts create mode 100644 packages/effects/common-ui/src/components/col-page/col-page.vue create mode 100644 packages/effects/common-ui/src/components/col-page/index.ts create mode 100644 packages/effects/common-ui/src/components/col-page/types.ts create mode 100644 packages/effects/common-ui/src/components/page/types.ts create mode 100644 playground/src/views/examples/layout/col-page.vue diff --git a/packages/@core/base/icons/src/lucide.ts b/packages/@core/base/icons/src/lucide.ts index 97603eb5..21a1beff 100644 --- a/packages/@core/base/icons/src/lucide.ts +++ b/packages/@core/base/icons/src/lucide.ts @@ -28,6 +28,7 @@ export { Fullscreen, Github, Grip, + GripVertical, Info, InspectionPanel, Languages, diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts index 2711f942..02e76145 100644 --- a/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts +++ b/packages/@core/ui-kit/shadcn-ui/src/ui/index.ts @@ -16,6 +16,7 @@ export * from './pagination'; export * from './pin-input'; export * from './popover'; export * from './radio-group'; +export * from './resizable'; export * from './scroll-area'; export * from './select'; export * from './separator'; diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue new file mode 100644 index 00000000..81dc3fb4 --- /dev/null +++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizableHandle.vue @@ -0,0 +1,48 @@ + + + diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue new file mode 100644 index 00000000..8ea15f99 --- /dev/null +++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/ResizablePanelGroup.vue @@ -0,0 +1,38 @@ + + + diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts new file mode 100644 index 00000000..75c05d58 --- /dev/null +++ b/packages/@core/ui-kit/shadcn-ui/src/ui/resizable/index.ts @@ -0,0 +1,3 @@ +export { default as ResizableHandle } from './ResizableHandle.vue'; +export { default as ResizablePanelGroup } from './ResizablePanelGroup.vue'; +export { SplitterPanel as ResizablePanel } from 'radix-vue'; diff --git a/packages/effects/common-ui/src/components/col-page/col-page.vue b/packages/effects/common-ui/src/components/col-page/col-page.vue new file mode 100644 index 00000000..c3f9d686 --- /dev/null +++ b/packages/effects/common-ui/src/components/col-page/col-page.vue @@ -0,0 +1,107 @@ + + diff --git a/packages/effects/common-ui/src/components/col-page/index.ts b/packages/effects/common-ui/src/components/col-page/index.ts new file mode 100644 index 00000000..11b33058 --- /dev/null +++ b/packages/effects/common-ui/src/components/col-page/index.ts @@ -0,0 +1,2 @@ +export { default as ColPage } from './col-page.vue'; +export * from './types'; diff --git a/packages/effects/common-ui/src/components/col-page/types.ts b/packages/effects/common-ui/src/components/col-page/types.ts new file mode 100644 index 00000000..491d1e6d --- /dev/null +++ b/packages/effects/common-ui/src/components/col-page/types.ts @@ -0,0 +1,26 @@ +import type { PageProps } from '../page/types'; + +export interface ColPageProps extends PageProps { + /** + * 左侧宽度 + * @default 30 + */ + leftWidth?: number; + leftMinWidth?: number; + leftMaxWidth?: number; + leftCollapsedWidth?: number; + leftCollapsible?: boolean; + /** + * 右侧宽度 + * @default 70 + */ + rightWidth?: number; + rightMinWidth?: number; + rightCollapsedWidth?: number; + rightMaxWidth?: number; + rightCollapsible?: boolean; + + resizable?: boolean; + splitLine?: boolean; + splitHandle?: boolean; +} diff --git a/packages/effects/common-ui/src/components/index.ts b/packages/effects/common-ui/src/components/index.ts index cd93b506..6bba5526 100644 --- a/packages/effects/common-ui/src/components/index.ts +++ b/packages/effects/common-ui/src/components/index.ts @@ -1,5 +1,6 @@ export * from './api-component'; export * from './captcha'; +export * from './col-page'; export * from './ellipsis-text'; export * from './icon-picker'; export * from './page'; diff --git a/packages/effects/common-ui/src/components/page/index.ts b/packages/effects/common-ui/src/components/page/index.ts index 65bf3c69..fd9e02f2 100644 --- a/packages/effects/common-ui/src/components/page/index.ts +++ b/packages/effects/common-ui/src/components/page/index.ts @@ -1 +1,2 @@ export { default as Page } from './page.vue'; +export * from './types'; diff --git a/packages/effects/common-ui/src/components/page/page.vue b/packages/effects/common-ui/src/components/page/page.vue index 78f0ed4c..3a2ca8ac 100644 --- a/packages/effects/common-ui/src/components/page/page.vue +++ b/packages/effects/common-ui/src/components/page/page.vue @@ -1,4 +1,6 @@ + From a44ff73dd32917481535fb1d6019a8d5ce150ee5 Mon Sep 17 00:00:00 2001 From: Netfan Date: Thu, 19 Dec 2024 21:34:47 +0800 Subject: [PATCH 6/6] fix: grid tools in toolbar config not working as expected (#5190) --- .../plugins/src/vxe-table/use-vxe-grid.vue | 36 +++++++++---------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue index caec0a82..d60d991c 100644 --- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue +++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue @@ -6,6 +6,7 @@ import type { VxeGridListeners, VxeGridPropTypes, VxeGridProps as VxeTableGridProps, + VxeToolbarPropTypes, } from 'vxe-table'; import type { ExtendedVxeGridApi, VxeGridProps } from './types'; @@ -107,28 +108,28 @@ const showToolbar = computed(() => { const toolbarOptions = computed(() => { const slotActions = slots[TOOLBAR_ACTIONS]?.(); const slotTools = slots[TOOLBAR_TOOLS]?.(); - - const toolbarConfig: VxeGridPropTypes.ToolbarConfig = { - tools: - gridOptions.value?.toolbarConfig?.search && !!formOptions.value - ? [ - { - code: 'search', - icon: 'vxe-icon--search', - circle: true, - status: showSearchForm.value ? 'primary' : undefined, - title: $t('common.search'), - }, - ] - : [], + const searchBtn: VxeToolbarPropTypes.ToolConfig = { + code: 'search', + icon: 'vxe-icon--search', + circle: true, + status: showSearchForm.value ? 'primary' : undefined, + title: $t('common.search'), }; + // 将搜索按钮合并到用户配置的toolbarConfig.tools中 + const toolbarConfig: VxeGridPropTypes.ToolbarConfig = { + tools: (gridOptions.value?.toolbarConfig?.tools ?? + []) as VxeToolbarPropTypes.ToolConfig[], + }; + if (gridOptions.value?.toolbarConfig?.search && !!formOptions.value) { + toolbarConfig.tools = Array.isArray(toolbarConfig.tools) + ? [...toolbarConfig.tools, searchBtn] + : [searchBtn]; + } if (!showToolbar.value) { return { toolbarConfig }; } - // if (gridOptions.value?.toolbarConfig?.search) { - // } // 强制使用固定的toolbar配置，不允许用户自定义 // 减少配置的复杂度，以及后续维护的成本 toolbarConfig.slots = { @@ -137,7 +138,6 @@ const toolbarOptions = computed(() => { : {}), ...(slotTools ? { tools: TOOLBAR_TOOLS } : {}), }; - return { toolbarConfig }; }); @@ -147,7 +147,7 @@ const options = computed(() => { const mergedOptions: VxeTableGridProps = cloneDeep( mergeWithArrayOverride( {}, - toolbarOptions.value, + toRaw(toolbarOptions.value), toRaw(gridOptions.value), globalGridConfig, ),