Skip to content

J
jiedao-app-operator-master
Commit 345421f8 authored by huhaiqing's avatar huhaiqing
Browse files
Options

海运出货开发

parent 9f6eac52
Hide whitespace changes
Inline Side-by-side
Showing with 571 additions and 12 deletions
src/router/index.js
View file @ 345421f8
......@@ -298,7 +298,7 @@ export const constantRoutes = [
}, */
{
path: 'shippingSea/:boxId(\\d+)',
component: (resolve) => import('@/views/ecw/box/shipping/shippingSea'),
component: (resolve) => import('@/views/ecw/box/shippingSea/shippingSea'),
props: true,
name: 'shippingSea',
meta: {title: '海运出货操作', icon: '', activeMenu: '/shipment/boxSea'}
......
src/views/ecw/box/shipping/agent.vue → src/views/ecw/box/shippingSea/agent.vue
View file @ 345421f8
<template>
<div>
<el-form ref="agentForm" :rules="rules" :model="agent" label-width="120px">
<el-form ref="agentForm" :rules="rules" :model="agentObj" label-width="120px">
<el-form-item label="代理商Agent">
<el-select v-model="agent.agent" placeholder="请选择代理商">
<el-select v-model="agentObj.agent" placeholder="请选择代理商">
</el-select>
</el-form-item>
</el-form>
<el-row class="operate-button">
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">保存</el-button>
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
</template>
......@@ -22,7 +23,7 @@ export default {
data() {
return {
// agent对象
agent: {},
agentObj: {},
};
},
methods: {
......
src/views/ecw/box/shippingSea/barge.vue 0 → 100644
View file @ 345421f8
<template>
<div>
<el-form ref="bargeForm" :model="bargeObj" label-width="80px">
<el-form-item label="驳船">
<el-radio-group v-model="bargeObj.status">
<el-radio v-for="item in bargeStatus" :key="item.value" :label="item.value">{{item.label}}</el-radio>
</el-radio-group>
</el-form-item>
<div v-show="bargeObj.status === '2'">
<el-row>
<el-col :span="12">
<el-form-item label="驳船预计开船时间" label-width="130px">
<el-date-picker type="date" placeholder="请选择日期" v-model="bargeObj.expectedTime"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="通知人" label-width="80px">
<el-select v-model="bargeObj.feedTimePerson" placeholder="请选择通知人">
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="驳船实际开船时间" label-width="130px">
<el-date-picker type="date" placeholder="请选择日期" v-model="bargeObj.actualTime"></el-date-picker>
</el-form-item>
</div>
</el-form>
<el-row class="operate-button">
<el-button type="primary">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
</template>
<script>
/**
* 驳船
*/
export default {
name: "barge",
data() {
return {
// 驳船对象
bargeObj: {},
// 驳船
bargeStatus: [
{
value: "1",
label: "无驳船",
},
{
value: "2",
label: "有驳船",
},
],
};
},
methods: {
/** 提交 */
onSubmit() {
this.$refs["bargeForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
/** 取消 */
cancel() {
this.$emit("closeDialog");
},
},
};
</script>
<style lang="scss" scoped>
</style>
src/views/ecw/box/shipping/booking.vue → src/views/ecw/box/shippingSea/booking.vue
View file @ 345421f8
......@@ -92,7 +92,7 @@
</el-form>
<el-row class="operate-button">
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">取消</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
......
src/views/ecw/box/shipping/cabinet/index.vue → src/views/ecw/box/shippingSea/cabinet/index.vue
View file @ 345421f8
......@@ -30,7 +30,7 @@
<el-row class="operate-button">
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button type="success">封柜</el-button>
<el-button @click="cancel">取消</el-button>
<el-button @click="cancel">关闭</el-button>
<el-button type="danger" @click="startCabinet">开始装柜</el-button>
</el-row>
</div>
......
src/views/ecw/box/shippingSea/customsClearance.vue 0 → 100644
View file @ 345421f8
<template>
<div>
<el-form ref="cusClearanceForm" :rules="rules" :model="cusClearance" label-width="120px">
<el-form-item label="单证要求">我司全代 <el-button type="primary" style="margin-left:10px;" @click="downloadVGM">VGM声明</el-button>
</el-form-item>
<el-form-item label="柜重" prop="cabinetWeight">
<el-input v-model="cusClearance.cabinetWeight" placeholder="请输入柜重" clearable />
</el-form-item>
<el-form-item label="货重" prop="cargoWeight">
<el-input v-model="cusClearance.cargoWeight" placeholder="请输入货重" clearable />
</el-form-item>
<el-form-item label="VGM重量（柜重+货重）">
<el-input v-model="cusClearance.vgmWeight" placeholder="请输入VGM重量" clearable />
</el-form-item>
<el-form-item label="报关方式" prop="method">
<el-select v-model="cusClearance.method" placeholder="请选择报关方式">
<el-option v-for="item in methods" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="正常报关订单">
</el-form-item>
<el-form-item label="报关公司名称">
<el-select v-model="cusClearance.companyName" placeholder="请选择报关公司名称">
</el-select>
</el-form-item>
<el-form-item label="截关时间">
<el-date-picker type="date" placeholder="请选择日期" v-model="cusClearance.cutTime"></el-date-picker>
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="cusClearance.status">
<el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<!-- 查验 -->
<div v-show="cusClearance.status === '3'">
<el-form-item label="查验">
<el-radio-group v-model="cusClearance.check">
<el-radio v-for="item in checkItems" :key="item.value" :label="item.value">{{item.label }}</el-radio>
</el-radio-group>
</el-form-item>
</div>
<!-- 退场 -->
<div v-show="cusClearance.check === '1' || cusClearance.check === '2'">
<el-form-item label="查验时间">
<el-date-picker type="date" placeholder="请选择日期" v-model="cusClearance.checkTime"></el-date-picker>
</el-form-item>
<el-form-item label="查验前图片">
<el-upload action="" :limit="1" :file-list="cusClearance.checkFile">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
<el-form-item label="新封条">
<el-input v-model="cusClearance.newSeal" placeholder="请输入新封条" clearable />
</el-form-item>
</div>
<!-- 放行 -->
<el-form-item label="放行时间" v-show="cusClearance.status === '2' || cusClearance.check === '2'">
<el-date-picker type="date" placeholder="请选择日期" v-model="cusClearance.releaseTime"></el-date-picker>
</el-form-item>
<el-form-item label="装箱单">
<el-button type="primary">下载装箱单</el-button>
</el-form-item>
<el-form-item label="报关单">
<el-button type="primary">下载所有报关单</el-button>
</el-form-item>
</el-form>
<el-row class="operate-button">
<el-button type="primary">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
<el-button type="primary" @click="extraCost">额外费用</el-button>
</el-row>
<!-- 对话框 -->
<el-dialog custom-class="shipping-dialog customsClearance" :title="dialogConfig.title" :visible.sync="dialogConfig.dialogVisible" width="700px" :modal-append-to-body=false append-to-body destroy-on-close>
<el-row>
<el-row class="search-area">
<el-form label-width="100px">
<el-form-item label="订单号">
<el-input v-model="orderNo" placeholder="请输入订单号" clearable />
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</el-form-item>
</el-form>
</el-row>
<el-row>
<el-table :data="[{}]">
<el-table-column label="订单号" align="center" prop="selfNo" />
<el-table-column label="报关费用" align="center" prop="orderFees">
<template slot-scope="scope">
<el-input v-model="scope.row.orderFees" placeholder="请输入内容" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button type="primary" size="small">确定</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
<el-row class="cost-title">
<div>额外费用订单</div>
<div>
<el-button size="small">重置</el-button>
</div>
</el-row>
<el-row>
<el-table :data="[{}]">
<el-table-column type="selection" width="55" />
<el-table-column label="订单号" align="center" prop="selfNo" />
<el-table-column label="报关费用" align="center" prop="customsFees">
<template slot-scope="scope">
<el-input v-model="scope.row.customsFees" placeholder="请输入内容" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button type="primary" size="small">修改</el-button>
<el-button size="small">重置</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
</el-row>
</el-dialog>
</div>
</template>
<script>
/**
* 报关
*/
export default {
name: "customsClearance",
data() {
return {
// 报关方式
methods: [
{
value: "1",
label: "整柜买单报关",
},
{
value: "2",
label: "整柜正常报关",
},
{
value: "3",
label: "买单报关+正常报关",
},
],
// 状态
status: [
{
value: "1",
label: "报关中",
},
{
value: "2",
label: "放行",
},
{
value: "3",
label: "查验",
},
],
// check
checkItems: [
{
value: "1",
label: "退场",
},
{
value: "2",
label: "部分退场",
},
{
value: "3",
label: "查验后放行",
},
],
// 报关对象
cusClearance: {},
// 校验
rules: {
cabinetWeight: [{ required: true, message: "必填", trigger: "change" }],
cargoWeight: [{ required: true, message: "必填", trigger: "change" }],
method: [{ required: true, message: "必填", trigger: "change" }],
},
// 弹窗配置
dialogConfig: {
title: "",
dialogVisible: false,
},
// 订单号
orderNo: "",
};
},
watch: {
"cusClearance.status"(val) {
if (val !== "3") {
this.$set(this.cusClearance, "check", "");
}
},
},
methods: {
/** 提交 */
onSubmit() {
this.$refs["cusClearanceForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
/** 取消 */
cancel() {
this.$emit("closeDialog");
},
// 下载VGM
downloadVGM() {
window.open(
"http://pdatest.groupage.cn//apivue/boxTrack/vgmExport?token=930b11a41d9ca06f306d157f336a5dcb&id=1752"
);
},
// 额外费用
extraCost() {
this.$set(this.dialogConfig, "title", "自编号");
this.$set(this.dialogConfig, "dialogVisible", true);
},
},
};
</script>
<style lang="scss">
.customsClearance {
.search-area {
.el-form-item__content {
display: flex;
.el-button {
margin-left: 10px;
}
}
}
.cost-title {
display: flex;
align-items: center;
margin: 20px 0;
border-left: 5px solid gray;
> div:first-child {
margin-left: 10px;
}
> div:last-child {
flex: 1;
text-align: right;
}
}
}
</style>
src/views/ecw/box/shipping/shippingChart.vue → src/views/ecw/box/shippingSea/seaProcess.vue
View file @ 345421f8
......@@ -32,9 +32,16 @@
<agentWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'agent'" />
<!-- 装柜 -->
<cabinetWidget :boxId="boxId" @closeDialog="closeDialog" v-if="dialogConfig.type === 'cabinet'" />
<!-- 报关 -->
<customsClearance @closeDialog="closeDialog" v-if="dialogConfig.type === 'customsDeclaration'" />
<!-- 配船 -->
<ship @closeDialog="closeDialog" v-if="dialogConfig.type === 'ship'" />
<!-- 提单材料 -->
<subMaterial @closeDialog="closeDialog" v-if="dialogConfig.type === 'subMaterial'" />
<!-- 驳船 -->
<barge @closeDialog="closeDialog" v-if="dialogConfig.type === 'barge'" />
</el-dialog>
</div>
</template>
<script>
......@@ -43,6 +50,10 @@ import trailerWidget from "./trailer";
import preinstallWidget from "./preinstall";
import agentWidget from "./agent";
import cabinetWidget from "./cabinet";
import customsClearance from "./customsClearance";
import ship from "./ship";
import subMaterial from "./subMaterial";
import barge from "./barge";
/**
* 海运流程图
......@@ -55,6 +66,10 @@ export default {
preinstallWidget,
agentWidget,
cabinetWidget,
customsClearance,
ship,
subMaterial,
barge,
},
props: {
shippingType: String,
......@@ -185,6 +200,8 @@ export default {
switch (node.type) {
// 订舱
case "booking":
// 驳船
case "barge":
this.$set(this.dialogConfig, "width", "700px");
this.$set(this.dialogConfig, "fullscreen", false);
break;
......@@ -194,6 +211,8 @@ export default {
case "agent":
// 装柜
case "cabinet":
// 报关
case "customsDeclaration":
this.$set(this.dialogConfig, "width", "500px");
this.$set(this.dialogConfig, "fullscreen", false);
break;
......
src/views/ecw/box/shippingSea/ship.vue 0 → 100644
View file @ 345421f8
<template>
<div>
<el-form ref="shipForm" :model="shipObj" label-width="80px">
<el-form-item label="状态">
<el-radio-group v-model="shipObj.status">
<el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="配船时间" v-show="shipObj.status === '2'">
<el-date-picker type="date" placeholder="请选择日期" v-model="shipObj.shipTime"></el-date-picker>
</el-form-item>
</el-form>
<el-row class="operate-button">
<el-button type="primary">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
</template>
<script>
/**
* 配船
*/
export default {
name: "ship",
data() {
return {
// 配船对象
shipObj: {},
// 状态
status: [
{
value: "1",
label: "免配",
},
{
value: "2",
label: "已配",
},
],
};
},
methods: {
/** 提交 */
onSubmit() {
this.$refs["shipForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
/** 取消 */
cancel() {
this.$emit("closeDialog");
},
},
};
</script>
<style lang="scss" scoped>
</style>
src/views/ecw/box/shipping/shippingSea.vue → src/views/ecw/box/shippingSea/shippingSea.vue
View file @ 345421f8
......@@ -27,7 +27,7 @@
</template>
<script>
import shippingChart from "./shippingChart";
import shippingChart from "../shippingSea/seaProcess";
/**
* 海运操作主页面
*/
......
src/views/ecw/box/shippingSea/subMaterial.vue 0 → 100644
View file @ 345421f8
<template>
<div class="app-subMaterial">
<el-form ref="subMaterialForm" :model="subMaterialObj" label-width="140px">
<el-form-item label="代理商AGENT">
<el-select v-model="subMaterialObj.agent" placeholder="请选择供应商">
</el-select>
</el-form-item>
<el-form-item label="提单号M/BL NO." class="billNo">
<el-input v-model="subMaterialObj.billNo"></el-input>
<el-button type="primary">提单确认邮件</el-button>
</el-form-item>
<el-form-item label="SO NO.">
<el-input v-model="subMaterialObj.soNo"></el-input>
</el-form-item>
<el-form-item label="装货港">
<el-select v-model="subMaterialObj.loadingPort" placeholder="请选择装货港">
</el-select>
</el-form-item>
<el-form-item label="目的港">
<el-select v-model="subMaterialObj.destination" placeholder="请选择目的港">
</el-select>
</el-form-item>
<el-form-item label="船公司">
<el-select v-model="subMaterialObj.shippingCompany" placeholder="请选择船公司">
</el-select>
</el-form-item>
<el-form-item label="托运人">
<el-select v-model="subMaterialObj.shipper" placeholder="请选择托运人">
</el-select>
</el-form-item>
<el-form-item label="收货人">
<el-select v-model="subMaterialObj.consignee" placeholder="请选择收货人">
</el-select>
</el-form-item>
<el-form-item label="通知方">
<el-select v-model="subMaterialObj.notifyParty" placeholder="请选择通知方">
</el-select>
</el-form-item>
<el-form-item label="Mark & No.">
<el-input v-model="subMaterialObj.markNo"></el-input>
</el-form-item>
<el-form-item label="包装数量与单位" class="quantityUnit">
<el-input v-model="subMaterialObj.quantity" placeholder="请输入包装数量"></el-input>
<el-select v-model="subMaterialObj.unit" placeholder="请选择单位">
</el-select>
</el-form-item>
<el-form-item label="毛重(KGS)">
<el-input v-model="subMaterialObj.grossWeight" placeholder="请输入毛重(KGS)"></el-input>
</el-form-item>
<el-form-item label="立方数(CBM)">
<el-input v-model="subMaterialObj.mesaurement" placeholder="请输入立方数(CBM)"></el-input>
</el-form-item>
<el-form-item label="货物描述">
<el-input v-model="subMaterialObj.description" placeholder="请输入货物描述"></el-input>
</el-form-item>
<el-form-item label="柜号/封条">
<el-input v-model="subMaterialObj.container" placeholder="请输入柜号/封条"></el-input>
</el-form-item>
<el-form-item label="柜型">
111
</el-form-item>
<el-form-item label="出单方式">
<el-radio-group v-model="subMaterialObj.billingMethod">
<el-radio v-for="item in method" :key="item.value" :label="item.value">{{item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="subMaterialObj.remark" type="textarea" rows="2" placeholder="请输入备注"></el-input>
</el-form-item>
</el-form>
<el-row class="operate-button">
<el-button type="primary">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
</template>
<script>
/**
* 提单补料
*/
export default {
name: "subMaterial",
data() {
return {
// 提单补料对象
subMaterialObj: {
markNo: "N/M",
},
// 出单方式
method: [
{
value: "1",
label: "正本",
},
{
value: "2",
label: "电放",
},
],
};
},
methods: {
/** 提交 */
onSubmit() {
this.$refs["subMaterialForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
/** 取消 */
cancel() {
this.$emit("closeDialog");
},
},
};
</script>
<style lang="scss">
.app-subMaterial {
.billNo,
.quantityUnit {
.el-form-item__content {
display: flex;
> :last-child {
margin-left: 10px;
}
}
}
}
</style>
src/views/ecw/box/shipping/trailer.vue → src/views/ecw/box/shippingSea/trailer.vue
View file @ 345421f8
......@@ -31,8 +31,9 @@
</el-form-item>
</el-form>
<el-row class="operate-button">
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button type="success" @click="onSubmit">提交</el-button>
<el-button @click="cancel">关闭</el-button>
</el-row>
</div>
</template>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment