sz-team/supervision-test-frontend-repo
17
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

!95 style(dq): 优化审批历史界面间距，减少贴边感

Browse Source 
Merge pull request !95 from wsm/fix/modal_fix
This commit is contained in:
wsm
2026-07-14 01:50:24 +00:00
committed by Gitee
parent dca130323c 5e9e35b9f9
commit b1af9cd575
1 changed files with 55 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/super/bpm/process/personalOffice/myHandleTask/content/TaskApprovalHistoryContent.vue
+55 -48
View File
@@ -352,63 +352,70 @@ export default {
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.approval-history-pane { .approval-history-pane {
height: 100%; height: 100%;
padding: 4px 0; // 1. 增加 padding，16px 左右，24px 上下，给四周留出足够的呼吸感
} padding: 16px 24px;
box-sizing: border-box;
background-color: #fff; // 确保有纯白背景，防止透出底色显得贴边
}
.approval-history-filter { .approval-history-filter {
margin-bottom: 8px; margin-bottom: 16px; // 2. 增加过滤栏和下方表格的间距
padding: 4px 0; padding: 12px 16px;
} background-color: #fafafa; // 3. 给过滤区域加一个浅色微背景框，视觉上更有层次感
border-radius: 4px;
}
.approval-history-filter__dept { .approval-history-filter__main {
display: flex; display: flex;
align-items: center; align-items: flex-start;
gap: 8px; gap: 8px;
margin-top: 10px; }
line-height: 24px;
}
.approval-history-filter__dept-text { .approval-history-filter__label {
color: rgba(0, 0, 0, 0.85); flex: 0 0 auto;
} line-height: 32px;
color: rgba(0, 0, 0, 0.85);
font-weight: 500; // 稍微加粗标签
}
.approval-history-filter__assignee-btn { .approval-history-filter__checkboxes {
margin-left: auto; display: flex;
} flex: 1;
flex-wrap: wrap;
gap: 6px 12px;
min-width: 0;
padding-top: 5px;
.approval-history-filter__main { :deep(.ant-checkbox-wrapper) {
display: flex; margin-left: 0;
align-items: flex-start;
gap: 8px;
} }
}
.approval-history-filter__label { .approval-history-filter__actions {
flex: 0 0 auto; display: flex;
line-height: 32px; flex: 0 0 auto;
color: rgba(0, 0, 0, 0.85); align-items: center;
} line-height: 32px;
}
.approval-history-filter__checkboxes { .approval-history-filter__dept {
display: flex; display: flex;
flex: 1; align-items: center;
flex-wrap: wrap; gap: 8px;
gap: 6px 12px; margin-top: 12px; // 稍微拉开上下两排过滤器的距离
min-width: 0; line-height: 24px;
padding-top: 5px; border-top: 1px dashed #f0f0f0; // 加一条虚线分割，更美观
padding-top: 12px;
}
:deep(.ant-checkbox-wrapper) { .approval-history-filter__dept-text {
margin-left: 0; color: rgba(0, 0, 0, 0.85);
} }
}
.approval-history-filter__actions { .approval-history-filter__assignee-btn {
display: flex; margin-left: auto;
flex: 0 0 auto; }
align-items: center;
line-height: 32px;
}
</style> </style>