<template>
  <div class="basic-main" style="height: 98%">
    <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 class="font_normal_body">组织机构</label>
                <res-select :initresid='$parent.$parent.curorgid'
                            @res-select="$parent.$parent.getorg"
                            class="select select_list"
                            restype='organization'
                            style="width: 60%">
                </res-select>
              </div>
              <div class="col-sm-2  form-group">
                <label class="font_normal_body">付款方式</label>
                <v-select
                  v-model="model.payment"
                  placeholder='付款方式'
                  condition="f_payment = '{}'"
                  :value.sync="model.payment"
                  :options='$parent.$parent.payment'
                  close-on-select></v-select>
              </div>
              <div class="col-sm-2  form-group">
                <label class="font_normal_body">银行名称</label>
                <v-select
                  v-model="model.bankName"
                  placeholder='支付类型'
                  condition="f_bank_type = '{}'"
                  :value.sync="model.bankName"
                  :options='$parent.$parent.bankName'
                  close-on-select></v-select>
              </div>
              <div class="col-sm-2  form-group">
                <label for="startDate" class="font_normal_body">开始日期</label>
                <datepicker id="startDate" placeholder="开始日期"
                            v-model="model.startDate" style="width: 60%"
                            :value.sync="model.startDate"
                            :disabled-days-of-Week="[]"
                            :format="'yyyy-MM-dd'"
                            :show-reset-button="reset">
                </datepicker>
              </div>
              <div class="col-sm-2  form-group">
                <label for="endDate" class="font_normal_body">结束日期</label>
                <datepicker id="endDate" placeholder="结束日期"
                            v-model="model.endDate" style="width: 60%"
                            :value.sync="model.endDate"
                            :disabled-days-of-Week="[]"
                            :format="'yyyy-MM-dd'"
                            :show-reset-button="reset">
                </datepicker>
              </div>
              <div class="span" style="float:right;">
                <button class="button_search button_spacing width-60" @click="search()" v-el:cx>查询</button>
                <export-excel :data="$parent.$parent.getCondition"
                              :field="$parent.$parent.getfield"
                              :footer="$parent.$parent.footer"
                              :header="$parent.$parent.other"
                              sqlurl="rs/logic/wechatExport" sql-name="QrPaySummary"
                              template-name='聚合支付对账汇总查询导出' :choose-col="true"></export-excel>
                <div
                  :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                  @click="$parent.$parent.hidden()"
                  class="button_spacing"
                  style="float: right">
                </div>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid :model="model" partial='list' class="list_area table_sy" v-ref:grid>
          <template partial='head'>
            <tr>
              <th>序号</th>
              <th>分公司名称</th>
              <th>银行金额</th>
              <th>收费记录金额</th>
              <th>差额</th>
              <th style="white-space: nowrap;">交易日期</th>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center;">
              <nobr>{{$index+1}}</nobr>
            </td>
            <td style="text-align: center;">
              <nobr>{{row.f_orgname}}</nobr>
            </td>
            <td style="text-align: center;">
              <nobr>{{row.f_total_fee}}</nobr>
            </td>
            <td style="text-align: center;">
              <nobr>{{row.f_collection}}</nobr>
            </td>
            <td style="text-align: center;">
              <nobr>{{((row.f_total_fee-0) - (row.f_collection-0)).toFixed(2)}}</nobr>
            </td>
            <td style="text-align: center;">
              <nobr>{{row.f_time_end}}</nobr>
            </td>
          </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_total_fee}}
          </td>
          <td
            style="display: inline-block;width: auto;border-right: 1px solid #F2F6FA;padding: 0px 10px 0px 10px;font-weight: bold">
            收费金额汇总:&emsp;{{sumsmodel.f_collection}}
          </td>
          <td
            style="display: inline-block;width: auto;border-right: 1px solid #F2F6FA;padding: 0px 10px 0px 10px;font-weight: bold">
            差额汇总:&emsp;{{((sumsmodel.f_total_fee -0) - (sumsmodel.f_collection -0)).toFixed(2)}}
          </td>
        </tr>
      </table>
    </div>
  </div>
</template>
<script>
import {PagedList} from 'vue-client'

let readyGen = async function (self) {
  self.getfield = self.config.excelHeaders
  self.$refs.paged.$refs.cri.model.startDate = self.$login.toStandardDateString()
  self.$refs.paged.$refs.cri.model.endDate = self.$login.toStandardDateString()

  self.sumsmodel = self.$refs.paged.$refs.grid.model.sums
}

export default {
  title: '聚合支付对账',
  data () {
    return {
      model: new PagedList('rs/sql/QrPaySummary', 20,
        {}, {f_collection: '', f_total_fee: ''}),
      config: {
        // 导出列要和查询列相同
        excelHeaders: {
          'f_orgname': '分公司名称',
          'f_total_fee': '银行金额',
          'f_collection': '收费记录金额',
          'f_time_end': '交易日期'
        }
      },
      criteriaShow: false,
      getfield: {},
      condition2: '',
      depresid: [],
      userresid: [],
      f_orgid: this.$login.f.orgid,
      f_depid: this.$login.f.depids,
      f_operatorid: this.$login.f.id,
      operatorid: [],
      depid: [],
      orgname: '',

      other: [],
      footer: [],
      // 合计数据
      sumsmodel: {},
      msg: [],
      // 公司下拉
      curorgid: [this.$login.f.orgid]
    }
  },
  props: [],
  ready () {
    readyGen(this)
  },
  methods: {
    hidden () {
      this.criteriaShow = !this.criteriaShow
    },
    getRes (obj) {
      this.orgname = obj.res[0]
      this.depresid = obj.resids
      this.f_orgid = obj.resids
      console.log('-----------------obj', obj)
    },
    getdep (obj, val) {
      this.depname = val[0]
      this.userresid = obj
      this.f_depid = obj
    },
    getuser (obj, val) {
      this.operatorname = val[0]
      this.f_operatorid = obj
    },
    dealmsg (val) {
      val.model = this.model.model
      this.$dispatch('deal-msg', val)
    },
    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)
    },
    getorg (val) {
      this.f_orgid = this.$login.convertToIn(val)
      this.depresid = val
      this.f_filialeid = val[0]
      console.log('yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy', val)
    },
    search () {
      this.$refs.paged.$refs.cri.search()
    },
    selfSearch (args) {
      if (!this.f_orgid) {
        this.getorg([this.$login.f.orgid])
      }
      console.log('查询。。。', this.f_orgid)
      if (this.f_orgid) {
        args.condition = `${args.condition} and f_orgid  in ${this.f_orgid}`
        // this.model.params.orgid = this.f_orgid
      }
      this.model.params.startDate = this.$refs.paged.$refs.cri.model.startDate
      this.model.params.endDate = this.$refs.paged.$refs.cri.model.endDate
      this.sumsmodel = this.$refs.paged.$refs.grid.model.sums
      this.condition2 = args.condition
      this.model.search(args.condition, args.model)
    },
    modify (row) {
      console.log('返回数据1', row)
      this.$showMessage('确认重置微信支付状态么？', ['confirm', 'cancel']).then((res) => {
        if (res === 'confirm') {
          let data = {
            f_transaction_id: row.f_transaction_id
          }
          this.$resetpost('rs/logic/weChatMeter', data, {resolveMsg: null, rejectMsg: '重置出错!!!'}).then((res) => {
            console.log('返回数据3', res)
            this.$refs.paged.$refs.cri.search()
            this.$showAlert(`重置成功!`, 'success', 4000)
            // this.search()
          }).catch((error) => {
            console.log('重置异常', res)
          })
        }
      })
    }
  },
  computed: {
    getCondition () {
      return {
        startDate: this.$refs.paged.$refs.cri.model.startDate,
        endDate: this.$refs.paged.$refs.cri.model.endDate,
        condition: this.condition2
      }
    },
    bankName () {
      return [{label: '全部', value: ''}, ...this.$appdata.getParam('聚合支付银行名称')]
    },
    payment () {
      return [{label: '全部', value: ''}, ...this.$appdata.getParam('聚合支付付款方式')]
    }
  },
  watch: {
    sumsmodel: {
      handler: function (val) {
        this.getotherfooter()
      },
      deep: true
    }
  }
}
</script>
