master
张同海 2 years ago
parent 186ec3cf06
commit c336e75ef9

@ -1 +0,0 @@
*{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}html{font-size:16px}body{background:#fff}.main{width:100%}[data-v-3f4fb6b1] .HeaderCell{color:#dd5643;background:#ffefe7!important;border-top:2px solid #dd5643!important;border-bottom:1px solid #dd5643!important;border-left:1px solid #dd5643!important;border-right:1px solid #dd5643!important}[data-v-3f4fb6b1] .HeaderCell:first-child{border-left:2px solid #dd5643!important}[data-v-3f4fb6b1] .HeaderCell:last-child{border-right:3px solid #dd5643!important}[data-v-3f4fb6b1] .Cellname{color:#dd5643;border-top:0 solid #dd5643!important;border-bottom:2px solid #dd5643!important;border-left:1px solid #dd5643!important;border-right:1px solid #dd5643!important}[data-v-3f4fb6b1] .Cellname:first-child{border-left:2px solid #dd5643!important}[data-v-3f4fb6b1] .Cellname:last-child{border-right:3px solid #dd5643!important}[data-v-3f4fb6b1] .el-table__expanded-cell{border-left:2px solid #52a5fa!important;border-right:3px solid #52a5fa!important;padding:0}.main[data-v-3f4fb6b1]{width:60%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:30px;box-sizing:border-box}.main .CsTitle[data-v-3f4fb6b1]{font-size:22px;font-weight:bolder;margin:30px 0}.main .CsHint[data-v-3f4fb6b1]{color:red;font-weight:700;margin-bottom:30px}.main .CsTop[data-v-3f4fb6b1]{border:2px solid #479ffa;margin-bottom:20px}.main .CsTop .CsTopBox3>P[data-v-3f4fb6b1]{margin:0!important;padding-top:0}.main .CsTop .CsTopBox3>P[data-v-3f4fb6b1]:first-child{margin-top:6px}.main .CsTop>div[data-v-3f4fb6b1]:nth-child(){background:red}.main .CsTop div>p[data-v-3f4fb6b1]{padding:6px;box-sizing:border-box;font-size:14px}.main .CsTop div>p[data-v-3f4fb6b1]:first-child{font-weight:700}.main .CsTop div>p[data-v-3f4fb6b1]:nth-child(2){padding-top:0;margin-left:25px}.main .CsButtonBox[data-v-3f4fb6b1]{width:100%;display:flex;align-items:flex-start}.main .Csbottom[data-v-3f4fb6b1]{margin-top:20px;border:2px solid #479ffa}.main .Csbottom>div:nth-child(2) .CsBox p[data-v-3f4fb6b1]{margin-left:25px}.main .Csbottom>div:nth-child(2) .CsBox p[data-v-3f4fb6b1]:first-child{margin:0}.main .Csbottom>div[data-v-3f4fb6b1]:nth-child(3){padding:6px;box-sizing:border-box}.main .Csbottom>div:nth-child(3) p[data-v-3f4fb6b1]{font-weight:700}.main .Csbottom>div:nth-child(3) p span[data-v-3f4fb6b1]{font-weight:100;margin-left:16px}.flex[data-v-3f4fb6b1]{display:flex}.flex>.F1[data-v-3f4fb6b1]{flex:1}.flex>.F2[data-v-3f4fb6b1]{flex:2.06}.CsBox[data-v-3f4fb6b1]{padding:6px;box-sizing:border-box}.CsFCRed[data-v-3f4fb6b1]{color:red}.CsFW[data-v-3f4fb6b1]{font-weight:bolder}.CsMt[data-v-3f4fb6b1]{margin-top:12px}.column[data-v-3f4fb6b1]{flex-direction:column}.BL[data-v-3f4fb6b1]{border-left:2px solid #479ffa}.BR[data-v-3f4fb6b1]{border-right:2px solid #479ffa}.BT[data-v-3f4fb6b1]{border-top:2px solid #479ffa}.BB[data-v-3f4fb6b1]{border-bottom:2px solid #479ffa}.CsTableCheckbox[data-v-3f4fb6b1]{width:100%;display:flex;align-items:center;border-bottom:2px solid #52a5fa!important;background:#f2f7fd}.CsTableCheckbox[data-v-3f4fb6b1] .el-checkbox__input{margin:0 10px 0 1rem}.CsTableCheckbox[data-v-3f4fb6b1] .el-checkbox__label{border-left:3px solid #fff;width:100%;padding-left:0!important}.CsTableCheckbox[data-v-3f4fb6b1] .el-checkbox__label>div>div>div{padding:6px;box-sizing:border-box;border-left:3px solid #fff;border-bottom:3px solid #fff;overflow:hidden}.CsTableCheckbox[data-v-3f4fb6b1] .el-checkbox__label>div>div>div:first-child{border-left:none}.CsTableCheckbox[data-v-3f4fb6b1] .el-checkbox__label>div>div>div p{font-weight:700;margin-bottom:.5rem}.CsCheckboxButtonBox[data-v-3f4fb6b1]{padding:10px;box-sizing:border-box;border-bottom:2px solid #52a5fa!important}.CsBottom[data-v-3f4fb6b1]{width:100%;margin-top:16px}.CsBottom p[data-v-3f4fb6b1]:first-child{font-weight:700}

@ -0,0 +1 @@
*{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}html{font-size:16px}body{background:#fff}.main{width:100%}[data-v-36647a20] .HeaderCell{color:#dd5643;background:#ffefe7!important;border-top:2px solid #dd5643!important;border-bottom:1px solid #dd5643!important;border-left:1px solid #dd5643!important;border-right:1px solid #dd5643!important}[data-v-36647a20] .HeaderCell:first-child{border-left:2px solid #dd5643!important}[data-v-36647a20] .HeaderCell:last-child{border-right:3px solid #dd5643!important}[data-v-36647a20] .Cellname{color:#dd5643;border-top:0 solid #dd5643!important;border-bottom:2px solid #dd5643!important;border-left:1px solid #dd5643!important;border-right:1px solid #dd5643!important}[data-v-36647a20] .Cellname:first-child{border-left:2px solid #dd5643!important}[data-v-36647a20] .Cellname:last-child{border-right:3px solid #dd5643!important}[data-v-36647a20] .el-table__expanded-cell{border-left:2px solid #52a5fa!important;border-right:3px solid #52a5fa!important;padding:0}.main[data-v-36647a20]{width:70%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:30px;box-sizing:border-box}.main .CsTitle[data-v-36647a20]{font-size:22px;font-weight:bolder;margin:30px 0}.main .CsHint[data-v-36647a20]{color:red;font-weight:700;margin-bottom:30px}.main .CsTop[data-v-36647a20]{border:2px solid #479ffa;margin-bottom:20px}.main .CsTop .CsTopBox3>P[data-v-36647a20]{margin:0!important;padding-top:0}.main .CsTop .CsTopBox3>P[data-v-36647a20]:first-child{margin-top:6px}.main .CsTop>div[data-v-36647a20]:nth-child(){background:red}.main .CsTop div>p[data-v-36647a20]{padding:6px;box-sizing:border-box;font-size:14px}.main .CsTop div>p[data-v-36647a20]:first-child{font-weight:700}.main .CsTop div>p[data-v-36647a20]:nth-child(2){padding-top:0}.main .CsButtonBox[data-v-36647a20]{width:100%;display:flex;align-items:flex-start}.main .Csbottom[data-v-36647a20]{margin-top:20px;border:2px solid #479ffa}.main .Csbottom>div:nth-child(2) .CsBox p[data-v-36647a20]:first-child{margin:0}.main .Csbottom>div[data-v-36647a20]:nth-child(3){padding:6px;box-sizing:border-box}.main .Csbottom>div:nth-child(3) p[data-v-36647a20]{font-weight:700}.main .Csbottom>div:nth-child(3) p span[data-v-36647a20]{font-weight:100;margin-left:16px}.flex[data-v-36647a20]{display:flex}.flex>.F1[data-v-36647a20]{flex:1}.flex>.F2[data-v-36647a20]{flex:2.06}.CsBox[data-v-36647a20]{padding:6px;box-sizing:border-box}.CsFCRed[data-v-36647a20]{color:red}.CsFW[data-v-36647a20]{font-weight:bolder}.CsMt[data-v-36647a20]{margin-top:12px}.column[data-v-36647a20]{flex-direction:column}.BL[data-v-36647a20]{border-left:2px solid #479ffa}.BR[data-v-36647a20]{border-right:2px solid #479ffa}.BT[data-v-36647a20]{border-top:2px solid #479ffa}.BB[data-v-36647a20]{border-bottom:2px solid #479ffa}.CsTableCheckbox[data-v-36647a20]{width:100%;display:flex;align-items:center;border-bottom:2px solid #52a5fa!important;background:#f2f7fd}.CsTableCheckbox[data-v-36647a20] .el-checkbox__input{margin:0 10px 0 1rem}.CsTableCheckbox[data-v-36647a20] .el-checkbox__label{border-left:3px solid #fff;width:100%;padding-left:0!important}.CsTableCheckbox[data-v-36647a20] .el-checkbox__label>div>div>div{padding:6px;box-sizing:border-box;border-left:3px solid #fff;border-bottom:3px solid #fff;overflow:hidden}.CsTableCheckbox[data-v-36647a20] .el-checkbox__label>div>div>div:first-child{border-left:none}.CsTableCheckbox[data-v-36647a20] .el-checkbox__label>div>div>div p{font-weight:700;margin-bottom:.5rem}.CsCheckboxButtonBox[data-v-36647a20]{padding:10px;box-sizing:border-box;border-bottom:2px solid #52a5fa!important}.CsBottom[data-v-36647a20]{width:100%;margin-top:16px}.CsBottom p[data-v-36647a20]:first-child{font-weight:700}[data-v-36647a20] .el-icon-arrow-right{font-weight:bolder;color:#dd5643}.RXing[data-v-36647a20]{color:red;margin-right:2px}.Csone[data-v-36647a20]{padding:6px!important}

2
dist/index.html vendored

@ -1 +1 @@
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>vue</title><script defer="defer" src="/js/chunk-vendors.54521abf.js"></script><script defer="defer" src="/js/app.c7bcfe55.js"></script><link href="/css/chunk-vendors.e7270478.css" rel="stylesheet"><link href="/css/app.3cb2d1e8.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>vue</title><script defer="defer" src="/js/chunk-vendors.6379e6de.js"></script><script defer="defer" src="/js/app.a3dc0e63.js"></script><link href="/css/chunk-vendors.e7270478.css" rel="stylesheet"><link href="/css/app.77fe0bc9.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1,34 +1,64 @@
import request from "@/utils/axios";
import qs from "qs";
import http from "@/utils/http";
//页面查询接口
const getInfo = (data) => {
//获取链接详情
const getInfo = (params) => {
return request({
data: {
url: "/invoice/link/getInfo",
method: "POST",
data: qs.stringify(data),
url: "/api/JF/Info",
method: "get",
params,
},
});
};
//开票接口
const createInvoice = (data) => {
//保存详情
const SaveDetail = (data) => {
return request({
data: {
url: "/invoice/link/uploadInvoice",
url: "/api/JF/SaveDetail",
method: "POST",
data: qs.stringify(data),
data,
},
});
};
// Imdg
const JFImdg = (params) => {
return request({
data: {
url: "/api/JF/JFImdg",
method: "get",
params,
},
});
};
// package
const JFPackage = (params) => {
return request({
data: {
url: "/api/JF/JFPackage",
method: "get",
params,
},
});
};
// UNNO
const JFUNNO = (params) => {
return request({
data: {
url: "/api/JF/JFUNNO/1/9999",
method: "get",
params,
},
});
};
// 查询
const Load = (params) => {
// unno 限制页
const JFUNNOLimit = (params) => {
return request({
data: {
url: "/api/Ams/Load",
url: "/api/JF/JFUNNOLimit",
method: "get",
params,
},
});
};
export { getInfo, createInvoice };
export { getInfo, SaveDetail, JFImdg, JFPackage, JFUNNO, JFUNNOLimit };

@ -11,8 +11,8 @@ Vue.config.productionTip = false;
Vue.prototype.$axios = axios;
const router = new VueRouter({
routes: routes,
mode: "history", //去掉#
// mode: "hash",
// mode: "history", //去掉#
mode: "hash",
});
new Vue({
router: router,

@ -8,20 +8,20 @@ export default ({ data }) => {
});
server.interceptors.response.use(
(req) => {
if (req.data.code != 200) {
Message({
showClose: true,
message: req.data.message ? req.data.message : req.data.msg,
type: "warning",
duration: 0,
});
} else {
// Message({
// message: req.data.message ? req.data.message : req.data.msg,
// type: "success",
// duration: 500,
// });
}
// if (req.data.code != 200) {
// Message({
// showClose: true,
// message: req.data.message ? req.data.message : req.data.msg,
// type: "warning",
// duration: 0,
// });
// } else {
// // Message({
// // message: req.data.message ? req.data.message : req.data.msg,
// // type: "success",
// // duration: 500,
// // });
// }
return req;
},
(err) => {

@ -7,28 +7,31 @@
III, regulation 4 and section 9 of the General Introduction to the IMDG
Code.
</p>
<div class="CsTop flex column">
<div class="CsTop flex column" :style="{ width: '100%' }">
<div class="flex BB">
<div class="F1 BR">
<p>1.Shipper</p>
<p>
SHANDONG SMART INTERNATIONAL LOGISTICS CO LTD FLOOR 12-13, FUDU
BLDG, NO.8 NANJING ROAD, QINGDAO CHINA QINGDAO, 266500
{{ tableData.shipper }}
</p>
</div>
<div class="F1">
<div class="BB">
<p>2.Transport document number</p>
<p>596854040</p>
<p>{{ tableData.transportNumber }}</p>
</div>
<div class="flex BB">
<p>3.Page of pages</p>
<p class="Csone">&nbsp;&nbsp;&nbsp;1-1</p>
<p class="Csone">&nbsp;&nbsp;&nbsp;{{ tableData.pageOfPages }}</p>
</div>
<div class="flex">
<div class="F1 BR"><p>4.Shipper's reference</p></div>
<div class="F1 BR">
<p>4.Shipper's reference</p>
<p>{{ tableData.shipperReference }}</p>
</div>
<div class="F1">
<p>5.Freight forwarder's reference</p>
<p>{{ tableData.freightForwarderReference }}</p>
</div>
</div>
</div>
@ -38,34 +41,33 @@
<div class="F1 BB">
<p>6.Consignee</p>
<p>
SHANDONG SMART INTERNATIONAL LOGISTICS CO LTD FLOOR 12-13, FUDU
BLDG, NO.8 NANJING ROAD, QINGDAO CHINA QINGDAO, 266500
{{ tableData.consignee }}
</p>
</div>
<div class="F1">
<p>7.Carrier (to be completed by the carrier)</p>
<p>MAERSK LINE</p>
<p>{{ tableData.carrier }}</p>
</div>
</div>
<div class="flex column F1">
<div class="flex BB">
<div class="F1 BR">
<p>10.Vessel/flight no.and date</p>
<p>MAERSK SALINA 225S</p>
<p>{{ tableData.vesselOrflightNoAndDate }}</p>
</div>
<div class="F1">
<p>11.Port/place of loading</p>
<p>QINGDAO,CHINA</p>
<p>{{ tableData.portPlaceOfLoading }}</p>
</div>
</div>
<div class="flex BB">
<div class="F1 BR">
<p>12.Port/place of discharge</p>
<p>GUAYAQUIL,ECUADOR</p>
<p>{{ tableData.portPlaceOfLoading }}</p>
</div>
<div class="F1">
<p>13.Destination</p>
<p>GUAYAQUIL,ECUADOR</p>
<p>{{ tableData.destination }}</p>
</div>
</div>
<div class="F1">
@ -75,7 +77,7 @@
<p>
24 hr Emergency contact person :
<el-input
v-model="input"
v-model="tableData.contactPerson"
placeholder="请输入内容"
size="small"
:style="{ width: '40%', margin: '0 0 5px 15px' }"
@ -83,7 +85,7 @@
<br />
24 hr Emergency contact telephone:
<el-input
v-model="input"
v-model="tableData.contactTelephone"
placeholder="请输入内容"
size="small"
:style="{ width: '40%' }"
@ -96,14 +98,7 @@
<div class="CsTopBox3 BB">
<p>SHIPPER'S DECLARATION</p>
<p>
I hereby declare that the contents of this consignment are fully and
accurately <br />
described below by the proper shipping name, and are classified,
packaged, marked
<br />
and labeled/placarded and are in all respects in proper condition for
transport according to the applicable international and national
government regu-<br />lations.
{{ tableData.shipperdeclaration }}
</p>
<p class="CsFCRed">
8.This shipment is within the limitations prescribed for: (Delete
@ -115,11 +110,12 @@
14.Shipment information Number and kind of packages; description of
goods ( *see bottom)
</p>
<p>{{ tableData.descriptionOfGoods }}</p>
</div>
</div>
<!-- @cell-dblclick="FnTableClick" -->
<el-table
:data="tableData"
:data="tableData.jFSubDtos"
style="width: 100%"
border
ref="tableRef"
@ -134,31 +130,54 @@
<el-checkbox
v-model="item.CheckboxType"
class="CsTableCheckbox"
v-for="(item, index) in scope.row.CheckboxData"
v-for="(item, index) in scope.row.gson"
:key="index"
>
<div class="flex column">
<div class="flex">
<div class="F1">
<p><span class="RXing">*</span>UN No</p>
<el-input
v-model="item.input"
<el-select
v-model="item.unno"
:style="{ width: '90%' }"
placeholder="UN No"
></el-input>
filterable
remote
reserve-keyword
:remote-method="UNNOremoteMethod"
:loading="UNNOloading"
@change="
(e) => {
FnChangeUNNO(e, item);
}
"
>
<el-option
v-for="item in UNNOData"
:key="item.id"
:label="item.unno"
:value="item.unno"
>
</el-option>
</el-select>
</div>
<div class="F1">
<p><span class="RXing">*</span>Imo Class(Sub risk)</p>
<el-input
v-model="item.input3"
v-model="item.imoClass"
:style="{ width: '90%' }"
placeholder="Imo Class(Sub risk)"
@change="
(e) => {
FnChangeimoClass(e, item);
}
"
></el-input>
</div>
<div class="F1">
<p>Sub Risk1</p>
<el-input
v-model="item.input3"
v-model="item.subrisk1"
:style="{ width: '90%' }"
placeholder="Sub Risk1"
></el-input>
@ -166,7 +185,7 @@
<div class="F1">
<p>Sub Risk2</p>
<el-input
v-model="item.input3"
v-model="item.subrisk2"
:style="{ width: '90%' }"
placeholder="Sub Risk2"
></el-input>
@ -176,7 +195,7 @@
<div class="F2">
<p><span class="RXing">*</span>Proper Shipping Name</p>
<el-input
v-model="item.input1"
v-model="item.properShippingName"
:style="{ width: '95%' }"
placeholder="Proper Shipping Name"
></el-input>
@ -184,7 +203,7 @@
<div class="F2">
<p>Technical Name (if have)</p>
<el-input
v-model="item.input2"
v-model="item.technicalName"
:style="{ width: '90%' }"
placeholder="Technical Name (if have)"
></el-input>
@ -194,7 +213,7 @@
<div class="F1">
<p><span class="RXing">*</span>Packing Group</p>
<el-select
v-model="item.input4"
v-model="item.packingGroup"
:style="{ width: '90%' }"
placeholder="Packing Group"
>
@ -206,7 +225,7 @@
<div class="F1">
<p><span class="RXing">*</span>EMS</p>
<el-input
v-model="item.input5"
v-model="item.ems"
:style="{ width: '90%' }"
placeholder="EMS"
>
@ -215,25 +234,25 @@
<div class="F1">
<p><span class="RXing">*</span>Packing Code</p>
<el-input
v-model="item.input9"
v-model="item.packingCode"
:style="{ width: '90%' }"
placeholder="Packing Code"
></el-input>
</div>
<div class="F1">
<p><span class="RXing">*</span>Packing Type</p>
<!-- <p><span class="RXing">*</span>Packing Type</p>
<el-input
v-model="item.input9"
:style="{ width: '90%' }"
placeholder="Packing Type"
></el-input>
></el-input> -->
</div>
</div>
<div class="flex">
<div class="F1">
<p>Flash Point (if have )</p>
<el-input
v-model="item.input5"
v-model="item.flashPoint"
:style="{ width: '90%' }"
placeholder="Flash Point (if have )"
>
@ -243,7 +262,7 @@
<div class="F1">
<p><span class="RXing">*</span>Marine Pollutant(p or no)</p>
<el-select
v-model="item.input6"
v-model="item.marinePollutant"
:style="{ width: '90%' }"
placeholder="Marine Pollutant(p or no)"
>
@ -254,25 +273,33 @@
<div class="F1">
<p><span class="RXing">*</span>Package Quantity</p>
<el-input
v-model="item.input8"
v-model="item.packageQuantity"
:style="{ width: '90%' }"
placeholder="Package Quantity "
></el-input>
</div>
<div class="F1">
<p><span class="RXing">*</span>Package Type</p>
<el-input
v-model="item.input8"
<el-select
v-model="item.packageType"
:style="{ width: '90%' }"
placeholder="Package Type "
></el-input>
>
<el-option
v-for="item in JFPackageData"
:key="item.code"
:label="item.value"
:value="item.code"
>
</el-option>
</el-select>
</div>
</div>
<div class="flex">
<div class="F1">
<p>Inner Package</p>
<el-select
v-model="item.input14"
v-model="item.innerPackage"
placeholder="Inner Package"
:style="{ width: '90%' }"
>
@ -301,7 +328,7 @@
<div class="F1">
<p>Inner Package Type</p>
<el-input
v-model="item.input7"
v-model="item.innerPackageType"
:style="{ width: '90%' }"
placeholder="Inner Package Type"
></el-input>
@ -309,7 +336,7 @@
<div class="F1">
<p><span class="RXing">*</span>Gross Weight</p>
<el-input
v-model="item.input10"
v-model="item.grossWeight"
:style="{ width: '90%' }"
placeholder="Gross Weight "
>
@ -319,7 +346,7 @@
<div class="F1">
<p><span class="RXing">*</span>Net Weight</p>
<el-input
v-model="item.input11"
v-model="item.netWeight"
:style="{ width: '90%' }"
placeholder="Net Weight "
>
@ -331,7 +358,7 @@
<div class="F1">
<p>NA number</p>
<el-input
v-model="item.input7"
v-model="item.naNumber"
:style="{ width: '90%' }"
placeholder="美国货,按需填写"
></el-input>
@ -349,7 +376,7 @@
</el-tooltip>
</p>
<el-select
v-model="item.input12"
v-model="item.limitedQuantity"
placeholder="美国RQs/可免除量/限量三选一"
:style="{ width: '90%' }"
>
@ -360,17 +387,23 @@
</el-select>
</div>
<div class="F1">
<p>Control Temperature</p>
<p>
<span v-if="item.Limittype" class="RXing">*</span>
Control Temperature
</p>
<el-input
v-model="item.input7"
v-model="item.controlTemperature"
:style="{ width: '90%' }"
placeholder="控制温度特定UN填写"
></el-input>
</div>
<div class="F1">
<p>Emergency Temperature</p>
<p>
<span v-if="item.Limittype" class="RXing">*</span>
Emergency Temperature
</p>
<el-input
v-model="item.input7"
v-model="item.emergencyTemperature"
:style="{ width: '90%' }"
placeholder="紧急温度特定UN填写"
></el-input>
@ -380,18 +413,26 @@
<div class="F2">
<p>UNNO suffix/Sequence</p>
<el-input
v-model="item.input13"
v-model="item.unnoSufficSequence"
:style="{ width: '90%' }"
placeholder="UNNO suffix/Sequence"
></el-input>
</div>
<div class="F2">
<p>IMDG Code Segregation Group</p>
<el-input
v-model="item.input13"
<el-select
v-model="item.imdgCodeSegregationGroup"
:style="{ width: '90%' }"
placeholder="货物有隔离性需要选择"
></el-input>
>
<el-option
v-for="item in JFImdgData"
:key="item.code"
:label="item.value"
:value="item.code"
>
</el-option>
</el-select>
</div>
</div>
</div>
@ -425,34 +466,38 @@
</div>
</template>
</el-table-column>
<el-table-column prop="date" label="15.Container number" width="180">
<el-table-column
prop="containerNumber"
label="15.Container number"
width="180"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.date"
v-model="scope.row.containerNumber"
placeholder="Container number"
></el-input>
</template>
</el-table-column>
<el-table-column prop="name" label="16.Seal number(s)" width="180">
<el-table-column prop="sealNumber" label="16.Seal number(s)" width="180">
<template slot-scope="scope">
<el-input
v-model="scope.row.name"
v-model="scope.row.sealNumber"
placeholder="Seal number(s)"
></el-input>
</template>
</el-table-column>
<el-table-column prop="address" label="17.Container Size & type">
<el-table-column prop="containerSize" label="17.Container Size & type">
<template slot-scope="scope">
<el-input
v-model="scope.row.address"
v-model="scope.row.containerSize"
placeholder="Container Size & type"
></el-input>
</template>
</el-table-column>
<el-table-column prop="address2" label="18.Tare mass(kg)">
<el-table-column prop="tareMass" label="18.Tare mass(kg)">
<template slot-scope="scope">
<el-input
v-model="scope.row.address2"
v-model="scope.row.tareMass"
placeholder="Tare mass(kg)"
></el-input>
</template>
@ -512,56 +557,49 @@
<el-button icon="el-icon-delete" type="text" @click="FnDelRow">
删除一行
</el-button>
<el-button icon="el-icon-upload" type="text" @click="FnSaveDRow">
保存
</el-button>
</div>
<div class="Csbottom flex column">
<div class="Csbottom flex column" :style="{ width: '100%' }">
<div class="flex BB">
<div class="F1 CsBox BR CsFCRed">
<p class="CsFW">CONTAINER/VEHICLE PACKING CERTIFICATE</p>
<p>
I hereby declare that the goods described above have been
packed/loaded into the container/vehicle identified above in
accordance with the applicable provisions.** MUST BE COMPLETED AND
SIGNED FOR ALL CONTAINER/VEHICLE LOADS BY PERSON RESPONSIBLE FOR
PACKING/LOADING
{{ tableData.packingcertificate }}
</p>
</div>
<div class="F1 CsBox CsFCRed">
<p class="CsFW">21.RECEIVING ORGANIZATION RECEIPT</p>
<p>
Received the above number of packages/containers/trailers in
apparent good order and condition, unless stated hereon: RECEIVING
ORGANISATION REMARKS:
{{ tableData.organizationreceipt }}
</p>
</div>
</div>
<div class="flex">
<div class="F1 CsBox BR">
<p class="CsFW">20.Name of company</p>
<p>SHANDONG WEIFANG RAINBOW CHEMICAL CO.,LTD.</p>
<p>{{ tableData.nameOfCompany }}</p>
<p class="CsFW CsMt">Name/status of declarant</p>
<p>
6TH.FLOOR,GAOXINJISHUCHUANGYECEN-<br />
TRE,SHUNHUA ROAD 750,JINAN,SHAN-<br />
DONG,CHINA 250101
{{ tableData.nameStatusDeclarant }}
</p>
<p class="CsFW CsMt">Place and date</p>
<p>QINGDAO 2022/03/26</p>
<p>{{ tableData.placeDate }}</p>
<p class="CsFW CsMt">Signature of declarant</p>
<p class="CsFW">&nbsp;</p>
<p class="CsFW">{{ tableData.signatureDeclarant }}</p>
</div>
<div class="F1 CsBox">
<p class="CsFW">22.Name of company</p>
<p>SHANDONG WEIFANG RAINBOW CHEMICAL CO.,LTD.</p>
<p>{{ tableData.nameOfCompany }}</p>
<p class="CsFW CsMt">Name/status of declarant</p>
<p>
6TH.FLOOR,GAOXINJISHUCHUANGYECEN-<br />
TRE,SHUNHUA ROAD 750,JINAN,SHAN-<br />
DONG,CHINA 250101
{{ tableData.nameStatusDeclarant }}
</p>
<p class="CsFW CsMt">Place and date</p>
<p>QINGDAO 2022/03/26</p>
<p>{{ tableData.placeDate }}</p>
<p class="CsFW CsMt">Signature of declarant</p>
<p class="CsFW">&nbsp;</p>
<p class="CsFW">&nbsp;{{ tableData.signatureDeclarant }}</p>
</div>
</div>
<!-- <div class="flex">
@ -583,149 +621,231 @@
</div>
</template>
<script>
import { getInfo } from "../api/views/Index";
import moment from "moment";
import {
getInfo,
SaveDetail,
JFImdg,
JFPackage,
JFUNNO,
JFUNNOLimit,
} from "../api/views/Index";
// import moment from "moment";
export default {
name: "ViewIndex",
data() {
return {
moment,
tableData: [
{
id: 0,
date: "",
Web_date_type: true,
name: "",
Web_name_type: true,
address: "",
Web_address_type: true,
address2: "",
Web_address2_type: true,
CheckboxData: [
{
input: "",
Web_input_type: true,
input1: "",
Web_input1_type: true,
input2: "",
Web_input2_type: true,
input3: "",
Web_input3_type: true,
input4: "",
Web_input4_type: true,
input5: "",
Web_input5_type: true,
input6: "",
Web_input6_type: true,
input7: "",
Web_input7_type: true,
input8: "",
Web_input8_type: true,
input9: "",
Web_input9_type: true,
input10: "",
Web_input10_type: true,
input11: "",
Web_input11_type: true,
input12: "",
Web_input12_type: true,
input13: "",
Web_input13_type: true,
input14: "",
Web_input14_type: true,
CheckboxType: false,
},
],
},
],
tableData: {
jFSubDtos: [
{
containerNumber: "",
sealNumber: "",
containerSize: "",
tareMass: "",
gson: [
{
unnoSufficSequence: "",
imoClass: "",
subrisk1: "",
subrisk2: "",
properShippingName: "",
packingGroup: "",
ems: "",
marinePollutant: "",
flashPoint: "",
technicalName: "",
Limittype: false,
},
],
},
],
},
JFImdgData: [],
JFPackageData: [],
UNNOData: [],
JFUNNOLimitData: [],
UNNOloading: false,
};
},
mounted() {},
mounted() {
let gid = this.$route.query.gid;
if (gid) {
getInfo({ gid }).then((res) => {
if (res.data.status == 0 && res.data.rows.jFSubDtos) {
res.data.rows.jFSubDtos.forEach((item) => {
item.gson.forEach((item2) => {
item2.Limittype = false;
});
});
this.tableData = res.data.rows;
// this.Init();
}
});
}
this.Init();
},
methods: {
FnChangeUNNO(e, data) {
this.UNNOData.forEach((item) => {
if (item.unno == e) {
data.unnoSufficSequence = item.suffix;
data.imoClass = item.imO_CLASS;
data.subrisk1 = item.suB_HAZARD1;
data.subrisk2 = item.suB_HAZARD2;
data.properShippingName = item.propeR_SHIPPING_NAME;
data.packingGroup = item.packinG_GROUP;
data.ems = item.ems;
data.marinePollutant = item.marinE_POLLUTANT;
data.flashPoint = item.flasH_POINT;
data.technicalName = item.technicaL_NAME;
}
});
this.FnCheckData(data);
},
FnChangeimoClass(e, data) {
this.FnCheckData(data);
},
FnCheckData(data) {
let type = true;
this.JFUNNOLimitData.forEach((item) => {
if (item.unno == data.unno && item.class == data.imoClass) {
type = false;
}
});
type ? (data.Limittype = false) : (data.Limittype = true);
},
UNNOremoteMethod(query) {
if (query !== "") {
this.UNNOloading = true;
JFUNNO({ UNNO: query }).then((res) => {
this.UNNOloading = false;
this.UNNOData = res.data.rows.items.filter((item) => {
return item.unno.toLowerCase().indexOf(query.toLowerCase()) > -1;
});
});
} else {
this.UNNOData = [];
}
},
Init() {
JFImdg().then((res) => {
this.JFImdgData = res.data.rows;
});
JFPackage().then((res) => {
this.JFPackageData = res.data.rows;
});
JFUNNOLimit().then((res) => {
this.JFUNNOLimitData = res.data.rows;
});
},
FnAddCheckbox(data) {
data.CheckboxData.push({
input: "",
Web_input_type: true,
CheckboxType: false,
data.gson.push({
unnoSufficSequence: "",
imoClass: "",
subrisk1: "",
subrisk2: "",
properShippingName: "",
packingGroup: "",
ems: "",
marinePollutant: "",
flashPoint: "",
technicalName: "",
Limittype: false,
});
},
FnDelCheckbox(data) {
data.CheckboxData.forEach((item, index) => {
data.gson.forEach((item, index) => {
if (item.CheckboxType) {
data.CheckboxData.splice(index, 1);
data.gson.splice(index, 1);
}
});
},
FnCopyCheckbox(data) {
data.CheckboxData.forEach((item, index) => {
data.gson.forEach((item, index) => {
if (item.CheckboxType) {
item.CheckboxType = false;
data.CheckboxData.push(item);
data.gson.push(item);
}
});
},
FnSaveDRow() {
let type = true;
let Arr = [
"unno",
"imoClass",
"properShippingName",
"packingGroup",
"ems",
"packingCode",
"marinePollutant",
"packageQuantity",
"packageType",
"grossWeight",
"netWeight",
];
// controlTemperature emergencyTemperature
this.tableData.jFSubDtos.forEach((item) => {
item.pid = this.$route.query.gid;
item.gson.forEach((item2) => {
let Arr2 = [];
if (item2.Limittype) {
Arr2 = [...Arr, "controlTemperature", "emergencyTemperature"];
} else {
Arr2 = Arr;
}
Arr2.forEach((i) => {
if (!item2[i]) {
type = false;
}
});
});
});
if (type) {
SaveDetail(this.tableData.jFSubDtos).then((res) => {
this.$message({
message: `保存${res.data.status == 0 ? "成功" : "失败"}`,
type: res.data.status == 0 ? "success" : "warning",
});
});
} else {
this.$message({
message: "请补全必填项",
type: "warning",
});
}
},
FnAddRow() {
this.tableData.push({
id: this.tableData[this.tableData.length - 1].id + 1,
date: "",
Web_date_type: true,
name: "",
Web_name_type: true,
address: "",
Web_address_type: true,
address2: "",
Web_address2_type: true,
CheckboxData: [
this.tableData.jFSubDtos.push({
gson: [
{
input: "",
Web_input_type: true,
input1: "",
Web_input1_type: true,
input2: "",
Web_input2_type: true,
input3: "",
Web_input3_type: true,
input4: "",
Web_input4_type: true,
input5: "",
Web_input5_type: true,
input6: "",
Web_input6_type: true,
input7: "",
Web_input7_type: true,
input8: "",
Web_input8_type: true,
input9: "",
Web_input9_type: true,
input10: "",
Web_input10_type: true,
input11: "",
Web_input11_type: true,
input12: "",
Web_input12_type: true,
input13: "",
Web_input13_type: true,
input14: "",
Web_input14_type: true,
CheckboxType: false,
unnoSufficSequence: "",
imoClass: "",
subrisk1: "",
subrisk2: "",
properShippingName: "",
packingGroup: "",
ems: "",
marinePollutant: "",
flashPoint: "",
technicalName: "",
Limittype: true,
},
],
});
},
FnDelRow() {
this.$refs.tableRef.selection.forEach((item) => {
this.tableData.forEach((item2, index2) => {
if (item.id == item2.id) {
this.tableData.splice(index2, 1);
this.tableData.jFSubDtos.forEach((item2, index2) => {
if (item.gId == item2.gId) {
this.tableData.jFSubDtos.splice(index2, 1);
}
});
});
},
FnCopyRow() {
this.$refs.tableRef.selection.forEach((item) => {
this.tableData.forEach((item2, index2) => {
if (item.id == item2.id) {
this.tableData.push(item2);
this.tableData.jFSubDtos.forEach((item2, index2) => {
if (item.gId == item2.gId) {
this.tableData.jFSubDtos.push(item2);
}
});
});

@ -14,7 +14,7 @@ module.exports = defineConfig({
proxy: {
// 跨域处理
"/api": {
target: "http://60.209.125.238:35201", //目标接口域名
target: "http://60.209.125.238:25811", //目标接口域名
changeOrigin: true, //是否跨域
pathRewrite: {
"^/api": "", //重写接口

Loading…
Cancel
Save