<template>
  <div style="flex:1;" class="flex">
    <div class="flex" style="width:100%;">
      <criteria-paged :model="model" v-ref:paged>
        <criteria partial='criteria' v-ref:criteria  @condition-changed='$parent.selfSearch'>
          <div novalidate class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row">
              <div class="col-sm-2 form-group form-input-group" >
                <label class="control-label">表编号:</label>
                <input type="text" class="form-control" v-model="model.f_userid"
                       condition="f_userid='{}'" placeholder="表编号" v-next-el="aa"  >
              </div>
              <div class="col-sm-2 form-group form-input-group" >
                <label class="control-label">客户名:</label>
                <input type="text" class="form-control" v-model="model.f_user_name"
                       condition="f_user_name = '{}'" placeholder="用户名" >
              </div>
              <div class="col-sm-2 form-group form-input-group" >
                <label class="control-label">用户类型</label>
                <v-select :value.sync="model.f_user_type"
                          :options='$parent.$parent.usertypes' placeholder='请选择'
                          v-model="model.f_user_type"
                          condition="f_user_type = '{}'"
                          close-on-select></v-select>
              </div>
              <div class="col-sm-2 form-group form-input-group" >
                <label class="control-label">银行名称</label>
                <v-select :value.sync="model.f_bank_name"
                          v-model="model.f_bank_name"
                          :options='$parent.$parent.f_bankname' placeholder='请选择'
                          condition="f_bank_name = '{}'"
                          close-on-select
                ></v-select>
              </div>
              <div class="col-sm-2 form-group form-input-group" >
                <label class="control-label">组织机构</label>
                <right-tree :userid.sync='$parent.$parent.userid' :source.sync='$parent.$parent.source'  @re-res="$parent.$parent.getRes"></right-tree>
              </div>



              <div class="col-sm-3 form-group form-input-group" style="width: 20%">
                <label for="startDate" class="control-label">开始日期</label>
                <datepicker id="startDate" placeholder="返盘开始日期" width='100%'
                            v-model="model.startDate"
                            :value.sync="model.startDate"
                            :format="'yyyy-MM-dd'"
                            :show-reset-button="true"
                            condition="f_fanpandate >= '{} 00:00:00'">
                </datepicker>
              </div>
              <div class="col-sm-3 form-group form-input-group" style="width: 20%">
                <label for="endDate" class="control-label">结束日期</label>
                <datepicker id="endDate" placeholder="返盘结束日期" width='100%'
                            v-model="model.endDate"
                            :value.sync="model.endDate"
                            :format="'yyyy-MM-dd'"
                            :show-reset-button="true"
                            condition="f_fanpandate <= '{} 23:59:59'">
                </datepicker>
              </div>

              <div style="float: right">
                <button class="btn btn-success"  @click="search()" v-el:cba>查询</button>
                <button class="btn btn-default" @click="$parent.$parent.clearmsg">清空</button>
                <button class="btn btn-default" @click="$parent.$parent.importFile">银行返盘</button>
              </div>

            </div>
          </div>
        </criteria>
        <data-grid :model="model" 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>
              <th><nobr>分公司</nobr></th>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center;" ><nobr>{{$index+1}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_userid}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_username}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_address}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_phone}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.oughtfee}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_bankname}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_usermc}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_idofcard}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_result}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_resultnote}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.paymenstate}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_fanpandate}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_operator}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_returntime}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_outlets}}</nobr></td>
            <td style="text-align: center" ><nobr>{{row.f_filiale}}</nobr></td>
          </template>
        </data-grid>
      </criteria-paged>
    </div>

    <modal :show.sync="show" width="500px" title="文件导入" v-ref:modal large backdrop="false">
      <article slot="modal-body" class="modal-body">
        <file-upload class="my-file-uploader " name="UploadFile" class="btn btn-success" style="border-radius: 2px;"
                     action="rs/file/uploadFile" tagname="银行返盘" v-ref:file :headers="headers" multiple></file-upload>
      </article>
      <footer slot="modal-footer" class="modal-footer">
      </footer>
    </modal>

  </div>
</template>
<script>
  import { PagedList } from 'vue-client'

  export default {
    title: '银行返盘',
    data () {
      return {
        model: new PagedList('rs/sql/singleTable_OrderBy', 20, {items: '"*"', tablename: '"t_bankreturn"', orderitem: '"id desc"'}),
        headers: {'username': this.$login.f.name, 'blodid': this.$login.guid()},
        iseditmetetinfo: false,
        oldmeterinfo: {},

        filialeNameStr: null,
        filialeCodeStr: this.$login.f.f_orgids,
        userid: this.$login.f.id,
        source: `tool.getFullTree(this.getRights().where(row.getType() != $zone$).where(row.getType() != $role$))`,

        show: false,

        usertypes: this.$appdata.getParam('用户类型') ? [{label: '全部', value: ''}, ...this.$appdata.getParam('用户类型')] : [],
        f_bankname: this.$appdata.getParam('银行名称') ? [{label: '全部', value: ''}, ...this.$appdata.getParam('银行名称')] : []
      }
    },
    ready () {
      this.search()
    },
    methods: {
      getRes (obj) {
        this.filialeNameStr = obj.res
        this.filialeCodeStr = obj.resids
      },
      clearmsg () {
        this.$refs.paged.$refs.criteria.model = {}
      },
      search () {
        this.$refs.paged.$refs.criteria.search()
      },
      selfSearch (args) {
        args.condition = `${args.condition} and f_filialeids like '${this.filialeCodeStr}%'`
        this.model.search(args.condition, args.model)
      },
      modifyMeterInfo (row) {
        this.oldmeterinfo = row
        this.iseditmetetinfo = true
      },
      closeedit () {
        this.iseditmetetinfo = false
        this.search()
      },
      importFile () {
        this.show = true
      }
    },
    events: {
      onFileUpload: function (file, res) {
        let data = {
          tablename: 'bankreturn',
          filepath: res.f_downloadpath,
          f_filialeids: this.$login.f.f_orgids,
          f_filiale: this.$login.f.f_fengongsi,
          f_orgstr: this.$login.f.orgpathstr,
          f_operator: this.$login.f.name,
          f_parentname: this.$login.f.f_parentname
        }
        this.$resetpost('rs/logic/bankReturnCommit', {data: data}, {resolveMsg: null, rejectMsg: '返盘失败'}).then((res) => {
          /* let mes = '成功导入：' + res.data.addTimes + '条数据 '
          if (res.data.editMeter.length > 0) {
            mes = mes + ' 导入表号为【 '
            res.data.editMeter.forEach((item) => {
              console.log(item)
              mes = mes + item + '; '
            })
            mes = mes + ' 】共 ' + res.data.editMeter.length + ' 条数据因表号或IMEI号已存在导入失败'
          }
          this.$showMessage(mes) */
          this.search()
        })
      }
    }
  }
</script>
<style>
  .datapanel {
    color: #333;
    background-color: white;
    box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px ;
    padding: 10px 30px 10px 30px;
    border-radius:15px;
  }
</style>
