<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-horizontal select-overspread container-fluid auto" partial>
          <div class="row">
            <div class="form-group col-sm-3">
              <label class="font_normal_body">票据使用人</label>
              <v-select id="f_operator"
                        v-model="model.f_operator"
                        placeholder='票据使用人'
                        style="width:60%"
                        :value.sync="model.f_operator"
                        :options='$parent.$parent.users'
                        condition= "f_operator = '{}'"
                        close-on-select>
              </v-select>
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">起始票号</label>
              <input  type="text" class="input_search" v-model="model.rn_start" placeholder='起始票号'
                      style="width:60%"
                      condition="rn >= '{}'">
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">终止票号</label>
              <input  type="text" class="input_search" v-model="model.rn_end" placeholder='终止票号'
                      style="width:60%"
                      condition="rn <= '{}'">
            </div>
            <div class="span" style="float:right;">
                <button class="button_search button_spacing" @click="$parent.$parent.search()">查询</button>
                <button class="button_search button_spacing" @click="$parent.$parent.back()">返回</button>
                <export-excel
                  :data="{condition: condition + ` and f_filialeids = '${$login.f.f_orgids}'`}"
                  :field="$parent.$parent.getfield"
                  sqlurl="rs/logic/saleExport" progress="saleGetExportProgress" sql-name="getPaperBillDetail" 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 class="row" v-show="$parent.$parent.criteriaShow">
            <div class="form-group col-sm-3">
              <label class="font_normal_body">开始日期&nbsp;&nbsp;&nbsp;</label>
              <datepicker id="startDate" placeholder="开始日期"
                          v-model="model.startDate"
                          style="width:60%"
                          :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 class="form-group col-sm-3">
              <label class="font_normal_body">结束日期</label>
              <datepicker id="endDate" placeholder="结束日期"
                          v-model="model.endDate"
                          :value.sync="model.endDate"
                          style="width:60%"
                          :disabled-days-of-Week="[]"
                          :format="'yyyy-MM-dd HH:mm:ss'"
                          condition= "f_operate_date <= '{}'"
                          :show-reset-button="reset">
              </datepicker>
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">发票状态</label>
              <v-select id="f_state"
                        v-model="model.f_state"
                        placeholder='发票状态'
                        title="参数:发票状态"
                        style="width:60%"
                        :value.sync="model.f_state"
                        :options='$parent.$parent.billstate'
                        condition= "f_state = '{}'"
                        close-on-select>
              </v-select>
            </div>
            <div class="form-group col-sm-3">
              <label class="font_normal_body">业务类型</label>
              <v-select id="f_bill_type"
                        v-model="model.f_bill_type"
                        placeholder='业务类型'
                        title="参数:发票业务类型"
                        :value.sync="model.f_bill_type"
                        :options='$parent.$parent.billType'
                        condition= "f_bill_type = '{}'"
                        close-on-select>
              </v-select>
            </div>
          </div>
        </div>
      </criteria>
      <data-grid  :model="model" partial='list' v-ref:grid class="list_area table_sy">
        <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>
          </tr>
        </template>
        <template partial='body':model="model">
          <tr>
            <td style="text-align:center">{{$index+1}}</td>
            <td style="text-align:center">{{row.rn}}</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_charge_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_state}}</td>
            <td style="text-align:center">{{row.f_operate_date}}</td>
            <td style="text-align:center">{{row.f_operator}}</td>
            <td style="text-align:center">{{row.f_orgname}}</td>
            <td style="text-align:center">{{row.f_depname}}</td>
            <td class="flex-around">
              <button type="button" name="button" class="btn btn-link" v-if="row.f_bill_state==='有效'"
                      @click.stop="$parent.$parent.$parent.modifyParam(row,'作废')">作废</button>
              <button type="button" name="button" class="btn btn-link" v-if="row.f_bill_state==='作废'"
                      @click.stop="$parent.$parent.$parent.modifyParam(row,'有效')">置为有效</button>
            </td>
          </tr>
        </template>
        <template partial='foot'></template>
      </data-grid>
    </criteria-paged>
<!--    <modal v-if="show" :show.sync="show"  v-ref:modal backdrop="false">-->
<!--      <header slot="modal-header" class="modal-header">-->
<!--        <button type="button" class="close" @click="close"><span>&times;</span></button>-->
<!--        <h4 class="modal-title">修改状态</h4>-->
<!--      </header>-->
<!--      <article slot="modal-body" class="modal-body">-->
<!--        <form class="form-horizontal">-->
<!--          <div class="col-sm-4 form-group">-->
<!--            <label class="font_normal_body">操作人</label>-->
<!--            <input type="text" v-model="f_operator" disabled=disabled style="width: 60%" class="input_search">-->
<!--          </div>-->
<!--          <div class="col-sm-4 form-group">-->
<!--            <label class="font_normal_body">操作时间</label>-->
<!--            <input type="text" v-model="f_operate_date" disabled=disabled style="width: 60%" class="input_search">-->
<!--          </div>-->
<!--          <div class="col-sm-4 form-group">-->
<!--            <label class="font_normal_body" title="参数:发票状态">发票状态</label>-->
<!--            <v-select :value.sync="f_state" v-model="f_state"-->
<!--                      :options='billstate' placeholder='发票状态'-->
<!--                      :value-single="true"-->
<!--                      :search="false"-->
<!--                      close-on-select>-->
<!--            </v-select>-->
<!--          </div>-->
<!--        </form>-->
<!--      </article>-->
<!--      <footer slot="modal-footer" class="modal-footer">-->
<!--        <button type="button" class="button_search button_spacing" @click='confirm'>是</button>-->
<!--        <button type="button" class="button_clear button_spacing" @click='close'>否</button>-->
<!--      </footer>-->
<!--    </modal>-->
  </div>


</template>

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

  export default {
    data () {
      return {
        f_state: '',
        f_operator: this.$login.f.name,
        f_operate_date: this.$login.toStandardDateString(),
        show: false,
        criteriaShow: false,
        isshow: false,
        condition: '',
        getfield: {
          'rn': '发票号码',
          'f_userinfo_code': '用户编号',
          'f_user_name': '用户姓名',
          'f_paid_money': '收款金额',
          'f_charge_type': '业务类型',
          'f_bill_type': '发票类型',
          'f_state': '发票状态',
          'f_operate_date': '使用日期',
          'f_operator': '操作人'
        },
        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: {
      close () {
        this.show = false
      },
      cancel () {
        this.$dispatch('close')
      },
      // confirm () {
      //   let data={
      //     f_bill_number:(this.f_state==='已用')?this.row.rn:null,
      //     f_bill_state:(this.f_state==='已用'||this.f_state==='空白作废')?'有效':(this.f_state==='作废'?'作废':''),
      //     f_operatorid: this.$login.f.id,
      //     f_orgid: this.$login.f.orgid,
      //     f_orgname: this.$login.f.orgs,
      //     f_depid: this.$login.f.depids,
      //     f_depname: this.$login.f.deps,
      //     f_operator:this.$login.f.name,
      //     f_operate_date:this.$login.toStandardDateString(),
      //   }
      //   if(this.row.id){
      //     data.id=this.row.id
      //   }
      //   this.$resetpost('rs/entity/t_billdetail', data, {resolveMsg: '保存成功', rejectMsg: '保存失败'}).then((res) => {
      //     this.$dispatch('refresh')
      //   }).catch((error) => {
      //     this.$dispatch('refresh')
      //   })
      // },
      modifyParam (row, f_bill_state) {
        let data = {
          f_bill_state: f_bill_state,
          id: row.id
        }
        this.$resetpost('rs/entity/t_billdetail', data, {resolveMsg: '保存成功', rejectMsg: '保存失败'}).then((res) => {
          this.search()
        }).catch((error) => {
          this.search()
        })
      },
      hidden () {
        this.criteriaShow = !this.criteriaShow
      },
      selfSearch (args) {
        args.condition = `${args.condition}`
        this.model.paramSource = {f_bill_id: `${this.data.id}`, billstart: `${this.data.f_start_number}`, billend: `${this.data.f_end_number}`, billuse: `${this.data.f_using_number}`}
        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
      },
      billstate () {
        return this.$appdata.getParam('发票状态')
      }
    }
  }
</script>
