<template>
  <div id="unit" class="flex-row" :class="{'binary':listShow}">
    <div :class="{'basic-main':!listShow,'binary-left':listShow}">
      <concentrator-archives-list  v-ref:arealist @dblclick="modifydata"  :style="style" :f_filialeids.sync="f_filialeids"></concentrator-archives-list>
    </div>
    <div v-show="listShow" style="width: 60%" class="binary-right">
      <div class="flex">
        <concentrator-archives-add  v-ref:addareamsg :areatype="areatype" :operation="operation"
                      :f_filialeids.sync="f_filialeids" :row="arearow"></concentrator-archives-add>
      </div>
    </div>
  </div>
  <modal v-if="addmeterinfoshow" :show.sync="addmeterinfoshow" width="80%" title="表具信息" v-ref:modal large backdrop="false">
    <article slot="modal-body" class="modal-body" style="height: 700px;padding: 0!important;">
      <archives-userfiles-manage :is-select="isSelect"  :fileinfo="allarearow" :f_filialeid.sync="f_filialeids"
                                   @address-valid="doNothing"  v-ref:userfilesadd ></archives-userfiles-manage>
<!--      <concentrator-userfiles-list :is-select="isSelect" :meterinfo="meterinfo" :fileinfo="areamodel" :f_filialeid.sync="f_filialeids" :usertype="areamodel.f_user_type"-->
<!--                                   @address-valid="doNothing"  v-ref:userfilesadd ></concentrator-userfiles-list>-->
    </article>
    <footer slot="modal-footer" class="modal-footer">
    </footer>
  </modal>
</template>

<script>
  export default {
    title: '集中器管理',
    components: {
    },
    data () {
      return {
        // 分公司id串
        width: '100%',
        f_filialeids: this.$login.f.orgid,
        listShow: false,
        areatype: '小区',
        arearow: {},
        allarearow: {},
        style: 'col-sm-3 form-group',
        addmeterinfoshow: false
      }
    },
    ready () {

    },
    props: {

    },
    methods: {
      refresh () {
        this.listShow = false
        this.$refs.arealist.$refs.paged.$refs.cri.search()
      },
      modifydata (val) {
        if (!val || !val.id) return
      // 修改档案
        this.style = 'col-sm-3 form-group'
        this.listShow = true
        this.$refs.arealist.areaShow = false
        this.$refs.arealist.listshow = false
        this.$refs.addareamsg.cleardara()
        this.$refs.addareamsg.operation = 'modify'
        this.$refs.addareamsg.curorgid = []
        this.$refs.addareamsg.curorgid.push(val.f_orgid)
        this.$refs.addareamsg.initdata(val)
      }
    },
    events: {
      async 'confirmuserfiles' (res) {
        // this.addmeterinfoshow = false
        // console.log("res", res);
       // this.meterinfo.push(res);

      },
      'add' (val) {
        this.style = 'col-sm-3 form-group'
        this.listShow = true
        this.$refs.addareamsg.cleardara()
        this.$refs.addareamsg.operation = 'add'
        this.$refs.addareamsg.curorgid = []
        this.$refs.addareamsg.curorgid.push(this.f_filialeids)
        this.$refs.addareamsg.initdata()
      },
      'confirm' () {
        this.style = 'col-sm-2 form-group'
        this.listShow = false
        this.$refs.arealist.$refs.paged.$refs.cri.search()
        this.$refs.arealist.areaShow = true
        this.$refs.arealist.listshow = true
      },
      'cancel' () {
        this.style = 'col-sm-2 form-group'
        this.$refs.arealist.$refs.paged.$refs.cri.search()
        this.$refs.arealist.areaShow = true
        this.listShow = false
        this.$refs.arealist.listshow = true
      },
      'newsearch' () {
        this.style = 'col-sm-3 form-group'
        this.listShow = false
        this.$refs.addareamsg.cleardara()
      },
      'modify' (val) {
        // 修改档案
        this.style = 'col-sm-3 form-group'
        this.listShow = true
        this.$refs.addareamsg.cleardara()
        this.$refs.addareamsg.operation = 'modify'
        this.$refs.addareamsg.initdata(val)
      }
    },
    watch: {
      'addmeterinfoshow' (val) {
        if (!val) {
          this.$refs.arealist.search()
        }
      }
    }
  }
</script>

