<template>
  <div class="flex-auto" style="flex:1;">
    <criteria-paged :model="model" v-ref:paged>
      <criteria @condition-changed='$parent.selfSearch' partial='criteria' v-ref:cri>
        <div class="form-horizontal select-overspread container-fluid auto" novalidate partial>
          <div class="row">
            <res-select-group :show-component="['company']"
                              :initres="$parent.$parent.initres"
                              @re-res="$parent.$parent.getorg"
                              :selectin="false"
                              :style="$parent.$parent.style"
                              v-ref:sel>
            </res-select-group>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">用户编号</label>
              <input class="input_search" condition="f_userinfo_code like '%{}%'" placeholder="用户编号" style="width:60%" type="text" v-model="model.ename"
              />
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">用户姓名</label>
              <input class="input_search" condition="f_user_name = '{}'" placeholder="用户姓名" style="width:60%" type="text" v-model="model.name"
              />
            </div>
            <div class="form-group col-sm-3 button-range" style="padding-right: 10px">
              <button @click="$parent.$parent.search()" class="button_search button_spacing"
                      style="width:80px;margin-left:30px;" v-el:cx>查询
              </button>
              <div
                :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                @click="$parent.$parent.hidden()" class="button_spacing" style="float: right"></div>
            </div>
          </div>
          <div class="row" v-if="$parent.$parent.criteriaShow">
            <div class="form-group col-sm-3">
              <label class="font_normal_body">电&emsp;&emsp;话</label>
              <input class="input_search" condition="f_user_phone = '{}'" placeholder='电话' style="width:60%" type="text" v-model="model.f_user_phone">
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">表&emsp;&emsp;号</label>
              <input class="input_search" condition="f_meternumber = '{}'" placeholder='表号' style="width:60%" type="text" v-model="model.f_meternumber">
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">卡&emsp;&emsp;号</label>
              <input class="input_search" condition="f_card_id = '{}'" placeholder='卡号' style="width:60%" type="text" v-model="model.f_card_id">
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">地&emsp;&emsp;址</label>
              <input class="input_search" condition="f_address like '%{}%'" placeholder='用户地址' style="width:60%" type="text" v-model="model.f_address">
            </div>

          </div>

        </div>
      </criteria>
      <data-grid :model="model" class="list_area table_sy" partial='list' v-ref:grid>
        <template partial='head'>
          <tr>
            <th style="text-align: center;">用户编号</th>
            <th style="text-align: center;">姓名</th>
            <th style="text-align: center;">表号</th>
            <th style="text-align: center;">卡号</th>
            <th style="text-align: center;">电话</th>
            <th style="text-align: center;">地址</th>
            <th style="text-align: center;">操作</th>
          </tr>
        </template>
        <template partial='body'>
          <td style="text-align: center;">{{ row.f_userinfo_code }}</td>
          <td style="text-align: center;">{{ row.f_user_name }}</td>
          <td style="text-align: center;">{{ row.f_meternumber }}</td>
          <td style="text-align: center;">{{ row.f_card_id }}</td>
          <td style="text-align: center;">{{ row.f_user_phone }}</td>
          <td style="text-align: center;">{{ row.f_address }}</td>
          <td style="text-align: center;" class="row auto">
            <nobr>
              <button type="button"
                      name="button"
                      class="button_search button_spacing width-60"
                      @click.stop="$parent.$parent.$parent.select(row)">
                选择
              </button>
            </nobr>
          </td>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
import {PagedList} from 'vue-client'

export default {
  data () {
    return {
      initres: {
        org: [this.$login.f.orgid],
        dep: [],
        user: []
      },
      style: 'form-group col-sm-3',
      criteriaShow: false,
      f_orgid: '',
      model: new PagedList('rs/sql/sale_getBlackSelectUser', 10)
    }
  },
  props: {
  },
  ready () {
    this.search()
  },
  methods: {
    select (row) {
      console.log('选中了用户', row)
      this.$dispatch('select-changed', { val: row })
    },
    async getRes (condition, obj) {
      console.log('condition =', condition)
      console.log('obj =', obj)
    },
    hidden () {
      this.criteriaShow = !this.criteriaShow
    },
    search () {
      this.$refs.paged.$refs.cri.search()
      this.$dispatch('search')
    },
    getorg (val) {
      this.f_orgid = val
    },
    selfSearch (args) {
      if (!this.f_orgid) {
        this.getorg('and f_orgid in' + '(\'' + [this.$login.f.orgid] + '\')')
      }
      console.log('查询。。。', this.f_orgid)
      if (this.f_orgid) {
        args.condition = `${args.condition}  ${this.f_orgid} `
      }
      this.model.search(args.condition, args.model)
    }
  },
  watch: {},
  computed: {}
}
</script>
