Commit 363ff21d authored by dcy's avatar dcy

Merge remote-tracking branch 'origin/dev' into dev

# Conflicts:
#	src/router/index.js
parents 58898e4e b0663d15
......@@ -9,6 +9,7 @@
"build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging",
"build:demo1024": "vue-cli-service build --mode demo1024",
"dev:demo1024": "vue-cli-service serve --mode demo1024",
"preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src"
},
......
import request from '@/utils/request'
// 创建出货
export function createbox(data) {
return request({
url: '/shipment/box/create',
method: 'post',
data: data
})
}
// 更新出货
export function updatebox(data) {
return request({
url: '/shipment/box/update',
method: 'put',
data: data
})
}
// 删除出货
export function deletebox(id) {
return request({
url: '/shipment/box/delete?id=' + id,
method: 'delete'
})
}
// 获得出货
export function getbox(id) {
return request({
url: '/shipment/box/get?id=' + id,
method: 'get'
})
}
// 获得出货分页
export function getboxPage(query) {
return request({
url: '/shipment/box/page',
method: 'get',
params: query
})
}
// 导出出货 Excel
export function exportboxExcel(query) {
return request({
url: '/shipment/box/export-excel',
method: 'get',
params: query,
responseType: 'blob'
})
}
......@@ -330,7 +330,29 @@ export const constantRoutes = [
}
}
],
}
},
{
path: '/boxSea',
component: Layout,
hidden: true,
redirect: 'noredirect',
children: [
/* {
path: 'query/:boxId(\\d+)',
component: (resolve) => import('@/views/ecw/box/query'),
props: true,
name: 'boxQuery',
meta: {title: '出货详情', icon: '', activeMenu: '/shipment/box'}
}, */
{
path: 'shippingSea/:boxId(\\d+)',
component: (resolve) => import('@/views/ecw/box/shipping/shippingSea'),
props: true,
name: 'shippingSea',
meta: {title: '海运出货操作', icon: '', activeMenu: '/shipment/boxSea'}
}
]
},
]
// 防止连续点击多次路由报错
......
......@@ -10,6 +10,7 @@ export const DICT_TYPE = {
COMMON_STATUS: 'common_status',
AUDIT_STATUS: 'audit_status',
ADVANCE_STATUS: 'advance_status',
BOX_SHIPMENT_STATUS: 'box_shipment_status',
// ========== SYSTEM 模块 ==========
SYSTEM_USER_SEX: 'system_user_sex',
......@@ -132,7 +133,8 @@ export const DICT_TYPE = {
ORDER_TYPE: 'order_type', // 订单类型
PRODUCT_RECORD_ATTRIBUTE: 'product_record_attribute', //产品备案属性
CONTROL_GOODS_STATUS: 'control_goods_status', //控货状态
DISBURSEMENT_TYPE: 'disbursement_type' //垫付类型
DISBURSEMENT_TYPE: 'disbursement_type', //垫付类型
DRAWEE: 'drawee', // 付款人
}
/**
......
......@@ -11,7 +11,7 @@ const baseURL = process.env.VUE_APP_BASE_API
* @param pattern {String} '{y}-{m}-{d} {h}:{i}:{s}'
* @returns {string|null}
*/
export function parseTime(time, pattern) {
export function parseTime(time, pattern = undefined) {
if (arguments.length === 0 || !time) {
return null
}
......
<template>
<div class="app-container">
<!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="自编号" prop="selfNo">
<el-input v-model="queryParams.selfNo" placeholder="请输入自编号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="柜号" prop="cubNo">
<el-input v-model="queryParams.cubNo" placeholder="请输入柜号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="queryParams.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="queryParams.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="状态" prop="boxStatus">
<el-select v-model="queryParams.boxStatus" placeholder="请选择状态" clearable size="small">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.BOX_SHIPMENT_STATUS)"
:key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="" prop="date">
<el-select v-model="queryParams.dateType" placeholder="请选择时间类型" clearable size="small">
<el-option v-for="item in dateTypes" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="">
<el-date-picker v-model="queryParams.dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作工具栏 -->
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['shipment:box:create']">出货安排
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
:loading="exportLoading"
v-hasPermi="['shipment:box:export']">导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 列表 -->
<el-table v-loading="loading" :data="list">
<el-table-column label="自编号" align="center" prop="selfNo"/>
<el-table-column label="柜号" align="center" prop="cubNo"/>
<el-table-column label="出货渠道" align="center" prop="shippingChannelId">
<template slot-scope="scope">
<span>{{ getShipChannelName(scope.row.shippingChannelId) }}</span>
</template>
</el-table-column>
<el-table-column label="方数(预装/已装)" align="center" prop="squareNumber"/>
<el-table-column label="重量(预装/已装)" align="center" prop="weight"/>
<el-table-column label="状态" align="center" prop="boxStatus">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.BOX_SHIPMENT_STATUS" :value="scope.row.boxStatus"/>
</template>
</el-table-column>
<el-table-column label="日期" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ new Date(scope.row.createTime).format('yyyy-MM-dd') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<!-- <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)"
v-hasPermi="['shipment:box:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['shipment:box:update']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['shipment:box:delete']">删除</el-button> -->
<el-dropdown trigger="click" @command="(command)=>handleCommand(scope.row, command)">
<el-button type="primary">
操作<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="edit">编辑</el-dropdown-item>
<el-dropdown-item command="air">操作-空运</el-dropdown-item>
<el-dropdown-item command="error">异常登记</el-dropdown-item>
<el-dropdown-item command="cost">费用登记</el-dropdown-item>
<el-dropdown-item command="delete">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="出货渠道" prop="shippingChannelId">
<el-select v-model="form.shippingChannelId" placeholder="请选择出货渠道">
<el-option v-for="item in channelList" :label="item.nameZh" :value="item.channelId" :key="item.channelId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="form.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="form.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {createbox, updatebox, deletebox, getbox, getboxPage, exportboxExcel} from "@/api/ecw/box";
import { getChannelList } from '@/api/ecw/channel';
import { getWarehouseList } from "@/api/ecw/warehouse"
export default {
name: "box",
components: {},
data() {
return {
dateTypes:[
{value:'1', label:'分拣时间'},
{value:'2', label:'装柜时间'},
{value:'3', label:'起运时间'},
{value:'4', label:'到港时间'},
{value:'5', label:'清关时间'},
{value:'6', label:'提货时间'},
],
// 遮罩层
loading: true,
// 导出遮罩层
exportLoading: false,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 出货列表
list: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
dateRangeCreateTime: [],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10,
id: null,
selfNo: null,
cubNo: null,
cabinetId: null,
boxStatus: null,
startWarehouseId: null,
destWarehouseId: null,
transportType: null,
},
channelList:[],
warehouseList: [],
// 表单参数
form: {},
// 表单校验
rules: {
shippingChannelId: [{ required: true, message: "出货渠道不能为空", trigger: "blur" }],
startWarehouseId: [{ required: true, message: "始发地不能为空", trigger: "blur" }],
destWarehouseId: [{ required: true, message: "目的地不能为空", trigger: "blur" }],
}
};
},
computed: {
exportWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '2' || item.type == '3')
},
importWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '1' || item.type == '3')
},
getShipChannelName() {
return shippingChannelId => {
for (let index in this.channelList) {
let channelItem = this.channelList[index];
if (channelItem.channelId == shippingChannelId) {
return channelItem.nameZh;
}
}
return '/'
}
}
},
created() {
getWarehouseList().then(res => this.warehouseList = res.data);
this.getList();
this.getChannelList();
},
methods: {
getChannelList(){
getChannelList().then(res => this.channelList = res.data)
},
/** 查询列表 */
getList() {
this.loading = true;
// 处理查询参数
let params = {...this.queryParams};
params.transportType = 3;
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行查询
getboxPage(params).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.reset();
},
/** 表单重置 */
reset() {
this.form = {
id: undefined,
cabinetId: undefined,
startWarehouseId: undefined,
destWarehouseId: undefined,
transportType: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRangeCreateTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加出货";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id;
getbox(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改出货";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (!valid) {
return;
}
this.form.transportType = 3;
// 修改的提交
if (this.form.id != null) {
updatebox(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
return;
}
// 添加的提交
createbox(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
});
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id;
this.$modal.confirm('是否确认删除出货编号为"' + id + '"的数据项?').then(function () {
return deletebox(id);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
// 处理查询参数
let params = {...this.queryParams};
params.pageNo = undefined;
params.pageSize = undefined;
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行导出
this.$modal.confirm('是否确认导出所有出货数据项?').then(() => {
this.exportLoading = true;
return exportboxExcel(params);
}).then(response => {
this.$download.excel(response, '${table.classComment}.xls');
this.exportLoading = false;
}).catch(() => {
});
},
/** 查看按钮操作 */
handleCommand(row, command) {
switch (command) {
case 'sea':
this.$router.push('/box/shippingSea/' + row.id)
break;
case 'edit':
this.handleUpdate(row);
break;
case 'delete':
this.handleDelete(row);
break;
}
},
}
};
</script>
<template>
<div class="app-container">
<!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="自编号" prop="selfNo">
<el-input v-model="queryParams.selfNo" placeholder="请输入自编号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="柜号" prop="cubNo">
<el-input v-model="queryParams.cubNo" placeholder="请输入柜号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="柜型" prop="cabinetId">
<el-select v-model="queryParams.cabinetId" placeholder="请选择柜型">
<el-option v-for="item in cabinetList" :label="item.name" :value="item.name" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="queryParams.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="queryParams.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="" prop="date">
<el-select v-model="queryParams.dateType" placeholder="请选择时间类型" clearable size="small">
<el-option v-for="item in dateTypes" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="">
<el-date-picker v-model="queryParams.dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
</el-form-item>
<el-form-item label="状态" prop="boxStatus">
<el-select v-model="queryParams.boxStatus" placeholder="请选择状态" clearable size="small">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.BOX_SHIPMENT_STATUS)"
:key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="运输方式" prop="transportType">
<el-select v-model="queryParams.transportType" placeholder="请选择运输方式" clearable size="small">
<el-option v-for="dict in transportTypes"
:key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作工具栏 -->
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['shipment:box:create']">出货安排
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
:loading="exportLoading"
v-hasPermi="['shipment:box:export']">导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 列表 -->
<el-table v-loading="loading" :data="list">
<el-table-column label="自编号" align="center" prop="selfNo"/>
<el-table-column label="柜号" align="center" prop="cubNo"/>
<el-table-column label="柜型" align="center" prop="cabinetId">
<template slot-scope="scope">
<span>{{ getCabinetName(scope.row.cabinetId) }}</span>
</template>
</el-table-column>
<el-table-column label="运输方式" align="center" prop="transportType">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="scope.row.transportType"/>
</template>
</el-table-column>
<el-table-column label="方数(预装/已装)" align="center" prop="squareNumber"/>
<el-table-column label="重量(预装/已装)" align="center" prop="weight"/>
<el-table-column label="状态" align="center" prop="boxStatus">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.BOX_SHIPMENT_STATUS" :value="scope.row.boxStatus"/>
</template>
</el-table-column>
<el-table-column label="日期" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ new Date(scope.row.createTime).format('yyyy-MM-dd') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<!-- <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)"
v-hasPermi="['shipment:box:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['shipment:box:update']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['shipment:box:delete']">删除</el-button> -->
<el-dropdown trigger="click" @command="(command)=>handleCommand(scope.row, command)">
<el-button type="primary">
操作<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="edit">编辑</el-dropdown-item>
<el-dropdown-item command="sea">操作-海运</el-dropdown-item>
<el-dropdown-item command="error">异常登记</el-dropdown-item>
<el-dropdown-item command="cost">费用登记</el-dropdown-item>
<el-dropdown-item command="delete">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="运输方式" prop="transportType">
<el-radio-group v-model="form.transportType">
<el-radio v-for="dict in transportTypes" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="柜型" prop="cabinetId">
<el-select v-model="form.cabinetId" placeholder="请选择柜型">
<el-option v-for="item in cabinetList" :label="item.name" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="form.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="form.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {createbox, updatebox, deletebox, getbox, getboxPage, exportboxExcel} from "@/api/ecw/box";
import {getCabinetPage} from "@/api/ecw/cabinet";
import { getWarehouseList } from "@/api/ecw/warehouse"
import { getDictDatas, DICT_TYPE } from '@/utils/dict';
export default {
name: "box",
components: {},
data() {
return {
dateTypes:[
{value:'1', label:'预装时间'},
{value:'2', label:'装柜时间'},
{value:'3', label:'起运时间'},
{value:'4', label:'到港时间'},
{value:'5', label:'清关时间'},
{value:'6', label:'提货时间'},
],
// 遮罩层
loading: true,
// 导出遮罩层
exportLoading: false,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 出货列表
list: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
dateRangeCreateTime: [],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10,
id: null,
selfNo: null,
cubNo: null,
cabinetId: null,
boxStatus: null,
startWarehouseId: null,
destWarehouseId: null,
transportType: null,
},
cabinetList:[],
warehouseList: [],
transportTypes:this.getDictDatas(DICT_TYPE.ECW_TRANSPORT_TYPE),
// 表单参数
form: {},
// 表单校验
rules: {
transportType: [{ required: true, message: "运输方式不能为空", trigger: "blur" }],
cabinetId: [{ required: true, message: "柜型不能为空", trigger: "blur" }],
startWarehouseId: [{ required: true, message: "始发地不能为空", trigger: "blur" }],
destWarehouseId: [{ required: true, message: "目的地不能为空", trigger: "blur" }],
}
};
},
computed: {
exportWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '2' || item.type == '3')
},
importWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '1' || item.type == '3')
},
getCabinetName() {
return cabinetId => {
for (let index in this.cabinetList) {
let cabinetItem = this.cabinetList[index];
if (cabinetItem.id == cabinetId) {
return cabinetItem.name;
}
}
return '/'
}
}
},
created() {
this.transportTypes = this.transportTypes.filter(item => item.value == '1' || item.value == '2');
getWarehouseList().then(res => this.warehouseList = res.data);
getCabinetPage(null).then(response => {
this.cabinetList = response.data.list;
});
this.getList();
},
methods: {
/** 查询列表 */
getList() {
this.loading = true;
// 处理查询参数
let params = {...this.queryParams};
params.transportTypeList = ['1', '2'];
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行查询
getboxPage(params).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.reset();
},
/** 表单重置 */
reset() {
this.form = {
id: undefined,
cabinetId: undefined,
startWarehouseId: undefined,
destWarehouseId: undefined,
transportType: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRangeCreateTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加出货";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id;
getbox(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改出货";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (!valid) {
return;
}
// 修改的提交
if (this.form.id != null) {
updatebox(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
return;
}
// 添加的提交
createbox(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
});
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id;
this.$modal.confirm('是否确认删除出货编号为"' + id + '"的数据项?').then(function () {
return deletebox(id);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
// 处理查询参数
let params = {...this.queryParams};
params.pageNo = undefined;
params.pageSize = undefined;
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行导出
this.$modal.confirm('是否确认导出所有出货数据项?').then(() => {
this.exportLoading = true;
return exportboxExcel(params);
}).then(response => {
this.$download.excel(response, '${table.classComment}.xls');
this.exportLoading = false;
}).catch(() => {
});
},
/** 查看按钮操作 */
handleCommand(row, command) {
switch (command) {
case 'sea':
this.$router.push('/boxSea/shippingSea/' + row.id)
break;
case 'edit':
this.handleUpdate(row);
break;
case 'delete':
this.handleDelete(row);
break;
}
},
}
};
</script>
<template>
<div class="app-container">
<!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="自编号" prop="selfNo">
<el-input v-model="queryParams.selfNo" placeholder="请输入自编号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="柜号" prop="cubNo">
<el-input v-model="queryParams.cubNo" placeholder="请输入柜号" clearable @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="柜型" prop="cabinetId">
<el-select v-model="queryParams.cabinetId" placeholder="请选择柜型">
<el-option v-for="item in cabinetList" :label="item.name" :value="item.name" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="queryParams.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="queryParams.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="" prop="date">
<el-select v-model="queryParams.dateType" placeholder="请选择时间类型" clearable size="small">
<el-option v-for="item in dateTypes" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="">
<el-date-picker v-model="queryParams.dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
</el-form-item>
<el-form-item label="状态" prop="boxStatus">
<el-select v-model="queryParams.boxStatus" placeholder="请选择状态" clearable size="small">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.BOX_SHIPMENT_STATUS)"
:key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作工具栏 -->
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['shipment:box:create']">出货安排
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
:loading="exportLoading"
v-hasPermi="['shipment:box:export']">导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 列表 -->
<el-table v-loading="loading" :data="list">
<el-table-column label="自编号" align="center" prop="selfNo"/>
<el-table-column label="柜号" align="center" prop="cubNo"/>
<el-table-column label="柜型" align="center" prop="cabinetId">
<template slot-scope="scope">
<span>{{ getCabinetName(scope.row.cabinetId) }}</span>
</template>
</el-table-column>
<el-table-column label="运输方式" align="center" prop="transportType">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="scope.row.transportType"/>
</template>
</el-table-column>
<el-table-column label="出货渠道" align="center" prop="shippingChannelId">
<template slot-scope="scope">
<span>{{ getShipChannelName(scope.row.shippingChannelId) }}</span>
</template>
</el-table-column>
<el-table-column label="方数(预装/已装)" align="center" prop="squareNumber"/>
<el-table-column label="重量(预装/已装)" align="center" prop="weight"/>
<el-table-column label="状态" align="center" prop="boxStatus">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.BOX_SHIPMENT_STATUS" :value="scope.row.boxStatus"/>
</template>
</el-table-column>
<el-table-column label="日期" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ new Date(scope.row.createTime).format('yyyy-MM-dd') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<!-- <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)"
v-hasPermi="['shipment:box:query']">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['shipment:box:update']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['shipment:box:delete']">删除</el-button> -->
<el-dropdown trigger="click" @command="(command)=>handleCommand(scope.row, command)">
<el-button type="primary">
操作<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="edit">编辑</el-dropdown-item>
<el-dropdown-item command="seaAir">操作-海空联运</el-dropdown-item>
<el-dropdown-item command="error">异常登记</el-dropdown-item>
<el-dropdown-item command="cost">费用登记</el-dropdown-item>
<el-dropdown-item command="delete">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="出货渠道" prop="shippingChannelId">
<el-select v-model="form.shippingChannelId" placeholder="请选择出货渠道">
<el-option v-for="item in channelList" :label="item.nameZh" :value="item.channelId" :key="item.channelId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="柜型" prop="cabinetId">
<el-select v-model="form.cabinetId" placeholder="请选择柜型">
<el-option v-for="item in cabinetList" :label="item.name" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="始发地" prop="startWarehouseId">
<el-select v-model="form.startWarehouseId" placeholder="请选择始发地">
<el-option v-for="item in exportWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的地" prop="destWarehouseId">
<el-select v-model="form.destWarehouseId" placeholder="请选择目的地">
<el-option v-for="item in importWarehouseList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {createbox, updatebox, deletebox, getbox, getboxPage, exportboxExcel} from "@/api/ecw/box";
import {getCabinetPage} from "@/api/ecw/cabinet";
import { getChannelList } from '@/api/ecw/channel';
import { getWarehouseList } from "@/api/ecw/warehouse"
export default {
name: "box",
components: {},
data() {
return {
dateTypes:[
{value:'1', label:'预装时间'},
{value:'2', label:'装柜时间'},
{value:'3', label:'起运时间'},
{value:'4', label:'到港时间'},
{value:'5', label:'清关时间'},
{value:'6', label:'提货时间'},
],
// 遮罩层
loading: true,
// 导出遮罩层
exportLoading: false,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 出货列表
list: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
dateRangeCreateTime: [],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10,
id: null,
selfNo: null,
cubNo: null,
cabinetId: null,
boxStatus: null,
startWarehouseId: null,
destWarehouseId: null,
transportType: null,
},
cabinetList:[],
channelList:[],
warehouseList: [],
// 表单参数
form: {},
// 表单校验
rules: {
shippingChannelId: [{ required: true, message: "出货渠道不能为空", trigger: "blur" }],
cabinetId: [{ required: true, message: "柜型不能为空", trigger: "blur" }],
startWarehouseId: [{ required: true, message: "始发地不能为空", trigger: "blur" }],
destWarehouseId: [{ required: true, message: "目的地不能为空", trigger: "blur" }],
}
};
},
computed: {
exportWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '2' || item.type == '3')
},
importWarehouseList() {
return this.warehouseList.filter(item => item.tradeType == '1' || item.type == '3')
},
getCabinetName() {
return cabinetId => {
for (let index in this.cabinetList) {
let cabinetItem = this.cabinetList[index];
if (cabinetItem.id == cabinetId) {
return cabinetItem.name;
}
}
return '/'
}
},
getShipChannelName() {
return shippingChannelId => {
for (let index in this.channelList) {
let channelItem = this.channelList[index];
if (channelItem.channelId == shippingChannelId) {
return channelItem.nameZh;
}
}
return '/'
}
}
},
created() {
getWarehouseList().then(res => this.warehouseList = res.data);
getCabinetPage(null).then(response => {
this.cabinetList = response.data.list;
});
this.getList();
this.getChannelList();
},
methods: {
getChannelList(){
getChannelList().then(res => this.channelList = res.data)
},
/** 查询列表 */
getList() {
this.loading = true;
// 处理查询参数
let params = {...this.queryParams};
params.transportType = 4;
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行查询
getboxPage(params).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.reset();
},
/** 表单重置 */
reset() {
this.form = {
id: undefined,
cabinetId: undefined,
startWarehouseId: undefined,
destWarehouseId: undefined,
transportType: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRangeCreateTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加出货";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id;
getbox(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改出货";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (!valid) {
return;
}
this.form.transportType = 4;
// 修改的提交
if (this.form.id != null) {
updatebox(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
return;
}
// 添加的提交
createbox(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
});
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id;
this.$modal.confirm('是否确认删除出货编号为"' + id + '"的数据项?').then(function () {
return deletebox(id);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
// 处理查询参数
let params = {...this.queryParams};
params.pageNo = undefined;
params.pageSize = undefined;
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
// 执行导出
this.$modal.confirm('是否确认导出所有出货数据项?').then(() => {
this.exportLoading = true;
return exportboxExcel(params);
}).then(response => {
this.$download.excel(response, '${table.classComment}.xls');
this.exportLoading = false;
}).catch(() => {
});
},
/** 查看按钮操作 */
handleCommand(row, command) {
switch (command) {
case 'sea':
this.$router.push('/box/shippingSea/' + row.id)
break;
case 'edit':
this.handleUpdate(row);
break;
case 'delete':
this.handleDelete(row);
break;
}
},
}
};
</script>
<template>
<div>
<el-row type="flex" style="margin-top: 15px; margin-bottom: 15px" justify="center">
<el-col :xs="24" :sm="24" :md="24" :lg="20" :xl="16">
<div style="display: flex; justify-content: space-between;align-items: flex-end;">
<h2>出货详情</h2>
<div>
<el-button size="small">编辑</el-button>
<el-button size="small">操作</el-button>
<el-button type="primary" size="small">异常登记</el-button>
<el-button type="primary" size="small">费用登记</el-button>
<el-button type="danger" size="small">删除</el-button>
</div>
</div>
<el-card style="margin-top: 15px">
<el-descriptions :column="4" border>
<el-descriptions-item label="自编号"></el-descriptions-item>
<el-descriptions-item label="运输方式"></el-descriptions-item>
<el-descriptions-item label="出货渠道"></el-descriptions-item>
<!-- <el-descriptions-item label="柜型"></el-descriptions-item> -->
<el-descriptions-item label="状态"></el-descriptions-item>
<el-descriptions-item label="总计"></el-descriptions-item>
<el-descriptions-item label="始发地"></el-descriptions-item>
<el-descriptions-item label="目的地"></el-descriptions-item>
<el-descriptions-item label="SO.NO"></el-descriptions-item>
</el-descriptions>
</el-card>
<el-tabs style="margin-top: 15px" type="border-card">
<el-tab-pane label="明细">
<div class="detail-pane">
<p>当前部分:</p>
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
<p class="box-weight">9箱子xxx</p>
<p class="document-status">单证状态:我司全代</p>
</div>
<el-table :data="[]" style="width: 100%">
<el-table-column prop="" label="序号"> </el-table-column>
<el-table-column prop="" label="订单号"> </el-table-column>
<el-table-column prop="" label="货物信息"> </el-table-column>
<el-table-column prop="" label="计划箱数"> </el-table-column>
<el-table-column prop="" label="实装箱数"> </el-table-column>
<el-table-column prop="" label="卸柜箱数"> </el-table-column>
<el-table-column prop="" label="提货点"> </el-table-column>
<el-table-column prop="" label="体积"> </el-table-column>
<el-table-column prop="" label="重量"> </el-table-column>
<el-table-column prop="" label="货值"> </el-table-column>
<el-table-column prop="" label="报关方式"> </el-table-column>
<el-table-column prop="" label="报关费用"> </el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="状态"></el-tab-pane>
<el-tab-pane label="费用">
<el-table :data="[]" style="width: 100%">
<el-table-column prop="" label="序号"> </el-table-column>
<el-table-column prop="" label="费用类型"> </el-table-column>
<el-table-column prop="" label="供应商"> </el-table-column>
<el-table-column prop="" label="金额"> </el-table-column>
<el-table-column prop="" label="实付金额"> </el-table-column>
<el-table-column prop="" label="实付日期"> </el-table-column>
<el-table-column prop="" label="操作"> </el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="异常">
<el-table :data="[]" style="width: 100%">
<el-table-column prop="" label="序号"> </el-table-column>
<el-table-column prop="" label="操作步骤"> </el-table-column>
<el-table-column prop="" label="异常"> </el-table-column>
<el-table-column prop="" label="异常详情"> </el-table-column>
<el-table-column prop="" label="异常时间"> </el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="表单">
<el-table :data="[]" style="width: 50%">
<el-table-column prop="" label="文件类型"> </el-table-column>
<el-table-column prop="" label="下载链接"> </el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
</div>
</template>
<script>
import { getCustomer, getCustomerSelect } from "@/api/ecw/customer";
import { DICT_TYPE, getDictDataLabel } from "@/utils/dict";
import { getProductTypeList } from "@/api/ecw/productType";
import { getNodeList } from "@/api/ecw/node";
import CustomerFollow from "@/components/CustomerFollow";
import { parseTime } from "@/utils/ruoyi";
import CustomerComplaint from "@/views/ecw/customerComplaint";
import { listServiceUser } from "@/api/system/user";
import { getCustomerContactsListByCustomer } from "@/api/ecw/customerContacts";
export default {
name: "boxQuery",
props: {
customerId: String,
},
components: {
CustomerFollow,
CustomerComplaint,
},
created() {
getNodeList().then((r) => {
this.nodeList = r.data;
});
getCustomer(this.id).then((response) => {
this.customer = { ...this.customer, ...response.data };
getCustomerContactsListByCustomer({ customerId: this.id }).then((r) => {
this.customerContacts = r.data;
});
});
getProductTypeList().then((r) => {
this.productTypeList = r.data;
});
getCustomerSelect().then((r) => {
this.customerSelect = r.data;
});
listServiceUser().then((r) => {
this.serviceUserList = r.data;
});
},
data() {
return {
DICT_TYPE,
getDictDataLabel,
parseTime,
nodeList: [],
productTypeList: [],
customerSelect: [],
serviceUserList: [],
customerContacts: [],
customer: {
id: undefined,
number: undefined,
name: undefined,
level: undefined,
country: undefined,
type: undefined,
agentId: undefined,
company: undefined,
address: undefined,
productType: undefined,
productId: undefined,
pickupPoint: undefined,
memberId: undefined,
birthday: undefined,
balance: undefined,
source: undefined,
picture: undefined,
customerService: undefined,
customerLines: [],
promoter: undefined,
status: undefined,
founder: undefined,
department: undefined,
invoiceTitle: undefined,
licenseNumber: undefined,
bank: undefined,
bankNumber: undefined,
project: undefined,
billingAddress: undefined,
billingTell: undefined,
taxRate: undefined,
remarks: undefined,
arrivalConfirm: undefined,
weightUnit: undefined,
createTime: undefined,
},
};
},
computed: {
productType() {
const productType = this.productTypeList.find(
(p) => p.id === parseInt(this.customer.productType)
);
return productType ? productType.titleZh : "";
},
pickupPoint() {
const pickupPoint = this.nodeList.find(
(p) => p.id === parseInt(this.customer.pickupPoint)
);
return pickupPoint ? pickupPoint.titleZh : "";
},
promoter() {
return (
this.customerSelect.find((e) => e.id === this.customer.promoter)
?.name || ""
);
},
customerService() {
return (
this.serviceUserList.find((e) => e.id === this.customer.customerService)
?.nickname || ""
);
},
id() {
return this.customerId ? parseInt(this.customerId) : undefined;
},
},
};
</script>
<style lang="scss" scoped>
.detail-pane {
display: flex;
.box-weight {
margin-left: 10px;
}
.document-status {
flex: 1;
text-align: right;
}
}
</style>
<template>
<el-form ref="bookingForm" :rules="rules" :model="booking" label-width="120px" class="booking-form">
<el-form-item label="SO NO">
<el-input v-model="booking.soNo"></el-input>
</el-form-item>
<el-form-item label="船公司类型">
<el-select v-model="booking.type" placeholder="请选择船公司类型">
<el-option v-for="type in types" :key="type" :label="type" :value="type"></el-option>
</el-select>
</el-form-item>
<el-form-item label="驳船港">
<el-select v-model="booking.bargePort" placeholder="请选择驳船港">
<el-option v-for="type in types" :key="type" :label="type" :value="type"></el-option>
</el-select>
</el-form-item>
<el-form-item label="大船港">
<el-select v-model="booking.bigShipPort" placeholder="请选择大船港">
<el-option v-for="type in types" :key="type" :label="type" :value="type"></el-option>
</el-select>
</el-form-item>
<el-form-item label="目的港">
<el-select v-model="booking.destination" placeholder="请选择目的港">
<el-option v-for="type in types" :key="type" :label="type" :value="type"></el-option>
</el-select>
</el-form-item>
<el-form-item label="订舱公司">
<el-select v-model="booking.bookingCompany" placeholder="请选择订舱公司">
<el-option v-for="type in types" :key="type" :label="type" :value="type"></el-option>
</el-select>
</el-form-item>
<el-form-item label="预计驳船时间" prop="time">
<el-date-picker type="date" placeholder="请选择日期" v-model="booking.bargeTime"></el-date-picker>
</el-form-item>
<el-form-item label="预计开船时间" prop="time">
<el-date-picker type="date" placeholder="请选择日期" v-model="booking.departureTime"></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">取消</el-button>
</el-form-item>
</el-form>
</template>
<script>
export default {
name: "booking",
data() {
return {
types: ["PIL", "MSK", "CMA", "COSCO", "ZIM", "ONE", "OOCL", "MSC", "HPL"],
booking: {},
rules: {
time: [{ required: true, message: "请选择时间", trigger: "change" }],
},
};
},
methods: {
onSubmit() {
this.$refs["bookingForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
cancel() {
this.$emit("closeDialog");
},
},
};
</script>
<style lang="scss">
.booking-form {
.el-form-item__content {
> div {
width: 100%;
}
}
}
</style>
<template>
<div>
<el-scrollbar :vertical="true" style="width: 100%;" viewClass="shipping-chart">
<div v-for="(nodes,index) in chartData['sea']" :key="index" class="chart-nodes">
<div>
<div v-for="node in nodes" :key="node.title" @click="nodeClick(node)" class="node-div">
<template v-if="!node.unNode">
<img :src="node.imgSrc" alt="">
<p>{{node.title}}</p>
</template>
<template v-else-if="node.unNode">
<el-button type="primary">AGENT</el-button>
</template>
</div>
</div>
<div class="chart-arrow" v-if="index !== (chartData['sea'].length-1)">
<img src="@/assets/images/shipping/jt-start.png" alt="">
</div>
</div>
</el-scrollbar>
<el-dialog :title="title" :visible.sync="dialogVisible" width="30%" destroy-on-close>
<booking @closeDialog="closeDialog" v-if="type === 'booking'" />
<trailer @closeDialog="closeDialog" v-if="type === 'trailer'" />
</el-dialog>
</div>
</template>
<script>
import booking from "./booking";
import trailer from "./trailer";
export default {
name: "flowChart",
components: { booking, trailer },
props: {
shippingType: String,
},
data() {
return {
dialogVisible: false,
title: "",
type: "",
chartData: {
sea: [
[
{
title: "订舱",
imgSrc: require("@/assets/images/shipping/dc-start.png"),
type: "booking",
},
],
[
{
title: "预装",
imgSrc: require("@/assets/images/shipping/yz-start.png"),
type: "preinstalled",
},
{
title: "拖车",
imgSrc: require("@/assets/images/shipping/tc-start.png"),
type: "trailer",
},
{
unNode: true,
agent: true,
},
],
[
{
title: "装柜",
imgSrc: require("@/assets/images/shipping/zg-start.png"),
type: "cabinet",
},
],
[
{
title: "报关",
imgSrc: require("@/assets/images/shipping/bg-start.png"),
type: "customsDeclaration",
},
{
title: "配船",
imgSrc: require("@/assets/images/shipping/pc-start.png"),
type: "ship",
},
{
title: "提单材料",
imgSrc: require("@/assets/images/shipping/tdcl-start.png"),
type: "subMaterial",
},
],
[
{
title: "驳船",
imgSrc: require("@/assets/images/shipping/bc-start.png"),
type: "barge",
},
],
[
{
title: "起运",
imgSrc: require("@/assets/images/shipping/qy-start.png"),
type: "departure",
},
],
[
{
title: "清关文件",
imgSrc: require("@/assets/images/shipping/qg-start.png"),
type: "clearanceDocument",
},
],
[
{
title: "到港",
imgSrc: require("@/assets/images/shipping/dg-start.png"),
type: "arrival",
},
],
[
{
title: "清关",
imgSrc: require("@/assets/images/shipping/qg-start.png"),
type: "customsClearance",
},
],
[
{
title: "卸柜",
imgSrc: require("@/assets/images/shipping/xg-start.png"),
type: "unloading",
},
],
[
{
title: "结算",
imgSrc: require("@/assets/images/shipping/js-start.png"),
type: "settlement",
},
],
],
},
};
},
methods: {
closeDialog() {
this.dialogVisible = false;
},
nodeClick(node) {
console.log(node);
switch (node.type) {
case "booking":
case "trailer":
this.dialogVisible = true;
this.title = node.title;
this.type = node.type;
break;
}
},
},
};
</script>
<style lang="scss">
.shipping-chart {
width: max-content;
display: flex;
justify-content: center;
margin: 10px;
.chart-nodes {
display: flex;
align-items: center;
justify-content: center;
.node-div {
margin-top: 10px;
cursor: pointer;
p {
margin-top: -10px;
margin-bottom: 0px;
text-align: center;
}
}
}
.chart-arrow {
// margin: -15px 10px 0px 10px;
margin: 0 10px;
}
}
</style>
<template>
<div>
<el-row type="flex" style="margin-top: 15px; margin-bottom: 15px" justify="center">
<el-col :xs="24" :sm="24" :md="24" :lg="20" :xl="20">
<div style="display: flex; justify-content: space-between;align-items: flex-end;">
<h2>海运出货操作</h2>
</div>
<el-card style="margin-top: 15px">
<el-descriptions :column="5" border>
<el-descriptions-item label="自编号"></el-descriptions-item>
<el-descriptions-item label="运输方式"></el-descriptions-item>
<el-descriptions-item label="始发地"></el-descriptions-item>
<el-descriptions-item label="目的地"></el-descriptions-item>
<el-descriptions-item label="状态"></el-descriptions-item>
</el-descriptions>
</el-card>
<div class="shipping-flow">
<flowChart />
</div>
</el-col>
</el-row>
</div>
</template>
<script>
import flowChart from "./flowChart";
export default {
name: "shippingSea",
components: {
flowChart,
},
props: {
boxId: String,
},
};
</script>
<style lang="scss" scoped>
.shipping-flow {
margin-top: 5px;
}
</style>
<template>
<el-form ref="trailerForm" :rules="rules" :model="trailer" label-width="120px" class="trailer-form">
<el-form-item label="状态">
<el-select v-model="trailer.status" placeholder="请选择状态">
<el-option v-for="item in status" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="拖车公司">
<el-select v-model="trailer.trailerCompany" placeholder="请选择拖车公司">
<el-option v-for="item in status" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="拖车时间" prop="time">
<el-date-picker type="date" placeholder="请选择日期" v-model="trailer.trailerTime"></el-date-picker>
</el-form-item>
<el-form-item label="车牌">
<el-input v-model="trailer.licensePlate"></el-input>
</el-form-item>
<el-form-item label="司机">
<el-input v-model="trailer.driver"></el-input>
</el-form-item>
<el-form-item label="司机联系方式">
<el-input v-model="trailer.telephone"></el-input>
</el-form-item>
<el-form-item label="货柜号">
<el-input v-model="trailer.containerNumber"></el-input>
</el-form-item>
<el-form-item label="封条">
<el-input v-model="trailer.seal"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">取消</el-button>
</el-form-item>
</el-form>
</template>
<script>
export default {
name: "trailer",
data() {
return {
status: [
{
value: "1",
label: "已派车,待提柜",
},
{
value: "2",
label: "已提柜,待还柜",
},
{
value: "3",
label: "已还柜",
},
],
trailer: {},
rules: {
time: [{ required: true, message: "请选择时间", trigger: "change" }],
},
};
},
methods: {
onSubmit() {
this.$refs["trailerForm"].validate((valid) => {
if (valid) {
alert("submit!");
}
});
},
cancel() {
this.$emit("closeDialog");
},
},
};
</script>
<style lang="scss">
.trailer-form {
.el-form-item__content {
> div {
width: 100%;
}
}
}
</style>
......@@ -19,19 +19,23 @@
<el-table-column
prop="prodAttrIds"
label="填单货物属性">
<template v-slot="{row}">
{{ getProductNamesByIds(row.prodAttrIds) }}
</template>
</el-table-column>
<el-table-column
prop="address"
label="入库货物属性">
<template v-slot="{row}">
品牌: <br>
品牌:{{ row.brand ? '' : '' }}<br>
箱数:{{ row.num }}<br>
体积:{{ row.volume }}<br>
重量:{{ row.weight }}Kg
</template>
</el-table-column>
<el-table-column
prop="address"
prop="updateTime"
:formatter="(_, __, v) => parseTime(v)"
label="最后操作时间">
</el-table-column>
<el-table-column
......@@ -61,7 +65,8 @@
</template>
</el-table-column>
<el-table-column
prop="address"
prop="status"
:formatter="(v) => ['取消报价', '特价审批中', '需求确认(草稿)', '跟进中', '赢单', '输单', '报价完成', '审批通过', '审批拒绝'][v.status]"
label="审核状态">
</el-table-column>
<el-table-column
......@@ -90,6 +95,8 @@ import {DICT_TYPE, getDictDataLabel} from '@/utils/dict'
import {getOffer} from '@/api/ecw/offer'
import {getUnitList} from "@/api/ecw/unit"
import {getCurrencyList} from "@/api/ecw/currency"
import {getProductAttrList} from "@/api/ecw/productAttr"
import { parseTime } from '@/utils/ruoyi'
export default {
name: "OfferSpecial",
components: {
......@@ -99,6 +106,7 @@ export default {
},
data() {
return {
parseTime,
DICT_TYPE,
getDictDataLabel,
// 遮罩层
......@@ -119,6 +127,7 @@ export default {
},
unitList:[],
currencyList:[],
productAttrList:[],
};
},
created() {
......@@ -128,6 +137,7 @@ export default {
}
getUnitList().then(res => this.unitList = res.data)
getCurrencyList().then(res => this.currencyList = res.data)
getProductAttrList().then(res => this.productAttrList = res.data)
},
methods: {
getOffer(){
......@@ -136,6 +146,17 @@ export default {
this.loading = false
this.offer = response.data
})
},
getProductNamesByIds(ids){
const result = []
ids.split(',').forEach(e => {
this.productAttrList.forEach(f => {
if (parseInt(e) === f.id) {
result.push(f.attrName)
}
})
})
return result.join(',')
}
},
computed: {
......
......@@ -6,71 +6,44 @@
<div slot="header" class="clearfix" v-if="!readonly">
<span>优惠申请</span>
</div>
<el-form ref="form" :model="form" label-width="80px">
<el-form v-if="!readonly" ref="form" :model="form" label-width="80px">
<el-form-item label="商品类型">
<el-input v-model="form.productType" readonly></el-input>
<span>{{ getProductAttrNameById(form.productType) }}</span>
</el-form-item>
<el-form-item label="商品名称">
<el-input v-model="form.prodTitleZh" readonly></el-input>
<span>{{ form.prodTitleZh }}</span>
</el-form-item>
<el-form-item label="英文名称">
<el-input v-model="form.prodTitleEn" readonly></el-input>
<span>{{ form.prodTitleEn }}</span>
</el-form-item>
<el-form-item label="选择线路">
{{ `【${getDictDataLabel(DICT_TYPE.TRANSPORT_TYPE, form.transportId)}【xxxx】从【${form.departureName}】发往【${form.objectiveName}】`}}
<el-form-item label="线路">
{{ `【${getDictDataLabel(DICT_TYPE.TRANSPORT_TYPE, form.transportId)}${ getChannelNameById(form.channelId) }从【${form.departureName}】发往【${form.objectiveName}】`}}
</el-form-item>
<el-form-item label="是否预付">
<el-radio-group v-model="form.isPayAdvance" disabled>
<el-radio :label="0"></el-radio>
<el-radio :label="1"></el-radio>
</el-radio-group>
{{ form.isPayAdvance === 0 ? '' : '' }}
</el-form-item>
<el-form-item label="旧运费">
<el-input v-model="form.orgSeaFreight" readonly>
<dict-selector
slot="prepend"
v-model="form.orgSeaFreightCurrency"
:type="DICT_TYPE.COMMISSION_CURRENCY_TYPE"
style="width: 100px"
disabled
></dict-selector>
<el-select v-model="form.orgSeaFreightVolume" placeholder="请选择" slot="append" style="width: 100px" disabled>
<el-option
v-for="item in unitList"
:key="item.id"
:label="item.titleZh"
:value="item.id">
</el-option>
</el-select>
<div slot="prepend" style="width: 60px">{{ currentMap[form.orgSeaFreightCurrency] }}</div>
<div slot="append" style="width: 60px">{{ unitMap[form.orgSeaFreightVolume] }}</div>
</el-input>
</el-form-item>
<el-form-item label="旧清关费">
<el-input v-model="form.orgClearanceFreight" readonly>
<dict-selector
slot="prepend"
v-model="form.orgClearanceFreightCurrency"
:type="DICT_TYPE.COMMISSION_CURRENCY_TYPE"
style="width: 100px"
disabled
></dict-selector>
<el-select v-model="form.orgClearanceFreightVolume" placeholder="请选择" slot="append" style="width: 100px" disabled>
<div slot="prepend" style="width: 60px">{{ currentMap[form.orgClearanceFreightCurrency] }}</div>
<div slot="append" style="width: 60px">{{ unitMap[form.orgClearanceFreightVolume] }}</div>
</el-input>
</el-form-item>
<el-form-item label="新运费" required>
<el-input v-model.number="form.seaFreight">
<el-select v-model="form.seaFreightCurrency" placeholder="请选择" slot="prepend" style="width: 100px">
<el-option
v-for="item in unitList"
v-for="item in currencyList"
:key="item.id"
:label="item.titleZh"
:value="item.id">
</el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item label="新运费" required>
<el-input v-model.number="form.seaFreight">
<dict-selector
slot="prepend"
v-model="form.seaFreightCurrency"
:type="DICT_TYPE.COMMISSION_CURRENCY_TYPE"
style="width: 100px"
></dict-selector>
<el-select v-model="form.seaFreightVolume" placeholder="请选择" slot="append" style="width: 100px">
<el-option
v-for="item in unitList"
......@@ -83,12 +56,14 @@
</el-form-item>
<el-form-item label="新清关费" required>
<el-input v-model.number="form.clearanceFreight">
<dict-selector
slot="prepend"
v-model="form.clearanceFreightCurrency"
:type="DICT_TYPE.COMMISSION_CURRENCY_TYPE"
style="width: 100px"
></dict-selector>
<el-select v-model="form.clearanceFreightCurrency" placeholder="请选择" slot="prepend" style="width: 100px">
<el-option
v-for="item in currencyList"
:key="item.id"
:label="item.titleZh"
:value="item.id">
</el-option>
</el-select>
<el-select v-model="form.clearanceFreightVolume" placeholder="请选择" slot="append" style="width: 100px">
<el-option
v-for="item in unitList"
......@@ -103,6 +78,20 @@
<div v-if="!readonly">
<el-button type="primary" @click="handleSubmit">提交</el-button>
</div>
<el-descriptions border v-if="readonly" :column="1">
<el-descriptions-item label="商品类型">{{ form.productType }}</el-descriptions-item>
<el-descriptions-item label="商品名称">{{ form.prodTitleZh }}</el-descriptions-item>
<el-descriptions-item label="英文名称">{{ form.prodTitleEn }}</el-descriptions-item>
<el-descriptions-item label="线路">
{{ `【${getDictDataLabel(DICT_TYPE.TRANSPORT_TYPE, form.transportId)}】${ getChannelNameById(form.channelId) }从【${form.departureName}】发往【${form.objectiveName}】`}}
</el-descriptions-item>
<el-descriptions-item label="是否预付">{{ form.isPayAdvance === 0 ? '' : '' }}</el-descriptions-item>
<el-descriptions-item label="旧运费">{{ form.orgSeaFreight }} {{ currentMap[form.orgSeaFreightCurrency] }}/{{ unitMap[form.orgSeaFreightVolume] }}</el-descriptions-item>
<el-descriptions-item label="旧清关费">{{ form.orgClearanceFreight }} {{ currentMap[form.orgClearanceFreightCurrency] }}/{{ unitMap[form.orgClearanceFreightVolume] }}</el-descriptions-item>
<el-descriptions-item label="新运费">{{ form.seaFreight }} {{ currentMap[form.seaFreightCurrency] }}/{{ unitMap[form.seaFreightVolume] }}</el-descriptions-item>
<el-descriptions-item label="新清关费">{{ form.clearanceFreight }} {{ currentMap[form.clearanceFreightCurrency] }}/{{ unitMap[form.clearanceFreightVolume] }}</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
</el-row>
......@@ -114,6 +103,9 @@ import {createOfferSpecial, getOfferSpecial, getOfferSpecialByApproveId} from "@
import {DICT_TYPE, getDictDataLabel} from "@/utils/dict"
import DictSelector from "@/components/DictSelector"
import {getUnitList} from "@/api/ecw/unit"
import {getChannelList} from "@/api/ecw/channel"
import { getCurrencyList } from '@/api/ecw/currency'
import { getProductAttrList } from '@/api/ecw/productAttr'
export default {
name: "specialDiscount",
......@@ -146,6 +138,9 @@ export default {
this.getOfferSpecialByApproveId()
getUnitList().then(res => this.unitList = res.data)
getChannelList().then(res => this.channelList = res.data)
getCurrencyList().then(res => this.currencyList = res.data)
getProductAttrList().then(res => this.productAttrList = res.data)
},
data() {
......@@ -153,6 +148,9 @@ export default {
getDictDataLabel,
DICT_TYPE,
unitList:[],
channelList:[],
currencyList:[],
productAttrList:[],
form: {
"applyResult": "",
"applyStatus": 0,
......@@ -219,6 +217,32 @@ export default {
getOfferSpecialByApproveId(this.id).then(r => {
this.form = r.data
})
},
getProductAttrNameById(id){
return this.productAttrList.find(e => e.id === id)?.attrName || ''
}
},
computed: {
// 根据渠道id显示渠道名
getChannelNameById(){
return channelId => {
const s = this.channelList.find(item => item.channelId == channelId) ?. nameZh
return s ? '' + s + '' : ''
}
},
currentMap(){
let map = {}
this.currencyList.forEach(item => {
map[item.id] = item.titleZh
})
return map
},
unitMap(){
let map = {}
this.unitList.forEach(item => {
map[item.id] = item.titleZh
})
return map
}
}
}
......
<template>
<div class="app-container">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-card>
<div slot="header" class="card-title">新建订单</div>
<el-descriptions :column="3" border>
<el-descriptions-item label="*发货人" >
<el-form-item label="" label-width="0" style="margin-bottom: 0" prop="consignorId" required error="发货人不能为空">
<customer-selector v-model="form.consignorId" @change="consignor = $event" />
</el-form-item>
</el-descriptions-item>
<el-descriptions-item label="发货人">
{{consignor.name || ''}}
</el-descriptions-item>
<el-descriptions-item label="手机号">
{{consignor.defaultContactPhone || ''}}
</el-descriptions-item>
<el-descriptions-item label="发货人公司">
{{consignor.company || ''}}
</el-descriptions-item>
<el-descriptions-item label="客户来源">
{{consignor.source || ''}}
</el-descriptions-item>
<el-descriptions-item label="社交软件">
暂缺字段数据
</el-descriptions-item>
<el-descriptions-item label="联系地址">
{{consignor.address || ''}}
</el-descriptions-item>
</el-descriptions>
<el-descriptions :column="3" border>
<el-descriptions-item label="*收货人">
<el-form-item label="" label-width="0" style="margin-bottom: 0" prop="consigneeId" required error="收货人不能为空">
<customer-selector v-model="form.consigneeId" @change="consignee = $event" />
</el-form-item>
</el-descriptions-item>
<el-descriptions-item label="收货人">
{{consignee.name || ''}}
</el-descriptions-item>
<el-descriptions-item label="手机号">
{{consignee.defaultContactPhone || ''}}
</el-descriptions-item>
<el-descriptions-item label="收货人公司">
{{consignee.company || ''}}
</el-descriptions-item>
<el-descriptions-item label="客户来源">
{{consignee.source || ''}}
</el-descriptions-item>
<el-descriptions-item label="社交软件">
暂缺字段数据
</el-descriptions-item>
<el-descriptions-item label="联系地址">
{{consignee.address || ''}}
</el-descriptions-item>
</el-descriptions>
<el-descriptions :column="3" border>
<el-descriptions-item label="*始发城市">
<el-form-item label="" label-width="0" style="margin-bottom: 0" prop="departureId" required error="始发地必选">
<el-select v-model="form.departureId" placeholder="请选择始发地">
<el-option v-for="item in expoerCityList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
</el-descriptions-item>
<el-descriptions-item label="*目的城市">
<el-form-item label="" label-width="0" style="margin-bottom: 0" prop="objectiveId" required error="目的城市必选">
<el-select v-model="form.objectiveId" placeholder="请选择始发地">
<el-option v-for="item in importCityList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-form-item>
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="mt-10">
<div slot="header" class="card-title">
<div class="card-name">商品信息</div>
<el-button type="primary" size="mini" icon="el-icon-plus" @click="addProduct"></el-button>
</div>
<el-table :data="productList" border>
<el-table-column label="序号" width="60px" fixed>
<template slot-scope="scope">
{{scope.$index + 1}}
</template>
</el-table-column>
<el-table-column label="中文名" width="160px">
<template slot-scope="{row}">
<product-selector v-model="row.prodId" @change="row.goodsType = $event.typeId" />
</template>
</el-table-column>
<el-table-column label="英文名" width="160px">
<template slot-scope="{row}">
<product-selector v-model="row.prodId" @change="row.goodsType = $event.typeId" />
</template>
</el-table-column>
<el-table-column label="商品类型" width="160px">
<template slot-scope="{row}">
<selector disabled v-model="row.goodsType" :options="productAttrList" label-field="attrName" value-field="id"></selector>
</template>
</el-table-column>
<el-table-column label="品牌" width="100px">
<template slot-scope="{row}">
<dict-selector v-model="row.brand" :type="DICT_TYPE.ECW_IS_BRAND" formatter="bool" defaultable @input="getProductFee(row)" />
</template>
</el-table-column>
<el-table-column label="件数" width="90px">
<template slot-scope="{row}">
<el-input v-model.number="row.num" />
</template>
</el-table-column>
<el-table-column label="包装单位">
<template slot-scope="{row}">
<dict-selector v-model="row.unit" :type="DICT_TYPE.ECW_PACKAGE_TYPE" defaultable />
</template>
</el-table-column>
<el-table-column label="箱规(m)" width="120px">
<template slot-scope="{row}">
<el-input v-model="row.boxGauge" @input="calcVolume(row)" />
</template>
</el-table-column>
<el-table-column label="总体积(m³)" width="100px">
<template slot-scope="{row}">
<el-input v-model="row.volume" />
</template>
</el-table-column>
<el-table-column label="总重量(kg)" width="100px">
<template slot-scope="{row}">
<el-input v-model="row.weight" />
</template>
</el-table-column>
<el-table-column label="货值(RMB)" width="100px">
<template slot-scope="{row}">
<el-input v-model="row.worth" />
</template>
</el-table-column>
<el-table-column label="商品特性" width="250px">
<template slot-scope="{row}">
<el-checkbox-group v-model="row.prodAttrArr" @change="onProductAttrChange(row, $event)">
<el-checkbox v-for="item in productAttrList" :label="item.id" :key="item.id">{{item.attrName}}</el-checkbox>
</el-checkbox-group>
</template>
</el-table-column>
<el-table-column label="运输方式" width="150px">
<template slot-scope="{row}">
<dict-selector :type="DICT_TYPE.ECW_TRANSPORT_TYPE" v-model="row.transportId"
@input="onTransportChange(row,$event)" formatter="number" />
</template>
</el-table-column>
<el-table-column label="出货渠道" width="150px">
<template slot-scope="{row}">
<selector
:disabled="getDictData(DICT_TYPE.ECW_TRANSPORT_TYPE, row.transportId).cssClass != 'channel'"
v-model="row.channelId"
:options="channelList"
value-field="channelId"
label-field="nameZh"
@input="onChannelChange(row)"
></selector>
</template>
</el-table-column>
<el-table-column label="线路" width="200px">
<template slot-scope="{row}">
<selector
v-model="row.lineId"
:options="routerList"
@input="onLineChange(row)"
clearable
:label-field="(item, index) => item.startTitleZh + ' >> ' + item.destTitleZh" value-field="id"></selector>
</template>
</el-table-column>
<el-table-column label="运费" width="200px">
<template slot-scope="{row}">
<template v-if="row.fee">
<div>
运费:{{row.fee.seaFreight}} {{currentMap[row.fee.seaFreightCurrency]}} / {{unitMap[row.fee.seaFreightVolume]}}
</div>
<div>
清关费:{{row.fee.clearanceFreight}} {{currentMap[row.fee.clearanceFreightCurrency]}} / {{unitMap[row.fee.clearanceFreightVolume]}}
</div>
</template>
</template>
</el-table-column>
<el-table-column label="操作" width="180px" fixed="right">
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="delProduct(scope.$index)">删除</el-button>
<!-- <el-button size="mini" type="primary" @click="showMorePrice($index)">更多报价</el-button> -->
<!-- <el-button size="mini" type="primary" @click="getProductFee(scope.row)">计算</el-button> -->
</template>
</el-table-column>
</el-table>
<!--
</el-card>
<el-card class="mt-10"> -->
<div class="card-title" style="padding:20px 0;">费用小计</div>
<el-descriptions :column="4" border>
<el-descriptions-item label="总件数">
{{sum.totalNum || 0}}
</el-descriptions-item>
<!-- <el-descriptions-item label="总体积">
{{sum.totalVolume || 0}}m³
</el-descriptions-item>
<el-descriptions-item label="总重量">
{{sum.totalWeight || 0}}kg
</el-descriptions-item> -->
<el-descriptions-item label="总货值">
{{sum.totalWorth || 0}}人民币
</el-descriptions-item>
<el-descriptions-item label="保价费">
{{fee.insuranceFee || 0}}人民币
</el-descriptions-item>
<!-- <el-descriptions-item label="总运费">
<div>{{fee.seaNGN || 0}}泰拉</div>
<div>{{fee.seaRMB || 0}}人民币</div>
<div>{{fee.seaUSD || 0}}美元</div>
</el-descriptions-item>
<el-descriptions-item label="总清关费">
<div>{{fee.clearanceNGN || 0}}泰拉</div>
<div>{{fee.clearanceRMB || 0}}人民币</div>
<div>{{fee.clearanceUSD || 0}}美元</div>
</el-descriptions-item>
<el-descriptions-item label="预计费用">
<div>{{fee.seaNGN + fee.clearanceNGN}}泰拉</div>
<div>{{fee.seaRMB + fee.clearanceRMB + fee.insuranceFee }}人民币</div>
<div>{{fee.seaUSD + fee.clearanceUSD}}美元</div>
</el-descriptions-item> -->
</el-descriptions>
</el-card>
<template v-for="(item, index) in transportList" >
<el-card class="mt-10" :key="index" v-if="item._enabled" :data-enabled="item._enabled">
<div class="card-title" slot="header">{{item.label}}</div>
<el-form-item v-for="(router, routerIndex) in item.routers" :key="routerIndex" :label="item.label.substr(0, 2) + '线路' + (routerIndex + 1)">
<el-col :span="12">
{{getRouterNameById(router.lineId)}}
</el-col>
<el-col :span="12" v-if="router.channelId">
出货渠道{{routerIndex + 1}}: {{getChannelNameById(router.channelId)}}
</el-col>
</el-form-item>
<el-form-item label="是否双清" v-if="[2,3,4].indexOf(+item.transportId) > -1">
<dict-selector v-model="item.doubleClear" form-type="radio" :type="DICT_TYPE.ECW_DOUBLE_CLEAR" />
</el-form-item>
<el-form-item label="航空公司" v-if="[3,4].indexOf(+item.transportId) > -1">
<el-select placeholder="" v-model="item.airlineCompany">
</el-select>
</el-form-item>
<el-form-item label="船公司" v-if="[2].indexOf(+item.transportId) > -1">
<el-select placeholder="" v-model="item.airlineCompany">
</el-select>
</el-form-item>
<el-form-item label="清关证书" v-if="[2,3,4].indexOf(+item.transportId) > -1">
<dict-selector v-model="item.customsClearCert" form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
</el-form-item>
<el-form-item label="清关证书备注" v-if="[2,3,4].indexOf(+item.transportId) > -1">
<el-input v-model="item.remarks" ></el-input>
</el-form-item>
<el-form-item label="是否拆包" v-if="[3,4].indexOf(+item.transportId) > -1">
<dict-selector v-model="item.isUnpack" form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
</el-form-item>
<el-form-item label="单票立刻转运" v-if="[3,4].indexOf(+item.transportId) > -1">
<dict-selector v-model="item.isSingleTicketTransport" form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
<span style="margin-left:10px">注:若只有一件,货到仓库立即发,选“是”,多件需仓库集运待发,选“否”</span>
</el-form-item>
<el-form-item label="包装类型" v-if="[3,4].indexOf(+item.transportId) > -1">
<dict-selector v-model="item.packageType" form-type="checkbox" :type="DICT_TYPE.ECW_PACKAGE_TYPE" multiple />
</el-form-item>
<el-form-item label="包装要求备注" v-if="[3,4].indexOf(+item.transportId) > -1">
<el-input v-model="item.packageRemarks" ></el-input>
</el-form-item>
</el-card>
</template>
<el-card class="mt-10">
<div class="card-title" slot="header">通用</div>
<el-descriptions :column="2" border>
<el-descriptions-item label="唛头">
<el-input v-model="form.marks" placeholder=""></el-input>
</el-descriptions-item>
<el-descriptions-item label="报关方式">
<dict-selector :type="DICT_TYPE.ECW_CUSTOMS_TYPE" v-model="form.customsType" form-type="radio" />
</el-descriptions-item>
<el-descriptions-item label="预计结束时间">
<el-date-picker v-model="form.stopTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
</el-descriptions-item>
<el-descriptions-item label="是否控货">
<dict-selector :type="DICT_TYPE.INFRA_BOOLEAN_STRING" formatter="bool" v-model="form.control" form-type="radio" />
</el-descriptions-item>
<el-descriptions-item label="竞争对手">
<el-input v-model="form.competitor" placeholder=""></el-input>
</el-descriptions-item>
<el-descriptions-item label="重要程度">
<el-rate v-model="form.importance"></el-rate>
</el-descriptions-item>
<el-descriptions-item label="价格有效时间">
<el-date-picker v-model="form.startTime" placeholder="" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
-
<el-date-picker v-model="form.endTime" placeholder="" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
</el-descriptions-item>
<el-descriptions-item label="交货方式">
<!--
接口要求数据为整数,所以增加trade_type类型的字典,用1234代码以下不同类型
FOB(离岸价),CIF(到岸价),CNF(成本加运费),EXW(出厂价)
-->
<dict-selector :type="DICT_TYPE.ECW_TRADE_TYPE" fomtter="number" v-model="form.tradeType" />
<el-input v-model="form.tradeAdress" placeholder=""></el-input>
</el-descriptions-item>
<!-- <el-descriptions-item label="总运费" :span="2">
</el-descriptions-item>
<el-descriptions-item label="总清关费" :span="2">
</el-descriptions-item>
<el-descriptions-item label="总价格" :span="2">
</el-descriptions-item> -->
<!-- <el-descriptions-item label="佣金类型" :span="2">
<dict-selector :type="DICT_TYPE.COMMISSION_TYPE" form-type="radio" fomtter="number" v-model="form.commissionType" defaultable />
</el-descriptions-item> -->
<el-descriptions-item label="付款人" :span="2">
<dict-selector :type="DICT_TYPE.DRAWEE" v-model="form.drawee" form-type="radio" />
</el-descriptions-item>
<el-descriptions-item v-if="form.drawee==3" label="费用类型" :span="2">
<template v-for="(item,index) in customDraweeVOList" v-key="index">
<el-form-item :label="item.name" >
<dict-selector :type="DICT_TYPE.DRAWEE" :filter="(e) => e.value == '1' || e.value == '2'" v-model="item.value" form-type="radio" />
</el-form-item>
</template>
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-form-item label="">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="$router.back()">取 消</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import { createOrder, updateOrder, getOrder, getProductFeeList, getProductFee } from "@/api/ecw/order";
import ProductSelector from '@/components/ProductSelector'
import {getProductAttrList} from '@/api/ecw/productAttr'
import {getChannelList} from '@/api/ecw/channel'
import Selector from '@/components/Selector'
import CustomerSelector from '@/components/CustomerSelector'
import {openedRouterList as getOpenedRouterList} from '@/api/ecw/warehouse'
import {getTradeCityList} from '@/api/ecw/region'
import {getDictData} from '@/utils/dict'
import Fee from '@/components/Fee'
import {getCurrencyList} from '@/api/ecw/currency'
import {getUnitList} from '@/api/ecw/unit'
import { getDictDatas } from '@/utils/dict';
export default {
name: "OrderEdit",
components: {
ProductSelector, Selector, CustomerSelector, Fee
},
data() {
return {
customDraweeVOList: [
{name: '运费',value: undefined},
{name: '清关费',value: undefined},
{name: '其他费用',value: undefined},
{name: '报关费',value: undefined}
],
draweeList: [],
// 遮罩层
loading: true,
// 是否显示弹出层
/* dateRangeStopTime: [],
dateRangeStartTime: [],
dateRangeEndTime: [],
dateRangeCreateTime: [], */
productList:[], // 商品信息
productAttrList:[], // 商品属性
channelList: [], // 出货取到
routerList: [],
tradeCityList: [],
consignor: {}, // 发货人
consignee:{}, // 收货人
transportList: [],
currencyList:[],
unitList:[],
fee: {}, // 费用
// 表单参数
form: {
sendstatus:0
},
// 表单校验
rules: {
/* number: [{ required: true, message: "报价单号不能为空", trigger: "blur" }],
consignorId: [{ required: true, message: "客户id,发货人不能为空", trigger: "blur" }],
consigneeId: [{ required: true, message: "收货人id不能为空", trigger: "blur" }],
sendstatus: [{ required: true, message: "站内信状态,0未发送,1已发送不能为空", trigger: "blur" }], */
}
};
},
computed:{
expoerCityList(){
return this.tradeCityList.filter(item => item.type == 2)
},
importCityList(){
return this.tradeCityList.filter(item => item.type == 1)
},
getDictData(){
return (type, value) => getDictData(type, value) || {}
},
// 被启用的货运方式
/* enbedTransports(){
let transports = []
this.transportList.forEach(item => {
let disabled = true
let lineIds = []
let channelIds = []
let routers = []
this.productList.forEach(prod => {
if(prod.offerTransportId == item.transportId){
disabled = false
routers.push({
lineId: prod.lineId,
channelId: prod.channelId
})
if(prod.lineId)lineIds.push(prod.lineId)
if(prod.channelId)channelIds.push(prod.channelId)
}
})
if(!disabled){
item._disabled = disabled
item.routers = routers
item.lineIds = lineIds.join(',')
item.channelIds = channelIds.join(',')
transports.push(item)
}
})
return transports
}, */
// 根据线路id显示线路名称
getRouterNameById(){
return routerId => {
let router = this.routerList.find(item => item.id == routerId)
console.log({router})
if(router){
return router.startTitleZh + ' > ' + router.destTitleZh
}
return '-'
}
},
// 根据渠道id显示渠道名
getChannelNameById(){
return channelId => {
return this.channelList.find(item => item.channelId == channelId) ?. nameZh
}
},
currentMap(){
let map = {}
this.currencyList.forEach(item => {
map[item.id] = item.titleZh
})
return map
},
unitMap(){
let map = {}
this.unitList.forEach(item => {
map[item.id] = item.titleZh
})
return map
},
sum(){
let sum = {
totalNum: 0,
totalVolume: 0,
totalWeight: 0,
totalWorth: 0,
}
this.productList.forEach(item => {
sum.totalNum += parseInt(item.num) || 0
sum.totalVolume += parseFloat(item.volume) || 0
sum.totalWeight += parseFloat(item.weight) || 0
sum.totalWorth += parseFloat(item.worth) || 0
})
return sum
}
},
watch:{
// 始发地
'form.departureId'(){
this.getOpenedRouterList()
},
// 目的地
'form.objectiveId'(){
this.getOpenedRouterList()
},
},
created() {
getProductAttrList().then(res => this.productAttrList = res.data)
getChannelList().then(res => this.channelList = res.data)
getTradeCityList().then(res => this.tradeCityList = res.data)
getCurrencyList().then(res => this.currencyList = res.data)
getUnitList().then(res => this.unitList = res.data)
this.getDictDatas(this.DICT_TYPE.ECW_TRANSPORT_TYPE).forEach(res => {
this.transportList.push({
transportId: +res.value, // 转为整形
label: res.label,
})
})
if(this.$route.query.id){
getOffer(this.$route.query.id).then(res => {
this.$set(this, 'form', res.data)
if(res.data.offerProdRespVOList){
res.data.offerProdRespVOList.forEach(item => {
this.addProduct({
"goodsType": item.goodsType,
"brand": item.brand,
"unit": item.unit,
"channelId": item.channelId,
"lineId": item.lineId,
"prodId": item.prodId,
"num": item.num,
"boxGauge": item.boxGauge,
"volume": item.volume,
"transportId": item.transportId,
"weight": item.weight,
"worth": item.worth,
"prodAttrArr": item.prodAttrIds && item.prodAttrIds != '' ? item.prodAttrIds.split(',').filter(item => item != '').map(item => +item) : []
})
})
}
console.log('res.data.transportRespVOList', res.data.transportRespVOList)
res.data.transportRespVOList.forEach(item => {
let transport = this.transportList.find(t => t.transportId == item.transportId)
console.log(item.transportId, transport)
Object.assign(transport, item, {_enabled: true})
})
this.$nextTick(() => {
this.updateEnabledTransports()
})
})
}else this.addProduct()
},
methods: {
onTransportChange(row, val){
this.getProductFee(row)
if(this.getDictData(this.DICT_TYPE.ECW_TRANSPORT_TYPE, val).cssClass != 'channel') row.channelId = null
this.updateEnabledTransports()
},
onLineChange(row){
this.getProductFee(row)
this.updateEnabledTransports()
},
onChannelChange(row){
this.getProductFee(row)
},
onProductAttrChange(row, attr){
console.log(attr)
this.getProductFee(row)
/* // 需要强制刷新,否则勾选框不更新
this.$forceUpdate() */
},
// 更新运输方式
updateEnabledTransports(){
let enabled = {}
this.productList.forEach(prod => {
if(prod.transportId){
if(!enabled[prod.transportId]){
enabled[prod.transportId] = {
// transportId: prod.transportId,
lineIdSet: new Set(),
channelIdSet: new Set(),
routers:[]
}
}
if(prod.lineId){
enabled[prod.transportId].lineIdSet.add(prod.lineId)
}
if(prod.channelId){
enabled[prod.transportId].channelIdSet.add(prod.channelId)
}
if(prod.lineId && enabled[prod.transportId].routers.findIndex(item => { item.lineId == prod.lineId && item.channelId == prod.channelId }) < 0){
enabled[prod.transportId].routers.push({
lineId: prod.lineId,
channelId: prod.channelId
})
}
}
})
console.log(JSON.stringify(enabled))
let enabledTransportIds = Object.keys(enabled).map(item => +item)
this.transportList.forEach(transport => {
this.$set(transport, '_enabled', enabledTransportIds.indexOf(transport.transportId) > -1 && enabled[transport.transportId].routers.length)
if(transport._enabled){
Object.assign(transport, enabled[transport.transportId])
}
})
},
addProduct(data){
this.productList.push(data || {prodAttrArr:[]})
},
// 计算商品运费
getProductFee(row){
if(!row.prodId || !row.transportId || !row.lineId || !row.num || !row.weight)return false
if(row.prodAttrArr){
row.prodAttrIds = row.prodAttrArr.join(',')
}
getProductFeeList(row).then(res => {
this.$set(row, 'fee', res.data[0] || {})
})
},
// 获取路线
getOpenedRouterList(){
let params = {}
if(this.form.departureId){
params.startCityId = this.form.departureId
}
if(this.form.objectiveId){
params.destCityId = this.form.objectiveId
}
getOpenedRouterList(params).then(res => this.routerList = res.data)
},
// 计算体积
calcVolume(row){
if(!row.boxGauge || !row.num) return false
try{
row.volume = (eval(row.boxGauge) * row.num).toFixed(2)
}catch(e){
row.volume = ''
}
},
// 删除一条产品
delProduct(index){
this.$confirm('确定删除此条内容么?')
.then(res => {
this.productList.splice(index, 1)
})
},
// 显示更多报价
showMorePrice(index){
console.log('显示更多', index)
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (!valid) {
return;
}
this.productList.map(item => {
item.prodAttrIds = item.prodAttrArr.join(',')
})
this.transportList.map(item => {
if(item._enabled){
item.lineIds = Array.from(item.lineIdSet).join(',')
item.channelIds = Array.from(item.channelIdSet).join(',')
}
})
// 修改的提交
if (this.form.orderNo != null) {
let data = Object.assign({}, this.form, {
customDraweeVOList: this.customDraweeVOList,
transportUpdateReqVOList: this.transportList.filter(item => item._enabled),
orderItemVOList: this.productList
})
updateOrder(data).then(response => {
this.$modal.msgSuccess("修改成功");
this.$router.back()
});
return;
}
let data = Object.assign({}, this.form, {
customDraweeVOList: this.customDraweeVOList,
transportUpdateReqVOList: this.transportList.filter(item => item._enabled),
orderItemVOList: this.productList
})
// 添加的提交
createOrder(data).then(response => {
this.$modal.msgSuccess("新增成功");
this.$router.replace('order')
});
});
},
}
};
</script>
<style lang="scss" scoped>
.card-title{
font-size: 18px;
display: flex;
.card-name{
flex: 1;
}
}
.mt-10{
margin-top: 10px;
}
</style>
\ No newline at end of file
......@@ -62,6 +62,12 @@
</template>
</el-table-column>
<el-table-column label="订单状态" align="center" prop="status">
<template slot-scope="scope">
<span>{{ scope.row.status | customsTypeFilter(customsTypeList) }}</span>
</template>
</el-table-column>
<el-table-column label="入仓箱数" align="center" prop="sumNum" />
<el-table-column label="入仓方数" align="center" prop="sumVolume" />
<el-table-column label="入仓重量" align="center" prop="sumWeight" />
......
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