zc

src/components/fullScreenView/fullScreenView.vue

@@ -22,7 +22,7 @@
       'https://img2.baidu.com/it/u=3038223445,2416689412&fm=253&fmt=auto&app=120&f=JPEG?w=1920&h=1080',
     ],
 
-    imgClick(index){
+    fullScreenViewClick(index){
       this.$refs['fullScreenView'].initialize(index);
       //index 非必传 不传时优先展示第一张
       this.$refs['fullScreenView'].initialize();
@@ -35,7 +35,7 @@
       <!--复位按钮-->
       <p class="position-refresh-p el-icon-refresh" @click="clickLookImg(lookIndex)"></p>
       <!--下载按钮-->
-      <p class="position-download-p el-icon-download" @click="downloadImage"></p>
+      <p class="position-download-p el-icon-download" @click="downloadImage" v-if="!imgNullType"></p>
       <!--关闭按钮-->
       <p class="position-off-p el-icon-circle-close" @click="outButton"></p>
       <div class="max-img-box" ref="viewBox">

src/views/serviceCenter/logManagement/algorithmLogs/infoPage.vue

@@ -64,27 +64,28 @@
       <div class="right-content-box scrollbar-box">
         <div>
           <p>原文件</p>
-          <img v-if="pageData.originalFile" :src="pageData.originalFile" @click="lookImg(pageData.originalFile,'原文件')">
+          <img v-if="pageData.originalFile" :src="pageData.originalFile" @click="fullScreenViewClick(pageData.originalFile)">
         </div>
         <div>
           <p>识别结果</p>
-          <img v-if="pageData.checkResult" :src="pageData.checkResult" @click="lookImg(pageData.checkResult,'识别结果')">
+          <img v-if="pageData.checkResult" :src="pageData.checkResult" @click="fullScreenViewClick(pageData.checkResult)">
         </div>
       </div>
     </div>
-    <!--单张图片预览-->
-    <lookSingleImgDialog ref="lookSingleImgDialog"></lookSingleImgDialog>
+    <!--全屏图片预览-->
+    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
   </div>
 </template>
 
 <script>
   //js&css&html美化
   import beautify from "js-beautify";
-  import lookSingleImgDialog from '@/components/lookSingleImgDialog/lookSingleImgDialog.vue'
+  import fullScreenView from "@/components/fullScreenView/fullScreenView.vue";
+
   export default {
     name: 'algorithmLogsInfoPage',
     components: {
-      lookSingleImgDialog,
+      fullScreenView,
     },
     props:{
       propsData:{},
@@ -92,6 +93,7 @@
     data(){
       return{
         pageData:{},
+        fullScreenViewProps:[],
       }
     },
     created(){},
@@ -112,11 +114,9 @@
       backPage(){
         this.$parent.goPage(1);
       },
-      //查看图片
-      lookImg(url,name){
-        if(url){
-          this.$refs.lookSingleImgDialog.lookImgDialogOpen(1,url,name);
-        }
+      fullScreenViewClick(url){
+        this.$set(this,'fullScreenViewProps',[url]);
+        this.$refs['fullScreenView'].initialize();
       },
     },
   }

src/views/systemManagement/publicConfig/basicsConfig.vue

@@ -24,7 +24,7 @@
             <img v-if="form.circularLogo" :src="form.circularLogo" class="avatar" style="height:200px;width:200px;background: #dedede;padding:5px;border-radius:4px;">
             <i v-if="!form.circularLogo" class="el-icon-plus avatar-uploader-icon" style="height:80px;width:80px;border-radius: 40px;line-height: 80px;">上传</i>
           </el-upload>
-          <i v-if="form.circularLogo" class="el-icon-view" @click="lookImg(form.circularLogo)"
+          <i v-if="form.circularLogo" class="el-icon-view" @click="fullScreenViewClick(form.circularLogo)"
              style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
             height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
         </el-form-item>
@@ -43,7 +43,7 @@
             <img v-if="form.rectangleLogo" :src="form.rectangleLogo" class="avatar" style="height:110px;width:500px;background: #dedede;padding:5px;border-radius:4px;">
             <i v-if="!form.rectangleLogo" class="el-icon-plus avatar-uploader-icon">上传</i>
           </el-upload>
-          <i v-if="form.rectangleLogo" class="el-icon-view" @click="lookImg(form.rectangleLogo)"
+          <i v-if="form.rectangleLogo" class="el-icon-view" @click="fullScreenViewClick(form.rectangleLogo)"
              style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
             height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
         </el-form-item>
@@ -55,8 +55,8 @@
       <p class="page-bottom-button-submit-p" @click="addOrUpdate">保存</p>
       <p class="page-bottom-button-null-p"></p>
     </div>
-    <!--单张图片预览-->
-    <lookSingleImgDialog ref="lookSingleImgDialog"></lookSingleImgDialog>
+    <!--全屏图片预览-->
+    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
   </div>
 </template>
 
@@ -64,11 +64,11 @@
   import { getToken } from "@/utils/auth";
   import { getConfigByType } from "@/api/commonality/permission";
   import { addOrUpdate } from "@/api/systemManagement/index";
-  import lookSingleImgDialog from '@/components/lookSingleImgDialog/lookSingleImgDialog.vue'
+  import fullScreenView from "@/components/fullScreenView/fullScreenView.vue";
   export default {
     name: "publicConfig",
     components: {
-      lookSingleImgDialog,
+      fullScreenView,
     },
     data() {
       return {
@@ -93,6 +93,7 @@
             { required: true, message: "长方形Logo不能为空", trigger: "blur" }
           ],
         },
+        fullScreenViewProps:[],
       };
     },
     created() {
@@ -126,9 +127,9 @@
           }
         });
       },
-      //查看图片
-      lookImg(url){
-        this.$refs.lookSingleImgDialog.lookImgDialogOpen(1,url,'查看',true);
+      fullScreenViewClick(url){
+        this.$set(this,'fullScreenViewProps',[url]);
+        this.$refs['fullScreenView'].initialize();
       },
       //获取数据
       getConfigByType(){

src/views/systemManagement/publicConfig/integrationConfig.vue

@@ -42,7 +42,7 @@
             <img v-if="form.videoCover" :src="form.videoCover" class="avatar" >
             <i v-if="!form.videoCover" class="el-icon-plus avatar-uploader-icon">上传</i>
           </el-upload>
-          <i v-if="form.videoCover" class="el-icon-view" @click="lookImg(form.videoCover)"
+          <i v-if="form.videoCover" class="el-icon-view" @click="fullScreenViewClick(form.videoCover)"
              style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
             height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
         </el-form-item>
@@ -53,8 +53,8 @@
       <p class="page-bottom-button-submit-p" @click="addOrUpdate">保存</p>
       <p class="page-bottom-button-null-p"></p>
     </div>
-    <!--单张图片预览-->
-    <lookSingleImgDialog ref="lookSingleImgDialog"></lookSingleImgDialog>
+    <!--全屏图片预览-->
+    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
   </div>
 </template>
 
@@ -62,11 +62,11 @@
 import { getToken } from "@/utils/auth";
 import { getConfigByType } from "@/api/commonality/permission";
 import { addOrUpdate } from "@/api/systemManagement/index";
-import lookSingleImgDialog from '@/components/lookSingleImgDialog/lookSingleImgDialog.vue'
+import fullScreenView from "@/components/fullScreenView/fullScreenView.vue";
 export default {
   name: "publicConfig",
   components: {
-    lookSingleImgDialog,
+    fullScreenView,
   },
   data() {
     return {
@@ -128,6 +128,7 @@ export default {
           name:"全部人员"
         },
       ],
+      fullScreenViewProps:[],
     };
   },
   created() {
@@ -177,9 +178,9 @@ export default {
         }
       });
     },
-    //查看图片
-    lookImg(url){
-      this.$refs.lookSingleImgDialog.lookImgDialogOpen(1,url,'查看');
+    fullScreenViewClick(url){
+      this.$set(this,'fullScreenViewProps',[url]);
+      this.$refs['fullScreenView'].initialize();
     },
     //获取数据
     getConfigByType(){

src/views/systemManagement/publicConfig/programConfig.vue

@@ -15,7 +15,7 @@
             <img v-if="form.loginBanner" :src="form.loginBanner" class="avatar" >
             <i v-if="!form.loginBanner" class="el-icon-plus avatar-uploader-icon">上传</i>
           </el-upload>
-          <i v-if="form.loginBanner" class="el-icon-view" @click="lookImg(form.loginBanner)"
+          <i v-if="form.loginBanner" class="el-icon-view" @click="fullScreenViewClick(form.loginBanner)"
              style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
             height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
         </el-form-item>
@@ -33,7 +33,7 @@
             <img v-if="form.homepageBanner" :src="form.homepageBanner" class="avatar" >
             <i v-if="!form.homepageBanner" class="el-icon-plus avatar-uploader-icon">上传</i>
           </el-upload>
-          <i v-if="form.homepageBanner" class="el-icon-view" @click="lookImg(form.homepageBanner)"
+          <i v-if="form.homepageBanner" class="el-icon-view" @click="fullScreenViewClick(form.homepageBanner)"
              style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
             height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
         </el-form-item>
@@ -44,21 +44,21 @@
       <p class="page-bottom-button-submit-p" @click="addOrUpdate">保存</p>
       <p class="page-bottom-button-null-p"></p>
     </div>
-    <!--单张图片预览-->
-    <lookSingleImgDialog ref="lookSingleImgDialog"></lookSingleImgDialog>
+    <!--全屏图片预览-->
+    <fullScreenView :fullScreenViewProps="fullScreenViewProps" ref="fullScreenView"></fullScreenView>
   </div>
 </template>
 <script>
 import { getToken } from "@/utils/auth";
 import { getConfigByType } from "@/api/commonality/permission";
 import { addOrUpdate } from "@/api/systemManagement/index";
-import lookSingleImgDialog from '@/components/lookSingleImgDialog/lookSingleImgDialog.vue'
+import fullScreenView from "@/components/fullScreenView/fullScreenView.vue";
 
 import store from '@/store'
 export default {
   name: "publicConfig",
   components: {
-    lookSingleImgDialog,
+    fullScreenView,
   },
   data() {
     return {
@@ -79,6 +79,7 @@ export default {
           { required: true, message: "首页banner不能为空", trigger: "blur" }
         ],
       },
+      fullScreenViewProps:[],
     };
   },
   created() {
@@ -106,9 +107,9 @@ export default {
         }
       });
     },
-    //查看图片
-    lookImg(url){
-      this.$refs.lookSingleImgDialog.lookImgDialogOpen(1,url,'查看');
+    fullScreenViewClick(url){
+      this.$set(this,'fullScreenViewProps',[url]);
+      this.$refs['fullScreenView'].initialize();
     },
     //获取数据
     getConfigByType(){

vue.config.js

@@ -108,7 +108,6 @@ module.exports = {
       args[0].buildUser = buildUser;
       args[0].buildTime = buildTime;
       args[0].buildEdition = buildEdition;
-      console.log('=============>',args[0]);
       // args[0].minify.removeComments = false
       return args
     })