Ovwp.vue

<template>
  <div class="eibs-tab">
    <c-row>
   
      <!-- ====================左边======================= -->
      <c-col :span="11">
      <c-col :span="24">
          <c-col :span="20">
            <el-form-item
              label="参考号"
              prop="didgrp.rec.ownref"
              style="width: 100%"
            >
              <c-input
                v-model="model.didgrp.rec.ownref"
                maxlength="16"
                placeholder="请输入参考号"
                style="width: 95%"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
          <c-col :span="1">
            <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 :span="3" style="text-align: right">
            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              :disabled="this.flag"
              @click="onDitpButgetref"
            >
              获取
            </c-button>
          </c-col>
          </c-col>

        <c-col :span="24">
          <el-form-item
            label="所属客户经理"
            prop="ditp.usr.extkey"
            style="width: 100%"
          >
          <c-fullbox>
            <c-input
              v-model="model.ditp.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="didgrp.cbs.nom1.cur">
            <c-select
              disabled
              v-model="model.didgrp.cbs.nom1.cur"
              style="width: 95%"
              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="0"
            prop="didgrp.cbs.nom1.amt"
          >
            <c-input-currency
            disabled
              v-model="model.didgrp.cbs.nom1.amt"
              style="text-align: left; width: 100%"
              placeholder="请输入信用证金额"
              @keyup.enter.native="
                defaultFunction(
                  'didgrp.cbs.nom1.amt',
                  model.didgrp.cbs.nom1.amt
                )
              "
            ></c-input-currency>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="大写金额" prop="ditp.amt">
            <c-input
              v-model="model.ditp.amt"
              maxlength="76"
              placeholder="请输入大写金额"
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <c-col :span="13">
          <c-form-item label="上下浮动限额+/-" prop="didgrp.rec.nomtop">
            <c-input
            disabled
                v-model="model.didgrp.rec.nomtop"
                maxlength="9"
                style="width: 100%"
                placeholder="请输入浮动下限"
              ></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-input
              disabled
                v-model="model.didgrp.rec.nomton"
                maxlength="9"
                style="width: 100%"
                placeholder="请输入浮动上限"
              ></c-input>
              </c-col>     
          </c-col>
       
        <c-col :span="13">
          <el-form-item label="信用证最大金额" prop="didgrp.cbs.max.cur">
            <c-select
              v-model="model.didgrp.cbs.max.cur"
              style="width: 95%"
              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="0" prop="didgrp.cbs.max.amt">
            <c-input
              v-model="model.didgrp.cbs.max.amt"
              placeholder="请输入信用证最大金额"
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="贸易类型" prop="didgrp.rec.mytype">
            <c-select
            disabled
              v-if="model.didgrp.rec.elcflg == 'N'"
              v-model="model.didgrp.rec.mytype"
              style="width: 100%"
              placeholder="请选择贸易类型"
              @change="mytypeChange"
            >
              <el-option
                v-for="item in codes.mylx"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
            <c-select
              v-else
              disabled
              v-model="model.didgrp.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">         
            <el-form-item label="开证日期" prop="didgrp.rec.opndat">
              <c-date-picker
              disabled
                type="date"
                v-model="model.didgrp.rec.opndat"
                value-format="yyyy-MM-dd"
                style="width: 100%"
                placeholder="请选择开证日期"
              ></c-date-picker>
            </el-form-item>
          </c-col>
        <c-col :span="24">        
            <el-form-item
              v-if="model.didgrp.rec.mytype == 'H'"
              label="最迟货物装运日"
              prop="didgrp.rec.shpdat"
            >
              <c-date-picker
              disabled
                type="date"
                v-model="model.didgrp.rec.shpdat"
                value-format="yyyy-MM-dd"
                style="width: 100%"
                placeholder="请选择最迟货物装运日"
              ></c-date-picker>
            </el-form-item>
            <el-form-item
              v-if="model.didgrp.rec.mytype == 'F'"
              label="最迟服务提供日"
              prop="didgrp.rec.shpdat"
            >
              <c-date-picker
              disabled
                type="date"
                v-model="model.didgrp.rec.shpdat"
                value-format="yyyy-MM-dd"
                style="width: 100%"
                placeholder="请选择最迟服务提供日"
              ></c-date-picker>
            </el-form-item>
            <el-form-item
              label="最迟货物装运日/服务提供日"
              v-if="model.didgrp.rec.mytype == '3'"
              prop="didgrp.rec.shpdat"
            >
              <c-date-picker
              disabled
                type="date"
                v-model="model.didgrp.rec.shpdat"
                value-format="yyyy-MM-dd"
                style="width: 100%"
                placeholder="请选择"
              ></c-date-picker>
            </el-form-item>
        </c-col>
        <c-col :span="24">
            <el-form-item label="有效日期" prop="didgrp.rec.expdat">
              <c-date-picker
              disabled
                type="date"
                v-model="model.didgrp.rec.expdat"
                value-format="yyyy-MM-dd"
                style="width: 100%"
                placeholder="请选择有效日期"
              ></c-date-picker>
            </el-form-item>
          </c-col>
        <c-col :span="24">
          <el-form-item label="有效地点" prop="didgrp.rec.expplc">
            <c-input
            disabled
              v-model="model.didgrp.rec.expplc"
              maxlength="35"
              placeholder="请输入有效地点"
            ></c-input>
          </el-form-item>
        </c-col>
        
    <c-col :span="24">
      <c-col :span="13">
        <el-form-item label="是否通过电证系统" prop="didgrp.rec.elcflg">
          <c-select
            v-model="model.didgrp.rec.elcflg"
            style="width: 95%"
            placeholder="请选择是否通过电证系统"
            disabled
          >
            <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="11">
        <el-form-item label="报文类型" label-width="80px">
          <c-select 
          v-if="model.didgrp.rec.elcflg == 'N'"
          style="width: 100%"
          v-model="model.ditp.msgtyp" placeholder="请选择报文类型" disabled>
            <el-option
              v-for="item in codes.msgtyp"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
          <c-select 
          v-else
          v-model="model.ditp.msgtyp" placeholder="请选择报文类型" disabled>
            <el-option
              v-for="item in codes.msgtyp"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
      </c-col>
    </c-col>


        <c-col :span="24">
          <el-form-item label="开证类型" prop="didgrp.rec.dkflg">
            <c-select
              v-model="model.didgrp.rec.dkflg"
              style="width: 100%"
              disabled
              placeholder="请选择开证类型"
            >
              <el-option
                v-for="item in codes.dkflg"
                :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="didgrp.rec.idcode">
            <c-input
              v-model="model.didgrp.rec.idcode"
              maxlength="18"
              disabled
              placeholder="请输入申请人统一社会信用代码"
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="货押标识" prop="didgrp.rec.guaflg">
            <c-select
            disabled
              v-model="model.didgrp.rec.guaflg"
              style="width: 100%"
              placeholder="请选择货押标识"
            >
              <el-option
                v-for="item in codes.guaflg"
                :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="didgrp.rec.jyqflg">
            <c-select
            disabled
              v-model="model.didgrp.rec.jyqflg"
              style="width: 100%"
              placeholder="请选择假远期信用证"
            >
              <el-option
                v-for="item in jyqflg"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </el-form-item>
        </c-col>
      </c-col>
      <!-- ========================右边======================= -->
      <c-col :span="11" :offset="1">
      <c-col :span="24">
          <el-form-item label="摘要" prop="didgrp.rec.nam">
            <c-input
              align="middle"
              v-model="model.didgrp.rec.nam"
              maxlength="40"
              disabled
              placeholder="请输入摘要"
            ></c-input>
          </el-form-item>
        </c-col>

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

        <c-col :span="14">
          <c-form-item label="邮编" prop="didgrp.apl.pts.youzbm">
            <c-input
            disabled
              v-model="model.didgrp.apl.pts.youzbm"
              maxlength="6"
              placeholder="请输入邮编"
            ></c-input>
          </c-form-item>
        </c-col>
        <c-col :span="10">
          <c-form-item
            label="电话"
            label-width="40px"
            style="margin-left: 12px"
            prop="didgrp.apl.pts.dihdig"
          >
            <c-input
            disabled
              v-model="model.didgrp.apl.pts.dihdig"
              maxlength="16"
              placeholder="请输入电话"
            ></c-input>
          </c-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="申请人账号" style="width: 100%" prop="didgrp.apl.pts.extact">
            <c-input
            disabled
              v-model="model.didgrp.apl.pts.extact"
              maxlength="20"
              placeholder="请选择申请人账号"
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item
            label="申请人开户行    联行行号"
            prop="didgrp.apb.pts.bankno"
          >
            <c-input
            disabled
              v-model="model.didgrp.apb.pts.bankno"
              maxlength="20"
              placeholder="请输入申请人开户行    联行行号"
              @keyup.enter.native="
                showGridPromptDialog('didgrp.apb.pts.bankno')
              "
            ></c-input>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="联行名称 " prop="didgrp.apb.pts.jigomc">
            <c-input
            disabled
              type="textarea"
              v-model="model.didgrp.apb.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: 'didgrp',
              rol: 'ben',
            }"
            :disabled="true"
            :disabledRef="true"
            :disabledExtkey="true"
            :isAdrblk="false"
            @onSeainf="onSeainf"
            @onAplpDet="onBenpDet"
          >
          </c-ptap>
        </c-col>

        <c-col :span="14">
          <el-form-item label="邮编" prop="didgrp.ben.pts.youzbm">
            <c-input
            disabled
              v-model="model.didgrp.ben.pts.youzbm"
              maxlength="6"
              placeholder="请输入邮编  电证用"
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="10">
          <el-form-item
            label="电话"
            label-width="40px"
            style="margin-left: 12px"
            prop="didgrp.ben.pts.dihdig"
          >
            <c-input
            disabled
              v-model="model.didgrp.ben.pts.dihdig"
              maxlength="16"
              placeholder="请输入电话"
            ></c-input>
          </el-form-item>
        </c-col>

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

        <c-col :span="24">
          <el-form-item
            label="受益人开户行   联行行号"
            prop="didgrp.beb.pts.bankno"
          >
            <c-input
            disabled
              v-model="model.didgrp.beb.pts.bankno"
              maxlength="20"
              placeholder="请输入受益人开户行   联行行号"
              @keyup.enter.native="
                showGridPromptDialog('didgrp.beb.pts.bankno')
              "
            ></c-input>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="联行名称 " prop="didgrp.beb.pts.jigomc">
            <c-input
            disabled
              type="textarea"
              v-model="model.didgrp.beb.pts.jigomc"
              maxlength="35"
              show-word-limit
              placeholder="请输入联行名称  电证用"
            ></c-input>
          </el-form-item>
        </c-col>
      </c-col>
    </c-row>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import Event from "~/model/Ditdla/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 {
      jyqflg: [
        { label: "否", value: "" },
        { label: "是", value: "X" },
    ],
      jigomcFlag: false,
      trade: "",
    };
  },
  methods: {
    ...Event,
    mytypeChange() {
      if (this.model.didgrp.rec.mytype == "F") {
        this.model.didgrp.rec.tratyp = "";
        this.model.didgrp.rec.sdsrfs = "";
        this.model.didgrp.rec.shptrs = "";
        this.model.didgrp.rec.shpfro = "";
        this.model.didgrp.rec.shpto = "";
        this.model.didgrp.rec.shppro = "";
      }
    },
    nom1CurEvent() {
      this.executeDefault("didgrp.cbs.nom1.cur").then((res) => {
        if ((res.respCode == SUCCESS)) {
          Utils.copyValueFromVO(this.model, res.data);
        }
      });
    },
  },
  created: function () {
    console.log(this.root);
  },
  computed: {
    flag() {
      return this.model.didgrp.apl.pts.extkey == "";
    },
  },
  watch: {
    declareParams() {},
  },
};
</script>