style(appointments): simplify calendar toolbar and remove redundant heading

This commit is contained in:
2026-10-10 15:38:44 +08:00
parent be2a754342
commit 453549ece1
4 changed files with 34 additions and 23 deletions
@@ -379,7 +379,6 @@ onBeforeUnmount(() => { ++unscheduledRequest; ++calendarRequest; ++candidateRequ
<LoadErrorState v-if="linkError" title="预约货源核对失败" :message="linkError.message" :loading="linkLoading" @retry="resolveLink" />
<AppointmentFollowupDialog v-if="linkedSource" :source="linkedSource.source" :coverage="linkedSource.coverage" :can-write="access.can('platform:appointment:followup')" :can-arrange="access.can(permission.inboundOrderAppointment)" @arrange="arrangeLinkedSource" @close="linkedSource = null" />
<div class="appointment-heading">
<h2 class="density-detail-title">美国预约总览</h2>
<div class="density-status-tabs" role="group" aria-label="预约工作视图">
<button v-if="access.can(permission.lastMileOrderList)" type="button" :class="{ 'is-active': workView === 'containers' }" :aria-pressed="workView === 'containers'" @click="workView = 'containers'">提柜与到仓</button>
<button v-if="access.can(permission.lastMileOrderList)" type="button" :class="{ 'is-active': workView === 'cargo' }" :aria-pressed="workView === 'cargo'" @click="workView = 'cargo'">送仓与排车</button>
@@ -393,8 +392,8 @@ onBeforeUnmount(() => { ++unscheduledRequest; ++calendarRequest; ++candidateRequ
<LoadErrorState v-for="error in sourceErrors" :key="error.title" :title="error.title" :message="error.details.message" :loading="loading" @retry="load()"><template #details><ApiErrorMeta :details="error.details" /></template></LoadErrorState>
<LoadErrorState v-if="unscheduledError" title="未定时安排加载失败" :message="unscheduledError.message" @retry="loadUnscheduled" />
<details v-if="unscheduledTotal" class="appointment-extra"><summary>未定时安排({{ unscheduledTotal }})</summary><DataTable v-model:page="unscheduledPage" v-model:page-size="unscheduledSize" :data="unscheduled" :columns="unscheduledColumns" :total="unscheduledTotal" row-key="appointmentNo" @update:page="loadUnscheduled" @update:page-size="unscheduledPage = 1; loadUnscheduled()"><template #actions="{ row }"><el-button @click="openEdit({key: row.appointmentNo})">查看 / 继续</el-button></template></DataTable></details>
<p v-if="pickupNotice" role="status">{{ pickupNotice }}</p>
<p v-if="showTripLayer && tripNotice" role="status">{{ tripNotice }}</p>
<details v-if="pickupNotice" class="calendar-notice"><summary>部分提柜记录待核实</summary><p>{{ pickupNotice }}</p></details>
<details v-if="showTripLayer && tripNotice" class="calendar-notice"><summary>部分用车计划待核实</summary><p>{{ tripNotice }}</p></details>
<details v-if="showTripLayer && unresolvedTrips.length" class="appointment-extra">
<summary>待核实地点的车次({{ unresolvedTrips.length }})</summary>
<p>检索窗口内的车次,尚无法确定当地日期。原计划时间保留 UTC,不用浏览器时区换算。</p>
@@ -437,6 +436,9 @@ onBeforeUnmount(() => { ++unscheduledRequest; ++calendarRequest; ++candidateRequ
</template>
<style scoped>
.calendar-notice { margin: var(--admin-space-2) 0; font-size: var(--admin-font-caption); color: var(--el-text-color-secondary); }
.calendar-notice summary { cursor: pointer; }
.calendar-notice p { margin: var(--admin-space-2) 0; }
.appointment-heading { display: flex; align-items: center; flex-wrap: wrap; gap: var(--admin-space-5); }
.appointment-heading .density-status-tabs { flex: 1; margin: 0; }
.calendar-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--admin-space-6); }