<template>
  <div style="flex:1;" class="flex">
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri >
        <div novalidate class="auto form-horizontal select-overspread container-fluid auto" partial>
          <div class="row" v-show="$parent.$parent.criteriaShow">
            <div class="col-sm-2 form-group form-fix-width" >
              <label for="startDate" class="font_normal_body _zoom4">开始日期</label>
              <datepicker id="startDate" placeholder="开始日期" class="_zoom6"
                          v-model="model.startDate"
                          :value.sync="model.startDate"
                          :format="'yyyy-MM-dd'"
                          :show-reset-button="true"
                          condition="f_meter_time >= '{}'">
              </datepicker>
            </div>
            <div class="col-sm-2 form-group form-fix-width" >
              <label for="endDate" class="font_normal_body _zoom4">结束日期</label>
              <datepicker id="endDate" placeholder="结束日期" class="_zoom6"
                          v-model="model.endDate"
                          :value.sync="model.endDate"
                          :format="'yyyy-MM-dd'"
                          :show-reset-button="true"
                          condition="f_meter_time <= '{}'">
              </datepicker>
            </div>
            <div class="col-sm-2 form-group form-fix-width" >
              <label class="font_normal_body _zoom4">卡号</label>
              <input type="number" class="form-control _zoom6" v-model="model.f_card_id"
                     condition=" f_card_id = '{}' " placeholder='用户卡号'>
            </div>
            <div class="col-sm-2 form-group form-fix-width" >
              <label class="font_normal_body _zoom4">数据来源</label>
              <v-select
                :options="$parent.$parent.datasources"
                :value.sync="model.f_resource"
                v-model="model.f_resource"
                condition="f_resource = '{}'"
                :value-single=true
                placeholder='请选择'
                close-on-select></v-select>
            </div>
          </div>
          <div class="row">
            <div  style = "float:right;margin-top:10px">
              <button class="btn btn-success" @click="search()">查询</button>
              <button class="btn btn-default" @click="$parent.$parent.clear()">清空</button><!--
              <export-excel :data="$parent.$parent.getCondition"
                            :field="$parent.$parent.getfield"
                            sqlurl="rs/logic/exportfile" sql-name="chargeQuery" template-name='收费查询导出'  :choose-col="true"></export-excel>
              -->
<!--              <print-data :model="$parent.model" :field="$parent.$parent.getfield" :defaultfield="$parent.$parent.defaultfield" print-name="收费查询"-->
<!--                          :sumsmodel="$parent.$parent.sumsmodel" ></print-data>-->
              <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>
      </criteria>

      <data-grid  :model="model" partial='list' v-ref:grid >
        <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>
            <th><nobr>购气次数</nobr></th>
            <th><nobr>当前气价</nobr></th>
            <th><nobr>表时间</nobr></th>
            <th><nobr>无用气天数</nobr></th>
            <th><nobr>无用气秒数</nobr></th>
            <th><nobr>防死表功能</nobr></th>
            <th><nobr>死表天数1</nobr></th>
            <th><nobr>死表天数2</nobr></th>
            <th><nobr>限购功能</nobr></th>
            <th><nobr>限购金额</nobr></th>
            <th><nobr>用户卡号</nobr></th>
            <th><nobr>表状态</nobr></th>
            <th><nobr>开户标志</nobr></th>
            <th><nobr>单价类型</nobr></th>
            <th><nobr>单价</nobr></th>
            <th><nobr>启用的日期1</nobr></th>
            <th><nobr>启用的日期2</nobr></th>
            <th><nobr>启用的日期3</nobr></th>
            <th><nobr>启用的日期4</nobr></th>
            <th><nobr>启用的日期5</nobr></th>
            <th><nobr>启用的日期6</nobr></th>
            <th><nobr>启用的日期7</nobr></th>
            <th><nobr>启用的日期8</nobr></th>
            <th><nobr>启用的日期9</nobr></th>
            <th><nobr>启用的日期10</nobr></th>
            <th><nobr>启用的日期11</nobr></th>
            <th><nobr>启用的日期12</nobr></th>
            <th><nobr>启用的日期13</nobr></th>
            <th><nobr>启用的日期14</nobr></th>
            <th><nobr>单价1</nobr></th>
            <th><nobr>用量1</nobr></th>
            <th><nobr>单价2</nobr></th>
            <th><nobr>用量2</nobr></th>
            <th><nobr>单价3</nobr></th>
            <th><nobr>用量3</nobr></th>
            <th><nobr>单价修改标志</nobr></th>
            <th><nobr>单价修改日期</nobr></th>
            <th><nobr>新单价</nobr></th>
            <th><nobr>新单价1</nobr></th>
            <th><nobr>新用量1</nobr></th>
            <th><nobr>新单价2</nobr></th>
            <th><nobr>新用量2</nobr></th>
            <th><nobr>新单价3</nobr></th>
            <th><nobr>新用量3</nobr></th>
            <th><nobr>单价1</nobr></th>
            <th><nobr>用量1</nobr></th>
            <th><nobr>单价2</nobr></th>
            <th><nobr>用量2</nobr></th>
            <th><nobr>单价3</nobr></th>
            <th><nobr>用量3</nobr></th>
            <th><nobr>新单价</nobr></th>
            <th><nobr>新单价1</nobr></th>
            <th><nobr>新用量1</nobr></th>
            <th><nobr>新单价2</nobr></th>
            <th><nobr>新用量2</nobr></th>
            <th><nobr>新单价3</nobr></th>
            <th><nobr>新用量3</nobr></th>
            <th><nobr>单价3</nobr></th>
            <th><nobr>用量1</nobr></th>
            <th><nobr>单价3</nobr></th>
            <th><nobr>用量3</nobr></th>
            <th><nobr>单价3</nobr></th>
            <th><nobr>用量3</nobr></th>
            <th><nobr>新单价</nobr></th>
            <th><nobr>新单价1</nobr></th>
            <th><nobr>新用量1</nobr></th>
            <th><nobr>新单价3</nobr></th>
            <th><nobr>新用量3</nobr></th>
            <th><nobr>新单价3</nobr></th>
            <th><nobr>新用量3</nobr></th>
            <th><nobr>单价4</nobr></th>
            <th><nobr>用量1</nobr></th>
            <th><nobr>单价4</nobr></th>
            <th><nobr>用量4</nobr></th>
            <th><nobr>单价4</nobr></th>
            <th><nobr>用量4</nobr></th>
            <th><nobr>新单价</nobr></th>
            <th><nobr>新单价1</nobr></th>
            <th><nobr>新用量1</nobr></th>
            <th><nobr>新单价4</nobr></th>
            <th><nobr>新用量4</nobr></th>
            <th><nobr>新单价4</nobr></th>
            <th><nobr>新用量4</nobr></th>
            <th><nobr>当前月累计</nobr></th>
            <th><nobr>月累计量1</nobr></th>
            <th><nobr>月累计量2</nobr></th>
            <th><nobr>月累计量3</nobr></th>
            <th><nobr>月累计量4</nobr></th>
            <th><nobr>月累计量5</nobr></th>
            <th><nobr>月累计量6</nobr></th>
            <th><nobr>月累计量7</nobr></th>
            <th><nobr>月累计量8</nobr></th>
            <th><nobr>月累计量9</nobr></th>
            <th><nobr>月累计量10</nobr></th>
            <th><nobr>月累计量11</nobr></th>
            <th><nobr>月累计量12</nobr></th>
            <th><nobr>月累计量13</nobr></th>
            <th><nobr>月累计量14</nobr></th>
            <th><nobr>月累计量15</nobr></th>
            <th><nobr>月累计量16</nobr></th>
            <th><nobr>月累计量17</nobr></th>
            <th><nobr>月累计量18</nobr></th>
            <th><nobr>月累计量19</nobr></th>
            <th><nobr>月累计量20</nobr></th>
            <th><nobr>月累计量21</nobr></th>
            <th><nobr>月累计量22</nobr></th>
            <th><nobr>月累计量23</nobr></th>
            <th><nobr>月累计量24</nobr></th>
            <th><nobr>安检年数</nobr></th>
            <th><nobr>报废年数</nobr></th>
            <th><nobr>第一档报警气量</nobr></th>
            <th><nobr>第二档报警气量</nobr></th>
            <th><nobr>安检年数</nobr></th>
            <th><nobr>报废年数</nobr></th>
            <th><nobr>第一档报警气量</nobr></th>
            <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_devices_type}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_user_type}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_zhye}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_total_gas}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_total_gas_account}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_buy_times}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_price}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_meter_time}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_not_use_day}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_not_use_second}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_avoid_dead_meter}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_dead_meter_day_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_dead_meter_day_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_restriction}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_restriction_account}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_meter_state}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_account_flag}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_type}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_1}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_5}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_6}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_7}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_8}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_9}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_10}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_11}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_12}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_13}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_date_14}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.f_price_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_three}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_three}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_modify_flag}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_modify_date}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_three}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_three}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.f_price_one2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_one2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_two2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_two2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_three2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_three2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_one2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_one2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_two2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_two2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_three2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_three2}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.f_price_one3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_one3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_two3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_two3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_three3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_three3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_one3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_one3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_two3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_two3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_three3}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_three3}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.f_price_one4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_one4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_two4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_two4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_price_three4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_gas_three4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_one4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_one4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_two4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_two4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_price_three4}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_new_gas_three4}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.f_month_total}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_belong_to_month}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_three}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_four}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_five}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_six}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_seven}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_eight}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_nine}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_ten}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_eleven}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twelve}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_thirteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_fourteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_fifteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_sixteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_seventeen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_eighteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_nineteen}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twenty}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twenty_one}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twenty_two}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twenty_three}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_month_twenty_four}}</nobr></td>

          <td style="text-align: center;"><nobr>{{row.ajyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.bfyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.alarm1}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.alarm2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.fxajyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.fxbfyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.fxalarm1}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.fxalarm2}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.yiyognajyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row. yiyongbfyear}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.touzhi}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.lasttouzhi}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.lastchulidate}}</nobr></td>
        </template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

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

export default {
  data() {
    return {
      infodata:{},
      showinfo: false,
      data: {},
      model: new PagedList('rs/sql/rfCardReadBack', 20, ),
      criteriaShow: true,
      modelval: [],
      printshow: false,
      datasources:[{label: '全部', value: ''},{label: '收费', value: '收费'},{label: '平板维修', value: '平板维修'}],
      datasource:'',
    }
  },
  ready(){

  },
  methods: {
    cancel  () {
      this.showinfo=false
      this.infodata = {}
    },
    selfSearch (args) {
      this.model.search(args.condition, args.model)
    },
    clear(){
      Object.keys(this.$refs.paged.$refs.cri.model).forEach((key) => {
        this.$refs.paged.$refs.cri.model[key] = []
      })

    },
    show(){
      this.criteriaShow = true
    },
    hidden(){
      this.criteriaShow = !this.criteriaShow
    },
    stamp () {
      this.all = false
      //默认选择要打印的列
      this.modelval = defaultPrint.config
      this.fields = this.getfield
      console.log('所有打印字段',this.fields)
      this.printshow = true
      this.put()
    },
    print () {
      this.$refs.print.PrintAsFile()
      this.printshow = false
    },
    close () {
      this.printshow = false
      this.all = false
    },
    // 对选择的列进行排序
    sortModelval () {
      let sortModel = []
      Object.keys(this.fields).forEach((key) => {
        if (this.modelval.includes(key)) {
          sortModel.push(key)
        }
      })
      this.modelval = sortModel
      console.log('选择的打印的字段', this.modelval)
    }
  },
  watch:{

  },
  computed:{

  }
}
</script>
