feat(admin): open ticket creation in a dialog on the list page

Move "代客提交工单" back into a native <dialog> on the ticket list while
the ticket workspace stays a full page. Closing asks before discarding
input, ignores backdrop clicks, resets the form and returns focus; an
uncertain create result keeps the form locked behind "重新加载".

Remove the ?view=new create page route and its styles.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Fable 5 committed 2026-10-31 14:57:35 +08:00
1 parent d86a85e6a6
commit 54cc5301c3
9 files changed
+169 -65

No files matched your search

+22 -4
View File
@@ -22,7 +22,7 @@
.aksrt-ticket-user img { flex: none; border-radius: 50%; }
.aksrt-ticket-user span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 工作区与创建页共用:页头、提交反馈与表单控件。 */
/* 工作区与代客提交弹窗共用:页头、提交反馈与表单控件。 */
.aksrt-tickets-admin__detail-header .aksrt-native-header__title { overflow-wrap: anywhere; }
.aksrt-tickets-admin__detail-header .aksrt-native-header__desc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.aksrt-tickets-admin [hidden] { display: none !important; }
@@ -34,8 +34,21 @@
.aksrt-ticket-feedback p { margin: 0; }
.aksrt-ticket-feedback.is-error { color: #a61b36; background: #fdf0f2; border-color: #f6d3da; }
.aksrt-ticket-feedback .button { flex: none; }
.aksrt-tickets-admin__create { max-width: 880px; }
.aksrt-tickets-admin__create .aksrt-native-form-foot .aksrt-ticket-hint { margin-left: auto; }
/* 代客提交:原生 top layer 弹窗,头尾固定,仅正文滚动。 */
.aksrt-ticket-dialog { box-sizing: border-box; width: min(720px, calc(100vw - 48px)); max-width: none; max-height: calc(100dvh - 48px); margin: auto; padding: 0; color: var(--an-text); background: var(--an-card); border: 0; border-radius: var(--an-radius); box-shadow: 0 12px 32px rgba(15, 23, 42, .12), 0 32px 80px rgba(15, 23, 42, .16); overflow: hidden; font: inherit; }
.aksrt-ticket-dialog:not([open]) { display: none; }
.aksrt-ticket-dialog::backdrop { background: rgba(15, 23, 42, .45); }
.aksrt-ticket-dialog__frame { display: flex; flex-direction: column; max-height: calc(100dvh - 48px); margin: 0; }
.aksrt-ticket-dialog__head { display: flex; flex: none; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 18px 24px; border-bottom: 1px solid var(--an-border-soft); }
.aksrt-ticket-dialog__head h2 { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.5; }
.aksrt-ticket-dialog__head h2:focus { outline: 0; }
.aksrt-ticket-dialog__head p { margin: 4px 0 0; color: var(--an-muted); font-size: 12px; }
.aksrt-ticket-dialog__close { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 32px; height: 32px; margin: -2px -6px 0 0; padding: 0; color: var(--an-muted); background: transparent; border: 0; border-radius: 8px; cursor: pointer; }
.aksrt-ticket-dialog__close:hover { color: var(--an-text); background: var(--an-bg-soft); }
.aksrt-ticket-dialog__body { min-height: 0; padding: 20px 24px; overflow-y: auto; overscroll-behavior: contain; }
.aksrt-ticket-dialog__foot { display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; padding: 14px 24px; border-top: 1px solid var(--an-border-soft); }
.aksrt-ticket-dialog__foot > .aksrt-ticket-hint { margin-right: auto; }
/* 处理工作区:会话与回复在左,处理信息与内部备注在右。 */
.aksrt-ticket-detail { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
@@ -142,7 +155,12 @@
.aksrt-ticket-detail__avatar { width: 28px; height: 28px; }
.aksrt-ticket-composer__bar select { flex-basis: 100%; max-width: 100%; }
.aksrt-ticket-feedback { align-items: flex-start; flex-direction: column; }
.aksrt-tickets-admin__create .aksrt-native-form-foot .aksrt-ticket-hint { flex-basis: 100%; margin-left: 0; }
.aksrt-ticket-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
.aksrt-ticket-dialog__frame { max-height: calc(100dvh - 16px); }
.aksrt-ticket-dialog__head,
.aksrt-ticket-dialog__body,
.aksrt-ticket-dialog__foot { padding: 12px 14px; }
.aksrt-ticket-dialog__foot > .aksrt-ticket-hint { flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) {
.aksrt-tickets-admin *, .aksrt-tickets-admin *::before { scroll-behavior: auto !important; transition: none !important; animation: none !important; }