<template>
  <div>
    <div style="flex: 1.5" class="flex">
      <div class="flex">
        <criteria-paged :model="model" v-ref:paged>
          <criteria partial='criteria' v-ref:criteria @condition-changed="$parent.selfSearch">
            <div novalidate class="form-inline auto" partial>
<!--              <div class="form-group col-sm-3">-->
<!--                <label 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="form-group col-sm-3">
                              <label class="font_normal_body">是否缴费</label>
                              <v-select :disabled=false
                                        :options='$parent.$parent.whetherpay'
                                        :value-single="true"
                                        :value.sync="model.f_whether_pay"
                                        close-on-select
                                        placeholder='请选择'
                                        v-model="model.f_whether_pay"
                                        condition="f_whether_pay = '{}'">
                              </v-select>
                            </div>
              <div style="float:right;margin-top: 8px" class="span">
                <button class="button_spacing button_search" @click="search()">查 询</button>
              </div>
            </div>
          </criteria>
          <data-grid :model="model" v-ref:grid class="list_area table_sy" partial='list'>
            <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>
              </tr>
            </template>
            <template partial='body'>
              <td style="text-align: center;">{{$index+1}}</td>
              <td style="text-align: center;">{{row.f_change_price}}</td>
              <td style="text-align: center;">{{row.f_real_amount}}</td>
              <td style="text-align: center;">{{row.f_surplus_fee}}</td>
              <td style="text-align: center;">{{row.f_whether_pay}}</td>
              <td style="text-align: center;">{{row.f_operate_date}}</td>
              <td style="text-align: center;">
                <button type="button" name="button" class="btn btn-link" v-if="row.f_whether_pay==='否'"
                        @click.stop="$parent.$parent.$parent.surpluscancel(row)">冲正
                </button>
              </td>
            </template>
          </data-grid>
        </criteria-paged>
      </div>
    </div>
  </div>
</template>

<script>
  import {PagedList} from 'vue-client'
const myMap = new Map()

  export default {
    'title': '',
    props: ['f_userfiles_id'],
    data () {
      return {
        whetherpay: [{label: '全部', value: ''}, {label: '是', value: '是'}, {label: '否', value: '否'}],
        model: new PagedList('rs/sql/singleTable_OrderBy', 50, {orderitem: '"id"',
          items: '"*"',
          tablename: '"t_surplus_detail"'})
      }
    },
    // ready () {
    //   this.search()
    // },
    events: {},
    methods: {
      search () {
        this.$refs.paged.$refs.criteria.search()
      },
      selfSearch (args) {
        args.condition = `${args.condition} and f_userfiles_id=${this.f_userfiles_id} and f_state='有效'`
        // args.condition=`${args.condition}`
        this.model.search(args.condition, args.model)
      },
      surpluscancel (row) {
        this.$showMessage('冲正后不可恢复，确定冲正吗？', ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            row.f_operator = this.$login.f.name
            row.f_operatorid = this.$login.f.id
            row.f_orgid = this.$login.f.orgid
            row.f_orgname = this.$login.f.orgs
            row.f_depid = this.$login.f.depids
            row.f_depname = this.$login.f.deps
            this.$resetpost('rs/logic/singlePriceAdjustCancel', {data: row}).then(() => {
              this.search()
            })
          }
        })
      }
    },
    watch: {
      'f_userfiles_id' () {
        this.search()
      }
    }
  }
</script>
<style>
  .datapanel {
    color: #333;
    background-color: white;
    padding: 10px 20px;
    border-radius: 15px;
  }
</style>
