Ovwp.vue

<template>
  <div class="eibs-tab">
    <!-- ====================左边======================= -->
    <c-col :span="11">
      <c-col :span="24">
        <el-form-item
          label="Reference"
          prop="bcdgrp.rec.ownref"
          style="width: 100%"
        >
          <c-fullbox>
            <c-input
              v-model="model.bcdgrp.rec.ownref"
              maxlength="16"
              placeholder="请输入Reference"
              style="width: 100%"
              disabled
            ></c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
              >
                <span style="font-family: '宋体'; font-weight: bold">i</span>
              </c-button>
              <c-button
                style="margin: 0 0"
                size="small"
                type="primary"
                :disabled="!this.model.bcdgrp.dre.pts.extkey"
                @click="onBctmodButgetref"
              >
                Get Ref.
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="18">
        <el-form-item
          label="Responsible User"
          prop="bctp.usr.extkey"
          style="width: 100%"
        >
          <c-input
            style="width: 100%"
            v-model="model.bctp.usr.extkey"
            maxlength="16"
            placeholder="请输入Responsible User"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="6" class="centerLable">
        <c-checkbox
          style="margin-left: 4px; padding: 0 10px"
          v-model="model.bcdgrp.rec.dftgarflg"
          >Draft to be Guaranteed</c-checkbox
        >
      </c-col>

      <!-- <c-col :span="4" class="centerLable">
          <c-checkbox  v-model="model.bcdgrp.rec.resflg"
            >Reserved Contract</c-checkbox
          >
        </c-col> -->

      <c-col :span="14">
        <el-form-item label="Document Amount" prop="bcdgrp.cbs.max.cur">
          <c-select
            v-model="model.bcdgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择Currency"
            :code="codes.curtxt1"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="10">
        <el-form-item
          style="text-align: left"
          label-width="0"
          prop="bcdgrp.cbs.max.amt"
        >
          <c-input-currency
            v-model="model.bcdgrp.cbs.max.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Document Amount"
          ></c-input-currency>
        </el-form-item>
      </c-col>

      <c-col :span="14">
        <el-form-item label="Open Amount" prop="bcdgrp.cbs.opn1.cur">
          <c-select
            disabled
            v-model="model.bcdgrp.cbs.opn1.cur"
            style="width: 100%"
            placeholder="请选择Open Currency"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="10">
        <el-form-item
          style="text-align: left"
          label-width="0"
          prop="bcdgrp.cbs.opn1.amt"
        >
          <c-input-currency
            disabled
            v-model="model.bcdgrp.cbs.opn1.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入Open Amount"
          ></c-input-currency>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Docs received on" prop="bcdgrp.rec.rcvdat">
          <c-date-picker
            type="date"
            v-model="model.bcdgrp.rec.rcvdat"
            style="width: 100%"
            placeholder="请选择Docs received on"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Date of Remittance Lt." prop="bcdgrp.rec.predat">
          <c-date-picker
            type="date"
            v-model="model.bcdgrp.rec.predat"
            style="width: 100%"
            placeholder="请选择Date of Remittance Lt."
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Advised on" prop="bcdgrp.rec.advdat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.bcdgrp.rec.advdat"
            style="width: 100%"
            placeholder="请选择Advised on"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <!-- <c-col :span="4" class="centerLable">
          <c-checkbox  v-model="model.bcdgrp.rec.oridre"
            >Send Original Documents to Drawee</c-checkbox >
        </c-col>		 -->

      <c-col :span="24">
        <el-form-item label="Collection Condition" prop="bcdgrp.rec.doctypcod">
          <c-select
            v-model="model.bcdgrp.rec.doctypcod"
            style="width: 100%"
            placeholder="请选择Collection Condition"
            :code="codes.doctypcod"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Maturity Date" prop="bcdgrp.rec.matdat">
          <c-date-picker
            type="date"
            v-model="model.bcdgrp.rec.matdat"
            value-format="yyyy-MM-dd"
            style="width: 100%"
            placeholder="请选择Maturity Date"
            :disabled="model.bcdgrp.rec.doctypcod === 'P'"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="Tenor Specification" prop="bcdgrp.rec.matpercnt">
          <c-input
            v-model="model.bcdgrp.rec.matpercnt"
            placeholder="请输入Tenor Specification"
            :disabled="model.bcdgrp.rec.doctypcod === 'P'"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="" label-width="10px" prop="bcdgrp.rec.matpertyp">
          <c-select
            v-model="model.bcdgrp.rec.matpertyp"
            style="width: 100%"
            placeholder="请选择Days/Months or Years for Maturity Period"
            :code="codes.matpertyp"
            :disabled="model.bcdgrp.rec.doctypcod === 'P'"
          ></c-select>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="发票类型" prop="bcdgrp.rec.invtyp">
          <c-select
            v-model="model.bcdgrp.rec.invtyp"
            style="width: 100%"
            placeholder="请选择发票类型"
            :code="codes.invtyp"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Tenor Starting from" prop="bcdgrp.rec.matperbeg">
          <c-select
            v-model="model.bcdgrp.rec.matperbeg"
            style="width: 100%"
            placeholder="请选择Tenor Starting from"
            :code="codes.matperbeg"
            :disabled="model.bcdgrp.rec.doctypcod === 'P'"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Maturity Text" prop="bcdgrp.blk.bcgdet">
          <c-input
            :disabled="!this.model.bcdgrp.blk.bcgdetflg"
            type="textarea"
            v-model="model.bcdgrp.blk.bcgdet"
            maxlength="45"
            show-word-limit
            placeholder="请输入Maturity Text"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24" class="bctdav_bctp_bctovw_cheak">
        <c-checkbox v-model="model.bcdgrp.blk.bcgdetflg"
          >Maturity Text modified</c-checkbox
        >
      </c-col>

      <c-col :span="24">
        <!--
            <c-istream-table
              :list="model.bctp.docgrdm.docgrd"
              :columns="columns"
            >
            </c-istream-table>
			-->
        <!-- <c-edit-table :model="model" v-bind="docgrd">
          </c-edit-table>
       </c-col> -->
        <c-docpre
          :model="model"
          :argadr="{
            path: 'SEMFLG',
            grp: 'bctp',
            code: 'docpre',
          }"
        ></c-docpre>
      </c-col>
    </c-col>

    <!-- ========================右边======================= -->
    <c-col :span="11" :offset="1">
      <c-col :span="24">
        <el-form-item label="Name" prop="bcdgrp.rec.nam">
          <c-input
            align="middle"
            disabled
            v-model="model.bcdgrp.rec.nam"
            maxlength="40"
            placeholder="请输入Name"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Drawee Ref." prop="bcdgrp.dre.pts.ref">
          <c-input
            v-model="model.bcdgrp.dre.pts.ref"
            maxlength="16"
            style="width: 100%"
            placeholder="请输入Application Ref"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Extkey" prop="bcdgrp.dre.pts.extkey">
          <c-fullbox>
            <c-input
              v-model="model.bcdgrp.dre.pts.extkey"
              maxlength="150"
              placeholder="请输入External Key of Address"
              @keyup.enter.native="
                showGridPromptDialog('bcdgrp.dre.pts.extkey')
              "
            ></c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
              >
                <span style="font-family: '宋体'; font-weight: bold">i</span>
              </c-button>
              <c-button
                style="margin: 0 0"
                size="small"
                type="primary"
                disabled
              >
                详情
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Address Block" prop="bcdgrp.dre.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            v-model="model.bcdgrp.dre.pts.adrblk"
            maxlength="150"
            disabled
            show-word-limit
            placeholder="请输入Address Block"
          ></c-input>
        </el-form-item>
      </c-col>
      <!-- <c-col :span="24">
        <c-ptap
          :model="model"
          :argadr="{
            title: 'Drawee',
            grp: 'bcdgrp',
            rol: 'dre',
          }"
          :disabled="true"
          :isAdrblk="false"
          
        >
        </c-ptap>
      </c-col> -->

      <!-- <c-col :span="24">
        <c-ptap
          :model="model"
          :argadr="{
            title: 'Remitting Bank',
            grp: 'bcdgrp',
            rol: 'rmi',
          }"
          :disabled="true"
          :isAdrblk="false"
          
        >
        </c-ptap>
      </c-col> -->
      <c-col :span="24">
        <el-form-item label="Remitting Bank Ref." prop="bcdgrp.rmi.pts.ref">
          <c-input
            v-model="model.bcdgrp.rmi.pts.ref"
            maxlength="16"
            style="width: 100%"
            placeholder=""
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Extkey" prop="bcdgrp.rmi.pts.extkey">
          <c-fullbox>
            <c-input
              v-model="model.bcdgrp.rmi.pts.extkey"
              maxlength="120"
              placeholder="请输入External Key of Address"
              @keyup.enter.native="
                showGridPromptDialog('bcdgrp.rmi.pts.extkey')
              "
            >
            </c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
              >
                <span style="font-family: '宋体'; font-weight: bold">i</span>
              </c-button>
              <c-button style="margin: 0 0" size="small" type="primary">
                详情
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Address Block" prop="bcdgrp.rmi.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            v-model="model.bcdgrp.rmi.pts.adrblk"
            maxlength="150"
            show-word-limit
            placeholder="请输入Address Block"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Drawer Ref." prop="bcdgrp.drr.pts.ref">
          <c-input
            v-model="model.bcdgrp.drr.pts.ref"
            maxlength="16"
            style="width: 100%"
            placeholder=""
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Extkey" prop="bcdgrp.drr.pts.extkey">
          <c-fullbox>
            <c-input
              v-model="model.bcdgrp.drr.pts.extkey"
              maxlength="50"
              placeholder="请输入External Key of Address"
              @keyup.enter.native="
                showGridPromptDialog('bcdgrp.drr.pts.extkey')
              "
            ></c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
              >
                <span style="font-family: '宋体'; font-weight: bold">i</span>
              </c-button>
              <c-button style="margin: 0 0" size="small" type="primary">
                详情
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Address Block" prop="bcdgrp.drr.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            v-model="model.bcdgrp.drr.pts.adrblk"
            maxlength="150"
            show-word-limit
            placeholder="请输入Address Block"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Country or region Code" prop="bcdgrp.rec.stacty">
          <c-select
            v-model="model.bcdgrp.rec.stacty"
            style="width: 100%"
            placeholder="请选择Country Code Risk Country"
            :code="codes.stacty"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="申报类型" prop="outlen.szflg">
          <c-select
            v-model="model.outlen.szflg"
            style="width: 100%"
            placeholder="请选择申报类型"
            :code="codes.szflg"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="款项去向" prop="bctp.acttyp">
          <c-select
            :disabled="this.flag1"
            v-model="model.bctp.acttyp"
            style="width: 100%"
            placeholder="请选择ACTTYP"
            :code="codes.acttyp"
          >
          </c-select>
        </el-form-item>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Bctdav/Event";
import Ptap from "~/views/Public/Ptap";
import Docpre from "~/views/Public/Docpre";

export default {
  components: {
    "c-ptap": Ptap,
    "c-docpre": Docpre,
  },
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  watch: {
    "model.outlen.szflg": {
      immediate: true,
      handler(val, oldVal) {
        if (this.model.outlen.szflg == "1") {
          this.flag1 = false;
        } else {
          this.flag1 = true;
        }
      },
    },
  },

  data() {
    return {
      flag1: true,
      docgrd: {
        columns: [
          {
            title: "lst1",
            width: "80px",
            dataIndex: "cmail1",
            show: "input",
          },
          {
            title: "2nd",
            width: "80px",
            dataIndex: "cmail2",
            show: "input",
          },
          {
            title: "Document",
            width: "320px",
            dataIndex: "docnam",
            show: "select",
          },
        ],
        urls: "bctp.docgrdm.docgrd",
      },
    };
  },
  methods: { ...Event },
  created: function () {},
};
</script>
<style>
.centerLable {
  margin-left: -10px;
  height: 32px;
  line-height: 32px;
  padding-bottom: 2px;
}
.marginLable {
  padding-left: 150px;
}
.bctdav_bctp_bctovw_cheak {
  margin: 0px 0 10px 150px;
}
</style>