<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-5 text-left font" style="width: 21%;float: left"><b>用户编号:</b></p>
          <a class="panel-title col-xs-7 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-6">
          <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_user_name }}</p>
        </div>
        <div class="col-xs-6">
          <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_check_type }}
          </p>
        </div>
        <div class="col-xs-12">
          <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"/>
          <!--<p class="panel-title text-left input-font" style="width: 77%">{{ userinfo.f_user_phone2 ? userinfo.f_user_phone2 : userinfo.f_user_phone }}-->
            <!--<img src="../../../assets/phone.png" style="width: 6%" v-on:click.stop.prevent='$parent.$parent.$parent.makeAPhoneCall(userinfo.f_user_phone2 ? userinfo.f_user_phone2 : userinfo.f_user_phone)'></img>-->
          <!--</p>-->
        </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-6">
          <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 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_open_date }}</p>
        </div>
<!--        <div class="col-xs-12">-->
<!--          <p class="panel-title col-xs-5 text-left font" style="width: 28%;float: left"><b>进气口铅封号:</b></p>-->
<!--          <p class="panel-title col-xs-7 text-left input-font" style="width: 72%">{{ userinfo.f_airintake_seal_no }}</p>-->
<!--        </div>-->
<!--        <div class="col-xs-12">-->
<!--          <p class="panel-title col-xs-5 text-left font" style="width: 28%;float: left"><b>出气口铅封号:</b></p>-->
<!--          <p class="panel-title col-xs-7 text-left input-font" style="width: 72%">{{ userinfo.f_airouttake_seal_no }}</p>-->
<!--        </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_remark }}</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=='到访不遇'">
            <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_noanswer_path" alt="到访不遇照片" width="150" height="200"></img-self>
                    </div>
                  </div>
                  <div class="row text-right div-photo" :class="style__">
                    <button type="button" name="button" class="btn btn-primary btn-photo" @click="takePic('f_noanswer_path', '到访不遇照片')">拍照</button>
                    &nbsp;&nbsp;&nbsp;&nbsp;<img src="../../../../assets/remove.png" :class="style__" @click="delfile('f_noanswer_path', this.f_noanswer_path)" style="width: 25%;"></img>
                  </div>
                </div>
              </div>
            </div>
            <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_noanswer1_path" alt="到访不遇照片" width="150"
                                height="200"></img-self>
                    </div>
                  </div>
                  <div class="row text-right div-photo" :class="style__">
                    <button type="button" name="button" class="btn btn-primary btn-photo"
                            @click="takePic('f_noanswer1_path', '到访不遇照片')">拍照</button>
                    &nbsp;&nbsp;&nbsp;&nbsp;<img src="../../../../assets/remove.png" :class="style__"
                                                 @click="delfile('f_noanswer1_path', this.f_noanswer1_path)"
                                                 style="width: 25%;" />
                  </div>
                </div>
              </div>
            </div>
            <div class="row" style="margin-top: 6px">
              <label >到访不遇备注:</label>
            </div>
            <div class="row" style="margin-top: 6px">
          <textarea id="el_ca_tx" style="border-radius:4px;width: 100%;"  v-model="f_novisit_reason">
          </textarea>
            </div>
<!--            <div class="form-group col-sm-12" :class="style__">
              <input type="checkbox" v-model="$parent.$parent.backlistisselect" /><label class="text-left font" >限制该用户购气</label>
            </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 class="form-group col-sm-12" :class="style__">-->
<!--              <input type="checkbox" v-model="$parent.$parent.backlistisselect" /><label class="text-left font" >限制该用户购气</label>-->
<!--            </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>
  <!--拉黑框-->
  <modal :show.sync="$parent.$parent.showmodel" v-ref:modal backdrop="false">
    <div slot="modal-header" class="modal-header">
      <h4 class="modal-title">
        限制用户购气
      </h4>
    </div>
    <div slot="modal-body" class="modal-body">
      <div class="row" style="margin-top: 6px">
        <label style="color: red;">注:当前页面无法取消对用户的限制购气</label>
      </div>
      <div class="row" style="margin-top: 6px">
          <textarea  v-model.trim="$parent.$parent.cause" style="border-radius:4px;width: 100%;" placeholder="请输入限制用户购气原因" >
          </textarea>
      </div>
    </div>
    <div slot="modal-footer" class="modal-footer">
      <button  type="button" name="button" class="col-sm-3 btn btn-primary" @click="backlist()">确认</button>
      <button  type="button" name="button" class="col-sm-3 btn btn-primary" @click="cancel()">取消</button>
    </div>
  </modal>
</template>

<script>
  import * as Util from "../../../Util";
  import { HttpResetClass } from 'vue-client'
  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) {
        console.log(JSON.stringify(i) + '：' + JSON.stringify(this.userinfo[i]))
      }
      this.safecheckStateReady()
    },
    methods: {
      async backlist(){
        if(!this.$parent.$parent.cause){
          this.$showMessage("请填写拉黑原因！")
          return
        }
        this.$parent.$parent.data.f_blocking_cause=this.$parent.$parent.cause
        console.log("vue.user:-"+JSON.stringify(Vue.user))
        let http = new HttpResetClass()
        console.log("即将进行拉黑！")
        let res1= await http.load('POST',`${this.$androidUtil.getProxyUrl()}/api/af-safecheck/sql/safe_singleTable_OrderBy`,{
          data:{
            items:"version",
            tablename:"t_userinfo_ts",
            condition:"f_userinfo_id="+this.$parent.$parent.data.f_userinfoid,
            orderitem:"f_userinfo_id"
          }
        },{resolveMsg:null, rejectMsg: null})
        console.log("查询版本号---"+JSON.stringify(res1))
        console.log("打印参数---"+this.$parent.$parent.data.f_user_name+"-"+this.$parent.$parent.data.f_blocking_cause+"-"+Vue.user.name+"-"+ Vue.user.id+"-"+Vue.user.orgid+"-"+Vue.user.orgs+"-"+Vue.user.depids+"-"+Vue.user.deps+"-"+this.$parent.$parent.data.f_userinfoid)
        let res2= await http.load('POST',`${this.$androidUtil.getProxyUrl()}/api/af-revenue/logic/backlistOperate`, {
          data: {
            "f_operat_type": "拉黑",
            "f_state": "有效",
            "f_user_name": this.$parent.$parent.data.f_user_name,
            "f_comments": this.$parent.$parent.data.f_blocking_cause,
            "f_operator": Vue.user.name,
            "f_operatorid": Vue.user.id,
            "f_orgid": Vue.user.orgid,
            "f_orgname": Vue.user.orgs,
            "f_depid": Vue.user.depids,
            "f_depname": Vue.user.deps,
            "f_describe": `${Vue.user.name}对用户${this.$parent.$parent.data.f_user_name}进行拉黑`,
            "f_userinfo_id": {"f_userinfo_id": this.$parent.$parent.data.f_userinfoid, "f_user_state": "正常", "version": res1.data[0].version}
          }
        }, {resolveMsg:null, rejectMsg: null})

        console.log("拉黑结果---"+JSON.stringify(res2))
        if(res2.data.code==200){
          this.$parent.$parent.showmodel=false
          this.$parent.$parent.enabled=true
          this.$parent.$parent.data.f_blacklist="是"
          this.$showMessage("将该用户限制购气成功！")
        }else if(res2.data.msg=='数据增加重复'){
          this.enabled=true
          this.$showMessage("该用户已被限制购气，请勿重复提交！")
        }else{
          this.$showMessage("网络异常，请稍后再试！")
        }
      },
      cancel(){
        this.$parent.$parent.backlistisselect=false
        this.$parent.$parent.showmodel=false
      },
      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})
      },
      cameraCallBack(prop, fileName) {
        HostApp.__this__.$set(prop, fileName + '?' + Math.random())
        console.log('photo file name:' + HostApp.__this__.f_nongasuser_path)
        HostApp.__callback__ = null
        HostApp.__this__ = null
      },
      takePic(prop, title) {
        HostApp.__callback__ = this.cameraCallBack
        HostApp.__this__ = this
        console.log('this[prop]:' + this[prop])
        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() {
        console.log('进入paperState====>', this.$parent.$parent.showBack)
        console.log('parent.item====>', this.$parent.$parent.item)
        console.log('model====>', this.$parent.$parent.model)
        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) {
          console.log('已经开始安检')
          this.$parent.$parent.startClick = true
        }
        this.action = true
        console.log('this.f_onsite_time', this.f_onsite_time)
        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')
          console.log('set style for ....')
        } 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_noanswer1_path)
          this.$set('f_noanswer1_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
          }
          if (val == '拒检') {
            this.f_noanswer_path = Vue.nopic
            this.f_noanswer1_path = Vue.nopic
          }


          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', [])
          }else{
            this.f_rejectcheck_path = Vue.nopic
            this.f_noanswer_path = Vue.nopic
            this.f_noanswer1_path = Vue.nopic
            this.f_novisit_reason=null
          }
        })
      }
    },
    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>
