图片 样式修改

.env.development

@@ -10,7 +10,7 @@ VUE_APP_BASE_API = '/dev-api'
 
 VUE_APP_ONLYOFFICE_URL = 'http://36.33.26.201:19840'
 # 图片预览路径
-VUE_APP_FILE_URL = 'http://192.168.0.108:58089/smartCar/profile'
+VUE_APP_FILE_URL = 'http://192.168.0.108:8099/smartCar/profile'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.production

@@ -6,7 +6,7 @@ ENV = 'production'
 VUE_APP_ENV = 'production'
 VUE_APP_ONLYOFFICE_URL = 'http://36.33.26.201:19840'
 # 图片预览路径
-VUE_APP_FILE_URL = 'http://192.168.0.108:58089/smartCar/profile'
+VUE_APP_FILE_URL = 'http://192.168.0.108:8099/smartCar/profile'
 
 # 车辆道路监测系统/生产环境
 VUE_APP_BASE_API = '/smart-car-api'

src/views/device/data-recognition/index.vue

@@ -37,18 +37,18 @@
                     <h3>数据列表</h3>
                 </template>
                 <template slot="carColor" slot-scope="{ data }">
-                    <el-tag v-if="data.carColor === '1'" type="success">蓝色</el-tag>
+                    <el-tag v-if="data.carColor === '1'">蓝色</el-tag>
-                    <el-tag v-else-if="data.carColor === '2'" type="warning">绿色</el-tag>
+                    <el-tag v-else-if="data.carColor === '2'" type="success">绿色</el-tag>
                     <el-tag v-else type="info">{{ data.carColor }}</el-tag>
                 </template>
                 <template slot="carType" slot-scope="{ data }">
-                    <el-tag v-if="data.carType === '1'" type="success">油车</el-tag>
+                    <el-tag v-if="data.carType === '1'">油车</el-tag>
-                    <el-tag v-else-if="data.carType === '2'" type="warning">新能源</el-tag>
+                    <el-tag v-else-if="data.carType === '2'" type="success">新能源</el-tag>
                     <el-tag v-else type="info">其他</el-tag>
                 </template>
                 <template slot="recognitionPhoto" slot-scope="{ data }">
-                    <el-image :src="data.recognitionPhoto || test_image" alt="识别照片" class="recognition-photo"
+                    <el-image :src="getImageUrl(data.filePath)" alt="识别照片" class="recognition-photo" fit="cover"
-                        fit="cover" :preview-src-list="previewImageList">
+                        :preview-src-list="previewImageList">
                         <div slot="error" class="image-error">
                             <i class="el-icon-picture"></i>
                         </div>
@@ -142,6 +142,16 @@ export default {
     },
 
     methods: {
+
+        getImageUrl(filePath) {
+            if (filePath) {
+                if (isExternal(filePath)) {
+                    return filePath
+                } else {
+                    return process.env.VUE_APP_FILE_URL + filePath
+                }
+            }
+        },
         /** 初始化默认时间范围 */
         initDefaultTimeRange() {
             const now = new Date()

src/views/device/image-recognition/index.vue

@@ -34,7 +34,7 @@
             <div class="image-grid-container" v-loading="loading">
                 <div v-for="(item, index) in imageList" :key="index" class="image-card">
                     <div class="image-wrapper">
-                        <el-image :src="item.imageUrl || test_image" fit="cover" class="detection-image"
+                        <el-image :src="item.imageUrl || test_image" fit="contain" class="detection-image"
                             :preview-src-list="previewImageList">
                             <div slot="error" class="image-error">
                                 <i class="el-icon-picture"></i>
@@ -91,7 +91,20 @@ export default {
 
     computed: {
         previewImageList() {
-            return this.imageList.map(item => item.imageUrl).filter(url => url)
+            // 从 imageList 中获取所有图片URL
+            return this.imageList
+                .map(item => {
+                    if (item.originalData && item.originalData.filePath) {
+                        const filePath = item.originalData.filePath
+                        if (isExternal(filePath)) {
+                            return filePath
+                        } else {
+                            return process.env.VUE_APP_FILE_URL + filePath
+                        }
+                    }
+                    return item.imageUrl
+                })
+                .filter(url => url)
         },
     },
 
@@ -102,6 +115,15 @@ export default {
     },
 
     methods: {
+        getImageUrl(filePath) {
+            if (filePath) {
+                if (isExternal(filePath)) {
+                    return filePath
+                } else {
+                    return process.env.VUE_APP_FILE_URL + filePath
+                }
+            }
+        },
         /** 初始化默认时间范围 */
         initDefaultTimeRange() {
             const now = new Date()
@@ -183,7 +205,7 @@ export default {
                     // 映射接口返回的数据到前端使用的格式
                     const list = (res.rows || []).map(item => {
                         // 处理图片路径，默认使用 test_image
-                        // let imageUrl = this.test_image
+                        let imageUrl = ''
                         if (item.filePath) {
                             if (isExternal(item.filePath)) {
                                 imageUrl = item.filePath