diff --git a/CHANGELOG.md b/CHANGELOG.md index 8dbedda5..60e1c147 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,22 @@ # CHANGE LOG +## 5.0.1 + +本次更新灵感来自于 `vben admin 5` 项目。 + +## Feats + +- 更新了 `Menu`, `MenuTag`, `SiderBar` 样式细节 +- 调整 `components`, `components-pro` 分包，现在都统一到 `components` 下，以 `base`, `pro` 进行区分，避免导出导入麻烦 +- `MenuTag` 新增了一些操作方式 +- `SiderBarLogo` 样式调整 + +## Fixes + +- 新增 `tableFlexHeight` 配置项属性修复 `RTable` 组件因为不再透传至 `Table` 导致设置 `flexHeight` 进行动态高度设置失败的问题 +- 修复 `RTable` 错误的 `title` 属性注入问题 +- 修复 `MenuTag` 频繁右键会导致闪烁出现右键菜单的问题 + ## 5.0.0 ## Feats @@ -123,7 +140,7 @@ - `RChart` 组件 `setOptions` 方法配置项默认不启用 `merge` 模式 - 调整 `header` 的样式，增加了一点点间隙 - `useDevice` 新增 `observer` 配置项，可以自定义观察回调 -- 新增 `components-pro` 包，助力简化业务开发 +- 新增 `components` 包，助力简化业务开发 - 新增 `RTablePro` 组件，大幅简化中后台带有过滤请求条件的表格显示业务 - 新增 `RCollapse` 组件，允许折叠过滤条件 diff --git a/__test__/components/modal.spec.ts b/__test__/components/modal.spec.ts index fa4c5c6d..57439a2b 100644 --- a/__test__/components/modal.spec.ts +++ b/__test__/components/modal.spec.ts @@ -1,4 +1,4 @@ -import { RModal } from '../../src/components/RModal/index' +import { RModal } from '../../src/components/base/RModal/index' import { mount } from '@vue/test-utils' describe('RModal', () => { diff --git a/package.json b/package.json index 612f3c1f..9c0b6c4d 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ray-template", "private": false, - "version": "5.0.0", + "version": "5.0.1", "type": "module", "engines": { "node": "^18.0.0 || >=20.0.0", diff --git a/src/app-components/app/AppAvatar/index.tsx b/src/app-components/app/AppAvatar/index.tsx index 59b7c10b..ef4655c5 100644 --- a/src/app-components/app/AppAvatar/index.tsx +++ b/src/app-components/app/AppAvatar/index.tsx @@ -46,7 +46,7 @@ const AppAvatar = defineComponent({ const { getSigningCallback, avatarSize, spaceSize, $props, vertical } = this return ( - + = { /** css 尺寸单位匹配 */ cssUnit: /^\d+(\.\d+)?(px|em|rem|%|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ch|ex|q|s|ms|deg|rad|turn|grad|hz|khz|dpi|dpcm|dppx|fr|auto)$/, + /** + * + * @description + * 匹配 css 单位是否为 auto, unset, fit-content, max-content, min-content, initial, inherit, revert, revert-layer, -webkit-fill-available, + * -webkit-max-content, -webkit-min-content, -webkit-revert, -webkit-revert-layer, -webkit-fill-available。 + */ + cssSize: + /^auto|unset|fit-content|max-content|min-content|initial|inherit|revert|revert-layer|[-\w]+-webkit-fill-available$/, } diff --git a/src/components-pro/index.ts b/src/components-pro/index.ts deleted file mode 100644 index 517094e4..00000000 --- a/src/components-pro/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -import RCollapse from './RCollapse/Collapse' - -export * from './RTablePro' -export { RCollapse } diff --git a/src/components/RBarcode/index.ts b/src/components/base/RBarcode/index.ts similarity index 100% rename from src/components/RBarcode/index.ts rename to src/components/base/RBarcode/index.ts diff --git a/src/components/RBarcode/src/Barcode.tsx b/src/components/base/RBarcode/src/Barcode.tsx similarity index 100% rename from src/components/RBarcode/src/Barcode.tsx rename to src/components/base/RBarcode/src/Barcode.tsx diff --git a/src/components/RBarcode/src/index.scss b/src/components/base/RBarcode/src/index.scss similarity index 100% rename from src/components/RBarcode/src/index.scss rename to src/components/base/RBarcode/src/index.scss diff --git a/src/components/RBarcode/src/props.ts b/src/components/base/RBarcode/src/props.ts similarity index 100% rename from src/components/RBarcode/src/props.ts rename to src/components/base/RBarcode/src/props.ts diff --git a/src/components/RBarcode/src/types.ts b/src/components/base/RBarcode/src/types.ts similarity index 100% rename from src/components/RBarcode/src/types.ts rename to src/components/base/RBarcode/src/types.ts diff --git a/src/components/RChart/index.ts b/src/components/base/RChart/index.ts similarity index 100% rename from src/components/RChart/index.ts rename to src/components/base/RChart/index.ts diff --git a/src/components/RChart/src/hooks/useChart.ts b/src/components/base/RChart/src/hooks/useChart.ts similarity index 100% rename from src/components/RChart/src/hooks/useChart.ts rename to src/components/base/RChart/src/hooks/useChart.ts diff --git a/src/components/RChart/src/index.scss b/src/components/base/RChart/src/index.scss similarity index 100% rename from src/components/RChart/src/index.scss rename to src/components/base/RChart/src/index.scss diff --git a/src/components/RChart/src/index.tsx b/src/components/base/RChart/src/index.tsx similarity index 100% rename from src/components/RChart/src/index.tsx rename to src/components/base/RChart/src/index.tsx diff --git a/src/components/RChart/src/props.ts b/src/components/base/RChart/src/props.ts similarity index 100% rename from src/components/RChart/src/props.ts rename to src/components/base/RChart/src/props.ts diff --git a/src/components/RChart/src/types.ts b/src/components/base/RChart/src/types.ts similarity index 100% rename from src/components/RChart/src/types.ts rename to src/components/base/RChart/src/types.ts diff --git a/src/components/RChart/src/utils/get-custom-echart-theme.ts b/src/components/base/RChart/src/utils/get-custom-echart-theme.ts similarity index 96% rename from src/components/RChart/src/utils/get-custom-echart-theme.ts rename to src/components/base/RChart/src/utils/get-custom-echart-theme.ts index e6f64e87..6e91312c 100644 --- a/src/components/RChart/src/utils/get-custom-echart-theme.ts +++ b/src/components/base/RChart/src/utils/get-custom-echart-theme.ts @@ -1,7 +1,7 @@ import type { ChartThemeRawArray, ChartThemeRawModules, -} from '@/components/RChart/src/types' +} from '@/components/base/RChart/src/types' /** * diff --git a/src/components/RChart/src/utils/index.ts b/src/components/base/RChart/src/utils/index.ts similarity index 100% rename from src/components/RChart/src/utils/index.ts rename to src/components/base/RChart/src/utils/index.ts diff --git a/src/components/RChart/src/utils/loading-options.ts b/src/components/base/RChart/src/utils/loading-options.ts similarity index 91% rename from src/components/RChart/src/utils/loading-options.ts rename to src/components/base/RChart/src/utils/loading-options.ts index 547126aa..b0e691af 100644 --- a/src/components/RChart/src/utils/loading-options.ts +++ b/src/components/base/RChart/src/utils/loading-options.ts @@ -1,6 +1,6 @@ import { useTheme } from '@/hooks' -import type { LoadingOptions } from '@/components/RChart/src/types' +import type { LoadingOptions } from '@/components/base/RChart/src/types' /** * diff --git a/src/components/RChart/src/utils/set-echart-options.ts b/src/components/base/RChart/src/utils/set-echart-options.ts similarity index 100% rename from src/components/RChart/src/utils/set-echart-options.ts rename to src/components/base/RChart/src/utils/set-echart-options.ts diff --git a/src/components/RCollapseGrid/index.ts b/src/components/base/RCollapseGrid/index.ts similarity index 100% rename from src/components/RCollapseGrid/index.ts rename to src/components/base/RCollapseGrid/index.ts diff --git a/src/components/RCollapseGrid/src/index.scss b/src/components/base/RCollapseGrid/src/index.scss similarity index 100% rename from src/components/RCollapseGrid/src/index.scss rename to src/components/base/RCollapseGrid/src/index.scss diff --git a/src/components/RCollapseGrid/src/index.tsx b/src/components/base/RCollapseGrid/src/index.tsx similarity index 100% rename from src/components/RCollapseGrid/src/index.tsx rename to src/components/base/RCollapseGrid/src/index.tsx diff --git a/src/components/RCollapseGrid/src/props.ts b/src/components/base/RCollapseGrid/src/props.ts similarity index 100% rename from src/components/RCollapseGrid/src/props.ts rename to src/components/base/RCollapseGrid/src/props.ts diff --git a/src/components/RCollapseGrid/src/types.ts b/src/components/base/RCollapseGrid/src/types.ts similarity index 100% rename from src/components/RCollapseGrid/src/types.ts rename to src/components/base/RCollapseGrid/src/types.ts diff --git a/src/components/RForm/index.ts b/src/components/base/RForm/index.ts similarity index 100% rename from src/components/RForm/index.ts rename to src/components/base/RForm/index.ts diff --git a/src/components/RForm/src/Form.tsx b/src/components/base/RForm/src/Form.tsx similarity index 100% rename from src/components/RForm/src/Form.tsx rename to src/components/base/RForm/src/Form.tsx diff --git a/src/components/RForm/src/hooks/useForm.ts b/src/components/base/RForm/src/hooks/useForm.ts similarity index 100% rename from src/components/RForm/src/hooks/useForm.ts rename to src/components/base/RForm/src/hooks/useForm.ts diff --git a/src/components/RForm/src/props.ts b/src/components/base/RForm/src/props.ts similarity index 100% rename from src/components/RForm/src/props.ts rename to src/components/base/RForm/src/props.ts diff --git a/src/components/RForm/src/types.ts b/src/components/base/RForm/src/types.ts similarity index 100% rename from src/components/RForm/src/types.ts rename to src/components/base/RForm/src/types.ts diff --git a/src/components/RIcon/index.ts b/src/components/base/RIcon/index.ts similarity index 100% rename from src/components/RIcon/index.ts rename to src/components/base/RIcon/index.ts diff --git a/src/components/RIcon/src/index.scss b/src/components/base/RIcon/src/index.scss similarity index 100% rename from src/components/RIcon/src/index.scss rename to src/components/base/RIcon/src/index.scss diff --git a/src/components/RIcon/src/index.tsx b/src/components/base/RIcon/src/index.tsx similarity index 100% rename from src/components/RIcon/src/index.tsx rename to src/components/base/RIcon/src/index.tsx diff --git a/src/components/RIcon/src/props.ts b/src/components/base/RIcon/src/props.ts similarity index 100% rename from src/components/RIcon/src/props.ts rename to src/components/base/RIcon/src/props.ts diff --git a/src/components/RIframe/index.ts b/src/components/base/RIframe/index.ts similarity index 100% rename from src/components/RIframe/index.ts rename to src/components/base/RIframe/index.ts diff --git a/src/components/RIframe/src/index.scss b/src/components/base/RIframe/src/index.scss similarity index 100% rename from src/components/RIframe/src/index.scss rename to src/components/base/RIframe/src/index.scss diff --git a/src/components/RIframe/src/index.tsx b/src/components/base/RIframe/src/index.tsx similarity index 100% rename from src/components/RIframe/src/index.tsx rename to src/components/base/RIframe/src/index.tsx diff --git a/src/components/RIframe/src/props.ts b/src/components/base/RIframe/src/props.ts similarity index 100% rename from src/components/RIframe/src/props.ts rename to src/components/base/RIframe/src/props.ts diff --git a/src/components/RIframe/src/types.ts b/src/components/base/RIframe/src/types.ts similarity index 100% rename from src/components/RIframe/src/types.ts rename to src/components/base/RIframe/src/types.ts diff --git a/src/components/RModal/index.ts b/src/components/base/RModal/index.ts similarity index 100% rename from src/components/RModal/index.ts rename to src/components/base/RModal/index.ts diff --git a/src/components/RModal/src/Modal.tsx b/src/components/base/RModal/src/Modal.tsx similarity index 100% rename from src/components/RModal/src/Modal.tsx rename to src/components/base/RModal/src/Modal.tsx diff --git a/src/components/RModal/src/constant.ts b/src/components/base/RModal/src/constant.ts similarity index 100% rename from src/components/RModal/src/constant.ts rename to src/components/base/RModal/src/constant.ts diff --git a/src/components/RModal/src/hooks/useModal.ts b/src/components/base/RModal/src/hooks/useModal.ts similarity index 100% rename from src/components/RModal/src/hooks/useModal.ts rename to src/components/base/RModal/src/hooks/useModal.ts diff --git a/src/components/RModal/src/index.scss b/src/components/base/RModal/src/index.scss similarity index 100% rename from src/components/RModal/src/index.scss rename to src/components/base/RModal/src/index.scss diff --git a/src/components/RModal/src/props.ts b/src/components/base/RModal/src/props.ts similarity index 100% rename from src/components/RModal/src/props.ts rename to src/components/base/RModal/src/props.ts diff --git a/src/components/RModal/src/types.ts b/src/components/base/RModal/src/types.ts similarity index 100% rename from src/components/RModal/src/types.ts rename to src/components/base/RModal/src/types.ts diff --git a/src/components/RModal/src/utils.ts b/src/components/base/RModal/src/utils.ts similarity index 100% rename from src/components/RModal/src/utils.ts rename to src/components/base/RModal/src/utils.ts diff --git a/src/components/RMoreDropdown/index.ts b/src/components/base/RMoreDropdown/index.ts similarity index 100% rename from src/components/RMoreDropdown/index.ts rename to src/components/base/RMoreDropdown/index.ts diff --git a/src/components/RMoreDropdown/src/index.tsx b/src/components/base/RMoreDropdown/src/index.tsx similarity index 100% rename from src/components/RMoreDropdown/src/index.tsx rename to src/components/base/RMoreDropdown/src/index.tsx diff --git a/src/components/RMoreDropdown/src/props.ts b/src/components/base/RMoreDropdown/src/props.ts similarity index 100% rename from src/components/RMoreDropdown/src/props.ts rename to src/components/base/RMoreDropdown/src/props.ts diff --git a/src/components/RSegment/index.ts b/src/components/base/RSegment/index.ts similarity index 100% rename from src/components/RSegment/index.ts rename to src/components/base/RSegment/index.ts diff --git a/src/components/RSegment/src/Segment.tsx b/src/components/base/RSegment/src/Segment.tsx similarity index 100% rename from src/components/RSegment/src/Segment.tsx rename to src/components/base/RSegment/src/Segment.tsx diff --git a/src/components/RSegment/src/constant.ts b/src/components/base/RSegment/src/constant.ts similarity index 100% rename from src/components/RSegment/src/constant.ts rename to src/components/base/RSegment/src/constant.ts diff --git a/src/components/RSegment/src/index.scss b/src/components/base/RSegment/src/index.scss similarity index 100% rename from src/components/RSegment/src/index.scss rename to src/components/base/RSegment/src/index.scss diff --git a/src/components/RSegment/src/props.ts b/src/components/base/RSegment/src/props.ts similarity index 100% rename from src/components/RSegment/src/props.ts rename to src/components/base/RSegment/src/props.ts diff --git a/src/components/RSegment/src/types.ts b/src/components/base/RSegment/src/types.ts similarity index 100% rename from src/components/RSegment/src/types.ts rename to src/components/base/RSegment/src/types.ts diff --git a/src/components/RTable/index.ts b/src/components/base/RTable/index.ts similarity index 100% rename from src/components/RTable/index.ts rename to src/components/base/RTable/index.ts diff --git a/src/components/RTable/src/Table.tsx b/src/components/base/RTable/src/Table.tsx similarity index 93% rename from src/components/RTable/src/Table.tsx rename to src/components/base/RTable/src/Table.tsx index 70881185..98111958 100644 --- a/src/components/RTable/src/Table.tsx +++ b/src/components/base/RTable/src/Table.tsx @@ -8,7 +8,7 @@ import Print from './components/Print' import TablePropsSelect from './components/Props' import props from './props' -import { call, renderNode, uuid } from '@/utils' +import { call, renderNode, uuid, completeSize } from '@/utils' import { config } from './shared' import { pick } from 'lodash-es' import { useTemplateRef } from 'vue' @@ -20,6 +20,7 @@ import type { PropsComponentPopselectKeys, RTableInst, } from './types' +import type { ExtractPublicPropTypes } from 'vue' export default defineComponent({ name: 'RTable', @@ -235,24 +236,29 @@ export default defineComponent({ const { $props, $attrs, - wrapperBordered, + $slots, + uuidTable, + contextMenuReactive, uuidWrapper, privateReactive, - disabledContextMenu, - contextMenuReactive, - contextMenuOptions, - uuidTable, - title, - $slots, propsPopselectValue, - renderWrapperHeader, } = this const { class: className, ...restAttrs } = $attrs const { tool, combineRowProps, contextMenuSelect } = this + const { + renderWrapperHeader, + wrapperBordered, + disabledContextMenu, + contextMenuOptions, + title, + tableFlexHeight, + cardProps, + ...restProps + } = $props as ExtractPublicPropTypes return ( {{ ...$slots, diff --git a/src/components/RTable/src/components/C.tsx b/src/components/base/RTable/src/components/C.tsx similarity index 100% rename from src/components/RTable/src/components/C.tsx rename to src/components/base/RTable/src/components/C.tsx diff --git a/src/components/RTable/src/components/Fullscreen.tsx b/src/components/base/RTable/src/components/Fullscreen.tsx similarity index 100% rename from src/components/RTable/src/components/Fullscreen.tsx rename to src/components/base/RTable/src/components/Fullscreen.tsx diff --git a/src/components/RTable/src/components/Print.tsx b/src/components/base/RTable/src/components/Print.tsx similarity index 100% rename from src/components/RTable/src/components/Print.tsx rename to src/components/base/RTable/src/components/Print.tsx diff --git a/src/components/RTable/src/components/Props.tsx b/src/components/base/RTable/src/components/Props.tsx similarity index 100% rename from src/components/RTable/src/components/Props.tsx rename to src/components/base/RTable/src/components/Props.tsx diff --git a/src/components/RTable/src/components/Size.tsx b/src/components/base/RTable/src/components/Size.tsx similarity index 100% rename from src/components/RTable/src/components/Size.tsx rename to src/components/base/RTable/src/components/Size.tsx diff --git a/src/components/RTable/src/hooks/useCheckedRowKeys.ts b/src/components/base/RTable/src/hooks/useCheckedRowKeys.ts similarity index 100% rename from src/components/RTable/src/hooks/useCheckedRowKeys.ts rename to src/components/base/RTable/src/hooks/useCheckedRowKeys.ts diff --git a/src/components/RTable/src/hooks/useTable.ts b/src/components/base/RTable/src/hooks/useTable.ts similarity index 100% rename from src/components/RTable/src/hooks/useTable.ts rename to src/components/base/RTable/src/hooks/useTable.ts diff --git a/src/components/RTable/src/index.scss b/src/components/base/RTable/src/index.scss similarity index 100% rename from src/components/RTable/src/index.scss rename to src/components/base/RTable/src/index.scss diff --git a/src/components/RTable/src/props.ts b/src/components/base/RTable/src/props.ts similarity index 95% rename from src/components/RTable/src/props.ts rename to src/components/base/RTable/src/props.ts index 37fa8a78..2c84316e 100644 --- a/src/components/RTable/src/props.ts +++ b/src/components/base/RTable/src/props.ts @@ -14,6 +14,17 @@ import type { Recordable } from '@/types' const props = { ...dataTableProps, + /** + * + * @description + * 当设置表格高度为弹性高度时，手动设置表格的高度。 + * + * @default undefined + */ + tableFlexHeight: { + type: [String, Number] as PropType, + default: void 0, + }, /** * * @description diff --git a/src/components/RTable/src/shared.ts b/src/components/base/RTable/src/shared.ts similarity index 100% rename from src/components/RTable/src/shared.ts rename to src/components/base/RTable/src/shared.ts diff --git a/src/components/RTable/src/types.ts b/src/components/base/RTable/src/types.ts similarity index 100% rename from src/components/RTable/src/types.ts rename to src/components/base/RTable/src/types.ts diff --git a/src/components/RTransitionComponent/index.ts b/src/components/base/RTransitionComponent/index.ts similarity index 100% rename from src/components/RTransitionComponent/index.ts rename to src/components/base/RTransitionComponent/index.ts diff --git a/src/components/RTransitionComponent/src/index.vue b/src/components/base/RTransitionComponent/src/index.vue similarity index 100% rename from src/components/RTransitionComponent/src/index.vue rename to src/components/base/RTransitionComponent/src/index.vue diff --git a/src/components/RTransitionComponent/src/props.ts b/src/components/base/RTransitionComponent/src/props.ts similarity index 100% rename from src/components/RTransitionComponent/src/props.ts rename to src/components/base/RTransitionComponent/src/props.ts diff --git a/src/components/RTransitionComponent/src/types.ts b/src/components/base/RTransitionComponent/src/types.ts similarity index 100% rename from src/components/RTransitionComponent/src/types.ts rename to src/components/base/RTransitionComponent/src/types.ts diff --git a/src/components/index.ts b/src/components/index.ts index 6c1972de..1874a227 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -1,23 +1,27 @@ +import RCollapse from '../components/pro/RCollapse/Collapse' + // 导出所有自定义组件 -export * from './RChart' -export * from './RCollapseGrid' -export * from './RIcon' -export * from './RIframe' -export * from './RModal' -export * from './RMoreDropdown' -export * from './RTable' -export * from './RTransitionComponent' -export * from './RForm' -export * from './RSegment' -export * from './RBarcode' +export * from './base/RChart' +export * from './base/RCollapseGrid' +export * from './base/RIcon' +export * from './base/RIframe' +export * from './base/RModal' +export * from './base/RMoreDropdown' +export * from './base/RTable' +export * from './base/RTransitionComponent' +export * from './base/RForm' +export * from './base/RSegment' +export * from './base/RBarcode' +export * from '../components/pro/RTablePro' +export { RCollapse } // 导出自定义组件类型 -export type * from './RChart/src/types' -export type * from './RCollapseGrid/src/types' -export type * from './RIframe/src/types' -export type * from './RTable/src/types' -export type * from './RTransitionComponent/src/types' -export type * from './RForm/src/types' -export type * from './RModal/src/types' -export type * from './RSegment/src/types' -export type * from './RBarcode/src/types' +export type * from './base/RChart/src/types' +export type * from './base/RCollapseGrid/src/types' +export type * from './base/RIframe/src/types' +export type * from './base/RTable/src/types' +export type * from './base/RTransitionComponent/src/types' +export type * from './base/RForm/src/types' +export type * from './base/RModal/src/types' +export type * from './base/RSegment/src/types' +export type * from './base/RBarcode/src/types' diff --git a/src/components-pro/RCollapse/Collapse.tsx b/src/components/pro/RCollapse/Collapse.tsx similarity index 88% rename from src/components-pro/RCollapse/Collapse.tsx rename to src/components/pro/RCollapse/Collapse.tsx index 255d4d99..2328cb17 100644 --- a/src/components-pro/RCollapse/Collapse.tsx +++ b/src/components/pro/RCollapse/Collapse.tsx @@ -1,6 +1,7 @@ import { RCollapseGrid, RForm } from '@/components' -import { collapseGridProps, formProps } from '@/components' +import formProps from '../../base/RForm/src/props' +import collapseGridProps from '../../base/RCollapseGrid/src/props' import type { FormProps, GridProps } from 'naive-ui' diff --git a/src/components-pro/RTablePro/index.ts b/src/components/pro/RTablePro/index.ts similarity index 100% rename from src/components-pro/RTablePro/index.ts rename to src/components/pro/RTablePro/index.ts diff --git a/src/components-pro/RTablePro/src/TablePro.tsx b/src/components/pro/RTablePro/src/TablePro.tsx similarity index 100% rename from src/components-pro/RTablePro/src/TablePro.tsx rename to src/components/pro/RTablePro/src/TablePro.tsx diff --git a/src/components-pro/RTablePro/src/hooks/useTablePro.ts b/src/components/pro/RTablePro/src/hooks/useTablePro.ts similarity index 99% rename from src/components-pro/RTablePro/src/hooks/useTablePro.ts rename to src/components/pro/RTablePro/src/hooks/useTablePro.ts index a75e4cae..7113fc2a 100644 --- a/src/components-pro/RTablePro/src/hooks/useTablePro.ts +++ b/src/components/pro/RTablePro/src/hooks/useTablePro.ts @@ -7,7 +7,7 @@ import type { ScrollToOptions, ColumnKey, SortOrder, -} from '@/components/RTable/src/types' +} from '@/components/base/RTable/src/types' import type { PrintDomOptions } from '@/utils' /** diff --git a/src/components-pro/RTablePro/src/props.ts b/src/components/pro/RTablePro/src/props.ts similarity index 100% rename from src/components-pro/RTablePro/src/props.ts rename to src/components/pro/RTablePro/src/props.ts diff --git a/src/components-pro/RTablePro/src/types.ts b/src/components/pro/RTablePro/src/types.ts similarity index 100% rename from src/components-pro/RTablePro/src/types.ts rename to src/components/pro/RTablePro/src/types.ts diff --git a/src/icons/action/close_other.svg b/src/icons/action/close_other.svg new file mode 100644 index 00000000..bb1ca5c1 --- /dev/null +++ b/src/icons/action/close_other.svg @@ -0,0 +1,12 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/icons/action/fullscreen_fold.svg b/src/icons/action/fullscreen_fold.svg index cc57c57e..e3e7c8a5 100644 --- a/src/icons/action/fullscreen_fold.svg +++ b/src/icons/action/fullscreen_fold.svg @@ -1,5 +1,9 @@ -

{sideBarLogo.title} -

+ ) : null }, diff --git a/src/layout/components/Menu/index.tsx b/src/layout/components/Menu/index.tsx index 650a792f..71186448 100644 --- a/src/layout/components/Menu/index.tsx +++ b/src/layout/components/Menu/index.tsx @@ -90,7 +90,9 @@ export default defineComponent({ updateMenuState('collapsed', true) }} > - + {getMenuConfig.value.menuSiderBarLogo ? ( + + ) : null} ) diff --git a/src/layout/components/MenuTag/index.scss b/src/layout/components/MenuTag/index.scss index f8d4829a..f9421470 100644 --- a/src/layout/components/MenuTag/index.scss +++ b/src/layout/components/MenuTag/index.scss @@ -2,14 +2,13 @@ $space: calc($layoutRouterViewContainer / 2); $menuTagWrapperWidth: 76px; .menu-tag { - height: $layoutMenuHeight; display: flex; align-items: center; padding: 6px 0; & .menu-tag-space { width: calc(100% - $space * 2); - padding: $space; + padding: 0px 18px; & .menu-tag-wrapper { width: calc(100% - $space * 2 - $menuTagWrapperWidth); @@ -18,17 +17,6 @@ $menuTagWrapperWidth: 76px; & .ray-icon { cursor: pointer; } - - & .menu-tag__right-wrapper { - & .menu-tag__right-arrow { - transform: rotate(180deg); - } - - & .menu-tag__right-setting { - width: 28px; - height: 20px; - } - } } & .n-tag { @@ -39,8 +27,6 @@ $menuTagWrapperWidth: 76px; // 激活标签页关闭按钮样式 .menu-tag { .menu-tag__btn { - padding: 7px 10px; - .menu-tag__btn-icon--hidden { display: none !important; } @@ -82,8 +68,8 @@ $menuTagWrapperWidth: 76px; // 设置 dropdown animate svg 尺寸 .menu-tag__dropdown { & .menu-tag__icon { - width: 18px; - height: 18px; + width: 16px; + height: 16px; } } @@ -98,3 +84,7 @@ $menuTagWrapperWidth: 76px; .ray-template--dark .menu-tag { box-shadow: 0 2px 2px $layoutShadowColorDark; } + +.override-button__menu-tag { + padding: 0 6px; +} diff --git a/src/layout/components/MenuTag/index.tsx b/src/layout/components/MenuTag/index.tsx index ff1bbfeb..8e2ea794 100644 --- a/src/layout/components/MenuTag/index.tsx +++ b/src/layout/components/MenuTag/index.tsx @@ -16,7 +16,7 @@ * 该模板中引入了 Root Path 概念，在 MenuTag 中除了关闭左右侧标签操作能主动移除 Root Tag 之外其余的操作都不允许。 * * outsideClick 方法优先级不如 contextmenu 事件高，所以可能会出现重复右键菜单时，闪烁问题； - * 虽然使用 throttle 方法进行优化，但是该问题本质并没有解决。 + * 虽然使用 throttle 方法进行优化，但是该问题本质并没有解决（v5.0.1 版本修复了该问题）。 */ import './index.scss' @@ -31,9 +31,6 @@ import { } from 'naive-ui' import { RIcon, RMoreDropdown } from '@/components' -import CloseRight from '@/icons/directional/close_right.svg?component' -import CloseLeft from '@/icons/directional/close_left.svg?component' - import { useMenuGetters, useMenuActions } from '@/store' import { hasClass, uuid, queryElements } from '@/utils' import { useMaximize, useSpinning, useAppRoot, useSiderBar } from '@/hooks' @@ -51,7 +48,7 @@ export default defineComponent({ const { getMenuKey, getMenuTagOptions } = useMenuGetters() const { changeMenuModelValue } = useMenuActions() const { getRootPath } = useAppRoot() - const { maximize, isLayoutContentMaximized } = useMaximize() + const { maximize } = useMaximize() const { reload } = useSpinning() const { close, @@ -78,14 +75,24 @@ export default defineComponent({ // 下拉菜单 const moreOptions = ref([ { - label: '刷新页面', + label: '关闭当前页面', + key: 'closeCurrentPage', + icon: () => , + }, + { + label: '最大化当前页面', + key: 'maximizeLayoutContent', + icon: () => , + }, + { + label: '刷新当前页面', key: 'reloadCurrentPage', icon: () => , }, { - label: '关闭当前页面', - key: 'closeCurrentPage', - icon: () => , + label: '新窗口打开', + key: 'windowOpenTab', + icon: () => , }, { type: 'divider', @@ -94,12 +101,12 @@ export default defineComponent({ { label: '关闭左侧标签页', key: 'closeLeft', - icon: () => , + icon: () => , }, { label: '关闭右侧标签页', key: 'closeRight', - icon: () => , + icon: () => , }, { type: 'divider', @@ -108,7 +115,7 @@ export default defineComponent({ { label: '关闭其他标签页', key: 'closeOther', - icon: () => , + icon: () => , }, { label: '关闭所有标签页', @@ -138,6 +145,26 @@ export default defineComponent({ closeOther: () => { $closeOther(currentContextmenuIndex) }, + windowOpenTab: () => { + const option = getMenuTagOptions.value[currentContextmenuIndex] + + if (!option?.fullPath) { + return + } + + // 兼容配置 hash 前缀的情况 + const path = option.fullPath.startsWith('#') + ? option.fullPath + : `#${option.fullPath}` + + window.open(path, '_blank') + }, + maximizeLayoutContent: () => { + const option = getMenuTagOptions.value[currentContextmenuIndex] + + maximize(true) + option && menuTagClick(option) + }, } // 右键菜单 const actionState = reactive({ @@ -229,8 +256,8 @@ export default defineComponent({ const menuTagContextMenu = (idx: number, e: MouseEvent) => { e.preventDefault() - actionState.actionDropdownShow = false currentContextmenuIndex = idx + actionState.actionDropdownShow = false nextTick(() => { actionState.actionDropdownShow = true @@ -368,7 +395,7 @@ export default defineComponent({ } }) - expose({}) + expose() return { getMenuTagOptions, @@ -386,10 +413,7 @@ export default defineComponent({ menuTagMouseenter, menuTagMouseleave, MENU_TAG_DATA, - iconConfig: { - width: 22, - height: 22, - }, + iconConfig, maximize, reload, globalMainLayoutLoad, @@ -430,9 +454,6 @@ export default defineComponent({ trigger="manual" placement="bottom-start" onSelect={actionDropdownSelect.bind(this)} - onClickoutside={() => { - this.actionState.actionDropdownShow = false - }} /> - + > + {{ + icon: () => ( + + ), + }} + { + this.actionState.actionDropdownShow = false + }, [MENU_TAG_DATA]: curr.fullPath, }} size="small" @@ -514,55 +547,89 @@ export default defineComponent({ ))} - - + - + {{ + icon: () => ( + + ), + }} + + - + {{ + icon: () => ( + + ), + }} + + { reload() }} - /> + > + {{ + icon: () => ( + + ), + }} + - + > + {{ + icon: () => ( + + ), + }} + diff --git a/src/layout/components/Search/GlobalSearchButton/index.tsx b/src/layout/components/Search/GlobalSearchButton/index.tsx index 65a9cad2..88d2b86e 100644 --- a/src/layout/components/Search/GlobalSearchButton/index.tsx +++ b/src/layout/components/Search/GlobalSearchButton/index.tsx @@ -49,9 +49,11 @@ export default defineComponent({ return ( {{ icon: () => , diff --git a/src/layout/components/SiderBar/components/SettingDrawer/constant.ts b/src/layout/components/SiderBar/components/SettingDrawer/constant.ts index 4241a5c8..37acf693 100644 --- a/src/layout/components/SiderBar/components/SettingDrawer/constant.ts +++ b/src/layout/components/SiderBar/components/SettingDrawer/constant.ts @@ -10,9 +10,11 @@ export const defaultSettingConfig: Partial = { menuConfig: { collapsedWidth: 64, collapsedMode: 'width', - collapsedIconSize: 22, + collapsedIconSize: 16, collapsedIndent: 24, accordion: false, + menuSiderBarLogo: true, + iconSize: 16, }, menuTagSwitch: true, breadcrumbSwitch: true, diff --git a/src/layout/components/SiderBar/components/SettingDrawer/index.tsx b/src/layout/components/SiderBar/components/SettingDrawer/index.tsx index 6a4221ba..67cad50d 100644 --- a/src/layout/components/SiderBar/components/SettingDrawer/index.tsx +++ b/src/layout/components/SiderBar/components/SettingDrawer/index.tsx @@ -159,6 +159,18 @@ export default defineComponent({ /> 系统设置 + + + updateSettingState('menuConfig', { + menuSiderBarLogo: bool, + }) + } + /> + - + @@ -221,7 +233,7 @@ export default defineComponent({ v-model:value={ this.modelReactive.getMenuConfig.collapsedIndent } - min={24} + min={0} precision={0} onUpdateValue={(value) => { if (value !== null) { @@ -232,12 +244,26 @@ export default defineComponent({ }} /> + + { + if (value !== null) { + updateSettingState('menuConfig', { + iconSize: value, + }) + } + }} + /> + { if (value !== null) { @@ -253,7 +279,7 @@ export default defineComponent({ v-model:value={ this.modelReactive.getMenuConfig.collapsedWidth } - min={64} + min={0} precision={0} onUpdateValue={(value) => { if (value !== null) { diff --git a/src/layout/components/SiderBar/index.tsx b/src/layout/components/SiderBar/index.tsx index a8e7ef1a..fbc173d8 100644 --- a/src/layout/components/SiderBar/index.tsx +++ b/src/layout/components/SiderBar/index.tsx @@ -151,7 +151,7 @@ export default defineComponent({ ))} {getBreadcrumbSwitch ? : null} - + {isRenderVNode( { @@ -168,8 +168,9 @@ export default defineComponent({ size="medium" key={curr.name} onClick={toolIconClick.bind(this, curr.name)} + focusable={false} > - + ))} updateLocale(String(key))} trigger="click" > - + diff --git a/src/store/modules/menu/utils.ts b/src/store/modules/menu/utils.ts index ae3b4fe0..06e15668 100644 --- a/src/store/modules/menu/utils.ts +++ b/src/store/modules/menu/utils.ts @@ -7,6 +7,7 @@ import { getStorage, isValueType } from '@/utils' import { useAppRoot, useI18n } from '@/hooks' import { NTag } from 'naive-ui' import { piniaSettingStore } from '../setting' +import { piniaMenuStore } from '.' import type { AppMenuOption, AppMenuKey } from '@/types/modules/app' import type { TagProps } from 'naive-ui' @@ -144,11 +145,12 @@ export const createMenuIcon = (option: AppMenuOption) => { } const { menuConfig } = piniaSettingStore() + const { collapsed } = piniaMenuStore() const _icon = h( RIcon, { name: icon, - size: menuConfig.collapsedIconSize, + size: collapsed ? menuConfig.collapsedIconSize : menuConfig.iconSize, cursor: 'pointer', }, {}, diff --git a/src/store/modules/setting/index.ts b/src/store/modules/setting/index.ts index 96180e82..7cc3f8a2 100644 --- a/src/store/modules/setting/index.ts +++ b/src/store/modules/setting/index.ts @@ -77,9 +77,11 @@ export const piniaSettingStore = defineStore( menuConfig: { collapsedWidth: 64, collapsedMode: 'width', - collapsedIconSize: 22, + collapsedIconSize: 16, collapsedIndent: 24, accordion: false, + menuSiderBarLogo: true, + iconSize: 16, }, }) diff --git a/src/types/modules/app-config.ts b/src/types/modules/app-config.ts index 934336fc..fc35f67a 100644 --- a/src/types/modules/app-config.ts +++ b/src/types/modules/app-config.ts @@ -8,6 +8,8 @@ export interface AppMenuConfig { collapsedIconSize: number collapsedIndent: number accordion: boolean + menuSiderBarLogo: boolean + iconSize: number } export interface AppKeepAlive { diff --git a/src/utils/update-object-value.ts b/src/utils/update-object-value.ts index 3a4e495f..acb0dff0 100644 --- a/src/utils/update-object-value.ts +++ b/src/utils/update-object-value.ts @@ -14,9 +14,10 @@ import type { Recordable, AnyFC } from '@/types' * * @example * const obj = { a: 1, b: 2, c: { d: 3 } } - * updateObjectValue(obj, 'a', 2) - * updateObjectValue(obj, 'b', 3) - * updateObjectValue(obj, 'c', { d: 4 }) + * updateObjectValue(obj, 'a', 2) // success + * updateObjectValue(obj, 'b', 3) // success + * updateObjectValue(obj, 'c', { d: 4 }) // success + * updateObjectValue(obj, 'd', 5) // reject */ export const updateObjectValue = < Target extends Recordable, diff --git a/src/views/demo/TablePro.tsx b/src/views/demo/TablePro.tsx index aaccd5d9..d54bf5ee 100644 --- a/src/views/demo/TablePro.tsx +++ b/src/views/demo/TablePro.tsx @@ -1,4 +1,4 @@ -import { RTablePro, RCollapse } from '@/components-pro' +import { RTablePro, RCollapse } from '@/components' import { NFlex, NTag, @@ -19,7 +19,7 @@ import { uuid } from '@/utils' import { useHookPlusRequest } from '@/axios' import Mock from 'mockjs' import dayjs from 'dayjs' -import { useTablePro } from '@/components-pro' +import { useTablePro } from '@/components' import { useCheckedRowKeys } from '@/components' import { useDayjs } from '@/hooks' diff --git a/src/views/demo/mock-demo/index.tsx b/src/views/demo/mock-demo/index.tsx index 1ef574e4..6345d6d4 100644 --- a/src/views/demo/mock-demo/index.tsx +++ b/src/views/demo/mock-demo/index.tsx @@ -1,6 +1,6 @@ import { NFlex, NCard, NButton, NFormItemGi, NInput, NForm } from 'naive-ui' import { RTable } from '@/components' -import { RCollapse } from '@/components-pro' +import { RCollapse } from '@/components' import { useHookPlusRequest } from '@/axios' import { getPersonList } from '@/api/demo/mock/person' diff --git a/src/views/demo/table/index.tsx b/src/views/demo/table/index.tsx index bbb9b8e1..33375136 100644 --- a/src/views/demo/table/index.tsx +++ b/src/views/demo/table/index.tsx @@ -12,7 +12,7 @@ import { NAlert, } from 'naive-ui' import { RTable, RIcon, RMoreDropdown } from '@/components' -import { RCollapse } from '@/components-pro' +import { RCollapse } from '@/components' import { uuid } from '@/utils' import { useTable, useCheckedRowKeys } from '@/components' diff --git a/unplugin/components.d.ts b/unplugin/components.d.ts index 9fa43e4f..bd553145 100644 --- a/unplugin/components.d.ts +++ b/unplugin/components.d.ts @@ -9,6 +9,6 @@ declare module 'vue' { export interface GlobalComponents { RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] - Src: typeof import('./../src/components/RTransitionComponent/src/index.vue')['default'] + Src: typeof import('./../src/components/base/RTransitionComponent/src/index.vue')['default'] } } diff --git a/vite-helper/svg-icon-resolve.ts b/vite-helper/svg-icon-resolve.ts index 3f1add65..b28ff9ae 100644 --- a/vite-helper/svg-icon-resolve.ts +++ b/vite-helper/svg-icon-resolve.ts @@ -28,7 +28,5 @@ export const svgIconResolve = (directory = 'src/icons') => { } } - console.log(folders) - return folders }