xins
/
HwMes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改图表

Browse Source
master
夜笙歌 3 months ago
parent 748315dab7
commit ed42221638
2 changed files with 49 additions and 34 deletions
Show Stats Download Patch File Download Diff File

2
hw-ui/src/views/board/warehouse/fifthFloor.vue
Unescape Escape View File

@ -181,7 +181,7 @@ export default {
allowPointSelect: false, allowPointSelect: false,
cursor: 'pointer', cursor: 'pointer',
depth: 35, depth: 35,
startAngle: 45,y startAngle: 45,
size: 200, size: 200,
dataLabels: { dataLabels: {
enabled: true, enabled: true,

81
hw-ui/src/views/board/warehouse/thirdFloor.vue
Unescape Escape View File

@ -1,10 +1,13 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- <div class="warehouse"></div>--> <!-- <div class="warehouse"></div>-->
<div class="headTitle">京源智能仓储监控平台</div> <div class="headTitle">京源智能仓储监控平台</div>
<div class="wareHouse"> <div class="wareHouse">
<div v-for="i in wareHouseData" class="list" > <div v-for="i in wareHouseData" class="list">
<div class="item" v-for="ii in i" :style="`background-color: ${ii.locationStatus==='1'?'#75f66e':'#999'};color: ${ii.locationStatus==='1'?'#000':'#fff'}`">{{ ii.locationCode }}</div> <div class="item" v-for="ii in i"
:style="`background-color: ${ii.locationStatus== '1'?'#75f66e':'#999'};color: ${ii.locationStatus=='1'?'#000':'#fff'}`"
>{{ ii.locationCode }}
</div>
</div> </div>
</div> </div>
<div v-for="(i,k) in title" <div v-for="(i,k) in title"
@ -96,28 +99,28 @@
<div class="span" style="top: 21.7%; left: 55%; color:#7ba9cb;font-size: 0.9vw">单日出库量</div> <div class="span" style="top: 21.7%; left: 55%; color:#7ba9cb;font-size: 0.9vw">单日出库量</div>
<div class="span" style="top: 21.7%; left: 69.6%; color:#7ba9cb;font-size: 0.9vw">单月入库量</div> <div class="span" style="top: 21.7%; left: 69.6%; color:#7ba9cb;font-size: 0.9vw">单月入库量</div>
<div class="span" style="top: 21.7%; left: 83%; color:#7ba9cb;font-size: 0.9vw">单月出库量</div> <div class="span" style="top: 21.7%; left: 83%; color:#7ba9cb;font-size: 0.9vw">单月出库量</div>
<!-- <div class="span" style="top: 38.7%; left: 42%; color:#7ba9cb;font-size: 0.9vw">仓库1-库位统计</div>--> <!-- <div class="span" style="top: 38.7%; left: 42%; color:#7ba9cb;font-size: 0.9vw">仓库1-库位统计</div>-->
<!-- <div class="span" style="top: 38.7%; left: 87%; color:#7ba9cb;font-size: 0.9vw">仓库2-库位统计</div>--> <!-- <div class="span" style="top: 38.7%; left: 87%; color:#7ba9cb;font-size: 0.9vw">仓库2-库位统计</div>-->
<!-- <div class="span1" style="top: 46.7%; left: 45.5%; color:#7ba9cb;font-size: 0.9vw">空库位</div>--> <!-- <div class="span1" style="top: 46.7%; left: 45.5%; color:#7ba9cb;font-size: 0.9vw">空库位</div>-->
<!-- <div class="span1" style="top: 63%; left: 45.5%; color:#7ba9cb;font-size: 0.9vw">已用库位</div>--> <!-- <div class="span1" style="top: 63%; left: 45.5%; color:#7ba9cb;font-size: 0.9vw">已用库位</div>-->
<!-- <div class="span1" style="top: 46.7%; left: 90.6%; color:#7ba9cb;font-size: 0.9vw">空库位</div>--> <!-- <div class="span1" style="top: 46.7%; left: 90.6%; color:#7ba9cb;font-size: 0.9vw">空库位</div>-->
<!-- <div class="span1" style="top: 63%; left: 90.6%; color:#7ba9cb;font-size: 0.9vw">已用库位</div>--> <!-- <div class="span1" style="top: 63%; left: 90.6%; color:#7ba9cb;font-size: 0.9vw">已用库位</div>-->
<!-- <div class="span" style="top: 50.7%; left: 47%; color:#7ba9cb;font-size: 0.9vw">个</div>--> <!-- <div class="span" style="top: 50.7%; left: 47%; color:#7ba9cb;font-size: 0.9vw">个</div>-->
<!-- <div class="span" style="top: 67.7%; left: 47%; color:#7ba9cb;font-size: 0.9vw">个</div>--> <!-- <div class="span" style="top: 67.7%; left: 47%; color:#7ba9cb;font-size: 0.9vw">个</div>-->
<!-- <div class="span" style="top: 50.7%; left: 92.2%; color:#7ba9cb;font-size: 0.9vw">个</div>--> <!-- <div class="span" style="top: 50.7%; left: 92.2%; color:#7ba9cb;font-size: 0.9vw">个</div>-->
<!-- <div class="span" style="top: 67.7%; left: 92.2%; color:#7ba9cb;font-size: 0.9vw">个</div>--> <!-- <div class="span" style="top: 67.7%; left: 92.2%; color:#7ba9cb;font-size: 0.9vw">个</div>-->
<div class="span" style="top: 87.9%; left: 50.5%; color:#7ba9cb;font-size: 0.9vw">空 库 位：</div> <div class="span" style="top: 87.9%; left: 50.5%; color:#7ba9cb;font-size: 0.9vw">空 库 位：</div>
<div class="span" style="top: 87.9%; left: 70.2%; color:#7ba9cb;font-size: 0.9vw">已用库位：</div> <div class="span" style="top: 87.9%; left: 70.2%; color:#7ba9cb;font-size: 0.9vw">已用库位：</div>
<!-- <div class="span" style="top: 50.6%;right: 53%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>--> <!-- <div class="span" style="top: 50.6%;right: 53%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>-->
<!-- <div class="span" style="top: 67.6%;right: 53%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>--> <!-- <div class="span" style="top: 67.6%;right: 53%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>-->
<!-- <div class="span" style="top: 50.6%;right: 8%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>--> <!-- <div class="span" style="top: 50.6%;right: 8%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>-->
<!-- <div class="span" style="top: 67.6%;right: 8%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>--> <!-- <div class="span" style="top: 67.6%;right: 8%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div>-->
<div class="span" style="top: 88.2%;right: 40%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div> <div class="span" style="top: 88.2%;right: 40%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">{{ locationData.notUse }}</div>
<div class="span" style="top: 88.2%;left: 60%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">个</div> <div class="span" style="top: 88.2%;left: 60%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">个</div>
<div class="span" style="top: 88.2%;left: 62%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">66%</div> <div class="span" style="top: 88.2%;left: 62%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">{{ locationData.notUseRate }}%</div>
<div class="span" style="top: 88.2%;right: 20%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">99</div> <div class="span" style="top: 88.2%;right: 20%; color:#7ba9cb;font-size: 1.5vw;letter-spacing: 3px;">{{ locationData.isUse }}</div>
<div class="span" style="top: 88.2%;left: 80%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">个</div> <div class="span" style="top: 88.2%;left: 80%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">个</div>
<div class="span" style="top: 88.2%;left: 82%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">66%</div> <div class="span" style="top: 88.2%;left: 82%; color:#7ba9cb;font-size: 1vw;letter-spacing: 3px;">{{ locationData.isUseRate }}%</div>
</div> </div>
</template> </template>
@ -143,7 +146,7 @@ export default {
monthRawInAmount: [0, 0, 0, 0], monthRawInAmount: [0, 0, 0, 0],
monthRawOutAmount: [0, 0, 0, 0] monthRawOutAmount: [0, 0, 0, 0]
}, },
wareHouseData:[], wareHouseData: [],
title: [ title: [
'生产计划', '生产计划',
'当前库存统计' '当前库存统计'
@ -168,7 +171,8 @@ export default {
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3 singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
waitTime: 0 waitTime: 0
}, },
scrollTableData: [] scrollTableData: [],
locationData:{}
} }
}, },
mounted() { mounted() {
@ -188,23 +192,32 @@ export default {
}) })
locationStatus().then(e => { locationStatus().then(e => {
console.log(e) console.log(e)
let isUse = e.data.filter(v=> v.containerCode).length
console.log(isUse)
this.locationData = {
isUse:isUse,
notUse:e.data.length - isUse,
isUseRate : ((isUse / e.data.length)*100).toFixed(0),
notUseRate : (((e.data.length - isUse) / e.data.length)*100).toFixed(0)
}
function groupArrayBySize(arr, groupSize) { function groupArrayBySize(arr, groupSize) {
if (!Array.isArray(arr) || typeof groupSize !== 'number' || groupSize <= 0) { if (!Array.isArray(arr) || typeof groupSize !== 'number' || groupSize <= 0) {
throw new Error('Invalid input') throw new Error('Invalid input')
} }
const result = []; const result = []
for (let i = 0; i < arr.length; i += groupSize) { for (let i = 0; i < arr.length; i += groupSize) {
result.push(arr.slice(i, i + groupSize)); result.push(arr.slice(i, i + groupSize))
} }
return result; return result
} }
this.wareHouseData = groupArrayBySize(e.data, 30); this.wareHouseData = groupArrayBySize(e.data, 30)
}) })
productCompleteCount().then(e=>{ productCompleteCount().then(e => {
this.$refs.chart1.setData({ this.$refs.chart1.setData({
grid: { grid: {
@ -230,7 +243,7 @@ export default {
} }
}, },
xAxis: { xAxis: {
data: e.data.map(v => parseTime(v.week,'{m}-{d} {h}:{s}')), data: e.data.map(v => parseTime(v.week, '{m}-{d} {h}:{s}')),
axisLabel: { axisLabel: {
margin: 10, margin: 10,
color: '#ffffff63' color: '#ffffff63'
@ -373,7 +386,6 @@ export default {
}) })
}) })
productPlan().then(e => { productPlan().then(e => {
console.log(e)
this.scrollTableData = e.data.map(v => { this.scrollTableData = e.data.map(v => {
return { return {
taskCode: v.taskCode, taskCode: v.taskCode,
@ -461,7 +473,8 @@ export default {
width: 33.3%; width: 33.3%;
height: 32%; height: 32%;
} }
.wareHouse{
.wareHouse {
position: absolute; position: absolute;
top: 37%; top: 37%;
left: 42.4%; left: 42.4%;
@ -470,11 +483,13 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.list{
.list {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.item{
.item {
display: inline-block; display: inline-block;
width: 2%; width: 2%;
height: 1.5vw; height: 1.5vw;

Write Preview
Loading…
Cancel
Save