From 2e2cbb49767c0bb0abdb92528b51cc5e184f976b Mon Sep 17 00:00:00 2001
From: caoxiaozhu <leocaoxiaozhu@gmail.com>
Date: Sat, 25 Jul 2026 21:59:02 +0800
Subject: [PATCH] =?UTF-8?q?fix(data-process):=20=E5=AF=B9=E9=BD=90?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=9B=86=E5=90=8D=E7=A7=B0=E8=B5=B7=E7=82=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../regression-data-process-detail.mjs        |  5 ++-
 .../data-process/DataProcessDetailView.vue    | 39 ++++++++++++-------
 2 files changed, 28 insertions(+), 16 deletions(-)

diff --git a/frontend/scripts/regression-data-process-detail.mjs b/frontend/scripts/regression-data-process-detail.mjs
index 69147be..69495b8 100644
--- a/frontend/scripts/regression-data-process-detail.mjs
+++ b/frontend/scripts/regression-data-process-detail.mjs
@@ -56,8 +56,9 @@ assert.match(detailSource, /publishDataProcess\(taskId\.value,/, '发布数据
 assert.match(detailSource, /path: '\/dataset', query: \{ tab: 'task', task_id: taskId\.value \}/, '发布成功后未进入数据任务列表')
 assert.match(detailSource, /published\.datasets \|\| published\.output_datasets/, '发布成功后未读取三个独立数据集')
 assert.match(detailSource, /v-for="dataset in outputDatasets"/, '任务详情未展示三个输出数据集入口')
-assert.match(detailSource, /class="output-dataset-row"[\s\S]*?class="output-dataset-links"/, '输出数据集没有独立的多行对齐布局')
-assert.match(detailSource, /\.output-dataset-links[\s\S]*?flex-direction:\s*column[\s\S]*?align-items:\s*flex-end/, '输出数据集链接没有按右侧纵向对齐')
+assert.match(detailSource, /class="output-dataset-row"[\s\S]*?class="output-dataset-cell"[\s\S]*?class="output-dataset-links"/, '输出数据集没有独立的多行对齐布局')
+assert.match(detailSource, /\.output-dataset-links[\s\S]*?display:\s*inline-grid[\s\S]*?grid-template-columns:\s*max-content[\s\S]*?text-align:\s*left/, '输出数据集名称没有统一左边缘')
+assert.match(detailSource, /\.output-dataset-links[\s\S]*?\.el-button[\s\S]*?width:\s*100%[\s\S]*?margin-left:\s*0/, '输出数据集链接没有清除默认间距或统一宽度')
 assert.match(detailSource, /将发布三个独立数据集/, '发布说明仍未明确生成三个独立数据集')
 assert.match(detailSource, /outputDatasetBaseName\.value/, '重新同步时未使用单一基础名称')
 assert.doesNotMatch(detailSource, /label="数据集类型"/, '发布三个数据集时不应再选择单一数据集类型')
diff --git a/frontend/src/views/data-process/DataProcessDetailView.vue b/frontend/src/views/data-process/DataProcessDetailView.vue
index ab3a5c0..88f94d8 100644
--- a/frontend/src/views/data-process/DataProcessDetailView.vue
+++ b/frontend/src/views/data-process/DataProcessDetailView.vue
@@ -581,15 +581,17 @@ onBeforeUnmount(() => {
             <div><dt>源数据集</dt><dd>{{ sourceDatasetName }}</dd></div>
             <div class="output-dataset-row">
               <dt>输出数据集</dt>
-              <dd class="output-dataset-links">
-                <el-button
-                  v-for="dataset in outputDatasets"
-                  :key="String(dataset.id)"
-                  type="primary"
-                  link
-                  @click="router.push(`/dataset/${dataset.id}/preview`)"
-                >{{ dataset.name }}（{{ dataset.count || 0 }} 条）<i class="fa fa-external-link" /></el-button>
-                <span v-if="!outputDatasets.length">尚未发布为数据集</span>
+              <dd class="output-dataset-cell">
+                <div v-if="outputDatasets.length" class="output-dataset-links">
+                  <el-button
+                    v-for="dataset in outputDatasets"
+                    :key="String(dataset.id)"
+                    type="primary"
+                    link
+                    @click="router.push(`/dataset/${dataset.id}/preview`)"
+                  >{{ dataset.name }}（{{ dataset.count || 0 }} 条）<i class="fa fa-external-link" /></el-button>
+                </div>
+                <span v-else>尚未发布为数据集</span>
               </dd>
             </div>
           </dl>
@@ -856,19 +858,28 @@ onBeforeUnmount(() => {
   dt { padding-top: 2px; line-height: 24px; }
 }
 
+.output-dataset-cell { min-width: 0; }
+
 .output-dataset-links {
+  max-width: 100%;
   min-width: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
+  display: inline-grid;
+  grid-template-columns: max-content;
   gap: 4px;
+  text-align: left;
 
   :deep(.el-button) {
+    width: 100%;
     max-width: 100%;
     margin-left: 0;
-    justify-content: flex-end;
+    justify-content: flex-start;
     line-height: 24px;
-    text-align: right;
+    white-space: normal;
+  }
+
+  :deep(.el-button i) {
+    margin-left: auto;
+    padding-left: 12px;
   }
 }