<template>
  <div style="flex:1;" class="flex">
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='$parent.selfSearch' v-ref:cri>
        <div novalidate class="form-inline" partial>
          <div >
            <v-select id="f_operator"
                      v-model="model.f_operator"
                      placeholder='使用人'
                      :value.sync="model.f_operator"
                      :options='$parent.$parent.users'
                      condition= "f_operator = '{}'"
                      close-on-select>
            </v-select>
          </div>
          <div >
            <input  type="text" class="form-control" v-model="model.f_bill_id_start" placeholder='起始票号'
                    condition="f_bill_id >= '{}'">
          </div>
          <div >
            <input  type="text" class="form-control" v-model="model.f_bill_id_end" placeholder='终止票号'
                    condition="f_bill_id <= '{}'">
          </div>
          <div >
            <datepicker id="startDate" placeholder="开始日期"
                        v-model="model.startDate"
                        :value.sync="model.startDate"
                        :disabled-days-of-Week="[]"
                        :format="'yyyy-MM-dd HH:mm:ss'"
                        condition= "f_operate_date >= '{}'"
                        :show-reset-button="reset">
            </datepicker>
          </div>
          <div >
            <datepicker id="endDate" placeholder="结束日期"
                        v-model="model.endDate"
                        :value.sync="model.endDate"
                        :disabled-days-of-Week="[]"
                        :format="'yyyy-MM-dd HH:mm:ss'"
                        condition= "f_operate_date <= '{}'"
                        :show-reset-button="reset">
            </datepicker>
          </div>
          <div >
            <v-select id="f_bill_type"
                      v-model="model.f_bill_type"
                      placeholder='业务类型'
                      :value.sync="model.f_bill_type"
                      :options='$parent.$parent.billType'
                      condition= "f_bill_type = '{}'"
                      close-on-select>
            </v-select>
          </div>
          <div >
            <button class="btn btn-success width-80" @click="$parent.$parent.search()">查询</button>
          </div>
          <div >
            <button class="btn btn-success width-80" @click="$parent.$parent.back()">返回</button>
          </div>
          <div >
            <export-excel
              :data="{condition: condition + ` and f_filialeids = '${$login.f.f_orgids}'`}"
              :field="$parent.$parent.getfield"
              sqlurl="rs/logic/saleExport" sql-name="getPaperBillDetail" template-name='发票详情导出'
              :choose-col="true"></export-excel>
          </div>
        </div>
      </criteria>
      <data-grid  :model="model" partial='list' 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>
          </tr>
        </template>
        <template partial='body':model="model">
          <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_user_name}}</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_state}}</td>
            <td style="text-align:center">{{row.f_operate_date}}</td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
  /**
   *阶梯水价查询列表
   */
  import { PagedList } from 'vue-client'

  export default {
    data () {
      return {
        isshow: false,
        condition: '',
        getfield: {
          'f_bill_number': '发票号码',
          'f_userinfo_code': '客户编号',
          'f_user_name': '用户姓名',
          'f_paid_money': '收款金额',
          'f_type': '业务类型',
          'f_bill_type': '发票类型',
          'f_bill_state': '状态',
          'f_operate_date': '使用日期'
        },
        model: new PagedList('rs/sql/getPaperBillDetail', 20),
        billType: this.$appdata.getParam('发票业务类型') ? [{label: '全部', value: ''}, this.$appdata.getParam('发票业务类型')] : []
      }
    },
    props: ['data'],
    ready() {
      this.search()
    },
    watch: {
      'data' () {
        this.search()
      }
    },
    methods: {
      selfSearch (args) {
        args.condition = `${args.condition} and f_bill_id = ${this.data.id}`
        console.log('明细查询条件', args.condition)
        this.model.search(args.condition, this.model)
      },
      search () {
        this.$refs.paged.$refs.cri.search()
      },
      back () {
        this.$dispatch('back')
      }
    },
    computed: {
    'users' () {
      let rs = new Array()
      for (let i = 0; i < this.$login.f.f_paperUseman.length; i++) {
        let temp = {
          label: this.$login.f.f_paperUseman[i].name,
          value: this.$login.f.f_paperUseman[i].name
        }
        rs.push(temp)
      }
      return rs
    }
  }
  }
</script>
