|
|
|
|
<template>
|
|
|
|
|
<div class="boardFullPage stockBoardPage">
|
|
|
|
|
<boardHeader
|
|
|
|
|
ref="boardHeader_Ref"
|
|
|
|
|
:title="'备料看板'"
|
|
|
|
|
></boardHeader>
|
|
|
|
|
<dv-loading v-show="dataLoading">Loading...</dv-loading>
|
|
|
|
|
<div class="lineContain">
|
|
|
|
|
<dv-scroll-board :config="config" ref="stockBoard_Ref" style="height:100%"/>
|
|
|
|
|
<div class="hasNoData" v-if="config.data.length <= 0 && !dataLoading">暂无数据</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import axiosUtil from '../utils/request'
|
|
|
|
|
import boardHeader from '../components/boardHeader'
|
|
|
|
|
import util from '../utils/util'
|
|
|
|
|
export default {
|
|
|
|
|
name: 'stockBoard',
|
|
|
|
|
components:{boardHeader},
|
|
|
|
|
data () {
|
|
|
|
|
return {
|
|
|
|
|
dataLoading: true,
|
|
|
|
|
// config默认项
|
|
|
|
|
configDefult:{
|
|
|
|
|
header:['物料', '描述', '数量', '需求库位', '状态' ],
|
|
|
|
|
waitTime: util.waitTime,//每页停留20秒d
|
|
|
|
|
carousel: 'page',
|
|
|
|
|
// index: true,
|
|
|
|
|
// indexHeader: '序号',
|
|
|
|
|
columnWidth: [660,660,280,280,280],
|
|
|
|
|
align: ['left','left','center','center','center'],
|
|
|
|
|
hoverPause: false, // 鼠标悬浮时，不停止轮播
|
|
|
|
|
rowNum: 10,
|
|
|
|
|
headerBGC: '#1981f6',
|
|
|
|
|
headerHeight: 65,
|
|
|
|
|
evenRowBGC: 'rgba(0, 44, 81, 0.9)',
|
|
|
|
|
oddRowBGC: 'rgba(10, 29, 50, 0.9)'
|
|
|
|
|
},
|
|
|
|
|
config: {}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.initConfig()
|
|
|
|
|
this.getList()
|
|
|
|
|
clearInterval(this.intervalId)
|
|
|
|
|
this.intervalId = setInterval(() => {
|
|
|
|
|
this.getList()
|
|
|
|
|
}, 60000)//一分钟刷新数据
|
|
|
|
|
util.addEventResizeFlesh()
|
|
|
|
|
},
|
|
|
|
|
destroyed() {
|
|
|
|
|
clearInterval(this.intervalId)
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
init(){
|
|
|
|
|
this.initConfig()
|
|
|
|
|
this.getList()
|
|
|
|
|
util.addEventResizeFlesh()
|
|
|
|
|
},
|
|
|
|
|
initConfig(data){
|
|
|
|
|
this.config = {
|
|
|
|
|
header: this.configDefult.header,
|
|
|
|
|
data: data || [],
|
|
|
|
|
waitTime: this.configDefult.waitTime,//每页停留20秒d
|
|
|
|
|
carousel: this.configDefult.carousel,
|
|
|
|
|
index: this.configDefult.index,
|
|
|
|
|
indexHeader: this.configDefult.indexHeader,
|
|
|
|
|
columnWidth: this.configDefult.columnWidth,
|
|
|
|
|
align: this.configDefult.align,
|
|
|
|
|
hoverPause: this.configDefult.hoverPause, // 鼠标悬浮时，不停止轮播
|
|
|
|
|
rowNum: this.configDefult.rowNum,
|
|
|
|
|
headerBGC: this.configDefult.headerBGC,
|
|
|
|
|
headerHeight: this.configDefult.headerHeight,
|
|
|
|
|
oddRowBGC: this.configDefult.oddRowBGC,
|
|
|
|
|
evenRowBGC: this.configDefult.evenRowBGC
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async getList(){
|
|
|
|
|
this.dataLoading = true
|
|
|
|
|
this.initConfig()
|
|
|
|
|
// axiosUtil.ajax_get('/api/dashboard/plan-and-actual/plan-actual-list').then(res => {
|
|
|
|
|
this.dataLoading = false
|
|
|
|
|
// if(res.length <= 0){
|
|
|
|
|
// return
|
|
|
|
|
// }
|
|
|
|
|
let rows = []
|
|
|
|
|
// 假数据
|
|
|
|
|
let _res = [
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294FL047",
|
|
|
|
|
"itemName": "294项目左前门",
|
|
|
|
|
"qty": 65,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 23,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RR027",
|
|
|
|
|
"itemName": "294项目右后门",
|
|
|
|
|
"qty": 60,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 80,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FR005",
|
|
|
|
|
"itemName": "254项目右前门",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FL036",
|
|
|
|
|
"itemName": "254项目左前门",
|
|
|
|
|
"qty": 30,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "L0385670AA_1D03",
|
|
|
|
|
"itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
|
|
|
|
|
"qty": 10,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "V01",
|
|
|
|
|
"itemName": "scrap item. ",
|
|
|
|
|
"qty": 16,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "41300016AA",
|
|
|
|
|
"itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'SALE',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294FL047",
|
|
|
|
|
"itemName": "294项目左前门",
|
|
|
|
|
"qty": 65,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 23,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RR027",
|
|
|
|
|
"itemName": "294项目右后门",
|
|
|
|
|
"qty": 60,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 80,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FR005",
|
|
|
|
|
"itemName": "254项目右前门",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FL036",
|
|
|
|
|
"itemName": "254项目左前门",
|
|
|
|
|
"qty": 30,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "L0385670AA_1D03",
|
|
|
|
|
"itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
|
|
|
|
|
"qty": 10,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "V01",
|
|
|
|
|
"itemName": "scrap item. ",
|
|
|
|
|
"qty": 16,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "41300016AA",
|
|
|
|
|
"itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'SALE',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294FL047",
|
|
|
|
|
"itemName": "294项目左前门",
|
|
|
|
|
"qty": 65,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 23,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RR027",
|
|
|
|
|
"itemName": "294项目右后门",
|
|
|
|
|
"qty": 60,
|
|
|
|
|
"locationCode": 'WIP',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "294RL005",
|
|
|
|
|
"itemName": "294项目左后门",
|
|
|
|
|
"qty": 80,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FR005",
|
|
|
|
|
"itemName": "254项目右前门",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "254FL036",
|
|
|
|
|
"itemName": "254项目左前门",
|
|
|
|
|
"qty": 30,
|
|
|
|
|
"locationCode": 'FG',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "L0385670AA_1D03",
|
|
|
|
|
"itemName": "IP HUD WSS HIGH 1D03 L0385670AA 1D03",
|
|
|
|
|
"qty": 10,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "V01",
|
|
|
|
|
"itemName": "scrap item. ",
|
|
|
|
|
"qty": 16,
|
|
|
|
|
"locationCode": 'SH',
|
|
|
|
|
"status": '正常'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"itemCode": "41300016AA",
|
|
|
|
|
"itemName": "PVC KL NAPPAO BLANK19K21 L0387018AA",
|
|
|
|
|
"qty": 20,
|
|
|
|
|
"locationCode": 'SALE',
|
|
|
|
|
"status": '紧急'
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
_res.forEach(item=>{
|
|
|
|
|
let _item = []
|
|
|
|
|
_item[0] = item.itemCode;//物料
|
|
|
|
|
_item[1] = item.itemName;//描述
|
|
|
|
|
_item[2] = item.qty;//数量
|
|
|
|
|
_item[3] = item.locationCode;//需求库位
|
|
|
|
|
if(item.status == '紧急'){
|
|
|
|
|
_item[4] = `<span class="statusBlockItem statusBlockItem_warning">${item.status}</span>`;//状态
|
|
|
|
|
}else{
|
|
|
|
|
_item[4] = `<span class="statusBlockItem statusBlockItem_normal">${item.status}</span>`;//状态
|
|
|
|
|
}
|
|
|
|
|
rows.push(_item)
|
|
|
|
|
})
|
|
|
|
|
this.initConfig(rows)
|
|
|
|
|
// this_.$refs['stockBoard_Ref'].updateRows(rows,0) //如果不需要刷新页面 不需要循环数据 追加数据用此方法
|
|
|
|
|
// }).catch(error => {
|
|
|
|
|
// this.dataLoading = false
|
|
|
|
|
// console.log(error)
|
|
|
|
|
// })
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="less">
|
|
|
|
|
.stockBoardPage{
|
|
|
|
|
.header-item{
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
.ceil{
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.dv-loading{
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
.lineContain{
|
|
|
|
|
margin: 2rem;
|
|
|
|
|
height: calc(100vh - 10rem);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
