From 836f5608e00f5d8f55881a40396d01ed815e7c08 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Sun, 2 Nov 2025 16:01:16 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BE=8E=E5=8C=96pagetype=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/core/pagetype/GenericListPage.vue     | 12 +++++++++++
 .../core/pagetype/GenericListPageActions.vue  | 17 +++-------------
 .../local_ai_agent_list_actions.vue           | 20 +++----------------
 .../local_ai_node_list_actions.vue            | 20 +++----------------
 4 files changed, 21 insertions(+), 48 deletions(-)

diff --git a/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue b/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
index 9ec5a8f..f8035fb 100644
--- a/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/GenericListPage.vue
@@ -1455,6 +1455,18 @@ function formatDisplayValue(value: any, fieldName: string) {
 /* 工具栏容器样式（保留用于布局） */
 .header-right { display: flex; align-items: center; gap: 12px; }
 
+/* 卡片视图操作按钮容器样式（为自定义操作组件提供 footer 样式） */
+.card-actions {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  padding: 8px 16px;
+  border-top: 1px solid #f3f4f6;
+  background: #fafbfc;
+  margin-top: auto;
+}
+
 /* 表格操作列样式 - 与 AgentList 完全一致 */
 .col-actions {
   display: flex;
diff --git a/apps/jingrow/frontend/src/core/pagetype/GenericListPageActions.vue b/apps/jingrow/frontend/src/core/pagetype/GenericListPageActions.vue
index ed236fa..ee5dd0c 100644
--- a/apps/jingrow/frontend/src/core/pagetype/GenericListPageActions.vue
+++ b/apps/jingrow/frontend/src/core/pagetype/GenericListPageActions.vue
@@ -33,8 +33,9 @@ const props = defineProps<Props>()
 const emit = defineEmits<Emits>()
 
 // 根据视图模式决定容器类名
+// 注意：卡片视图时父元素已经提供了 card-actions 容器和样式，所以只使用 col-actions
 const containerClass = computed(() => {
-  return props.viewMode === 'card' ? 'card-actions' : 'col-actions'
+  return 'col-actions'
 })
 
 function handleView() {
@@ -51,19 +52,7 @@ function handleDelete() {
 </script>
 
 <style scoped>
-/* 卡片视图操作按钮容器 */
-.card-actions { 
-  display: flex; 
-  align-items: center; 
-  justify-content: center;
-  gap: 4px; 
-  padding: 8px 16px;
-  border-top: 1px solid #f3f4f6;
-  background: #fafbfc;
-  margin-top: auto;
-}
-
-/* 列表视图操作按钮容器 */
+/* 列表视图操作按钮容器 - 卡片视图时由父元素的 card-actions 提供样式 */
 .col-actions {
   display: flex;
   align-items: center;
diff --git a/apps/jingrow/frontend/src/views/pagetype/local_ai_agent/local_ai_agent_list_actions.vue b/apps/jingrow/frontend/src/views/pagetype/local_ai_agent/local_ai_agent_list_actions.vue
index 566271e..76da21f 100644
--- a/apps/jingrow/frontend/src/views/pagetype/local_ai_agent/local_ai_agent_list_actions.vue
+++ b/apps/jingrow/frontend/src/views/pagetype/local_ai_agent/local_ai_agent_list_actions.vue
@@ -1,7 +1,6 @@
 <template>
-  <!-- 使用与默认组件相同的结构：card-actions 外层，col-actions 内层 -->
-  <div class="card-actions">
-    <div class="col-actions">
+  <!-- 只使用 col-actions，父元素在卡片视图时会提供 card-actions 样式 -->
+  <div class="col-actions">
     <!-- 默认操作按钮 -->
     <button class="action-btn" @click.stop="context.openDetail(context.row.name)" :title="context.t('View')">
       <i class="fa fa-eye"></i>
@@ -29,7 +28,6 @@
     <button class="action-btn delete-btn" @click.stop="context.deleteRecord(context.row.name)" :title="context.t('Delete')">
       <i class="fa fa-trash"></i>
     </button>
-    </div>
   </div>
 </template>
 
@@ -130,19 +128,7 @@ async function handleFlowBuilder() {
 </script>
 
 <style scoped>
-/* 与默认组件完全相同的卡片视图样式 */
-.card-actions { 
-  display: flex; 
-  align-items: center; 
-  justify-content: center;
-  gap: 4px; 
-  padding: 8px 16px;
-  border-top: 1px solid #f3f4f6;
-  background: #fafbfc;
-  margin-top: auto;
-}
-
-/* 与默认组件完全相同的列表视图样式 */
+/* 列表视图样式 - 只提供按钮排列，无背景 */
 .col-actions {
   display: flex;
   align-items: center;
diff --git a/apps/jingrow/frontend/src/views/pagetype/local_ai_node/local_ai_node_list_actions.vue b/apps/jingrow/frontend/src/views/pagetype/local_ai_node/local_ai_node_list_actions.vue
index 88f695b..28232a8 100644
--- a/apps/jingrow/frontend/src/views/pagetype/local_ai_node/local_ai_node_list_actions.vue
+++ b/apps/jingrow/frontend/src/views/pagetype/local_ai_node/local_ai_node_list_actions.vue
@@ -1,7 +1,6 @@
 <template>
-  <!-- 使用与默认组件相同的结构：card-actions 外层，col-actions 内层 -->
-  <div class="card-actions">
-    <div class="col-actions">
+  <!-- 只使用 col-actions，父元素在卡片视图时会提供 card-actions 样式 -->
+  <div class="col-actions">
     <!-- 默认操作按钮 -->
     <button class="action-btn" @click.stop="context.openDetail(context.row.name)" :title="context.t('View')">
       <i class="fa fa-eye"></i>
@@ -21,7 +20,6 @@
     <button class="action-btn delete-btn" @click.stop="context.deleteRecord(context.row.name)" :title="context.t('Delete')">
       <i class="fa fa-trash"></i>
     </button>
-    </div>
   </div>
 
   <!-- Schema 编辑器模态框 - 使用 Teleport 渲染到 body，避免事件冒泡问题 -->
@@ -142,19 +140,7 @@ async function handleSchemaSave(schemaData: any) {
 </script>
 
 <style scoped>
-/* 与默认组件完全相同的卡片视图样式 */
-.card-actions { 
-  display: flex; 
-  align-items: center; 
-  justify-content: center;
-  gap: 4px; 
-  padding: 8px 16px;
-  border-top: 1px solid #f3f4f6;
-  background: #fafbfc;
-  margin-top: auto;
-}
-
-/* 与默认组件完全相同的列表视图样式 */
+/* 列表视图样式 - 只提供按钮排列，无背景 */
 .col-actions {
   display: flex;
   align-items: center;