<template> <c-row> <!-- =================顶部====================== --> <c-col :span="24"> <c-col :span="11"> <c-col :span="20"> <el-form-item label="Reference" prop="bodgrp.rec.ownref" style="width: 100%"> <c-input v-model="model.bodgrp.rec.ownref" maxlength="16" placeholder="请输入Reference" style="width: 95%" disabled></c-input> </el-form-item> </c-col> <c-col :span="1"> </c-col> <c-col :span="3" style="text-align: right"> <c-button style="margin:0 0" size="small" type="primary" :disabled="this.model.bodgrp.drr.pts.extkey==''" @click="onBotpButgetref"> 获取 </c-button> </c-col> </c-col> <c-col :span="11" :offset="1"> <el-form-item label="摘要" prop="bodgrp.rec.nam"> <c-input text-align="middle" v-model="model.bodgrp.rec.nam" maxlength="40" disabled placeholder="请输入Externally Displayed Name to Identify the Contract"></c-input> </el-form-item> </c-col> </c-col> <!-- ====================左边======================= --> <c-col :span="11"> <c-col :span="24"> <c-col :span="12"> <el-form-item label="Responsible User" prop="ditp.usr.extkey" style="width: 100%"> <c-row> <c-col :span="20"> <c-input style="width: 95%" v-model="model.botp.usr.extkey" maxlength="8" placeholder="请输入User ID" disabled></c-input> </c-col> <c-col :span="4"> <c-button style="margin:0 10px 0 0;padding: 0 10px;" size="small" icon="el-icon-search" type="primary"> </c-button> </c-col> </c-row> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="" prop="bodgrp.rec.dircolflg"> <c-checkbox v-model="model.bodgrp.rec.dircolflg">Direct Collection</c-checkbox> </el-form-item> </c-col> </c-col> <c-col :span="12"> <el-form-item label="Document Amount" prop="bodgrp.cbs.max.cur"> <c-select v-model="model.bodgrp.cbs.max.cur" style="width: 100%" placeholder="请选择Currency" @change="changeCur"> <el-option v-for="item in codes.curtxt1" :key="item.value" :label="item.label" :value="item.value"> </el-option> </c-select> </el-form-item> </c-col> <c-col :span="12"> <el-form-item style="text-align: left" label-width="20px" prop="bodgrp.cbs.max.amt"> <c-input-currency v-model="model.bodgrp.cbs.max.amt" style="text-align: left; width: 100%" placeholder="请输入Document Amount" @keyup.enter.native="defaultFunction('bodgrp.cbs.max.amt', model.bodgrp.cbs.max.amt)"></c-input-currency> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Open Amount" prop="bodgrp.cbs.opn1.cur"> <c-select disabled v-model="model.bodgrp.cbs.opn1.cur" style="width: 100%" placeholder="请选择Currency"> <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="12"> <el-form-item style="text-align: left" label-width="20px" prop="bodgrp.cbs.opn1.amt"> <c-input-currency v-model="model.bodgrp.cbs.opn1.amt" style="text-align: left; width: 100%" placeholder="请输入" :disabled="true" @keyup.enter.native="defaultFunction('bodgrp.cbs.opn1.amt', model.bodgrp.cbs.opn1.amt)"></c-input-currency> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Order Date" prop="bodgrp.rec.rcvdat"> <c-date-picker type="date" v-model="model.bodgrp.rec.rcvdat" style="width:100%" placeholder="请选择Order Date"> </c-date-picker> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Shipment date" prop="bodgrp.rec.shpdat"> <c-date-picker type="date" v-model="model.bodgrp.rec.shpdat" style="width:100%" placeholder="请选择Shipment date"></c-date-picker> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Presentation Date" prop="bodgrp.rec.predat"> <c-date-picker type="date" v-model="model.bodgrp.rec.predat" style="width:100%" placeholder="请选择Presentation Date"></c-date-picker> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Dispatched on" prop="bodgrp.rec.advdat"> <c-date-picker type="date" v-model="model.bodgrp.rec.advdat" style="width:100%" :disabled="true" placeholder="请选择Dispatched on"></c-date-picker> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Collection Condition" prop="bodgrp.rec.doctypcod"> <c-select v-model="model.bodgrp.rec.doctypcod" style="width:100%" placeholder="请选择Collection Condition" :code="codes.doctypcod"> </c-select> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Maturity Date" prop="bodgrp.rec.matdat"> <c-date-picker type="date" v-model="model.bodgrp.rec.matdat" style="width:100%" :disabled="model.bodgrp.rec.doctypcod === 'P'" placeholder="请选择Maturity Date"></c-date-picker> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="发票类型" prop="bodgrp.rec.invtyp"> <c-select v-model="model.bodgrp.rec.invtyp" style="width:100%" :code="invtyp"> </c-select> </el-form-item> </c-col> <c-col :span="12"> <el-form-item label="Tenor Specification" prop="bodgrp.rec.matpercnt"> <c-input v-model.number="model.bodgrp.rec.matpercnt" placeholder="请输入Tenor Specification" onkeyup="value=value.replace(/[^\d]/g,' ')" :disabled="model.bodgrp.rec.doctypcod === 'P'"></c-input> </el-form-item> </c-col> <c-col :span="1" style="margin-left:-10px"> <el-form-item label="Days"> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Starting from" prop="bodgrp.rec.matperbeg"> <c-select v-model="model.bodgrp.rec.matperbeg" style="width:100%" placeholder="请选择Starting from" :code="codes.matperbeg" :disabled="model.bodgrp.rec.doctypcod === 'P'"> </c-select> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Tenor Details Text" prop="bodgrp.blk.bogdet"> <c-input type="textarea" v-model="model.bodgrp.blk.bogdet" maxlength="43" show-word-limit :disabled="model.bodgrp.rec.doctypcod === 'P'" placeholder="请输入Tenor Details Text"></c-input> </el-form-item> </c-col> <c-docpre :model="model" :argadr="{ path: 'SEMFLG', grp: 'botp', code: 'docpre' }"></c-docpre> </c-col> <!-- ====================右边======================= --> <c-col :span="11" :offset="1"> <!-- <c-col :span="24"> <el-form-item label="Drawer参考号" prop="bodgrp.drr.pts.ref" > <c-input v-model="model.bodgrp.drr.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="Drawer" prop="bodgrp.drr.pts.extkey"> <c-fullbox> <c-input v-model="model.bodgrp.drr.pts.extkey" maxlength="50" placeholder="请输入External Key of Address" @keyup.enter.native="showGridPromptDialog('bodgrp.drr.pts.extkey')" ></c-input> <template slot="footer"> <c-button style="margin:0 10px 0 10px;padding: 0 12px;" size="small" type="primary" icon="el-icon-search" > </c-button> <c-button style="margin:0 0" size="small" type="primary" @click="onAplpDet" > 详情 </c-button> </template> </c-fullbox> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="地址名称" prop="bodgrp.drr.pts.adrblk"> <c-input type="textarea" :rows="4" v-model="model.bodgrp.drr.pts.adrblk" maxlength="50" :disabled="this.flag1" show-word-limit placeholder="请输入Address Block" ></c-input> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Collecting Bank参考号" prop="bodgrp.col.pts.ref" > <c-input v-model="model.bodgrp.col.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="Collecting Bank" prop="bodgrp.col.pts.extkey"> <c-fullbox> <c-input v-model="model.bodgrp.col.pts.extkey" maxlength="50" placeholder="请输入External Key of Address" @keyup.enter.native="showGridPromptDialog('bodgrp.col.pts.extkey')" ></c-input> <template slot="footer"> <c-button style="margin:0 10px 0 10px;padding: 0 12px;" size="small" type="primary" icon="el-icon-search" > </c-button> <c-button style="margin:0 0" size="small" type="primary" @click="onAplpDet" > 详情 </c-button> </template> </c-fullbox> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="地址名称" prop="bodgrp.col.pts.adrblk"> <c-input type="textarea" :rows="4" v-model="model.bodgrp.col.pts.adrblk" maxlength="50" :disabled="this.flag2" show-word-limit placeholder="请输入Address Block" ></c-input> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Drawee参考号" prop="bodgrp.dre.pts.ref" > <c-input v-model="model.bodgrp.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="Drawee" prop="bodgrp.dre.pts.extkey"> <c-fullbox> <c-input v-model="model.bodgrp.dre.pts.extkey" maxlength="50" placeholder="请输入External Key of Address" @keyup.enter.native="showGridPromptDialog('bodgrp.dre.pts.extkey')" ></c-input> <template slot="footer"> <c-button style="margin:0 10px 0 10px;padding: 0 12px;" size="small" type="primary" icon="el-icon-search" > </c-button> <c-button style="margin:0 0" size="small" type="primary" @click="onAplpDet" > 详情 </c-button> </template> </c-fullbox> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="地址名称" prop="bodgrp.dre.pts.adrblk"> <c-input type="textarea" :rows="4" v-model="model.bodgrp.dre.pts.adrblk" maxlength="50" :disabled="this.flag3" show-word-limit placeholder="请输入Address Block" ></c-input> </el-form-item> </c-col> --> <c-ptap :model="model" :argadr="{ title: 'Drawer', grp: 'bodgrp', rol: 'drr', }" :isAdrblk="true" :disabled="this.flag1"> </c-ptap> <c-ptap :model="model" :argadr="{ title: 'Collecting Bank', grp: 'bodgrp', rol: 'col', }" :disabled="this.flag2"> </c-ptap> <c-ptap :model="model" :argadr="{ title: 'Drawee', grp: 'bodgrp', rol: 'dre', }" :disabled="this.flag3"> </c-ptap> <c-col :span="24"> <el-form-item label="Country or region Code" prop="bodgrp.rec.stacty"> <c-select v-model="model.bodgrp.rec.stacty" style="width:100%" placeholder="请选择Country Code Risk Country!" :code="codes.stacty"> </c-select> </el-form-item> </c-col> <c-col :span="24"> <el-form-item label="Goods Code" prop="bodgrp.rec.stagod"> <c-select v-model="model.bodgrp.rec.stagod" style="width:100%" placeholder="请选择Goods Code" :code="codeTable2"> </c-select> </el-form-item> </c-col> </c-col> </c-row> </template> <script> import Api from "~/service/Api" import commonProcess from "~/mixin/commonProcess"; import CodeTable from "~/config/CodeTable" import Event from "~/model/Botdav/Event" import Utils from "~/utils"; 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], data() { return { flag1:false, flag2:false, flag3:false, codeTable2: [ { label: "金(含金饰品)", value: "001" }, { label: "银(含银饰品)", value: "002" }, { label: "铜(含电解铜、铜制品及铜精矿)", value: "003" }, { label: "铝(含电解铝、铝矾土及铝制品)", value: "004" }, { label: "锌(含电解锌、锌精矿)", value: "005" }, { label: "铁砂矿(含精矿)", value: "006" }, { label: "其他金属", value: "007" }, { label: "大豆", value: "008" }, { label: "玉米", value: "009" }, { label: "原油", value: "010" }, { label: "食用油(含棕榈油)", value: "011" }, { label: "煤", value: "013" }, { label: "其他", value: "099" }, ], columns: ['0 0 "lst1" 100 ', '1 1 "lst2" 100', '2 2 "document" 200'], codeTable: [ { label: "Airway Bills", value: "Airway Bills" }, { label: "Beneficiary's Declaration", value: "Beneficiary's Declaration" }, { label: "Bill of Lading Copies", value: "Bill of Lading Copies" }, { label: "Bill of Lading Originals", value: "Bill of Lading Originals" }, { label: "Certificate", value: "Certificate" }, { label: "Certificate of Analysis", value: "Certificate of Analysis" }, { label: "Certificate of Origin", value: "Certificate of Origin" }, { label: "Certificate of Quality", value: "Certificate of Quality" }, { label: "Certificate of Quantity", value: "Certificate of Quantity" }, { label: "Commercial Invoice", value: "Commercial Invoice" }, { label: "Courier Receipt", value: "Courier Receipt" }, { label: "Draft", value: "Draft" }, { label: "Export Licence", value: "Export Licence" }, { label: "Fax Report", value: "Fax Report" }, { label: "Inspection Cert", value: "Inspection Cert" }, { label: "Insurance Policy", value: "Insurance Policy" }, { label: "Packing List", value: "Packing List" }, { label: "Shipment Advice", value: "Shipment Advice" }, { label: "Weight List", value: "Weight List" }, ], // TableValue: [ // { // id: 0, // cmail1: "", // cmail2: "", // docnam: "", // description: "", // serialNum: "", // tableName: "", // tcddoc: "", // }, // ], newValue: { id: 0, cmail1: "", cmail2: "", docnam: "", description: "", serialNum: "", tableName: "", tcddoc: "", }, invtyp: [ { label: "type1", value: "1" } ], }; }, watch:{ "model.bodgrp.drr.pts.extkey" :{ immediate:true, handler(val ,oldVal){ if(this.model.bodgrp.drr.pts.extkey!=''){ this.flag1=true; }else{ this.flag1=false; } } }, "model.bodgrp.col.pts.extkey" :{ immediate:true, handler(val ,oldVal){ if(this.model.bodgrp.col.pts.extkey!=''){ this.flag2=true; }else{ this.flag2=false; } } }, "model.bodgrp.dre.pts.extkey" :{ immediate:true, handler(val ,oldVal){ if(this.model.bodgrp.dre.pts.extkey!=''){ this.flag3=true; }else{ this.flag3=false; } } }, }, methods: { ...Event, changeCur(){ this.executeDefault("cnybop.libflg").then((res) => { if ((res.respCode == SUCCESS)) { Utils.copyValueFromVO(this.model, res.data); } }); }, addTableValue(index) { var newTableValue = Object.assign({}, this.newValue); const serial = Utils.generateUUID(); newTableValue.serialNum = serial; this.model.botp.docgrdm.docgrd.splice(index - 1, 0, newTableValue); // var index = this.TableValue.length; // if (index > 0) { // newTableValue.id = this.TableValue[index - 1].id + 1; // } // this.TableValue.push(newTableValue); }, deleteTable(index) { this.model.botp.docgrdm.docgrd.splice(index, 1); // console.log(row) // console.log(this.TableValue) // for (let i = 0; i < this.TableValue.length; i++) { // if (this.TableValue[i].id == row.id) { // this.TableValue.splice(i, 1); // break; // } // } }, async docpre() { let rtnmsg = await this.executeDefault('bodgrp.blk.docpre') if (rtnmsg.respCode == SUCCESS) { //TODO 处理数据逻辑 this.updateModel(rtnmsg.data) } else { this.$notify.error({ title: '错误', message: '服务请求失败!' }); } }, }, computed: { flag() { return this.model.bodgrp.drr.pts.adrelc == ""; }, }, created: function () { console.log(this.root); }, } </script> <style> .messageLabel>>>.el-form-item__label { text-align: left; font-weight: bold; font-size: 12px; } </style>