<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="form-inline" partial>
           <div class="col-sm-2">
            <label class="font_normal_body">开始日期</label>
            <datepicker id="f_start_date"
                        placeholder="开始日期"
                        style="width:60%"
                        v-model="model.f_start_date"
                        :value.sync="model.f_start_date"
                        condition="f_operate_date> '{} 00:00:00'"
                        :format="'yyyy-MM-dd'">
            </datepicker>
          </div>
           <div class="col-sm-2">
            <label class="font_normal_body">结束日期</label>
            <datepicker id="f_end_date"
                        placeholder="结束日期"
                        style="width:60%"
                        v-model="model.f_end_date"
                        :value.sync="model.f_end_date"
                        condition="f_operate_date < '{} 23:59:59'"
                        :format="'yyyy-MM-dd'">
            </datepicker>
          </div>
           <div class="col-sm-2">
             <label class="font_normal_body">客户编号</label>
            <input  type="text" class="form-control"  style="width:60%" v-model="model.f_userinfo_code" placeholder='客户编号'
                    condition="f_userinfo_code = '{}'" v-next-el='username'
                   >
          </div>
           <div class="col-sm-2">
             <label class="font_normal_body">客户姓名</label>
            <input  type="text" class="form-control"  style="width:60%" v-model="model.f_user_name" placeholder='客户姓名'
                    condition="f_user_name = '{}'" v-next-el='userid' v-el:username
                    >
          </div>
<!--           <div class="col-sm-2">-->
<!--            <input type="text" class="form-control" v-model="model.f_address" placeholder='地址'-->
<!--                   condition="f_address like '%{}%'" v-el:xq v-next-el='cx' v-el:resentialarea-->
<!--                   >-->
<!--          </div>-->
           <div class="col-sm-2">
            <button class="btn btn-success width-80" @click="$parent.$parent.search()" v-el:cx>查询</button>
          </div>
<!--           <div class="col-sm-2">-->
<!--            <export-excel :data="{condition: condition }"-->
<!--                          :total="[{-->
<!--            1: '合计', 2: null,3: null, 4: null,-->
<!--            5: null,6: null,7: $parent.$parent.model.sums.f_gas,-->
<!--            8:  $parent.$parent.model.sums.f_money,-->
<!--            9: $parent.$parent.model.sums.f_delaypay-->
<!--            }]" bean="流水导出" sqlurl="rs/logic/exportfile"></export-excel>-->
<!--          </div>-->
        </div>
      </criteria>
      <data-grid :model="model"  class="list_area table_sy"  partial='list'  v-ref:grid>
        <template partial='head'>
          <tr>
            <th rowspan="2">客户编号</th>
            <th rowspan="2">基本信息</th>
            <th rowspan="2">类型</th>
<!--            <th rowspan="2">期初余额</th>-->
<!--            <th rowspan="2">期初欠费</th>-->
            <th rowspan="2">上期底数</th>
            <th rowspan="2">本期底数</th>
            <th rowspan="2">应缴气量</th>
            <th rowspan="2">应缴金额</th>
            <th rowspan="2">实缴气量</th>
            <th rowspan="2">实缴金额</th>
<!--            <th rowspan="2">调价补差金额</th>-->
<!--            <th rowspan="2">实缴金额</th>-->
            <th rowspan="2">违约金</th>
<!--            <th rowspan="2">其他收费</th>-->
            <th rowspan="2">操作日期</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}}&nbsp;&nbsp;&nbsp;{{row.f_address}}</td>
          <td style="text-align: center;">{{row.f_type}}</td>
<!--          <td style="text-align: center;">{{row.f_balance.toFixed(2)}}</td>-->
<!--          <td style="text-align: center;">{{row.f_curbalance.toFixed(2)}}</td>-->
          <td style="text-align: center;">{{row.f_last_tablebase}}</td>
          <td style="text-align: center;">{{row.f_tablebase}}</td>
          <td style="text-align: center;">{{row.f_pregas.toFixed(2)}}</td>
          <td style="text-align: center;">{{row.f_preamount.toFixed(2)}}</td>
          <td style="text-align: center;">{{row.f_gas.toFixed(2)}}</td>
          <td style="text-align: center;">{{row.f_money.toFixed(2)}}</td>
<!--          <td style="text-align: center;">{{row.f_surplus_fee.toFixed(2)}}</td>-->
<!--          <td style="text-align: center;">{{row.f_collection.toFixed(2)}}</td>-->
          <td style="text-align: center;">{{row.f_delaypay.toFixed(2)}}</td>
<!--          <td style="text-align: center;">{{row.f_othercharge.toFixed(2)}}</td>-->
          <td style="text-align: center;">{{row.f_operate_date}}</td>
        </template>

        <template partial='foot'>
          <td style="text-align: center;">合计</td>
          <td style="text-align: center;"></td>
          <td style="text-align: center;"></td>
<!--          <td style="text-align: center;">{{model.sums.f_balance.toFixed(2)}}</td>-->
<!--          <td style="text-align: center;">{{model.sums.f_curbalance.toFixed(2)}}</td>-->
          <td style="text-align: center;"></td>
          <td style="text-align: center;"></td>
          <td style="text-align: center;">{{model.sums.f_pregas.toFixed(2)}}</td>
          <td style="text-align: center;">{{model.sums.f_preamount.toFixed(2)}}</td>
          <td style="text-align: center;">{{model.sums.f_gas.toFixed(2)}}</td>
          <td style="text-align: center;">{{model.sums.f_money.toFixed(2)}}</td>
<!--          <td style="text-align: center;">{{model.sums.f_surplus_fee.toFixed(2)}}</td>-->
<!--          <td style="text-align: center;">{{model.sums.f_collection.toFixed(2)}}</td>-->
          <td style="text-align: center;">{{model.sums.f_delaypay.toFixed(2)}}</td>
<!--          <td style="text-align: center;">{{model.sums.f_othercharge.toFixed(2)}}</td>-->
          <td style="text-align: center;"></td>
        </template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
  /**
   *流水查询
   */
  import { PagedList, HttpResetClass } from 'vue-client'
  import * as Util from '../../../Util'

  export default {
    title: '流水查询',
    data () {
      return {
        model: new PagedList('rs/sql/gaswater_search', 50, {}, { f_pregas: '', f_preamount: '', f_gas: '', f_money: '', f_delaypay: ''}),
        rows: null,
        filialeName: [],
        outletsname: [],
        filiale: '',
        filialetype: '',
        f_orgid: '',
        f_filialeid: ''
      }
    },
    props: {
      excelurl: {
        type: String
      },
      row: {}
    },
    ready () {
      this.$refs.paged.$refs.cri.model.f_start_date = this.$login.toStartAndEndDateString()[0]
      this.$refs.paged.$refs.cri.model.f_end_date = this.$login.toStandardDateString()
      this.getorg([this.$login.f.orgid])
      // this.getAllFiliale(this.filiale, '分公司')
      // this.search()
    },
    methods: {
      selfSearch (args) {
        console.log('selfsearch!!!!!!')
        this.getorg([this.$login.f.orgid])
        args.condition = `${args.condition} and f_orgid in ${this.f_orgid}`
        console.log('condition==>' + args.condition)
        this.model.search(args.condition, args.model)
      },
      cleanOutlet () {
        this.outletsname = []
      },
      getorg (val) {
        this.f_orgid = this.$login.convertToIn(val)
        this.f_filialeid = val[0]
        console.log('获取公司')
        console.log(this.f_orgid + '===' + this.f_filialeid)
      },
      search () {
        console.log('search查询！！！！！')
        // this.$refs.paged.$refs.cri.model.f_end_date +=` and f_orgid in '${this.f_orgid}`
        this.$refs.paged.$refs.cri.search()
      },
      clean () {
        this.$refs.paged.$refs.grid.select(null)
        this.$dispatch('clean')
      }
    },
    computed: {

    }
  }
</script>
<style media="screen">
  .divtext {
    min-width: 50px;
    max-width: 200px;
    border: 1px solid green;
    display: inline-block;
  }
</style>
