feat: 表单库卡片改横版统一尺寸 + 日程页小月历背景融入与休息日区分

- 表单库:卡片网格改为固定 3 列等宽,aspectRatio 恢复 4/3 横版,缩略图字段数同步调回 2
- 日程页:小月历背景透明融入左侧容器,周六/周日表头与单元格红字、浅灰底区分休息日(选中保持蓝底白字)
This commit is contained in:
2026-08-20 21:43:48 +08:00
parent dddfa0f580
commit 62776aa33b
2 changed files with 853 additions and 300 deletions
+823 -298
View File
File diff suppressed because it is too large Load Diff
+30 -2
View File
@@ -359,8 +359,8 @@ export default function SchedulePage() {
<span style={{ fontWeight: 600 }}></span>
</div>
{/* 小型月历 */}
<div style={{ padding: '8px 8px 4px' }}>
{/* 小型月历:背景融入容器,休息日(周六/周日)与工作日区分 */}
<div className="schedule-mini-calendar" style={{ padding: '8px 8px 4px' }}>
<Calendar
fullscreen={false}
value={selectedDate}
@@ -405,6 +405,34 @@ export default function SchedulePage() {
</div>
)}
/>
<style>{`
/* 背景融入左侧容器(#f7f7f7 */
.schedule-mini-calendar .ant-picker-calendar,
.schedule-mini-calendar .ant-picker-panel {
background: transparent;
}
/* 表头休息日列(日/六)红色 */
.schedule-mini-calendar .ant-picker-content th:first-child,
.schedule-mini-calendar .ant-picker-content th:last-child {
color: #ff4d4f;
}
/* 休息日(周六/周日)浅灰底 + 红色日期,与工作日区分 */
.schedule-mini-calendar .ant-picker-content .ant-picker-cell:nth-child(7n+1):not(.ant-picker-cell-selected) .ant-picker-calendar-date,
.schedule-mini-calendar .ant-picker-content .ant-picker-cell:nth-child(7n+7):not(.ant-picker-cell-selected) .ant-picker-calendar-date {
background: #f0f0f0;
}
.schedule-mini-calendar .ant-picker-content .ant-picker-cell:nth-child(7n+1):not(.ant-picker-cell-selected) .ant-picker-calendar-date-value,
.schedule-mini-calendar .ant-picker-content .ant-picker-cell:nth-child(7n+7):not(.ant-picker-cell-selected) .ant-picker-calendar-date-value {
color: #ff4d4f;
}
/* 选中单元格保持高亮,不受休息日底色影响 */
.schedule-mini-calendar .ant-picker-content .ant-picker-cell-selected .ant-picker-calendar-date {
background: #1677ff;
}
.schedule-mini-calendar .ant-picker-content .ant-picker-cell-selected .ant-picker-calendar-date-value {
color: #fff;
}
`}</style>
{/* 图例 */}
<div
style={{