Losita/smartmate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Version: 0.8.2.dev.260327

Browse Source 
后端：
1.修复了消息重试链路的相关问题
2.新增redis乐观写消息机制，即使前端在重试完消息后立刻刷新，也能在redis里面读到数据
前端：
1.修了一些bug
This commit is contained in:
LoveLosita
2026-03-27 20:39:05 +08:00
parent ddb0d9cc17
commit 5fc9548420
13 changed files with 1011 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
frontend/src/components/schedule/CreateTaskClassDialog.vue
View File

@@ -197,6 +197,9 @@ function handleSubmit() {
.task-class-dialog__body {
display: grid;
gap: 22px;
min-height: 0;
max-height: min(72vh, 760px);
overflow: hidden;
}
.task-class-dialog__grid {
@@ -230,6 +233,8 @@ function handleSubmit() {
.task-class-dialog__items {
display: grid;
gap: 14px;
min-width: 0;
min-height: 0;
}
.task-class-dialog__items-head {
@@ -237,6 +242,8 @@ function handleSubmit() {
align-items: center;
justify-content: space-between;
gap: 12px;
min-width: 0;
flex-wrap: wrap;
}
.task-class-dialog__add {
@@ -254,6 +261,13 @@ function handleSubmit() {
.task-class-dialog__items-list {
display: grid;
gap: 10px;
min-width: 0;
max-height: min(44vh, 360px);
overflow-y: auto;
overflow-x: hidden;
padding-right: 4px;
scrollbar-gutter: stable;
overscroll-behavior: contain;
}
.task-class-dialog__item {
@@ -261,6 +275,7 @@ function handleSubmit() {
grid-template-columns: 36px minmax(0, 1fr) auto;
gap: 10px;
align-items: center;
min-width: 0;
}
.task-class-dialog__item-order {
@@ -297,9 +312,46 @@ function handleSubmit() {
justify-content: flex-end;
}
@media (max-height: 900px) {
.task-class-dialog__body {
max-height: min(76vh, 680px);
gap: 18px;
}
.task-class-dialog__items-list {
max-height: min(40vh, 300px);
}
}
@media (max-height: 820px) {
.task-class-dialog__items-list {
max-height: min(34vh, 240px);
}
}
@media (max-width: 840px) {
.task-class-dialog__grid {
grid-template-columns: 1fr;
}
.task-class-dialog__item {
grid-template-columns: 32px minmax(0, 1fr);
align-items: start;
}
.task-class-dialog__item-remove {
grid-column: 2;
justify-self: start;
}
}
.task-class-dialog :deep(.el-dialog) {
width: min(720px, calc(100vw - 24px));
max-height: calc(100vh - 24px);
overflow: hidden;
}
.task-class-dialog :deep(.el-dialog__body) {
overflow: hidden;
}
</style>

226
frontend/src/components/schedule/TaskClassSidebar.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { computed } from 'vue'
import { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
import type { TaskClassDetail, TaskClassListItem } from '@/types/schedule'
@@ -21,6 +21,10 @@ const emit = defineEmits<{
}>()
const taskClassCountLabel = computed(() => `共 ${props.taskClasses.length} 个`)
const viewportHeight = ref(typeof window === 'undefined' ? 900 : window.innerHeight)
const taskClassListRef = ref<HTMLElement | null>(null)
const listViewportHeight = ref(0)
let listResizeObserver: ResizeObserver | null = null
function isExpanded(taskClassId: number) {
return props.expandedTaskClassId === taskClassId && !props.taskClassMultiSelectMode
@@ -40,6 +44,76 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
const day = `${date.getDate()}`.padStart(2, '0')
return `${month}.${day} ${value.section_from}-${value.section_to}节`
}
function syncViewportHeight() {
viewportHeight.value = window.innerHeight
}
function syncTaskClassListViewportHeight() {
listViewportHeight.value = taskClassListRef.value?.clientHeight ?? 0
}
function resolveDetailPanelStyle(items: TaskClassDetail['items']) {
const count = items.length
const itemHeight = viewportHeight.value <= 820 ? 54 : viewportHeight.value <= 900 ? 58 : 62
const gap = 6
const panelPadding = 14
const preferredHeight = count * itemHeight + Math.max(0, count - 1) * gap + panelPadding
const maxVisibleItems = viewportHeight.value <= 820 ? 4 : viewportHeight.value <= 900 ? 5 : 6
const maxHeightByItemCount =
maxVisibleItems * itemHeight + Math.max(0, maxVisibleItems - 1) * gap + panelPadding
const maxHeightByContainer = Math.max(
180,
(listViewportHeight.value || Math.round(viewportHeight.value * 0.6)) - 116,
)
const finalHeight = Math.min(preferredHeight, maxHeightByItemCount, maxHeightByContainer)
// 1. 条目少时让卡片自然长高，避免只有两三条时还出现大块留白。
// 2. 条目超过“当前屏幕可安全展示的最大条数”后，立即锁住高度并进入内部滚动。
// 3. 这样像 8 条 task_item 这类中等长度列表会稳定触发滚动，不会再因为估算过大而失效。
return {
height: `${finalHeight}px`,
maxHeight: `${finalHeight}px`,
}
}
onMounted(() => {
window.addEventListener('resize', syncViewportHeight)
window.addEventListener('resize', syncTaskClassListViewportHeight)
syncTaskClassListViewportHeight()
if (typeof ResizeObserver !== 'undefined') {
listResizeObserver = new ResizeObserver(() => {
syncTaskClassListViewportHeight()
})
if (taskClassListRef.value) {
listResizeObserver.observe(taskClassListRef.value)
}
}
})
onBeforeUnmount(() => {
window.removeEventListener('resize', syncViewportHeight)
window.removeEventListener('resize', syncTaskClassListViewportHeight)
listResizeObserver?.disconnect()
listResizeObserver = null
})
watch(
() => props.expandedTaskClassId,
async (expandedId) => {
await nextTick()
syncTaskClassListViewportHeight()
if (!expandedId || !taskClassListRef.value) {
return
}
const expandedCard = taskClassListRef.value.querySelector<HTMLElement>('.task-class-card--expanded')
expandedCard?.scrollIntoView({
block: 'nearest',
inline: 'nearest',
})
},
)
</script>
<template>
@@ -68,7 +142,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
<div v-for="index in 4" :key="index" class="task-class-sidebar__skeleton-item" />
</div>
<div v-else class="task-class-sidebar__list">
<div v-else ref="taskClassListRef" class="task-class-sidebar__list">
<article
v-for="taskClass in taskClasses"
:key="taskClass.id"
@@ -98,7 +172,11 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
</span>
</button>
<div v-if="isExpanded(taskClass.id)" class="task-class-card__detail">
<div
v-if="isExpanded(taskClass.id)"
class="task-class-card__detail"
:style="expandedTaskClassDetail ? resolveDetailPanelStyle(expandedTaskClassDetail.items) : undefined"
>
<div v-if="detailLoading" class="task-class-card__detail-loading">正在载入任务块…</div>
<div v-else-if="expandedTaskClassDetail" class="task-class-card__detail-list">
@@ -146,6 +224,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
grid-template-rows: auto minmax(0, 1fr);
border-right: 1px solid rgba(196, 209, 227, 0.55);
background: linear-gradient(180deg, rgba(251, 253, 255, 0.96), rgba(247, 250, 254, 0.98));
overflow: hidden;
}
.task-class-sidebar__header {
@@ -153,6 +232,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
border-bottom: 1px solid rgba(214, 223, 238, 0.68);
display: grid;
gap: 12px;
min-width: 0;
}
.task-class-sidebar__title-row {
@@ -160,6 +240,8 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
align-items: center;
justify-content: space-between;
gap: 12px;
min-width: 0;
flex-wrap: wrap;
}
.task-class-sidebar__title-wrap {
@@ -167,11 +249,13 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
align-items: center;
gap: 10px;
color: #1f2c42;
min-width: 0;
}
.task-class-sidebar__title-wrap strong {
font-size: 15px;
font-weight: 800;
min-width: 0;
}
.task-class-sidebar__title-icon {
@@ -213,10 +297,12 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
.task-class-sidebar__skeleton {
min-height: 0;
overflow-y: auto;
overflow-x: hidden;
padding: 24px;
display: grid;
align-content: start;
gap: 14px;
scrollbar-gutter: stable;
}
.task-class-sidebar__skeleton-item {
@@ -228,6 +314,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
}
.task-class-card {
min-width: 0;
border-radius: 24px;
border: 1px solid rgba(216, 225, 238, 0.9);
background: linear-gradient(180deg, #fdfefe 0%, #f8fbff 100%);
@@ -242,6 +329,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
.task-class-card__summary {
width: 100%;
min-width: 0;
border: none;
background: transparent;
padding: 18px 20px 18px 18px;
@@ -284,6 +372,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
font-size: 16px;
line-height: 1.35;
font-weight: 800;
overflow-wrap: anywhere;
}
.task-class-card__content span {
@@ -292,6 +381,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
}
.task-class-card__corner {
flex: 0 0 auto;
width: 48px;
height: 48px;
border-radius: 999px;
@@ -304,7 +394,14 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
}
.task-class-card__detail {
min-width: 0;
padding: 0 14px 14px;
overflow-y: auto;
overflow-x: hidden;
scrollbar-gutter: stable;
overscroll-behavior: contain;
scrollbar-width: thin;
scrollbar-color: rgba(114, 130, 157, 0.65) transparent;
}
.task-class-card__detail-loading {
@@ -313,14 +410,29 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
font-size: 13px;
}
.task-class-card__detail::-webkit-scrollbar {
width: 8px;
}
.task-class-card__detail::-webkit-scrollbar-track {
background: transparent;
}
.task-class-card__detail::-webkit-scrollbar-thumb {
border-radius: 999px;
background: rgba(114, 130, 157, 0.55);
}
.task-class-card__detail-list {
display: grid;
gap: 6px;
min-width: 0;
padding-right: 4px;
}
.task-class-card__detail-item {
min-width: 0;
padding: 10px 12px;
padding: 8px 10px;
border-radius: 16px;
border: 1px solid rgba(197, 209, 226, 0.8);
background: rgba(255, 255, 255, 0.92);
@@ -346,11 +458,13 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
}
.task-class-card__detail-status {
max-width: 100%;
padding: 4px 10px;
border-radius: 999px;
background: #f1f5f9;
color: #74839a;
font-size: 12px;
white-space: nowrap;
}
.task-class-card__detail-status--arranged {
@@ -376,6 +490,7 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
}
.task-class-sidebar__create {
min-width: 0;
min-height: 108px;
border: 1px dashed rgba(204, 216, 232, 0.92);
border-radius: 24px;
@@ -416,4 +531,107 @@ function formatEmbeddedTime(value: TaskClassDetail['items'][number]['embedded_ti
background-position: -200% 0;
}
}
@media (max-width: 1520px) {
.task-class-sidebar__header,
.task-class-sidebar__list,
.task-class-sidebar__skeleton {
padding-left: 18px;
padding-right: 18px;
}
.task-class-card__summary {
padding: 16px 16px 16px 15px;
}
}
@media (max-width: 1380px) {
.task-class-sidebar {
border-right: none;
border-bottom: 1px solid rgba(196, 209, 227, 0.55);
}
}
@media (max-width: 1180px) {
.task-class-card__detail-item {
grid-template-columns: 28px minmax(0, 1fr) 24px;
align-items: start;
}
.task-class-card__detail-status {
grid-column: 2;
justify-self: start;
}
.task-class-card__detail-delete {
grid-column: 3;
grid-row: 1 / span 2;
align-self: center;
}
}
@media (max-height: 900px) {
.task-class-sidebar__header {
padding-top: 12px;
padding-bottom: 12px;
gap: 10px;
}
.task-class-sidebar__list,
.task-class-sidebar__skeleton {
padding-top: 16px;
padding-bottom: 16px;
gap: 10px;
}
.task-class-card {
border-radius: 20px;
}
.task-class-card__summary {
padding: 14px 14px 14px 13px;
}
.task-class-card__content {
gap: 6px;
}
.task-class-card__content strong {
font-size: 15px;
}
.task-class-sidebar__create {
min-height: 88px;
}
}
@media (max-height: 820px) {
.task-class-sidebar__header,
.task-class-sidebar__list,
.task-class-sidebar__skeleton {
padding-left: 14px;
padding-right: 14px;
}
.task-class-card__summary {
padding: 12px;
}
.task-class-card__corner {
width: 40px;
height: 40px;
}
.task-class-card__content strong {
font-size: 14px;
}
.task-class-card__content span,
.task-class-card__detail-text,
.task-class-card__detail-status {
font-size: 12px;
}
}
</style>

122
frontend/src/components/schedule/WeekPlanningBoard.vue
View File

@@ -144,12 +144,22 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
<style scoped>
.planning-board {
--planning-grid-padding-x: 24px;
--planning-grid-padding-y: 28px;
--planning-grid-gap-x: 12px;
--planning-grid-gap-y: 10px;
--planning-time-column-width: 74px;
--planning-day-column-min: 96px;
--planning-cell-height: clamp(72px, 9.2vh, 112px);
min-width: 0;
min-height: 0;
border-radius: 28px;
border: 1px solid rgba(214, 223, 236, 0.82);
background: linear-gradient(180deg, rgba(252, 253, 255, 0.98), rgba(248, 251, 255, 0.98));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
display: grid;
grid-template-rows: auto minmax(0, 1fr);
overflow: hidden;
}
.planning-board__header {
@@ -161,10 +171,13 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
.planning-board__grid {
min-width: 0;
min-height: 0;
display: grid;
grid-template-columns: 74px repeat(7, minmax(0, 1fr));
gap: 10px 12px;
padding: 28px 24px 24px;
grid-template-columns: var(--planning-time-column-width) repeat(7, minmax(var(--planning-day-column-min), 1fr));
gap: var(--planning-grid-gap-y) var(--planning-grid-gap-x);
padding: var(--planning-grid-padding-y) var(--planning-grid-padding-x) 24px;
overflow: auto;
scrollbar-gutter: stable both-edges;
}
.planning-board__corner {
@@ -189,7 +202,7 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
}
.planning-board__time-cell {
min-height: 112px;
min-height: var(--planning-cell-height);
display: grid;
align-content: center;
justify-items: end;
@@ -211,7 +224,7 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
.planning-board__cell {
position: relative;
min-height: 112px;
min-height: var(--planning-cell-height);
border-radius: 22px;
border: 1px solid rgba(228, 234, 243, 0.92);
padding: 18px 14px;
@@ -225,6 +238,7 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
.planning-board__cell-main {
display: grid;
gap: 10px;
min-width: 0;
}
.planning-board__cell-main strong {
@@ -232,11 +246,15 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
font-size: 15px;
line-height: 1.35;
font-weight: 700;
min-width: 0;
overflow-wrap: anywhere;
}
.planning-board__cell-main span {
color: #9badc5;
font-size: 12px;
min-width: 0;
overflow-wrap: anywhere;
}
.planning-board__cell--course {
@@ -321,7 +339,99 @@ function resolveCellMeta(event?: ScheduleWeekEvent) {
@media (max-width: 1560px) {
.planning-board__grid {
grid-template-columns: 64px repeat(7, minmax(118px, 1fr));
--planning-time-column-width: 64px;
--planning-day-column-min: 92px;
--planning-grid-padding-x: 18px;
--planning-grid-padding-y: 22px;
--planning-grid-gap-x: 10px;
}
}
@media (max-width: 1380px) {
.planning-board__header {
padding: 16px 20px 14px;
}
.planning-board__grid {
--planning-time-column-width: 58px;
--planning-day-column-min: 84px;
--planning-grid-padding-x: 14px;
--planning-grid-padding-y: 18px;
--planning-grid-gap-x: 8px;
--planning-grid-gap-y: 8px;
}
.planning-board__time-cell,
.planning-board__cell {
min-height: 98px;
}
.planning-board__cell {
padding: 14px 10px;
border-radius: 18px;
}
.planning-board__cell-main {
gap: 8px;
}
.planning-board__cell-main strong {
font-size: 14px;
}
}
@media (max-width: 1180px) {
.planning-board__grid {
--planning-time-column-width: 56px;
--planning-day-column-min: 78px;
}
.planning-board__day-head span {
font-size: 13px;
}
.planning-board__day-head small,
.planning-board__cell-main span {
font-size: 11px;
}
}
@media (max-height: 900px) {
.planning-board {
--planning-grid-padding-y: 18px;
--planning-cell-height: clamp(66px, 8.2vh, 92px);
}
.planning-board__header {
padding-top: 14px;
padding-bottom: 12px;
}
.planning-board__header strong {
font-size: 16px;
}
}
@media (max-height: 820px) {
.planning-board {
--planning-grid-padding-y: 14px;
--planning-grid-gap-y: 6px;
--planning-cell-height: clamp(58px, 7.2vh, 82px);
}
.planning-board__time-cell strong,
.planning-board__cell-main strong {
font-size: 13px;
}
.planning-board__time-cell small,
.planning-board__day-head small,
.planning-board__cell-main span {
font-size: 10px;
}
.planning-board__cell {
padding: 12px 8px;
}
}
</style>