fix: 完善个人中心卡片管理

ai_knowledge_base_v2/apps/user-client/src/components/PersonalCenterDialog.vue

@@ -4,11 +4,13 @@ import {
   CheckCircle2,
   ChevronDown,
   CircleMinus,
+  Copy,
   LifeBuoy,
   LogOut,
   PackageCheck,
   Share2,
   Sparkles,
+  Trash2,
 } from "@lucide/vue";
 import { computed, ref } from "vue";
 
@@ -26,15 +28,21 @@ const props = defineProps<{
   reports: PeriodicReport[];
   helpCards: TeacherHelpCard[];
   shareDrafts: ShareDraft[];
+  operationPending: boolean;
 }>();
 
-defineEmits<{
+const emit = defineEmits<{
   close: [];
   logout: [];
+  copyHelpCard: [card: TeacherHelpCard];
+  copyShareDraft: [draft: ShareDraft];
+  deleteHelpCard: [cardId: number, done: (success: boolean) => void];
+  deleteShareDraft: [draftId: number, done: (success: boolean) => void];
 }>();
 
 const activeSection = ref<CenterSection>(props.initialSection);
 const activeCardSection = ref<CardSection>("help");
+const deletingCard = ref<{ type: CardSection; id: number } | null>(null);
 const entitlement = computed(() => props.user.entitlement);
 const displayName = computed(() => props.user.nickname?.trim() || props.user.name);
 const nameInitial = computed(() => displayName.value.slice(0, 1));
@@ -75,6 +83,19 @@ function settlementStatusLabel(status: string) {
     failed: "整理失败",
   }[status] || status;
 }
+
+function submitDeleteCard() {
+  if (!deletingCard.value || props.operationPending) return;
+  const target = deletingCard.value;
+  const done = (success: boolean) => {
+    if (success) deletingCard.value = null;
+  };
+  if (target.type === "help") {
+    emit("deleteHelpCard", target.id, done);
+    return;
+  }
+  emit("deleteShareDraft", target.id, done);
+}
 </script>
 
 <template>
@@ -247,6 +268,16 @@ function settlementStatusLabel(status: string) {
                 </div>
                 <ChevronDown :size="17" aria-hidden="true" />
               </summary>
+              <div class="card-history-actions">
+                <button type="button" class="copy" @click="emit('copyHelpCard', item)">
+                  <Copy :size="15" aria-hidden="true" />
+                  {{ item.copied ? "再次复制" : "复制卡片" }}
+                </button>
+                <button type="button" class="delete" @click="deletingCard = { type: 'help', id: item.id }">
+                  <Trash2 :size="15" aria-hidden="true" />
+                  删除
+                </button>
+              </div>
               <pre>{{ item.content }}</pre>
             </details>
           </div>
@@ -276,6 +307,16 @@ function settlementStatusLabel(status: string) {
                 </div>
                 <ChevronDown :size="17" aria-hidden="true" />
               </summary>
+              <div class="card-history-actions">
+                <button type="button" class="copy" @click="emit('copyShareDraft', item)">
+                  <Copy :size="15" aria-hidden="true" />
+                  {{ item.copied ? "再次复制" : "复制卡片" }}
+                </button>
+                <button type="button" class="delete" @click="deletingCard = { type: 'share', id: item.id }">
+                  <Trash2 :size="15" aria-hidden="true" />
+                  删除
+                </button>
+              </div>
               <pre>{{ item.content }}</pre>
             </details>
           </div>
@@ -294,6 +335,25 @@ function settlementStatusLabel(status: string) {
       </div>
     </template>
   </AppDialog>
+
+  <AppDialog
+    v-if="deletingCard"
+    title="删除卡片"
+    labelled-by="delete-card-title"
+    @close="deletingCard = null"
+  >
+    <p class="confirm-copy">
+      确定删除这张{{ deletingCard.type === "help" ? "老师求助卡" : "班级分享稿" }}吗？删除后无法恢复。
+    </p>
+    <template #footer>
+      <div class="dialog-actions">
+        <button type="button" class="dialog-secondary" :disabled="operationPending" @click="deletingCard = null">取消</button>
+        <button type="button" class="dialog-danger" :disabled="operationPending" @click="submitDeleteCard">
+          {{ operationPending ? "删除中..." : "删除" }}
+        </button>
+      </div>
+    </template>
+  </AppDialog>
 </template>
 
 <style scoped>
@@ -349,7 +409,7 @@ function settlementStatusLabel(status: string) {
 .report-record > time { display: block; padding: 0 12px 6px; }
 .report-record pre { max-height: 260px; overflow: auto; margin: 0; padding: 11px 12px; border-top: 1px solid var(--chat-border); background: #fbfcfc; color: var(--chat-muted); font: inherit; font-size: 12px; line-height: 1.7; white-space: pre-wrap; }
 .records-section { align-content: start; }
-.card-type-tabs { position: sticky; top: -1px; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 2px 0 4px; background: #fff; }
+.card-type-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 2px 0 4px; background: #fff; }
 .card-type-tabs button { min-width: 0; min-height: 52px; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid var(--chat-border); border-radius: 13px; background: #fff; color: var(--chat-muted); font-size: 12px; font-weight: 700; text-align: left; }
 .card-type-tabs button[aria-selected="true"] { border-color: rgba(20, 148, 119, 0.42); background: var(--chat-brand-soft); color: var(--chat-brand-dark); box-shadow: 0 5px 16px rgba(27, 68, 55, 0.07); }
 .card-type-tabs button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@@ -372,6 +432,10 @@ function settlementStatusLabel(status: string) {
 .card-history-item summary > svg { transition: transform 0.18s ease; }
 .card-history-item[open] summary > svg { transform: rotate(180deg); }
 .card-history-item pre { max-height: 300px; overflow: auto; margin: 0; padding: 12px; border-top: 1px solid var(--chat-border); background: #fbfcfc; color: var(--chat-muted); font: inherit; font-size: 12px; line-height: 1.7; white-space: pre-wrap; }
+.card-history-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 9px 10px 10px; border-top: 1px solid var(--chat-border); background: #fff; }
+.card-history-actions button { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 13px; border: 0; border-radius: 10px; font-size: 12px; font-weight: 700; }
+.card-history-actions .copy { background: var(--chat-brand-soft); color: var(--chat-brand-dark); }
+.card-history-actions .delete { background: #fff2f1; color: var(--chat-danger); }
 .center-empty { margin: 0; padding: 22px 14px; border-radius: 14px; background: #f6f8f7; color: var(--chat-muted); font-size: 13px; line-height: 1.7; text-align: center; }
 .center-empty.small { padding: 14px; font-size: 12px; }
 .personal-center-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }