<template>
  <div class="app-row" style="overflow: auto;padding-bottom: 1em">
  <partial-view v-ref:pv>
    <criteria-paged :model="model" v-ref:paged :pager="true" :simple="true">
      <accordion :one-at-atime="true" type="info" partial="list" >
        <div class="col-sm-12 col-xs-12 col-md-12 accorhead" style="margin-bottom:10px;">
          <div class="row " style="text-align:center">
            <strong class="col-sm-4 col-xs-4 col-md-4">
              <span>累购气量</span></br><span>({{model.count}}次)</span>
            </strong>
            <strong class="col-sm-4 col-xs-4 col-md-4">
              <span>累购金额</span></br><span>({{model.sums.money}}元)</span>
            </strong>
            <strong class="col-sm-4 col-xs-4 col-md-4">
              <span>累购气量:</span></br><span>{{model.sums.sellgas_gas}}m³</span>
            </strong>
            <!--<strong class="col-sm-2 col-xs-2 col-md-2">-->
              <!--<span >转移气量</span>{{model.sums.returngas}}</br></span>-->
            <!--</strong>-->
          </div>
        </div>
        <div class="col-sm-12 col-xs-12 col-md-12 accorhead" style="margin-bottom:10px;">
          <div class="row "  style="text-align:center">
            <strong class="col-sm-3 col-xs-3 col-md-3"><nobr>卡号</nobr></strong>
            <strong class="col-sm-3 col-xs-3 col-md-3"><nobr>购气时间</nobr></strong>
            <strong class="col-sm-3 col-xs-3 col-md-3"><nobr>气量</nobr></strong>
            <strong class="col-sm-3 col-xs-3 col-md-3"><nobr>金额</nobr></strong>
          </div>
        </div>
        <div type="info" v-for="row in model.rows" :is-open="true" :is-click="false" style="padding:20px;">
          <span class="panel-title" slot="header" @click="$parent.$parent.$parent.selected(row)"  style="cursor: pointer;">
              <div class="col-sm-12">
                <div class="row accorbody"  style="text-align:center">
                  <p class="col-sm-3 col-xs-3 col-md-3"><nobr>{{row.card_id}}</nobr></p>
                  <p class="col-sm-3 col-xs-3 col-md-3"><nobr>{{row.operate_time}}</nobr></p>
                  <p class="col-sm-3 col-xs-3 col-md-3"><nobr>{{row.sellgas_gas}}</nobr></p>
                  <p class="col-sm-3 col-xs-3 col-md-3"><nobr>{{row.money}}</nobr></p>
                  <!-- <span class="col-sm-3 col-xs-3 col-md-3"><nobr>{{row.weixiurenyuan}}</nobr></span> -->
                </div>
              </div>
          </span>
        </div>
      </accordion>
    </criteria-paged>
  </partial-view>
  </div>
</template>

<script>
  /**
   *用户档案相关信息组件
   */
  import * as Util from '../Util'
  import Vue from 'vue'
  import { PagedList } from 'vue-client'
  export default {
    title: '用户报修信息',
    data () {
      return {
        model: new PagedList(Vue.handdataUrl + 'NewSaleRest/rs/sql/singleTable_OrderBy', 10, {
          items: '"f_card_id  card_id, f_pregas  sellgas_gas, f_preamount  money, f_operate_date  operate_time"',
          tablename: '"t_sellinggas"',
          orderitem: '"operate_time desc"'
        }, {sellgas_gas: '',money:''}),
        show: false,
        row: Object
      }
    },
    props: {
      user:{
        type: Object
      }
    },
    methods: {
    },
    watch: {
      'user.f_card_id' (val) {
        this.model.search(`f_card_id = '${this.user.f_card_id}' and f_state = '有效'`)
      }
    },
    ready(){
      console.log('请求地址' + Vue.handdataUrl)
      if (this.user && this.user.f_card_id) {
        this.model.search(`f_card_id = '${this.user.f_card_id}' and f_state = '有效'`)
      }
    }
  }
</script>
