From dcf8c39d465aa2f018f43ab59620f10af21a5270 Mon Sep 17 00:00:00 2001
From: linyongLynn <15926056+linyonglynn@user.noreply.gitee.com>
Date: Thu, 16 Oct 2025 17:17:03 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=85=A7=E7=89=87=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/visit/check.vue               |  74 +++++++++++++----
 src/views/visit/component/showVisit.vue |  56 ++++++++-----
 src/views/visit/record.vue              | 105 ++++++++++++++++++------
 3 files changed, 175 insertions(+), 60 deletions(-)

diff --git a/src/views/visit/check.vue b/src/views/visit/check.vue
index 76b471e..1461140 100644
--- a/src/views/visit/check.vue
+++ b/src/views/visit/check.vue
@@ -1,11 +1,11 @@
 <template>
   <div style="padding: 0 20px">
     <div ref="lxHeader">
-      <lx-header icon="md-apps" text="拜访记录管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
+      <lx-header icon="md-apps" text="拜访记录审核" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
         <slot>
           <div style="display: flex;align-items: center;" class="selector">
             <!-- 模拟数据开关 -->
-            <div style="margin-right: 15px; padding: 5px 10px; background: #f0f0f0; border-radius: 4px; display: flex; align-items: center;">
+            <div v-if="false" style="margin-right: 15px; padding: 5px 10px; background: #f0f0f0; border-radius: 4px; display: flex; align-items: center;">
               <span style="margin-right: 8px; font-size: 12px; color: #666;">模拟数据:</span>
               <el-switch
                 v-model="useMockData"
@@ -109,8 +109,8 @@
     data() {
       return {
         visible: false,
-        // 模拟数据开关
-        useMockData: true,
+        // 模拟数据开关（隐藏，默认使用真实数据）
+        useMockData: false,
         select: {
           page: 1,
           page_size: 10,
@@ -173,9 +173,21 @@
             end_date: '2024-10-14 18:00:00',
             created_at: '2024-10-13 15:30:00',
             admin: { name: '管理员A' },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=11', description: '访客正面照' },
-              { url: 'https://picsum.photos/300/400?random=12', description: '访客侧面照' }
+            vehicle_images_detail: [
+              { 
+                id: 2001,
+                url: 'https://picsum.photos/300/400?random=11', 
+                original_name: '访客正面照.png',
+                extension: 'png',
+                size: 2544
+              },
+              { 
+                id: 2002,
+                url: 'https://picsum.photos/300/400?random=12', 
+                original_name: '访客侧面照.png',
+                extension: 'png',
+                size: 2231
+              }
             ]
           },
           {
@@ -196,8 +208,14 @@
             end_date: '2024-10-15 20:00:00',
             created_at: '2024-10-13 16:00:00',
             admin: { name: '管理员B' },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=13', description: '施工人员照片' }
+            vehicle_images_detail: [
+              { 
+                id: 2003,
+                url: 'https://picsum.photos/300/400?random=13', 
+                original_name: '施工人员照片.png',
+                extension: 'png',
+                size: 2784
+              }
             ]
           },
           {
@@ -218,9 +236,21 @@
             end_date: '2024-10-14 16:00:00',
             created_at: '2024-10-13 14:20:00',
             admin: { name: '管理员C' },
-            photos: [
-              { url: 'https://picsum.photos/400/300?random=14', description: '车辆前方照片' },
-              { url: 'https://picsum.photos/400/300?random=15', description: '车辆侧面照片' }
+            vehicle_images_detail: [
+              { 
+                id: 2004,
+                url: 'https://picsum.photos/400/300?random=14', 
+                original_name: '车辆前方照片.png',
+                extension: 'png',
+                size: 2686
+              },
+              { 
+                id: 2005,
+                url: 'https://picsum.photos/400/300?random=15', 
+                original_name: '车辆侧面照片.png',
+                extension: 'png',
+                size: 2544
+              }
             ]
           },
           {
@@ -241,8 +271,14 @@
             end_date: '2024-10-16 17:00:00',
             created_at: '2024-10-14 08:30:00',
             admin: { name: '管理员D' },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=16', description: '访客证件照' }
+            vehicle_images_detail: [
+              { 
+                id: 2006,
+                url: 'https://picsum.photos/300/400?random=16', 
+                original_name: '访客证件照.png',
+                extension: 'png',
+                size: 2544
+              }
             ]
           },
           {
@@ -263,8 +299,14 @@
             end_date: '2024-10-15 19:00:00',
             created_at: '2024-10-13 17:15:00',
             admin: { name: '管理员E' },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=17', description: '施工人员照片' }
+            vehicle_images_detail: [
+              { 
+                id: 2007,
+                url: 'https://picsum.photos/300/400?random=17', 
+                original_name: '施工人员照片.png',
+                extension: 'png',
+                size: 2784
+              }
             ]
           }
         ],
diff --git a/src/views/visit/component/showVisit.vue b/src/views/visit/component/showVisit.vue
index 5332db2..7d42448 100644
--- a/src/views/visit/component/showVisit.vue
+++ b/src/views/visit/component/showVisit.vue
@@ -351,28 +351,26 @@
       
       <!-- 照片列表 -->
       <template v-slot:photos>
-        <div class="xy-table-item" v-if="form.photos && form.photos.length > 0">
-          <div class="xy-table-item-content" style="width:100%">
-            <div class="photo-list">
-              <div class="photo-item" v-for="(photo, index) in form.photos" :key="index">
-                <div class="photo-wrapper">
-                  <el-image
-                    :src="photo.url"
-                    :preview-src-list="form.photos.map(p => p.url)"
-                    :initial-index="index"
-                    fit="cover"
-                    class="photo-image">
-                    <div slot="error" class="image-slot">
-                      <i class="el-icon-picture-outline"></i>
-                    </div>
-                  </el-image>
-                  <div class="photo-overlay">
-                    <i class="el-icon-zoom-in"></i>
-                    <span>点击预览</span>
+        <div class="photo-full-width" v-if="form.vehicle_images_detail && form.vehicle_images_detail.length > 0">
+          <div class="photo-list">
+            <div class="photo-item" v-for="(photo, index) in form.vehicle_images_detail" :key="index">
+              <div class="photo-wrapper">
+                <el-image
+                  :src="photo.url"
+                  :preview-src-list="form.vehicle_images_detail.map(p => p.url)"
+                  :initial-index="index"
+                  fit="cover"
+                  class="photo-image">
+                  <div slot="error" class="image-slot">
+                    <i class="el-icon-picture-outline"></i>
                   </div>
+                </el-image>
+                <div class="photo-overlay">
+                  <i class="el-icon-zoom-in"></i>
+                  <span>点击预览</span>
                 </div>
-                <div class="photo-desc">{{ photo.description }}</div>
               </div>
+              <div class="photo-desc">{{ photo.original_name }}</div>
             </div>
           </div>
         </div>
@@ -446,7 +444,7 @@
           accompany_id:"",
           accept_goods_admin_id: "",
           photoinfo: "",
-          photos: "",
+          photos: [],
           checkRecord: '',
           checkForm: {},
           checkText: ''
@@ -714,12 +712,30 @@
     font-size: 32px;
   }
 
+  // 照片全宽容器样式
+  .photo-full-width {
+    width: 100% !important;
+    max-width: none !important;
+    display: block !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    
+    // 突破xy-dialog的布局限制
+    position: relative;
+    left: -50%;
+    width: 200% !important;
+    margin-left: 50% !important;
+  }
+
   // 照片列表样式
   .photo-list {
     display: flex;
     flex-wrap: wrap;
     gap: 15px;
     margin-top: 5px;
+    width: 100%;
+    justify-content: flex-start;
+    max-width: 100%;
     
     .photo-item {
       display: flex;
diff --git a/src/views/visit/record.vue b/src/views/visit/record.vue
index 5156774..2d21c6c 100644
--- a/src/views/visit/record.vue
+++ b/src/views/visit/record.vue
@@ -5,7 +5,7 @@
         <slot>
           <div style="display: flex;align-items: center;" class="selector">
             <!-- 模拟数据开关 -->
-            <div style="margin-right: 15px; padding: 5px 10px; background: #f0f0f0; border-radius: 4px; display: flex; align-items: center;">
+            <div v-if="false" style="margin-right: 15px; padding: 5px 10px; background: #f0f0f0; border-radius: 4px; display: flex; align-items: center;">
               <span style="margin-right: 8px; font-size: 12px; color: #666;">模拟数据:</span>
               <el-switch
                 v-model="useMockData"
@@ -192,17 +192,17 @@
         </el-row>
         
         <!-- 照片信息 -->
-        <el-row :gutter="20" class="detail-row" v-if="currentDetail.photos && currentDetail.photos.length > 0">
+        <el-row :gutter="20" class="detail-row" v-if="currentDetail.vehicle_images_detail && currentDetail.vehicle_images_detail.length > 0">
           <el-col :span="24">
             <div class="detail-item detail-photos">
               <span class="detail-label">照片信息：</span>
               <div class="detail-value">
                 <div class="photo-list">
-                  <div class="photo-item" v-for="(photo, index) in currentDetail.photos" :key="index">
+                  <div class="photo-item" v-for="(photo, index) in currentDetail.vehicle_images_detail" :key="index">
                     <div class="photo-wrapper">
                       <el-image
                         :src="photo.url"
-                        :preview-src-list="currentDetail.photos.map(p => p.url)"
+                        :preview-src-list="currentDetail.vehicle_images_detail.map(p => p.url)"
                         :initial-index="index"
                         fit="cover"
                         class="photo-image">
@@ -215,7 +215,7 @@
                         <span>点击预览</span>
                       </div>
                     </div>
-                    <div class="photo-desc">{{ photo.description }}</div>
+                    <div class="photo-desc">{{ photo.original_name }}</div>
                   </div>
                 </div>
               </div>
@@ -247,8 +247,8 @@
     data() {
       return {
         visible: false,
-        // 模拟数据开关（开发时可设为true，生产环境设为false）
-        useMockData: true,
+        // 模拟数据开关（隐藏，默认使用真实数据）
+        useMockData: false,
         // 详情弹窗控制
         detailVisible: false,
         currentDetail: null,
@@ -321,9 +321,21 @@
             admin: {
               name: '管理员A'
             },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=1', description: '访客正面照' },
-              { url: 'https://picsum.photos/300/400?random=2', description: '访客侧面照' }
+            vehicle_images_detail: [
+              { 
+                id: 1001,
+                url: 'https://picsum.photos/300/400?random=1', 
+                original_name: '访客正面照.png',
+                extension: 'png',
+                size: 2544
+              },
+              { 
+                id: 1002,
+                url: 'https://picsum.photos/300/400?random=2', 
+                original_name: '访客侧面照.png',
+                extension: 'png',
+                size: 2231
+              }
             ]
           },
           {
@@ -349,8 +361,14 @@
             admin: {
               name: '管理员B'
             },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=3', description: '施工人员照片' }
+            vehicle_images_detail: [
+              { 
+                id: 1003,
+                url: 'https://picsum.photos/300/400?random=3', 
+                original_name: '施工人员照片.png',
+                extension: 'png',
+                size: 2784
+              }
             ]
           },
           {
@@ -379,10 +397,28 @@
             admin: {
               name: '管理员C'
             },
-            photos: [
-              { url: 'https://picsum.photos/400/300?random=4', description: '车辆前方照片' },
-              { url: 'https://picsum.photos/400/300?random=5', description: '车辆侧面照片' },
-              { url: 'https://picsum.photos/400/300?random=6', description: '车牌号照片' }
+            vehicle_images_detail: [
+              { 
+                id: 1004,
+                url: 'https://picsum.photos/400/300?random=4', 
+                original_name: '车辆前方照片.png',
+                extension: 'png',
+                size: 2686
+              },
+              { 
+                id: 1005,
+                url: 'https://picsum.photos/400/300?random=5', 
+                original_name: '车辆侧面照片.png',
+                extension: 'png',
+                size: 2544
+              },
+              { 
+                id: 1006,
+                url: 'https://picsum.photos/400/300?random=6', 
+                original_name: '车牌号照片.png',
+                extension: 'png',
+                size: 2231
+              }
             ]
           },
           {
@@ -408,8 +444,14 @@
             admin: {
               name: '管理员D'
             },
-            photos: [
-              { url: 'https://picsum.photos/300/400?random=7', description: '访客证件照' }
+            vehicle_images_detail: [
+              { 
+                id: 1007,
+                url: 'https://picsum.photos/300/400?random=7', 
+                original_name: '访客证件照.png',
+                extension: 'png',
+                size: 2544
+              }
             ]
           },
           {
@@ -434,7 +476,8 @@
             created_at: '2024-10-11 17:15:00',
             admin: {
               name: '管理员E'
-            }
+            },
+            vehicle_images_detail: []
           },
           {
             id: 6,
@@ -458,7 +501,8 @@
             created_at: '2024-10-10 10:00:00',
             admin: {
               name: '管理员F'
-            }
+            },
+            vehicle_images_detail: []
           },
           {
             id: 7,
@@ -485,9 +529,21 @@
             admin: {
               name: '管理员G'
             },
-            photos: [
-              { url: 'https://picsum.photos/400/300?random=8', description: '货车照片' },
-              { url: 'https://picsum.photos/300/400?random=9', description: '司机照片' }
+            vehicle_images_detail: [
+              { 
+                id: 1008,
+                url: 'https://picsum.photos/400/300?random=8', 
+                original_name: '货车照片.png',
+                extension: 'png',
+                size: 2686
+              },
+              { 
+                id: 1009,
+                url: 'https://picsum.photos/300/400?random=9', 
+                original_name: '司机照片.png',
+                extension: 'png',
+                size: 2544
+              }
             ]
           },
           {
@@ -512,7 +568,8 @@
             created_at: '2024-10-12 10:30:00',
             admin: {
               name: '管理员H'
-            }
+            },
+            vehicle_images_detail: []
           }
         ],
         table: [{