<template>
|
<div class="mod-config">
|
<basic-container>
|
<div class="avue-crud">
|
<el-row>
|
<el-col :span="1">
|
<div>
|
<el-divider direction="vertical"></el-divider>
|
<div
|
style="float: left;height: 18px;font-size: 13px;line-height: 18px;font-weight: bold"
|
>
|
<span>销售订单</span>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div>
|
<el-input
|
clearable
|
@keyup.enter.native="getDataList"
|
v-model="paramObject.customerOrderNo"
|
placeholder="销售订单"
|
@clear="getDataList"
|
style="width: 100%"
|
>
|
</el-input>
|
</div>
|
</el-col>
|
<el-col :span="1" :offset="1">
|
<div>
|
<el-divider direction="vertical"></el-divider>
|
<div
|
style="float: left;height: 18px;font-size: 13px;line-height: 18px;font-weight: bold"
|
>
|
<span>主计划号</span>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div>
|
<el-input
|
clearable
|
@keyup.enter.native="getDataList"
|
v-model="paramObject.mpsNo"
|
placeholder="主计划号"
|
@clear="getDataList"
|
style="width: 100%"
|
>
|
</el-input>
|
</div>
|
</el-col>
|
<el-col :span="1" :offset="1">
|
<div>
|
<el-divider direction="vertical"></el-divider>
|
<div
|
style="float: left;height: 18px;font-size: 13px;line-height: 18px;font-weight: bold"
|
>
|
<span>车间订单</span>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div>
|
<el-input
|
clearable
|
@keyup.enter.native="getDataList"
|
v-model="paramObject.moNo"
|
placeholder="车间订单"
|
@clear="getDataList"
|
style="width: 100%"
|
>
|
</el-input>
|
</div>
|
</el-col>
|
<el-col :span="1" :offset="1">
|
<div>
|
<el-divider direction="vertical"></el-divider>
|
<div
|
style="float: left;height: 18px;font-size: 13px;line-height: 18px;font-weight: bold"
|
>
|
<span>需求日期</span>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div>
|
<el-date-picker
|
clearable
|
v-model="paramObject.requiredDate"
|
type="datetimerange"
|
start-placeholder="开始"
|
end-placeholder="结束"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
@change="feedDateChange($event)"
|
size="mini"
|
style="width:100px"
|
>
|
</el-date-picker>
|
</div>
|
</el-col>
|
<el-col :span="2" :offset="1">
|
<el-button type="primary" @click="getDataList()">搜索</el-button>
|
</el-col>
|
</el-row>
|
<el-table
|
:data="dataList"
|
border
|
v-loading="dataListLoading"
|
:span-method="objectSpanMethod"
|
class="l-mes-table"
|
:height="screenHeight"
|
>
|
<el-table-column type="index" label="序号" width="50">
|
</el-table-column>
|
<el-table-column
|
prop="customerName"
|
header-align="center"
|
align="center"
|
label="客户名称"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="customerOrderNo"
|
header-align="center"
|
align="center"
|
label="销售订单号"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="mpsNo"
|
header-align="center"
|
align="center"
|
label="主计划号"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="partNo"
|
header-align="center"
|
align="center"
|
label="零件号"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="partName"
|
header-align="center"
|
align="center"
|
label="零件名称"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="qtyRequired"
|
header-align="center"
|
align="center"
|
label="车间订单需求数量"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="unit"
|
header-align="center"
|
align="center"
|
label="单位"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="requiredDate"
|
header-align="center"
|
align="center"
|
label="需求日期"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="moNo"
|
header-align="center"
|
align="center"
|
label="车间订单号"
|
>
|
</el-table-column>
|
<el-table-column label="工序" align="center">
|
<el-table-column
|
prop="name"
|
header-align="center"
|
align="center"
|
label="工序名称"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="operationPartNo"
|
header-align="center"
|
align="center"
|
label="工序零件号"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="operationPartName"
|
header-align="center"
|
align="center"
|
label="工序零件名称"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="pda"
|
header-align="center"
|
align="center"
|
label="工序需求数量"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="plannedQuantity"
|
header-align="center"
|
align="center"
|
label="工单的计划数量"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="completedQuantity"
|
header-align="center"
|
align="center"
|
label="工单的完成数量"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="units"
|
header-align="center"
|
align="center"
|
label="单位"
|
>
|
</el-table-column>
|
</el-table-column>
|
<el-table-column
|
prop="count"
|
header-align="center"
|
align="center"
|
label="工序完成进度"
|
>
|
</el-table-column>
|
</el-table>
|
</div>
|
|
<div class="avue-crud__pagination">
|
<el-pagination
|
@size-change="sizeChangeHandle"
|
@current-change="currentChangeHandle"
|
:current-page="pageIndex"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageSize"
|
:total="totalPage"
|
background
|
layout="total, sizes, prev, pager, next, jumper"
|
>
|
</el-pagination>
|
</div>
|
</basic-container>
|
</div>
|
</template>
|
|
<script>
|
import { mapGetters } from 'vuex'
|
import { getStatementPage } from '../../../api/plan/manufacturingorder'
|
|
export default {
|
data() {
|
return {
|
screenHeight: `${document.documentElement.clientHeight}` - 170,
|
newSpanArr: [],
|
dataForm: {
|
key: ''
|
},
|
paramObject: {},
|
dateTimeFiltersThree: {},
|
orderRequiredDate: null,
|
orderMoNo: null,
|
dataList: [],
|
pageIndex: 1,
|
pageSize: 20,
|
totalPage: 0,
|
dataListLoading: false,
|
addOrUpdateVisible: false
|
}
|
},
|
created() {
|
this.getDataList()
|
},
|
computed: {
|
...mapGetters(['permissions'])
|
},
|
methods: {
|
// 获取数据列表
|
getDataList() {
|
this.dataListLoading = true
|
const criteria = {}
|
criteria.dateTimeFilters = this.dateTimeFiltersThree
|
const query = Object.assign(
|
{
|
current: this.pageIndex,
|
size: this.pageSize,
|
criteria: JSON.stringify(criteria)
|
},
|
this.paramObject
|
)
|
getStatementPage(query).then((response) => {
|
this.dataList = response.data.data.records
|
this.totalPage = response.data.data.total
|
this.getSpanArr()
|
})
|
this.dataListLoading = false
|
},
|
getSpanArr() {
|
this.newSpanArr.length = 0
|
if (this.dataList.length > 0) {
|
for (var i = 0; i < this.dataList.length; i++) {
|
if (i === 0) {
|
this.newSpanArr.push(1)
|
this.pos = 0
|
} else {
|
// 判断零件号是否一样
|
if (
|
this.dataList[i].moNo &&
|
this.dataList[i].moNo === this.dataList[i - 1].moNo
|
) {
|
this.newSpanArr[this.pos] += 1
|
this.newSpanArr.push(0)
|
} else {
|
this.newSpanArr.push(1)
|
this.pos = i
|
}
|
}
|
}
|
}
|
},
|
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
if (
|
columnIndex === 1 ||
|
columnIndex === 2 ||
|
columnIndex === 3 ||
|
columnIndex === 4 ||
|
columnIndex === 5 ||
|
columnIndex === 6
|
) {
|
if (this.newSpanArr && this.newSpanArr.length > 0) {
|
if (this.newSpanArr[rowIndex] === 0) {
|
return {
|
rowspan: 0,
|
colspan: 0
|
}
|
} else {
|
return {
|
rowspan: this.newSpanArr[rowIndex],
|
colspan: 1
|
}
|
}
|
}
|
}
|
},
|
feedDateChange(val) {
|
if (val != null) {
|
this.dateTimeFiltersThree.requiredDate = val
|
} else {
|
delete this.dateTimeFiltersThree.requiredDate
|
}
|
this.getDataList()
|
},
|
// 每页数
|
sizeChangeHandle(val) {
|
this.pageSize = val
|
this.pageIndex = 1
|
this.getDataList()
|
},
|
// 当前页
|
currentChangeHandle(val) {
|
this.pageIndex = val
|
this.getDataList()
|
}
|
}
|
}
|
</script>
|
