apply-clients 3.3.2 → 3.3.6

package/src/components/product/VueUtils/GaoPaiYi/HighMeter.vue

@@ -0,0 +1,1090 @@
+<template>
+  <modal :show.sync="true" v-ref:modal backdrop="false" width="720px">
+    <header slot="modal-header">
+      <div class="header">
+        <span class="glyphicon glyphicon-remove-circle close" style="margin-top: 35px;margin-right: 30px" @click="close"></span>
+        <h4 class="title">高拍仪</h4>
+      </div>
+    </header>
+    <article slot="modal-body" class="form-control" style="padding: 0px">
+      <div class="form-group">
+        <!--<div class="auto" style="margin-top: 5px">-->
+        <!--<strong>&emsp;视频操作：</strong>-->
+        <!--<button class="btn btn-info" @click="GetFbl()">取分辨率</button>-->
+        <!--<button class="btn btn-info" @click="SetResolution()">设置分辨率</button>-->
+        <!--<button class="btn btn-info" @click="SetOrientation()">设置视频方向</button>-->
+        <!--<button class="btn btn-info" @click="SetLeft()">左旋</button>-->
+        <!--<button class="btn btn-info" @click="SetRight()">右旋</button>-->
+        <!--<button class="btn btn-info" @click="SetQuality()">设置质量</button>-->
+        <!--<button class="btn btn-info" @click="SetAutoCutOn()">自动裁边开</button>-->
+        <!--<button class="btn btn-info" @click="SetAutoCutOff()">自动裁边关</button>-->
+        <!--<button class="btn btn-info" @click="SetBox()">预设框选</button>-->
+        <!--<button class="btn btn-info" @click="ShowResetInfo()">当前预设</button>-->
+        <!--<button class="btn btn-info" @click="ResetBox()">取消预设</button>-->
+        <!--<button class="btn btn-info" @click="FormatDlg()">视频格式</button>-->
+        <!--<button class="btn btn-info" @click="PropertyDlg()">视频属性</button>-->
+        <!--</div>-->
+        <!--<div class="auto" style="margin-top: 5px">-->
+        <!--<strong>&emsp;截&emsp;&emsp;图：</strong>-->
+        <!--<button class="btn btn-info" @click="bb()">截图[本地]</button>-->
+        <!--<button class="btn btn-info" @click="bbase64()">截图[内存]</button>-->
+        <!--<button class="btn btn-info" @click="TestBase64()">Base64测试</button>-->
+        <!--<button class="btn btn-info" @click="bbStartClean()">开启自动去底色</button>-->
+        <!--<button class="btn btn-info" @click="bbCloseClean()">关闭自动去底色</button>-->
+        <!--</div>-->
+        <!--<div class="auto" style="margin-top: 5px">-->
+        <!--<strong>&emsp;PDF功能：</strong>-->
+        <!--<button class="btn btn-info" @click="SetPDFPath()">设置PDF临时目录</button>-->
+        <!--<button class="btn btn-info" @click="BeginPDF()">开始制作PDF</button>-->
+        <!--<button class="btn btn-info" @click="GetPDF()">PDF拍照</button>-->
+        <!--<button class="btn btn-info" @click="EndPDF()">完成制作</button>-->
+        <!--<button class="btn btn-info" @click="PDFtoBASE64()">PDF转base64</button>-->
+        <!--<button class="btn btn-info" @click="BASE64toPDF()">base64转PDF</button>-->
+        <!--<button class="btn btn-info" @click="PDFtoBASE64Str()">PDF转base64Str</button>-->
+        <!--</div>-->
+        <!--<div class="auto" style="margin-top: 5px">-->
+        <!--<strong>&emsp;其他操作：</strong>-->
+        <!--<button class="btn btn-info" @click="printimage()">打印</button>-->
+        <!--<button class="btn btn-info" @click="ShowErrorInfo()">启用错误提示</button>-->
+        <!--<button class="btn btn-info" @click="IDCardCompare()">人证对比</button>-->
+        <!--</div>-->
+        <div class="operation-group">
+          <strong class="operation" style="margin-top: 2px">视频操作:</strong>
+          <button class="btn btn-info photo" @click="bb()">拍照</button>
+          <button class="btn btn-info" @click="cam_switch(1)">打开视频1</button>
+          <button class="btn btn-info" @click="cam_switch(2)">打开视频2</button>
+          <button class="btn btn-info" @click="CloseVideo()">关闭视频</button>
+          <!--<button class="btn btn-info" @click="GetInitRet()">初始化结果</button>-->
+          <!--<button class="btn btn-info" @click="GetPid()">取PID</button>-->
+          <!--          <div style="display: inline-block;margin-left: 570px">-->
+          <!--            <strong class="operation">读取身份证:</strong>-->
+          <!--            <button class="btn btn-info readIDCard" @click=Begin()>读身份证</button>-->
+          <!--            <button class="btn btn-default stop" @click=Stop()>停止读卡</button>-->
+          <!--          </div>-->
+          <!--<button class="btn btn-info" @click=HCopy()>横向复印</button>-->
+          <!--<button class="btn btn-info" @click=VCopy()>竖向复印</button>-->
+          <!--<button class="btn btn-info" @click=PCopy()>正面复印</button>-->
+          <!--<button class="btn btn-info" @click=NCopy()>反面复印</button>-->
+        </div>
+        <div class="showInfo">
+          <div style="width:100%;height:100%;position: relative;">
+            <IMG ID="Base64IMG" src="" class="img" style="position: absolute;top:0;left:0" :style="jd" ></IMG>
+            <button style="position: absolute;buttom:-10px;left:0px;" @click="splitsimg">旋转</button>
+          </div>
+          <textarea id="Console" disabled="disabled"></textarea>
+          <IMG id="cam"  :src="cameraurl" width="640" height="640">
+          </IMG>
+        </div>
+        <!--        <div class="IdCard">-->
+        <!--          <div class="auto IdInputDiv" style="margin-top: 20px"><strong class="IdHint">姓&emsp;&emsp;名</strong><input size=49 id="Name" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv" ><strong class="IdHint">性&emsp;&emsp;别</strong><input type="text" size=49 id="Sex" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv" ><strong class="IdHint">民&emsp;&emsp;族</strong><input type="text" size=49 id="Nation" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">出&emsp;&emsp;生</strong><input type="text" size=49 id="Born" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">地&emsp;&emsp;址</strong><input type="text" size=49 id="Address" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">身份证号</strong><input type="text" size=49 id="CardNo" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">签发机关</strong><input type="text" size=49 id="Police" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">期限起始</strong><input type="text" size=49 id="ActivityLFrom" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">期限失效</strong><input type="text" size=49 id="ActivityLTo" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv"><strong class="IdHint">设&emsp;备ID</strong><input type="text" size=49 id="DeviceNo" class="IdInput"></div>-->
+        <!--          <div class="auto IdInputDiv" style="float: left"><strong class="IdHint">照片编码</strong><TEXTAREA id="PhotoBuffer"style="width: 400px;height: 92px"></TEXTAREA>-->
+        <!--          </div>-->
+        <!--          <div class="auto IdInputDiv" style="float: left"><strong class="IdHint">照&emsp;&emsp;片</strong><IMG style="width: 130px; height:169px" id=PhotoDisplay />-->
+        <!--          </div>-->
+        <!--        </div>-->
+        <!--<div style="display: inline-block;margin-top: 5px;margin-left: 5px;height: 640px;float: left;">-->
+        <!--<IMG id="IMG3" src="" style="width:300px;height:160px;display: block">-->
+        <!--<button class="btn btn-success" @click="DelPDF3()">删除图片</button>-->
+        <!--<IMG id="IMG2" src="" style="width:300px;height:160px;display: block">-->
+        <!--<button class="btn btn-success" @click="DelPDF2()">删除图片</button>-->
+        <!--<IMG id="IMG1" src="" style="width:300px;height:160px;display: block">-->
+        <!--<button class="btn btn-success" @click="DelPDF1()">删除图片</button>-->
+        <!--</div>-->
+      </div>
+    </article>
+    <footer slot="modal-footer" class="modal-footer">
+      <!--<button  type="button" class="btn btn-default" @click='close'>取消</button>-->
+      <!--<button  type="button" class="btn btn-success" @click='confirm(filename)'>确认</button>-->
+    </footer>
+  </modal>
+</template>
+
+<script>
+let ws
+let server_addr = 'ws://127.0.0.1:18888'// 本机端口地址
+export default {
+  title: '高拍仪',
+  data () {
+    return {
+      cameraurl: '',
+      jd: 'transform:rotate(0deg)',
+      degs: 0
+    }
+  },
+  props: ['show'],
+  methods: {
+    splitsimg () {
+      this.degs += 90
+      this.jd = `transform:rotate(${this.degs}deg)`
+    },
+    // 页面load消息
+    onLoad () {
+      return new Promise((resolve, reject) => {
+        if (ws) {
+          resolve()
+        }
+        // output("正在连接：" + server_addr);
+        ws = new WebSocket(server_addr)
+        ws.onopen = (evt) => {
+          if (this.connected) {
+            resolve()
+          }
+          this.connected = true
+          this.output('已经连接到服务器')
+          // 打开视频
+          this.cam_switch(1)
+          // 打开自动裁边
+          resolve()
+        }
+        ws.onclose = (evt) => {
+          if (!this.connected) {
+            window.location.href = 'FLShell://'
+            setTimeout('this.onLoad()', 3)
+          } else {
+            this.output('已断开服务器连接')
+            this.connected = false
+          }
+          ws = null
+          reject(new Error('连接失败'))
+        }
+        ws.onmessage = (evt) => {
+          if (evt.data.length === 0) {
+            return
+          }
+          if (typeof evt.data === 'string') {
+            let msg = JSON.parse(evt.data)
+            if (msg.err && msg.err !== 0) {
+              this.output('错误 - ' + msg.err + ', ' + msg.msg)
+              reject('错误 - ' + msg.err + ', ' + msg.msg)
+            } else if (msg.msg) {
+              this.output(msg.msg)
+            }
+
+            if (msg.user_data) {
+              this.callback[msg.user_data](msg)
+              if (typeof msg.user_data === 'number') {
+                this.callback[msg.user_data] = undefined
+              }
+            }
+          } else {
+            let file = new FileReader()
+            file.onload = (evt) => {
+              if (evt.target.readyState == FileReader.DONE) {
+                let data = new Uint8Array(evt.target.result)
+                if (data[0] == this.SVR_BIN_MSG.CAP_FRAME) {
+                  return this.drawImage(data)
+                }
+              }
+            }
+
+            file.readAsArrayBuffer(evt.data)
+          }
+        }
+        let canvas = document.getElementById('cam')
+        canvas.onmousedown = (e) => {
+          canvas.style.cursor = 'crosshair'
+
+          this.clicked = true
+
+          this.sendMsg(this.CLT_MSG.PRESET_MOUSEDOWN, {origX: e.layerX, origY: e.layerY}, function (msg) {
+            if (msg.err !== 0) { }
+          })
+        }
+
+        canvas.onmousemove = (e) => {
+          if (!this.clicked) {
+            canvas.style.cursor = 'default'
+            return
+          }
+          canvas.style.cursor = 'crosshair'
+
+          this.sendMsg(this.CLT_MSG.PRESET_MOUSEMOVE, {offx: e.layerX, offy: e.layerY}, (msg) => {
+            if (msg.err !== 0) { }
+          })
+        }
+
+        onmouseout = canvas.onmouseup = (e) => {
+          canvas.style.cursor = 'default'
+          if (!this.clicked) { return }
+
+          this.sendMsg(this.CLT_MSG.PRESET_MOUSEUP, {offx: e.layerX, offy: e.layerY}, (msg) => {
+            if (msg.err !== 0) {
+
+            }
+          })
+          this.clicked = false
+        }
+      })
+    },
+    // 打开视频
+    cam_switch (capID) {
+      if (capID == 1) {
+        this.cameraurl = 'http://127.0.0.1:38088/video=stream&camidx=0'
+      }
+      if (capID == 2) {
+        this.cameraurl = 'http://127.0.0.1:38088/video=stream&camidx=1'
+      }
+    },
+    // 关闭视频
+    CloseVideo () {
+      this.cameraurl = ''
+    },
+    // //获取初始化结果
+    // GetInitRet(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.GET_EVENT,(msg)=> {
+    //       if(msg.err !== 0){
+    //         this.iswaiting = false
+    //         return
+    //       }
+    //   let event = msg.event
+    //   switch(event){
+    //     case 2:
+    //       this.output("设备连接中断，请重新连接后再次打开视频。");
+    //       break
+    //
+    //     case 1:
+    //       this.output("初始化成功");
+    //       break;
+    //
+    //     case 0:
+    //       this.output("设备非法");
+    //       break
+    //   }
+    //   this.iswaiting = false
+    //   })
+    // },
+    // //获取PID
+    // GetPid(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.GET_PID, (msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //
+    //     this.output("pid : " + msg.pid)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //获取分辨率
+    // GetFbl(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true;
+    //   this.sendMsg(this.CLT_MSG.GET_FBL, (msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false;
+    //       return;
+    //     }
+    //
+    //     this.output("分辨率 : " + msg.fbl);
+    //     this.iswaiting = false
+    //   });
+    // },
+    // //设置分辨率
+    // SetResolution(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   let first = false
+    //   let second = false
+    //   this.sendMsg(this.CLT_MSG.SET_MJPG, {isMJPG:1},(msg) => {   //设置MJPG格式
+    //     if(msg.err !== 0) {
+    //       first = true
+    //       if(first == true && second == true){
+    //         this.iswaiting = false
+    //         return
+    //       }
+    //     }
+    //     this.output("MJPG : " + 1)
+    //     first = true
+    //     if(first == true && second == true){
+    //       this.iswaiting = false
+    //     }
+    //   })
+    //   this.sendMsg(this.CLT_MSG.SET_FBL, {width:800,height:600},(msg) => {  //设置分辨率
+    //     if(msg.err !== 0) {
+    //       second = true
+    //       if(first == true && second == true){
+    //         this.iswaiting = false
+    //       }
+    //       return
+    //     }
+    //     this.output("设置分辨率 : width=" + 800 + ",height=" + 600)
+    //     second = true
+    //     if(first == true && second == true){
+    //       this.iswaiting = false
+    //     }
+    //   })
+    // },
+    // //设置视频旋转方向
+    // SetOrientation(){
+    //   let oriT = 0
+    //   //	设置转动 0 正常 1 上下转 2 左转 3 右转
+    //   if(this.iswaiting){
+    //     return
+    //   }
+    //   this.iswaiting = true
+    //   oriT = 2
+    //   if(oriT == 1){
+    //     this.rotanumber = 2
+    //   }else if(oriT == 2){
+    //     this.rotanumber = 3
+    //   }else if(oriT == 3){
+    //     this.rotanumber = 1
+    //   }
+    //   this.sendMsg(this.CLT_MSG.SET_TURN, {turn:oriT},(msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //
+    //     this.output("设置旋转 : turn=" + oriT)
+    //     this.iswaiting = false
+    //   });
+    // },
+    // //设置视频旋转方向
+    // SetLeft(){
+    //   //	设置转动 0 正常 1 上下转 2 左转 3 右转
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.rotanumber--;
+    //   let T = 0;
+    //   if(this.rotanumber%4 == 0){
+    //     T = 0;
+    //   }else if(this.rotanumber%4 == -1 || this.rotanumber%4 == 3){
+    //     T = 2;
+    //   }else if(this.rotanumber%4 == -2 || this.rotanumber%4 == 2){
+    //     T = 1;
+    //   }else if(this.rotanumber%4 == -3 || this.rotanumber%4 == 1){
+    //     T = 3
+    //   }
+    //   this.sendMsg(this.CLT_MSG.SET_TURN, {turn:T},(msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("设置旋转 : turn=" + T)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //设置视频旋转方向
+    // SetRight(){
+    //   //	设置转动 0 正常 1 上下转 2 左转 3 右转
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.rotanumber++;
+    //   var T = 0;
+    //   if(this.rotanumber%4 == 0){
+    //     T = 0
+    //   }else  if(this.rotanumber%4 == 1 || this.rotanumber%4 == -3){
+    //     T = 3
+    //   }else  if(this.rotanumber%4 == 2 || this.rotanumber%4 == -2){
+    //     T = 1
+    //   }else  if(this.rotanumber%4 == 3 || this.rotanumber%4 == -1){
+    //     T = 2
+    //   }
+    //   this.sendMsg(this.CLT_MSG.SET_TURN, {turn:T},(msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //
+    //     this.output("设置旋转 : turn=" + T)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // 设置截图保存的jpg格式压缩质量
+    SetQuality () {
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.SET_QUALITY, {quality: 50}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        this.output('设置拍照图片质量 : quality=' + 50)
+        this.iswaiting = false
+      })
+    },
+    // 设置自动裁边开启
+    SetAutoCutOn () {
+      console.log('设置自动采编')
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.SET_AUTOCROP, {open: 1}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        this.output('设置自动裁边 : open=' + 1)
+        this.iswaiting = false
+      })
+    },
+    // 设置自动裁边关闭
+    SetAutoCutOff () {
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.SET_AUTOCROP, {open: 0}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        this.output('设置自动裁边 : open=' + 0)
+        this.iswaiting = false
+      })
+    },
+    // //设置预设框选
+    // SetBox(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.resetx = 20
+    //   this.resety = 20
+    //   this.resetwidth = 300
+    //   this.resetheight = 400
+    //   this.sendMsg(this.CLT_MSG.SET_PREST, {left:this.resetx, top:this.resety, width:this.resetwidth, height:this.resetheight},(msg) =>{
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("设置预设框选 : left=" + this.resetx + ",top=" + this.resety + ",width=" + this.resetwidth + ",height=" + this.resetheight);
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //获取当前预设框选参数
+    // ShowResetInfo(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.GET_PREST_INFO, (msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("当前预设 : " + msg.prest_info)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // 取消预设框选
+    ResetBox () {
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.SET_PREST, {left: 0, top: 0, width: 0, height: 0}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        this.resetx = 0
+        this.resety = 0
+        this.resetwidth = 0
+        this.resetheight = 0
+        this.output('取消预设框选')
+        this.iswaiting = false
+      })
+    },
+    // //视频格式弹窗
+    // FormatDlg(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.FORMAT_DLG,(msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false;
+    //       return
+    //     }
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //视频属性弹窗
+    // PropertyDlg(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.PROPERTY_DLG,(msg) => {
+    //     if(msg.err !== 0) {
+    //       this.iswaiting = false;
+    //       return
+    //     }
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //设置颜色模式 只针对截图
+    bb () {
+      let camidx = 0
+      if (this.cameraurl === 'http://127.0.0.1:38088/video=stream&camidx=0') {
+        camidx = 0
+      } else if (this.cameraurl === 'http://127.0.0.1:38088/video=stream&camidx=1') {
+        camidx = 1
+      } else {
+        this.showAlert('请先打开视频', 'warning', 2000)
+        return
+      }
+      let param = {
+        camidx: camidx
+      }
+      this.$resetpost('http://127.0.0.1:38088/video=grabimage', param).then((msg) => {   // 截图
+        console.log(msg)
+
+        if (msg.data.code != '0') {
+          this.$showAlert(msg.data.message, 'warning', 2000)
+          return
+        }
+        let s = 'data:image/jpg;base64,' + msg.data.photoBase64
+        document.getElementById('Base64IMG').src = s// 网页预览图片
+
+        this.output('base64 长度 : ' + s.length)
+
+        this.$dispatch('photo-finish', msg.data.photoBase64)
+        // document.getElementById("Base64IMG").src= "D:\\1234.jpg?" + Math.random();//网页预览图片
+      })
+    },
+    // 内存截图
+    bbase64 () {
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.GET_PICTURE_MEM, {turn: 0}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        let s = 'data:image/jpg;base64,' + msg.base64str
+        document.getElementById('Base64IMG').src = s// 网页预览图片
+        alert(s)
+        this.output('base64 长度 : ' + s.length)
+        this.iswaiting = false
+      })
+    },
+    // base64编码测试
+    TestBase64 () {
+      if (this.iswaiting) return
+      this.iswaiting = true
+      this.sendMsg(this.CLT_MSG.TEST_BASE64, {code: '123456789'}, (msg) => {
+        if (msg.err !== 0) {
+          this.iswaiting = false
+          return
+        }
+        this.output('base64 内容 : ' + msg.base64str)
+        this.iswaiting = false
+      })
+    },
+    // //开启去底色
+    // bbStartClean(){
+    //   if(this.iswaiting) return;
+    //   this.iswaiting = true;
+    //   this.sendMsg(this.CLT_MSG.SET_CLEAN_PARAM,{param1:280,param2:1.15,param3:8},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("去底色: " + 280 + "," + 1.15 + "," + 8)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //关闭去底色
+    // bbCloseClean(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.SET_CLEAN_PARAM,{param1:-1},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false;
+    //       return
+    //     }
+    //     this.output("去底色: " + -1);
+    //     this.iswaiting = false;
+    //   });
+    // },
+    // //设置制作PDF临时目录
+    // SetPDFPath(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.SET_TEMPDIR,{path:"d:\\tp\\temp"},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("设置PDF路径: " + "d:\\tp\\temp")
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //开始制作PDF
+    // BeginPDF(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.BEGIN_PDF,(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("开始制作PDF")
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //PDF截图 保存到PDF临时目录
+    // GetPDF(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.GET_PDF_PICTURES,{turn:0},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     // let s =  "file://" + msg.path
+    //     let s = "data:image/jpg;base64," + msg.base64str;
+    //     document.getElementById("IMG1").src= null;
+    //     document.getElementById("IMG1").src= document.getElementById("IMG2").src;
+    //
+    //     document.getElementById("IMG2").src= null;
+    //     document.getElementById("IMG2").src= document.getElementById("IMG3").src;
+    //
+    //     document.getElementById("IMG3").src= null;
+    //     document.getElementById("IMG3").src= s;
+    //     this.output("PDF 文件 : " + msg.path + ",PDF文件 BASE64码长度：" + msg.base64str.length);
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // // 结束制作PDF
+    // EndPDF(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.END_PDF_PICTURES,{path:"D:\\tp\\1234.pdf"},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("结束PDF PDF文件：" + "D:\\tp\\1234.pdf");
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //PDF文件转码成BASE64文件   适合所有格式文件 非PDF也可使用
+    // PDFtoBASE64(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.PDF_TO_BASE64,{src:"D:\\tp\\1234.pdf",des:"D:\\tp\\temp\\1234.txt"},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       if(msg.err == 108){return this.output("读文件错误")}
+    //       if(msg.err == 109){return this.output("写文件错误")}
+    //     }
+    //     this.output("文件 ：" + "D:\\tp\\1234.pdf" + "转成base64 ：" + "D:\\tp\\temp\\1234.txt");
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //base64文件转成PDF文件 适合所有文件 非PDF文件也可使用
+    // BASE64toPDF(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.BASE64_TO_PDF,{src:"D:\\tp\\temp\\1234.txt",des:"D:\\tp\\pdfpdf.pdf"},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false;
+    //       if(msg.err == 108){return this.output("读文件错误")}
+    //       if(msg.err == 109){return this.output("写文件错误")}
+    //     }
+    //     this.output("base64文件: " + "D:\\tp\\temp\\1234.txt" + "转成:" + "D:\\tp\\pdfpdf.pdf")
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //PDF文件转成BASE64码字符串 适合所有文件 非PDF文件也可使用
+    // PDFtoBASE64Str(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.PDF_TO_BASE64_STR,{file:"D:\\tp\\pdfpdf.pdf"},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       if(msg.err == 108){return this.output("读文件错误")}
+    //     }
+    //     alert(msg.base64str)
+    //     this.output("文件 BASE64 长度: " + msg.base64str.length)
+    //     this.iswaiting = false
+    //   })
+    // },
+    // //打印图片
+    // printimage(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.PRINT_IMAGE,{file:"D:\\tp\\1234.jpg"},(msg) => {
+    //     if(msg.err !== 0){ //错误消息可以不用处理 在config.js中已经有了统一的打印处理 在output函数中设置打印位置
+    //       this.iswaiting = false;
+    //       if(msg.err == 112){return this.output("开启打印机错误");}
+    //       if(msg.err == 111){return this.output("请检查打印机纸张");}
+    //       if(msg.err == 110){return this.output("没有默认打印机");}
+    //     }
+    //     this.output("打印作业号: " + msg.print_no);
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //显示错误弹窗
+    // ShowErrorInfo(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.SHOW_ERROR_BOX,{on:1},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("错误提示开关：" + 1)
+    //     this.iswaiting = false;
+    //   })
+    // },
+    // //删除制作PDF的图片文件
+    // DelPDF3(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.DEL_PICTURE_PDF,{file:1},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("删除PDF图片文件成功")
+    //     this.iswaiting = false
+    //   })
+    //   document.getElementById("IMG3").src= null;
+    //   document.getElementById("IMG3").src= document.getElementById("IMG2").src;
+    //
+    //   document.getElementById("IMG2").src= null;
+    //   document.getElementById("IMG2").src= document.getElementById("IMG1").src;
+    //
+    //   document.getElementById("IMG1").src= null;
+    // },
+    // //删除制作PDF的临时图片文件
+    // DelPDF2(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.DEL_PICTURE_PDF,{file:2},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("删除PDF图片文件成功")
+    //     this.iswaiting = false
+    //   })
+    //   document.getElementById("IMG2").src= null;
+    //   document.getElementById("IMG2").src= document.getElementById("IMG1").src;
+    //   document.getElementById("IMG1").src= null;
+    // },
+    // //删除制作PDF的临时图片文件
+    // DelPDF1(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   this.sendMsg(this.CLT_MSG.DEL_PICTURE_PDF,{file:3},(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false;
+    //       return
+    //     }
+    //     this.output("删除PDF图片文件成功")
+    //     this.iswaiting = false
+    //   })
+    //   document.getElementById("IMG1").src= null;
+    // },
+    // //人证对比
+    // IDCardCompare(){
+    //   if(this.iswaiting) return
+    //   this.iswaiting = true
+    //   let send = {file1:"D:\\1.jpg",file2:"D:\\2.jpg"}
+    //   this.sendMsg(this.CLT_MSG.IDCARD_COMPARE,send,(msg) => {
+    //     if(msg.err !== 0){
+    //       this.iswaiting = false
+    //       return
+    //     }
+    //     this.output("对比完成:" + send.file1 + "与" + send.file2 + "相似度"+ msg.cmpresult)
+    //     this.iswaiting = false
+    //   })
+    // },
+    ReadIDCard () {
+      return this.sendMsg(this.CLT_MSG.READ_IDCARD, (msg) => {
+        if (msg.err !== 0) { return }
+        this.setText(msg)
+        this.output('单读卡')
+      })
+    },
+    // 读身份证
+    Begin () {
+      this.sendMsg(this.CLT_MSG.BEGIN_READ_IDCARD, {user_data: 'idcard'})
+      this.callback['idcard'] = (msg) => {
+        if (msg.err !== 0) { return }
+        this.setText(msg)
+        this.output('读取身份证')
+      }
+      this.output('开始读卡')
+    },
+    // 停止读身份证
+    Stop () {
+      this.sendMsg(this.CLT_MSG.STOP_READ_IDCARD, (msg) => {
+        if (msg.err !== 0) { return }
+        this.output('停止读卡')
+      })
+    },
+    // //横向复印
+    // HCopy(){
+    //   this.sendMsg(this.CLT_MSG.HCOPY_IDCARD, {copy_path:"D:\\"},(msg) => {
+    //     if(msg.err !== 0){return}
+    //     document.getElementById("IDCardDisplay").src = "data:image/jpg;base64," + msg.hcopy
+    //     this.sendMsg(this.CLT_MSG.PRINT_IMAGE,{file:msg.filename},(msg2) => {
+    //       if(msg2.err !== 0){ return}
+    //       his.output("打印作业号: " + msg2.print_no)
+    //     })
+    //     this.output("横向复印" + msg.filename)
+    //   })
+    // },
+    // //竖向复印
+    // VCopy(){
+    //   this.sendMsg(this.CLT_MSG.VCOPY_IDCARD, {copy_path:"D:\\"},(msg) => {
+    //     if(msg.err !== 0){return}
+    //     document.getElementById("IDCardDisplay").src = "data:image/jpg;base64," + msg.vcopy;
+    //     this.sendMsg(this.CLT_MSG.PRINT_IMAGE,{file:msg.filename},(msg2) => {
+    //       if(msg2.err !== 0){ return}
+    //       this.output("打印作业号: " + msg2.print_no)
+    //     })
+    //     this.output("竖向复印" + msg.filename)
+    //   })
+    // },
+    // //正面复印
+    // PCopy(){
+    //   this.sendMsg(this.CLT_MSG.PCOPY_IDCARD, {copy_path:"D:\\"},(msg) => {
+    //     if(msg.err !== 0){return}
+    //     document.getElementById("IDCardDisplay").src = "data:image/jpg;base64," + msg.pcopy
+    //     this.sendMsg(this.CLT_MSG.PRINT_IMAGE,{file:msg.filename},(msg2) => {
+    //       if(msg2.err !== 0){ return}
+    //       this.output("打印作业号: " + msg2.print_no)
+    //     })
+    //     this.output("正面复印" + msg.filename)
+    //   })
+    // },
+    // //反面复印
+    // NCopy(){
+    //   this.sendMsg(this.CLT_MSG.NCOPY_IDCARD, {copy_path:"D:\\"},(msg) => {
+    //     if(msg.err !== 0){return}
+    //     document.getElementById("IDCardDisplay").src = "data:image/jpg;base64," + msg.ncopy
+    //     this.sendMsg(this.CLT_MSG.PRINT_IMAGE,{file:msg.filename},(msg2) => {
+    //       if(msg2.err !== 0){ return}
+    //       this.output("打印作业号: " + msg2.print_no)
+    //     })
+    //     this.output("反面复印" + msg.filename)
+    //   })
+    // },
+    // 视频帧绘制函数
+    drawImage (data) {
+      // 校验视频是否在一定时间内的
+      if (!this.checkTimestamp(data[2] * 256 + data[1])) {
+        return
+      }
+      // 视频帧头有时间戳 注意偏移 和 大小端处理
+      let width = data[this.base_offset + 1] * 256 + data[this.base_offset]
+      let height = data[this.base_offset + 3] * 256 + data[this.base_offset + 2]
+
+      let cam = document.getElementById('cam')
+      let context = cam.getContext('2d')
+      if (this.orgdrawwidth != width || this.orgdrawheight != height) {
+        this.orgdrawwidth = width
+        this.orgdrawheight = height
+        cam.height = cam.height
+      }
+
+      let image = context.createImageData(width, height)
+      for (let n = 0; n != height; ++n) {
+        for (let m = 0; m != width; ++m) {
+          let image_offset = ((height - n - 1) * width + m) * 4
+          let data_offset = (n * width + m) * 3 + this.base_offset + 4
+          image.data[image_offset] 			= data[data_offset + 2]
+          image.data[image_offset + 1] 	= data[data_offset + 1]
+          image.data[image_offset + 2] 	= data[data_offset]
+          image.data[image_offset + 3] 	= 255
+        }
+      }
+      context.putImageData(image, 0, 0)
+    },
+    checkTimestamp (svr_time) {
+      let myDate = new Date()
+      let clt_time = myDate.getSeconds() * 1000 + myDate.getMilliseconds()
+      if (clt_time < svr_time) {
+        clt_time += 60 * 1000
+      }
+      return clt_time - svr_time < 3000
+    },
+    sendMsg (proto, msg, cb) {
+      if (!ws) {
+        return
+      }
+
+      if (typeof msg !== 'object') {
+        if (typeof msg === 'function') {
+          cb = msg
+          msg = {}
+        } else {
+          msg = {}
+        }
+      }
+
+      msg.proto = proto
+      if (typeof cb === 'function') {
+        this.callback[++this.context] = cb
+        msg.user_data = this.context
+      }
+
+      ws.send(JSON.stringify(msg))
+    },
+    output (content) {
+      if (content.length == 0) {	return }
+      let console = document.getElementById('Console')
+      console.value += content
+      console.value += '\r'
+      console.scrollTop = console.scrollHeight
+    },
+    // 显示读到的身份证信息
+    setText (msg) {
+      document.getElementById('Name').value = msg.strName
+      document.getElementById('Sex').value = msg.strSex
+      document.getElementById('Nation').value = msg.strNation
+      document.getElementById('Born').value = msg.strBirth
+      document.getElementById('Address').value = msg.strAddress
+      document.getElementById('CardNo').value = msg.strID
+      document.getElementById('Police').value = msg.strOrg
+      document.getElementById('ActivityLFrom').value = msg.strVaildityfrom
+      document.getElementById('ActivityLTo').value = msg.strVaildityto
+      document.getElementById('DeviceNo').value = msg.strName
+      document.getElementById('PhotoBuffer').value = msg.base64BMP
+      document.getElementById('PhotoDisplay').src = 'data:image/jpg;base64,' + msg.base64BMP
+    },
+    close () {
+      this.show = !this.show
+      if (this.isopen) {
+        this.CloseVideo()
+      }
+    }
+  },
+  ready () {
+    this.onLoad().then(() => {
+      this.$emit('ready')
+    }).catch((error) => {
+      this.$emit('error', error)
+    })
+  }
+}
+</script>
+
+<style scoped>
+.modal-bk{
+  border-radius:18px 0;
+}
+.header{
+  background-color: #d8e9f3;
+  height: 88px;
+}
+.title{
+  position: absolute;
+  font-family:PingFang-SC-Bold;
+  font-size:36px;
+  color: #666666;
+  margin-top: 32px;
+  margin-left: 300px;
+  margin-bottom: 0px;
+}
+.operation{
+  font-family:PingFang-SC-Medium;
+  font-size: 22px;
+  color:#666666;
+  line-height: 5px;
+}
+.operation-group{
+  margin-left: 36px;
+  margin-top: 20px;
+}
+.photo{
+  font-family: PingFang-SC-Medium;
+  font-size: 20px;
+  color: #ffffff;
+  margin-left: 20px;
+  border-radius: 4px;
+  background-color: #2fadf5;
+  height: 32px;
+  width: 92px;
+  line-height:12px;
+}
+.readIDCard{
+  font-family: PingFang-SC-Medium;
+  font-size: 20px;
+  color: #ffffff;
+  border-radius: 4px;
+  background-color: #2fadf5;
+  margin-left: 20px;
+  width: 120px;
+  height: 32px;
+  line-height: 12px;
+}
+.stop{
+  border-radius: 4px;
+  border: 1px solid #2fadf5;
+  font-family: PingFang-SC-Medium;
+  font-size: 20px;
+  color: #2fadf5;
+  width: 120px;
+  height: 32px;
+  line-height: 12px;
+}
+.showInfo{
+  float: left;
+  width: 640px;
+  display: inline-block;
+  margin-top: 20px;
+  margin-left: 36px;
+}
+#Console{
+  margin-left: 18px;
+  border-radius: 4px;
+  border: 1px solid #b5b5b5;
+  height:300px;
+  width:322px;
+  resize:none;
+  background-color: #f6f6f6;
+}
+.img{
+  height:300px;
+  width:300px;
+  float: left;
+  border-radius: 4px;
+  border: 1px solid #b5b5b5;
+}
+#cam{
+  border-radius: 4px;
+  border:1px solid #b5b5b5;
+  display: inline-block
+}
+.IdCard{
+  height: 950px;
+  width: 692px;
+  display: inline-block;
+  border-radius: 20px;
+  background-color: #fafafa;
+  border: 1px solid #d8f1ff;
+  margin-left: 40px;
+  margin-top: 20px;
+}
+.IdInput{
+  border-radius: 4px;
+  border: 1px solid #939393;
+  width: 400px;
+  height: 38px;
+  margin-left: 20px;
+}
+.IdInputDiv{
+  margin-top: 20px;
+  margin-left: 100px;
+}
+.IdHint{
+  font-family: PingFang-SC-Medium;
+  font-size: 18px;
+  color: #7e7c81;
+}
+#PhotoBuffer,#PhotoDisplay{
+  border-radius: 4px;
+  background-color: #ffffff;
+  border: 1px solid #939393;
+  margin-left: 20px;
+}
+</style>