/*
 * @Author: Anmin 
 * @Email:changanmin1@crc.com.hk 
 * @Date: 2018-10-19 17:39:56 
 * @Last Modified by: Anmin
 * @Last Modified time: 2019-01-09 10:58:43
 * @description:  其他类收款认领 -- 单条认领 -- 业务类型支持退款关联-- 退款关联
 */ 
<template>
  <div> 
    <Form :model="searchForm" ref="searchFormRef" slot="search-bar" label-position="top" inline>
      <Form-item prop="payRequestClaimNo" label="付款申请单号">
        <Input clearable type="text" v-model="searchForm.payRequestClaimNo" ></Input>
      </Form-item>
      <Form-item prop="invoiceNo" label="发票编号">
        <Input clearable type="text" v-model="searchForm.invoiceNo" ></Input>
      </Form-item>
      <Form-item prop="date" label="支付日期"> 
        <DatePicker transfer clearable type="daterange"  @on-change="handleChangDate" v-model="searchForm.date" format="yyyy-MM-dd"></DatePicker>
      </Form-item> 
    </Form>
    <div slot="handle-bar">
      <Button size="small" @click.native="search()" type="warning" icon="search">搜索</Button>
      <Button size="small" @click.native="reset" type="info" icon="loop">重置</Button>
    </div>
    <!-- <EMSTable :server="server" ref="refInforTable" action="findPayLineDetail" :params="searchForm" :columns="columns" :onSelectionChange="onSelectionChange"> -->
    <Table :loading="loading" style="margin-top:10px;" :data="tableList" ref="refInforTable" :columns="columns" @on-select="onSelectionChange">
      
    </Table>
    <DataSelect v-show="false" code='ReceivablesPaymentType' @loadFinish="(data)=>{receivablesPaymentType = data.valueMap}"></DataSelect>
  </div>
</template>
<script>
import { DataSelect } from "ems-components";
import Server from "../../server.js";
const server = new Server();
import miment from "miment";
export default {
  components: { 
    DataSelect
  },
  props: {
    title: {
      type: String,
      default() {
        return "退款信息";
      }
    },
    detail:{
      type:Object,
    }
  },
  data() { 
    return {
      loading:false,
      receivablesPaymentType:null, //收款类别值集
      tableList:[],
      selectData: [],
      server,
      searchForm: {
        payRequestClaimNo: "",
        invoiceNo: "",
        date: [],
        beginPayTime: "",
        endPayTime: "",
      },
      columns: [
        {
          type: "selection",
          width: 55,
          // fixed: 'left',
          align: "center"
        },
        {
          title: "归属公司",
          key: "companyName",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.companyName
                }
              },
              params.row.companyName
            );
          }
        },
        {
          title: "付款申请单号",
          key: "payRequestClaimNo",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.payRequestClaimNo
                }
              },
              params.row.payRequestClaimNo
            );
          }
        },
        {
          title: "发票编号",
          key: "invoiceNo",
          align: "invoiceNo",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.invoiceNo
                }
              },
              params.row.invoiceNo
            );
          }
        },
        {
          title: "付款名称",
          key: "accountName",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.accountName
                }
              },
              params.row.accountName
            );
          }
        },
        {
          title: "付款账号",
          key: "accountNo",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.accountNo
                }
              },
              params.row.accountNo
            );
          }
        },
        {
          title: "付款金额",
          key: "payAmount",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.payAmount
                }
              },
              params.row.payAmount
            );
          }
        },
        {
          title: "付款方式",
          key: "payType",
          align: "center",
          render: (h, params) => {
            let vm = this; 
            if(!params.row.payType) return '';
            let title = vm.receivablesPaymentType[params.row.payType];
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: title
                }
              },
              title
            );
          }
        },
        {
          title: "支付日期",
          key: "payTime",
          align: "center",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.payTime
                }
              },
              params.row.payTime
            );
          }
        }
      ]
    };
  },
  computed: {},
  created: function() {
    this.$emit("SetTitle", this.title);  
  },
  beforeMount: function() {},
  mounted: function() {},
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: { 
    handleChangDate(date,type){ 
      this.searchForm.beginPayTime = date[0] || "";
      this.searchForm.endPayTime = date[1] || "";
    },
    search() { 
      // 拉数据
      this.fetchData();
    },
    async fetchData(){
      this.loading = true;
      let params= {
        "page": {
          "currentPage": 0,
          "pageNum": 0,
          "pageSize": 0
        },
        "params": this.searchForm,
        "sortDTO": {
          "fieldName": "",
          "orderBy": ""
        }
      }
      let data = await this.server.findPayLineDetail(params); 
      if(data.statusCode === "-1"){
         this.$Message.error(data.msg);
      }else{
        this.tableList = data.data.list;
      }
      this.loading= false;
    },
    reset() { 
      this.searchForm = {
        payRequestClaimNo: "",
        invoiceNo: "",
        date: [],
        beginPayTime: "",
        endPayTime: ""
      };
      this.tableList = []; 
    },
    // 确定
    onOk() {
      let selected = this.$refs["searchForm"].getSelectioned() || []; 
      this.$emit("Close", selected[0]);
    }, 
    /**
     * 选择一条关联的数据
     * 
     */
    onSelectionChange(selection,row) {
       this.$emit("Close",row);
    },
    save() {
      if (this.selectData.length <= 0) {
        this.$Message.warning("请选择数据");
        return;
      }
      this.$emit("SetActionsState", { btn: "save", state: true });
      this.$emit("Close",this.selectData); 
    }
  },
  watch: {},
  directives: {}
};
</script>
<style lang="less">
</style>