|
|
@@ -0,0 +1,354 @@
|
|
|
+<template>
|
|
|
+ <el-form :model="documentForm" ref="form" label-position="top" style="margin-bottom: 4px" class="demo-ruleForm">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="14">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Shippper" prop="hshipperDetails">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" v-model="documentForm.hshipperDetails"
|
|
|
+ size="small" autocomplete="off" clearable placeholder=" ">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Consignee" prop="hconsigneeDetails">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;"
|
|
|
+ v-model="documentForm.hconsigneeDetails" size="small" autocomplete="off" clearable
|
|
|
+ placeholder=" ">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Notify party" prop="hnotifyDetails">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" v-model="documentForm.hnotifyDetails"
|
|
|
+ size="small" autocomplete="off" clearable placeholder=" ">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Pre-Carriage by" prop="value1">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;" v-model="documentForm.value1"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="place of Receipt" prop="placeReceiptNamePrint">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.placeReceiptNamePrint" size="small" autocomplete="off"
|
|
|
+ clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Ocean Vessel Voy No." prop="vesselCnName">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.vesselCnName" size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Port of Loading" prop="polEnName">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.polEnName" size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Port of Discharge" prop="destinationNamePrint">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.destinationNamePrint" size="small" autocomplete="off"
|
|
|
+ clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Place of Delivery" prop="podEnName">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.podEnName" size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label=" " prop="">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" disabled size="small"
|
|
|
+ autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label=" " prop="">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" disabled size="small"
|
|
|
+ autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label=" " prop="">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" disabled size="small"
|
|
|
+ autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="For delivery please apply to" prop="mshipperDetails">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;" v-model="documentForm.mconsigneeDetails"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Final Destination(for the Merchant's reference)" prop="">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable placeholder="">
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="9">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Marks and Numbers Conatainer No. Seal No." prop="marks">
|
|
|
+ <el-input type="textarea" :rows="15" style="width: 100%;" v-model="documentForm.marks"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <!-- <el-col :span="3">-->
|
|
|
+ <!-- <div style="border: 1px solid #000;">-->
|
|
|
+ <!-- <el-form-item label="Seal No." prop="cntrSealNo">-->
|
|
|
+ <!-- <el-input type="textarea" :rows="15" style="width: 100%;" v-model="documentForm.cntrSealNo"-->
|
|
|
+ <!-- size="small" autocomplete="off" clearable>-->
|
|
|
+ <!-- </el-input>-->
|
|
|
+ <!-- </el-form-item>-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- </el-col>-->
|
|
|
+ <el-col :span="3">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="No. of containers or packages" prop="numOfContainersOrPackages">
|
|
|
+ <el-input type="textarea" :rows="14" style="width: 100%;"
|
|
|
+ v-model="documentForm.numOfContainersOrPackages" size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Kind of packages,description of goods" prop="commodityDescr">
|
|
|
+ <el-input type="textarea" :rows="15" style="width: 100%;" v-model="documentForm.commodityDescr"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Gross Weight" prop="grossWeightOfBL">
|
|
|
+ <el-input type="textarea" :rows="15" style="width: 100%;" v-model="documentForm.grossWeightOfBL"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="3">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Measurement" prop="measurementOfBL">
|
|
|
+ <el-input type="textarea" :rows="15" style="width: 100%;" v-model="documentForm.measurementOfBL"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Total No. of Containaers or Packages(in words)" prop="capitalLetters">
|
|
|
+ <el-input style="width: 100%;" v-model="documentForm.capitalLetters"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ <!--
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="18">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;" v-model="documentForm.quantityPackingDescr"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ v-model="documentForm.quantityCntrTypesDescr" size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ -->
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="6">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Freight and charges" prop="">
|
|
|
+ <el-input type="textarea" :rows="2" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Revenue Tons" prop="">
|
|
|
+ <el-input type="textarea" :rows="2" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Rate Per" prop="">
|
|
|
+ <el-input type="textarea" :rows="2" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Prepaid" prop="">
|
|
|
+ <el-input type="textarea" :rows="2" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Collect" prop="">
|
|
|
+ <el-input type="textarea" :rows="2" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="6">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Ex.Rate" prop="">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Prepaid at" prop="prepaidAt">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;" v-model="documentForm.prepaidAt"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Payable at" prop="payableAt">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;" v-model="documentForm.payableAt"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Total Prepaid in Local Currency" prop="">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="No. of original B(s)L" prop="numberOfObl">
|
|
|
+ <el-input type="textarea" :rows="1" style="width: 100%;" v-model="documentForm.numberOfObl"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6">
|
|
|
+ <div style="border: 1px solid #000;">
|
|
|
+ <el-form-item label="Place and date of issue" prop="issueAt">
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 50%;" v-model="documentForm.issueAt"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ <el-input type="textarea" :rows="5" style="width: 50%;" v-model="documentForm.issueDateOfBL"
|
|
|
+ size="small" autocomplete="off" clearable>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ </el-form>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ // 表单对象
|
|
|
+ documentForm: {
|
|
|
+ type: Object,
|
|
|
+ default: {}
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+::v-deep.el-form-item {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep.el-form--label-top .el-form-item__label {
|
|
|
+ padding: 0;
|
|
|
+ line-height: 20px;
|
|
|
+}
|
|
|
+</style>
|