<template>
 <c-row>

 <c-row>
  <!-- ====================左边======================= -->
  <c-col :span="11">
   <c-col :span="24">
        <c-col :span="22">
          <el-form-item
            label="Reference"
            prop="bodgrp.rec.ownref"
            style="width: 100%"
          >
            <c-input
              v-model="model.bodgrp.rec.ownref"
              maxlength="16"
              placeholder="请输入Reference"
              style="width: 95%"
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
          <c-col :span="2">
              <c-button
               style="margin:0 10px 0 0;padding: 0 10px;"
                size="small"
                type="primary"
                icon="el-icon-search"
                @click="onSeainf"
              ></c-button>
          </c-col>
    </c-col>

    <c-col :span="12">
        <el-form-item label="Document Amount" prop="bodgrp.cbs.max.cur">
          <c-select
            disabled
            v-model="model.bodgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择Currency"
            
          >
            <el-option
              v-for="item in codes.cur"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
    </c-col>
	<c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="5px"
          prop="bodgrp.cbs.max.amt"
        >
          <c-input-currency
          disabled
            v-model="model.bodgrp.cbs.max.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Document Amount"
            @keyup.enter.native="defaultFunction('bodgrp.cbs.max.amt', model.bodgrp.cbs.max.amt)"
          ></c-input-currency>
        </el-form-item>
    </c-col>
    <c-col :span="12">
        <el-form-item label="Open Amount" prop="bodgrp.cbs.opn1.cur">
          <c-select
            disabled
            v-model="model.bodgrp.cbs.opn1.cur"
            style="width: 100%"
            placeholder="请选择Currency"
          >
            <el-option
              v-for="item in codes.cur"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
    </c-col>
	<c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="5px"
          prop="bodgrp.cbs.opn1.amt"
        >
          <c-input-currency
          disabled
            v-model="model.bodgrp.cbs.opn1.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Warehouse/Insurance"
            @keyup.enter.native="defaultFunction('bodgrp.cbs.opn1.amt', model.bodgrp.cbs.opn1.amt)"
          ></c-input-currency>
        </el-form-item>
    </c-col>

    <c-col :span="24">
        <el-form-item label="Collection Condition" prop="bodgrp.rec.doctypcod">
            <c-select 
            disabled
                v-model="model.bodgrp.rec.doctypcod" 
                style="width:100%" 
                placeholder="请选择Collection Condition" 
            >
            <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="24">
        <el-form-item label="Document Set Status" prop="bodgrp.rec.docsta">
            <c-input  disabled v-model="model.bodgrp.rec.docsta" maxlength="40"  placeholder="请输入Document Set Status"></c-input>
        </el-form-item>
    </c-col>
    <c-col :span="18">
        <el-form-item label="Tenor Specification" prop="bodgrp.rec.matdat" >
            <c-date-picker type="date" disabled v-model="model.bodgrp.rec.matdat" style="width:100%"  placeholder="请选择Maturity Date"></c-date-picker>
        </el-form-item>
    </c-col>
    <c-col :span="5">
        <el-form-item label="" label-width="5px" >
         <c-input disabled v-model="model.bodgrp.rec.matpercnt"  placeholder="请输入Tenor Specification" ></c-input>
         </el-form-item>
    </c-col>
    <c-col :span="1">
        <el-form-item label="Days" label-width="5px" >
       </el-form-item>
    </c-col>
    <c-col :span="24">
        <el-form-item label="  " prop="bodgrp.rec.matperbeg">
            <c-select disabled v-model="model.bodgrp.rec.matperbeg" style="width:100%" placeholder="请选择Start of Maturity Period MATBEG">
              <el-option
              v-for="item in codes.matperbeg"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
              </c-select>
        </el-form-item>
    </c-col>
    <c-col :span="12">
        <el-form-item label="Order Date" prop="bodgrp.rec.rcvdat">
            <c-date-picker type="date" disabled v-model="model.bodgrp.rec.rcvdat" style="width:100%"  placeholder="请选择Order Date"></c-date-picker>
        </el-form-item>
    </c-col>
    <c-col :span="12">
        <el-form-item label="Presentation Date" prop="bodgrp.rec.predat">
            <c-date-picker type="date" disabled v-model="model.bodgrp.rec.predat" style="width:100%"  placeholder="请选择Presentation Date"></c-date-picker>
        </el-form-item>
    </c-col>
  
   </c-col>
   <!-- ====================右边======================= -->
   <c-col :span="11" :offset="1">
   <c-col :span="24">
        <el-form-item label="摘要" prop="bodgrp.rec.nam">
          <c-input
            align="middle"
            v-model="model.bodgrp.rec.nam"
            maxlength="40"
            disabled
            placeholder="请输入Externally Displayed Name to Identify the Contract"
          ></c-input>
        </el-form-item>
    </c-col>

     <c-col :span="24">
        <el-form-item label="Drawer Ref" prop="bodgrp.drr.pts.ref">
            <c-input disabled v-model="model.bodgrp.drr.pts.ref" maxlength="16"  placeholder="请输入Drawer"></c-input>
        </el-form-item>
     </c-col>
     <c-col :span="24">
        <el-form-item label="" prop="bodgrp.drr.pts.nam">
            <c-input disabled v-model="model.bodgrp.drr.pts.nam" maxlength="40"  placeholder="请输入Name of Party"></c-input>
        </el-form-item>
     </c-col>
     <c-col :span="24">
        <el-form-item label="Collecting Bank Ref" prop="bodgrp.col.pts.ref">
            <c-input disabled v-model="model.bodgrp.col.pts.ref" maxlength="16"  placeholder="请输入Collecting Bank"></c-input>
        </el-form-item>
     </c-col>
                  
     <c-col :span="24">
        <el-form-item label="" prop="bodgrp.col.pts.nam">
            <c-input disabled v-model="model.bodgrp.col.pts.nam" maxlength="40"  placeholder="请输入Name of Party"></c-input>
        </el-form-item>
     </c-col>
     <c-col :span="24">
        <el-form-item label="Drawee Ref" prop="bodgrp.dre.pts.ref">
            <c-input disabled v-model="model.bodgrp.dre.pts.ref" maxlength="16"  placeholder="请输入Drawee"></c-input>
        </el-form-item>
     </c-col>
     <c-col :span="24">
        <el-form-item label="" prop="bodgrp.dre.pts.nam">
            <c-input disabled v-model="model.bodgrp.dre.pts.nam" maxlength="40"  placeholder="请输入Name of Party"></c-input>
        </el-form-item>
     </c-col>    
    </c-col>

     </c-row>



<div class="line" />
                <hr />

<!-- next part -->
    <c-col :span="24" style="margin-bottom: 35px">
      <c-istream-table
        ref="table"
        :list="model.liaall.tenstm.rows || []"
        :columns="stmData.columns"
        :showSelection="true"
        v-on:multipleSelect="multipleSelect"
      >
      </c-istream-table>
    </c-col>

    <c-col :span="12">
     <c-col :span="24">
	    <c-checkbox v-model="model.bodgrp.rec.focflg">Free of Payment</c-checkbox>
     </c-col>   
     <c-col :span="12">
        <el-form-item label="Reduction Amt." prop="bodgrp.cbs.max.cur">
          <c-select
            disabled
            v-model="model.bodgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择Currency"
            
          >
            <el-option
              v-for="item in codes.cur"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
    </c-col>
	<c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="5px"
          prop="bodgrp.cbs.max.amt"
        >
          <c-input-currency :disabled="model.bodgrp.rec.focflg=='X'"
            v-model="model.bodgrp.cbs.max.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Reduction Amt"
            @keyup.enter.native="defaultFunction('bodgrp.cbs.max.amt', model.bodgrp.cbs.max.amt)"
          ></c-input-currency>
        </el-form-item>
     </c-col>
     <c-col :span="24">
	    <c-checkbox v-model="model.mtabut.clsflgp" >Close Contract</c-checkbox>
     </c-col>


    <c-col :span="12">
        <el-form-item label="Settle Amt." prop="bodgrp.cbs.max.cur">
          <c-select
            disabled
            v-model="model.bodgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择Currency"
            
          >
            <el-option
              v-for="item in codes.cur"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
    </c-col>
	<c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="5px"
          prop="bodgrp.cbs.max.amt"
        >
          <c-input-currency
            v-model="model.bodgrp.cbs.max.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Settle Amt."
            @keyup.enter.native="defaultFunction('bodgrp.cbs.max.amt', model.bodgrp.cbs.max.amt)"
          ></c-input-currency>
        </el-form-item>
    </c-col>
   </c-col>

   <c-col :span="24" style="height: 24px; margin-top: 20px">
      <el-form-item label="Bills to Pay Back" class="messageLabel">
      </el-form-item>
    </c-col>
    <c-col :span="24" style="height: 0px; margin-top: 5px">
      <el-divider></el-divider>
    </c-col>
    <c-col :span="24">
      <c-table :data="model.bptbck.bckgrdp" style="width: 100%">
        <el-table-column prop="ownref" label="Reference" width="389px">
        </el-table-column>
        <el-table-column prop="opncur" label="Cur" width="389px">
        </el-table-column>
        <el-table-column prop="opnamt" label="Open Amount" width="389px">
        </el-table-column>
        <el-table-column prop="bckamt" label="Amount Paid" width="389px">
        </el-table-column>
      </c-table>
    </c-col>




 </c-row> 
</template>
<script>
import Api from "~/service/Api"
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Botset/Event"

export default {
    inject: ['root'],
    props:["model","codes"],
    mixins: [commonProcess],
    data(){
        return {
          stmData: {
        columns: [
          '1 1 "Type" 250',
          '2 2 "Dbt" 250',
          '3 3 "Cdt" 250',
          '4 4 "Cur" 250',
          '5 5 "Amt" 250 2 8 1 4',
          '6 6 "Mat.Dat." 250 4 7 1',
        ],
        data: [],
      },    
    }
    },
    computed: {
    clsflgp: {
      get() {
        return this.model.mtabut.clsflgp === "O";
      },
      set(val) {
        this.model.mtabut.clsflgp = val ? "C" : "O";
      },
    },
    focflg: {
      get() {
        return this.model.bedgrp.rec.focflg === "X";
      },
      set(val) {
        this.model.bedgrp.rec.focflg = val ? "X" : "";
      },
    },
    flag() {
      return this.model.mtabut.coninf.usr.extkey == "";
    },
  },
  mounted() {
    this.$nextTick(() => {});
  },

    methods:{...Event,
    async multipleSelect(selection) {
      console.log(selection);
      if (selection) {
        let selIds = selection.map((x) => x + 1);
        let params = { selDst: "liaall.tenstm", selIds };
        const rtnmsg = await this.executeRule("liaall.tenstm", params);
        if (rtnmsg.respCode == SUCCESS) {
          this.updateModel(rtnmsg.data);
        } else {
          this.$notify.error({ title: "错误", message: "服务请求失败！" });
        }
      }
    },
    },

    created:function(){

    }
}
</script>
<style>

</style>