diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d937aa4..7d9c0fb 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,12 +20,12 @@ importers: china-area-data: specifier: ^5.0.1 version: 5.0.1 - cropperjs: - specifier: ^1.6.2 - version: 1.6.2 dayjs: specifier: ^1.11.21 version: 1.11.21 + echarts: + specifier: ^5.6.0 + version: 5.6.0 express: specifier: ^5.2.1 version: 5.2.1 @@ -1150,6 +1150,9 @@ packages: resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==} engines: {node: '>= 0.4'} + echarts@5.6.0: + resolution: {integrity: sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==} + ee-first@1.1.1: resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==} @@ -2096,6 +2099,9 @@ packages: peerDependencies: typescript: '>=4.2.0' + tslib@2.3.0: + resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==} + type-check@0.4.0: resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==} engines: {node: '>= 0.8.0'} @@ -2258,6 +2264,9 @@ packages: resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==} engines: {node: '>=10'} + zrender@5.6.1: + resolution: {integrity: sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==} + snapshots: '@ant-design/colors@6.0.0': @@ -3330,6 +3339,11 @@ snapshots: es-errors: 1.3.0 gopd: 1.2.0 + echarts@5.6.0: + dependencies: + tslib: 2.3.0 + zrender: 5.6.1 + ee-first@1.1.1: {} electron-to-chromium@1.5.395: {} @@ -4325,6 +4339,8 @@ snapshots: dependencies: typescript: 5.9.3 + tslib@2.3.0: {} + type-check@0.4.0: dependencies: prelude-ls: 1.2.1 @@ -4459,3 +4475,7 @@ snapshots: yargs-parser: 21.1.1 yocto-queue@0.1.0: {} + + zrender@5.6.1: + dependencies: + tslib: 2.3.0 diff --git a/src/components/pageTabs/PageTabs.module.less b/src/components/pageTabs/PageTabs.module.less index fe8a93d..f2b13b3 100644 --- a/src/components/pageTabs/PageTabs.module.less +++ b/src/components/pageTabs/PageTabs.module.less @@ -19,7 +19,11 @@ height: 100%; user-select: none; transition: all 0.15s ease; - padding: 0 8px 0 14px; + border-radius: 5px; + + &:not(:first-child) { + margin-left: -9px; + } &:global(:not(.dragging)) { cursor: pointer; @@ -123,16 +127,19 @@ } .tabClose { - flex-shrink: 0; + position: absolute; + right: 12px; + top: 50%; + z-index: 2; width: 16px; height: 16px; line-height: 16px; font-size: 10px; text-align: center; - margin-right: 12px; color: rgba(0, 0, 0, 0.45); border-radius: 50%; cursor: pointer; + transform: translateY(-50%); transition: all 0.15s; &:hover { @@ -152,9 +159,8 @@ .tabTitle { position: relative; z-index: 2; - flex: 1; min-width: 0; - padding: 2px 8px; + padding: 2px 32px 2px 18px; font-size: 13px; color: rgba(0, 0, 0, 0.65); white-space: nowrap; diff --git a/src/components/pageTabs/PageTabs.tsx b/src/components/pageTabs/PageTabs.tsx index fa0d8df..2bffea0 100644 --- a/src/components/pageTabs/PageTabs.tsx +++ b/src/components/pageTabs/PageTabs.tsx @@ -71,15 +71,13 @@ const PageTabs = defineComponent({ -
- {/* 标签文字(flex 子元素,与关闭按钮同行) */} - {tab.title} -
+ {/* 标签文字(flex 子元素,与关闭按钮同行) */} +
{tab.title}
{/* 关闭按钮(flex 子元素,不参与 shrink) */} - handleClose(tab.path, e)}> +
handleClose(tab.path, e)}> ✕ - +
); })}