YG-Soft/X-Financial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(web): 移除顶栏 AI 快捷操作区并优化差旅领导意见事件样式

Browse Source 
- TopBar 移除 AI 模式下的公司切换/AI 模式切换快捷操作块及 showAiModeUtilityActions 计算属性，清理 top-bar.css 对应样式
- TravelRequestDetailView 领导意见事件重构为状态/意见/审批人结构化布局，travel-request-detail-view.css 补充对应样式
- 同步更新 topbar-ai-mode-switch、ai-sidebar-rail-mode、travel-request-detail-leader-approval 测试
This commit is contained in:
caoxiaozhu
2026-06-21 22:56:34 +08:00
parent 24b5b71b0f
commit 1986b0d945
7 changed files with 129 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
web/src/assets/styles/components/top-bar.css
View File

@@ -380,14 +380,6 @@
min-width: 0;
}
.topbar-utility-actions {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 10px;
min-width: 0;
}
.topbar-icon-btn {
position: relative;
width: 34px;
@@ -1329,10 +1321,6 @@
gap: 12px;
}
.topbar-utility-actions {
gap: 8px;
}
.topbar-icon-btn {
width: 30px;
height: 30px;
@@ -1413,7 +1401,6 @@
.search-wrap,
.search-wrap.wide,
.topbar-toolset,
.topbar-utility-actions,
.detail-alert-strip,
.month-chip,
.qa-filter,
@@ -1429,10 +1416,6 @@
justify-content: flex-end;
}
.topbar-utility-actions {
justify-content: flex-end;
}
.topbar-ai-mode-toggle {
width: 34px;
height: 34px;

114
web/src/assets/styles/views/travel-request-detail-view.css
View File

@@ -717,8 +717,12 @@
.application-leader-opinion {
display: grid;
gap: 10px;
margin-top: 12px;
gap: 12px;
margin-top: 14px;
padding: 14px;
border: 1px solid rgba(var(--theme-primary-rgb, 58, 124, 165), .16);
background: linear-gradient(180deg, rgba(248, 251, 255, .98) 0%, #ffffff 100%);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86);
}
.application-leader-opinion-head {
@@ -726,7 +730,9 @@
align-items: center;
justify-content: space-between;
gap: 12px;
color: #475569;
padding-bottom: 10px;
border-bottom: 1px solid #e2e8f0;
color: #334155;
font-size: 14px;
line-height: 1.5;
}
@@ -741,15 +747,26 @@
}
.application-leader-opinion-head span i {
margin-top: 1px;
color: #334155;
width: 28px;
height: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--theme-primary-active, #255b7d);
border: 1px solid rgba(var(--theme-primary-rgb, 58, 124, 165), .22);
border-radius: 999px;
background: rgba(var(--theme-primary-rgb, 58, 124, 165), .08);
font-size: 18px;
}
.application-leader-opinion-head strong {
padding: 4px 10px;
border: 1px solid rgba(var(--theme-primary-rgb, 58, 124, 165), .18);
border-radius: 999px;
background: rgba(var(--theme-primary-rgb, 58, 124, 165), .08);
color: var(--theme-primary-active);
font-weight: 800;
font-size: 14px;
font-size: 13px;
}
.application-leader-opinion-timeline {
@@ -779,13 +796,19 @@
}
.application-leader-opinion-event {
--leader-opinion-tone: var(--theme-primary, #3a7ca5);
--leader-opinion-soft-bg: #f8fbff;
--leader-opinion-soft-border: #dbeafe;
position: relative;
display: grid;
gap: 8px;
padding: 12px 14px;
gap: 10px;
padding: 14px 16px 14px 18px;
border: 1px solid #dbe4ee;
border-left: 4px solid var(--leader-opinion-tone);
border-radius: 4px;
background: #ffffff;
background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
overflow: hidden;
}
.application-leader-opinion-event::before {
@@ -801,11 +824,23 @@
box-shadow: 0 0 0 1px rgba(var(--theme-primary-rgb, 58, 124, 165), .34);
}
.application-leader-opinion-event.danger {
--leader-opinion-tone: #dc2626;
--leader-opinion-soft-bg: #fff7f7;
--leader-opinion-soft-border: #fecaca;
}
.application-leader-opinion-event.danger::before {
background: #dc2626;
box-shadow: 0 0 0 1px rgba(220, 38, 38, .32);
}
.application-leader-opinion-event.success {
--leader-opinion-tone: #16a34a;
--leader-opinion-soft-bg: #f0fdf4;
--leader-opinion-soft-border: #bbf7d0;
}
.application-leader-opinion-event.success::before {
background: #16a34a;
box-shadow: 0 0 0 1px rgba(22, 163, 74, .32);
@@ -827,8 +862,17 @@
font-weight: 850;
}
.application-leader-opinion-event-status {
min-height: 30px;
padding: 4px 10px;
border: 1px solid var(--leader-opinion-soft-border);
border-radius: 999px;
background: var(--leader-opinion-soft-bg);
color: var(--leader-opinion-tone);
}
.application-leader-opinion-event-head i {
color: var(--theme-primary-active, #255b7d);
color: currentColor;
font-size: 16px;
}
@@ -847,10 +891,36 @@
font-weight: 720;
}
.application-leader-opinion-event p {
.application-leader-opinion-event-head time {
padding: 4px 9px;
border: 1px solid #e2e8f0;
border-radius: 999px;
background: #ffffff;
color: #475569;
white-space: nowrap;
}
.application-leader-opinion-event-body {
display: grid;
gap: 5px;
padding: 10px 12px;
border: 1px solid var(--leader-opinion-soft-border);
border-radius: 4px;
background: var(--leader-opinion-soft-bg);
}
.application-leader-opinion-event-body span {
color: #64748b;
font-size: 12px;
font-weight: 850;
line-height: 1.4;
}
.application-leader-opinion-event-body p {
margin: 0;
color: #334155;
font-size: 13px;
color: #0f172a;
font-size: 15px;
font-weight: 850;
line-height: 1.65;
}
@@ -860,6 +930,23 @@
gap: 8px;
}
.application-leader-opinion-event-foot span {
min-height: 26px;
display: inline-flex;
align-items: center;
gap: 5px;
padding: 3px 9px;
border: 1px solid #e2e8f0;
border-radius: 999px;
background: #ffffff;
color: #475569;
}
.application-leader-opinion-event-foot i {
color: var(--leader-opinion-tone);
font-size: 14px;
}
.detail-expense-table {
--expense-editor-control-height: 34px;
--expense-editor-control-line-height: 16px;
@@ -2361,4 +2448,3 @@
border-left: 0;
}
}