<template>
  <div class="flex-row">
    <div class="basic-main">
      <criteria-paged :model="model" v-ref:paged @sort="sort">
        <criteria partial='criteria' class="search_area" @condition-changed='$parent.selfSearch' v-ref:criteria>
          <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row">
              <div class="form-group col-sm-2"  >
                <label class="font_normal_body">客户名称</label>
                <input type="text" class="input_search" v-model="model.f_user_name"
                       style="width: 60%" placeholder="客户名称" condition="tcp.f_user_name like '%{}%'">
              </div>
              <div class="form-group col-sm-2">
                <label class="font_normal_body" >区&emsp;&emsp;域</label>
                <v-select :value.sync="model.f_user_region" :value-single="true" v-model="model.f_user_region"
                          :options='$parent.$parent.user_regions' placeholder='区域' class="select_list select" style="width: 60%"
                          @change="$parent.$parent.quyuChange"
                          condition="f_user_region = '{}'"
                          close-on-select>
                </v-select>
              </div>
              <div class="form-group col-sm-2">
                <label class="font_normal_body" >营&ensp;业&ensp;厅</label>
                <v-select :value.sync="model.f_user_business_hall" :value-single="true" v-model="model.f_user_business_hall"
                          :options='$parent.$parent.bumens' placeholder='营业厅'
                          class="select_list select" style="width: 60%"
                          condition="f_user_business_hall = '{}'"
                          close-on-select>
                </v-select>
              </div>
              <div class="form-group col-sm-2" style="width: auto;margin-top:8px;float: right">
                <export-excel-safe :data="$parent.$parent.searchData"
                                   :field="$parent.$parent.excelHeaders"
                                   :choose-col="true"
                                   sqlurl="rs/logic/SafeExportExcel"
                                   sql-name="detailhistorynian"
                                   template-name='用户安检年气量'></export-excel-safe>
                <button class="button_spacing button_search" @click="search()">查询</button>
                <button class="button_spacing button_search" @click="model = {}">清空</button>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid class="list_area table_sy" style="overflow: hidden" :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>十一月实供</nobr>
              </th>
              <th>
                <nobr>十二月实供</nobr>
              </th>
              <th>
                <nobr>年用气量</nobr>
              </th>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center">{{(($parent.$parent.$parent.model.pageIndex-1) * $parent.$parent.$parent.model.pageSize)  + $index + 1}}</td>
            <td style="text-align: center">{{row.f_user_name}}</td>
            <td style="text-align: center">{{row.yi}}</td>
            <td style="text-align: center">{{row.er}}</td>
            <td style="text-align: center">{{row.san}}</td>
            <td style="text-align: center">{{row.si}}</td>
            <td style="text-align: center">{{row.wu}}</td>
            <td style="text-align: center">{{row.liu}}</td>
            <td style="text-align: center">{{row.qi}}</td>
            <td style="text-align: center">{{row.ba}}</td>
            <td style="text-align: center">{{row.jiu}}</td>
            <td style="text-align: center">{{row.shi}}</td>
            <td style="text-align: center">{{row.shi1}}</td>
            <td style="text-align: center">{{row.shi2}}</td>
            <td style="text-align: center">{{row.nian}}</td>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
  </div>
</template>

<script>
  import {PagedList} from 'vue-client'
  import Vue from 'vue'
  import co from 'co'
  import HttpResetClass from "vue-client/src/plugins/HttpResetClass";


export default {
  title: '用户年气量历史记录',
  data() {
    let model = new PagedList('rs/sql/detailhistorynian', 20, {})
    return {
      model: model,
      searchData: {
        condition: "1=1",
      },
      user_regions: [{label: '请选择', value: ''}, ...this.$appdata.getParam('区域')],
      bumens: [{label: '请选择', value: ''}],
      excelHeaders: {
        'f_user_name': '客户姓名',
        'yi': '一月实供',
        'er': '二月实供',
        'san': '三月实供',
        'si': '四月实供',
        'wu': '五月实供',
        'liu': '六月实供',
        'qi': '七月实供',
        'ba': '八月实供',
        'jiu': '九月实供',
        'shi': '十月实供',
        'shi1': '十一月实供',
        'shi2': '十二月实供',
        'nian': '年用气量'
        }
      }
    },
    methods: {
      quyuChange(val) {
        if (val) {
          this.bumens = this.$appdata.getParam(val) ? [{
            label: '请选择',
            value: ''
          }, ...this.$appdata.getParam(val)] : [{ label: '请选择', value: '' }]
        }
      },
      search() {
        this.$refs.paged.$refs.criteria.search()
      },
      selfSearch(args) {
        this.searchData.condition = args.condition
        this.model.search(args.condition, args.model, args.condValue)
      },

    },

    ready() {
    },
    watch: {
    }

  }
</script>
