Ovwp.vue

<template>
  <div class="eibs-tab">
    <!-- ====================左边======================= -->
    <c-col :span="11">
      <c-col :span="24">
        <c-col :span="20">
          <el-form-item
            label="信用证号码"
            prop="dedgrp.rec.ownref"
            style="width: 100%"
          >
            <c-input
              v-model="model.dedgrp.rec.ownref"
              maxlength="16"
              placeholder="请输入Reference"
              style="width: 95%"
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
        <!-- <c-col :span="1" style="text-align: right"> -->
        <c-col :span="1">
          <!-- <el-form-item label="" label-width="5px"> -->
          <c-button
            style="margin: 0 10px 0 0; padding: 0 12px"
            size="small"
            type="primary"
            @click="onSeainf"
          >
            <span
              style="font-size: 15px; font-family: '宋体'; font-weight: bold"
              >i</span
            >
          </c-button>
          <!-- </el-form-item> -->
        </c-col>
        <c-col :span="2" :offset="1" style="text-align: right">
          <!-- <el-form-item label="" label-width="5px"> -->
          <c-button
            style="margin: 0 0"
            size="small"
            type="primary"
            :disabled="this.flag"
            @click="onDetpButgetref"
          >
            获取
          </c-button>
          <!-- </el-form-item> -->
        </c-col>
        <!-- </c-col> -->
      </c-col>

      <c-col :span="24">
        <el-form-item label="是否可以转让" prop="dedgrp.rec.lcrtyp">
          <c-select
            v-model="model.dedgrp.rec.lcrtyp"
            style="width: 100%"
            placeholder="请选择"
          >
            <el-option
              v-for="item in codes.lcrtyp"
              :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="所属客户经理"
          prop="detp.usr.extkey"
          style="width: 100%"
        >
          <c-fullbox>
            <c-input
              v-model="model.detp.usr.extkey"
              maxlength="8"
              placeholder="请输入所属客户经理"
              disabled
            >
            </c-input>
            <template slot="footer">
              <c-button
                style="margin-left: 10px; padding: 0 10px"
                size="small"
                icon="el-icon-search"
                type="primary"
                @click="onExtkey"
              ></c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="13">
        <el-form-item label="信用证金额" prop="dedgrp.cbs.nom1.cur">
          <c-select
            disabled
            v-model="model.dedgrp.cbs.nom1.cur"
            style="width: 100%"
            placeholder="请选择币种"
            @keyup.enter.native="nom1CurEvent"
          >
            <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="11">
        <el-form-item
          style="text-align: left"
          label-width="5px"
          prop="dedgrp.cbs.nom1.amt"
        >
          <c-input-currency
            v-model="model.dedgrp.cbs.nom1.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入信用证金额"
            @keyup.enter.native="
              defaultFunction('dedgrp.cbs.nom1.amt', model.dedgrp.cbs.nom1.amt)
            "
          ></c-input-currency>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="大写金额" prop="detp.upamt">
          <c-input
            v-model="model.detp.upamt"
            maxlength="76"
            placeholder="请输入大写金额"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-col :span="13">
          <c-form-item label="上下浮动限额" prop="dedgrp.rec.nomtop">
            <c-input
              v-model="model.dedgrp.rec.nomtop"
              maxlength="10"
              style="width: 100%"
              placeholder="请输入Amount Tolerance - Positive"
            ></c-input>
          </c-form-item>
        </c-col>
        <c-col :span="1" style="text-align: center">
          <label
            style="
              display: inline-block;
              width: calc(3% - 4px);
              text-align: center;
            "
            >-</label
          >
        </c-col>
        <c-col :span="10">
          <c-form-item label="" prop="dedgrp.rec.nomton" label-width="0">
            <c-input
              v-model="model.dedgrp.rec.nomton"
              prop="dedgrp.rec.nomton"
              maxlength="10"
              style="width: 100%"
              placeholder="请输入Amount Tolerance - Negative"
            ></c-input
          ></c-form-item>
        </c-col>
      </c-col>

      <c-col :span="13">
        <el-form-item label="信用证最大金额" prop="dedgrp.cbs.max.cur">
          <c-select
            v-model="model.dedgrp.cbs.max.cur"
            placeholder="请选择币种"
            disabled
          >
            <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="11">
        <el-form-item label="" label-width="5px" prop="dedgrp.cbs.max.amt">
          <c-input
            v-model="model.dedgrp.cbs.max.amt"
            placeholder="请输入信用证最大金额"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="贸易类型" prop="dedgrp.rec.mytype">
          <c-select
            v-model="model.dedgrp.rec.mytype"
            style="width: 100%"
            placeholder="请选择贸易类型"
            @change="mytypeChange"
          >
            <el-option
              v-for="item in codes.mytype"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-form-item label="开证日期" prop="dedgrp.rec.opndat">
          <c-date-picker
            type="date"
            v-model="model.dedgrp.rec.opndat"
            value-format="yyyy-MM-dd"
            placeholder="请选择日期"
            style="width: 100%"
          ></c-date-picker>
        </c-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item
          v-if="model.dedgrp.rec.mytype == 'H'"
          label="最迟货物装运日"
          prop="dedgrp.rec.shpdat"
        >
          <c-date-picker
            type="date"
            v-model="model.dedgrp.rec.shpdat"
            value-format="yyyy-MM-dd"
            style="width: 100%"
            placeholder="请选择日期"
          ></c-date-picker>
        </el-form-item>
        <el-form-item
          v-if="model.dedgrp.rec.mytype == 'F'"
          label="最迟服务提供日"
          prop="dedgrp.rec.shpdat"
        >
          <c-date-picker
            type="date"
            v-model="model.dedgrp.rec.shpdat"
            value-format="yyyy-MM-dd"
            style="width: 100%"
            placeholder="请选择日期"
          ></c-date-picker>
        </el-form-item>
        <el-form-item
          label="最迟货物装运日/服务提供日"
          v-if="model.dedgrp.rec.mytype == '3'"
          prop="dedgrp.rec.shpdat"
        >
          <c-date-picker
            type="date"
            v-model="model.dedgrp.rec.shpdat"
            value-format="yyyy-MM-dd"
            style="width: 100%"
            placeholder="请选择"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-form-item label="有效日期" prop="dedgrp.rec.expdat">
          <c-date-picker
            type="date"
            v-model="model.dedgrp.rec.expdat"
            value-format="yyyy-MM-dd"
            placeholder="请选择日期"
            style="width: 100%"
          ></c-date-picker>
        </c-form-item>
      </c-col>

      <c-col :span="24">
        <c-form-item label="开证行开证类型" prop="dedgrp.rec.dkflg">
          <c-select
            v-model="model.dedgrp.rec.dkflg"
            style="width: 100%"
            placeholder="请选择"
            :code="codes.dkflg"
            disabled
          ></c-select>
        </c-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="有效地点" prop="dedgrp.rec.expplc">
          <c-input
            v-model="model.dedgrp.rec.expplc"
            maxlength="35"
            placeholder="请输入有效地点"
          >
          </c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="转运" prop="dedgrp.rec.shptrs">
          <c-select
            v-model="model.dedgrp.rec.shptrs"
            style="width: 100%"
            placeholder="请选择"
            :disabled="model.dedgrp.rec.mytype == 'F'"
          >
            <el-option label="不允许" value="禁止"></el-option>
            <el-option label="允许" value="允许"></el-option>
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="是否通过电证系统" prop="dedgrp.rec.elcflg">
          <c-select
            v-model="model.dedgrp.rec.elcflg"
            style="width: 100%"
            placeholder="请选择是否通过电证系统"
          >
            <el-option
              v-for="item in codes.elcflg"
              :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="信用证兑付方式" prop="dedgrp.rec.avbby">
          <c-select
            v-model="model.dedgrp.rec.avbby"
            style="width: 100%"
            @change="avbbykeyEvent"
            placeholder="请选择"
          >
            <el-option
              v-for="item in codes.avbbyDetopn"
              :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="天数" prop="dedgrp.rec.tenmaxday">
          <c-input
            v-model.number="model.dedgrp.rec.tenmaxday"
            placeholder="请输入天数"
            :disabled="model.dedgrp.rec.avbby == 'P'"
          ></c-input>
        </el-form-item>
      </c-col>

      <div v-if="model.dedgrp.rec.avbby != 'D'">
        <c-col :span="24">
          <el-form-item label="远期付款指示" prop="dedgrp.blk.dftat">
            <c-input
              type="textarea"
              v-model="model.dedgrp.blk.dftat"
              maxlength="35"
              show-word-limit
              placeholder="请输入远期付款指示"
              :disabled="!model.dedgrp.rec.avbby"
            ></c-input>
          </el-form-item>
        </c-col>
      </div>
      <div v-else>
        <c-col :span="24">
          <el-form-item label="远期付款指示" prop="dedgrp.blk.defdet">
            <c-input
              type="textarea"
              v-model="model.dedgrp.blk.defdet"
              maxlength="35"
              show-word-limit
              placeholder="请输入远期付款指示"
            ></c-input>
          </el-form-item>
        </c-col>
      </div>
    </c-col>

    <!-- ========================右边======================= -->
    <c-col :span="11" :offset="1">
      <c-col :span="24">
        <el-form-item label="摘要" prop="dedgrp.rec.nam">
          <c-input
            text-align="middle"
            v-model="model.dedgrp.rec.nam"
            maxlength="40"
            disabled
            placeholder="请输入Externally Displayed Name to Identify the Contract"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-ptap
          :model="model"
          :argadr="{
            title: '受益人',
            grp: 'dedgrp',
            rol: 'ben',
          }"
          :isAdrblk="false"
          @onSeainf="onSeainf"
          @onAplpDet="onBenpDet"
        >
        </c-ptap>
      </c-col>

      <c-col :span="24">
        <c-col :span="24">
          <el-form-item label="受益人账号" prop="dedgrp.ben.pts.extact">
            <c-input
              v-model="model.dedgrp.ben.pts.extact"
              maxlength="16"
              placeholder="请输入受益人账号"
            ></c-input>
          </el-form-item>
        </c-col>
      </c-col>

      <c-col :span="24">
        <el-form-item label="受益人开户行联行行号" prop="dedgrp.beb.pts.bankno">
          <c-input
            v-model="model.dedgrp.beb.pts.bankno"
            maxlength="20"
            placeholder="请输入受益人开户行联行行号"
          >
          </c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item
          label="受益人开户行联行名称 电证用"
          prop="dedgrp.beb.pts.jigomc"
        >
          <c-input
            type="textarea"
            v-model="model.dedgrp.beb.pts.jigomc"
            maxlength="35"
            show-word-limit
            placeholder="请输入联行名称  电证用"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-ptap
          :model="model"
          :argadr="{
            title: '申请人',
            grp: 'dedgrp',
            rol: 'apl',
          }"
          :isAdrblk="false"
          @onSeainf="onSeainf"
          @onAplpDet="onBenpDet"
        >
        </c-ptap>
      </c-col>

      <c-col :span="24">
        <el-form-item label="是否通知客户" prop="dedgrp.rec.rejflg">
          <c-select
            v-model="model.dedgrp.rec.rejflg"
            style="width: 100%"
            placeholder="请选择是否通知客户"
            :code="codes.ELC022"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="拒绝通知理由" prop="dedgrp.blk.rejadvrsn">
          <c-input
            type="textarea"
            v-model="model.dedgrp.blk.rejadvrsn"
            maxlength="35"
            show-word-limit
            placeholder="请输入拒绝通知理由"
            :disabled="model.dedgrp.rec.rejflg != 'ADRE'"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="交单期限" prop="dedgrp.blk.preper">
          <c-input
            type="textarea"
            v-model="model.dedgrp.blk.preper"
            maxlength="35"
            show-word-limit
            placeholder="请输入交单期限"
          ></c-input>
        </el-form-item>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import Event from "~/model/Detopn/Event";
import Utils from "~/utils";
import Ptap from "~/views/Public/Ptap";

export default {
  components: { "c-ptap": Ptap },
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {
      jigomcFlag: false,
      trade: "",
    };
  },
  methods: { ...Event },
  created: function () {},
  computed: {
    flag() {
      return this.model.dedgrp.ben.pts.extkey == "";
    },
  },
};
</script>
<style>
</style>