<template>
  <div @keyup.enter="search" class="flex" id="ss" style="flex:1;" v-el:sss>
    <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 :style="$parent.$parent.$parent.isdetail?'col-sm-3 form-group':'col-sm-2 form-group'" :show-component="['company','department','operator']" :initres="$parent.$parent.initres"  @re-res="$parent.$parent.getorg" v-ref:sel></res-select-group>
            <div
              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"
              class="form-group ">
              <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="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"-->
<!--              class="form-group " v-if="!$parent.$parent.$parent.isdetail">-->
<!--              <label class="font_normal_body">用户姓名</label>-->
<!--              <input class="input_search" condition="f_user_name like '%{}%'" placeholder="用户姓名" style="width:60%"-->
<!--                     type="text" v-model="model.name" />-->
<!--            </div>-->
<!--            <div-->
<!--              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"-->
<!--              class="form-group "-->
<!--              v-if="$parent.$parent.clientWidth>1600">-->
<!--              <label class="font_normal_body">电&emsp;&emsp;话</label>-->
<!--              <input :size="model.f_user_phone ? model.f_user_phone.length : 2" class="input_search"-->
<!--                     condition="f_user_phone = '{}'" placeholder='电话' style="width:60%"-->
<!--                     type="text"-->
<!--                     v-model="model.f_user_phone">-->
<!--            </div>-->
<!--            <div-->
<!--              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"-->
<!--              class="form-group "-->
<!--              v-if="$parent.$parent.clientWidth<1600&&!$parent.$parent.$parent.isdetail">-->
<!--              <label class="font_normal_body">电&emsp;&emsp;话</label>-->
<!--              <input :size="model.f_user_phone ? model.f_user_phone.length : 2" class="input_search"-->
<!--                     condition="f_user_phone = '{}'" placeholder='电话' style="width:60%"-->
<!--                     type="text"-->
<!--                     v-model="model.f_user_phone">-->
<!--            </div>-->
            <div class="form-group  button-range" style="padding-right: 10px">
              <button @click="$parent.$parent.search()" class="button_search button_spacing" v-el:cx>查询</button>
              <button @click="$parent.$parent.add()" class="button_export button_spacing" style="width: max-content;"
                      v-el:cx>新增低保户
              </button>
              <export-excel
                      :data="$parent.$parent.getCondition"
                      :field="$parent.$parent.getfield"
                      sqlurl="rs/logic/saleExport" progress="saleGetExportProgress" sql-name="get_BasicLiving" template-name='低保户导出'
                      :choose-col="true">
              </export-excel>
              <div
                :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                @click="$parent.$parent.criteriaShow=!$parent.$parent.criteriaShow"
                class="button_spacing"
                style="float: right"></div>
            </div>
          </div>
          <div class="row" v-if="$parent.$parent.criteriaShow">
            <div
              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"
              class="form-group ">
<!--              v-if="$parent.$parent.$parent.isdetail">-->
              <label class="font_normal_body">用户姓名</label>
              <input class="input_search" condition="f_user_name like '%{}%'" placeholder="用户姓名" style="width:60%"
                     type="text" v-model="model.name" />
            </div>
            <div
              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"
              class="form-group ">
              <label class="font_normal_body">电&emsp;&emsp;话</label>
              <input :size="model.f_user_phone ? model.f_user_phone.length : 2" class="input_search"
                     condition="f_user_phone = '{}'" placeholder='电话' style="width:60%"
                     type="text"
                     v-model="model.f_user_phone">
            </div>
            <div
              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"
              class="form-group ">
              <label class="font_normal_body">地&emsp;&emsp;址</label>
              <input :size="model.f_address ? model.f_address.length * 2 : 4" class="input_search"
                     condition="f_address like '%{}%'" placeholder='用户地址' style="width:60%"
                     type="text"
                     v-model="model.f_address">
            </div>

            <div
              :class="{'col-sm-2':!$parent.$parent.$parent.isdetail,'col-sm-3':$parent.$parent.$parent.isdetail}"
              class="form-group ">
              <label class="font_normal_body">状&emsp;&emsp;态</label>
              <v-select
                :options='$parent.$parent.state'
                :value-single="true"
                :value.sync="model.f_state"
                close-on-select
                condition="f_state ='{}'"
                v-model="model.f_state"></v-select>

            </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;">
              <nobr>序号</nobr>
            </th>
            <th style="text-align: center;">
              <nobr>用户编号</nobr>
            </th>
            <th style="text-align: center;">
              <nobr>姓名</nobr>
            </th>
            <th style="text-align: center;" v-show='!$parent.$parent.$parent.$parent.isdetail'>
              <nobr>电话</nobr>
            </th>
            <th style="text-align: center;">
              <nobr>地址</nobr>
            </th>
            <th style="text-align: center;" v-show='!$parent.$parent.$parent.$parent.isdetail'>
              <nobr>气价</nobr>
            </th>
            <th style="text-align: center;"  v-show='!$parent.$parent.$parent.$parent.isdetail' >
              <nobr>开始时间</nobr>
            </th>
            <th style="text-align: center;"  v-show='!$parent.$parent.$parent.$parent.isdetail' >
              <nobr>结束时间</nobr>
            </th>
          </tr>
        </template>
        <template partial='body'>
          <td style="text-align: center;"><nobr>{{$index+1}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_userinfo_code}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_user_name}}</nobr></td>
          <td v-show='!$parent.$parent.$parent.$parent.isdetail' style="text-align: center;"><nobr>{{row.f_user_phone}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_address}}</nobr></td>
          <td v-show='!$parent.$parent.$parent.$parent.isdetail' style="text-align: center;"><nobr>{{row.f_price_name}}</nobr></td>
          <td v-show='!$parent.$parent.$parent.$parent.isdetail' style="text-align: center;"><nobr>{{row.f_start_date}}</nobr></td>
          <td v-show='!$parent.$parent.$parent.$parent.isdetail' style="text-align: center;"><nobr>{{row.f_end_date}}</nobr></td>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

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

  export default {
    data () {
      return {
        initres: {
          org: [this.$login.f.orgid],
          dep: [],
          user: []
        },
        state: [{value: '', label: '全部'},
          {value: '有效', label: '有效'},
          {value: '过期', label: '过期'},
          {value: '无效', label: '无效'}],
        model: new PagedList('rs/sql/get_BasicLiving', 20, {orderitem: '"' + this.orderitem + '"'}),

        // 公司下拉
        curorgid: [this.$login.f.orgid],

        f_orgid: '',
        criteriaShow: false,
        clientWidth: document.body.clientWidth,
        getfield: {
          'f_userinfo_code': '用户编号',
          'f_user_name': '姓名',
          'f_user_phone': '电话',
          'f_address': '地址',
          'f_price_name': '气价',
          'f_start_date': '开始时间',
          'f_end_date': '结束时间'
        }
      }
    },
    props: {
      orderitem: {
        type: String,
        default: 'f_price_id'
      },
      row: {}
    },
    compiled () {
      window.onresize = () => {
        return (() => {
          this.clientWidth = document.body.clientWidth
        })()
      }
  },
    ready () {
      this.$refs.paged.$refs.cri.model.f_state = '有效'
      this.search()
    },
    methods: {
      async getRes (condition, obj) {
        console.log('低保户condition =', condition)
        console.log('低保户obj =', obj)
        this.orgname = obj.orgnames[0]
        this.depname = obj.depnames[0]
        // 更新抄表册
        // this.meterbooks = [{label: '全部',value: ''}];
        // if(this.lastorgstr != condition){
        //   this.tempfalg = true;
        //   this.lastorgstr = condition;
        // }
        // if(this.tempfalg && condition != null && condition!=''  && condition.indexOf("(")>-1){
        //   this.tempfalg = false;
        //   let a = condition.substring(condition.indexOf("(")+2)
        // }
        // this.orgCondtionStr = condition
      },

      search () {
        this.$refs.paged.$refs.cri.search()
        this.$dispatch('search')
        console.log('低保户search,', this.f_orgid)
      },
      getorg (val) {
        console.log('低保户的val', 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} and s.f_filialeid  in ${this.f_orgid}`
          args.condition = `${args.condition}   ${this.f_orgid}`
        }
        this.model.search(args.condition, args.model)
      },
      add () {
        this.$dispatch('add')
      }
    },
    computed: {
      getCondition () {
        return {condition: `${this.$refs.paged.$refs.cri.condition}` + this.f_orgid}
      }
    }
  }
</script>
