<template>
  <div class="auto basic-main" style="height:95%">
    <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="form-group col-sm-2" >
              <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="form-group col-sm-2">
              <label class="font_normal_body">客户编号</label>
              <input  type="text" class="form-control" v-model="model.f_userinfo_code" style="width:60%"
                      condition="f_userinfo_code like '%{}%' " placeholder="客户编号"
              >
            </div>
            <div  class="form-group col-sm-2">
              <label class="font_normal_body">用户姓名</label>
              <input  type="text" class="form-control" v-model="model.f_user_name" style="width:60%"
                      condition="f_user_name = '{}'" placeholder="用户姓名"
              >
            </div>
            <div  class="form-group col-sm-2" >
              <label  class="font_normal_body">票据状态</label>
              <v-select id="f_bill_state"
                        style="width:60%"
                        v-model="model.f_bill_state"
                        placeholder='票据状态'
                        condition="f_bill_state ='{}'"
                        :value.sync="model.f_bill_state"
                        :options='$parent.$parent.eticktypes'
                        close-on-select clear-button>
              </v-select>
            </div>
            <div  class="form-group col-sm-2">
              <label class="font_normal_body">开票人</label>
              <input  type="text" class="form-control" v-model="model.f_operator" style="width:60%"
                      condition="f_operator = '{}'" placeholder="开票人"
              >
            </div>

            <div style="float: right" class="span" >
              <button class="button_search"  @click="search()">查 询</button>
              <button class="button_search"  @click="$parent.$parent.clear()">清空</button>
              <export-excel
                :data="{condition: $parent.$parent.model.condition}"
                :field="$parent.$parent.getfield"
                sqlurl="rs/logic/saleExport"sql-name="eticketRecordList"
                template-name='电子票管理'
                :choose-col="true">
              </export-excel>
              <button class="button_search" v-if="jurisdiction.includes('自定义发票')" @click="$parent.$parent.addCust()">自定义开票</button>
              <div
                :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                @click="$parent.$parent.criteriaShow=!$parent.$parent.criteriaShow"
                class="button_spacing"
                style="float: right"></div>
            </div>
          </div>
          <div class="row" v-show="$parent.$parent.criteriaShow" >
            <div  class="form-group col-sm-2">
              <label class="font_normal_body">发票号码</label>
              <input  type="text" class="form-control" v-model="model.f_bill_number" style="width:60%"
                      condition="f_bill_number = '{}'" placeholder="发票号码"
              >
            </div>

            <div  class="form-group col-sm-2" >
              <label class="font_normal_body">业务类型</label>
              <v-select id="f_charge_type"
                        style="width:60%"
                        v-model="model.f_charge_type"
                        placeholder='业务类型'
                        condition="f_charge_type ='{}'"
                        :value.sync="model.f_charge_type"
                        :options='$parent.$parent.chargetypes'
                        close-on-select clear-button>
              </v-select>
            </div>
            <div class="form-group col-sm-2">
              <label for="startDate" class="font_normal_body">开票日期 ≥ </label>
              <datepicker id="startDate" placeholder="开票日期"
                          v-model="model.startDate"
                          :value.sync="model.startDate"
                          :format="'yyyy-MM-dd HH:mm:ss'"
                          condition="f_kprq >='{}'"
                          style="width:60%"
              >
              </datepicker>
            </div>
            <div class="form-group col-sm-2">
              <label  for="endDate"  class="font_normal_body">开票日期 ≤ </label>
              <datepicker id="endDate" placeholder="开票日期"
                          v-model="model.endDate"
                          :value.sync="model.endDate"
                          :format="'yyyy-MM-dd HH:mm:ss'"
                          condition="f_kprq <='{}'"
                          style="width:60%"
              >
              </datepicker>
            </div>

            <div  class="form-group col-sm-2" >
              <label class="font_normal_body">用户类型</label>
              <v-select id="f_charge_type"
                        style="width:60%"
                        v-model="model.f_user_type"
                        placeholder='用户类型'
                        condition="f_user_type ='{}'"
                        :value.sync="model.f_user_type"
                        :options='$parent.$parent.userTypes'
                        close-on-select clear-button>
              </v-select>
            </div>
            <div  class="form-group col-sm-2" >
              <label class="font_normal_body">发票类型</label>
              <v-select id="f_charge_type"
                        style="width:60%"
                        v-model="model.f_invoice_category"
                        placeholder='发票类型'
                        condition="f_invoice_category ='{}'"
                        :value.sync="model.f_invoice_category"
                        :options='$parent.$parent.invoiceTypes'
                        close-on-select clear-button>
              </v-select>
            </div>
            <div  class="form-group col-sm-2">
              <label class="font_normal_body">气价名称</label>
              <input  type="text" class="form-control" v-model="model.f_price_name" style="width:60%"
                      condition="f_price_name like '%{}%'" placeholder="气价名称"
              >
            </div>

            <div class="form-group col-sm-2">
              <label for="startDate" class="font_normal_body">收费日期 ≥ </label>
              <datepicker id="startDate" placeholder="收费日期"
                          v-model="model.startDate2"
                          :value.sync="model.startDate2"
                          :format="'yyyy-MM-dd HH:mm:ss'"
                          condition="f_operate_date >='{}'"
                          style="width:60%"
              >
              </datepicker>
            </div>
            <div class="form-group col-sm-2">
              <label for="startDate" class="font_normal_body">收费日期 ≤ </label>
              <datepicker id="startDate" placeholder="收费日期"
                          v-model="model.endDate2"
                          :value.sync="model.endDate2"
                          :format="'yyyy-MM-dd HH:mm:ss'"
                          condition="f_operate_date <='{}'"
                          style="width:60%"
              >
              </datepicker>
            </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>
            <th>查看发票</th>
            <th>操作</th>
          </tr>
        </template>
        <template partial='body'  >
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{$index+1}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_userinfo_code}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_user_name}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_user_type}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_address}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_pregas}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_tax_money.toFixed(2)}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_total_money}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_price_name}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_charge_type}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_operate_date}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_operator}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_invoice_category}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_tax_logotype}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_bill_state}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_sign_result}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_bill_number}}</td>
          <td style="text-align:center" :style="row.f_bill_state === '冲红' ? 'color: #CC0000' : 'color: #000'">{{row.f_kprq}}</td>
          <td style="text-align:center">
            <!--<button class="btn btn-link" v-if="row.f_bill_url" @click="$parent.$parent.$parent.watchUrl(row)" >查看发票</button>-->
            <a class="btn btn-link" v-if="row.f_bill_url" :href="row.f_bill_url" target="_blank">查看发票</a>
          </td>
          <td style="text-align:center" >
            <!--             <button class="btn btn-link" v-if="row.f_bill_state=='有效'&&$parent.$parent.$parent.smsMessaage.includes('发票冲红')" @click="$parent.$parent.$parent.fpch(row)" >冲红</button>-->
            <button class="btn btn-link" v-if="row.f_bill_state==='开票成功' || row.f_issue_status==='已开具'" @click="$parent.$parent.$parent.fpch(row)" >冲红</button>
          </td>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
    <table class="table-hover" v-show="false">
      <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_pregas}}
        </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_tax_money.toFixed(2)}}
        </td>
      </tr>
    </table>
  </div>
  <modal :show.sync="serachshow"  v-ref:modal large backdrop="false" >
    <header slot="modal-header" class="modal-header">
      <button type="button" class="close" @click="cancelsearch"><span>&times;</span></button>
      <h3 class="modal-title">查看发票</h3>
    </header>
    <article slot="modal-body" class="modal-body">
      <iframe :src="f_sign_url" v-if="f_sign_url" width="100%" height="500px">
      </iframe>
    </article>
    <footer slot="modal-footer" class="modal-footer">
      <button type="button" class="btn btn-default" @click='cancelsearch()'>取消</button>
    </footer>
  </modal>
  <ticket-print :show="eticket_show" @toggle="eticket_toggle" v-ref:eticketbill></ticket-print>
  <!--<eticket-print-async  :show="eticket_show" @toggle="eticket_toggle"  v-ref:asynceticket></eticket-print-async>-->
</template>

<script>
  /**
   *发票冲红管理
   */
  import {PagedList} from 'vue-client'
  import Vue from 'vue'
  export default {
    title: '电子票管理',
    data () {
      return {
        criteriaShow: false,
        model: new PagedList('rs/sql/eticketRecordList', 50, {}, {f_pregas: 0, f_tax_money: 0}),
        jurisdiction: this.$login.r,
        sumsmodel: {},
        show: false,
        curorgid: [this.$login.f.orgid],
        f_orgid: '',
        f_sign_url: '',
        serachshow: false,
        eticket_show: false,
        getfield: {
          'f_userinfo_code': '户编号',
          'f_user_name': '用户姓名',
          'f_address': '用户地址',
          'f_pregas': '气量',
          'f_tax_money': '税后金额',
          'f_total_money': '合计金额',
          'f_charge_type': '收费类型',
          'f_operate_date': '收费时间',
          'f_bill_number': '发票号码',
          'f_tax_logotype': '是否征税',
          'f_bill_state': '票据状态',
          'f_kprq': '开票时间'
        },
        userTypes: [{label: '全部', value: ''}, {label: '民用', value: '民用'}, {label: '非民用', value: '非民用'}],
        invoiceTypes: [{label: '全部', value: ''}, {label: '数电普票', value: '数电普票'}, {label: '数电专票', value: '数电专票'}]
      }
    },
    ready () {
      console.log('this.$login.f', this.$login.f, Vue.$login, this.jurisdiction.includes('发票冲红'))
      this.$refs.paged.$refs.cri.model.startDate = this.$login.toStandardDateString() + ' 00:00:00'
      this.$refs.paged.$refs.cri.model.endDate = this.$login.toStandardDateString() + ' 23:59:59'
      this.search()
    },
    methods: {
      eticket_toggle () {
        this.eticket_show = false
        this.$refs.paged.$refs.cri.search()
      },
      addCust () {
        this.$dispatch('addCust')
      },
      watchUrl (row) {
        this.f_sign_url = row.f_bill_url
        this.serachshow = true
      },
      cancelsearch () {
        this.serachshow = false
      },
      clear () {
        Object.keys(this.$refs.paged.$refs.cri.model).forEach((key) => {
          this.$refs.paged.$refs.cri.model[key] = []
        })
      },
      async fpch (row) {
        this.$showMessage('是否冲红该发票！', ['confirm', 'cancel']).then(res => {
          if (res === 'confirm') {
            this.eticket_show = true
            console.log('发票冲红')
            this.$refs.eticketbill.rushRedInvoice(row.f_eticket_id.toString())
          }
        })
      },
      getorg (val) {
        this.f_orgid = this.$login.convertToIn(val)
        this.$parent.f_orgid = this.f_orgid
      },
      async selfSearch (args) {
        if (!this.f_orgid) {
          this.getorg([this.$login.f.orgid])
        }
        if (this.f_orgid) {
          args.condition = `f_orgid in ${this.f_orgid} and ${args.condition}`
        }
        await this.model.search(args.condition, this.model)
        this.sumsmodel = this.model.sums
        console.log('res', this.model)
      },
      search () {
        this.$refs.paged.$refs.cri.search()
      }
    },
    computed: {
      eticktypes () {
        return [{label: '全部', value: ''}, ...this.$appdata.getParam('票据状态')]
      },
      chargetypes () {
        return [{label: '全部', value: ''}, ...this.$appdata.getParam('收费类型')]
      }
    }
  }
</script>
