<template>
  <div class="binary">
    <div class="basic-main">
      <div class="flex" style="flex: 1;">
        <div style="flex: 1.2">
          <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"
                   style="background-color: white"
                   partial>
                <div class="row">
                  <div class="col-sm-2 form-group">
                    <label for="startDate" class="font_normal_body">开始日期</label>
                    <datepicker id="startDate" placeholder="开始日期" width='100%'
                                v-model="model.startDate"
                                :value.sync="model.startDate"
                                :format="'yyyy-MM-dd'"
                                class="datepicker"
                                style="width:60%"
                                :show-reset-button="true"
                                condition="f_account_end_date >= '{} 00:00:00'">
                    </datepicker>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label for="endDate" class="font_normal_body">结束日期</label>
                    <datepicker id="endDate" placeholder="结束日期" width='100%'
                                v-model="model.endDate"
                                :value.sync="model.endDate"
                                class="datepicker"
                                :format="'yyyy-MM-dd'"
                                style="width:60%"
                                :show-reset-button="true"
                                condition="f_account_end_date <= '{} 23:59:59'">
                    </datepicker>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label for="f_userinfo_code" class="font_normal_body">用户编号</label>
                    <input type="text" class="input_search" style="width:60%" v-model="model.f_userinfo_code"
                           condition="f_userinfo_code like '%{}%'" placeholder='用户编号'>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label for="f_user_name" class="font_normal_body">用户姓名</label>
                    <input type="text" class="input_search" style="width:60%" v-model="model.f_user_name"
                           condition="f_user_name like '%{}%'" placeholder='用户姓名'>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label for="f_address" class="font_normal_body">用户地址</label>
                    <input type="text" class="input_search" style="width:60%" v-model="model.f_address"
                           condition="f_address like '%{}%'" placeholder='用户地址'>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body">气表品牌</label>
                    <v-select :value.sync="model.f_meter_brand"
                              v-model="model.f_meter_brand"
                              :options='$parent.$parent.meterbrands' placeholder='请选择'
                              condition="f_meter_brand = '{}'"
                              close-on-select>
                    </v-select>
                  </div>
                  <div class="col-sm-2 form-group">
                    <label class="font_normal_body">用户类型</label>
                    <v-select id="f_user_type"
                              v-model="model.f_user_type"
                              placeholder='用户类型'
                              :value.sync="model.f_user_type"
                              :options='$parent.$parent.usertypes'
                              condition="f_user_type = '{}'"
                              close-on-select>
                    </v-select>
                  </div>
                  <div class="span" style="float:right;margin-top:5px">
                    <button class="button_search" @click="$parent.$parent.search()" v-el:cx>查询</button>
<!--                    <button class="button_search" @click="$parent.$parent.updateSellInfo()">批量更新收费信息</button>-->
                    <export-excel :data="$parent.$parent.getCondition"
                                  :field="$parent.$parent.getfield"
                                  sqlurl="rs/logic/saleExport" sql-name="getCheckAccountPrint"
                                  template-name='物联网表对账单导出' :choose-col="true">
                    </export-excel>
                    <print-data :model="$parent.model"
                                :field="$parent.$parent.getfield"
                                :defaultfield="$parent.$parent.defaultfield"
                                print-name="物联网对账单">
                    </print-data>
                  </div>
                </div>
              </div>
            </criteria>
            <data-grid :model="model" class="list_area table_sy" 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>
                  <th>
                    <nobr>操作</nobr>
                  </th>
                </tr>
              </template>
              <template partial='body'>
                <td style="text-align: center;">{{ row.f_userinfo_code }}</td>
                <td style="text-align: center;">{{ row.f_user_name }}</td>
                <td style="text-align: center;">{{ row.f_user_phone }}</td>
                <td style="text-align: center;">{{ row.f_address }}</td>
                <td style="text-align: center;">{{ row.f_last_balance }}</td>
                <td style="text-align: center;">{{ row.f_collection }}</td>
                <td style="text-align: center;">{{ row.f_pregas }}</td>
                <td style="text-align: center;">{{ row.f_preamount }}</td>
                <td style="text-align: center;">{{ row.f_balance }}</td>
                <td style="text-align: center;">{{ row.f_last_tablebase }}</td>
                <td style="text-align: center;">{{ row.f_tablebase }}</td>
                <td style="text-align: center;">{{ row.f_account_start_date }}</td>
                <td style="text-align: center;">{{ row.f_account_end_date }}</td>
                <td style="text-align: center;">{{ row.f_operator }}</td>
                <td style="text-align: center;">{{ row.f_operate_date }}</td>
                <td style="text-align: center;">
                  <button class="button_search" @click="$parent.$parent.$parent.printUserBill(row)">对账单打印</button>
                </td>
              </template>
            </data-grid>
          </criteria-paged>
        </div>
      </div>
    </div>
    <user-check-bill :show="checkPrint"
                     :bill-url='checkUrl'
                     v-on:toggle="close"
                     :data='userData'
                     :billdata="printData"
                     id="checkAccountPrint"
                     @closecheckbill="closeCheckBill()"
                     v-ref:checkbill>
    </user-check-bill>
  </div>
</template>
<script>
import {PagedList} from 'vue-client'

let asyncHandGen = async function (self) {
  await self.$LoadParams.loadParam()
  self.initParams()
}

export default {
  title: '结算对账单',
  data () {
    return {
      meterbrands: [],
      model: new PagedList('rs/sql/getCheckAccountPrint', 20, {}),
      metertype: this.$appdata.getParam('气表类型') ? [{
        label: '全部',
        value: ''
      }, ...this.$appdata.getParam('气表类型')] : [],
      checkPrint: false,
      userData: {},
      printData: {
        f_userinfo_code: '',
        f_userinfo_id: '',
        f_user_name: '',
        f_check_date: '',
        f_total_gas: '',
        f_total_fee: '',
        f_balance: '',
        f_curbalance: '',
        f_collection: '',
        f_address: ''
      },
      getfield: {
        'f_userinfo_code': '用户编号',
        'f_user_name': '用户姓名',
        'f_user_phone': '用户电话',
        'f_address': '用户地址',
        'f_last_balance': '上期结余',
        'f_collection': '收款',
        'f_pregas': '用气量',
        'f_preamount': '用气金额',
        'f_last_tablebase': '上期表底数',
        'f_tablebase': '本期表底数',
        'f_balance': '本期结余',
        'f_account_start_date': '上次结算日期',
        'f_account_end_date': '本次结算日期',
        'f_operator': '操作员',
        'f_operate_date': '操作日期'
      },
      condition: '',
      defaultfield: [],
      checkUrl: 'rs/report/check_bill'
    }
  },
  ready () {
    this.$refs.paged.$refs.cri.model.startDate = this.$login.toStandardDateString()
    this.$refs.paged.$refs.cri.model.endDate = this.$login.toStandardDateString()
    asyncHandGen(this)
  },
  methods: {
    initParams () {
      let arr = []
      this.$GetSaleParam.getGasbrand().forEach((item) => {
        let temp = {}
        if (item.value.f_meter_type === '物联网表' || item.value.f_meter_type === '机表') {
          temp.label = item.label
          temp.value = item.value.f_meter_brand
          arr.push(temp)
        }
      })
      this.meterbrands = [{label: '全部', value: ''}, ...arr]
    },
    closeCheckBill () {
      this.checkPrint = false
    },
    updateSellInfo (row) {
      this.$showMessage(` 确定对查询的所有结算单进行更新收费信息吗? 一共${this.model.count}条`, ['confirm', 'cancel']).then(async res => {
        if (res === 'confirm') {
          let data = {
            condition: this.condition
          }
          await this.$resetpost('rs/logic/updateAccountSellInfo', {data: data}, {
            resolveMsg: '批量更新收费信息成功！！！!',
            rejectMsg: '批量更新收费信息失败！！！'
          })
          this.search()
        }
      })
    },
    printUserBill (billData) {
      let startdate = this.$refs.paged.$refs.cri.model.startDate ? this.$refs.paged.$refs.cri.model.startDate : this.$login.toStandardYearMonth() + '-01 00:00:00'
      let enddate = this.$refs.paged.$refs.cri.model.endDate ? this.$refs.paged.$refs.cri.model.endDate : this.$login.toStandardDateString() + ' 23:59:59'
      this.userData = billData
      console.log('对账单打印,billData=', billData, this.userData)
      console.log('', this.$refs.paged.$refs.cri.model.startDate, this.$refs.paged.$refs.cri.model.endDate)
      this.userData = billData
      this.checkPrint = true
      console.log('对账单打印,checkPrint=', this.checkPrint)
      this.printData.f_balance = `'${billData.f_last_balance}'`
      this.printData.f_curbalance = `'${billData.f_balance}'`
      this.printData.f_userinfo_code = `'${billData.f_userinfo_code}'`
      this.printData.f_user_name = `'${billData.f_user_name}'`
      this.printData.f_check_date = `'${billData.f_account_start_date.substring(0, 10) + '至' + billData.f_account_end_date.substring(0, 10)}'`
      this.printData.f_total_gas = `'${billData.f_pregas}'`
      this.printData.f_total_fee = `'${billData.f_preamount}'`
      this.printData.f_collection = `'${billData.f_collection}'`
      this.printData.f_address = `'${billData.f_address}'`
      this.printData.f_userinfo_id = `'${billData.f_userinfo_id}'`
    },
    search () {
      this.$parent.endDate = this.$refs.paged.$refs.cri.model.endDate
      this.$refs.paged.$refs.cri.search()
      this.$dispatch('search')
    },
    selfSearch (args) {
      args.condition = `${args.condition} and f_orgid = '${this.$login.f.orgid}'`
      this.condition = args.condition
      this.model.search(args.condition, args.model)
    }
  },
  computed: {
    usertypes () {
      return [{label: '全部', value: ''}, ...this.$appdata.getParam('用户类型')]
    },
    getCondition () {
      return {condition: `${this.$refs.paged.$refs.cri.condition}  and f_orgid = '${this.$login.f.f_orgids}'`}
    }
  }
}
</script>

<style>
.datapanel {
  color: #333;
  background-color: white;
  box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px;
  padding: 10px 10px 5px 10px;
  border-radius: 10px;
}
</style>
