<template>
  
 <c-content class="eibs-tab" :height="200">
  <c-infsearch-group @handleSearch="onInfbutSearow" @handleReset="onInfbutClr">
    
    <!-- 持续展示区 -->
  <template slot="keepShow">
    <c-row>
      <c-col :span="24">
        <c-col :span="12">
          <el-form-item label="Own Reference" prop="infcon.seaownref">
            <c-input  v-model="model.infcon.seaownref" maxlength="16"  placeholder="请输入Own Reference"></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="12">
          <el-form-item label="Name" prop="infcon.nam">
            <c-input  v-model="model.infcon.nam" maxlength="40"  placeholder="请输入Name"></c-input>
          </el-form-item>
        </c-col>
      </c-col>
    </c-row>
  </template>

   <!-- 可控展示区 -->
   <template slot="changeShow">
    <c-row>
      <c-col :span="24">
       <c-col :span="12">
        <el-form-item label="Party Reference" prop="infcon.searef">
            <c-input  v-model="model.infcon.searef" maxlength="16"  placeholder="请输入Party Reference"></c-input>
        </el-form-item>
       </c-col>
      </c-col>

      <c-col :span="24">
       <c-col :span="12">
        <el-form-item label="Select Single Party" prop="infcon.pty.extkey">
            <c-input  v-model="model.infcon.pty.extkey" maxlength="24"  placeholder="请输入Select Single Party"></c-input>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="12">
        <el-form-item label="External Visible Name" prop="infcon.pty.nam">
            <c-input  v-model="model.infcon.pty.nam" maxlength="40"  placeholder="请输入External Visible Name"></c-input>
        </el-form-item>
       </c-col>
      </c-col>

      <c-col :span="24">
       <c-col :span="12">
        <el-form-item label="Party Name/BIC" prop="infcon.seapty">
            <c-input  v-model="model.infcon.seapty" maxlength="24"  placeholder="请输入Party Name/BIC"></c-input>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="12">
        <el-form-item label="Role" prop="infcon.searol">
            <c-select v-model="model.infcon.searol" style="width:100%" placeholder="请选择Role">
              </c-select>
        </el-form-item>
       </c-col>
      </c-col>

      <c-col :span="24">
       <c-col :span="6">
        <el-form-item label="Opening between" prop="infcon.opndatfrom">
            <c-date-picker type="date"  v-model="model.infcon.opndatfrom" style="width:100%"  placeholder="请选择Opening between"></c-date-picker>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="6">
        <el-form-item label="Open Date to" prop="infcon.opndatto">
            <c-date-picker type="date"  v-model="model.infcon.opndatto" style="width:100%"  placeholder="请选择Open Date to"></c-date-picker>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="6">
        <el-form-item label="User ID" prop="infcon.usr.extkey">
            <c-input  v-model="model.infcon.usr.extkey" maxlength="8"  placeholder="请输入User ID"></c-input>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="6">
        <el-form-item label="Status" prop="infcon.seasta">
            <c-select v-model="model.infcon.seasta" style="width:100%" placeholder="请选择Status">
              </c-select>
        </el-form-item>
       </c-col>
      </c-col>

      <c-col :span="24">
       <c-col :span="12">
        <c-col :span="12">
          <el-form-item label="Currency" prop="infcon.seacur">
            <c-select v-model="model.infcon.seacur" style="width:100%" placeholder="请选择Currency">
              </c-select>
          </el-form-item>
        </c-col>
       </c-col>
       <c-col :span="6">
        <el-form-item label="Amount between" prop="infcon.seaamtfr">
            <c-input  v-model="model.infcon.seaamtfr"  placeholder="请输入Amount between"></c-input>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="6">
        <el-form-item label="Amount to" prop="infcon.seaamtto">
            <c-input  v-model="model.infcon.seaamtto"  placeholder="请输入Amount to"></c-input>
        </el-form-item>
       </c-col>
      </c-col>

      <c-col :span="24">
       <c-col :span="12">
        <c-col :span="12">
          <el-form-item label="Document Type" prop="seadoctypcod">
            <c-select v-model="model.seadoctypcod" style="width:100%" placeholder="请选择Document Type">
              </c-select>
          </el-form-item>
        </c-col>
       </c-col>

       <c-col :span="12">
        <c-col :span="12">
	       <c-checkbox v-model="model.infcon.forflg">转卖单据</c-checkbox>
        </c-col>

        <c-col :span="12">
          <el-form-item label="是否通过电证系统" prop="elcflg">
            <c-select v-model="model.elcflg" style="width:100%" placeholder="请选择是否通过电证系统">
              </c-select>
          </el-form-item>
        </c-col>
       </c-col>           

      </c-col>

    </c-row>
   </template>

  </c-infsearch-group>
        <!--
        <c-row style="margin-top:20px; padding: 0 10px 0 10px;">
            <c-col>
                <c-button size="small" type="primary">导Excel</c-button>
                <c-button size="small" type="primary"
                @click="onInfbutDsp"
                :disabled="model.infbut.selrow === 0"
                >Display</c-button>
                <c-button size="small" type="primary">Use</c-button>
            </c-col>
        </c-row>
        -->
      <c-col :span="24">
        <c-istream-table :list="stmData.data" :columns="stmData.columns">
          <el-table-column fixed="right" prop="op" label="操作" width="150px">
            <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.$index, scope.row)"
                      >
                        详情
                      </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['Reference'], 'bftdrv')"
              >
                寄单索款修改
              </c-button>
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['Reference'], 'bftdcr')"
              >
                电提不符点/开证行拒付
              </c-button>   
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['Reference'], 'bftsnd')"
              >
                寄单
              </c-button>   
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['Reference'], 'bftacc')"
              >
                承兑
              </c-button>  
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['Reference'], 'bftset')"
              >
                收款
              </c-button>
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['Reference'], 'bftcan')"
              >
                注销
              </c-button>
            </template>
          </el-table-column>
        </c-istream-table>
      </c-col>
      <!--
        <c-row style="margin-top:20px; padding: 0 10px 0 10px;">
            <c-istream-table :border="true" 
              :list="tableData" 
              :columns="stmData.columns"
              v-on:chooseRowEvent="chooseRowEvent"
              style="width:80%,text-align:center">
            </c-istream-table>
        </c-row>
      -->
    <!--
    <c-row>          
       <c-col :span="24">
        <c-istream-table :list="model.infbut.dspstm" :columns="stmData.columns">
        </c-istream-table>
       </c-col>
    </c-row> 
    -->
          
  </c-content>
</template>
<script>
import Api from "~/service/Api"
import CommonProcess from "~/mixin/CommonProcess";
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Infbfd/Event"

export default {
    inject: ['root'],
    props:["model","codes"],
    mixins: [CommonProcess],
    data(){
        return {
            ownref: "",
            initdialog: false,
            dialogTableVisible: false,
      trnData: {
        columns: [
          '1 1 "编号" 200',
          '2 2 "交易名称" 100',
          '3 3 "日期" 200',
          '4 4 "状态" 50',
          '5 5 "币种" 80',
          '6 6 "金额" 80',
        ],
        data: [],
      },

                stmData: {
                    columns: [
                        "2 1 \"Reference\" 100 ",
                        "3 2 \"Resp. User\" 100 ",
                        "6 3 \"Party Number\" 150 ",
                        "7 4 \"Applicant\" 150 ",
                        "8 5 \"Party Number\" 150 ",
                        "9 6 \"Beneficiary\" 150 ",                        
                        "10 7 \"Party Number\" 150 ",
                        "11 8 \"Issuing Bank\" 150 ",
                        "12 9 \"Party Number\" 150 ",
                        "13 10 \"Purchasing bank\" 150 ",
                        "1 11 \"转卖日期\" 150 ",
                        "4 12 \"Opened\" 150 ",                        
                        "5 13 \"Closed\" 150 ", 
                        "14 14 \"Cur\" 50 ",                        
                        "16 15 \"Cur\" 50 ",                         
                        "15 16 \"Doc.Amount\" 150 ",                        
                        "17 17 \"Open Amount\" 150 ", 
                    ],
                    data:[
                      
                    ],
                },
        }
    },
    /*
	computed: {
    tableData() {
      // "10000449\t2000007350\t2000007350-001\tBEIJING TESTTEST,BEIJING, CHINA\t\t100080\tBEIJING, CHINA\tTEST TEST1 CO.,LTD."
      console.log(this.model.infbut.dspstm.rows)
      return this.model.infbut.dspstm.rows;
    },
  },
  */
    methods:{ 
      ...Event,
        async getButtons(ownref, frm){
        this.initdialog = true
        this.ownref = ownref
        console.log("ownref:" +ownref);
        // setTimeout(()=>{
        // // this.$refs.childs.$emit("childmethods")
        // console.log(this)
        // console.log(this.$refs)
        // console.log(this.$refs.childs)
        // },10)
        this.$router.history.push({ path: "/business/" + frm, query: { ownref } })
      },
        async  onChoose(code){
            //跳转交易
          this.$router.history.push("/business/" + code) 
          this.initdialog = false                    
        },
    async getTrnInfo(idx, row) {

      this.model.infcon.objinr = row["INR"];
      this.model.bfdgrp.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();
    }

      },
    created:function(){

    }
}
</script>
<style>

</style>
