feat: MeetingDetail 参会人表格移动端适配 (字号 12→11px/padding 紧凑/操作列竖排)
参会人表 27+ 列宽表含大量自定义 template 列 (maskPhone/maskBankCard/ maskIdCard/openPreview 等), 用 GrTable 会丢失自定义渲染. 改为轻量适配: - 表格整体 font 12 → 11px - th/td padding 6/4 → 4/3px - 操作列 row-actions flex row → column (紧凑) - el-tag 字号 12 → 10px, padding/height 缩窄 - 摘要行 el-table__footer 字号 11px - 加 class="attendee-table" 用于 scoped 控制 桌面端无影响 (全部在 @media (max-width: 768px) 内)
This commit is contained in:
@@ -78,7 +78,7 @@
|
||||
让内容超出时容器内出现横向滚动条, 不影响外层 grid 布局.
|
||||
-->
|
||||
<div class="attendee-table-wrap">
|
||||
<el-table :data="attendeeRows" v-loading="attendeeLoading" border size="small" style="width: 100%;" show-summary :summary-method="attendeeSummary" @selection-change="onAttendeeSelectionChange">
|
||||
<el-table :data="attendeeRows" v-loading="attendeeLoading" border size="small" style="width: 100%;" show-summary :summary-method="attendeeSummary" @selection-change="onAttendeeSelectionChange" class="attendee-table">
|
||||
<el-table-column v-if="!isSponsor && !isReadonly" type="selection" width="42" />
|
||||
<el-table-column type="index" label="序号" width="50" align="center" />
|
||||
<el-table-column prop="name" label="医生" min-width="90" />
|
||||
@@ -2169,5 +2169,36 @@ onBeforeUnmount(stopFeePolling)
|
||||
|
||||
/* 表格外层 wrap: 确保手机端表格能横向滚 */
|
||||
.attendee-table-wrap { -webkit-overflow-scrolling: touch; }
|
||||
|
||||
/* 参会人表格 mobile: 字号缩到 11px, padding 紧凑, 行高紧凑 */
|
||||
.attendee-table {
|
||||
font-size: 11px !important;
|
||||
}
|
||||
.attendee-table :deep(.el-table th.el-table__cell),
|
||||
.attendee-table :deep(.el-table td.el-table__cell) {
|
||||
padding: 4px 3px !important;
|
||||
font-size: 11px !important;
|
||||
}
|
||||
.attendee-table :deep(.el-table .row-actions) {
|
||||
flex-direction: column !important;
|
||||
align-items: flex-start !important;
|
||||
gap: 1px !important;
|
||||
}
|
||||
.attendee-table :deep(.el-table .row-actions .el-link) {
|
||||
font-size: 11px !important;
|
||||
padding: 0 2px !important;
|
||||
}
|
||||
/* 标签字号缩窄 */
|
||||
.attendee-table :deep(.el-table .el-tag) {
|
||||
font-size: 10px !important;
|
||||
padding: 0 4px !important;
|
||||
height: 18px !important;
|
||||
line-height: 18px !important;
|
||||
}
|
||||
/* 摘要行 (el-table__footer) 字号缩窄 */
|
||||
.attendee-table :deep(.el-table .el-table__footer-wrapper td) {
|
||||
font-size: 11px !important;
|
||||
padding: 6px 3px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user