diff --git a/src/components/CaseCommon/caseDetailRead.vue b/src/components/CaseCommon/caseDetailRead.vue
index a5678b4..7aa7c2f 100644
--- a/src/components/CaseCommon/caseDetailRead.vue
+++ b/src/components/CaseCommon/caseDetailRead.vue
@@ -130,9 +130,10 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="img" fit="contain"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/> -->
       </div>
     </el-row>
     <el-row>
@@ -157,6 +158,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import ArcGisMapRead from '@/components/Map/arcgisMapRead'
 
@@ -217,6 +219,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -230,14 +235,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
     }
   }
@@ -286,4 +295,15 @@
   .button{
     margin-bottom: 30px;
   }
+    .image-container {
+    margin-left: 40px;
+  }
+  .el-image.image {
+    width: 300px;
+    height: 300px;
+    margin-right: 20px;
+  }
+  /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>

diff --git a/src/components/CaseCommon/caseDetailRead.vue b/src/components/CaseCommon/caseDetailRead.vue
index a5678b4..7aa7c2f 100644
--- a/src/components/CaseCommon/caseDetailRead.vue
+++ b/src/components/CaseCommon/caseDetailRead.vue
@@ -130,9 +130,10 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="img" fit="contain"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/> -->
       </div>
     </el-row>
     <el-row>
@@ -157,6 +158,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import ArcGisMapRead from '@/components/Map/arcgisMapRead'
 
@@ -217,6 +219,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -230,14 +235,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
     }
   }
@@ -286,4 +295,15 @@
   .button{
     margin-bottom: 30px;
   }
+    .image-container {
+    margin-left: 40px;
+  }
+  .el-image.image {
+    width: 300px;
+    height: 300px;
+    margin-right: 20px;
+  }
+  /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>
diff --git a/src/views/caseCommon/caseDetailRead.vue b/src/views/caseCommon/caseDetailRead.vue
index d65cb16..8198db7 100644
--- a/src/views/caseCommon/caseDetailRead.vue
+++ b/src/views/caseCommon/caseDetailRead.vue
@@ -130,14 +130,15 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="imgurl+img" fit="contain" class="image"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/> -->
       </div>
     </el-row>
     <el-row>
       <div class="title">数据流转记录:</div>
-      <el-table :data="recordList" :max-height="450" :header-cell-style="{background:'#f3f3f3'}" class="table" border>
+      <el-table :data="recordList" :max-height="250" :header-cell-style="{background:'#f3f3f3'}" class="table" border>
         <el-table-column prop="operationTypeName" label="操作" align="center"/>
         <el-table-column prop="deptName" label="单位" align="center"/>
         <el-table-column prop="userName" label="人员" align="center"/>
@@ -157,6 +158,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import { historicalRecords } from '@/api/coorBusiness/process'
 import ArcGisMap from '@/components/Map/arcGISMap'
@@ -202,6 +204,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -216,14 +221,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
       // 查询流转记录接口
       this.processForm.processId = this.caseDetail.processId
@@ -286,4 +295,7 @@
     height: 300px;
     margin-right: 20px;
   }
+   /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>

diff --git a/src/components/CaseCommon/caseDetailRead.vue b/src/components/CaseCommon/caseDetailRead.vue
index a5678b4..7aa7c2f 100644
--- a/src/components/CaseCommon/caseDetailRead.vue
+++ b/src/components/CaseCommon/caseDetailRead.vue
@@ -130,9 +130,10 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="img" fit="contain"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="img" fit="contain"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="img" fit="contain"/> -->
       </div>
     </el-row>
     <el-row>
@@ -157,6 +158,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import ArcGisMapRead from '@/components/Map/arcgisMapRead'
 
@@ -217,6 +219,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -230,14 +235,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
     }
   }
@@ -286,4 +295,15 @@
   .button{
     margin-bottom: 30px;
   }
+    .image-container {
+    margin-left: 40px;
+  }
+  .el-image.image {
+    width: 300px;
+    height: 300px;
+    margin-right: 20px;
+  }
+  /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>
diff --git a/src/views/caseCommon/caseDetailRead.vue b/src/views/caseCommon/caseDetailRead.vue
index d65cb16..8198db7 100644
--- a/src/views/caseCommon/caseDetailRead.vue
+++ b/src/views/caseCommon/caseDetailRead.vue
@@ -130,14 +130,15 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="imgurl+img" fit="contain" class="image"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/> -->
       </div>
     </el-row>
     <el-row>
       <div class="title">数据流转记录:</div>
-      <el-table :data="recordList" :max-height="450" :header-cell-style="{background:'#f3f3f3'}" class="table" border>
+      <el-table :data="recordList" :max-height="250" :header-cell-style="{background:'#f3f3f3'}" class="table" border>
         <el-table-column prop="operationTypeName" label="操作" align="center"/>
         <el-table-column prop="deptName" label="单位" align="center"/>
         <el-table-column prop="userName" label="人员" align="center"/>
@@ -157,6 +158,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import { historicalRecords } from '@/api/coorBusiness/process'
 import ArcGisMap from '@/components/Map/arcGISMap'
@@ -202,6 +204,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -216,14 +221,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
       // 查询流转记录接口
       this.processForm.processId = this.caseDetail.processId
@@ -286,4 +295,7 @@
     height: 300px;
     margin-right: 20px;
   }
+   /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>
diff --git a/src/views/caseCommon/caseDetailSupervise.vue b/src/views/caseCommon/caseDetailSupervise.vue
index b3e10f9..b7db8b6 100644
--- a/src/views/caseCommon/caseDetailSupervise.vue
+++ b/src/views/caseCommon/caseDetailSupervise.vue
@@ -130,9 +130,10 @@
       <div class="title">案卷图片:</div>
       <!-- 图片展示 -->
       <div class="image-container">
-        <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in imgList" :key="img" :src="img" :preview-src-list="imgList" fit="contain" class="image"/>
+        <!-- <el-image v-for="img in fileIdVerify" :key="img" :src="imgurl+img" fit="contain" class="image"/>
         <el-image v-for="img in fileIdProcess" :key="img" :src="imgurl+img" fit="contain" class="image"/>
-        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/>
+        <el-image v-for="img in fileIdCheck" :key="img" :src="imgurl+img" fit="contain" class="image"/> -->
       </div>
     </el-row>
     <!--数据流转记录-->
@@ -140,7 +141,7 @@
       <el-col :span="6"><div class="title-header"><i class="el-icon-tickets"/>数据流转记录</div></el-col>
     </el-row>
     <el-row>
-      <el-table :data="recordList" :header-cell-style="{background:'#f3f3f3'}" class="table" border>
+      <el-table :data="recordList" :header-cell-style="{background:'#f3f3f3'}" max-height="250" class="table" border>
         <el-table-column prop="operationTypeName" label="操作" align="center"/>
         <el-table-column prop="deptName" label="单位" align="center"/>
         <el-table-column prop="userName" label="人员" align="center"/>
@@ -191,6 +192,7 @@
 </template>
 
 <script>
+import 'element-ui/lib/theme-chalk/index.css'
 import { getCaseDetail } from '@/api/coorBusiness/case'
 import { getCommonLanguage } from '@/api/coorBusiness/dict'
 import { historicalRecords } from '@/api/coorBusiness/process'
@@ -234,6 +236,9 @@
       } else {
         return true
       }
+    },
+    imgList() {
+      return this.fileIdVerify.concat(this.fileIdProcess).concat(this.fileIdCheck)
     }
   },
   mounted() {
@@ -248,14 +253,18 @@
       this.caseDetail = resDetail.data[0]
 
       // 解析图片id
+      const imgUrl = process.env.BASE_API + '/static/'
       if (this.caseDetail.fileIdVerify) {
         this.fileIdVerify = this.caseDetail.fileIdVerify.split(',')
+        this.fileIdVerify = this.fileIdVerify.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdProcess) {
         this.fileIdProcess = this.caseDetail.fileIdProcess.split(',')
+        this.fileIdProcess = this.fileIdProcess.map(item => imgUrl + item)
       }
       if (this.caseDetail.fileIdCheck) {
         this.fileIdCheck = this.caseDetail.fileIdCheck.split(',')
+        this.fileIdCheck = this.fileIdCheck.map(item => imgUrl + item)
       }
 
       // 查询常用语列表
@@ -342,4 +351,15 @@
   .button{
     margin-bottom: 30px;
   }
+  .image-container {
+    margin-left: 40px;
+  }
+  .el-image.image {
+    width: 300px;
+    height: 300px;
+    margin-right: 20px;
+  }
+  /deep/ .gutter{
+    background-color: #f3f3f3;
+  }
 </style>