Djxg.vue

<template>
    <div class="eibs-tab">
        <c-col :span="12" style="padding-right: 20px">
            <c-col :span="24">
                <el-form-item label="单据类型" prop="bddgrp.rec.docflg">
                    <c-select disabled v-model="model.bddgrp.rec.docflg" style="width:100%" dbCode="BRDTYP" uil="CN" placeholder="请选择单据类型">
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="24">
				<div class="custom-box-wrap">
					<div style="width: 280px;">
						<el-form-item label="原始单据金额" prop="bddgrp.cbs.max.cur">
							<c-select disabled dbCode="curtxt" isShowKeyAndLabel placeholder="请选择单据金额" style="width: 100%" v-model="model.bddgrp.cbs.max.cur">
							</c-select>
						</el-form-item>
					</div>

					<div style="width: calc(100% - 280px);">
						<el-form-item label-width="5px" prop="bddgrp.rec.invamt">
							<c-input-currency :disabled="model.mhtyp=='R'" :currency="model.bddgrp.cbs.max.cur"  style="width: 100%" v-model="model.bddgrp.rec.invamt" @change="invamtChange"></c-input-currency>
						</el-form-item>
					</div>
				</div>
			</c-col>

            <c-col :span="24">
                <div class="custom-box-wrap">
                    <div style="width: 280px;">
                        <el-form-item label="索款金额" prop="bddgrp.cbs.max.cur">
                            <c-select disabled v-model="model.bddgrp.cbs.max.cur" style="width:100%" dbCode="CURTXT" :isShowKeyAndLabel="true" placeholder="请选择币种">
                            </c-select>
                        </el-form-item>
                    </div>
                    <div style="width: calc(100% - 280px);">
                        <el-form-item label-width="5px" prop="bddgrp.cbs.max.amt">
                            <c-input-currency v-model="model.bddgrp.cbs.max.amt" :disabled="model.mhtyp=='R'" @change="maxamtChange"></c-input-currency>
                        </el-form-item>
                    </div>
                </div>
            </c-col>

            <c-col :span="24">
                <el-form-item label="原发起直接参与机构" prop="swiadd.oriinstgagt" :required="model.didgrp.rec.elcflg=='Y'">
                    <c-input :disabled="model.didgrp.rec.elcflg!='Y'" v-model="model.swiadd.oriinstgagt" maxlength="20" placeholder="请输入原发起直接参与机构"></c-input>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="原报文标识号" prop="swiadd.orimsgid" :required="model.didgrp.rec.elcflg=='Y'">
                    <c-input :disabled="model.didgrp.rec.elcflg!='Y'" v-model="model.swiadd.orimsgid" maxlength="35" placeholder="请输入原报文标识号"></c-input>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="原报文类型" prop="swiadd.orimsgtyp" :rules="[{required:model.didgrp.rec.elcflg == 'Y',message:'必输项'}]">
                    <c-select :disabled="model.didgrp.rec.elcflg!='Y'" v-model="model.swiadd.orimsgtyp" style="width:100%" placeholder="请选择原报文类型">
                        <el-option  v-for="(item, index) in codes.orimsgtypList" :key="index" :label="item.label" :value="item.value">
						</el-option>
                    </c-select>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <c-col :span="12">
                    <el-form-item label="交单日期" prop="bddgrp.rec.predat">
                        <c-date-picker type="date" v-model="model.bddgrp.rec.predat" style="width:100%" placeholder="请选择交单日期"></c-date-picker>
                    </el-form-item>
                </c-col>

                <c-col :span="12">
                    <el-form-item label="到单日期" prop="bddgrp.rec.rcvdat">
                        <c-date-picker type="date" v-model="model.bddgrp.rec.rcvdat" style="width:100%" placeholder="请选择到单日期" @change="rcvdatDefault"></c-date-picker>
                    </el-form-item>
                </c-col>
            </c-col>
            <c-col :span="24">
                <c-col :span="12">
                    <el-form-item label="单据到期日" prop="bddgrp.rec.matdat" :rules="[{ required: model.bddgrp.blk.matper==''&&model.bddgrp.rec.docflg!='P', message: '必输项'},{validator: validateMatdat}, {trigger: ['blur', 'change']}]">
                        <c-date-picker type="date" v-model="model.bddgrp.rec.matdat" style="width:100%" placeholder="请选择单据到期日"></c-date-picker>
                    </el-form-item>
                </c-col>

                <c-col :span="12">
                    <el-form-item label="装船日" prop="bddgrp.rec.shpdat">
                        <c-date-picker type="date" v-model="model.bddgrp.rec.shpdat" style="width:100%" placeholder="请选择服务提供日"></c-date-picker>
                    </el-form-item>
                </c-col>
            </c-col>
            <c-col :span="24">
                <el-form-item label="交易类别" prop="mhtyp">
                    <c-select v-model="model.mhtyp" dbCode="MHTYP" uil="CN" style="width:100%" placeholder="请选择交易类别">
                    </c-select>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="通知日期" prop="tzdat">
                    <c-date-picker type="date" v-model="model.tzdat" style="width:100%" placeholder="请选择通知日期"></c-date-picker>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="合同编号" prop="didgrp.rec.conno">
                    <c-input v-model="model.didgrp.rec.conno" maxlength="16" placeholder="请输入申请人编号"></c-input>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="此信用证下的到单次数" prop="didgrp.rec.utlnbr">
                    <c-input disabled v-model="model.didgrp.rec.utlnbr" placeholder="请输入此信用证下的到单次数"></c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <c-col :span="12">
                    <el-form-item label="Letter day" prop="days"> 
                        <c-input v-model.number="model.days" placeholder="请输入Letter Days"></c-input>
                    </el-form-item>
                </c-col>
                <c-col :span="12">
                    <el-form-item label-width="10px">Days
                    </el-form-item>
                </c-col>
            </c-col>
        </c-col>
        <c-col :span="12" style="padding-left: 20px">
            <c-col :span="24">
                <el-card class="box-card">
                    <c-col :span="24">
                        <el-form-item label="交单行" prop="bddgrp.rec.docprbrol">
                            <c-select v-model="model.bddgrp.rec.docprbrol" style="width:100%" placeholder="请输入交单行" @change="calcPrb">
                                <el-option v-for="(item, index) in codes.docprbrolList" :key="index" :label="item.label" :value="item.value">
								</el-option>
                            </c-select>
                        </el-form-item>
                    </c-col>

                    <c-col :span="24">
                        <c-ptap6 :model="model" :argadr="{title:'BIC',grp: 'bddgrp',rol: 'prb'}" :requiredBic="model.bddgrp.rec.docprbrol=='PRB'" :requiredBankno="model.bddgrp.rec.docprbrol=='PRB'" :disabledExtkey="model.bddgrp.rec.docprbrol!='PRB'" :disabledBankno="model.bddgrp.rec.docprbrol!='PRB'" :disabledJigomc="model.bddgrp.rec.docprbrol!='PRB'" :disabledDizhii="model.bddgrp.rec.docprbrol!='PRB'" :isShowCard="false"></c-ptap6>
                    </c-col>
                </el-card>
            </c-col>

            <c-col :span="24"  style="margin-top:5px;">
                <el-card class="box-card">
                    <c-col :span="24">
                        <el-form-item label="付款人" prop="bddgrp.rec.payrol">
                            <c-select disabled v-model="model.bddgrp.rec.payrol" style="width:100%" placeholder="请输入付款人">
                            </c-select>
                        </el-form-item>
                    </c-col>

                    <c-col :span="24">
                        <c-ptap3 :model="model" :argadr="{title: 'BIC', grp: 'bdtp',rol: 'oth'}" :disabledExtkey="true" :disabledNamelc="true" :disabledAdrelc="true" :isShowCard="false"></c-ptap3>
                    </c-col>
                </el-card>
            </c-col>

            <c-col :span="24" style="margin-top:5px;">
				<c-ptap8 :model="model" :argadr="{title: '收款行行号',grp: 'bddgrp',rol: 'skh'}" :requiredBankno="true" :requiredJigomc="true" jigomcLabel="收款行名称" >
				</c-ptap8>
			</c-col>
        </c-col>
    </div>
</template>
<script>
import event from "../event";
import Default from "../model/default";
import moment from 'moment';

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [event,Default],
  data() {
    return {};
  },
  methods: {
      validateMatdat (rule, value, callback) {
		    if(this.model.bddgrp.blk.matper==''&&this.model.bddgrp.rec.docflg!='P'){
				if(value==""){
					callback(new Error('必输项'))
				}
			}
			if (moment(value).diff(moment(this.model.bddgrp.rec.rcvdat).add(1,"days").format('YYYY-MM-DD'), 'years') > 0) {
				callback(new Error('到期付款日期超一年'))
			}
			callback()
		},
  },
  created() {}
};
</script>
<style scoped lang="less">
.box-card {
  margin-bottom: 10px;
  /deep/ .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 10px;
  }
  /deep/ .el-card__body {
    padding: 10px 10px 10px 0px;
  }
}
</style>