<template>
  <div>
    <div v-if="type==='heightCamera'">
      <Alert type="error" v-if="errMsg.show">{{errMsg.msg}}</Alert>
      <Row>
        <Col span="24">
          <div id="CameraCtl" style="width:100%; height: 400px">
            <img id="streamimage" style="width:100%; height: 400px" src="http://127.0.0.1:38088/?video=stream&camidx=0"/>
    </div>
        </Col>
        <Col span="24">
          <Button type="primary" class="camera_btn" @click="TakePhotos" :loading="loading">拍照</Button>
        </Col>
      </Row>
    </div>
    <div v-if="type==='faceCamera'">
      <Row>
        <i-col span="24">
          <Alert type="error" v-if="errMsg.show">{{errMsg.msg}}</Alert>
        </i-col>
        <i-col span="12">
          <img id="streamimage" width="200px" height="200px" src="http://127.0.0.1:38088/video=stream&camidx=1"/>
        </i-col>
        <i-col span="12">
          <img :src="backImgUrl" width="200px" height="200px" />
        </i-col>
        <i-col span="3">
          <Button type="primary" @click="TakePhoto">拍照</Button>
        </i-col>
<!--        <i-col span="12">-->
<!--&lt;!&ndash;          <Button type="primary" :loading="loading" @click="savePhoto">&ndash;&gt;-->
<!--&lt;!&ndash;            <span v-if="!loading">保存</span>&ndash;&gt;-->
<!--&lt;!&ndash;            <span v-else>正在保存...</span>&ndash;&gt;-->
<!--&lt;!&ndash;          </Button>&ndash;&gt;-->
<!--          <Button type="primary" :loading="loading" @click="getIdcardInfo">-->
<!--          card-->
<!--          </Button>-->
<!--        </i-col>-->
      </Row>
    </div>
  </div>
</template>

<script>
import { createUpLoadFiles, getSign } from '@/api/common'
import axios from 'axios'
// import { sss } from '../../../api/eventlist'
// import { StartCam } from '../../../../public/static/gaopaiyi/OcxUtil.jfs'
export default {
  name: 'DianYiPaiDevice',
  components: {},
  props: {
    isOpen: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    filePath: {
      type: String,
      default: () => {
        return 'dian-yi-pai'
      }
    },
    fileName: {
      type: String,
      default: () => {
        return 'dian-yi-pai'
      }
    },
    type: {
      type: String,
      default: () => {
        return 'idcard' // heightCamera----faceCamera----idcard
      }
    }
  },
  data () {
    return {
      code: '',
      baseImg: '',
      errMsg: {
        show: false,
        msg: '',
        isIE: true,
        isSecondDev: true,
        camidMain: 0,
        camidSub: 0
      },
      stockData: Object,
      loading: false,
      backImgUrl: '',
      imgHeader: 'data:image/jpeg;base64,'
    }
  },
  computed: {
    catImg () {
      return this.imgHeader + this.baseImg64
    }
  },
  created () {
    window.location.href = 'cameraServicetis:0'
  },
  watch: {
    isOpen (e) {
      if (e) {
        this.backImgUrl = ''
        // console.log(this.camidMain, this.camidSub, this.isIE)
        // this.test()
        // try {
        //   this.Camera.sendMsg('{"StartVideo"}')
        //   '{"isIE":flase,"isSecondDev":flase,"camidMain":"ActiveXDivOne",:"camidSub":0}'
        //   this.diyfun('D5BD5B4A-4FC0-4869-880B-27EE9869D706', '500px', '500px')
        //   CAM_Open(de06bab018b6a09fc1e0, 0, 300, 300)
        //   this.Camera.runmessage = this.acceptMsg
        // } catch (e) {
        //   this.ShowInfo('没有发现设备')
        // }
      } else {
        this.Camera.sendMsg(
          '{"type":6,"object":"dialog","method":26,"args":["closeSignal"],"id":3}'
        )
      }
    }
  },
  methods: {
    test () {
      CAM_Open(this.camidMain, 0, 300, 300)
      StartCam(this.camidMain, 300, 300)
    },
    acceptMsg (event) {
      if (this.type === 'idcard') {
        let data = JSON.parse(event.data)
        if (data.args && data.args.length > 0) {
          let arrInfo = data.args[0].split(' ')
          this.resultIdCart(arrInfo[0], arrInfo[1], arrInfo[2], arrInfo[3])
        }
        this.stockData = 'data:image/jpeg;base64,' + data.args[0]
      }
      if (this.type === 'heightCamera') {
        let data = JSON.parse(event.data)
        this.stockData = 'data:image/jpeg;base64,' + data.args[0]
      }
      if (this.type === 'faceCamera') {
        let data = JSON.parse(event.data)
        this.stockData = 'data:image/jpeg;base64,' + data.args[0]
      }
    },
    ShowInfo (op) {
      this.errMsg = { show: true, msg: op }
      let that = this
      setTimeout(function () {
        that.errMsg = { show: false, msg: '' }
      }, 2000)
    },
    formatDate (time) {
      let date = new Date(time)
      let year = date.getFullYear()
      let month = date.getMonth() + 1
      let day = date.getDate()
      let hour = date.getHours()
      let min = date.getMinutes()
      let sec = date.getSeconds()
      let newTime =
        year +
        (month < 10 ? '0' + month : month) +
        (day < 10 ? '0' + day : day) +
        (hour < 10 ? '0' + hour : hour) +
        (min < 10 ? '0' + min : min) +
        (sec < 10 ? '0' + sec : sec)
      return newTime
    },
    toOpenCamera () {
      this.ShowInfo('打开了设备！')
    },
    // 人脸拍照
    TakePhoto () {
      let _this = this
      this.code = ''
      this.baseImg = ''
      let param = '{"filepath": "","rotate": "0","camidx": "1", "cutpage": "0", "watermark": { "pos": "4", "cotent": "", "transparency": "100", "fontsize": "60", "font": "微软雅黑", "color": "red"}}'
      axios({
        method: 'POST',
        dataType: 'json',
        url: 'http://127.0.0.1:38088/video=grabimage',
        data: param
      }).then(function (response) {
        if (response.data.code === '0') {
          let baseImg = response.data.photoBase64
          _this.upimg(baseImg)
        }
      })
    },
    // 高拍仪拍照
    TakePhotos () {
      let _this = this
      this.code = ''
      this.baseImg = ''
      let param = '{"filepath": "","rotate": "0","camidx": "0", "cutpage": "0", "watermark": { "pos": "4", "cotent": "", "transparency": "100", "fontsize": "60", "font": "微软雅黑", "color": "red"}}'
      axios({
        method: 'POST',
        dataType: 'json',
        url: 'http://127.0.0.1:38088/video=grabimage',
        data: param
      }).then(function (response) {
        if (response.data.code === '0') {
          let baseImg = response.data.photoBase64
          _this.upimg(baseImg)
        }
      })
    },
    // 身份证识别
    getIdcardInfo () {
      let _this = this
      let param = ''
      axios({
        method: 'POST',
        dataType: 'json',
        url: 'http://127.0.0.1:38088/card=idcard',
        data: param
      }).then(function (response) {
        if (response.data.code === '0') {
          _this.resultIdCart(response.data.IDCardInfo)
        }
      })
    },
    upimg (base64img) {
      this.backImgUrl = ''
      let that = this
      this.loading = true
      let params = {}
      params.file = base64img
      params.filePath = this.filePath
      params.fileName = this.fileName
      // params.filePath = 'abc'
      // params.fileName = 'abc.png'
      var time = new Date().getTime()
      this.timeStep = time.toString()
      let param = {
        filePath: params.filePath,
        fileName: params.fileName,
        timestamp: this.timeStep
      }
      getSign(param).then(res => {
        if (res.data.errcode === 0) {
          let sign = res.data.data.sign
          console.log(sign)
          createUpLoadFiles(res.data.data.docking_url, { sign: sign, timestamp: this.timeStep, filePath: params.filePath, fileName: params.fileName, file: base64img }).then(res => {
            if (res.data.errcode === 0) {
              that.loading = false
              // console.log(res.data.data, 's')
              // let data = JSON.parse(res.data.data)
              that.backImgUrl = res.data.data
              that.$emit('resultAction', res.data, base64img)
            } else {
              that.loading = false
              that.$Notice.error({ title: '上传失败', desc: '请重新拍照' })
            }
          })
        } else {
          this.$Notice.error({ title: '上传失败', desc: res.data.data.msg })
        }
      })
    },
    resultIdCart (data) {
      console.log('@@@@@@@@@')
      let cardInfo = {}
      cardInfo.idcard = data.cardID
      cardInfo.name = data.name
      cardInfo.sex = data.sex
      cardInfo.address = data.address
      cardInfo.folk = data.nation
      cardInfo.birthday = data.birthday
      cardInfo.HeadPic = data.photoBase64
      this.$emit('resultAction', cardInfo)
    }
  },
  mounted () {

  }
}
</script>
<style>
.camera_btn {
  margin-right: 5px;
  margin-top: 5px;
}
</style>
