Davp.vue

<template>
  <div class="eibs">  
    <!-- =====================左========================== -->
    <el-col :span="12" class="col-left">
      <c-col :span="24">
        <el-form-item label="信用证编号" prop="lidgrp.rec.ownref">
          <c-fullbox>
          <c-input
            v-model="model.lidgrp.rec.ownref"
            maxlength="16"
            placeholder="请输入信用证编号"
            :disabled="true"
          ></c-input>
          <template slot="footer">
          <c-button
                style="padding: 0 12px"
                size="small"
                type="primary"
              >
                <i class="el-icon-info"></i>
              </c-button>
          </template>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="24">
      <c-col :span="10">
        <el-form-item  label="信用证金额" prop="lidgrp.cbs.nom1.cur">
               <c-input  :disabled="true" v-model="model.lidgrp.cbs.nom1.cur" maxlength="3"  placeholder=""></c-input>
        </el-form-item>
       </c-col>
       <c-col :span="10" >
        <el-form-item prop="lidgrp.cbs.nom1.amt" label-width="10px">
            <c-input-currency   v-model="model.lidgrp.cbs.nom1.amt"  placeholder="请输入信用证金额"  :disabled="true"></c-input-currency>
        </el-form-item>
       </c-col>
       
      <c-col :span="4">
	      <c-checkbox  v-model="model.brtp.aammod.addamtflg"  :disabled="true">附加金额</c-checkbox>
       </c-col>  
      </c-col>
       <c-col :span="10">
        <el-form-item label="信用证余额" prop="lidgrp.cbs.opn1.cur">
            <c-input  :disabled="true" v-model="model.lidgrp.cbs.opn1.cur" maxlength="3"  placeholder=""></c-input>
        </el-form-item>
       </c-col>
                  
       <c-col :span="10" >
        <el-form-item  prop="lidgrp.cbs.opn1.amt" label-width="10px">
            <c-input-currency   :disabled="true"  v-model="model.lidgrp.cbs.opn1.amt"  placeholder="请输入金额"></c-input-currency>
        </el-form-item>
       </c-col>
                  
       <c-col :span="4">
	    <c-checkbox :disabled="true" v-model="model.lidgrp.rec.revflg">循环信用证</c-checkbox>
       </c-col>  
       <c-col :span="24">
        <el-form-item label="可用银行" prop="lidgrp.avbnam">
            <c-input  :disabled="true"  v-model="model.lidgrp.avbnam"   placeholder="请输入可用银行"></c-input>
        </el-form-item>
       </c-col> 
       <c-col :span="19">
        <el-form-item label="兑付方式" prop="lidgrp.rec.avbby">
            <c-select  
            :code="codes.avbby"
            :disabled="true" v-model="model.lidgrp.rec.avbby" style="width:100%" placeholder="请选择兑付方式">
            </c-select>
        </el-form-item>
       </c-col>
       <c-col :span="5" >
	    <c-checkbox   :disabled="true" v-model="model.lidgrp.rec.redclsflg">红/绿条款</c-checkbox>
       </c-col>
       <c-col :span="24">
        <el-form-item label="开证日期" prop="lidgrp.rec.opndat">
            <c-date-picker  :disabled="true" type="date"  v-model="model.lidgrp.rec.opndat" style="width:100%"  placeholder="请选择开证日期"></c-date-picker>
        </el-form-item>
       </c-col>
        <c-col :span="24" >
        <el-form-item label="装运日期" prop="lidgrp.rec.shpdat">
            <c-date-picker  :disabled="true" type="date"  v-model="model.lidgrp.rec.shpdat" style="width:100%"  placeholder="请选择最迟装运日期"></c-date-picker>
        </el-form-item>
       </c-col>

      <c-col :span="12">
        <el-form-item label="有效期限" prop="lidgrp.rec.expdat">
            <c-date-picker  :disabled="true" type="date"  v-model="model.lidgrp.rec.expdat" style="width:100%"  placeholder="请选择有效期限"></c-date-picker>
        </el-form-item>
       </c-col>
                  
       <c-col :span="12" >
        <el-form-item label="到期地点" prop="lidgrp.rec.expplc" >
            <c-input  :disabled="true" v-model="model.lidgrp.rec.expplc" maxlength="29"  placeholder="请输入到期地点"></c-input>
        </el-form-item>
       </c-col>

      <c-col :span="24">
        <el-form-item label="信用证类型" prop="lidgrp.rec.lcrtyp">
            <c-select :code="codes.lcrtyp"  :disabled="true" v-model="model.lidgrp.rec.lcrtyp" style="width:100%" placeholder="请选择信用证类型">
            </c-select>
        </el-form-item>
       </c-col>

      <c-col :span="24">
        <el-form-item label="单据编号" prop="brdgrp.rec.ownref">
            <c-fullbox>
            <c-input  :disabled="true"  v-model="model.brdgrp.rec.ownref" maxlength="16"  placeholder="请输入单据编号"></c-input>
            <template slot="footer">
              <c-button
                style="padding: 0 12px"
                size="small"
                type="primary"
              >
                <i class="el-icon-info"></i>
              </c-button>   
            </template>
            </c-fullbox>
        </el-form-item>
       </c-col>

         <c-col :span="24">
        <el-form-item label="通知类型" prop="brdgrp.rec.advtyp">
            <c-select 
              :code="codes.advtyp" 
              v-model="model.brdgrp.rec.advtyp" 
              style="width:100%" 
              placeholder="请选择通知类型"
            > 
            </c-select>
        </el-form-item>
       </c-col>

       <c-col :span="12">
        <el-form-item label="建议付款日期" prop="brdgrp.rec.advdat">
            <c-date-picker 
              :disabled=" (this.model.brdgrp.rec.advtyp == '750' || this.model.brdgrp.rec.advtyp == 'oth') "
              type="date"  
              v-model="model.brdgrp.rec.advdat" 
              style="width:100%"  
              placeholder="请选择建议付款日期"
              value-format="yyyy-MM-dd"
            ></c-date-picker>
        </el-form-item>
       </c-col>
                                   
       <c-col :span="12">
        <el-form-item label="不符点通知日期" prop="brdgrp.rec.disdat">
            <c-date-picker 
              :disabled=" (this.model.brdgrp.rec.advtyp == '754' || this.model.brdgrp.rec.advtyp == 'oth') "
              type="date"  
              v-model="model.brdgrp.rec.disdat" 
              style="width:100%"  
              placeholder="请选择不符点通知日期"
              value-format="yyyy-MM-dd"
            ></c-date-picker>
        </el-form-item>
       </c-col>
    </el-col>
    <!-- ========================右======================= -->
    <el-col :span="12" class="col-right">
    <c-col :span="24" >
        <el-form-item label="简略信息" prop="lidgrp.rec.nam">
          <c-input 
            :disabled="true"
            v-model="model.lidgrp.rec.nam"
            maxlength="40"
            placeholder="请输入概要"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="申请人参考号" prop="brdgrp.apl.pts.ref">
            <c-input  
            disabled
            v-model="model.brdgrp.apl.pts.ref" maxlength="16"  placeholder="请输入申请人"></c-input>
        </el-form-item>
       </c-col> 
     <c-col :span="24">
        <el-form-item  label="申请人名称" prop="brdgrp.apl.pts.nam">
            <c-input  :disabled="true" v-model="model.brdgrp.apl.pts.nam" maxlength="40"  placeholder="请输入名称"></c-input>
        </el-form-item>
       </c-col> 

        <c-col :span="24" >
        <el-form-item label="受益人参考号" prop="brdgrp.ben.pts.ref">
            <c-input  :disabled="true" v-model="model.brdgrp.ben.pts.ref" maxlength="16"  placeholder="请输入受益人参考号"></c-input>
        </el-form-item>
       </c-col>
       <c-col :span="24">
        <el-form-item  prop="brdgrp.ben.pts.nam" label="受益人名称">
            <c-input  :disabled="true" v-model="model.brdgrp.ben.pts.nam" maxlength="40"  placeholder="请输入名称"></c-input>
        </el-form-item>
       </c-col>
        <c-col :span="24">
        <el-form-item label="交单行参考号" prop="brdgrp.prb.pts.ref">
            <c-input   :disabled="true" v-model="model.brdgrp.prb.pts.ref" maxlength="16"  placeholder="请输入编号"></c-input>
        </el-form-item>
       </c-col>
       <c-col :span="24">
        <el-form-item  prop="brdgrp.prb.pts.nam" label="交单行名称">
            <c-input  :disabled="true"  v-model="model.brdgrp.prb.pts.nam" maxlength="40"  placeholder="请输入名称"></c-input>
        </el-form-item>
       </c-col>

       <c-col :span="24">
        <el-form-item label="简略信息" prop="brdgrp.rec.nam">
            <c-input  
            :disabled="true"  
            v-model="model.brdgrp.rec.nam" 
            maxlength="40"  
            placeholder="请输入简略信息"
            ></c-input>
        </el-form-item>
       </c-col>
       <c-col :span="24">
        <el-form-item label="交单行" prop="brdgrp.rec.docprbrol">
            <c-select v-model="model.brdgrp.rec.docprbrol" 
            style="width:100%" 
            placeholder="请选择交单行"
            :code="codes.docprbrol"
            >
            </c-select>
        </el-form-item>
       </c-col>

       <c-col :span="24" >
        <el-form-item label="交单行参考号" prop="brdgrp.prb.pts.ref">
            <c-input  v-model="model.brdgrp.prb.pts.ref" maxlength="16"  placeholder="请输入交单行参考号"></c-input>
        </el-form-item>
       </c-col>
        <c-col :span="24" :offset="0">
        <el-form-item label="地址编号" prop="brdgrp.prb.pts.extkey">
            <c-fullbox>
            <c-input
            v-model="model.brdgrp.prb.pts.extkey"
            maxlength="16"
            placeholder="请输入地址编码"
            :disabled="model.brdgrp.rec.docprbrol != 'PRB'"
            @keyup.enter.native="
                queryGridEtyPromptDialogData('PRB', 'C')
              "
            ></c-input>
            <template slot="footer">
              <c-button
                  style="margin: 0 10px 0 10px; padding: 0 12px"
                  size="small"
                  type="primary"
                  @click="model.brtp.prbp.ptsget.sdamod.seainf"
                  icon="el-icon-search"
              >
              </c-button>
              <c-button
                  style="margin: 0 0"
                  size="small"
                  type="primary"
                  icon="el-icon-info"
              >
              </c-button>
            </template>
            </c-fullbox>
        </el-form-item>
       </c-col>
       <c-col :span="24">
        <el-form-item label="地址信息" prop="brdgrp.prb.pts.adrblk">
            <c-input
            :rows="4"
            :disabled="model.brdgrp.rec.docprbrol === 'PRB'"
             type="textarea"
             v-model="model.brdgrp.prb.pts.adrblk"
             maxlength="80"
             show-word-limit
             placeholder="请输入地址信息" ></c-input>
        </el-form-item>
        </c-col>
    </el-col>                   
     
  </div>
</template>
<script>
import event from "../event";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [event],
  data() {
    return {};
  },
  watch:{
    "model.brdgrp.rec.advtyp":{
      immediate:true,
      handler(){
        if(this.model.brdgrp.rec.advtyp == '750' ){
          this.model.brdgrp.rec.advdat = ""
          this.model.brdgrp.blk.docdisflg=  'X'
        }else if(this.model.brdgrp.rec.advtyp == '754'){
          this.model.brdgrp.rec.disdat = ""
          this.model.brdgrp.blk.docdisflg=  ''
        }else if( this.model.brdgrp.rec.advtyp == 'oth'){
          this.model.brdgrp.rec.advdat = ""
          this.model.brdgrp.rec.disdat = ""
        }
      }
    },
    "model.brdgrp":{
     immediate: true,
     deep: true,
     handler(val,oldval){
      const res = this.model.brdgrp
       if(res.cbs.max.cur !== "" || res.cbs.max.amt !== "" || this.model.lidgrp.apl.pts.adrblk !== ""){
        this.model.brdgrp.cbs.max.cur=this.model.lidgrp.cbs.nom1.cur;
        this.model.brdgrp.rec.nam = `${res.cbs.max.cur} ${res.cbs.max.amt} ${this.model.lidgrp.apl.pts.adrblk.substring(0,16)}`
       }
     }
   },
  },
  methods: {},
  created: function() {}
};
</script>
<style>
</style>