zth
/
VueMsk
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

10/24

Browse Source
master
张同海 2 years ago
parent dee3fe4751
commit 3e643bc80f
11 changed files with 312 additions and 21 deletions
Show Stats Download Patch File Download Diff File

1
dist/css/app.3cb2d1e8.css vendored
Unescape Escape View File

@ -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-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}

1
dist/css/app.9c38eabb.css vendored
Unescape Escape View File

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

2
dist/index.html vendored
Unescape Escape View File

@ -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.58bf248f.js"></script><link href="/css/chunk-vendors.e7270478.css" rel="stylesheet"><link href="/css/app.9c38eabb.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.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>

2
dist/js/app.58bf248f.js vendored
View File

File diff suppressed because one or more lines are too long

1
dist/js/app.58bf248f.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/js/app.c7bcfe55.js vendored
View File

File diff suppressed because one or more lines are too long

1
dist/js/app.c7bcfe55.js.map vendored
View File

File diff suppressed because one or more lines are too long

BIN
src/assets/file.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/assets/logo.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 21 KiB

BIN
src/assets/ykp.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 9.2 KiB

323
src/views/index.vue
Unescape Escape View File

@ -70,9 +70,20 @@
<div class="F1">
<p>9.Additional handling information</p>
<p>
24 hr Emergency contact person : MR <br />
24 hr Emergency contact telephone: 123456 <br />
EMS : F-A,S-A
24 hr Emergency contact person :
<el-input
v-model="input"
placeholder="请输入内容"
:style="{ width: '40%', marginLeft: '15px' }"
></el-input>
<br />
24 hr Emergency contact telephone:
<el-input
v-model="input"
placeholder="请输入内容"
:style="{ width: '40%' }"
></el-input>
<br />
</p>
</div>
</div>
@ -101,11 +112,11 @@
</p>
</div>
</div>
<!-- @cell-dblclick="FnTableClick" -->
<el-table
:data="tableData"
style="width: 100%"
border
@cell-dblclick="FnTableClick"
ref="tableRef"
header-cell-class-name="HeaderCell"
header-row-class-name="HeaderRow"
@ -123,6 +134,183 @@
>
<div class="flex column">
<div class="flex">
<div class="F1">
<p>UN No</p>
<el-input
v-model="item.input"
:style="{ width: '90%' }"
placeholder="UN No"
></el-input>
</div>
<div class="F2">
<p>Proper Shipping Name</p>
<el-input
v-model="item.input1"
:style="{ width: '95%' }"
placeholder="Proper Shipping Name"
></el-input>
</div>
<div class="F1">
<p>Technical Name (if have)</p>
<el-input
v-model="item.input2"
:style="{ width: '90%' }"
placeholder="Technical Name (if have)"
></el-input>
</div>
</div>
<div class="flex">
<div class="F1">
<p>Imo Class(Sub risk)</p>
<el-input
v-model="item.input3"
:style="{ width: '90%' }"
placeholder="Imo Class(Sub risk)"
></el-input>
</div>
<div class="F1">
<p>Packing Group</p>
<!-- <el-input
v-model="item.input4"
:style="{ width: '90%' }"
placeholder="Packing Group"
></el-input> -->
<el-select
v-model="item.input6"
:style="{ width: '90%' }"
placeholder="Packing Group"
>
<el-option label="Ⅰ" value="1"> </el-option>
<el-option label="Ⅱ" value="2"> </el-option>
<el-option label="Ⅲ" value="3"> </el-option>
</el-select>
</div>
<div class="F1">
<p>Flash Point (if have )</p>
<el-input
v-model="item.input5"
:style="{ width: '90%' }"
placeholder="Flash Point (if have )"
>
<template slot="append">℃</template></el-input
>
</div>
<div class="F1">
<p>Marine Pollutant(p or no)</p>
<!-- <el-input
v-model="item.input6"
:style="{ width: '90%' }"
placeholder="Marine Pollutant(p or no) "
></el-input> -->
<el-select
v-model="item.input6"
:style="{ width: '90%' }"
placeholder="Marine Pollutant(p or no)"
>
<el-option label="P" value="P"> </el-option>
<el-option label="N" value="N"> </el-option>
</el-select>
</div>
</div>
<div class="flex">
<div class="F1">
<p>Boiling Point(if have)</p>
<el-input
v-model="item.input7"
:style="{ width: '90%' }"
placeholder="Boiling Point(if have) "
></el-input>
</div>
<div class="F1">
<p>Package Quantity and Type</p>
<el-input
v-model="item.input8"
:style="{ width: '90%' }"
placeholder="Package Quantity and Type"
></el-input>
</div>
<div class="F1">
<p>Packing Code</p>
<el-input
v-model="item.input9"
:style="{ width: '90%' }"
placeholder="Packing Code"
></el-input>
</div>
<div class="F1">
<p>Gross Weight</p>
<el-input
v-model="item.input10"
:style="{ width: '90%' }"
placeholder="Gross Weight "
>
<template slot="append">KGS</template>
</el-input>
</div>
</div>
<div class="flex">
<div class="F1">
<p>Net Weight</p>
<el-input
v-model="item.input11"
:style="{ width: '90%' }"
placeholder="Net Weight "
>
<template slot="append">KGS</template>
</el-input>
</div>
<div class="F1">
<p>Reportable/Excepted/Limited Quantifu</p>
<el-select
v-model="item.input12"
placeholder="Reportable/Excepted/Limited Quantifu"
:style="{ width: '90%' }"
>
<el-option label="Reportable" value="Reportable">
</el-option>
<el-option label="Excepted" value="Excepted"> </el-option>
<el-option label="Limited" value="Limited"> </el-option>
</el-select>
</div>
<div class="F1">
<p>Lighter's Brand and Factory(if have)</p>
<el-input
v-model="item.input13"
:style="{ width: '90%' }"
placeholder="Lighter's Brand and Factory(if have)"
></el-input>
</div>
<div class="F1">
<p>Inner Package</p>
<el-select
v-model="item.input14"
placeholder="Inner Package"
:style="{ width: '90%' }"
>
<el-option
label="PLASTICS INNER PACKAGINGS"
value="PLASTICS INNER PACKAGINGS"
>
</el-option>
<el-option
label="PAPER INNER PACKAGINGS"
value="PAPER INNER PACKAGINGS"
>
</el-option>
<el-option
label="METAL INNER PACKAGINGS"
value="METAL INNER PACKAGINGS"
>
</el-option>
<el-option
label="GLASS INNER PACKAGINGS"
value="GLASS INNER PACKAGINGS"
>
</el-option>
</el-select>
</div>
</div>
<!-- <div class="flex">
<div class="F1" @dblclick="FnTableCheckboxClick(item, 'input')">
<p>UN No</p>
<el-input
@ -294,7 +482,7 @@
></el-input>
<p class="CsMt" v-else>{{ item.input }}</p>
</div>
</div>
</div> -->
</div>
</el-checkbox>
<div class="CsCheckboxButtonBox">
@ -319,6 +507,38 @@
</template>
</el-table-column>
<el-table-column prop="date" label="15.Container number" width="180">
<template slot-scope="scope">
<el-input
v-model="scope.row.date"
placeholder="Container number"
></el-input>
</template>
</el-table-column>
<el-table-column prop="name" label="16.Seal number(s)" width="180">
<template slot-scope="scope">
<el-input
v-model="scope.row.name"
placeholder="Seal number(s)"
></el-input>
</template>
</el-table-column>
<el-table-column prop="address" label="17.Container Size & type">
<template slot-scope="scope">
<el-input
v-model="scope.row.address"
placeholder="Container Size & type"
></el-input>
</template>
</el-table-column>
<el-table-column prop="address2" label="18.Tare mass(kg)">
<template slot-scope="scope">
<el-input
v-model="scope.row.address2"
placeholder="Tare mass(kg)"
></el-input>
</template>
</el-table-column>
<!-- <el-table-column prop="date" label="15.Container number" width="180">
<template slot-scope="scope">
<el-input
v-if="scope.row.Web_date_type"
@ -361,7 +581,7 @@
></el-input>
<span v-else>{{ scope.row.address2 }}</span>
</template>
</el-table-column>
</el-table-column> -->
</el-table>
<div class="CsButtonBox">
<el-button icon="el-icon-plus" type="text" @click="FnAddRow">
@ -392,7 +612,7 @@
</p>
</div>
</div>
<div class="flex BB">
<div class="flex">
<div class="F1 CsBox BR">
<p class="CsFW">20.Name of company</p>
<p>SHANDONG WEIFANG RAINBOW CHEMICAL CO.,LTD.</p>
@ -405,10 +625,10 @@
<p class="CsFW CsMt">Place and date</p>
<p>QINGDAO 2022/03/26</p>
<p class="CsFW CsMt">Signature of declarant</p>
<p class="CsFW">张明明</p>
<p class="CsFW">&nbsp;</p>
</div>
<div class="F1 CsBox">
<p class="CsFW">20.Name of company</p>
<p class="CsFW">22.Name of company</p>
<p>SHANDONG WEIFANG RAINBOW CHEMICAL CO.,LTD.</p>
<p class="CsFW CsMt">Name/status of declarant</p>
<p>
@ -419,17 +639,17 @@
<p class="CsFW CsMt">Place and date</p>
<p>QINGDAO 2022/03/26</p>
<p class="CsFW CsMt">Signature of declarant</p>
<p class="CsFW">张明明</p>
<p class="CsFW">&nbsp;</p>
</div>
</div>
<div class="flex">
<!-- <div class="flex">
<div class="F1">
<p>Signature and date<span>2022/03/26</span></p>
</div>
<div class="F2">
<p>DRIVER'S SIGNATURE<span>李强</span></p>
</div>
</div>
</div> -->
</div>
<div class="CsBottom">
<p>* DANGEROUS GOODS:</p>
@ -460,7 +680,39 @@ export default {
address2: "",
Web_address2_type: true,
CheckboxData: [
{ input: "", Web_input_type: true, CheckboxType: false },
{
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,
},
],
},
],
@ -493,7 +745,41 @@ export default {
Web_address_type: true,
address2: "",
Web_address2_type: true,
CheckboxData: [{ input: "", CheckboxType: false }],
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,
},
],
});
},
FnDelRow() {
@ -605,7 +891,7 @@ export default {
}
&:nth-child(2) {
padding-top: 0;
margin-left: 25px;
// margin-left: 25px;
}
}
}
@ -621,7 +907,7 @@ export default {
> div:nth-child(2) {
.CsBox {
p {
margin-left: 25px;
// margin-left: 25px;
&:first-child {
margin: 0;
}
@ -728,4 +1014,9 @@ export default {
}
}
}
/deep/ .el-icon-arrow-right {
font-weight: bolder;
color: #dd5643;
// font-size: 1rem;
}
</style>

Write Preview
Loading…
Cancel
Save