<template>
  <div class="basic-main" style="height: 98%">
    <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">

<!--            <res-select-group :initres="$parent.$parent.initres" :show-component="['company']" @re-res="$parent.$parent.getRes" v-ref:sel></res-select-group>-->

              <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"
                          condition="f_delivery_date  >= '{} 00:00:00'"
                          :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"
                          condition="f_delivery_date <= '{} 23:59:59'"
                          :disabled-days-of-Week="[]"
                          :format="'yyyy-MM-dd'"
                          :show-reset-button="reset">
              </datepicker>
            </div>
            <div class="col-sm-2  form-group" >
              <label class="font_normal_body">客户编号</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_userinfo_code" placeholder='客户编号'
                     condition="f_userinfo_code = '{}'">
            </div>
            <div class="col-sm-2  form-group">
              <label  class="font_normal_body" title="订单状态">订单状态</label>
              <v-select
                v-model="model.msg"
                placeholder='订单状态'
                condition="f_states like '%{}%'"
                :value.sync="model.msg"
                :options='$parent.$parent.letter'
                close-on-select ></v-select>
            </div>

            <div class="span" style="float:right;">
              <button class="button_search button_spacing width-60" @click="search()" v-el:cx>查询</button>
              <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 class="row" v-show="$parent.$parent.criteriaShow">
            <div class="col-sm-2  form-group">
              <label  class="font_normal_body" title="操作标识">操作标识</label>
              <v-select
                v-model="model.pay_state"
                placeholder='操作标识'
                condition="pay_state like '%{}%'"
                :value.sync="model.pay_state"
                :options='$parent.$parent.paystate'
                close-on-select ></v-select>
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body">终端编号</label>
              <input type="text" class="input_search" style="width:60%"  v-model="model.f_terminal_num" placeholder='终端编号'
                     condition="f_terminal_num like '%{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body">客户名称</label>
              <input type="text" class="input_search" style="width:60%"  v-model="model.f_user_name" placeholder='客户名称'
                     condition="f_user_name = '{}'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body">&nbsp;&nbsp;&nbsp;电话&nbsp;&nbsp;&nbsp;</label>
              <input type="text" class="input_search" style="width:60%"  v-model="model.f_user_phone" placeholder='电话'
                     condition="f_user_phone like '{}%'">
            </div>
            <div class="form-group col-sm-2">
              <label class="font_normal_body">客户地址</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_address" placeholder='客户地址'
                     condition="f_address like '%{}%'">
            </div>
            <!--<div class="col-sm-2  form-group">-->
            <!--<label  class="font_normal_body">订单状态</label>-->
            <!--<v-select-->
            <!--v-model="model.msg"-->
            <!--placeholder='订单状态'-->
            <!--condition="f_states like '%{}%'"-->
            <!--:value.sync="model.msg"-->
            <!--:options='$parent.$parent.letter'-->
            <!--close-on-select ></v-select>-->
            <!--</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>终端编号</th>
            <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'>
          <td style="text-align: center;"><nobr>{{$index+1}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_userinfo_code}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_user_name}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_user_phone}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_address}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_terminal_num}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_transaction_id}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_total_fee}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_time_out}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_states}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_payment}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_pregas}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_collection}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_delivery_date}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_charge_state}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_write_card}}</nobr></td>
          <td style="text-align: center;"><nobr>{{row.f_operator}}</nobr></td>
          <td v-if="row.pay_state==='对账成功'" style="text-align: center;">
            <div v-if="!$parent.$parent.$parent.authArr.includes('无卡退费')">正常</div>
            <div v-else>
              <button type="button" name="button"  class="btn btn-link" @click="$parent.$parent.$parent.chargecal(row)">无卡退款</button>
            </div>
          </td>
          <td v-if="row.pay_state==='无效'" style="text-align: center;">
            无效
          </td>
          <td v-if="row.pay_state==='燃气单方面账单'" style="text-align: center;">
            <button type="button" name="button"  class="btn btn-link" @click="$parent.$parent.$parent.chargecal(row)">冲正</button>
          </td>
          <td v-if="row.pay_state==='自助机单方面账单'" style="text-align: center;">
            <button type="button" name="button"  class="btn btn-link" @click="$parent.$parent.$parent.updateState(row)">退款</button>
            <button type="button" name="button"  class="btn btn-link" @click="$parent.$parent.$parent.charge(row)">缴费</button>
          </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>
      </tr>
    </table>
  </div>
  <modal v-if="show" :show.sync="show" >
    <header slot="modal-header" class="modal-header">
      <h4 class="modal-title">退费</h4>
    </header>
    <article slot="modal-body" class="modal-body">
      <validator name='v'>
        <form class="form-horizontal select-overspread">
          <div class="form-group">
            <label class=" col-sm-3 control-label">退费原因:</label>
            <div class="col-sm-8">
              <textarea class="form-control" v-model="watchComment" placeholder="退费原因" ></textarea>
            </div>
          </div>
        </form>
      </validator>
    </article>
    <footer slot="modal-footer" class="modal-footer">
      <button type="button" class="btn btn-success" @click='confirm()'>确认</button>
      <button type="button" class="btn btn-default" @click='close'>取消</button>
    </footer>
  </modal>
</template>
<script>
  import { PagedList } from 'vue-client'
  import Vue from 'vue'

  let readyGen = async function (self) {
    // 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/wechatSelling', 20, {}, {f_total_fee: '', f_collection: ''}),
        letter: this.$appdata.getParam('订单状态') ? [{label: '全部', value: ''}, ...this.$appdata.getParam('订单状态')] : [],
        paystate: this.$appdata.getParam('操作标识') ? [{label: '全部', value: ''}, ...this.$appdata.getParam('操作标识')] : [],
        criteriaShow: false,
        show: false,
        watchComment: '',
        orgCondtionStr: '',
        getfield: {},
        // 合计数据
        sumsmodel: {},
        initres: {
          org: [this.$login.f.orgid]
        },
        msgData: []
      }
    },
    props: [],
    ready () {
      readyGen(this)
    },
    methods: {
      async chargecal (row) {
        let param = {
          f_sell_id: row.f_sell_id,
          f_cancel_reason: '',
          f_orgid: Vue.$login.f.orgid,
          f_orgname: Vue.$login.f.orgs,
          f_depid: Vue.$login.f.depids,
          f_depname: Vue.$login.f.deps,
          f_zoneid: Vue.$login.f.zoneid,
          f_zones: Vue.$login.f.zones
        }
        await Vue.resetpost('rs/logic/commonCancel', {data: param}, {resolveMsg: '撤销成功', rejectMsg: '撤销失败'})
        this.$refs.paged.$refs.cri.search()
      },
      async getRes(condition,obj) {
        this.orgCondtionStr = condition
      },
      // 微信单方账单，系统可缴费
      async charge (row) {
          row.f_operator=Vue.$login.f.name,
          row.f_operatorid= Vue.$login.f.id,
          row.f_orgid= Vue.$login.f.orgid,
          row.f_orgname= Vue.$login.f.orgs,
          row.f_depid= Vue.$login.f.depids,
          row. f_depname= Vue.$login.f.deps,
          row. f_zoneid= Vue.$login.f.zoneid,
          row. f_zones= Vue.$login.f.zones
        let res = await this.$resetpost('rs/logic/cardOneBank',row,{resolveMsg:'缴费成功',rejectMsg:'缴费失败'})
        let param = []
        for (let row of this.resid) {
          param.push({id: row.id})
        }
        let data = {
          param: param,
          f_blobid: res.data
        }

        await this.$resetpost('rs/logic/updatefiles', data)
        this.$refs.paged.$refs.cri.search()
      },
      hidden () {
        this.criteriaShow = !this.criteriaShow
      },
      updateState (val) {
        this.show = true
        this.msgData = val
      },
      async confirm () {
        this.msgData.f_operator = this.$login.f.name
        let updateWechatData = {
          watchComment: this.watchComment,
          msgData: this.msgData
        }
        await Vue.resetpost('rs/logic/updateWechatState', {data: updateWechatData}, {resolveMsg: '退款请求已发送成功,稍后到账！', rejectMsg: '退款失败'})
        this.close()
        this.search()
      },
      close () {
        this.show = false
        this.watchComment = ''
        this.msgData = []
      },
      search () {
        this.$refs.paged.$refs.cri.search()
      },
      // 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)
      // },
      selfSearch (args) {
        this.model.params.startDate = this.$refs.paged.$refs.cri.model.startDate
        this.model.params.endDate = this.$refs.paged.$refs.cri.model.endDate
        // if (!this.orgCondtionStr) {
        //   args.condition = `${args.condition}` + ' and f_orgid = ' + this.$login.f.orgid
        // } else {
        //   args.condition = `${args.condition}` + this.orgCondtionStr
        // }
        args.condition = `${args.condition}` + `and f_orgid = '${this.$login.f.orgid}'`
        this.model.search(args.condition, args.model)
      }

    },
    events: {

    },
    computed: {
      authArr () {
        return this.$login.r ? this.$login.r : []
      }
    }
    // watch: {
    //   sumsmodel: {
    //     handler: function (val) {
    //       this.getotherfooter()
    //     },
    //     deep: true
    //   }
    // }
  }
</script>
