From e50d2c27c80705a7dd019557f8fbcbce83ce7b88 Mon Sep 17 00:00:00 2001
From: wuzilong <704541015@qq.com>
Date: Mon, 14 Sep 2026 11:30:55 +0800
Subject: [PATCH] feat(web-admin): show remark-based names on bx attachment
 cards

Add optional remark prop to BxAttachmentUpload and BxAttachmentReadonly so cards display sanitized remark_index names while download keeps the original fileName.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .../bx/base/BxAttachmentReadonly.vue          | 29 +++++++++++++++----
 .../components/bx/base/BxAttachmentUpload.vue | 23 +++++++++++++--
 2 files changed, 43 insertions(+), 9 deletions(-)

diff --git a/web-admin/src/components/bx/base/BxAttachmentReadonly.vue b/web-admin/src/components/bx/base/BxAttachmentReadonly.vue
index 5d84ffb9c..3b27eba89 100644
--- a/web-admin/src/components/bx/base/BxAttachmentReadonly.vue
+++ b/web-admin/src/components/bx/base/BxAttachmentReadonly.vue
@@ -2,7 +2,7 @@
   <div v-if="displayFiles.length" class="attachment-upload">
     <div class="attachment-list">
       <div
-        v-for="file in displayFiles"
+        v-for="(file, index) in displayFiles"
         :key="String(file.id)"
         class="attachment-item"
       >
@@ -16,7 +16,7 @@
           @click="canBxPreview(file) ? handlePreview(file) : undefined"
         >
           <template v-if="isBxImageFile(file) && file.previewUrl">
-            <img :src="file.previewUrl" :alt="file.fileName" />
+            <img :src="file.previewUrl" :alt="displayNameOf(file, index)" />
           </template>
           <template v-else-if="isBxImageFile(file)">
             <div class="attachment-preview__icon attachment-preview__icon--image">
@@ -41,7 +41,9 @@
           </template>
         </div>
         <div class="attachment-footer">
-          <span class="attachment-name" :title="file.fileName">{{ file.fileName }}</span>
+          <span class="attachment-name" :title="displayNameOf(file, index)">{{
+            displayNameOf(file, index)
+          }}</span>
           <div class="attachment-actions">
             <el-icon
               v-if="canBxPreview(file)"
@@ -103,10 +105,17 @@ import {
   previewBxAttachment,
   fillBxAttachmentPreviews
 } from '@/utils/bx/attachment'
+import { buildApplyAttachmentDisplayName } from '@/utils/bx/attachment-display-name'
 
-const props = defineProps<{
-  files: BxAttachmentItem[]
-}>()
+const props = withDefaults(
+  defineProps<{
+    files: BxAttachmentItem[]
+    remark?: string
+  }>(),
+  {
+    remark: ''
+  }
+)
 
 const displayFiles = ref<BxAttachmentItem[]>([])
 const previewVisible = ref(false)
@@ -126,6 +135,14 @@ watch(
   { immediate: true, deep: true }
 )
 
+function displayNameOf(file: BxAttachmentItem, index: number) {
+  return buildApplyAttachmentDisplayName({
+    remark: props.remark || '',
+    originalFileName: file.fileName || '',
+    index1: index + 1
+  })
+}
+
 function handleDownload(file: BxAttachmentItem) {
   downloadBxAttachment(file)
 }
diff --git a/web-admin/src/components/bx/base/BxAttachmentUpload.vue b/web-admin/src/components/bx/base/BxAttachmentUpload.vue
index 8bfac137f..4e6593ae2 100644
--- a/web-admin/src/components/bx/base/BxAttachmentUpload.vue
+++ b/web-admin/src/components/bx/base/BxAttachmentUpload.vue
@@ -41,7 +41,11 @@
           @click="canBxPreview(file) ? handlePreview(file) : undefined"
         >
           <template v-if="isBxImageFile(file) && (file.previewUrl || file._uploading)">
-            <img v-if="file.previewUrl" :src="file.previewUrl" :alt="file.fileName" />
+            <img
+              v-if="file.previewUrl"
+              :src="file.previewUrl"
+              :alt="displayNameOf(file, index)"
+            />
             <el-icon v-else :size="24" color="#94a3b8"><Loading /></el-icon>
           </template>
           <template v-else-if="isBxImageFile(file) && !file.previewUrl">
@@ -65,7 +69,9 @@
           </template>
         </div>
         <div class="attachment-footer">
-          <span class="attachment-name" :title="file.fileName">{{ file.fileName }}</span>
+          <span class="attachment-name" :title="displayNameOf(file, index)">{{
+            displayNameOf(file, index)
+          }}</span>
           <div class="attachment-actions">
             <el-icon
               v-if="canBxPreview(file)"
@@ -145,6 +151,7 @@
     downloadBxAttachment,
     previewBxAttachment
   } from '@/utils/bx/attachment'
+  import { buildApplyAttachmentDisplayName } from '@/utils/bx/attachment-display-name'
 
   const props = withDefaults(
     defineProps<{
@@ -154,12 +161,14 @@
       hint?: string
       showHint?: boolean
       disabled?: boolean
+      remark?: string
     }>(),
     {
       bizId: 0,
       hint: '支持图片、视频、PDF、Word、Excel等文件；可拖拽或在此区域粘贴上传',
       showHint: true,
-      disabled: false
+      disabled: false,
+      remark: ''
     }
   )
 
@@ -197,6 +206,14 @@
     emit('update:modelValue', next)
   }
 
+  function displayNameOf(file: BxAttachmentItem, index: number) {
+    return buildApplyAttachmentDisplayName({
+      remark: props.remark || '',
+      originalFileName: file.fileName || '',
+      index1: index + 1
+    })
+  }
+
   function normalizeIncomingFile(file: File, index = 0) {
     if (file.name && file.name.trim()) return file
     const ext = (file.type || '').split('/')[1] || 'bin'