<template>

  <modal :show.sync="show" v-ref:modal :backdrop="isBack">
    <div slot="modal-header" class="modal-header">
      <span class="modal-title font">
        安检单打印
      </span>
    </div>

    <div slot="modal-body" class="modal-body">
      <div id="print1" >
        <div id="print2">
          <style id="style1">
            #print2 td{
              height:32px;
              width: 100px;
              text-align: center;
            }
            #print2 table{
              margin: auto;
            }
            #print2 h1{
              text-align: center;
            }
            #print2 p{
              text-align: center;
            }
            .border-btn{
              border-bottom: #000000 solid 2px;
            }
          </style>
          <table border="1" cellspacing="0">
            <tr>
              <td colspan="6"> <h3>客户安全检查记录表</h3> </td>
            </tr>
            <tr>
              <td><b>用户编号</b></td><td>{{userinfo.f_userinfo_code}}</td><td ><b>用户姓名</b></td><td >{{userinfo.f_user_name}}</td><td><b>联系电话</b></td>
              <td>{{userinfo.f_user_phone}}</td>
            </tr>
            <tr>
              <td><b>地址</b></td><td colspan="5">{{userinfo.f_address}}
            </tr>
            <tr align="left">
              <td><b>表编号</b></td><td colspan="2">{{deviceInfo.bbh}}</td>
              <td><b>表封号</b></td><td colspan="2">{{deviceInfo.bfh}}</td>
            </tr>
            <tr align="left">
              <td><b>表型号</b></td><td>{{deviceInfo.bxh}}</td>
              <td><b>表品牌</b></td><td>{{deviceInfo.bpp}}</td>
              <td><b>进气方向</b></td><td>{{deviceInfo.jqfx}}</td>
            </tr>
            <tr align="left">
              <td><b>表读数</b></td><td colspan="2">{{deviceInfo.jbds}}</td>
              <td><b>余量</b></td><td colspan="2">{{deviceInfo.yl}}</td>
            </tr>
            <!--<tr align="left">
              <td><b>基表读数</b></td><td colspan="2">{{userinfo.f_userinfo_code}}</td>
              <td><b>余量</b></td><td colspan="2">{{userinfo.f_userinfo_code}}</td>
            </tr>-->
            <tr align="left">
              <td colspan="6"><b>隐患情况列表</b></td>
            </tr>
            <tr align="left" v-for="de in defectList">
              <td colspan="3">{{de.dname}}</td>
              <td colspan="3">{{de.dvalue}}</td>
            </tr>
            <tr align="left" v-if="">
              <td colspan="6"><b>隐患情况列表</b></td>
            </tr>

            <tr>
              <td><b>安检员</b></td><td>{{data.f_checker_name}}</td>
              <td><b>安检时间</b></td><td>{{data.f_upload_date}}</td>
              <td><b>用户签字</b></td><td><img-self :src='userinfo.f_sign_path' alt="未签名"></img-self></td>
            </tr>
            <tr style="max-width: 550px">
              <td :rowspan="userinfo.f_overall_imgs.length()"><b>总体安检照片</b></td>
              <template v-for="img in userinfo.f_overall_imgs">
                <td><img-self :src="'rs/image/file/'+img.f_overall_path" alt="无总体安检照片"  width="150"
                              height="200"></img-self></td>
              </template>
            </tr>
          </table>
        </div>
      </div>
      确定打印安检单？
    </div>
    <div slot="modal-footer" class="modal-footer">
      <button type="button" class="btn btn-cancel" @click="cancel()">取消</button>
      <print-element class="btn btn-success width-80" id="print1" styleid='style1' top='40' left='60' width='100%' height='100%' v-ref:printelement>打印</print-element>
    </div>
  </modal>
</template>

<script>

import co from 'co'
import { PagedList } from 'vue-client'
import * as Util from '../../Util'

export default {
  title: '安检信息',
  data () {
    return {
      imgs:[],
      normalDevices:{},//设备信息
      device:[],//表具信息
      devices:[],//所有表具信息
      userinfo:[],
      defectList:[],
      deviceInfo:{
        bfh:'',
        bxh:'',
        bbh:'',
        jbds:'',
        yl:'',
        bpp:'',
        jqfx:''

      },//具体表具信息
      deviceInfos:{},//每个表具的所有信息
      drowspan:0,
      erowspan:0,//设备信息个数
      hrowspan:0,//隐患数
      f_defect_content:'', //安检结果
      equipmentmsgs:[],//所有设备信息
      Hinvestigations:[], //所有隐患信息
      Hinvestigation:{},
      defect:{},//隐患信息
      normal:{},
      normalDevice:[],
      Hiddenchecks:[],
      hiddenvalues:[],
      HazardDevice:[],
      HazardDevices:{},
      printtime:'',
      print_id:'',
      showAdd:true,
      company:'',
      isBack:false
    }
  },
  props: ['data','show'],
  ready () {
    // let value = f_fengongsi
    // let index = value.indexOf('.')
    // this.company = value.substring(index+1,value.length)
    this.$resetpost('rs/path/getUserinfomation', {data:{condition:`id = '${this.data.id}'`}}).then((res)=>{
      //tag
      if(res.data.length>0){
        this.userinfo = res.data[0]
        if(this.userinfo.f_sign_path != ''){
          this.userinfo.f_sign_path = 'rs/image/file/' + this.userinfo.f_sign_path
        }
        this.getHidden()
      }else{
        //tag
        this.$showMessage('未查询到该用户安检单信息')
        this.$parent.showcheckmsg = false

      }
    })
  },
  methods: {
    cancel(){
      this.$parent.showcheckmsg = false
    },
    gotoPage(val,data,self='tab'){
      //tag
      data.f_type = '回访'
      data.f_telvisit_type = '安检'
      this.$goto(val,{row:data},self)
    },
    //获取当前时间
    getNowFormatDate() {
      var date = new Date(this.userinfo.f_check_date);
      var month = date.getMonth() + 1;
      var strDate = date.getDate();
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
      }
      var currentdate = date.getFullYear() +'年'+ month + '月' + strDate
        + "日" + date.getHours() + "时" + date.getMinutes()+'分'
      return currentdate;
    },
    // getId(){
    //   //tag
    // },
    //获取隐患信息
    getHidden(){
      //清空所有数据

      for(let rowsStr in this.userinfo.f_devices){
        //tag
        if(this.userinfo.f_devices[rowsStr].f_device_type=='燃气表'){
          for(let device in this.userinfo.f_devices[rowsStr].f_items){
            if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="表封号"){
              this.deviceInfo.bfh=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="气表型号"){
              this.deviceInfo.bxh=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="基表编号"){
              this.deviceInfo.bbh=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="已用气量" || this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="已用金额"){
              this.deviceInfo.jbds=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="剩余气量" || this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="剩余金额"){
              this.deviceInfo.yl=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="气表品牌"){
              this.deviceInfo.bpp=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }else if(this.userinfo.f_devices[rowsStr].f_items[device].f_item_name=="进气方向"){
              this.deviceInfo.jqfx=this.userinfo.f_devices[rowsStr].f_items[device].f_item_lists[0].f_item_value
            }
          }
        }
      }
      let defectlist=JSON.parse(this.userinfo.f_defect_content).data
      //tag+"---"+JSON.stringify(this.deviceInfo))
      for(let i=0;i< defectlist.length;i++){
        for(let key in defectlist[i]){
          this.defectList.push({dname:key,dvalue:defectlist[i][key]})
        }
      }

      /*setTimeout(()=> {
        //tag
        this.$parent.showcheckmsg = false
      }, 1000)*/
    },
  }
}
</script>
<style media="screen" scoped>
.divtext {
  min-width: 50px;
  max-width: 200px;
  border: 1px solid green;
  display: inline-block;
}
.bg-info{
  border-left: 5px solid #5989be;
}
.bg-cus-body {
  margin-left: 5px;
}

</style>
