<template>
  <div id="unit" class="flex">
    <div class="height:auto" >

          <criteria-paged :model="model" v-ref:paged>
            <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri>
              <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
<!--                <div class="row">-->
<!--                  <div class="col-sm-3"  >-->
<!--                    <label class="font_normal_body">卡号</label>-->
<!--                    <input type="text" style="width:60%" class="input_search" v-model="model.f_card_id"-->
<!--                           condition="f_card_id like '%{}%'" placeholder='卡号'>-->
<!--                  </div>-->
<!--                  <div class="col-sm-3"  >-->
<!--                    <label class="font_normal_body">状态</label>-->
<!--                    <v-select :value.sync="model.f_table_state"-->
<!--                              style="width:60%"-->
<!--                              v-model="model.f_table_state"-->
<!--                              :options='$parent.$parent.tablestate' placeholder='气表状态'-->
<!--                              condition="f_table_state = '{}'"-->
<!--                              close-on-select></v-select>-->
<!--                  </div>-->
<!--                  <div class="span" style="float:right;">-->
<!--                    <button class="button_search button_spacing" @click="search()">查询</button>-->
<!--&lt;!&ndash;                    <button class="button_clear button_spacing" @click="$parent.$parent.clear()">清空</button>&ndash;&gt;-->
<!--                  </div>-->
<!--                </div>-->





              </div>
            </criteria>

            <data-grid :model="model" partial='list' v-ref:grid class="list_area table_sy" :classname="$parent.classname">
              <template partial='head'>
                <tr>

                  <th>
                    <nobr>卡号</nobr>
                  </th>
                  <th>
                    <nobr>气表品牌</nobr>
                  </th>
                  <th>
                    <nobr>气表型号</nobr>
                  </th>
                  <th>
                    <nobr>气价类型</nobr>
                  </th>
                  <th>
                    <nobr>气价名称</nobr>
                  </th>
                  <th>
                    <nobr>气表状态</nobr>
                  </th>
                </tr>
              </template>
              <template partial='body'>
                <td style="text-align: center;">
                  <nobr>{{row.f_card_id}}</nobr>
                </td>
                <td style="text-align: center;">
                  <nobr>{{row.f_meter_brand}}</nobr>
                </td>
                <td style="text-align: center;">
                  <nobr>{{row.f_meter_style}}</nobr>
                </td>
                <td style="text-align: center;">
                  <nobr>{{row.f_price_type}}</nobr>
                </td>
                <td style="text-align: center;">
                  <nobr>{{row.f_price_name}}</nobr>
                </td>
                <td style="text-align: center;">
                  <nobr>{{row.f_table_state}}</nobr>
                </td>
              </template>
              <template partial='foot'>

              </template>
            </data-grid>
          </criteria-paged>

    </div>
  </div>
</template>

<script>
  import {PagedList} from 'vue-client'
  // import exportConfig from '../../config/exportConfig'

  let readySomething = async function (self) {
    await self.$refs.paged.$refs.cri.search()
  }

  export default {
    data() {
      return {
        model: new PagedList('api/af-revenue/sql/meterQuery', 20),
        orgCondtionStr: '',
        //合计数据
        // sumsmodel: {},
        f_filialeid: this.$login.f.f_orgid
      }
    },

    props: ['f_userinfo_id','showquery']

    ,
    ready() {
      if(this.f_userinfo_id) {
        readySomething(this)
      }
    },
    methods: {
      selfSearch(args) {


        if (!this.orgCondtionStr) {
          args.condition = `${args.condition}` + " and f_orgid = " + this.$login.f.orgid + " and f_userinfo_id = "+this.f_userinfo_id
        } else {
          args.condition = `${args.condition}` + this.orgCondtionStr
        }
        this.model.search(args.condition, args.model)
        // this.sumsmodel = this.$refs.paged.$refs.grid.model.sums
      }

    },
    watch: {
      'f_userinfo_id' (val) {
        this.$refs.paged.$refs.cri.search()
      }
    //   'showquery'(val){
    //     console.log("222222222222222222222222")
    //     console.log(val)
    //     if (val===true){
    //       console.log("111111111111111111111111111111111")
    //       this.$refs.paged.$refs.cri.search()
    //     }
    //
    // }

    },
    computed: {


      getCondition() {
        return {condition: `${this.$refs.paged.$refs.cri.condition}` + this.orgCondtionStr}
      },

      tablestate() {
        return [{label: '全部', value: ''}, {label: '正常', value: '正常'}, {label: '停用', value: '停用'}]
      },
    }
  }
</script>
