fix(状态徽标): 正常/禁用改主题色描边徽标(对齐「当前生效」样式)
build / build (push) Successful in 1m51s

view-ui-plus Tag 预设色的 border prop 渲染仍实心(无效),改全局描边类 .tag-outline(var(--brand) 文字+边框白底,随档变化)+ .tag-outline-muted 中性灰态;转出角标不变
This commit is contained in:
chenxing
2026-10-11 11:07:02 +08:00
parent d034320406
commit d48153ced9
2 changed files with 18 additions and 5 deletions
+13
View File
@@ -162,3 +162,16 @@ h4.subtitle {
.base-wrap-main .tree-wrapper .tree-container {
width: 300px;
}
/* 描边徽标(对齐 UserHome「当前生效」样式):view-ui-plus 预设色 Tag 的 border prop
渲染仍是实心块(无效 prop),改自定义类挂主题令牌——主态=brand 描边,muted=中性灰描边 */
.tag-outline {
color: var(--brand) !important;
border: 1px solid var(--brand) !important;
background: #fff !important;
}
.tag-outline.tag-outline-muted {
color: #999 !important;
border: 1px solid #dcdee2 !important;
}
+5 -5
View File
@@ -164,16 +164,16 @@ const columns = [
title: '状态', key: 'disabled', width: 130, align: 'center',
render: (h: any, { row }: any) => {
// Vue3 渲染函数须 import 真组件:h('Tag') 会建未知原生元素(无样式不渲染)
// border 描边徽标(对齐 UserHome「当前生效」样式),非实心块
if (row.disabled) return h(Tag, { color: 'default', border: true }, () => '禁用');
// 描边徽标挂主题令牌(.tag-outline,见 main.scss):预设色 border prop 渲染仍实心,弃用
if (row.disabled) return h(Tag, { class: 'tag-outline tag-outline-muted' }, () => '禁用');
if (row.groupStatus === 1) {
// 正常 Tag + 转出徽标(view-ui-plus Badge status 模式:圆点 + 文本)
// 正常徽标 + 转出角标(view-ui-plus Badge status 模式:圆点 + 文本)
return h('div', { style: 'display:inline-flex;align-items:center;gap:6px' }, [
h(Tag, { color: 'success', border: true }, () => '正常'),
h(Tag, { class: 'tag-outline' }, () => '正常'),
h(Badge, { status: 'warning', text: '转出' }),
]);
}
return h(Tag, { color: 'success', border: true }, () => '正常');
return h(Tag, { class: 'tag-outline' }, () => '正常');
},
},
{