图片查看

src/dashoo.cn/frontend_web/src/pages/oilsupplier/addtionaudit/_opera/basisdataopera.vue

@@ -436,10 +436,25 @@
                 <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+
+                    <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+                    <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                       <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                          class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                    </div>
+                    </div> -->
                   </template>
                 </el-table-column>
                 <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -449,7 +464,24 @@
                 </el-table-column>
                 <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <el-row align="middle">
+
+                    
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+
+                    <!-- <el-row align="middle">
                       <el-col :span="20">
                         <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                           <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -457,7 +489,10 @@
                           </a>
                         </div>
                       </el-col>
-                    </el-row>
+                    </el-row> -->
+
+
+
                   </template>
                 </el-table-column>
                 <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -661,6 +696,18 @@
   import WfMultiHistory from '@/components/workflow/wfmultihistory.vue'
 import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
 
+
+ // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
+
+
   export default {
     components: {
       WfMultiHistory,
@@ -1681,6 +1728,23 @@ import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
           console.error(err)
         })
       },
+      imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
+      },
       fileurlcut (val, index) {
         let fileurlall = val.split('$')[index]
         let fileurl = fileurlall.split('|')
@@ -1741,4 +1805,10 @@ import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
       background-color: wheat;
    }
 }
+
+   .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

src/dashoo.cn/frontend_web/src/pages/oilsupplier/addtionaudit/_opera/goodsdataopera.vue

@@ -515,10 +515,26 @@
                 <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+                    <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+                    <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                       <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                          class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                    </div>
+                    </div> -->
+
+
                   </template>
                 </el-table-column>
                 <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -528,7 +544,24 @@
                 </el-table-column>
                 <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <el-row align="middle">
+
+
+
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+                    <!-- <el-row align="middle">
                       <el-col :span="20">
                         <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                           <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -536,7 +569,10 @@
                           </a>
                         </div>
                       </el-col>
-                    </el-row>
+                    </el-row> -->
+
+
+
                   </template>
                 </el-table-column>
                 <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -740,6 +776,15 @@
   import WfMultiHistory from '@/components/workflow/wfmultihistory.vue';
   import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
 
+ // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
   export default {
     components: {
       WfMultiHistory,
@@ -1758,6 +1803,23 @@
         }).catch(err => {
           console.error(err)
         })
+      },
+       imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
       },
       fileurlcut (val, index) {
         let fileurlall = val.split('$')[index]
@@ -1819,4 +1881,9 @@
       background-color: wheat;
     }
   }
+   .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

src/dashoo.cn/frontend_web/src/pages/oilsupplier/addtionaudit/_opera/techdataopera.vue

@@ -421,10 +421,29 @@
                 <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+                    <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+
+                    <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                       <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                          class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                    </div>
+                    </div> -->
+
+
+
                   </template>
                 </el-table-column>
                 <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -434,7 +453,8 @@
                 </el-table-column>
                 <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                   <template slot-scope="scope">
-                    <el-row align="middle">
+
+                    <!-- <el-row align="middle">
                       <el-col :span="20">
                         <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                           <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -442,7 +462,22 @@
                           </a>
                         </div>
                       </el-col>
-                    </el-row>
+                    </el-row> -->
+                  
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+                  
+                  
                   </template>
                 </el-table-column>
                 <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -643,6 +678,17 @@
   import WfMultiHistory from '@/components/workflow/wfmultihistory.vue';
   import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
 
+   // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
+
+
   export default {
     components: {
       WfMultiHistory,
@@ -1682,6 +1728,23 @@
         }).catch(err => {
           console.error(err)
         })
+      },
+       imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
       },
       fileurlcut (val, index) {
         let fileurlall = val.split('$')[index]
@@ -1742,4 +1805,9 @@
       background-color: wheat;
     }
   }
+  .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

src/dashoo.cn/frontend_web/src/pages/oilsupplier/annualaudit/_opera/operation.vue

@@ -547,7 +547,7 @@
                         :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
                         :key="index">
                     </div>
-                    </viewer>
+                  </viewer>
 
                   <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"

src/dashoo.cn/frontend_web/src/pages/oilsupplier/annualaudit/_opera/techoperation.vue

@@ -527,10 +527,29 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+                  
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -540,10 +559,27 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.FileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -722,6 +758,16 @@
   import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
   import _ from 'lodash'
 
+   // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
+
   export default {
     computed: {
       ...mapGetters({
@@ -1337,6 +1383,23 @@
           retUrl = myDomain + '/' + retUrl
         }
         return retUrl
+      },
+       imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
       },
       getsubfile () {
         // this.$refs['subfileList'].getvalue(this.formData.Id, this.SupplierTypeCode, this.certId)
@@ -2194,4 +2257,9 @@
     opacity: 1;
     background-color: white;
   }
+  .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

src/dashoo.cn/frontend_web/src/pages/oilsupplier/infochangech/_opera/auditoperation.vue

@@ -432,10 +432,28 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -445,10 +463,27 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.FileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+                  
+                   <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -487,10 +522,28 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -500,10 +553,28 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
+
+
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.FileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -542,10 +613,29 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -555,10 +645,27 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
                        class="buttonText">{{scope.row.FileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+                  <viewer :images="scope.row.FileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl, index)" >
+                        {{scope.row.FileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -703,6 +810,17 @@
   import WfMultiHistory from '@/components/workflow/wfmultihistory.vue'
   import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
 
+
+   // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
+
   export default {
     components: {
       WfMultiHistory,
@@ -1327,6 +1445,23 @@
           console.log(err)
         })
       },
+      imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
+      },
       fileurlcut(val, index) {
         let fileurlall = val.split('$')[index]
         let fileurl = fileurlall.split('|')
@@ -1776,5 +1911,9 @@
       background-color: wheat;
     }
   }
-
+   .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

src/dashoo.cn/frontend_web/src/pages/oilsupplier/infochangech/_opera/operation.vue

@@ -452,10 +452,26 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                       class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+                   <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -465,7 +481,30 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
+
+
                   <el-row align="middle">
+                      <el-col :span="20">
+                        <viewer :images="scope.row.FileUrlList">
+                        <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                        <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                          v-if="imgFormat(scope.row.FileUrl, index)" >
+                          {{scope.row.FileName.split('$')[index]}}</el-link>
+                        <img
+                          v-else
+                          class="photoStyle" alt=""
+                          :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                          :key="index">
+                        </div>
+                        </viewer>
+                      </el-col>
+                      <el-col :span="4" v-if="scope.row.FileUrl != ''">
+                      <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
+                    </el-col>
+                    </el-row>
+
+
+                  <!-- <el-row align="middle">
                     <el-col :span="20">
                       <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                         <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -476,7 +515,8 @@
                     <el-col :span="4" v-if="scope.row.FileUrl != ''">
                       <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
                     </el-col>
-                  </el-row>
+                  </el-row> -->
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -523,10 +563,28 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                       class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -536,7 +594,30 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
+
+                  
                   <el-row align="middle">
+                      <el-col :span="20">
+                        <viewer :images="scope.row.FileUrlList">
+                        <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                        <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                          v-if="imgFormat(scope.row.FileUrl, index)" >
+                          {{scope.row.FileName.split('$')[index]}}</el-link>
+                        <img
+                          v-else
+                          class="photoStyle" alt=""
+                          :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                          :key="index">
+                        </div>
+                        </viewer>
+                      </el-col>
+                     <el-col :span="4" v-if="scope.row.FileUrl != ''">
+                      <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
+                    </el-col>
+                    </el-row>
+
+
+                  <!-- <el-row align="middle">
                     <el-col :span="20">
                       <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                         <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -547,7 +628,10 @@
                     <el-col :span="4" v-if="scope.row.FileUrl != ''">
                       <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
                     </el-col>
-                  </el-row>
+                  </el-row> -->
+
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip>
@@ -582,10 +666,27 @@
               <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
               <el-table-column prop="OldFileUrlList" label="原文件" show-overflow-tooltip>
                 <template slot-scope="scope">
-                  <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
+
+
+                  <!-- <div v-for="(tmpUrl, index) in scope.row.OldFileUrlList">
                     <a :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank"
                       class="buttonText">{{scope.row.OldFileName.split('$')[index]}}</a>
-                  </div>
+                  </div> -->
+
+                  <viewer :images="scope.row.OldFileUrlList">
+                    <div v-for="(tmpUrl,index) in scope.row.OldFileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl, index)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl, index)" >
+                        {{scope.row.OldFileName.split('$')[index]}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl, index)"
+                        :key="index">
+                    </div>
+                    </viewer>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -595,7 +696,29 @@
               </el-table-column>
               <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                 <template slot-scope="scope">
+
+
                   <el-row align="middle">
+                      <el-col :span="20">
+                        <viewer :images="scope.row.FileUrlList">
+                        <div v-for="(tmpUrl,index) in scope.row.FileUrlList" :key="index" style="vertical-align: middle;	text-align: center;">
+                        <el-link :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank" type="primary"
+                          v-if="imgFormat(scope.row.FileUrl, index)" >
+                          {{scope.row.FileName.split('$')[index]}}</el-link>
+                        <img
+                          v-else
+                          class="photoStyle" alt=""
+                          :src="'http://'+fileurlcut(scope.row.FileUrl, index)"
+                          :key="index">
+                        </div>
+                        </viewer>
+                      </el-col>
+                     <el-col :span="4" v-if="scope.row.FileUrl != ''">
+                      <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
+                    </el-col>
+                    </el-row>
+
+                  <!-- <el-row align="middle">
                     <el-col :span="20">
                       <div v-for="(tmpUrl, index) in scope.row.FileUrlList">
                         <a :href="'http://'+fileurlcut(scope.row.FileUrl, index)" target="_blank"
@@ -606,7 +729,9 @@
                     <el-col :span="4" v-if="scope.row.FileUrl != ''">
                       <i class="el-icon-close" :style="{'float': 'right', 'height': '100%','line-height': lineheight(scope.row.FileUrlList.length)  + 'px',}" @click="iconclear(scope.row)"></i>
                     </el-col>
-                  </el-row>
+                  </el-row> -->
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip>
@@ -782,6 +907,17 @@
   import fileapi from '@/api/oilsupplier/supplierfile'
   import ChooseAuditorFen from '@/components/oilsupplier/chooseauditorfenban'
   import setapi from '@/api/oilsupplier/oilclassorgset'
+
+    // v-viewer
+  import Vue from 'vue';
+  import Viewer from 'v-viewer'
+  import 'viewerjs/dist/viewer.css'
+  Vue.use(Viewer)
+  Viewer.setDefaults({
+    Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
+  })
+
+
   export default {
     components: {
       WfMultiHistory,
@@ -1719,6 +1855,23 @@
       itemsshow () {
         this.myitemsshow = true
       },
+      imgFormat(val,index){
+         console.log(val)
+        if(val !=null && val != undefined && val !=''){
+          let fileurlall = val.split('$')[index]
+          let fileurl = fileurlall.split('|')
+          if(fileurl[1] != null && fileurl[1] !='' && fileurl[1] != undefined){
+            let Format  = fileurl[1].split(".")
+            if(Format[1]!=null && Format[1] !='' && Format[1] != undefined){
+               let pictureFormat = Format[1];
+              if("jpg"== pictureFormat || "bmp" ==pictureFormat || "png" ==pictureFormat || "gif" ==pictureFormat|| "jpeg" ==pictureFormat){
+                return false;
+              }
+            }
+          }
+          return true;
+        }
+      },
       fileurlcut (val, index) {
         let fileurlall = val.split('$')[index]
         let fileurl = fileurlall.split('|')
@@ -2592,5 +2745,9 @@
   .attach-uploader-icon:hover {
     color: #228B22;
   }
-
+.photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>