fix: 处理报错

This commit is contained in:
ZhuRui
2026-07-27 17:08:21 +08:00
parent b6e91bfbac
commit cc5ca261c6
4 changed files with 18 additions and 19 deletions
+3 -3
View File
@@ -38,7 +38,7 @@
} }
// ── hover 态(非激活) ── // ── hover 态(非激活) ──
&:not(.active) { &:not(.tabItemActive) {
&:hover { &:hover {
// 自身分隔线消失 // 自身分隔线消失
> .divider { > .divider {
@@ -54,7 +54,7 @@
} }
// ── 激活态 ── // ── 激活态 ──
&.active { &.tabItemActive {
z-index: 2; z-index: 2;
// 右侧邻居的分隔线消失 // 右侧邻居的分隔线消失
& + .tabItem { & + .tabItem {
@@ -164,7 +164,7 @@
} }
// hover 只在非激活标签时生效 // hover 只在非激活标签时生效
.tabItem:not(.active) { .tabItem:not(.tabItemActive) {
.tabTitleCon:hover { .tabTitleCon:hover {
background-color: rgba(0, 0, 0, 0.06); background-color: rgba(0, 0, 0, 0.06);
} }
+6 -4
View File
@@ -1,6 +1,6 @@
import { defineComponent, type PropType } from 'vue'; import { defineComponent, type PropType } from 'vue';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import type { TabView } from '@/stores/tabsStore'; import type { TabView } from '@/types';
import styles from './PageTabs.module.less'; import styles from './PageTabs.module.less';
/** /**
@@ -12,7 +12,7 @@ import styles from './PageTabs.module.less';
* - 标签间分隔线 * - 标签间分隔线
* - 关闭按钮 * - 关闭按钮
*/ */
export default defineComponent({ const PageTabs = defineComponent({
name: 'PageTabs', name: 'PageTabs',
props: { props: {
/** 标签列表 */ /** 标签列表 */
@@ -49,7 +49,7 @@ export default defineComponent({
return ( return (
<div <div
key={tab.path} key={tab.path}
class={[styles.tabItem, isActive ? styles.active : '', styles.draggable].join(' ')} class={[styles.tabItem, isActive && styles.tabItemActive].filter(Boolean).join(' ')}
onClick={() => handleClick(tab.path)} onClick={() => handleClick(tab.path)}
> >
{/* 分隔线:第一个标签 / 激活标签 / 上一个就是激活的 → 不显示 */} {/* 分隔线:第一个标签 / 激活标签 / 上一个就是激活的 → 不显示 */}
@@ -59,7 +59,7 @@ export default defineComponent({
/> />
{/* Chrome 风格背景:激活态 */} {/* Chrome 风格背景:激活态 */}
<div class={[styles.tabBg, isActive ? styles.tabBgActive : ''].join(' ')}> <div class={[styles.tabBg, isActive && styles.tabBgActive].filter(Boolean).join(' ')}>
<div class={styles.tabBgInner} /> <div class={styles.tabBgInner} />
{/* 左下曲线 */} {/* 左下曲线 */}
<svg class={styles.tabBgCurveBefore} height="7" width="7"> <svg class={styles.tabBgCurveBefore} height="7" width="7">
@@ -87,3 +87,5 @@ export default defineComponent({
); );
}, },
}); });
export default PageTabs;
+2 -12
View File
@@ -1,18 +1,8 @@
import { reactive, computed, toRefs } from 'vue'; import { reactive, computed, toRefs } from 'vue';
import router from '@/router'; import router from '@/router';
import type { TabView } from '@/types';
/** export type { TabView };
* 单个页面标签的数据结构(标签 = 已经访问过的页面)
*
* path 唯一标识,用于路由激活态判断
* name 路由组件 name,用于 <keep-alive :include="cachedViews">
* title 展示在 tab 上的文字
*/
export interface TabView {
path: string;
name: string;
title: string;
}
interface TabsState { interface TabsState {
/** 已打开的页面标签列表,按访问顺序累加 */ /** 已打开的页面标签列表,按访问顺序累加 */
+7
View File
@@ -23,6 +23,13 @@ export interface SelectOption {
disabled?: boolean; disabled?: boolean;
} }
/** 页面标签栏单个 tab 的数据结构 */
export interface TabView {
path: string;
name: string;
title: string;
}
// ── 菜单 & 权限 ── // ── 菜单 & 权限 ──
/** /**