
<template>
  <form novalidate class="form-horizontal  span auto compatible" style="width: 95%;margin: auto"  v-if="showUser">
    <div class="row app-row">
      <div class="col-xs-4" style="margin-top: 7px">
        <img src="../../assets/用户ID.png" style="width: 20px;" alt="">
        <label class="font text-left">用户编号:</label>
      </div>
      <div class="col-xs-8" >
        <input class="userid-input input-font" style="width: 40%;" type="text" v-model="model.f_userinfo_code" disabled="disabled">
        <button type="button" class="btn text-rigth  btn-enter btn-enter-font" @click="enter()" style="margin-bottom: 5px;float: right">记录查询</button>
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/户姓名.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">用户名称:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_user_name" @change="setParentValue('f_user_name')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/用户姓名.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">证件号码:</label>
      </div>
      <div class="col-xs-8">
        <input class="search_input input-font" type="text" v-model="model.f_idnumber" @change="setParentValue('f_idnumber')">
      </div>
    </div>
    <div class="row app-row">
    <div class="col-xs-4">
      <img src="../../assets/用户ID.png" style="width: 20px;margin-bottom: 5px" alt="">
      <label class="font text-left">用户类型:</label>
    </div>
    <div class="col-xs-8">
      <input class="search_input input-font" type="text" v-model="model.f_user_type" disabled="disabled">
    </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/用户电话.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">用户电话:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_user_phone" @change="setParentValue('f_user_phone')" >
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">区 &nbsp;&nbsp;/&nbsp;&nbsp; 县:</label>
      </div>
      <div class="col-xs-8">
        <input class="search_input input-font" type="text" v-model="model.f_area" @change="setParentValue('f_area')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">街 &nbsp;&nbsp; &nbsp;&nbsp; 道:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_street" @change="setParentValue('f_street')">
      </div>
    </div>
      <div class="row app-row">
        <div class="col-xs-4">
          <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
          <label class="font text-left">小区名称:</label>
        </div>
        <div class="col-xs-8" >
          <input class="search_input input-font" type="text" v-model="model.f_residential_area" @change="setParentValue('f_residential_area')">
        </div>
      </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">楼 &nbsp;&nbsp; &nbsp;&nbsp; 号:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_building" @change="setParentValue('f_building')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">单 &nbsp;&nbsp; &nbsp;&nbsp; 元:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_unit" @change="setParentValue('f_unit')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">楼 &nbsp;&nbsp; &nbsp;&nbsp; 层:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_floor" @change="setParentValue('f_floor')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/小区.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">门&nbsp;牌&nbsp;号:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_room" @change="setParentValue('f_room')">
      </div>
    </div>
    <div class="row app-row">
      <div class="col-xs-4">
        <img src="../../assets/详细住址.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label class="font text-left">详细住址:</label>
      </div>
      <div class="col-xs-8" >
        <input class="search_input input-font" type="text" v-model="model.f_address" @change="setParentValue('f_address')">
      </div>
    </div>

    <!-- <div class="col-sm-8">
       <a href="#" class="btn btn-primary" @click="editUserInfo">修改用户信息</a>
     </div>-->
    <div class="row app-row">
      <div class="col-xs-4" style="margin-top: 5px">
        <img src="../../assets/房屋结构.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label for="f_room_style" class="font text-left">房屋结构:</label>
      </div>
      <div class="col-xs-8 select">
        <v-select id="f_room_style" :value.sync="parentData.f_room_style" class="input-font"
                  :options='room_style' placeholder='请选择房屋结构'  :value-single="true"
                  close-on-select clear-button></v-select>
      </div>
    </div>

    <!--<label class="control-label">房屋结构:</label>-->
    <!--<radio-group :value.sync="model.f_room_style" type="success" buttons="false">-->
    <!--<radio value="地上">地上</radio>-->
    <!--<radio value="半地下">半地下</radio>-->
    <!--<radio value="地下">地下</radio>-->
    <!--<radio value="楼顶">楼顶</radio>-->
    <!--</radio-group>-->
    <div class="row app-row">
      <div class="col-xs-4" style="margin-top: 5px">
        <img src="../../assets/用户类型.png" style="width: 20px;margin-bottom: 5px" alt="">
        <label for="f_noncivil_style" class="font text-left">用户类型:</label>
      </div>
      <div class="col-xs-8 select" >
        <v-select id="f_noncivil_style" :value.sync="parentData.f_noncivil_style" class="input-font"
                  :options='noncivil_style' placeholder='请选择用户类型'  :value-single="true"
                   close-on-select clear-button></v-select>
      </div>
    </div>
    <div class="row app-row"  v-if="$parent.$parent.role == 'inspect'">
      <div class="col-xs-6 text-center ">
      <button  type="button" class="btn btn-primary"  @click="create()">生成地址</button>
      </div>
      <div class="col-xs-6 text-center">
      <button  type="button" class="btn btn-primary" @click="editUserInfo">上传信息</button>
      </div>
    </div>
    <!--<label class="control-label">用户类型:</label>-->
    <!--<radio-group :value.sync="model.f_noncivil_style" type="success" buttons="false">-->
    <!--<radio value="餐饮用户">餐饮用户</radio>-->
    <!--<radio value="公福用户">公福用户</radio>-->
    <!--<radio value="锅炉用户">锅炉用户</radio>-->
    <!--<radio value="工业用户">工业用户</radio>-->
    <!--</radio-group>-->
    <div style="height:50px;"></div>
  </form>
  <div v-if="showInfo">
    <div class="page-header app-header auto">
      <div @click='disapprove()' >
        <img src="../../assets/back.png"/>
      </div>
    </div>
    <phone-info-table  :user="user" :is-need-condition="false" :is-group="false" ></phone-info-table>
  </div>
</template>

<script>
  import Vue from 'vue'
  import * as Util from '../Util'


  export default {
    title: '工商用户基本信息',
    data() {
      return {
        parentData:this.$parent.$parent.data,
        model: {
          f_user_name: '',
          f_userinfo_code: '',
          f_area: '',
          f_address: '',
          f_user_phone: '',
          f_street: '',
          f_building: '',
          f_unit: '',
          f_floor: '',
          f_room:'',
          f_residential_area:''
        },
        showUser:true,
        showInfo:false,
        user:{f_userinfo_id:this.$parent.$parent.data.f_userinfoid},
        // room_style : this.$appdata.getParam('工商业房屋结构'),
        // noncivil_style : this.$appdata.getParam('工商业用户类型')
        room_style : [
          {label: '地上', value: '地上'},
          {label: '半地下', value: '半地下'},
          {label: '地下', value: '地下'},
          {label: '楼顶', value: '楼顶'}
        ],
        noncivil_style : [
          {label: '餐饮用户', value: '餐饮用户'},
          {label: '公福用户', value: '公福用户'},
          {label: '锅炉用户', value: '锅炉用户'},
          {label: '工业用户', value: '工业用户'}
        ]
      }
    },
    props: ['userinfo'],
    ready() {
      //tag
      Object.assign(this.model, this.model, this.userinfo)
    },
    methods: {
      enter(){
        this.$parent.$parent.showBack = false
        this.showUser = false
        this.showInfo = true
      },
      disapprove(){
        this.$parent.$parent.showBack = true
        this.showUser = true
        this.showInfo = false
      },
      editUserInfo() {
        var r = confirm("确定是否修改用户信息？")
        if (r) {
          this.$resetpost(`${this.$androidUtil.getProxyUrl()}/rs/logic/SaveEntity`,
            {
              data: {
                row: {
                  f_time: Util.to3339TimeString(),
                  f_plan_item_id: this.model.f_check_item_id,
                  f_modifier: Vue.user.name,
                  f_modifier_id: Vue.user.id,
                  f_modify_type: '用户档案',
                  f_userinfo_code:this.model.f_userinfo_code,
                  f_userinfoid: this.model.f_userinfoid,
                  f_user_name: this.model.f_user_name,
                  f_approved: '未审核',
                  f_filialeid:this.parentData.f_filialeid,
                  version: this.model.version,
                  f_content: {
                    "f_user_phone": this.model.f_user_phone,
                    "f_street": this.model.f_street,
                    "f_area": this.model.f_area,
                    "f_building": this.model.f_building,
                    "f_unit": this.model.f_unit,
                    "f_floor": this.model.f_floor,
                    "f_room": this.model.f_room,
                    "f_residential_area": this.model.f_residential_area,
                    "f_address": this.model.f_address
                  }
                },
                tablename: 't_modify_userinfo'
              }
            }).then((res) => {
            this.$showMessage("上传成功！")
        }).catch(()=>{
            this.$showMessage("上传失败！")
        })
        }
      },
      //取暖方式框赋值
      assigNoncivil(val){
        if(val.length == 0){
          val = ['']
        }
        this.model.f_noncivil_style = val[0]
        this.parentData.f_noncivil_style = this.model.f_noncivil_style
        //tag
      },
      //房屋结构框赋值
      assigRoom(val){
        if(val.length == 0){
          val = ['']
        }
        this.model.f_room_style = val[0]
        this.parentData.f_room_style = this.model.f_room_style
        //tag
      },
      //更新父组件用户信息
      setParentValue(key){
        if(key == 'f_user_phone'){
          if(this.model.f_user_phone != ''){
            if(!(/^[0-9]*$/.test(this.model[key]))){
              this.$showMessage("电话号有误，请重填")
              this.model[key] = this.parentData[key]
              return
            }
          }
        }
        //tag
        this.parentData[key] = this.model[key]
        //tag
      },
      create(){
        let addresstype = 'A'
        if (Vue.config.safecheck != undefined) {
          if (Vue.config.safecheck.ApproveConfig != undefined) {
            if (Vue.config.safecheck.ApproveConfig.addresstype != undefined) {
              addresstype = Vue.config.safecheck.ApproveConfig.addresstype
            }
          }
        }
        if(addresstype == 'A'){
          this.createA()
        }else  if(addresstype == 'B') {
          this.createB()
        }
        },
        createA(){
        if (!this.model.f_street) {
          this.$set('model.f_street', ' ')
          this.$set('parentData.f_street',  ' ')
        }
        if (!this.model.f_residential_area) {
          this.$set('model.f_residential_area' , ' ')
          this.$set('parentData.f_residential_area',' ')
        }
        let address =  this.model.f_street + this.model.f_residential_area
        if (this.model.f_building) {
          address += isNaN(this.model.f_building) ? this.model.f_building: this.model.f_building + '栋'
        }
        if (this.model.f_unit) {
          address += isNaN(this.model.f_unit) ? this.model.f_unit:this.model.f_unit + "单元"
        }
        if (this.model.f_floor) {
          address +=  isNaN(this.model.f_floor) ? this.model.f_floor: this.model.f_floor + "层"
        }
        if (this.model.f_room) {
          address += isNaN(this.model.f_room) ? this.model.f_room:  this.model.f_room+"室"
        }
        this.$set('model.f_address', address)

        this.$set('parentData.f_address', address)
      },
      createB(){
        if (!this.model.f_residential_area) {
          this.$set('model.f_residential_area' , ' ')
          this.$set('parentData.f_residential_area',' ')
        }
        let address = this.model.f_residential_area
        if (this.model.f_building) {
          address += ''+ this.model.f_building
        }
        if (this.model.f_unit) {
          address +=  '-' + this.model.f_unit
        }
        if (this.model.f_floor) {
          address += '-' + this.model.f_floor
        }
        if (this.model.f_room) {
          address +=  '-' + this.model.f_room
        }
        this.$set('model.f_address', address)

        this.$set('parentData.f_address', address)
      },
    }
  }
</script>
<style scoped>
  .app-header {
    border-radius: 50%;
    position:fixed;
    background: rgba(73, 158, 223, 0.12);
    padding: 8px;
    text-align: center;
    font-size: 1.2em;
    z-index: 10;
    opacity:0.5;
    bottom: 50px;
    margin-top: -20px;
  }
  .search_input {
    border: 1px solid #c0c0c0;
    border-radius: 3px;
    background-color: #f8fcff;
  }
  .userid-input{
    border: 0;
    background-color: #ffffff;
    width: 40%;
    border-radius: 3px;
  }
  .input-font{
    font: 15px PingFang-SC-Medium;
    color: #333333;
  }
  .font{
    font: 15px PingFang-SC-Medium;
    color: #666666;
  }
  .btn-enter{
    background-color: #f5fbff;
    border-radius: 3px ;
    border: 1px solid #499EDF;
  }
  .btn-enter-font{
    font: 15px PingFang-SC-Medium;
    color: #499edf;
  }
  .select{
    margin-bottom: 8px;
    max-width: none !important;
  }
</style>
