<template>
  <div class="auto app-text">
    <div class="panel" style="padding: 10px 10px 5px 10px;">
      <div class="panel-body panel-self">
        <div class="col-xs-12">
          <p class="panel-title col-xs-4 text-left font" style="width: 21%;float: left"><b>用户编号:</b></p>
          <a class="panel-title col-xs-8 text-left input-font" style="width: 79%;color: blue;text-decoration:underline" @click="searchHistory(userinfo.f_userinfoid)">{{ userinfo.f_userinfo_code }}</a>
        </div>
        <div class="col-xs-12">
          <p class="panel-title col-xs-4 text-left font"><b>用户名称:</b></p>
          <p class="panel-title col-xs-8 text-left input-font">{{ userinfo.f_user_name }}</p>
        </div>
        <div class="col-xs-12">
          <p class="panel-title col-xs-4 text-left font"><b>用户类型:</b></p>
          <p class="panel-title col-xs-8 text-left input-font">{{ userinfo.f_check_type }}
          </p>
        </div>
        <div class="col-xs-12" style="padding: 2px 0">
          <p class="panel-title text-left font" style="width: 23%;float: left"><b>用户电话:</b></p>
          <input class="panel-title text-left input-font" style="width: 67%" value="{{ userinfo.f_user_phone2 ? userinfo.f_user_phone2 : userinfo.f_user_phone }}" v-model="userinfo.f_user_phone"/>
        </div>
        <div class="col-xs-12" style="padding: 2px 0">
          <p class="panel-title text-left font" style="width: 23%;float: left"><b>租户姓名:</b></p>
          <input class="panel-title text-left input-font" style="width: 67%" value="{{userinfo.f_used_name}}" v-model="userinfo.f_used_name"/>
        </div>
        <div class="col-xs-12" style="padding: 2px 0">
          <p class="panel-title text-left font" style="width: 23%;float: left"><b>租户电话:</b></p>
          <input class="panel-title text-left input-font" style="width: 67%" value="{{userinfo.f_rent_phone}}" v-model="userinfo.f_rent_phone"/>
        </div>
        <div class="col-xs-12">
          <p class="panel-title text-left font" style="width: 21%;float: left"><b>用户地址:</b></p>
          <p class="panel-title text-left input-font" style="width: 79%">{{ userinfo.f_address }}</p>
        </div>
        <div class="col-xs-12" style="margin-left: 20px">
          <p class="panel-title col-xs-7 text-left input-font"><a @click="upuserinfo(userinfo.f_userinfoid)">设备信息维护</a></p>
        </div>
        <!--<div class="col-xs-12">
          <p class="panel-title col-xs-5 text-left font"><b>安检状态:</b></p>
          <p class="panel-title col-xs-7 text-left input-font">{{ userinfo.f_state }}</p>
        </div>-->
      </div>
      <div class="panel-body">
        <div v-show="false" class="row repair-info-content auto">
          <div class="col-xs-12 col-sm-12 col-md-12 form-input-group">
            <label class="control-label">
              <nobr>到达时间：</nobr>
            </label>
            <span>{{f_onsite_time}}</span>
          </div>
          <div class="col-xs-12 col-sm-12 col-md-12 form-input-group" v-if="data.f_date_leave">
            <label class="control-label">
              <nobr>离开时间：</nobr>
            </label>
            <span>{{f_offsite_time}}</span>
          </div>
        </div>


        <!--<div class="form-group" :class="style__">
          <span class="col-md-3 col-sm-4 col-xs-4  text-left"><img src="../../assets/housestyle.png" style="width: 20px;margin-bottom: 5px;text-align: left" alt="">入户状态:</span>
          <div :class="style__" class="col-md-9 col-sm-8 col-xs-8 text-center">
            <input type="radio" name="enterstatus" v-model="f_entry_status" id="nopeople" value="到访不遇">到访不遇
            <input type="radio" name="enterstatus" v-model="f_entry_status" id="rejectchecck" value="拒检">拒检
            <input type="radio" name="enterstatus" v-model="f_entry_status" id="enterhouse" value="入户">入户
          </div>
          <div class="form-group col-sm-12 col-xs-12" :class="style__" v-show="f_entry_status=='到访不遇'">
            <div class="auto">
              <label class="font" style="margin-right: 18px">是否激光检漏：</label>
              <input type="radio" name="laser_check" v-model="f_laser_check" id="nopeople1" value="是">是
              <input type="radio" name="laser_check" v-model="f_laser_check" id="rejectchecck1" value="否">否
            </div>
          </div>
          <div class="form-group col-sm-12 col-xs-12" :class="style__" v-show="f_entry_status=='拒检'">
            <label class="text-left font">拒检照片：</label>
            <div class="auto">
              <div class="panel" style="padding: 10px 10px 5px 10px;">
                <div class="panel-body panel-self" style="background-color: #F8F8F8;width: 100%;height: 260px;position: relative">
                  <div class="row" style="height: 240px;overflow: scroll;top: 1px">
                    <div class="col-sm-4">
                      <img-self :src="f_rejectcheck_path" alt="拒检照片" width="150" height="200"></img-self>
                    </div>
                  </div>
                  <div class="row text-right div-photo">
                    <button type="button" name="button" class="btn btn-primary btn-photo" @click="takePic('f_rejectcheck_path', '拒检照片')">拍照</button>
                    &nbsp;&nbsp;&nbsp;&nbsp;<img src="../../assets/remove.png" :class="style__" @click="delfile('f_rejectcheck_path', this.f_rejectcheck_path)" style="width: 25%;"></img>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div :class="style__" class="form-group" v-show="f_usegas == '未使用'">
          <sapn class="text-left col-md-12 col-sm-12 col-xs-12">处置方式：</sapn>
          <div class="col-xs-12 col-sm-12 col-md-12">
            <input type="checkbox" v-model="f_no_gas_device">无燃气具
            <input type="checkbox" v-model="f_close_valve">关闭表前阀
            <input type="checkbox" v-model="f_unload_battery">取下表内电池
          </div>
        </div>
        <div class="auto app-text" style="margin-top: 5px;" v-if="this.$parent.$parent.role != 'view'">
          <div class="panel" style="padding: 60px 7px 10px 0px;">
            <div class="panel-body panel-self">
              <div v-show="false" class="row">
                <p class="panel-title col-xs-4 text-left font">建档时间</p>
                <p class="panel-title col-xs-8 text-left input-font">{{ newfile_date }}</p>
              </div>
              <div class="row" v-if="last_check_date != null && last_check_date != ''">
                <p class="panel-title col-xs-4 text-left font">上次安检时间</p>
                <p class="panel-title col-xs-8 text-left input-font">{{ last_check_date }}</p>
              </div>
              <div class="row">
                <p class="panel-title col-xs-4 text-left font">上次安检状态</p>
                <p class="panel-title col-xs-8 text-left input-font" v-if="last_check_date != null && last_check_date != ''">安检完成</p>
                <p class="panel-title col-xs-8 text-left input-font" v-if="last_check_date == null || last_check_date == ''">未安检</p>
              </div>
              <div class="row" v-if="last_check_date != null && last_check_date != ''">
                <p class="panel-title col-xs-4 text-left font">上次安检结果</p>
                <p class="panel-title col-xs-8 text-left input-font" :class="last_check_result=='正常'?'':'color-red'">{{last_check_result}}</p>
                <div v-for="data in last_check_data.data" class="panel-title col-xs-offset-4 col-xs-8 text-left input-font">
                  <p v-for="(key,item) in data">
                    {{key}}:{{item}}
                  </p>
                </div>
              </div>
            </div>
          </div>
        </div>-->
      </div>
    </div>
  </div>
</template>

<script>
  import * as Util from "../Util";
  import Vue from "vue";
  import RadioGroup from "vue-client/src/vue-strap/src/radioGroup";
  import Radio from "vue-client/src/vue-strap/src/radioBtn";

  export default {
    title: "SafecheckUserInfo",
    props: ['userinfo'],
    data() {
      return this.$parent.$parent.data
    },
    ready() {
      for (let i in this.userinfo) {
        //tag + '：' + JSON.stringify(this.userinfo[i]))
      }
      this.safecheckStateReady()
    },
    methods: {
      searchHistory(f_userinfo_id) {
        this.$dispatch('gotoson', {
          _this: this.$parent.$parent,
          title: '购气记录',
          safe: true
        })
        this.$parent.$parent.$goto('phone-sell-info', {f_userinfo_id: f_userinfo_id})
      },
      // searchDevices(f_userinfo_id) {
      //   this.$dispatch('gotoson', {
      //     _this: this.$parent.$parent,
      //     title: '设备查看',
      //     safe: false
      //   })
      //   this.$parent.$parent.$goto('PhoneDevicesInfo', {f_userinfo_id: f_userinfo_id,f_user_type:this.userinfo.f_check_type})
      // },
      upuserinfo (f_userinfo_id) {
        this.$dispatch('gotoson', {
          _this: this.$parent.$parent,
          title: '档案信息变更',
          safe: false
        })
        this.$parent.$parent.$goto('PhoneUpUserinfo', {f_userinfo_id: f_userinfo_id, f_source: '安检'})
      },
      cameraCallBack(prop, fileName) {
        HostApp.__this__.$set(prop, fileName + '?' + Math.random())
        //tag
        HostApp.__callback__ = null
        HostApp.__this__ = null
      },
      takePic(prop, title) {
        HostApp.__callback__ = this.cameraCallBack
        HostApp.__this__ = this
        //tag
        let fileName
        if (!this[prop] || this[prop].includes("nopic.png")) {
          fileName = Util.guid() + '-' + prop + '.jpg'
        } else {
          fileName = Util.getFileName(this[prop])
        }
        HostApp._open_a_page({
          type: 'boomerang',
          page: 'com.aofeng.hybrid.android.peripheral.CameraActivity',
          param: {
            file: fileName,
            requestCode: 111,
            callback: 'javascript:HostApp.__callback__("' + prop + '", "%s");',
            watermark: title + '\t时间：' + Util.toStandardTimeString() + '\t' + Vue.user.name
          }
        })
      },
      delfile(prop, fileName) {
        if (fileName == Vue.nopic)
          return
        else {
          HostApp.delfile(fileName)
          this[prop] = Vue.nopic
        }
      },
      setEntryClass(val) {
        if (val == '到访不遇') {
          this.f_usegas = ''
          this.$set('f_entry_class', 'warning')
        } else if (val == '拒检') {
          this.f_usegas = ''
          this.$set('f_entry_class', 'danger')
        } else if (val == '入户') {
          this.$set('f_entry_class', 'success')
        }
      },
      setUsegas(val) {
        if (val == '未使用')
          this.$set('f_useclass', 'default')
        if (val == '已使用')
          this.$set('f_useclass', 'success')
      },
      start() {
        this.$parent.$parent.isStrat = true
        this.$set('action', !this.action)
        this.$set('f_onsite_time', Util.toStandardTimeString())
      },
      safecheckStateReady() {
        //tag
        //tag
        //tag
        if (!this.$parent.$parent.showBack) {
          this.$parent.$parent.showBack = true
        }
        this.$set('last_check_date', this.$parent.$parent.item.f_last_check_date)
        this.$set('newfile_date', this.$parent.$parent.item.f_newfile_date)
        if (this.$parent.$parent.item.f_last_check_result) {
          let checkResult = JSON.parse(this.$parent.$parent.item.f_last_check_result)
          this.$set('last_check_result', checkResult.result)
          this.$set('last_check_data.data', checkResult.data)
        } else {
          this.$set('last_check_result', '')
          this.$set('last_check_data.data', [])
        }
        if (this.$parent.$parent.role == 'inspect' && this.f_complete != '已完成') {
          this.start()
        }
        if (this.$parent.$parent.data.f_onsite_time) {
          //tag
          this.$parent.$parent.startClick = true
        }
        this.action = true
        //tag
        if (this.f_onsite_time) {
          this.$parent.$parent.isStrat = true
          this.$parent.$parent.data.f_onsite_time = this.f_onsite_time
        }
        if (this.$parent.$parent.role == 'repair') {
          this.$set('style__', 'divmask')
          this.$set('style_view_', '')
        } else if (this.$parent.$parent.role == 'view') {
          this.$set('style__', 'divmask')
          this.$set('style_view_', 'divmask')
          //tag
        } else {
          this.$set('style__', '')
          this.$set('style_view_', '')
        }
        if (!this.f_nongasuser_path)
          this.$set('f_nongasuser_path', '')
        if (!this.f_noanswer_path)
          this.$set('f_noanswer_path', '')
        if (!this.f_rejectcheck_path)
          this.$set('f_rejectcheck_path', '')


        this.$watch('f_usegas', (val) => {
          this.setUsegas(val)
        })

        this.setEntryClass(this.f_entry_status)
        this.$watch('f_entry_status', (val) => {
          this.setEntryClass(val)

          if (val == '到访不遇') {
            this.f_rejectcheck_path = Vue.nopic
            this.f_laser_check='是'
          }else{
            this.f_laser_check=null
          }
          if (val == '拒检') {
            this.f_noanswer_path = Vue.nopic
          }
          //tag
          if (val != '入户') {
            //清理安检概括
            this.f_no_gas_device = false
            this.f_unload_battery = false
            this.f_close_valve = false
            //清理全局隐患
            this.f_defect_cramped = false
            this.f_defect_bedroom = false
            this.f_defect_longpipe = false
            this.f_defect_firesource = false
            this.f_defect_explosive = false
            this.f_defect_viacabinet = false
            this.f_defect_intermittent = false
            this.f_defect_nearfire = false
            this.f_defect_openkitchen = false
            this.f_defect_hang = false
            this.f_cramped_path = Vue.nopic
            //用户评价
            this.f_client_evaluation = null
            //清设备
            this.$set('f_meters', [])
            this.$set('f_plumbs', [])
            this.$set('f_valves', [])
            this.$set('f_inner_plumbs', [])
            this.$set('f_alarms', [])
            this.$set('f_cookers', [])
            this.$set('f_heaters', [])
            this.$set('f_furnaces', [])
          }
        })
      }
    },
    components: {
      RadioGroup,
      Radio
    },
  }
</script>

<style scoped>

  .font {
    font: 15px PingFang-SC-Medium;
    color: #666666;
  }

  .input-font {
    font: 15px PingFang-SC-Medium;
    color: #333333;
  }

  .app-text {
    font-size: 12px;
  }

  .panel-self {
    border-radius: 10px;
    border: 1px solid #499EDF;
    background-color: #F8F8F8;
  }

  .app-text {
    font-size: 12px;
  }

  .panel-self {
    border-radius: 5px;
    border: 1px solid #c5e1f7;
    background-color: #F2F6FA;
  }

  .font {
    font: 15px PingFang-SC-Medium;
    color: #333333;
  }

  .panel-self {
    border-radius: 5px;
    border: 1px solid #c5e1f7;
    background-color: #F2F6FA;
  }

  .text-left {
    text-align: left;
  }

  .font {
    font: 15px PingFang-SC-Medium;
    color: #333333;
  }

  .btn-photo {
    border: 0;
    border-radius: 7px;
    background-color: #7dc1f4;
    font: 15px PingFang-SC-Bold;
    height: 20%;
  }

  .div-photo {
    width: auto;
    height: auto;
    /* margin-top: 10px; */
    position: absolute;
    bottom: 10px;
    right: 10px;
  }
</style>
