fix(admin): merge ticket controls into information panel
Edit status, department and assignee directly in ticket information, remove the redundant handling card and its layout rules, and cover editable and closed-ticket rendering. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Opus 5 committed
1 parent
7f1a0dbeb4
commit
09f3a94cea
4 files changed
+76
-33
No files matched your search
@@ -106,7 +106,7 @@ html.aksrt-ticket-modal-open { overflow: hidden; scrollbar-gutter: stable; }
|
||||
.aksrt-ticket-detail__info dt { color: var(--an-text-2); }
|
||||
.aksrt-ticket-detail__info dd { margin: 0; overflow-wrap: anywhere; }
|
||||
.aksrt-ticket-detail__status-form { display: flex; flex-direction: column; gap: 12px; }
|
||||
.aksrt-ticket-detail__status-form > label { display: flex; flex-direction: column; gap: 4px; }
|
||||
.aksrt-ticket-detail__status-form .aksrt-ticket-detail__info dt { align-self: center; }
|
||||
.aksrt-ticket-detail__status-form select { width: 100%; max-width: none; }
|
||||
.aksrt-ticket-close-warning { padding: 10px; color: #9d2038; background: #fdf0f2; border-radius: 6px; font-size: 12px; }
|
||||
.aksrt-ticket-close-warning label { display: flex; align-items: flex-start; gap: 6px; line-height: 1.6; }
|
||||
@@ -121,8 +121,6 @@ html.aksrt-ticket-modal-open { overflow: hidden; scrollbar-gutter: stable; }
|
||||
|
||||
@media (max-width: 960px) {
|
||||
.aksrt-ticket-detail { grid-template-columns: minmax(0, 1fr); }
|
||||
.aksrt-ticket-detail__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
|
||||
.aksrt-ticket-detail__private { grid-column: 1 / -1; }
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
.aksrt-ticket-dialog,
|
||||
@@ -134,8 +132,6 @@ html.aksrt-ticket-modal-open { overflow: hidden; scrollbar-gutter: stable; }
|
||||
.aksrt-ticket-feedback { padding: 14px; }
|
||||
.aksrt-ticket-dialog__head h2 { font-size: 17px; }
|
||||
.aksrt-ticket-dialog__foot > .aksrt-ticket-hint { flex-basis: 100%; }
|
||||
.aksrt-ticket-detail__side { display: flex; }
|
||||
.aksrt-ticket-detail__side > section { width: auto; }
|
||||
.aksrt-ticket-detail__reply.is-admin,
|
||||
.aksrt-ticket-detail__reply.is-user { margin-left: 0; margin-right: 0; }
|
||||
.aksrt-ticket-detail__msg-head time { flex-basis: 100%; margin-left: 0; }
|
||||
|
||||
@@ -54,7 +54,7 @@ trait UsersMenusTicketsCenter {
|
||||
'tooLong' => __('插入后将超过字数限制，请先精简回复内容。', 'aksrt'),
|
||||
'created' => __('工单已创建，用户将收到通知。', 'aksrt'),
|
||||
'reply' => __('回复已发送，用户将收到通知。', 'aksrt'),
|
||||
'status' => __('处理信息已保存。', 'aksrt'),
|
||||
'status' => __('工单信息已保存。', 'aksrt'),
|
||||
'note' => __('内部备注已添加，仅管理员可见。', 'aksrt'),
|
||||
],
|
||||
]);
|
||||
|
||||
@@ -55,11 +55,8 @@ trait UsersMenusTicketsDetail {
|
||||
$html .= $closed
|
||||
? '<p class="aksrt-ticket-detail__closed"><span class="dashicons dashicons-lock" aria-hidden="true"></span>' . esc_html__('工单已关闭，不能继续回复或变更处理信息；仍可添加内部备注。', 'aksrt') . '</p>'
|
||||
: $this->ticket_reply_form($id);
|
||||
$html .= '</div><aside class="aksrt-ticket-detail__side" aria-label="' . esc_attr__('工单信息与处理', 'aksrt') . '">';
|
||||
$html .= '</div><aside class="aksrt-ticket-detail__side" aria-label="' . esc_attr__('工单信息与内部备注', 'aksrt') . '">';
|
||||
$html .= $this->ticket_info_card($ticket);
|
||||
if (!$closed) {
|
||||
$html .= $this->ticket_status_form($ticket);
|
||||
}
|
||||
$html .= '<section class="aksrt-ticket-detail__card aksrt-ticket-detail__private"><h3 class="aksrt-ticket-detail__heading">' . esc_html__('内部备注', 'aksrt') . '</h3><p class="aksrt-ticket-hint">' . esc_html__('仅管理员可见，不会发送给用户。', 'aksrt') . '</p>';
|
||||
if ($notes !== []) {
|
||||
$html .= '<ul class="aksrt-ticket-detail__notes">';
|
||||
@@ -97,54 +94,76 @@ trait UsersMenusTicketsDetail {
|
||||
}
|
||||
|
||||
private function ticket_info_card(array $ticket): string {
|
||||
$id = (int) $ticket['id'];
|
||||
$editable = empty($ticket['is_closed']);
|
||||
$controls = $editable ? $this->ticket_info_controls($ticket) : [];
|
||||
$rows = [
|
||||
__('工单号', 'aksrt') => esc_html((string) $ticket['ticket_num']),
|
||||
__('状态', 'aksrt') => $this->ticket_status_badge($ticket),
|
||||
__('用户', 'aksrt') => $this->ticket_user_chip((int) $ticket['user_id'], (string) $ticket['user_name']),
|
||||
__('部门', 'aksrt') => esc_html((string) $ticket['ticket_type_name'] !== '' ? (string) $ticket['ticket_type_name'] : '—'),
|
||||
__('跟进人', 'aksrt') => esc_html((int) $ticket['admin_id'] > 0 ? (string) $ticket['admin_name'] : __('未指派', 'aksrt')),
|
||||
[__('工单号', 'aksrt'), esc_html((string) $ticket['ticket_num'])],
|
||||
[__('状态', 'aksrt'), $controls['status'] ?? $this->ticket_status_badge($ticket), 'status'],
|
||||
[__('用户', 'aksrt'), $this->ticket_user_chip((int) $ticket['user_id'], (string) $ticket['user_name'])],
|
||||
[__('部门', 'aksrt'), $controls['ticket_type_id'] ?? esc_html((string) $ticket['ticket_type_name'] !== '' ? (string) $ticket['ticket_type_name'] : '—'), 'ticket_type_id'],
|
||||
[__('跟进人', 'aksrt'), $controls['admin_id'] ?? esc_html((int) $ticket['admin_id'] > 0 ? (string) $ticket['admin_name'] : __('未指派', 'aksrt')), 'admin_id'],
|
||||
];
|
||||
if ((string) $ticket['order_number'] !== '') {
|
||||
$rows[__('关联订单', 'aksrt')] = esc_html((string) $ticket['order_number']);
|
||||
$rows[] = [__('关联订单', 'aksrt'), esc_html((string) $ticket['order_number'])];
|
||||
}
|
||||
$rows[__('提交时间', 'aksrt')] = esc_html((string) $ticket['post_time']);
|
||||
$rows[] = [__('提交时间', 'aksrt'), esc_html((string) $ticket['post_time'])];
|
||||
if ((int) $ticket['urge_count'] > 0) {
|
||||
$rows[__('催单', 'aksrt')] = esc_html(sprintf(__('%1$d 次，最近 %2$s', 'aksrt'), (int) $ticket['urge_count'], (string) $ticket['last_urge_time']));
|
||||
$rows[] = [__('催单', 'aksrt'), esc_html(sprintf(__('%1$d 次，最近 %2$s', 'aksrt'), (int) $ticket['urge_count'], (string) $ticket['last_urge_time']))];
|
||||
}
|
||||
$html = '<section class="aksrt-ticket-detail__card"><h3 class="aksrt-ticket-detail__heading">' . esc_html__('工单信息', 'aksrt') . '</h3><dl class="aksrt-ticket-detail__info">';
|
||||
foreach ($rows as $label => $value) {
|
||||
$html .= '<dt>' . esc_html($label) . '</dt><dd>' . $value . '</dd>';
|
||||
$html = '<section class="aksrt-ticket-detail__card"><div class="aksrt-ticket-section-head"><h3>' . esc_html__('工单信息', 'aksrt') . '</h3>';
|
||||
if ($editable) {
|
||||
$html .= '<button type="button" class="button-link" data-aksrt-ticket-assign>' . esc_html__('由我跟进', 'aksrt') . '</button>';
|
||||
}
|
||||
return $html . '</dl></section>';
|
||||
$html .= '</div>';
|
||||
if ($editable) {
|
||||
$html .= $this->ticket_form_open('status', $id, 'aksrt-ticket-detail__status-form');
|
||||
}
|
||||
$html .= '<dl class="aksrt-ticket-detail__info">';
|
||||
foreach ($rows as $row) {
|
||||
[$label, $value] = $row;
|
||||
$label_html = esc_html($label);
|
||||
if ($editable && isset($row[2])) {
|
||||
$label_html = '<label for="aksrt-ticket-' . esc_attr($row[2]) . '-' . $id . '">' . $label_html . '</label>';
|
||||
}
|
||||
$html .= '<dt>' . $label_html . '</dt><dd>' . $value . '</dd>';
|
||||
}
|
||||
$html .= '</dl>';
|
||||
if ($editable) {
|
||||
$html .= '<div class="aksrt-ticket-close-warning" data-aksrt-ticket-close-warning hidden><label><input type="checkbox" data-aksrt-ticket-close-confirm> <span>' . esc_html__('确认关闭工单：关闭后无法再次回复，尚未发送的回复不会保存。', 'aksrt') . '</span></label></div>';
|
||||
$html .= '<button type="submit" class="button">' . esc_html__('保存工单信息', 'aksrt') . '</button></form>';
|
||||
}
|
||||
return $html . '</section>';
|
||||
}
|
||||
|
||||
private function ticket_status_form(array $ticket): string {
|
||||
/** 工单信息中的可编辑值；不再重复渲染只读值或独立处理表单。 */
|
||||
private function ticket_info_controls(array $ticket): array {
|
||||
$id = (int) $ticket['id'];
|
||||
$from = (string) $ticket['status'];
|
||||
$html = '<section class="aksrt-ticket-detail__card"><div class="aksrt-ticket-section-head"><h3>' . esc_html__('处理工单', 'aksrt') . '</h3><button type="button" class="button-link" data-aksrt-ticket-assign>' . esc_html__('由我跟进', 'aksrt') . '</button></div>';
|
||||
$html .= $this->ticket_form_open('status', $id, 'aksrt-ticket-detail__status-form');
|
||||
$html .= '<label><span>' . esc_html__('状态', 'aksrt') . '</span><select name="status" data-aksrt-ticket-status>';
|
||||
$controls = ['status' => '<select id="aksrt-ticket-status-' . $id . '" name="status" data-aksrt-ticket-status>'];
|
||||
foreach (TicketStatusService::map() as $row) {
|
||||
$key = (string) $row['status_key'];
|
||||
if (TicketStatusService::can_transition($from, $key)) {
|
||||
$html .= '<option value="' . esc_attr($key) . '" data-closed="' . (empty($row['is_closed']) ? '0' : '1') . '"' . selected($from, $key, false) . '>' . esc_html((string) $row['name']) . '</option>';
|
||||
$controls['status'] .= '<option value="' . esc_attr($key) . '" data-closed="' . (empty($row['is_closed']) ? '0' : '1') . '"' . selected($from, $key, false) . '>' . esc_html((string) $row['name']) . '</option>';
|
||||
}
|
||||
}
|
||||
$html .= '</select></label><label><span>' . esc_html__('部门', 'aksrt') . '</span><select name="ticket_type_id" required>';
|
||||
$controls['status'] .= '</select>';
|
||||
$controls['ticket_type_id'] = '<select id="aksrt-ticket-ticket_type_id-' . $id . '" name="ticket_type_id" required>';
|
||||
foreach (TicketTypeService::all() as $row) {
|
||||
$html .= '<option value="' . (int) $row['id'] . '"' . selected((int) $ticket['ticket_type_id'], (int) $row['id'], false) . '>' . esc_html((string) $row['name']) . '</option>';
|
||||
$controls['ticket_type_id'] .= '<option value="' . (int) $row['id'] . '"' . selected((int) $ticket['ticket_type_id'], (int) $row['id'], false) . '>' . esc_html((string) $row['name']) . '</option>';
|
||||
}
|
||||
$html .= '</select></label><label><span>' . esc_html__('跟进人', 'aksrt') . '</span><select name="admin_id"><option value="0">' . esc_html__('未指派', 'aksrt') . '</option>';
|
||||
$controls['ticket_type_id'] .= '</select>';
|
||||
$controls['admin_id'] = '<select id="aksrt-ticket-admin_id-' . $id . '" name="admin_id"><option value="0">' . esc_html__('未指派', 'aksrt') . '</option>';
|
||||
$current = (int) $ticket['admin_id'];
|
||||
$admins = $this->ticket_admin_options();
|
||||
if ($current > 0 && !isset($admins[$current])) {
|
||||
$admins[$current] = (string) $ticket['admin_name'];
|
||||
}
|
||||
foreach ($admins as $admin_id => $name) {
|
||||
$html .= '<option value="' . $admin_id . '"' . selected($current, $admin_id, false) . '>' . esc_html($admin_id === get_current_user_id() ? sprintf(__('%s（我）', 'aksrt'), $name) : $name) . '</option>';
|
||||
$controls['admin_id'] .= '<option value="' . $admin_id . '"' . selected($current, $admin_id, false) . '>' . esc_html($admin_id === get_current_user_id() ? sprintf(__('%s（我）', 'aksrt'), $name) : $name) . '</option>';
|
||||
}
|
||||
$html .= '</select></label><div class="aksrt-ticket-close-warning" data-aksrt-ticket-close-warning hidden><label><input type="checkbox" data-aksrt-ticket-close-confirm> <span>' . esc_html__('确认关闭工单：关闭后无法再次回复，尚未发送的回复不会保存。', 'aksrt') . '</span></label></div>';
|
||||
return $html . '<button type="submit" class="button">' . esc_html__('保存处理信息', 'aksrt') . '</button></form></section>';
|
||||
$controls['admin_id'] .= '</select>';
|
||||
return $controls;
|
||||
}
|
||||
|
||||
private function ticket_admin_options(): array {
|
||||
|
||||
@@ -46,6 +46,34 @@ test('detail is independently loaded even for a closed ticket outside current fi
|
||||
assert.match(open.data.panel, /<dt>工单号<\/dt><dd>TK-00021<\/dd>/);
|
||||
});
|
||||
|
||||
test('ticket information owns the only status editor and closed tickets stay read-only', () => {
|
||||
const { open, closed } = rendered();
|
||||
const sidebarCards = panel => {
|
||||
const sidebar = panel.match(/<aside\b[^>]*>([\s\S]*?)<\/aside>/)?.[1] || '';
|
||||
return [...sidebar.matchAll(/<section class="aksrt-ticket-detail__card(?: [^"]+)?">([\s\S]*?)<\/section>/g)].map(match => match[1]);
|
||||
};
|
||||
const cards = sidebarCards(open.data.panel);
|
||||
assert.equal(cards.length, 2, 'only ticket information and internal notes remain');
|
||||
const info = cards[0];
|
||||
assert.match(info, /<h3>工单信息<\/h3>/);
|
||||
assert.match(info, /data-aksrt-ticket-form="status"/);
|
||||
assert.match(info, /data-aksrt-ticket-assign/);
|
||||
assert.match(info, /保存工单信息/);
|
||||
assert.doesNotMatch(open.data.panel, /<h3[^>]*>处理工单<\/h3>/);
|
||||
assert.doesNotMatch(info, /aksrt-ticket-badge/);
|
||||
for (const [name, label] of [['status', '状态'], ['ticket_type_id', '部门'], ['admin_id', '跟进人']]) {
|
||||
const id = `aksrt-ticket-${name}-21`;
|
||||
assert.ok(info.includes(`<label for="${id}">${label}</label>`));
|
||||
assert.ok(info.includes(`<select id="${id}" name="${name}"`));
|
||||
assert.equal((open.data.panel.match(new RegExp(`name="${name}"`, 'g')) || []).length, 1);
|
||||
}
|
||||
assert.match(cards[1], /内部备注/);
|
||||
const closedInfo = sidebarCards(closed.data.panel)[0];
|
||||
assert.match(closedInfo, /<h3>工单信息<\/h3>/);
|
||||
assert.match(closedInfo, /aksrt-ticket-badge/);
|
||||
assert.doesNotMatch(closedInfo, /<form|<select|data-aksrt-ticket-assign|保存工单信息/);
|
||||
});
|
||||
|
||||
test('read handler enforces capability, nonce and record existence', () => {
|
||||
const { missing, denied, nonce } = rendered();
|
||||
assert.equal(missing.status, 404);
|
||||
|
||||
Reference in new issue
Block a user