<template>
  <div class="eibs">
    <c-list-search @form-reset="handleReset" @form-search="handleSearch">
      <!-- 持续展示区 -->
      <template v-slot="searchSlot">
        <el-form class="m-table-search-form" ref="paramsForm" label-position="right" label-width="110px"
          size="small">
          <el-row>
              <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" v-model="model.infcon.opndatfrom" value-format="yyyy-MM-dd"
                      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" v-model="model.infcon.opndatto" value-format="yyyy-MM-dd"
                      style="width:100%" placeholder="请选择开立日期"></c-date-picker>
                  </c-col>
                </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>
          </el-row>

          <el-row v-show="searchSlot.searchToggle">
              <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.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.searol" style="width: 100%">
                  <c-select v-model="model.infcon.searol" style="width: 100%" placeholder="请选择角色">
                    <el-option v-for="item in codes.searol" :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.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 :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.curtxt1" style="width: 100%">
                  <c-select v-model="model.infcon.curtxt1" style="width: 100%" placeholder="请选择币种">
                    <el-option v-for="item in codes.curtxt1" :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.nam" style="width: 100%">
                  <c-input v-model="model.infcon.nam" maxlength="40" placeholder="请输入简略信息"></c-input>
                </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 v-model="model.infcon.seaamtfr" placeholder="请输入金额区间"></c-input>
                  </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 v-model="model.infcon.seaamtto" placeholder="请输入金额区间"></c-input>
                  </c-col>
                </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="doctypcod" style="width: 100%">
                  <c-select v-model="model.infcon.doctypcod" style="width: 100%" placeholder="请选择付款条件">
                    <el-option v-for="item in codes.doctypcod" :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="godcod" style="width: 100%">
                  <c-select v-model="model.infcon.godcod" style="width:100%" placeholder="请选择货物类型">
                    <el-option v-for="item in codes.godcod" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </c-select>
                </el-form-item>
              </c-col>
          </el-row>
        </el-form>
      </template>
    </c-list-search>


    <el-col :span="24" style="margin-top: 10px">
      <c-button class="medium_bcs" size="medium" style="margin-left: 0px" type="primary" @click="toBctdav">进口代收到单通知</c-button>
    </el-col>

    <div style="height:90%">
    <c-col :span="24">
      <c-istream-table :list="stmData.data" :columns="stmData.columns" :showButtonFlg="true">
        <el-table-column fixed="right" prop="op" width="140px">
          <template slot="header">
            <c-col :span="11" style="text-align: center"><span>操作</span></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: 5px" size="small" type="primary" @click="getButtons(scope.row['代收编号'], scope.row['关闭日期'])">处理
            </c-button>
          </template>
        </el-table-column>
      </c-istream-table>
    </c-col>
  </div>

    <m-busbtn ref="childs" :ownref="ownref" :model="BctselModel" ownrefPath="bcdgrp" trnCode="bctsel"
      @onChoose="onChoose">11</m-busbtn>

  </div>
</template>
<script>
import Api from "~/service/Api"
import commonProcess from "~/mixin/commonProcess"
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Infbcd/Event"

import BctselModel from "~/model/Bctsel"
import BusNavbar from "~/views/Public/BusNavbar";

export
  default {
    inject: ['root'],
    props: ["model", "codes"],
    mixins: [commonProcess],
    components: { "m-busbtn": BusNavbar },
    data() {
      return {
        BctselModel: new BctselModel().data,
        ownref: "",
        dialogTableVisible: false,
        trnData: {
          columns: [
            '1 1 "编号" 200',
            '2 2 "交易名称" 120',
            // '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 "金额" 110',
          ],
          data: [],
        },
        stmData: {
          columns: [
            "1 1 \"代收编号\" 150",
            "2 2 \"客户经理\" 120",
            "6 3 \"分行名称\" 170",
            "8 4 \"付款人编号\" 170",
            "9 5 \"付款人\" 300",
            "10 6 \"付款人 CN\" 130",
            "11 7 \"收款人编号\" 170",
            "12 8 \"收款人\" 150",
            "7 9 \"Pta.No\" 130",
            "13 10 \"托收行编号\" 220",
            "14 11 \"托收行\" 200",
            "5 12 \"货物类型\" 130 1 0 1 GODCOD",
            "3 13 \"开立日期\" 150 4 7",
            "4 14 \"关闭日期\" 150 4 7",
            "15 15 \"金额币种\" 150",
            "16 16 \"代收金额\" 120 2 8 1 15",
            "17 17 \"余额币种\" 150",
            "18 18 \"代收余额\" 130 2 8 1 17",
          ],
          data: []

        }
      }
    },
    methods: {
      ...Event,
      async getButtons(ownref, closedDate) {
        this.BctselModel.clsflg = (closedDate ?? "").trim() === "" ? "" : "C";
        this.$refs.childs.initdialog = true
        this.ownref = ownref
        console.log("ownref:" + ownref);
      },
      async onChoose(code, prePageId) {
        //跳转交易
        // this.$router.history.push("/business/" + code)
        this.$router.push({ name: code.charAt(0).toUpperCase() + code.substring(1), params: { prePageId } });
        this.$refs.childs.initdialog = false
      },
      closeTrn(refId) {
        this.$refs[refId].doClose();
      },
      async getTrnInfo(idx, row) {

        this.model.infcon.objinr = row["INR"];
        this.model.bcdgrp.rec.inr = row["INR"];
        this.model.infcon.chksubcon = "X";

        this.dialogTableVisible = true;

        let rtnmsg = await this.executeDefault("infcon.chksubcon");
        console.log(rtnmsg);
        console.log(this.model.infcon.chksubcon);

        if ((rtnmsg.respCode = SUCCESS)) {
          this.trnData.data = rtnmsg.data.infcon_trnstm.rows;
          console.log(this.trnData.data);
        }
      },
      async getDitSelInfo(code) {
        //跳转交易
        this.$router.history.push("/business/" + code)
        this.$refs.childs.initdialog = false

      },
      toBctdav() {
        this.$router.history.push("/business/bctdav")
      }
    },
    created: function () {

    }
  }</script>
<style>
.m-table-search {
  padding: 20px 0px 10px 0px;
}
</style>