feat(kol): expand variable schema and polish KOL UI

- Add length/range limits to KOL variable definitions: max_length and
  default_value for input/textarea, min_value/max_value/default_number
  for number. Backend validates and normalizes; frontend renders limit
  inputs in KolVariableConfig and applies limits at runtime in
  KolDynamicForm.
- Sort workspace cards by most recent prompt/package update, falling
  back to granted_at. Adds updated_at to KolWorkspaceCard.
- Polish TemplatesView, WorkspaceView, and KOL package management UI;
  route create/update/publish/archive/delete toasts through i18n and
  expand package form copy and status labels.
- Remove stale KnowledgeView.vue.patch.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/admin-web/src/views/KolManageView.vue

@@ -45,8 +45,8 @@ const { data: prompts, isPending: promptsPending } = useQuery({
 const createPackageMutation = useMutation({
   mutationFn: (body: CreateKolPackageRequest) => kolManageApi.createPackage(body),
   onSuccess: () => {
-    message.success(t("common.create") + "成功");
-    queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
+    message.success(t("kol.manage.messages.packageCreated"));
+    void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
   },
   onError: (error) => message.error(formatError(error)),
 });
@@ -55,8 +55,8 @@ const updatePackageMutation = useMutation({
   mutationFn: (data: { id: number; body: CreateKolPackageRequest }) =>
     kolManageApi.updatePackage(data.id, data.body),
   onSuccess: () => {
-    message.success(t("common.edit") + "成功");
-    queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
+    message.success(t("kol.manage.messages.packageUpdated"));
+    void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
   },
   onError: (error) => message.error(formatError(error)),
 });
@@ -64,37 +64,40 @@ const updatePackageMutation = useMutation({
 const publishPackageMutation = useMutation({
   mutationFn: (id: number) => kolManageApi.publishPackage(id),
   onSuccess: () => {
-    message.success(t("kol.manage.publishPackage") + "成功");
-    queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
+    message.success(t("kol.manage.messages.packagePublished"));
+    void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
   },
+  onError: (error) => message.error(formatError(error)),
 });
 
 const archivePackageMutation = useMutation({
   mutationFn: (id: number) => kolManageApi.archivePackage(id),
   onSuccess: () => {
-    message.success(t("kol.manage.archivePackage") + "成功");
-    queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
+    message.success(t("kol.manage.messages.packageArchived"));
+    void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
   },
+  onError: (error) => message.error(formatError(error)),
 });
 
 const deletePackageMutation = useMutation({
   mutationFn: (id: number) => kolManageApi.deletePackage(id),
   onSuccess: (_, id) => {
-    message.success(t("common.delete") + "成功");
-    queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
+    message.success(t("kol.manage.messages.packageDeleted"));
+    void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
     if (selectedPackageId.value === id) {
       selectedPackageId.value = null;
       editingPromptId.value = null;
     }
   },
+  onError: (error) => message.error(formatError(error)),
 });
 
 const createPromptMutation = useMutation({
   mutationFn: (body: CreateKolPromptRequest) =>
     kolManageApi.createPrompt(selectedPackageId.value!, body),
   onSuccess: () => {
-    message.success(t("kol.manage.createPrompt") + "成功");
-    queryClient.invalidateQueries({
+    message.success(t("kol.manage.messages.promptCreated"));
+    void queryClient.invalidateQueries({
       queryKey: ["kol", "packages", selectedPackageId.value, "prompts"],
     });
   },
@@ -111,7 +114,7 @@ const togglePromptStatusMutation = useMutation({
   },
   onSuccess: (_, variables) => {
     message.success(
-      t(variables.nextStatus === "active" ? "kol.manage.activatePrompt" : "kol.manage.archivePrompt") + "成功"
+      t(variables.nextStatus === "active" ? "kol.manage.messages.promptActivated" : "kol.manage.messages.promptArchived")
     );
     void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
     void queryClient.invalidateQueries({
@@ -131,7 +134,7 @@ const deletePromptMutation = useMutation({
     deletingPromptId.value = id;
   },
   onSuccess: (_, id) => {
-    message.success(t("common.delete") + "成功");
+    message.success(t("kol.manage.messages.promptDeleted"));
     void queryClient.invalidateQueries({ queryKey: ["kol", "packages"] });
     void queryClient.invalidateQueries({
       queryKey: ["kol", "packages", selectedPackageId.value, "prompts"],
@@ -180,7 +183,7 @@ function handlePackageSubmit(body: CreateKolPackageRequest) {
 function handleDeletePackage(id: number) {
   Modal.confirm({
     title: t("common.delete") + "?",
-    content: "确定要删除这个订阅包吗？",
+    content: t("kol.manage.confirmDeletePackage"),
     onOk: () => deletePackageMutation.mutate(id),
   });
 }
@@ -201,7 +204,7 @@ function handleCloseEditor() {
 function handleDeletePrompt(id: number) {
   Modal.confirm({
     title: t("common.delete") + "?",
-    content: "确定要删除这个提示词吗？",
+    content: t("kol.manage.confirmDeletePrompt"),
     onOk: () => deletePromptMutation.mutate(id),
   });
 }
@@ -211,6 +214,12 @@ function promptStatusLabel(status: string) {
   if (status === "archived") return t("kol.manage.status.archived");
   return t("kol.manage.status.draft");
 }
+
+function packageStatusLabel(status: string) {
+  if (status === "published") return t("kol.manage.packageStatus.published");
+  if (status === "archived") return t("kol.manage.packageStatus.archived");
+  return t("kol.manage.packageStatus.draft");
+}
 </script>
 
 <template>
@@ -223,7 +232,7 @@ function promptStatusLabel(status: string) {
     <div v-else class="manage-content">
         <div class="package-column">
           <div class="column-header">
-            <h3>订阅包</h3>
+            <h3>{{ t("kol.manage.packageTitle") }}</h3>
             <a-button type="primary" size="small" @click="handleCreatePackage">
               <template #icon><PlusOutlined /></template>
               {{ t('kol.manage.createPackage') }}
@@ -234,7 +243,6 @@ function promptStatusLabel(status: string) {
             class="package-list"
             :loading="packagesPending"
             :data-source="packages"
-            size="small"
           >
             <template #renderItem="{ item }">
               <a-list-item
@@ -244,10 +252,13 @@ function promptStatusLabel(status: string) {
                 <div class="package-item-content">
                   <div class="package-name">{{ item.name }}</div>
                   <div class="package-meta">
-                    <a-tag :color="item.status === 'published' ? 'green' : 'orange'" size="small">
-                      {{ item.status }}
+                    <a-tag
+                      :color="item.status === 'published' ? 'green' : item.status === 'archived' ? 'orange' : 'default'"
+                      size="small"
+                    >
+                      {{ packageStatusLabel(item.status) }}
                     </a-tag>
-                    <span>{{ item.prompt_count }} 提示词</span>
+                    <span>{{ t("kol.marketplace.prompts", { count: item.prompt_count }) }}</span>
                   </div>
                 </div>
                 <template #actions>
@@ -287,7 +298,7 @@ function promptStatusLabel(status: string) {
         <div class="prompt-column">
           <template v-if="selectedPackageId">
             <div class="column-header">
-              <h3>提示词</h3>
+              <h3>{{ t("kol.manage.promptTitle") }}</h3>
               <a-button type="primary" size="small" @click="promptModalOpen = true">
                 <template #icon><PlusOutlined /></template>
                 {{ t('kol.manage.createPrompt') }}
@@ -295,6 +306,7 @@ function promptStatusLabel(status: string) {
             </div>
 
             <a-table
+              class="modern-table"
               :columns="[
                 { title: t('common.title'), dataIndex: 'name', key: 'name' },
                 { title: t('tracking.columns.platform'), dataIndex: 'platform_hint', key: 'platform_hint' },
@@ -303,12 +315,11 @@ function promptStatusLabel(status: string) {
               ]"
               :data-source="prompts"
               :loading="promptsPending"
-              size="small"
               :pagination="false"
             >
               <template #bodyCell="{ column, record }">
                 <template v-if="column.key === 'platform_hint'">
-                  <a-tag color="blue">{{ record.platform_hint || '通用' }}</a-tag>
+                  <a-tag color="blue">{{ record.platform_hint || t("kol.manage.platformHintDefault") }}</a-tag>
                 </template>
                 <template v-else-if="column.key === 'status'">
                   <a-tag :color="record.status === 'active' ? 'green' : record.status === 'archived' ? 'orange' : 'default'">
@@ -367,7 +378,7 @@ function promptStatusLabel(status: string) {
             </a-table>
           </template>
           <div v-else class="empty-prompts">
-            <a-empty description="请选择左侧订阅包以查看提示词" />
+            <a-empty :description="t('kol.manage.emptyPromptSelection')" />
           </div>
         </div>
       </div>
@@ -390,7 +401,7 @@ function promptStatusLabel(status: string) {
 .kol-manage-view {
   display: flex;
   flex-direction: column;
-  height: calc(100vh - 64px);
+  height: calc(100vh - 120px);
 }
 
 .fullscreen-editor {
@@ -398,63 +409,74 @@ function promptStatusLabel(status: string) {
   min-height: 0;
   border-radius: 12px;
   overflow: hidden;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
 }
 
 .manage-content--editor {
-  padding: 16px;
+  padding: 24px;
 }
 
 .manage-content {
   flex: 1;
   display: flex;
   overflow: hidden;
-  padding: 16px;
-  gap: 16px;
+  padding: 24px;
+  gap: 24px;
 }
 
 .package-column {
-  width: 320px;
-  background: #fff;
-  border-radius: 8px;
+  width: 340px;
+  background: #ffffff;
+  border-radius: 12px;
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.02), 0 4px 8px -2px rgba(0, 0, 0, 0.04);
+  border: 1px solid #f0f2f5;
   display: flex;
   flex-direction: column;
 }
 
 .prompt-column {
   flex: 1;
-  background: #fff;
-  border-radius: 8px;
+  background: #ffffff;
+  border-radius: 12px;
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.02), 0 4px 8px -2px rgba(0, 0, 0, 0.04);
+  border: 1px solid #f0f2f5;
   display: flex;
   flex-direction: column;
   min-width: 0;
 }
 
 .column-header {
-  padding: 16px;
+  padding: 20px 24px;
   border-bottom: 1px solid #f0f0f0;
   display: flex;
   justify-content: space-between;
   align-items: center;
+  flex-shrink: 0;
 }
 
 .column-header h3 {
   margin: 0;
   font-size: 16px;
+  font-weight: 600;
+  color: #111827;
 }
 
 .package-list {
   flex: 1;
   overflow-y: auto;
+  padding: 12px;
 }
 
 .package-item-content {
   display: flex;
   flex-direction: column;
-  gap: 4px;
+  gap: 6px;
 }
 
 .package-name {
-  font-weight: 500;
+  font-weight: 600;
+  font-size: 14px;
+  color: #1f2937;
 }
 
 .package-meta {
@@ -462,20 +484,29 @@ function promptStatusLabel(status: string) {
   align-items: center;
   gap: 8px;
   font-size: 12px;
-  color: #8c8c8c;
-}
-
-.ant-list-item.is-selected {
-  background-color: #e6f7ff;
+  color: #6b7280;
 }
 
 .ant-list-item {
+  border-radius: 8px;
+  padding: 12px 16px;
+  margin-bottom: 8px;
+  border: 1px solid transparent;
   cursor: pointer;
-  transition: background-color 0.3s;
+  transition: all 0.2s ease;
+}
+
+.ant-list-item:last-child {
+  margin-bottom: 0;
 }
 
 .ant-list-item:hover {
-  background-color: #fafafa;
+  background-color: #f9fafb;
+}
+
+.ant-list-item.is-selected {
+  background-color: #f0f7ff;
+  border-color: #bae0ff;
 }
 
 .empty-prompts {
@@ -490,29 +521,61 @@ function promptStatusLabel(status: string) {
   min-height: 0;
 }
 
+/* Modern Enterprise Table Styles */
+:deep(.modern-table) {
+  padding: 24px;
+}
+
+:deep(.modern-table .ant-table-thead > tr > th) {
+  background-color: #f9fafb !important;
+  color: #4b5563;
+  font-weight: 600;
+  border-bottom: 1px solid #f3f4f6;
+  padding: 12px 16px;
+}
+
+:deep(.modern-table .ant-table-tbody > tr > td) {
+  padding: 16px;
+  border-bottom: 1px solid #f3f4f6;
+  color: #1f2937;
+}
+
+:deep(.modern-table .ant-table-tbody > tr:last-child > td) {
+  border-bottom: none;
+}
+
+:deep(.modern-table .ant-table-tbody > tr:hover > td) {
+  background-color: #f9fafb !important;
+}
+
 .table-actions-row {
   display: inline-flex;
   align-items: center;
-  gap: 4px;
+  gap: 6px;
+}
+
+.action-btn {
+  color: #6b7280;
+  transition: all 0.2s;
 }
 
 .action-edit.ant-btn:hover:not(:disabled) {
-  color: #52c41a;
-  background: #f6ffed;
+  color: #059669;
+  background: #d1fae5;
 }
 
 .action-enable.ant-btn:hover:not(:disabled) {
-  color: #1677ff;
-  background: #e6f4ff;
+  color: #2563eb;
+  background: #dbeafe;
 }
 
 .action-disable.ant-btn:hover:not(:disabled) {
-  color: #fa8c16;
-  background: #fff7e6;
+  color: #d97706;
+  background: #fef3c7;
 }
 
 .action-delete.ant-btn:hover:not(:disabled) {
-  color: #ff4d4f;
-  background: #fff1f0;
+  color: #dc2626;
+  background: #fee2e2;
 }
 </style>