feat ui设计稿

This commit is contained in:
Ironsp
2026-09-30 15:55:36 +08:00
parent ce8210fb3f
commit 9ab6253c81
102 changed files with 4855 additions and 2359 deletions

View File

@@ -118,31 +118,33 @@ const STATUS_VARIANTS: Record<BillStatus, 'warning' | 'success' | 'info' | 'dang
</template>
<style lang="less" scoped>
// 设计 30:表格贴满白卡(外层 .bills__board 提供卡底),全网格浅灰线 + 浅灰表头
.bill-table {
padding: @spacing-base;
border-radius: @radius-lg;
background: @white;
box-shadow: @shadow-base;
padding: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
overflow-x: auto;
&__table {
width: 100%;
border-collapse: collapse;
font-size: @font-size-base;
font-size: 11px;
color: @text-color;
th,
td {
padding: @spacing-sm @spacing-sm;
padding: 11px 10px;
text-align: left;
white-space: nowrap;
border-bottom: 1px solid @border-color;
border: 1px solid @project-divider;
}
th {
background: @bg-color-light;
color: @text-color-secondary;
font-weight: 500;
background: @finance-table-head-bg;
color: @text-color;
font-weight: 600;
text-align: center;
}
tbody tr:hover {
@@ -150,28 +152,54 @@ const STATUS_VARIANTS: Record<BillStatus, 'warning' | 'success' | 'info' | 'dang
}
}
&__check {
width: 40px;
// 列对齐按设计 30:序号/账单号/流水号/金额/状态/操作居中,名称类左对齐
&__table th:nth-child(1),
&__table th:nth-child(2),
&__table td:nth-child(1),
&__table td:nth-child(2),
&__table th:nth-child(4),
&__table td:nth-child(4),
&__table th:nth-child(5),
&__table td:nth-child(5),
&__table th:nth-child(7),
&__table td:nth-child(7),
&__table th:nth-child(8),
&__table td:nth-child(8),
&__table th:nth-child(9),
&__table td:nth-child(9) {
text-align: center;
}
&__check {
width: 44px;
text-align: center;
input {
width: 14px;
height: 14px;
accent-color: @primary-strong;
vertical-align: middle;
}
}
// 金额列与正文同色(设计 30 实取 #4B5563 常规字重)
&__amount {
color: @heading-color;
font-weight: 600;
color: @text-color;
font-weight: 400;
}
&__ops {
.flex(row, flex-start);
gap: @spacing-sm;
.flex(row, center, center);
gap: 12px;
}
&__link {
color: @primary-color;
font-size: @font-size-base;
color: @primary-strong;
font-size: 11px;
transition: color 0.2s;
&:hover {
color: @primary-hover;
color: @primary-color;
}
}
@@ -179,5 +207,14 @@ const STATUS_VARIANTS: Record<BillStatus, 'warning' | 'success' | 'info' | 'dang
text-align: center;
padding: @spacing-xl 0;
}
// 状态列按设计 30 为纯文字(去底色徽标)
:deep(.status-tag) {
padding: 0;
background: transparent;
color: @text-color;
font-size: 11px;
line-height: 1.5;
}
}
</style>