<template>
  <div class="flex-row">
    <div class='auto' id="modal-article-tree" style="width:650px;overflow:auto;">
      <tree1 :model="model" :is-click='true' url ='rs/logic/tree' v-ref:tree :params = "params" >
        <span partial>
          <span v-if="row.data.f_userid">{{row.data.name}}{{row.data.f_cusDom}}*{{row.data.f_userid}}</span>
          <span v-else>{{row.data.name}}{{row.data.f_cusDom}}{{row.data.f_userid}}</span>
          <span style="margin-left:50px;color: red" v-if="row.data.fmy > 0 && row.data.size > 1">共{{row.data.fmy}} 街道</span>
          <span style="margin-left:50px;color: red" v-if="row.data.f_unitname >= 1" >共{{row.data.f_unitname}} 单位</span>
          <span style="margin-left:50px;color: red" v-if="row.data.f_districtname >= 1" >共{{row.data.f_districtname}} 小区</span>
          <span style="margin-left:50px;color: red" v-if="row.data.f_cusdom >= 1" >共{{row.data.f_cusdom}} 栋楼</span>
          <span style="margin-left:50px;color: red" v-if="row.data.f_cusdy >= 1" >共{{row.data.f_cusdy}} 单元</span>
          <span style="color: red" v-if="row.data.fmh > 0 &&row.data.size > 1">共{{row.data.fmh}} 单位</span>
          <span style="color: red" v-if="row.data.fh > 0 &&row.data.size > 1">共{{row.data.fh}} 小区</span>
          <span style="color: red" v-if="row.data.size > 0">(总计{{row.data.已发 + row.data.未发}}:已发{{row.data.已发}},未发{{row.data.未发}})户</span>
          <span style="color: red" v-else >{{row.data.f_whethergivecard}}</span>
        </span>
      </tree1>
    </div>
    <div style="flex: 1;">
      <span style="margin-left:50px;color: red">小提示：0号楼0单元表示独院</span>
      <show-message :row= 'ro' v-show = 'civil'></show-message>
    </div>
  </div>
</template>
<script>
import { co } from 'co'
let postGen = function * (self, prams) {
  console.log('prams', prams)
  self.$refs.tree.toNode = []
  self.params = prams
  self.$resetpost('rs/sql/tree1', {data: {item: self.item, items: self.items, condition: self.condition}},
{resolveMsg: null, rejectMsg: null})
.then((res) => {
  self.model = res.data
  console.log('mmmmmmmmmmmmmmodel', self.model)
})
  .catch((res) => {
    window.alert(res.msg)
  })
}
let post = function * (self) {
  // let da = {}
  self.$resetpost('rs/sql/getinfo', {data: {condition: self.condition}},
  {resolveMsg: null, rejectMsg: null})
  .then((res) => {
    if (res.data.length > 0) {
      self.ro = res.data
      self.condition = ''
    } else {
      self.ro = []
    }
  }).catch((res) => {
    window.alert(res.msg)
  })
}
export default {
  title: 'hhhh',
  props: ['show'],
  data () {
    return {
      params: {},
      item: 'f_usertype',
      items: 'f_road',
      civil: true,
      condition: '',
      ro: '',
      model: [
        {name: '西大街',
          size: 1,
          children: [
            {name: '幸福小区',
              size: 2,
              children: [
            {name: '1栋', size: 0},
                {name: '2栋',
                  size: 1,
                  children: [
                    {name: '三层',
                      size: 3,
                      children: [
                {name: '301', size: 0},
                {name: '302', size: 0},
                {name: '303', size: 0}
                      ]}
                  ]}
              ]},
            {name: '景寓学府',
              size: 2,
              children: [
                {name: '1栋',
                  size: 2,
                  children: [
                    {name: '三层',
                      size: 3,
                      children: [
                {name: '301', size: 0},
                {name: '302', size: 0},
                {name: '303', size: 0}
                      ]},
                    {name: '5层',
                      size: 3,
                      children: [
                {name: '501', size: 0},
                {name: '502', size: 0},
                {name: '503', size: 0}
                      ]}
                  ]},
                {name: '2栋',
                  size: 1,
                  children: [
                    {name: '三层',
                      size: 3,
                      children: [
                {name: '301', size: 0},
                {name: '302', size: 0},
                {name: '303', size: 0}
                      ]}
                  ]}
              ]}
          ]}
      ]
    }
  },
  methods: {
    cancel (row) {
      console.log('rrrrrrrrr', row)
      if (row.size === 0) {
        if (row.level === 3) {
          this.civil = true
          this.condition = `f_userfiles_id = '${row.data.f_userfiles_id}'`
        } else if (row.level === 6) {
          this.condition = `f_usertype='民用' and f_apartment = '${row.data.name}' and ` +
          `f_cusFloor  ='${row.parent.data.name}' and ` +
          `f_cusdy = '${row.parent.parent.data.name}' and ` +
          `f_cusdom = '${row.parent.parent.parent.data.name}' and ` +
          `f_road = '${row.parent.parent.parent.parent.parent.data.name}' and ` +
          `f_districtname = '${row.parent.parent.parent.parent.data.name}' and ` +
          `f_userid = '${row.data.f_userid}'`
          this.civil = true
        }
        if (row.data.parent == 'f_userfiles_id') {
          this.civil = true
          this.condition = `f_userfiles_id = '${row.data.name}'`
        }
        console.log('cccccondition', this.condition)
        let gen = post(this)
        return co(gen)
      }
    },
    searchuserinfotree (parms) {
      let gen = postGen(this, parms)
      return co(gen)
    }

  },
  ready () {
    let data = {f_districtname: '1', f_road: '1'}
    let gen = postGen(this, data)
    return co(gen)
  },
  events: {
    'select-changed': function (data) {
      // 事件回调内的 `this` 自动绑定到注册它的实例上
      console.log('改变时的params', this.params)
      console.log('改变时的model', this.model)
      this.cancel(data.val)
    },
    'refreshpage': function () {
      // 事件回调内的 `this` 自动绑定到注册它的实例上
      let data = {f_districtname: '1', f_road: '1'}
      let gen = postGen(this, data)
      return co(gen)
    }
  }
}
</script>
<style lang='less'>
  #modal-article-tree .list-group-{
      background-color: #2c74c0;
      color: #fff;
      border: none;
      &:hover {
          background: #909090;
          color: #fff;
      }
      &.active,
      &.active:hover,
      &.active:focus {
          background-color: #909090;
          color: #FFF;
      }
  }
</style>
