<template>
  <div id="unit" class="flex-row">
    <div class="basic-main" @keyup.enter="search">
      <div class="flex">
        <criteria-paged :model="model" v-ref:paged>
          <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri>
            <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
              <div class="row">
                <div class="col-sm-2 form-group">
                  <label for="startDate" class="font_normal_body">开始日期</label>
                  <datepicker id="startDate" placeholder="开始日期" style="width:60%"
                              v-model="model.startDate"
                              :value.sync="model.startDate"
                              :format="'yyyy-MM-dd HH:mm:ss'"
                              :show-reset-button="true"
                              condition="f_operate_date >= '{}'">
                  </datepicker>
                </div>
                <div class="col-sm-2 form-group">
                  <label for="endDate" class="font_normal_body">结束日期</label>
                  <datepicker id="endDate" placeholder="结束日期" style="width:60%"
                              v-model="model.endDate"
                              :value.sync="model.endDate"
                              :format="'yyyy-MM-dd HH:mm:ss'"
                              :show-reset-button="true"
                              condition="f_operate_date <= '{}'">
                  </datepicker>
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">发票编号</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_bill_number"
                         condition="f_bill_number = '{}' " placeholder="发票编号">
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">用户编号</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_userinfo_code"
                         condition="f_userinfo_code = '{}' " placeholder="用户编号">
                </div>
                <div class="span" style="float:right;">
                  <button class="button_search button_spacing" @click="search()">查询</button>
                  <button class="button_clear  button_spacing" @click="$parent.$parent.clear()">清空</button>
                  <export-excel :data="$parent.$parent.getCondition" :footer="$parent.$parent.footer"
                                :field="$parent.$parent.getfield" :header="$parent.$parent.other"
                                sqlurl="api/af-revenue/logic/openapi/exportfile" sql-name="manage_billQuery"
                                template-name='发票查询导出'
                                :choose-col="true">
                  </export-excel>
                  <div style="float: right" class="button_spacing"
                       :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                       @click="$parent.$parent.hidden()"></div>

                </div>
              </div>
              <div class="row" v-show="$parent.$parent.criteriaShow">
                <res-select-group :show-component="$parent.$parent.resshow" :initres="$parent.$parent.initres"
                                  :cascade=true @re-res="$parent.$parent.getRes" v-ref:sel></res-select-group>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">业务类型</label>
                  <v-select :value.sync="model.f_type"
                            v-model="model.f_type"
                            style="width: 60%"
                            condition="f_bill_type = ‘{}’"
                            :options='$parent.$parent.billType' placeholder='业务类型'
                            close-on-select>

                  </v-select>
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">发票类型</label>
                  <v-select :value.sync="model.f_bill_style"
                            :options='$parent.$parent.billStyle' placeholder='发票类型' v-model="model.f_bill_style"
                            condition="f_bill_style = '{}'"
                            close-on-select>
                  </v-select>
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">使&nbsp;&nbsp;用&nbsp;人</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_bill_operator"
                         condition="f_operator = '{}'" placeholder="使用人">
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body">&nbsp;&nbsp;&nbsp;&nbsp;表号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_meternumber"
                         condition="f_meternumber = '{}'" placeholder="表号">
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body" title="发票起始编号">发票编号</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_bill_number_start"
                         condition="f_bill_number >= '{}'" placeholder="发票起始编号">
                </div>
                <div class="col-sm-2 form-group">
                  <label class="font_normal_body" title="发票终止编号">发票编号</label>
                  <input type="text" style="width:60%" class="input_search" v-model="model.f_bill_number_end"
                         condition="f_bill_number <= '{}'" placeholder="发票终止编号">
                </div>
              </div>
            </div>
          </criteria>

          <data-grid :model="model" partial='list' class="list_area table_sy" style="height: 95%" v-ref:grid>
            <template partial='head'>
              <tr>
                <th>序号</th>
                <th>发票编号</th>
                <th>用户编号</th>
                <th>表号</th>
                <th>用户姓名</th>
                <th>购气量</th>
                <th>实收金额</th>
                <th>业务类型</th>
                <th>收据类型</th>
                <th>打印类型</th>
                <th>收据状态</th>
                <th>使用人</th>
              </tr>
            </template>
            <template partial='body'>
              <tr>
                <td style="text-align:center">{{$index+1}}</td>
                <td style="text-align:center">{{row.f_bill_number}}</td>
                <td style="text-align:center">{{row.f_userinfo_code}}</td>
                <td style="text-align:center">{{row.f_meternumber}}</td>
                <td style="text-align:center">{{row.f_user_name}}</td>
                <td style="text-align:center">{{row.f_gas}}</td>
                <td style="text-align:center">{{row.f_paid_money}}</td>
                <td style="text-align:center">{{row.f_type}}</td>
                <td style="text-align:center">{{row.f_bill_type}}</td>
                <td style="text-align:center">{{row.f_bill_style}}</td>
                <td style="text-align:center">{{row.f_bill_state}}</td>
                <td style="text-align:center">{{row.f_operator}}</td>
              </tr>
            </template>
            <template partial='foot'></template>
          </data-grid>
        </criteria-paged>
        <table class="table-hover">
          <tr style="position: relative" 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;font-weight: bold">
              收款合计:&emsp;{{sumsmodel.f_paid_money}}
            </td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</template>

<script>
import {PagedList} from 'vue-client'
import exportConfig from './config/exportConfig'

export default {
  props: ['data'],
  title: '发票详情查询',
  data () {
    return {
      model: new PagedList('api/af-revenue/sql/manage_billQuery', 20,{},{f_paid_money: 0}),
      other: [],
      orgCondtionStr: '',
      resshow: ['company'],
      initres: {
        org: [this.$login.f.orgid]
      },
      criteriaShow: false,
      condition: '',
      sumsmodel: {},
      footer: []
    }
  },
  ready () {
    this.$refs.paged.$refs.cri.model.startDate = this.data ? this.data.startDate : this.$login.toStandardDateString() + ' 00:00:00'
    this.$refs.paged.$refs.cri.model.endDate = this.data ? this.data.endDate : this.$login.toStandardDateString() + + ' 23:59:59'
    this.sumsmodel = this.$refs.paged.$refs.grid.model.sums;
  },
  methods: {
    getotherfooter () {
      // this.$refs.paged.$refs.cri.$refs.exports.otherData = [];
      // this.$refs.paged.$refs.cri.$refs.exports.footerData = [];
      this.other = []
      this.footer = [];
      let exportdata = this.getCondition
      let otherInData = []
      otherInData.push(`导出时间: ${this.$login.toStandardTimeString()}`)
      let footerData = [],exportfield = this.getfield
      footerData.push("合计");
      let self = this;
      for (var field in self.sumsmodel) {
        footerData.push(`${exportfield[field]}合计:${self.sumsmodel[field]}`);
      }
      this.footer.push(footerData);
      this.other.push(otherInData)
    },

    cancel () {
      this.show = false
    },
    search () {
      this.$refs.paged.$refs.cri.search()
    },
    selfSearch (args) {
      if (this.orgCondtionStr) {
        args.condition = `${args.condition} ` + this.orgCondtionStr
      } else {
        args.condition = `${args.condition} ` + " and f_orgid = " + this.$login.f.orgid
      }
      this.condition = args.condition
      this.model.search(args.condition, args.model)
      this.sumsmodel = this.$refs.paged.$refs.grid.model.sums
      console.log('合计字段', this.sumsmodel)
    },
    clear () {
      Object.keys(this.$refs.paged.$refs.cri.model).forEach((key) => {
        this.$refs.paged.$refs.cri.model[key] = []
      })
    },
    show () {
      this.criteriaShow = true
    },
    hidden () {
      this.criteriaShow = !this.criteriaShow
    },
    async getRes (condition, obj) {
      this.orgCondtionStr = condition
      this.orgname = obj.orgnames[0]
    },
  },
  events: {},
  watch: {},
  computed: {
    getfield () {
      return exportConfig.invoiceDetailsConfig
    },
    getCondition () {
      return {
        condition: this.condition
      }
    },
    billType () {
      return [{label: ' 全部 ', value: ''}, ...this.$appdata.getParam('发票业务类型')]
    },
    billStyle () {
      return [{label: ' 全部 ', value: ''}, ...this.$appdata.getParam('发票类型')]
    },


  }
}
</script>

