1.0.3 的相关功能

src/views/admin/customer/customeraudit.vue

@@ -70,20 +70,80 @@
   <el-dialog v-model="detailDialogVisible" title="详情">
     <div v-if="detailRow" v-html="detailRow.desc_collect" class="detils-content"></div>
   </el-dialog>
-  <el-dialog v-model="audetDialogVisible" title="审核" width="360px">
-    <el-form :model="audetForm" label-width="0">
-      <el-form-item>
+  <el-dialog v-model="audetDialogVisible" title="审核" width="700px">
+    <!-- 客户标记无效 原因与附件回显 -->
+    <div style="margin-bottom: 16px">
+      <div style="margin-bottom: 8px">
+        <span>标记原因:</span>
+        <span>{{ reportRemark || '-' }}</span>
+      </div>
+      <div>
+        <span>附件说明：</span>
+        <div
+          v-if="reportAttachments.length"
+          style="margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px"
+        >
+          <div
+            v-for="(att, idx) in reportAttachments"
+            :key="idx"
+            style="
+              display: flex;
+              align-items: center;
+              gap: 6px;
+              border: 1px solid #f0f0f0;
+              padding: 6px 8px;
+              border-radius: 6px;
+            "
+          >
+            <template v-if="/\.(jpg|jpeg|png|gif|webp|bmp)(\?.*)?$/i.test(att.url)">
+              <img
+                :src="att.url"
+                :alt="att.name"
+                style="
+                  width: 56px;
+                  height: 56px;
+                  object-fit: cover;
+                  border-radius: 4px;
+                  cursor: pointer;
+                "
+                @click="openImagePreview(att.url)"
+              />
+            </template>
+            <template v-else>
+              <i class="iconfont-sys">&#xe7b8;</i>
+            </template>
+            <el-link
+              v-if="!/\.(jpg|jpeg|png|gif|webp|bmp)(\?.*)?$/i.test(att.url)"
+              type="primary"
+              :underline="false"
+              @click="downloadAttachment(att)"
+              >下载</el-link
+            >
+          </div>
+        </div>
+        <el-empty v-else description="暂无附件" style="--el-empty-padding: 10px 0" />
+      </div>
+    </div>
+    <el-form :model="audetForm" label-width="50px">
+      <el-form-item label="操作">
         <el-select v-model="audetForm.scene" filterable placeholder="请选择" style="width: 100%">
           <el-option label="彻底删除" value="delete" />
           <el-option label="恢复至公海" value="report" />
         </el-select>
       </el-form-item>
-      <div style="display: flex; justify-content: space-around; margin-top: 24px">
+      <div style="display: flex; justify-content: flex-end; margin-top: 24px">
         <el-button @click="audetDialogVisible = false">取消</el-button>
         <el-button type="primary" @click="handleAudetSubmit">确定</el-button>
       </div>
     </el-form>
   </el-dialog>
+  <!-- 图片预览 -->
+  <el-image-viewer
+    v-if="imageViewerVisible"
+    :url-list="imageViewerUrls"
+    :initial-index="imageViewerIndex"
+    @close="imageViewerVisible = false"
+  />
 </template>
 
 <script setup lang="ts">
@@ -96,6 +156,33 @@
   const detailDialogVisible = ref(false)
   const audetDialogVisible = ref(false)
   const detailRow = ref<any>(null)
+  // 回显的无效原因与附件
+  const reportRemark = ref<string>('')
+  const reportAttachments = ref<Array<{ name: string; url: string }>>([])
+  const imageViewerVisible = ref(false)
+  const imageViewerUrls = ref<string[]>([])
+  const imageViewerIndex = ref(0)
+  // 规范化 URL：去除前缀 @，清理空白
+  const normalizeUrl = (url: string): string => {
+    return (url || '').trim().replace(/^@+/, '')
+  }
+  // 从 URL 提取文件名（忽略查询参数）
+  const fileNameFromUrl = (url: string): string => {
+    const u = normalizeUrl(url)
+    try {
+      const parsed = new URL(u)
+      const name = parsed.pathname.split('/').pop() || ''
+      return decodeURIComponent(name)
+    } catch (_) {
+      const path = u.split('?')[0]
+      const name = path.split('/').pop() || u
+      try {
+        return decodeURIComponent(name)
+      } catch {
+        return name
+      }
+    }
+  }
   const pagination = reactive({
     currentPage: 1,
     pageSize: 10,
@@ -163,8 +250,53 @@
   //审核
   const goaudit = async (row: any) => {
     audetForm.id = row.id
+    // 保存行数据用于展示
+    detailRow.value = row
+    // 兼容字段：优先 remark，其次 report_desc/desc
+    reportRemark.value = row.audit?.remark || ''
+    // 映射为可用的 {name, url}
+    reportAttachments.value = (row.audit?.img || [])
+      .map((it: any) => {
+        if (typeof it === 'string') {
+          const url = normalizeUrl(it)
+          return { name: fileNameFromUrl(url) || url, url }
+        }
+        const url = normalizeUrl(it.storage_path_full || it.url || it.file_url || '')
+        const name = it.original_name || it.name || it.file_name || fileNameFromUrl(url) || ''
+        return { name, url }
+      })
+      .filter((x: { url: any }) => x.url)
+    // 仅图片列表用于预览
+    imageViewerUrls.value = reportAttachments.value
+      .map((x) => normalizeUrl(x.url))
+      .filter((u) => /\.(jpg|jpeg|png|gif|webp|bmp)(\?.*)?$/i.test(u))
     audetDialogVisible.value = true
   }
+
+  const openImagePreview = (url: string) => {
+    const nurl = normalizeUrl(url)
+    // 按当前附件重建预览列表（确保与点击地址一致且包含查询参数的图片）
+    const imgs = reportAttachments.value
+      .map((x) => normalizeUrl(x.url))
+      .filter((u) => /\.(jpg|jpeg|png|gif|webp|bmp)(\?.*)?$/i.test(u))
+    imageViewerUrls.value = imgs.length > 0 ? imgs : [nurl]
+    const idx = imageViewerUrls.value.findIndex((u) => u === nurl)
+    imageViewerIndex.value = idx >= 0 ? idx : 0
+    imageViewerVisible.value = true
+  }
+
+  const downloadAttachment = (att: { name: string; url: string }) => {
+    try {
+      const a = document.createElement('a')
+      a.href = att.url
+      a.download = att.name || '附件'
+      document.body.appendChild(a)
+      a.click()
+      document.body.removeChild(a)
+    } catch (e) {
+      console.error('下载失败', e)
+    }
+  }
   const handleAudetSubmit = async () => {
     const res = await manageService.crmCustomerAudit(audetForm)
     ElMessage.success(res?.message || '设置成功！')