<template>
  <div class="eibs-tab">
    <!-- ======================top--left================== -->
    <el-col :span="11">
      <el-col :span="24">
        <el-form-item label="Parent Contract" prop="trdgrp.rec.ownref">
          <c-input
            v-model="model.trdgrp.rec.ownref"
            maxlength="16"
            style="width: 80%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="Our Reference" prop="trdgrp.rec.ownref">
          <c-input
            v-model="model.trdgrp.rec.ownref"
            maxlength="16"
            style="width: 80%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
    </el-col>
    <!-- ======================top--right==================== -->
    <el-col :span="11" :offset="1">
      <el-col :span="24">
        <el-form-item label="Name">
          <c-input
            v-model="temp1"
            maxlength="40"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="Name" prop="trdgrp.rec.nam">
          <c-input
            v-model="model.trdgrp.rec.nam"
            maxlength="40"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
    </el-col>

    <!-- <el-col :span="24"><div style="height: 50px"></div></el-col> -->
    <!--=========================middle--left==================  -->
    <el-col :span="11" style="margin-top: 30px">
      <el-col :span="24">
        <el-form-item label="Finance Date" prop="trdgrp.rec.issdat">
          <c-input
            v-model="model.trdgrp.rec.issdat"
            style="width: 50%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <!-- <el-col :span="24">
        <el-form-item label="Drag  Drop Sender">
          <c-input
            v-model="model.fipp.ptsget.sdamod.dadsnd"
            placeholder="请输入Drag  Drop Sender"
          ></c-input>
        </el-form-item>
      </el-col> -->
      <el-col :span="24">
        <el-form-item label="Finance Type" prop="trdgrp.rec.fintyp">
          <c-input
            v-model="model.trdgrp.rec.fintyp"
            style="width: 85%"
            placeholder=""
            readonly
          >
          </c-input>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="Financing of">
          <c-input
            v-model="temp2"
            style="width: 20%"
            placeholder=""
            readonly
          ></c-input>
          %
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="Finance Amount" prop="trdgrp.fip.namelc">
          <el-col :span="5">
            <c-input
              v-model="model.trdgrp.fip.namelc"
              style="width: 70%"
              placeholder=""
              readonly
            ></c-input>
          </el-col>
          <el-col :span="10">
            <c-input
              v-model="temp2"
              style="width: 100%"
              placeholder=""
              readonly
            ></c-input>
          </el-col>
        </el-form-item>
      </el-col>
      <!-- <el-col :span="24">
        <el-form-item label="Chinese address">
          <c-input
            type="textarea"
            v-model="model.trdgrp.fip.dbfadrblkcn"
            maxlength="35"
            show-word-limit
            placeholder="请输入Chinese address"
          ></c-input>
        </el-form-item>
      </el-col> -->
    </el-col>
    <!-- =====================middle--right===================== -->
    <el-col :span="11" :offset="1" style="margin-top: 30px">
      <el-col :span="24">
        <el-form-item label="Financed Party Ref." prop="trdgrp.fip.pts.ref">
          <c-input
            v-model="model.trdgrp.fip.pts.ref"
            maxlength="16"
            style="width: 90%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <!-- <el-col :span="24">
        <el-form-item label="External Key of Address">
          <c-input
            v-model="model.trdgrp.fip.pts.extkey"
            maxlength="16"
            placeholder="请输入External Key of Address"
          ></c-input>
        </el-form-item>
      </el-col> -->

      <el-col :span="16">
        <el-form-item label="" prop="fipp.ptsget.sdamod.seainf">
          <c-input
            v-model="model.fipp.ptsget.sdamod.seainf"
            placeholder=""
            style="width: 100%"
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
      <el-col :span="5" :offset="1">
        <c-button size="small" type="primary" @click="onFippDet"> i </c-button>
        <c-button size="small" type="primary" @click="onFippDet">
          Details
        </c-button>
      </el-col>

      <el-col :span="24">
        <el-form-item label="" prop="trdgrp.fip.adrelc">
          <c-input
            type="textarea"
            v-model="model.trdgrp.fip.adrelc"
            maxlength="150"
            style="width: 90%"
            show-word-limit
            placeholder=""
            readonly
            rows="4"
          ></c-input>
        </el-form-item>
      </el-col>
      <!-- <el-col :span="24">
        <el-form-item label="Address Block">
          <c-input
            type="textarea"
            v-model="model.trdgrp.fip.pts.adrblk"
            maxlength="35"
            show-word-limit
            placeholder="请输入Address Block"
          ></c-input>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="地址">
          <c-input
            type="textarea"
            v-model="model.trdgrp.fip.adrelc"
            maxlength="35"
            show-word-limit
            placeholder="请输入地址"
          ></c-input>
        </el-form-item>
      </el-col> -->
    </el-col>

    <!-- <el-col :span="24"><div style="height: 50px"></div></el-col> -->
    <!-- ==========================bottom-left========================== -->
    <el-col :span="11" style="margin-top: 20px">
      <el-col :span="24">
        <el-form-item label="融资金额" prop="trdgrp.cbs.max.amt">
          <el-col :span="5">
            <c-input
              v-model="model.trdgrp.cbs.max.amt"
              style="width: 70%"
              placeholder=""
              readonly
            ></c-input>
          </el-col>
          <el-col :span="14">
            <c-input
              v-model="temp2"
              style="width: 90%"
              placeholder=""
              readonly
            ></c-input>
          </el-col>
          <el-col :span="5">
            <c-input
              v-model="temp2"
              style="width: 70%"
              placeholder=""
              readonly
            ></c-input>
            %
          </el-col>
        </el-form-item>
      </el-col>

      <!-- <el-col :span="24">
        <el-form-item label="%">
          <c-input
            v-model="model.finmod.fincod"
            maxlength="17"
            placeholder="请输入%"
          ></c-input>
        </el-form-item>
      </el-col> -->

      <el-col :span="24">
        <el-form-item label="计息周期" prop="finmod.intprd">
          <c-input
            v-model="model.finmod.intprd"
            style="width: 60%"
            placeholder=""
            readonly
          >
          </c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="利率调整方式" prop="finmod.ratchgtyp">
          <c-input
            v-model="model.finmod.ratchgtyp"
            style="width: 70%"
            placeholder=""
            readonly
          >
          </c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-col :span="12">
          <el-form-item label="开户日期" prop="trdgrp.rec.stttendat">
            <c-input
              v-model="model.trdgrp.rec.stttendat"
              style="width: 100%"
              placeholder=""
              readonly
            ></c-input>
          </el-form-item>
        </el-col>
        <el-col :span="10" :offset="2">
          <el-form label-position="left">
            <el-form-item label="到期日" label-position="left" prop="trdgrp.rec.matdat">
            <c-input
              v-model="model.trdgrp.rec.matdat"
              style="width: 50%"
              placeholder=""
              readonly
            ></c-input>
          </el-form-item>
          </el-form>
        </el-col>
      </el-col>

      <el-col :span="24">
        <el-form-item label="基准利率">
          <c-input
            v-model="temp3"
            style="width: 60%"
            placeholder=""
          ></c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="执行利率">
          <c-input
            v-model="temp3"
            style="width: 50%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="第一还款帐号" prop="finmod.act1">
          <c-input
            v-model="model.finmod.act1"
            maxlength="21"
            style="width: 80%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="预收息金额">
          <c-input
            v-model="temp2"
            style="width: 70%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
    </el-col>
    <!-- =========================bottom--right======================== -->
    <el-col :span="11" :offset="1" style="margin-top: 20px">
      <el-col :span="24">
        <el-form-item label="借据号" prop="trdgrp.cbs.max.cur">
          <c-input
            v-model="model.trdgrp.cbs.max.cur"
            style="width: 50%"
            placeholder=""
            readonly
          >
          </c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="计息日期" prop="finmod.intdat">
          <c-input
            v-model="model.finmod.intdat"
            style="width: 15%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item label="利率调整周期" prop="finmod.ratchgprd">
          <c-input
            v-model="model.finmod.ratchgprd"
            style="width: 90%"
            placeholder=""
            readonly
          >
          </c-input>
        </el-form-item>
      </el-col>

      <el-col :span="10" :offset="1">
        <el-form-item label="月日数" label-width="120px" prop="finmod.ratchgda">
          <c-input
            v-model="model.finmod.ratchgdat"
            style="width: 50%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-col :span="12">
          <el-form-item label="融资天数">
            <c-input
              v-model="temp4"
              placeholder=""
              readonly
            ></c-input>
          </el-form-item>
        </el-col>
        <el-col :span="10" :offset="1">
          <el-form-item label="宽限期" label-width="120px">
            <c-input
              v-model="temp4"
              style="width: 70%"
              placeholder=""
              readonly
            ></c-input>
          </el-form-item>
        </el-col>
      </el-col>

      <el-col :span="24">
        <el-col :span="12">
          <el-form-item label="浮动方式" prop="finmod.flttyp">
            <c-input
              v-model="model.finmod.flttyp"
              style="width: 90%"
              placeholder=""
              readonly
            >
            </c-input>
          </el-form-item>
        </el-col>

        <el-col :span="10" :offset="1">
          <el-form-item label="浮动值" label-width="120px">
            <c-input
              v-model="temp3"
              style="width: 80%"
              placeholder=""
              readonly
            ></c-input>
          </el-form-item>
        </el-col>
      </el-col>

      <!-- <el-col :span="24">
        <span v-text="model.finmod.pctlab" data-path=".finmod.pctlab"> </span>
      </el-col> -->
      <el-col :span="24">
        <el-col :span="12">
          <el-form-item label="逾期计息方式" prop="finmod.ovdinttyp">
            <c-input
              v-model="model.finmod.ovdinttyp"
              style="width: 90%"
              placeholder=""
              readonly
            >
            </c-input>
          </el-form-item>
        </el-col>

        <el-col :span="10" :offset="1">
          <el-form-item label="罚息比率" label-width="120px">
            <c-input
              v-model="temp3"
              placeholder=""
              style="width: 60%"
              readonly
            ></c-input>
            %
          </el-form-item>
        </el-col>
      </el-col>

      <el-col :span="24">
        <el-col :span="12">
          <el-form-item label="第三方还款方式" prop="finmod.acttyp">
            <c-input
              v-model="model.finmod.acttyp"
              style="width: 100%"
              placeholder=""
              readonly
            >
            </c-input>
          </el-form-item>
        </el-col>

        <el-col :span="10" :offset="1">
          <el-form-item label="入帐机构" label-width="120px" prop="finmod.accbch">
            <c-input
              v-model="model.finmod.accbch"
              style="width: 50%"
              placeholder=""
              readonly
            >
            </c-input>
          </el-form-item>
        </el-col>
      </el-col>

      <el-col :span="24">
        <el-form-item label="第三方还款帐号" prop="finmod.act3">
          <c-input
            v-model="model.finmod.act3"
            maxlength="21"
            style="width: 70%"
            placeholder=""
            readonly
          ></c-input>
        </el-form-item>
      </el-col>
    </el-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Cptopn/Event";

export default {
  inject: ['root'],
  props: ["model", "codes"],
  data() {
    return {
      temp1:'O USD 0.00 /',
      temp2:'0.00',
      temp3:'0.000000',
      temp4:'0',
    };
  },
  methods: { ...Event },
  created: function () {},
};
</script>
<style>
</style>
