7-23 图片缩略图

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

@@ -616,10 +616,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">
+
+                  <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>
@@ -629,7 +646,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 != '' && Status <= 0 ">
+                      <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"
@@ -641,6 +680,9 @@
                       <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>
+                -->
+               
+               
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -934,6 +976,17 @@ import apiCert from '@/api/oilsupplier/suppliercert'
   import fileapi from '@/api/oilsupplier/supplierfile'
   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 {
     computed: {
       ...mapGetters({
@@ -1841,6 +1894,23 @@ import apiCert from '@/api/oilsupplier/suppliercert'
       // 资质变更相关
       lineheight (list) {
         return list * 23 + ''
+      },
+       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]
@@ -3031,4 +3101,9 @@ import apiCert from '@/api/oilsupplier/suppliercert'
       background-color: wheat;
     }
   }
+  .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

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

@@ -534,10 +534,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">
+
+                  
+                  <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>
@@ -547,7 +564,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"
@@ -558,7 +576,30 @@
                     <el-col :span="4" v-if="scope.row.FileUrl != '' && Status <= 0 ">
                       <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> -->
+
+
+                  <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 != '' && Status <= 0 ">
+                      <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>
+
+
                 </template>
               </el-table-column>
               <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip >
@@ -850,6 +891,16 @@
   import fileapi from '@/api/oilsupplier/supplierfile'
   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 {
     computed: {
       ...mapGetters({
@@ -1778,6 +1829,24 @@
       lineheight (list) {
         return list * 23 + ''
       },
+
+      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('|')
@@ -2991,4 +3060,9 @@
       background-color: wheat;
     }
   }
+  .photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

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

@@ -32,7 +32,23 @@
         <el-table-column prop="NeedFileType" label="文件分类" show-overflow-tooltip></el-table-column>
         <el-table-column prop="OldFileName" label="原文件" show-overflow-tooltip>
           <template slot-scope="scope">
-            <a :href="'http://'+fileurlcut(scope.row.OldFileUrl)" target="_blank" class="buttonText">{{scope.row.OldFileName}}</a>
+
+
+            <viewer :images="scope.row.OldFileUrl">
+                    <div style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.OldFileUrl)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.OldFileUrl)" >
+                        {{scope.row.OldFileName}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.OldFileUrl)"
+                        :key="index">
+                    </div>
+                    </viewer>
+            <!-- <a :href="'http://'+fileurlcut(scope.row.OldFileUrl)" target="_blank" class="buttonText">{{scope.row.OldFileName}}</a> -->
+          
+          
           </template>
         </el-table-column>
         <el-table-column prop="OldEffectDate" label="原有效日期" show-overflow-tooltip>
@@ -42,7 +58,22 @@
         </el-table-column>
         <el-table-column prop="FileName" label="变更后文件" show-overflow-tooltip>
           <template slot-scope="scope">
-            <a :href="'http://'+fileurlcut(scope.row.FileUrl)" target="_blank" class="buttonText">{{scope.row.FileName}}</a>
+
+            <!-- <a :href="'http://'+fileurlcut(scope.row.FileUrl)" target="_blank" class="buttonText">{{scope.row.FileName}}</a> -->
+           <viewer :images="scope.row.FileUrl">
+                    <div style="vertical-align: middle;	text-align: center;">
+                      <el-link :href="'http://'+fileurlcut(scope.row.FileUrl)" target="_blank" type="primary"
+                        v-if="imgFormat(scope.row.FileUrl)" >
+                        {{scope.row.FileName}}</el-link>
+                      <img
+                        v-else
+                        class="photoStyle" alt=""
+                        :src="'http://'+fileurlcut(scope.row.FileUrl)"
+                        :key="index">
+                    </div>
+                    </viewer>
+          
+          
           </template>
         </el-table-column>
         <el-table-column prop="EffectDate" label="变更后有效日期" show-overflow-tooltip>
@@ -120,6 +151,17 @@
   import quaapi from '@/api/oilsupplier/qualchange'
   import infoapi from '@/api/oilsupplier/infochange'
   import axios from 'axios'
+
+// 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' }
+  })
+
+
   // import uploadajax from '../../assets/js/uploadajax.js'
   export default {
     computed: {
@@ -422,6 +464,21 @@
         this.getorgtreelist()
         this.commitshow = true
       },
+
+      imgFormat(fileurlall){
+         console.log(val)
+          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) {
         let fileurlall = val
         let fileurl = fileurlall.split("|")
@@ -485,4 +542,9 @@
     color: #228B22;
   }
 
+.photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

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

@@ -45,10 +45,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">
+
+
+            <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>
           <!-- <template slot-scope="scope">
             <a :href="'http://'+fileurlcut(scope.row.OldFileUrl+'')" target="_blank" class="buttonText">
@@ -66,10 +83,28 @@
               class="buttonText">{{scope.row.FileName}}</a>
           </template> -->
           <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>
@@ -167,6 +202,17 @@
   import ChooseAuditor from '@/components/oilsupplier/chooseauditor'
   import fileapi from '@/api/oilsupplier/supplierfile'
   // import uploadajax from '../../assets/js/uploadajax.js'
+
+// 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({
@@ -613,7 +659,23 @@
         this.$refs['chooseAuditor'].getorgtreelist()
         this.chooseAuditorVisible = 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("|")
@@ -678,4 +740,10 @@
     color: #228B22;
   }
 
+
+.photoStyle{
+    margin-top:6px;
+    width:140px;
+    height: 60px;
+  }
 </style>

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

@@ -514,7 +514,7 @@
                     {{ jstimehandle(scope.row.OldEffectDate+'') }}
                   </template>
                 </el-table-column>
-                <el-table-column prop="FileUrlList" label="变更后文件2" show-overflow-tooltip>
+                <el-table-column prop="FileUrlList" label="变更后文件" show-overflow-tooltip>
                   <template slot-scope="scope">