<template >
  <div id="stand-work-list" class="flex bg-white p-10">
      <criteria-paged :model="model" v-ref:paged  >
        <criteria partial='criteria' v-ref:criteria  @condition-changed='$parent.search'>
          <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row" width="100%">
              <div class="col-sm-4" >
                <label class="font_normal_body" >&nbsp;开始时间</label>
                <datepicker placeholder="起始时间" style="width:60%"
                            :value.sync="model.f_start_date"
                            v-model="model.f_start_date"
                            :format="'yyyy-MM-dd'"
                            condition="f_operate_date >= to_date('{} 00:00:00','yyyy-mm-dd hh24:mi:ss')"
                ></datepicker>
              </div>
              <div class="col-sm-4" >
                <label class="font_normal_body" >结束时间</label>
                <datepicker placeholder="结束时间" style="width:60%"
                            :value.sync="model.f_end_date"
                            v-model="model.f_end_date"
                            :format="'yyyy-MM-dd'"
                            condition="f_operate_date <= to_date('{} 23:59:59','yyyy-mm-dd hh24:mi:ss')"
                ></datepicker>
              </div>
              <div class="col-sm-4" >
                <label class="font_normal_body" >状态</label>
                <v-select :value.sync="model.f_state"
                          v-model="model.f_state"
                          style="width:60%"
                          :options='$parent.$parent.charge_state' placeholder='请选择'
                          condition="f_state = '{}'"
                          close-on-select></v-select>
              </div>
              <div class="span" style="float:right;">
                <button class="btn btn-success"  @click="search()" v-el:cba>查询</button>
              </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>
            </tr>
          </template>
          <template partial='body' partial='list' v-ref:grid>
            <tr >
              <td style="text-align:center">{{row.f_serial_id}}</td>
              <td style="text-align:center">{{row.f_pregas}}</td>
              <td style="text-align:center">{{row.f_preamount}}</td>
              <td style="text-align:center">{{row.f_times}}</td>
              <td style="text-align:center">{{row.f_state}}</td>
              <td style="text-align:center">{{row.f_operate_date}}</td>
              <td style="text-align:center">{{row.f_operator}}</td>
              <td style="text-align:center">{{row.f_filiale}}</td>
              <td style="text-align:center">{{row.f_outlets}}</td>
              <td style="text-align:center">{{row.op_spot}}</td>
              <td style="text-align:center">{{row.op_id}}</td>
            </tr>
          </template>
          <template partial='foot'></template>
        </data-grid>
      </criteria-paged>
      <table class="table-hover">
        <tr class="table-bordered">
          <td style="display: inline-block;width: auto;border-right: 1px solid #F2F6FA;padding: 0px 10px 0px 10px;color: #5CB95C;font-weight: bold">汇总信息</td>
          <td style="display: inline-block;width: auto;border-right: 1px solid #F2F6FA;padding: 0px 10px 0px 10px">气量合计:&emsp;{{sumsmodel.f_pregas}}</td>
          <td style="display: inline-block;width: auto;border-right: 1px solid #F2F6FA;padding: 0px 10px 0px 10px">金额合计:&emsp;{{sumsmodel.f_preamount}}</td>
        </tr>
      </table>
  </div>
</template>

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

  export default {
    title: '收费',
    data () {
      return {
        condition: '1=1',
        model: new PagedList('rs/sql/manage_singleTable', 15, {items: '`*`', tablename: '`t_sellinggas`', orderitem: '`f_operate_date DESC`'},{f_pregas: 0,f_preamount: 0}),
        charge_state: this.$appdata.getParam('收费状态') ? [{label: '全部', value: ''},...this.$appdata.getParam('收费状态')] : [],
        row: null,
        isdeal: true,
        show: false,
        sumsmodel: {}
      }
    },
    props:
      {
        searchdata: {},
        isdeal: {},
        args:{}
      },
    ready () {
      this.$refs.paged.$refs.criteria.model.f_state = ['有效']
      this.$refs.paged.$refs.criteria.search()
    },
    methods: {
      search(args){
      if(this.args && this.args.model) {
        if(this.searchdata.f_user_id) {
          this.condition = `${this.$refs.paged.$refs.criteria.condition} and f_user_id = '${this.searchdata.f_user_id}'`
        } else if(this.searchdata.f_card_id){
          this.condition = `${this.$refs.paged.$refs.criteria.condition} and f_card_id = '${this.searchdata.f_card_id}'`
        }else if(this.searchdata.f_userinfo_id) {
          this.condition = `${this.$refs.paged.$refs.criteria.condition} and f_userinfo_id = '${this.searchdata.f_userinfo_id}'`
        }else {
          return
        }
        this.model.search(this.condition, this.args.model)
        this.sumsmodel = this.$refs.paged.$refs.grid.model.sums
      }
    }
  },
    watch:{
      args(val){
        this.search()
      }
    }
  }
</script>

