<template>
    <div class="auto" style="overflow:auto;">
        <validator name='v'>
            <form novalidate class="form-horizontal">
                <div class="row auto" >

                    <div class="col-sm-4 form-group" >
                        <label for="f_metertitles" class=" font_normal_body">旧表箱号</label>
                        <input class="input_search" style="width:60%" type="text"
                               v-model="row.f_metertitles"
                               disabled
                        >
                    </div>
                    <div class="col-sm-8 form-group" >
                        <label for="f_address" class=" font_normal_body">&nbsp;旧&nbsp;地&nbsp;址</label>
                        <input class="input_search" style="width:80%" type="text"
                               v-model="row.f_address"
                               disabled
                        >
                    </div>
                    <div class="col-sm-4 form-group" >
                        <label for="f_metertitles_new" class=" font_normal_body">新表箱号</label>
                        <input class="input_search" style="width:60%" type="text"
                               v-model="model.f_metertitles"
                        >
                    </div>
                    <div class="col-sm-8 form-group" >
                        <label for="f_comments" class=" font_normal_body">迁表原因</label>
                        <input class="input_search" style="width:80%" type="text"
                               v-model="model.f_comments"
                        >
                    </div>
                    <div class="col-sm-4 form-group"  >
                        <label for="f_position" class="font_normal_body"  >旧抄表册</label>
                        <input class="input_search" style="width:60%" type="text"
                               v-model="model.f_meter_book_name"
                               disabled
                        >
                    </div>
                    <div class="col-sm-4 form-group"  >
                        <label for="f_position" class="font_normal_body"  >新抄表册</label>
                        <v-select :value.sync="model.f_meter_book_num" v-model="model.f_meter_book_num"
                                  :value-single="true"
                                  :options='meterbookoptions' placeholder='抄表册'
                                  close-on-select></v-select>
                    </div>
                </div>
                <div class="row auto" >
                    <div class="col-sm-12 form-group ">
                        <label for="f_comments" class=" font_normal_body" >新地址信息</label>
                    </div>
                    <div class="col-sm-4 form-group "
                         :class="[$v.f_pcd_id.required ? 'has-error' : 'has-success']">
                        <label class="font_normal_body">省&ensp;市&ensp;区</label>
                        <input type="text" style="width:41%" v-show="false" v-model="model.f_pcd_id"
                        >
                        <v-select :value.sync="model.f_pcd_id" :value-single="true"
                                  :options='pcdslist' placeholder='请选择'  @change="pcdChange"
                                  close-on-select search="true"  >
                        </v-select>
                    </div>
                    <div class="col-sm-4 form-group "
                         :class="[$v.f_street_id.required ? 'has-error' : 'has-success']">
                        <label class="font_normal_body">街道名称</label>
                        <input type="text" style="width:41%" v-show="false" v-model="model.f_street_id"
                        >
                        <v-select :value.sync="model.f_street_id" :value-single="true"
                                  :options='streetslist' placeholder='请选择'
                                  @change="streetChange"
                                  close-on-select search="true" >
                        </v-select>
                    </div>
                    <div  class="col-sm-4 form-group "
                          :class="[$v.f_residential_area_id.required ? 'has-error' : 'has-success']">
                        <label class="font_normal_body">小区名称</label>
                        <input type="text" style="width:41%" v-show="false" v-model="model.f_residential_area_id"
                               v-validate:f_residential_area_id='{required: true }'>
                        <v-select :value.sync="model.f_residential_area_id" :value-single="true"
                                  :options='areaslist' placeholder='请选择'
                                  close-on-select search="true">
                        </v-select>
                    </div>
<!--                    <div class="col-sm-4 form-group " :class="[$v.slice.required ? 'has-error' : 'has-success']">-->
<!--                        <label class="font_normal_body">片&emsp;&emsp;区</label>-->
<!--                        <input type="text" style="width:60%" class="input_search" v-show="false" v-model="$refs.slice.selectedItems"-->
<!--                               v-validate:slice='{required: true }'>-->
<!--                        <v-select :value.sync="model.slice_area" v-model="model.slice_area"-->
<!--                                  :options='sliceArea' placeholder='片区/管理站' filer-key="name"-->
<!--                                  close-on-select v-ref:slice>-->
<!--                        </v-select>-->
<!--                    </div>-->
                    <div class="col-sm-4 form-group ">
                        <label for="f_address" class="font_normal_body">楼&emsp;&emsp;号</label>
                        <input type="text" style="width:40%" v-model="model.f_building" class="input_search"
                               placeholder="楼号"/>
                        <input type="text" style="width:20%" v-model="model.f_building_suffix" class="input_search"
                        />

                    </div>
                    <div class="col-sm-4 form-group ">
                        <label for="f_address" class="font_normal_body">单&emsp;&emsp;元</label>
                        <input type="text" style="width:40%" v-model="model.f_unit" class="input_search" placeholder="单元"/>
                        <input type="text" style="width:20%" v-model="model.f_unit_suffix" class="input_search"
                        />
                    </div>
                    <div class="col-sm-4 form-group ">
                        <label for="f_address" class="font_normal_body">楼&emsp;&emsp;层</label>
                        <input type="text" style="width:40%" v-model="model.f_floor" class="input_search"
                               placeholder="楼层" />
                        <input type="text" style="width:20%" v-model="model.f_floor_suffix" class="input_search"
                        />
                    </div>
                    <div class="col-sm-4 form-group "
                         :class="[$v.f_room.required ? 'has-error' : 'has-success']">
                        <label for="f_address" class="font_normal_body">门&ensp;牌&ensp;号</label>
                        <input type="text" style="width:40%" v-model="model.f_room" class="input_search" placeholder="门牌号"
                               v-validate:f_room='{required: true }'/>
                        <input type="text" style="width:20%" v-model="model.f_room_suffix" class="input_search"
                        />
                    </div>
                </div>
                <div style="text-align:right;height:auto;">
                    <button class="button_search btn-gn" type="button" @click="confirm()" :disabled="!$v.valid"
                    >确认
                    </button>
                    <button class="button_clear btn-gn" type="button" @click="clean()" >取消
                    </button>
                </div>
                <!--<div style="height: auto;width: 100%">-->
                <!--<div style="height: 10%">-->
                <!--<img style="margin-top: -5px" src="../../../../../../static/images/lefticon/矩形1183.png">-->
                <!--<a style="font-size: 16px;font-weight: 500;color: #333;text-decoration: none;">附件信息</a>&nbsp;<a style="color: #999999"></a>-->
                <!--</div>-->
                <!--<upload :blodid="row.f_userinfo_id" isremark="true" fusetype="换表"></upload>-->
                <!--</div>-->
            </form>
        </validator>
    </div>
</template>
<script>
  /**
   *迁表管理
   */
  import {HttpResetClass} from 'vue-client'

  export default {
    title: '迁表登记',
    data () {
      return {
        model: {
          f_building_suffix: '号楼',
          f_unit_suffix: '单元',
          f_floor_suffix: '层',
          f_room_suffix: '室',
          f_meter_book_name: ''
        },
        f_filialeids: this.$login.f.orgid,
        sliceArea: [],
        pcdslist: [],
        streetslist: [],
        areaslist: [],
        meterbookoptions: []
      }
    },
    props: ['row'],
    async ready () {
      await this.initdata()
    },
    events: {

    },
    methods: {
      async initdata () {
        await this.initAreas(this.f_filialeids)
        // 添加特殊地址选省市区
        await this.initpcds(` f_orgid = '${this.f_filialeids}'`)
       // this.initstreets(` f_orgid = '${this.f_filialeids}' `)
       // this.initareas(` f_orgid = '${this.f_filialeids}'`)
      },
      // 初始化片区
      async initAreas (val) {
        if (val) {
          let getAllArea = await this.$resetpost('/rs/search', {
            source: 'this.getParentByType($organization$).getAllChildrens().where(row.getType() == $zone$)',
            userid: this.$login.f.id
          }, {resolveMsg: null, rejectMsg: '获取片区出错！！！'})

          let arr = getAllArea.data.filter((res) => {
            return res.parentid == val
          })
          console.log('过滤之后的片区', arr)
          this.sliceArea = []
          arr.forEach((res) => {
            this.sliceArea.push({label: res.name, value: {name: res.name, code: res.number}})
          })
        }
      },
      // 初始化省市区,添加街道
      async initpcds (pconditon) {
        this.pcdslist = []
        let HttpReset = new HttpResetClass()
        let req = await HttpReset.load('POST', 'rs/sql/address_singleTableOrderBy?pageNo=1&pageSize=9999999', {
          data: {
            items: '*',
            tablename: 't_pcd',
            orderitem: 'id',
            condition: pconditon
          }
        }, {resolveMsg: null, rejectMsg: '获取地址失败!'})
        let redata = []
        req.data.forEach((row, n) => {
          redata[n] = {
            label: row.f_pcd,
            value: row.id,
            data: row,
            id: row.id
          }
        })
        this.pcdslist = redata
        let temp = {
          tablename: 't_meter_book',
          condition: `f_book_state='有效' and f_filiale_id='${this.$login.f.orgid}'`
        }
        let meterbooks = await HttpReset.load('POST', 'rs/sql/saleSingleTable', {data: temp},
          {resolveMsg: null, rejectMsg: '获取抄表册信息失败！！'})
        if (meterbooks.data.length > 0) {
          let options = []
          for (let i = 0; i < meterbooks.data.length; i++) {
            let tmp = {label: meterbooks.data[i].f_book_name, value: `${meterbooks.data[i].id}`}
            options.push(tmp)
          }
          this.meterbookoptions = options
        }

        for (let row of this.meterbookoptions) {
          if (row.value === this.row.f_meter_book_num) {
            this.model.f_meter_book_name = row.label
          }
        }
      },
      async initstreets (pconditon) {
        this.streetslist = []
        let HttpReset = new HttpResetClass()
        let req = await HttpReset.load('POST', 'rs/sql/address_singleTableOrderBy', {
          data: {
            items: '*',
            tablename: 't_street',
            orderitem: 'id',
            condition: pconditon
          }
        }, {resolveMsg: null, rejectMsg: '获取地址失败!'})
        let redata = []
        req.data.forEach((row, n) => {
          redata[n] = {
            label: row.f_street,
            value: row.id,
            data: row,
            id: row.id
          }
        })
        this.streetslist = redata
      },
      // 省/市/区变化
      async pcdChange (val) {
        // 只有添加特殊地址时才级联
        console.log('省/市/区变化', val)
        if (val) {
          // 那就把[小区，街道]重新组织一下
          await this.initstreets(`  f_pcd_id ='${val}' `)
          if (this.model.f_street_id) {
            if (this.findbyid(this.streetslist, this.model.f_street_id)) {
              let pcd_id = this.findbyid(this.streetslist, this.model.f_street_id).f_pcd_id
              if (pcd_id != val) {
                this.model.f_street_id = ''
              }
            } else {
              this.model.f_street_id = ''
            }

            // 那就把[小区，街道]重新组织一下
            if (this.model.f_street_id) {
              await this.initareas(` f_street_id ='${this.model.f_street_id}' `)
              if (this.model.f_residential_area_id) {
                if (this.findbyid(this.areaslist, this.model.f_residential_area_id)) {
                  let pcd_id = this.findbyid(this.areaslist, this.model.f_residential_area_id).f_pcd_id
                  if (pcd_id != val) {
                    this.model.f_residential_area_id = ''
                  }
                } else {
                  this.model.f_residential_area_id = ''
                }
              }
            }
          }
        }
        this.$resetValidation()
      },

      // 街道变化
      async streetChange (val) {
        console.log('街道变化', val)
        if (val) {
          // 那就把[小区]重新组织一下
          await this.initareas(` f_street_id ='${val}' `)
          if (this.model.f_residential_area_id) {
            if (this.findbyid(this.areaslist, this.model.f_residential_area_id)) {
              let street_id = this.findbyid(this.areaslist, this.model.f_residential_area_id).f_street_id
              if (street_id != val) {
                this.model.f_residential_area_id = ''
              }
            } else {
              this.model.f_residential_area_id = ''
            }
          }
        }
        this.$resetValidation()
      },
      async initareas (pconditon) {
        // if(this.usertype){
        //   pconditon=pconditon+` and  f_special='1' `
        // }
        this.areaslist = []
        let HttpReset = new HttpResetClass()
        let req = await HttpReset.load('POST', 'rs/sql/address_singleTableOrderBy?pageNo=1&pageSize=9999999', {
          data: {
            items: '*',
            tablename: 't_area',
            orderitem: 'id',
            condition: pconditon
          }
        }, {resolveMsg: null, rejectMsg: '获取地址失败!'})
        let redata = []
        req.data.forEach((row) => {
          redata.push({
            label: row.f_residential_area,
            value: row.id,
            data: row,
            id: row.id
          })
        })
        this.areaslist = redata
      },
      // 返回
      clean () {
        this.$dispatch('success', '换表', this.row)
      },
      async confirm () {
        this.saveobj()
      },
      // 根据名字找数据
      findbyid (list, name) {
        var result
        list.forEach((row, n) => {
          if (name == row.value) {
            result = row.data
          }
        })
        return result
      },
      async saveobj () {
        if (this.model.slice_area) {
          if (this.model.slice_area.length > 0) {
            this.model.f_slice_area = this.model.slice_area[0].name
            this.model.f_area_code = this.model.slice_area[0].code
          }
        }
        let meterbookname = ''
        for (let row of this.meterbookoptions) {
          if (row.value === this.model.f_meter_book_num) {
            meterbookname = row.label
          }
        }
        let res = await this.$resetpost('rs/sql/singleTable_OrderBy', {data: {orderitem: 'f_userinfo_id',
          items: '*',
          tablename: 't_user_address',
          condition: 'f_userinfo_id = ' + this.row.f_userinfo_id}})
        console.log('=============', res.data[0])
        let data = {
          f_pcd: res.data[0].f_pcd,
          f_street: res.data[0].f_street,
          f_residential_area: res.data[0].f_residential_area,
          f_building: res.data[0].f_building,
          f_building_suffix: res.data[0].f_building_suffix,
          f_unit: res.data[0].f_unit,
          f_unit_suffix: res.data[0].f_unit_suffix,
          f_floor: res.data[0].f_floor,
          f_floor_suffix: res.data[0].f_floor_suffix,
          f_room: res.data[0].f_room,
          f_room_suffix: res.data[0].f_room_suffix,
          f_slice_area: res.data[0].f_slice_area,
          f_address: res.data[0].f_address,

          f_address_id: res.data[0].id,
          f_plan_id: res.data[0].f_plan_id ? res.data[0].f_plan_id : '',
          f_last_check_date: res.data[0].f_last_check_date ? res.data[0].f_last_check_date : '',
          f_last_check_state: res.data[0].f_last_check_state ? res.data[0].f_last_check_state : '',
          f_last_checker: res.data[0].f_last_checker ? res.data[0].f_last_checker : '',
          f_check_version: res.data[0].f_check_version ? res.data[0].f_check_version : '',

          f_pcd_new: this.findbyid(this.pcdslist, this.model.f_pcd_id).f_pcd,
          f_street_new: this.findbyid(this.streetslist, this.model.f_street_id).f_street,
          f_residential_area_new: this.findbyid(this.areaslist, this.model.f_residential_area_id).f_residential_area,
          f_building_new: this.model.f_building ? this.model.f_building : '',
          f_building_suffix_new: this.model.f_building_suffix ? this.model.f_building_suffix : '',
          f_unit_new: this.model.f_unit ? this.model.f_unit : '',
          f_unit_suffix_new: this.model.f_unit_suffix ? this.model.f_unit_suffix:'',
          f_floor_new: this.model.f_floor?this.model.f_floor : '',
          f_floor_suffix_new: this.model.f_floor_suffix?this.model.f_floor_suffix:'',
          f_room_new: this.model.f_room?this.model.f_room:'',
          f_room_suffix_new: this.model.f_room_suffix?this.model.f_room_suffix:'',
          f_slice_area_new: this.model.f_slice_area?this.model.f_slice_area:'',
          f_address_new: this.findbyid(this.streetslist, this.model.f_street_id).f_street +
            this.findbyid(this.areaslist, this.model.f_residential_area_id).f_residential_area +
            (this.model.f_building ? this.model.f_building + this.model.f_building_suffix : '') +
            (this.model.f_unit ? this.model.f_unit + this.model.f_unit_suffix : '') +
            (this.model.f_floor ? this.model.f_floor + this.model.f_floor_suffix : '') +
            this.model.f_room + this.model.f_room_suffix,
          f_metertitles: this.row.f_metertitles,
          f_metertitles_new: this.model.f_metertitles?this.model.f_metertitles:'',
          f_meter_book_num_old: this.row.f_meter_book_num,
          f_meter_book_num: this.model.f_meter_book_num,
          f_meter_book_name_old: this.model.f_meter_book_name,
          f_meter_book_name: meterbookname,
          f_comments: this.model.f_comments,
          f_userfiles_id: this.row.f_userfiles_id,
          f_user_id: this.row.f_user_id,
          f_userinfo_id: this.row.f_userinfo_id,
          f_user_name: this.row.f_user_name,
          f_operat_type: '迁表',
          f_describe: `${this.$login.f.name}对客户${this.row.f_user_name}进行迁表操作`,
          f_state: '有效',
          f_operator: this.$login.f.name,
          f_operatorid: this.$login.f.id,
          f_orgid: this.$login.f.orgid,
          f_orgname: this.$login.f.orgs,
          f_depid: this.$login.f.depids,
          f_depname: this.$login.f.deps,
          f_zoneid: this.$login.f.zoneid,
          f_zones: this.$login.f.zones
        }

        console.log(JSON.stringify(data))
        this.$resetpost('rs/logic/movemeter', data, {resolveMsg: '迁表成功', rejectMsg: '迁表失败'})
        this.$dispatch('success')
      }

    },

    computed: {
      adjustables () {
        let arr = []
        let filter = this.f_filialeids
        this.$GetSaleParam.getAdjustable(filter).forEach((item) => {
          let temp = {}
          temp.label = `[${item.value.f_adjustable_id}]-${item.label}`
          temp.value = item.value
          arr.push(temp)
        })
        return arr
      }
    },

    watch: {

    }
  }
</script>
