/*
 * @Author: Anmin 
 * @Email:changanmin1@crc.com.hk 
 * @Date: 2018-08-29 17:05:33 
 * @Last Modified by: Anmin
 * @Last Modified time: 2019-01-07 15:34:17
 * 完成收款工作台查询
 */
<template>
  <div>
    <EMSTable
      ref="listTable"
      :server="server"
      action="find"
      :columnsFn="getColumnsFun"
      :params="searchParams"
      :highlight-row="true"
      @on-selection-change="handle_sel_table"
    >
      <div slot="search-bar">
        <SearchFormItem ref="searchItem" :elItem="searchParams"></SearchFormItem>
      </div>
      <div slot="handle-bar">
        <Button @click.native="search()" type="warning" icon="search">查询</Button>
        <Button @click.native="reset" type="info" icon="loop">重置</Button>
      </div>
      <div slot="table-bar">
        <!-- 只能单条撤回 -->
        <Button
          :disabled="this.ids.length <= 0"
          type="warning"
          icon="checkmark-circled"
          @click="go_back"
        >撤销</Button>
        <Button @click.native="exportResult" type="info" icon="arrow-down-a">查询结果导出</Button>
      </div>
    </EMSTable>
  </div>
</template>

<script>
import { EMSTable, DataSelect } from "ems-components";

import SearchFormItem from "../receivableComponent/searchFormItem";
import TableConfig from "../receivableComponent/tableConfig.js";
import Server from "./server.js";
import { exportFile } from "../receivableComponent/exportFile.js";
import ExcelExport from "../receivableComponent/excelExportPreview";
import getModalTextarea from "ems-receivable@/components/modalTextarea/index.js";
import ReceivableDetail from "../receivableComponent/receivableDetail/index.vue";
const server = new Server();
export default {
  components: {
    EMSTable,
    
    DataSelect,
    SearchFormItem
  },
  data() {
    return {
      server: server,
      searchParams: {
        batchNum: "", // 批次号
        compCode: "",
        receivablesBankNum: "",
        paymentCompName: "",
        paymentBankNum: "",
        currencyCode: "",
        paymentTypeCode: "",
        updatedByName: "", //操作人
        receivablesStatus: "6",
        receivablesSource: "",
        // receivablesNum: "",
        receivablesLineNum: "",
        // _amount: "",
        _claimedAmount: "", //认领金额查询
        receivablesStartAmount: "", // 收款开始金额 输入
        receivablesEndAmount: "", // 收款结束金额输入
        _date: "", //收款日期
        receivablesStartDate: "", // 收款日期 收款开始日期，格式为“2018-12-12”
        receivablesEndDate: "", //   收款结束日期，格式为“2018-12-12”
        businessType: "", //业务类型
        // "resourceCode":window.location.hash.substring(window.location.hash.lastIndexOf("\/")+1),//菜单code
        receivablesClass: "", //收款分类
        _receivablesClass: "" //是否显示收款分类
      },
      ids: [],
      modalOptions: {}
    };
  },
  computed: {},
  created: function() {},
  beforeMount: function() {},
  mounted: function() {},
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    go_back() {
      let self = this;
      this.modalOptions = {
        text: `确认撤销当前选择的${this.ids.length}项记录嘛？`,
        placeholder: "请输入撤销原因",
        val: ""
      };
      this.$Modal.confirm({
        loading: true,
        title: "撤销提示",
        render: getModalTextarea(this.modalOptions),
        onOk: async function() {
          if (self.modalOptions.val.trim().length <= 0) {
            this.$data.buttonLoading = false;
            return this.$Message.warning("请在文本框中输入撤销原因");
          }
          //输入了撤销原因
          // 封装每项改为撤销状态
          let param = {
            ids: self.ids,
            receivablesStatus: 2,
            //2018/11/9 增加退回原因入参:logRemark
            logRemark: self.modalOptions.val
          };
          let data = await self.server.modify(param);
          if (data.statusCode === "-1") {
            self.$Message.error(data.msg);
            let modal = this;
            modal.$data.buttonLoading = false;
          } else {
            self.search(1);
            self.$Message.success("撤销成功");
            self.$Modal.remove();
          }
        }
      });
    },
    handle_sel_table(selection) {
      if (selection.length > 0) {
        this.ids = selection.map(item => item.receivablesLineId);
      } else {
        this.ids = [];
      }
    },
    /**
     * 查询结果导出
     */
    exportResult() {
      //选择导出列
      new this.$pageModal(
        ExcelExport,
        {
          props: {
            title: "选择导出列",
            businessType: "lineReceivable"
          }
        },
        async data => {
          if (!data) return;
          let selectColunms = data.selectColunms || [];
          let selectData = data.selectData || [];
          //导出请求参数
          let resData = {
            lineReturnDto: this.searchParams,
            selectColunms: selectColunms,
            selectData: selectData,
            businessType: "lineReceivable",
            businessName: "完成收款工作台列表导出",
            businessUrl: "receivableClaimServiceImpl.exportReceivableLine"
          };
          //返回结果
          let result = await this.server.exportResult(resData);
          if (result.statusCode === "-1") {
            this.$Message.error(result.msg);
          } else {
            exportFile(result, "完成收款工作台列表导出");
          }
        }
      ); //end pageModal
    },
    /**
     * 搜索
     */
    search(page = 1) {
      //获取 from 值信息
      this.searchParams = this.$refs["searchItem"].searchForm;
      this.$refs["listTable"].load(this.searchParams, page);
      this.ids = [];
    },
    /**
     * 重置
     */
    reset() {
      this.$refs["searchItem"].reset();
      this.search(1);
    },
    /**
     * 生成表格列
     */
    getColumnsFun() {
      let arr = [
        "批次号",
        "原收款单号",
        "收款单号",
        "收款分类",
        "收款单位",
        "收款账号",
        "付款单位",
        "付款账号",
        "认领金额",
        "收款币种",
        "手续费",
        "收款日期",
        "业务类型",
        "操作人",
        "收款来源",
        "收款方式",
      ];
      let columns = new TableConfig(this, arr).getColumns();
      columns.splice(0, 0, {
        title: "操作",
        key: "action",
        width: 50,
        align: "center",
        fixed: "left",
        render: (h, params) => {
          return h("RowTools", {
            props: {
              data: [
                {
                  text: "查看",
                  handle: () => {
                    let self = this;
                    new this.$pageModal(
                      ReceivableDetail,
                      {
                        props: {
                          title: "完成收款工作台详情",
                          receivablesLineNum: params.row.receivablesLineNum,
                          receivablesClass: params.row.receivablesClass,
                          detail: params.row,
                          finishedReceivable: true
                        }
                      },
                      data => {}
                    );
                  }
                }
              ]
            }
          });
        }
      });
      columns.splice(0, 0, {
        type: "selection",
        width: 45,
        fixed: "left",
        align: "center"
      });
      return columns;
    }
  },
  watch: {},
  directives: {}
};
</script>

<style>
</style>