6 changed files with 524 additions and 4 deletions
-
3src/api/shipment/detail.js
-
5src/api/shipment/index.js
-
410src/views/modules/finshProduct/outWarehouse.vue
-
54src/views/modules/finshProduct/outWarehouse/outWarehouseDetail.vue
-
41src/views/modules/finshProduct/outWarehouse/shipmentBox.vue
-
15src/views/modules/production/order.vue
@ -0,0 +1,3 @@ |
|||
import {createAPI} from '../../utils/httpRequest' |
|||
|
|||
export const getShipmentDetailList = (data) => createAPI(`/shipment/detail/list`,'post',data) |
|||
@ -0,0 +1,5 @@ |
|||
import {createAPI} from '../../utils/httpRequest' |
|||
|
|||
export const getShipmentList = (data) => createAPI( '/shipment/list','post', data) |
|||
|
|||
export const getShipmentPage = (data) => createAPI( `/shipment/list/${data.no}/${data.size}`,'post',data) |
|||
@ -0,0 +1,410 @@ |
|||
<script> |
|||
import OutWarehouseDetail from './outWarehouse/outWarehouseDetail.vue' |
|||
import {getShipmentPage} from '../../../api/shipment' |
|||
import {getShipmentDetailList} from '../../../api/shipment/detail' |
|||
import ShipmentBox from './outWarehouse/shipmentBox.vue' |
|||
|
|||
export default { |
|||
name: "outWarehouse", |
|||
components: {ShipmentBox, OutWarehouseDetail}, |
|||
props:{ |
|||
height:{ |
|||
type: Number, |
|||
default:300, |
|||
} |
|||
}, |
|||
data(){ |
|||
return{ |
|||
loading: false, |
|||
open: false, |
|||
queryForm:{ |
|||
shipmentId: "", |
|||
startDate: "", |
|||
endDate: "", |
|||
}, |
|||
no: 1, |
|||
size: 50, |
|||
total: 0, |
|||
dataList:[], |
|||
// selectDataList:[], |
|||
form:{}, |
|||
columnList:[ |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002TableShipmentId', |
|||
tableId: "400002Table", |
|||
tableName: "shipment", |
|||
columnProp: "shipmentId", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "发货ID", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 70 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002TableShipDate', |
|||
tableId: "400002Table", |
|||
tableName: "shipment", |
|||
columnProp: "shipDate", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "发货日期", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 100 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002TableCustomerNo', |
|||
tableId: "400002Table", |
|||
tableName: "shipment", |
|||
columnProp: "customerNo", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "客户编码", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 70 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002TableCustomerName', |
|||
tableId: "400002Table", |
|||
tableName: "shipment", |
|||
columnProp: "customerName", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "客户名称", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 360 |
|||
}, |
|||
], |
|||
row:{}, |
|||
activeName:'detail', |
|||
detailDataList:[], |
|||
columnDetailList:[ |
|||
{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2PartNo', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "partNo", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "料号", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2PartDesc', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "partDesc", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "物料描述", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 100 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2SaleQty', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "saleQty", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "数量", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2OrderRef1', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "orderRef1", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "关联单号1", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2OrderRef2', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "orderRef2", |
|||
headerAlign: "center", |
|||
align: "left", |
|||
columnLabel: "关联单号2", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80 |
|||
},{ |
|||
userId: this.$store.state.user.name, |
|||
functionId: 400002, |
|||
serialNumber: '400002Table2OrderRef3', |
|||
tableId: "400002Table2", |
|||
tableName: "ShipmentDetail", |
|||
columnProp: "orderRef3", |
|||
headerAlign: "center", |
|||
align: "center", |
|||
columnLabel: "关联单号3", |
|||
columnHidden: false, |
|||
columnImage: false, |
|||
columnSortable: false, |
|||
sortLv: 0, |
|||
status: true, |
|||
fixed: '', |
|||
columnWidth: 80 |
|||
} |
|||
] |
|||
} |
|||
}, |
|||
methods:{ |
|||
getDataList(){ |
|||
let params = { |
|||
...this.queryForm, |
|||
no: this.no, |
|||
size: this.size, |
|||
site:this.$store.state.user.site |
|||
} |
|||
this.dataList = []; |
|||
this.loading = true; |
|||
getShipmentPage(params).then(({data})=>{ |
|||
this.loading = false; |
|||
if (data && data.code === 0){ |
|||
this.dataList = data.page.records; |
|||
this.total = data.page.total; |
|||
if (this.total > 0){ |
|||
this.handleRowClick(this.dataList[0]) |
|||
} |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error)=>{ |
|||
this.loading = false; |
|||
this.$message.error(error) |
|||
}) |
|||
}, |
|||
handleQuery(){ |
|||
this.getDataList(); |
|||
}, |
|||
handleSizeChange(val){ |
|||
this.size = val; |
|||
this.getDataList(); |
|||
}, |
|||
handleCurrentChange(val){ |
|||
this.no = val; |
|||
this.getDataList(); |
|||
}, |
|||
handleOutWarehouse(row){ |
|||
this.form = {...row} |
|||
this.open=true; |
|||
}, |
|||
getDetailDataList(){ |
|||
let params = { |
|||
shipmentId: this.row.shipmentId, |
|||
site:this.row.site |
|||
} |
|||
this.detailDataList = []; |
|||
getShipmentDetailList(params).then(({data})=>{ |
|||
if (data && data.code === 0){ |
|||
this.detailDataList = data.rows; |
|||
}else { |
|||
this.$message.warning(data.msg) |
|||
} |
|||
}).catch((error)=>{ |
|||
this.$message.error(error) |
|||
}) |
|||
}, |
|||
rowStyle({row}){ |
|||
if (row.site === this.row.site && row.shipmentId === this.row.shipmentId){ |
|||
return { |
|||
background: '#E8F7F6' |
|||
} |
|||
} |
|||
}, |
|||
handleRowClick(row){ |
|||
this.row = {...row}; |
|||
} |
|||
}, |
|||
watch:{ |
|||
row(newVal,oldVal){ |
|||
if (newVal){ |
|||
this.getDetailDataList(); |
|||
} |
|||
} |
|||
}, |
|||
created () { |
|||
this.getDataList(); |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<div style="width: 1100px"> |
|||
<el-form :model="queryForm" ref="queryForm" label-position="top"> |
|||
<el-row :gutter="10"> |
|||
<el-col :span="3"> |
|||
<el-form-item label="发货ID"> |
|||
<el-input v-model="queryForm.shipmentId"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="7"> |
|||
<el-row :gutter="10"> |
|||
<el-col :span="11"> |
|||
<el-form-item label="发货日期"> |
|||
<el-date-picker |
|||
style="width: 100%" |
|||
v-model="queryForm.startDate" |
|||
type="date" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="选择日期"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="2"> |
|||
<el-form-item label=" "> |
|||
<label style="margin-left: 0px;font-size: 19px">➞</label> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="11"> |
|||
<el-form-item label=" "> |
|||
<el-date-picker |
|||
style="width: 100%" |
|||
v-model="queryForm.endDate" |
|||
type="date" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="选择日期"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-col> |
|||
<el-col :span="3"> |
|||
<el-form-item label=" "> |
|||
<el-button type="primary" @click="handleQuery">查询</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<el-table :data="dataList" v-loading="loading" border :height="height" @row-click="handleRowClick" :row-style="rowStyle"> |
|||
<el-table-column align="center" label="操作" width="100"> |
|||
<template slot-scope="scope"> |
|||
<el-link @click="handleOutWarehouse(scope.row)">装箱出库</el-link> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
v-for="(item,index) in columnList" :key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:header-align="item.headerAlign" |
|||
:show-overflow-tooltip="item.showOverflowTooltip" |
|||
:align="item.align" |
|||
:fixed="item.fixed==''?false:item.fixed" |
|||
:min-width="item.columnWidth" |
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> |
|||
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" |
|||
style="width: 100px; height: 80px"/></span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!-- <div style="float: left;margin-top: 10px;color: gray;font-size: 13px" v-html="`共 <span style='color: #16B3A3'>${total}</span> 条 记 录，已 选 <span style='color: #16B3A3'>${selectDataList.length}</span> 条`"></div>--> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page="no" |
|||
:page-sizes="[50, 100, 1000]" |
|||
:page-size="size" |
|||
:total="total" |
|||
style="margin-top: 0px" |
|||
layout="total, sizes, prev, pager, next, jumper"> |
|||
</el-pagination> |
|||
<el-tabs v-model="activeName"> |
|||
<el-tab-pane label="出库明细" name="detail"> |
|||
<out-warehouse-detail :height="420" :data-list="detailDataList" :column-list="columnDetailList"></out-warehouse-detail> |
|||
</el-tab-pane> |
|||
</el-tabs> |
|||
|
|||
<el-dialog title="装箱出库" v-drag :visible.sync="open" width="800px" :close-on-click-modal="false"> |
|||
<el-form :model="form" ref="form" label-position="top"> |
|||
<el-row :gutter="10"> |
|||
<el-col :span="4"> |
|||
<el-form-item label="发货ID"> |
|||
<el-input v-model="form.shipmentId" disabled></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="4"> |
|||
<el-form-item label="客户编码"> |
|||
<el-input v-model="form.customerNo" disabled></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item label="客户名称"> |
|||
<el-input v-model="form.customerName" disabled></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
<shipment-box :data-list="[]" :height="200"></shipment-box> |
|||
<el-footer style="height: 20px"></el-footer> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,54 @@ |
|||
<script> |
|||
export default { |
|||
name: 'outWarehouseDetail', |
|||
props:{ |
|||
height:{ |
|||
type:Number, |
|||
default:300 |
|||
}, |
|||
dataList:{ |
|||
type:Array, |
|||
default:()=>[] |
|||
}, |
|||
columnList:{ |
|||
type:Array, |
|||
default:()=>[] |
|||
}, |
|||
}, |
|||
data(){ |
|||
return{ |
|||
|
|||
} |
|||
}, |
|||
methods:{ |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<el-table :data="dataList" border style="width: 100%" :height="height"> |
|||
<el-table-column |
|||
v-for="(item,index) in columnList" :key="index" |
|||
:sortable="item.columnSortable" |
|||
:prop="item.columnProp" |
|||
:header-align="item.headerAlign" |
|||
:show-overflow-tooltip="item.showOverflowTooltip" |
|||
:align="item.align" |
|||
:fixed="item.fixed==''?false:item.fixed" |
|||
:min-width="item.columnWidth" |
|||
:label="item.columnLabel"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> |
|||
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" |
|||
style="width: 100px; height: 80px"/></span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,41 @@ |
|||
<script> |
|||
export default { |
|||
name: 'shipmentBox', |
|||
props:{ |
|||
height:{ |
|||
type:Number, |
|||
default:300 |
|||
}, |
|||
dataList:{ |
|||
type:Array, |
|||
default:()=>[] |
|||
}, |
|||
}, |
|||
data(){ |
|||
|
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<template> |
|||
<div> |
|||
<div style="display: flex;justify-content: space-between;"> |
|||
<div><el-button type="primary" >新增箱子</el-button></div> |
|||
<div><el-button type="primary" @click="$emit('lastOutShipment')">最终出库</el-button></div> |
|||
</div> |
|||
<el-table :data="dataList" style="width: 100%" border :height="height"> |
|||
<el-table-column prop="boxNo" label="箱号" width="400" header-align="center" align="left"></el-table-column> |
|||
<el-table-column align="center" label="操作"> |
|||
<template slot-scope="scope"> |
|||
<el-link >查看</el-link> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue