截图+下载

src/components/ImageEd.vue

 <!--
  * @Author: your name
  * @Date: 2021-09-09 09:28:46
- * @LastEditTime: 2021-10-13 14:31:11
+ * @LastEditTime: 2021-10-18 09:18:19
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \指纹系统\founder_vue\src\views\cxyrd\LTz.vue
@@ -305,6 +305,7 @@
             <div class="drawing">
               <div class="body-container">
                 <div class="tui-image-editor"></div>
+                <img id="sourceImage" style="display:none" :src="'data:image/jpeg;base64,'+sourceImage" alt="">
               </div>
             </div>
             <div class="edit" id="sourceEdit">编辑</div>
@@ -313,6 +314,7 @@
             <div class="title">目标数据</div>
             <div class="preview-target" v-show="isShowTargetPrivew">
               <img :src="previewTarget" alt="">
+              <img id="targetImage" style="display:none" :src="'data:image/jpeg;base64,'+targetImage" alt="">
             </div>
             <div class="drawing">
               <div class="body-container">
@@ -391,6 +393,8 @@ export default {
   name: "ImageEd",
   data () {
     return {
+      sourceImage: null,
+      targetImage: null,
       mouseEnlarge: false,
       imageEditor: null,
       imageEditor2: null,
@@ -727,7 +731,7 @@ export default {
 
       return {
         width: brushWidth,
-        color: hexToRGBa(brushColor, 0.5),
+        color: hexToRGBa(brushColor, 1),
       };
     }
 
@@ -1241,11 +1245,9 @@ export default {
 
     // 下载
     $btnDownload.on('click', function () {
-      if (self.type == 'source') {
-        var imageName = imageEditor.getImageName();
-        var dataURL = imageEditor.toDataURL();
+      var imageName = '源数据指纹';
+      var dataURL = $('#sourceImage').attr('src')
       var blob, type, w;
-
       if (supportingFileAPI) {
         blob = base64ToBlob(dataURL);
         type = blob.type.split('/')[1];
@@ -1260,9 +1262,10 @@ export default {
         w = window.open();
         w.document.body.innerHTML = '<img src="' + dataURL + '">';
       }
-      } else {
-        var imageName = imageEditor2.getImageName();
-        var dataURL = imageEditor2.toDataURL();
+
+
+      var imageName = '目标数据指纹';
+      var dataURL = $('#targetImage').attr('src')
       var blob, type, w;
 
       if (supportingFileAPI) {
@@ -1279,7 +1282,6 @@ export default {
         w = window.open();
         w.document.body.innerHTML = '<img src="' + dataURL + '">';
       }
-      }
     });
 
     // 沿X轴翻转
@@ -1597,12 +1599,14 @@ export default {
     */
 
     this.$bus.on('changImageEdit', (sourceImage) => {
+      self.sourceImage = sourceImage
       imageEditor.loadImageFromURL('data:image/jpeg;base64,' + sourceImage, 'SampleImage').then(function (sizeValue) {
         // console.log(sizeValue);
         imageEditor.clearUndoStack();
       });
     })
     this.$bus.on('changImageEditTarget', (targetImage) => {
+      self.targetImage = targetImage
       imageEditor2.loadImageFromURL('data:image/jpeg;base64,' + targetImage, 'SampleImage').then(function (sizeValue) {
         // console.log(sizeValue);
         imageEditor2.clearUndoStack();
@@ -2955,6 +2959,12 @@ export default {
      */
     screenshot () {
       this.initStatus()
+      $('.header').css('opacity', '0')
+      $('.lt_header').css('opacity', '0')
+      $('.lt_main_header').css('opacity', '0')
+      $('.lt_main_footer').css('opacity', '0')
+      $('.lt_cnadidate_search').css('opacity', '0')
+      $('.el-checkbox').css('opacity', '0')
       html2canvas(
         document.querySelector('.lt'),
         {
@@ -2972,6 +2982,14 @@ export default {
         a.href = canvas.toDataURL('image/jpeg');
         a.download = 'screenshot';
         a.click();
+
+        // 恢复界面
+        $('.header').css('opacity', '1')
+        $('.lt_header').css('opacity', '1')
+        $('.lt_main_header').css('opacity', '1')
+        $('.lt_main_footer').css('opacity', '1')
+        $('.lt_cnadidate_search').css('opacity', '1')
+        $('.el-checkbox').css('opacity', '1')
       })
     },
     /**

src/plugins/axios.js

 /*
  * @Author: your name
  * @Date: 2021-09-07 09:57:48
- * @LastEditTime: 2021-10-16 14:11:12
+ * @LastEditTime: 2021-10-16 16:20:07
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \指纹系统\founder_vue\src\plugins\axios.js
@@ -28,7 +28,6 @@ const _axios = axios.create(config);
 
 _axios.interceptors.request.use(
   function(config) {
-    console.log('开始');
     NProgress.start();
     // Do something before request is sent
     return config;
@@ -43,7 +42,6 @@ _axios.interceptors.request.use(
 // Add a response interceptor
 _axios.interceptors.response.use(
   function(response) {
-    console.log('结束');
     NProgress.done();
     // Do something with response data
     return response;

src/views/Home.vue

@@ -240,6 +240,9 @@ export default {
     }
   }
 }
+.el-menu-item:hover {
+  background-color: #15243C !important;
+}
 .el-menu--collapse {
   .el-submenu, .el-menu-item {
     img {

src/views/cxyrd/LT.scss

@@ -16,6 +16,9 @@ $phone: var(--phone, #606266);  //#ff4242;
   background: rgba($color: #fff, $alpha: 0.65);
   filter: blur(2px);
 }
+.bzActive {
+  filter: blur(2px);
+}
 .bzcontent {
   box-sizing: border-box;
   position: absolute;

src/views/cxyrd/LT.vue

 <template>
-  <div class="lt">
+  <div>
+    <div class="lt" :class="{bzActive: isShowbzDialogBg}">
       <div class="header">
         <div class="label">正查</div>
         <div class="btns">
@@ -21,6 +22,7 @@
           <l-t-candidate></l-t-candidate>
         </div>
       </div>
+    </div>
     <!-- 比中弹窗 -->
     <div class="bzDialog" v-show="isShowbzDialogBg" @click="cancelbz"></div>
     <div class="bzcontent" v-show="isShowbzDialog">
@@ -85,7 +87,7 @@
             <el-input class="bzphone" v-model="phone" placeholder="请输入内容"></el-input>
             <div class="input-error" v-show="isPhoneError">
               <!-- <img src="@/assets/img/inputerror.png" alt=""> -->
-              <svg-icon icon-class="error" class="icon"/>
+              <svg-icon icon-class="error" class="icon" />
             </div>
             <div class="error-desc" v-show="isPhoneError">联系电话不应低于7位数！</div>
           </div>
@@ -235,7 +237,7 @@ export default {
           barcode: destbarcode
         }
       }).then(res => {
-        if(res.data.code == 0) {
+        if (res.data.code == 0) {
           self.xckybh = res.data.ret.kybh
         }
       })

src/views/cxyrd/TL.scss

@@ -16,6 +16,9 @@ $phone: var(--phone, #606266); //#ff4242;
   background: rgba($color: #fff, $alpha: 0.65);
   filter: blur(2px);
 }
+.bzActive {
+  filter: blur(2px);
+}
 .bzcontent {
   box-sizing: border-box;
   position: absolute;

src/views/cxyrd/TL.vue

 <template>
-  <div class="tl">
+  <div>
+    <div class="tl" :class="{bzActive: isShowbzDialogBg}">
       <div class="header">
         <div class="label">倒查</div>
         <div class="btns">
@@ -18,7 +19,7 @@
           <t-l-candidate></t-l-candidate>
         </div>
       </div>
-
+    </div>
     <!-- 比中弹窗 -->
     <div class="bzDialog" v-show="isShowbzDialogBg" @click="cancelbz"></div>
     <div class="bzcontent" v-show="isShowbzDialog">
@@ -262,6 +263,7 @@ export default {
       this.isShowbzDialogBg = true
       this.isShowbzDialog = true
       this.getUserInfo()
+      this.getUserInfo2()
       // 序号
       this.xh = sessionStorage.getItem('backcheckXh')
       // 指位

src/views/cxyrd/modules/LTCandidate.vue

@@ -1063,13 +1063,34 @@ export default {
         sessionStorage.setItem("destbarcode", val.destbarcode);
         // 存储目的数据序号
         sessionStorage.setItem("destseqno", val.destseqno);
-        // this.$axios.get(`/api/api/org/plainByBarcode/R1100002487002018050034/1/`)
+
+        // 平面
+        if (val.destseqno > 10) {
           this.$axios
-          .get(`/api/org/plainByBarcode/${val.destbarcode}/${val.destseqno}`)
-          .then(response => {
-            console.log(response);
+            .post('/api/org/plainByBarcode/barcode/seq', {
+              barcode:val.destbarcode,
+              seqno: val.destseqno
+            }).then(response => {
               self.$bus.emit("changImageEditTarget", response.data.ret.image);
-          });
+            })
+        } else {
+          // 滚动
+          this.$axios
+            .post('/api/org/rollByBarcode/barcode/seq', {
+              barcode:val.destbarcode,
+              seqno: val.destseqno
+            }).then(response => {
+              self.$bus.emit("changImageEditTarget", response.data.ret.image);
+            })
+        }
+
+        // this.$axios.get(`/api/api/org/plainByBarcode/R1100002487002018050034/1/`)
+        // this.$axios
+        //   .get(`/api/org/plainByBarcode/${val.destbarcode}/${val.destseqno}`)
+        //   .then(response => {
+        //     console.log(response);
+        //     self.$bus.emit("changImageEditTarget", response.data.ret.image);
+        //   });
       }
     },
     choose (val) {

src/views/cxyrd/modules/TLCandidate.vue

@@ -60,11 +60,19 @@ export default {
         sessionStorage.setItem("backcheckXh", val.destseqno)
         // this.$axios.get(`/api/api/org/plainByBarcode/R1100002487002018050034/1/`)
         this.$axios
-          .get(`/api/org/plainByBarcode/${val.destbarcode}/${val.destid}`)
-          .then(response => {
+          .post('/api/png/caseBybarcode/barcode/seq', {
+            barcode:val.destbarcode,
+            seqno:val.destseqno
+          }).then(response => {
             console.log(response);
             self.$bus.emit("changImageEditTarget", response.data.ret.image);
           });
+        // this.$axios
+        //   .get(`/api/org/plainByBarcode/${val.destbarcode}/${val.destid}`)
+        //   .then(response => {
+        //     console.log(response);
+        //     self.$bus.emit("changImageEditTarget", response.data.ret.image);
+        //   });
       }
     },
     tableRowClassName ({ row, column, rowIndex, columnIndex }) {

src/views/cxyrd/modules/TLSrc.vue

@@ -399,7 +399,7 @@ export default {
                 // itemL.img = element.image
                 self.$set(itemL, 'image', element.image)
                 self.$set(itemL, 'clickLog', element.clickLog)
-                self.$set(itemL, 'affirmstatus', element.clickLog)
+                self.$set(itemL, 'affirmstatus', element.affirmstatus)
               } else {
                 // itemL.img = null
                 // self.$set(itemL, 'image', null)
@@ -410,12 +410,13 @@ export default {
                 // itemL.img = element.image
                 self.$set(itemL, 'image', element.image)
                 self.$set(itemL, 'clickLog', element.clickLog)
-                self.$set(itemL, 'affirmstatus', element.clickLog)
+                self.$set(itemL, 'affirmstatus', element.affirmstatus)
               } else {
                 // itemL.img = null
                 // self.$set(itemL, 'image', null)
               }
             })
+            console.log(self.fingersRightL);
           }
           // console.log(fingerPain.data.ret.length);
           self.fingerTotalPain = fingerPain.data.ret.length
@@ -604,6 +605,8 @@ export default {
     changeStyleLeftR (index, imageInfo) {
       console.log(imageInfo);
       let self = this
+      // 如果图片存在
+      if (imageInfo.image) {
         this.isActive = imageInfo.code;
         console.log(this.isActive);
         // 存储源数据序号
@@ -618,6 +621,7 @@ export default {
             self.$bus.emit('initTLCandidate', response.data.ret)
           })
         NProgress.done();
+      }
     },
     /**
      * @description: 单击右手指纹事件-滚动
@@ -628,6 +632,7 @@ export default {
     changeStyleRightR (index, imageInfo) {
       console.log(imageInfo);
       let self = this
+      if (imageInfo.image) {
         this.isActive = imageInfo.code;
         console.log(this.isActive);
         // 存储源数据序号
@@ -642,6 +647,7 @@ export default {
             self.$bus.emit('initTLCandidate', response.data.ret)
           })
         NProgress.done();
+      }
     },
     /**
      * @description: 单击左手指纹事件-平面
@@ -652,6 +658,7 @@ export default {
     changeStyleLeftL (index, imageInfo) {
       console.log(imageInfo);
       let self = this
+      if (imageInfo.image) {
         this.isActive = imageInfo.code;
         console.log(this.isActive);
         // 存储源数据序号
@@ -666,6 +673,7 @@ export default {
             self.$bus.emit('initTLCandidate', response.data.ret)
           })
         NProgress.done();
+      }
     },
     /**
      * @description: 单击右手指纹事件-平面
@@ -676,6 +684,7 @@ export default {
     changeStyleRightL (index, imageInfo) {
       console.log(imageInfo);
       let self = this
+      if (imageInfo.image) {
         this.isActive = imageInfo.code;
         console.log(this.isActive);
         // 存储源数据序号
@@ -684,13 +693,14 @@ export default {
           this.$bus.emit('changImageEdit', imageInfo.image)
         }
         NProgress.start();
-      this.$axios.post(`/api/query/matchcand/dest/${self.qqid}/${imageInfo.code}`, { "matchcandReqTo": { "srcbarcode": sessionStorage.getItem('srcbarcode') } })
+        this.$axios.post(`/api/query/matchcand/dest/${self.qqid}/${imageInfo.code}`,  { "srcbarcode": sessionStorage.getItem('srcbarcode') })
           .then(response => {
             console.log(response);
             self.$bus.emit('initTLCandidate', response.data.ret)
           })
         NProgress.done();
-    },
+      }
+    }
   },
   watch: {
     /**