<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">
          <c-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" 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="请选择Open Date to"></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>
            </c-col>
          </c-row>

          <c-row v-show="searchSlot.searchToggle">
            <c-col :span="24">
              <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.searol1" :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="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>

            <c-col :span="24">
              <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="请输入Amount to"></c-input>
                  </c-col>
                </el-form-item>
              </c-col>

              <!-- <c-col :span="8">
                <el-form-item label="User ID" 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>

            <c-col :span="24">
              <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>
          </c-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" type="primary" @click="toBotdav">寄单</c-button>
    </c-col>

    <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>

    <m-busbtn ref="childs" :ownref="ownref" :model="BotselModel" ownrefPath="bodgrp" trnCode="botsel"
      @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/Infbod/Event";

import BotselModel from "~/model/Botsel"
import BusNavbar from "~/views/Public/BusNavbar";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  components: { "m-busbtn": BusNavbar },
  data() {
    return {
      BotselModel: new BotselModel().data,
      ownref: "",
      initdialog: false,
      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',
          '3 3 "开立日期" 150 4 7',
          '4 4 "关闭日期" 150 4 7',
          '5 5 "分行名称" 200',
          '6 6 "付款人编号" 170',
          '7 7 "付款人" 133',
          '8 8 "PTA NO." 100',
          '9 9 "收款人编号" 170',
          '10 10 "收款人" 300',
          '11 11 "Invoice No." 133',
          '12 12 "Drawer CN" 150',
          '13 13 "代收行编号" 200',
          '14 14 "代收行" 200',
          '15 15 "金额币种" 150',
          '16 16 "托收金额" 120 2 8 1 15',
          '17 17 "余额币种" 150',
          '18 18 "托收余额" 130 2 8 1 -1'
        ],
        data: [],
      },
    };
  },
  methods: {
    ...Event,
    async getButtons(ownref, closedDate) {
      this.$refs.childs.initdialog = true
      this.ownref = ownref
      this.BotselModel.clsflg = (closedDate ?? "").trim() === "" ? "" : "C";
      console.log("ownref:" + ownref);
    },
    async onChoose(code) {
      //跳转交易
      this.$router.history.push("/business/" + code)
      this.$refs.childs.initdialog = false
    },
    closeTrn(refId) {
      this.$refs[refId].doClose();
    },
    async getTrnInfo(idx, row) {

      this.model.infcon.objinr = row["INR"];
      this.model.bodgrp.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;
        console.log(this.trnData.data);
      }
    },
    async getDitSelInfo(idx, row) {
      //TD中选中行触发
      var params = { selDst: "infbut.dspstm", selIds: [idx + 1] }
      let rtnmsg = await this.executeRule("infbut.dspstm", params);
      if (rtnmsg.respCode = SUCCESS) {
        this.updateModel(rtnmsg.data);
        // Utils.copyValueFromVO(this.model, rtnmsg.data);
        //TD中点击display时触发
        params = { selDst: "infbut.dsp", selIds: [idx + 1] }
        let rtnmsgNew = await this.executeRule("infbut.dsp", params);

        if (rtnmsgNew.respCode = SUCCESS) {
          console.log(rtnmsgNew);
          this.updateModel(rtnmsgNew.data);

          let rtnmsgOitset = await this.executeDefault("mtabut.coninf.oitset.oit");

          if (rtnmsgOitset.respCode = SUCCESS) {
            Utils.copyValueFromVO(this.model, rtnmsgOitset.data);

          }

        }
      }
      //触发父组件中updateShowPanel 事件，修改index中showPanel ，控制 index中组件的显示和隐藏
      this.$emit('updateShowPanel', true)

    },
    toBotdav() {
      this.$router.history.push("/business/botdav")
    }
  },
  created: function () { },
};
</script>
<style>

</style>