<template>
  <div class="eibs-tab">
    <c-list-search @form-reset="handleReset" @form-search="handleSearch">
      <template v-slot="searchSlot">
        <el-form
          class="m-table-search-form"
          ref="paramsForm"
          :inline="true"
          label-position="right"
          label-width="110px"
          size="small"
        >
          <el-row>
            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="出口融资编号"
                  prop="infcon.seaownref"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.seaownref"
                    maxlength="16"
                    placeholder="请输入出口融资编号"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="开立日期"
                  prop="infcon.opndatfrom"
                  style="width: 100%"
                >
                  <c-col :span="11">
                    <c-date-picker
                      type="date"
                      value-format="yyyy-MM-dd"
                      v-model="model.infcon.opndatfrom"
                      style="width: 100%"
                      placeholder="请选择起始日期"
                    ></c-date-picker>
                  </c-col>
                  <c-col :span="2" style="text-align: center">
                    <label style="display: inline-block; width: 100%">-</label>
                  </c-col>
                  <c-col :span="11">
                    <c-date-picker
                      type="date"
                      value-format="yyyy-MM-dd"
                      v-model="model.infcon.opndatto"
                      style="width: 100%"
                      placeholder="请选择截止日期"
                    ></c-date-picker>
                  </c-col>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="业务简略信息"
                  prop="infcon.nam"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.nam"
                    maxlength="40"
                    placeholder="请输入业务简略信息"
                  ></c-input>
                </el-form-item>
              </c-col>
            </c-col>
          </el-row>

          <el-row v-show="searchSlot.searchToggle">
            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="版本状态"
                  prop="infcon.relflg"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.relflg"
                    style="width: 100%"
                    placeholder="请选择版本状态"
                  >
                  </c-select>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="当事人编号"
                  prop="infcon.pty.extkey"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.pty.extkey"
                    maxlength="24"
                    placeholder="请输入当事人编号"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="当事人名称"
                  prop="infcon.pty.nam"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.pty.nam"
                    maxlength="40"
                    placeholder="请输入当事人名称"
                  ></c-input>
                </el-form-item>
              </c-col>
            </c-col>

            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="当事人BIC编码"
                  prop="infcon.seapty"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.seapty"
                    maxlength="24"
                    placeholder="请输入当事人BIC编码"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="当事人角色"
                  prop="infcon.searol"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.searol"
                    style="width: 100%"
                    placeholder="请选择当事人角色"
                  >
                  </c-select>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="当事人参考号"
                  prop="infcon.searef"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.searef"
                    maxlength="16"
                    placeholder="请输入当事人参考号"
                  ></c-input>
                </el-form-item>
              </c-col>
            </c-col>

            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="客户经理"
                  prop="infcon.usr.extkey"
                  style="width: 100%"
                >
                  <c-input
                    v-model="model.infcon.usr.extkey"
                    maxlength="8"
                    placeholder="请输入客户经理"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="业务状态"
                  prop="infcon.seasta"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.seasta"
                    style="width: 100%"
                    placeholder="请选择业务状态"
                  >
                    <el-option
                      v-for="item in codes.seasta"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>
              <c-col :span="8">
                <el-form-item
                  label="币种"
                  prop="infcon.seacur"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.seacur"
                    style="width: 100%"
                    placeholder="请选择币种"
                  >
                    <el-option
                      v-for="item in codes.curtxt"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>
            </c-col>

            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="预付款类型"
                  prop="seafintyp"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.seafintyp"
                    style="width: 100%"
                    placeholder="请选择预付款类型"
                  >
                    <el-option
                      v-for="item in codes.boppayattr"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="融资状态"
                  prop="infcon.cxmflg"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.cxmflg"
                    style="width: 100%"
                    placeholder="请选择融资状态"
                  >
                    <el-option
                      v-for="item in codes.ovdflg"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>

              <c-col :span="8">
                <el-form-item
                  label="福费廷转卖类型"
                  prop="infcon.cxmflg"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.cxmflg"
                    style="width: 100%"
                    placeholder="请选择福费廷转卖类型"
                  >
                  </c-select>
                </el-form-item>
              </c-col>
            </c-col>

            <c-col :span="24">
              <c-col :span="8">
                <el-form-item
                  label="福费廷类型"
                  prop="infcon.cxmflg"
                  style="width: 100%"
                >
                  <c-select
                    v-model="model.infcon.cxmflg"
                    style="width: 100%"
                    placeholder="请选择福费廷类型"
                  >
                    <el-option
                      v-for="item in codes.ffttyp"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>
              <c-col :span="8">
                <el-form-item
                  label="金额区间"
                  prop="infcon.seaamtfr"
                  style="width: 100%"
                >
                  <c-col :span="11">
                    <c-input-currency
                      v-model="model.infcon.seaamtfr"
                      placeholder="请输入金额下限"
                    ></c-input-currency>
                  </c-col>
                  <c-col :span="2" style="text-align: center">
                    <label style="display: inline-block; width: 100%">-</label>
                  </c-col>
                  <c-col :span="11">
                    <c-input-currency
                      v-model="model.infcon.seaamtto"
                      placeholder="请输入金额上限"
                    ></c-input-currency>
                  </c-col>
                </el-form-item>
              </c-col>
            </c-col>
          </el-row>
        </el-form> </template
    ></c-list-search>

    <c-col :span="24" style="margin-top: 10px">
      <c-button
        class="medium_bcs"
        size="medium"
        style="margin-left: 0px, padding: 20px 16px"
        type="primary"
        @click="toBptopn"
        >出口融资放款</c-button
      >
    </c-col>

    <c-col :span="24">
      <c-istream-table :list="stmData.data" :columns="stmData.columns">
        <el-table-column fixed="right" prop="op" label="操作" width="140px">
          <template slot="header">
            <c-col :span="11" style="text-align: left"><span>操作</span></c-col>
            <c-col :span="12" style="text-align: right"
              ><c-button icon="el-icon-s-tools"></c-button
            ></c-col>
          </template>
          <template slot-scope="scope">
            <el-popover
              placement="top-start"
              title="历史信息"
              width="800"
              trigger="click"
              :ref="'popover_' + scope.row.IDX"
            >
              <div
                style="
                  text-align: right;
                  margin-top: -30px;
                  margin-right: 5px;
                  font-size: 16px;
                "
              >
                <span
                  class="el-icon-close"
                  @click="closeTrn('popover_' + scope.row.IDX)"
                />
              </div>

              <c-istream-table :list="trnData.data" :columns="trnData.columns">
                <el-table-column prop="op" label="操作" width="0">
                  <template slot-scope="scope">
                    <c-button
                      style="margin-left: 0"
                      size="small"
                      @click="display(scope.row['INR'])"
                    >
                      详情
                    </c-button>
                  </template>
                </el-table-column>
              </c-istream-table>
              <c-button
                style="margin-left: 0"
                size="small"
                @click="getTrnInfo(scope.$index, scope.row)"
                slot="reference"
              >
                详情
              </c-button>
            </el-popover>

            <c-button
              style="margin-left: 0"
              size="small"
              type="primary"
              @click="getButtons(scope.row['出口融资编号'])"
            >
              处理
            </c-button>
          </template>
        </el-table-column>
      </c-istream-table>
    </c-col>

    <m-busbtn
      ref="childs"
      :ownref="ownref"
      :model="BptselModel"
      ownrefPath="bpdgrp"
      trnCode="bptsel"
      @onChoose="onChoose"
      >11</m-busbtn
    >
  </div>
</template>
<script>
import Utils from "~/utils/index";
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Infbpd/Event";
import BusNavbar from "~/views/Public/BusNavbar";

import BptselModel from "~/model/Bptsel";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  components: { "m-busbtn": BusNavbar },
  data() {
    return {
      BptselModel: new BptselModel().data,
      ownref: "",
      initdialog: false,
      dialogTableVisible: false,
      searchToggle: true,
      stmData: {
        columns: [
          '1 1 "出口融资编号" 150',
          '2 2 "客户经理" 80',
          // '19 3 "融资类型" 120',
          {
            index: 19,
            position: 3,
            width: 120,
            pattern: "code",
            label: "融资类型",
            code: this.codes.fintyp_bpd,
          },
          '3 4 "Parent Contract" 120',
          '4 5 "执行利率" 120',   
          '22 6 "Pta .No" 120',
          '23 7 "当事人编号" 200',
          '24 8 "Advanced Party" 200',
          '25 9 "Advanced CN" 200',
          '5 10 "融资状态" 100',
          '6 11 "融资账号" 100',
          '31 12 "组织机构代码" 100',
          '7 13 "开立日期" 80',
          '8 14 "关闭日期" 80',
          '18 15 "参考指标" 80',
          '27 16 "单据金额币种" 100',
          '28 17 "单据金额" 110',
          '29 18 "余额币种" 100',
          '30 19 "余额" 110',
          '9 20 "融资天数" 80',
          '26 21 "Pty .No" 120',
          '10 22 "福费廷类型" 120',
          '11 23 "福费廷转卖类型" 150',
          '12 24 "卖出日期" 80',
          '13 25 "包买行SWIFT号" 120',
          '14 26 "包买行英文名称" 120',
          '15 27 "包买行融资到期日" 150',
          '16 28 "包买行汇入我行款项金额" 200',
          '17 29 "我行卖出执行利率" 150',
          '20 30 "开证行BIC编码" 120',
          '21 31 "开证行BIC名称" 120',
        ],
        data: [],
      },
      trnData: {
        columns: [
          '1 1 "编号" 200',
          '2 2 "交易名称" 130',
          // '3 3 "日期" 200',
          { index: 3, position: 3, width: 110, pattern: "date", label: "日期" },
          // '4 4 "状态" 50',
          {
            index: 4,
            position: 4,
            width: 100,
            pattern: "code",
            label: "状态",
            code: this.codes.relstaEN,
          },
          '5 5 "币种" 80',
          '6 6 "金额" 100',
        ],
        data: [],
      },
    };
  },
  methods: {
    ...Event,
    async getButtons(ownref) {
      this.ownref = ownref;
      this.$refs.childs.initdialog = true;
      console.log("ownref:" + ownref);
    },
    async onChoose(code) {
      //跳转交易
      this.$router.history.push("/business/" + code);
      this.$refs.childs.initdialog = false;
    },
    async getDitSelInfo(code) {
      //跳转交易
      this.$router.history.push("/business/" + code);
      this.$refs.childs.initdialog = false;
    },
    async getTrnInfo(idx, row) {
      this.model.infcon.objinr = row["INR"];
      this.model.bpdgrp.rec.inr = row["INR"];
      this.model.infcon.chksubcon = "X";
      this.dialogTableVisible = true;
      let rtnmsg = await this.executeDefault("infcon.chksubcon");

      if ((rtnmsg.respCode = SUCCESS)) {
        this.trnData.data = rtnmsg.data.infcon_trnstm.rows;
      }
    },
    closeTrn(refId) {
      this.$refs[refId].doClose();
    },
    toBptopn() {
      this.$router.history.push("/business/bptopn");
    },
    toBPTSET() {
      this.$router.history.push("/business/bptset");
    },
    toBPTAME() {
      this.$router.history.push("/business/bptame");
    },
    toBPTCRF() {
      this.$router.history.push("/business/bptcrf");
    },
    toBPTCAN() {
      this.$router.history.push("/business/bptcan");
    },
  },
  created: function () {},
};
</script>
<style>
</style>