<template>
    <div style="height:100%">
      <data-grid :model="model" class="table_sy"   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' >
          <tr >
            <td style="text-align:center;white-space:nowrap;">{{$index+1}}</td>

            <td style="text-align:center;white-space:nowrap;">{{row.gas.toFixed(2)}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.fee}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_payment}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_balance}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_collection}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_curbalance}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.type}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_operate_date}}</td>
            <td style="text-align:center;white-space:nowrap;">{{row.f_operator}}</td>
            <td style="text-align:left;white-space:nowrap;">{{row.note}}{{row.f_write_card}}</td>
          </tr>
        </template>
      </data-grid>
      <modal :show.sync="cardCental" v-ref:modal backdrop="false">
        <header slot="modal-header" class="modal-header">
          <h4 class="modal-title">温馨提示</h4>
        </header>
        <article slot="modal-body" class="modal-body">
          <div class="form-group">
           <p> 当日此用户已经进行过一次购气,若卡上无气,请先进行补卡(未过表),之后掉气补气即可</p>
          </div>
        </article>
        <footer slot="modal-footer" class="modal-footer">
          <button  type="button" class="btn btn-success" @click='cancel()'>确认
          </button>
        </footer>
      </modal>
  </div>
</template>

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

  export default {
    title: '操作查询',
    data () {
      return {
        model: {rows: []},
        cardCental:false
      }
    },
    props: ['searchdata'],
    ready () {
      this.getsalerecord()
    },
    methods: {
      cancel(){
          this.cardCental = false;
      },
      async getsalerecord () {
        let http = new HttpResetClass()
        // this.condition = `1=1 and f_user_id = '${this.searchdata.f_user_id}'`
        this.condition = `1=1 and f_userfiles_id = '${this.searchdata.f_userfiles_id}'`
        let record = await http.load('POST', 'rs/sql/sale_RecordQuery?pageNo=1&pageSize=9999999', {data: {condition: this.condition}}, {
          rejectMsg: '流水查询出错！！',
          resolveMsg: null
        })
        this.model.rows = record.data
        if(this.model.rows.length>0 && ( this.model.rows[0].type== '发卡售气' ||  this.model.rows[0].type== '卡表收费' ) ){
          let checkdata = this.model.rows[0].operate_date.substr(0,10)
          let nowdate = new Date();
          let pdate = nowdate.getFullYear()+'-'+(nowdate.getMonth()<10? '0'+nowdate.getMonth()+1 : nowdate.getMonth()+1) +'-'+(nowdate.getDate()<10? '0'+nowdate.getDate() : nowdate.getDate());
          if(new Date(checkdata).getTime() == new Date(pdate).getTime()){
            this.cardCental = true;
          }
        }
      }
    },
    watch: {
      'searchdata' () {
        this.getsalerecord()
      }
    }
  }
</script>
