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

修改看板

Browse Source
master
夜笙歌 4 months ago
parent fedf9d47dd
commit 68da7e57f4
2 changed files with 199 additions and 318 deletions
Show Stats Download Patch File Download Diff File

1
hw-ui/src/views/board/production/secondFloor.vue
Unescape Escape View File

@ -216,6 +216,7 @@ export default {
this.scrollTableData = e.data.map((v, k) => {
return {
no: k + 1,
materialName:v.materialName,
orderCode: v.orderCode,
planAmount: v.planAmount,
completeAmount: v.completeAmount,

516
hw-ui/src/views/board/warehouse/fourthFloor.vue
Unescape Escape View File

@ -8,12 +8,12 @@
{{ i }}
</div>
<div class="chart1">
<!-- <HighChart key="chart1" ref="chart1"></HighChart>-->
<!-- <HighChart key="chart1" ref="chart1"></HighChart>-->
<Chart key="chart1" ref="chart1"></Chart>
</div>
<!-- <div class="chart2">-->
<!-- <HighChart key="chart2" ref="chart2"></HighChart>-->
<!-- </div>-->
<!-- <div class="chart2">-->
<!-- <HighChart key="chart2" ref="chart2"></HighChart>-->
<!-- </div>-->
<div class="chart3">
<Chart key="chart3" ref="chart3"></Chart>
</div>
@ -160,13 +160,7 @@ import vueSeamlessScroll from 'vue-seamless-scroll'
import Chart from '@/components/board/Chart'
import HighChart from '@/components/board/HighChart'
import * as echarts from 'echarts'
import {
bomInfo,
inAndOutInfo,
productInAndOutInfo,
purchaseInfo,
stockPercentage
} from '@/api/board/fourthFloorWarehouse'
import {} from '@/api/board/fourthFloorWarehouse'
import { parseTime } from '@/utils/ruoyi'
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
@ -237,343 +231,229 @@ export default {
window.onresize = () => {
this.$refs.chart1.resize()
this.$refs.chart2.resize()
this.$refs.chart3.resize()
}
},
methods: {
getData() {
inAndOutInfo().then(e => {
console.log(e)
this.topData.num1= [...[0, 0, 0, 0], ...(e.data.inStocks.find(v=>v.warehouseId===111)?.outstockAmount || 0).toString().split('')].slice(-4)
this.topData.num2= [...[0, 0, 0, 0], ...(e.data.rawOutstocks?.find(v=>v.warehouseId===111)?.outstockAmount || 0).toString().split('')].slice(-4)
this.topData.num3= [...[0, 0, 0, 0], ...(e.data.inStocks.find(v=>v.warehouseId===131)?.outstockAmount || 0).toString().split('')].slice(-4)
})
stockPercentage().then(e => {
let num1 = e.data.nostockAmount + e.data.stockAmount
let num2 = e.data.stockAmount
let num2_1
let num3 = e.data.nostockAmount
let num3_1
if (num1 === 0) {
num2_1 = 50
num3_1 = 50
} else {
num2_1 = parseFloat(((num2 / num1) * 100).toFixed(2))
num3_1 = parseFloat(((num3 / num1) * 100).toFixed(2))
let e = {
data: {
'rawInstockAmount': 28,
'rawOutstockAmount': 14,
'productInstockAmount': 8
}
this.$refs.chart1.setData({
tooltip: {
trigger: 'item'
},
grid: {
borderWidth: 0,
top: '10%',
left: '10%',
right: '10%',
bottom: '10%'
}
this.topData.num1 = [...[0, 0, 0, 0], ...(e.data.rawInstockAmount || 0).toString().split('')].slice(-4)
this.topData.num2 = [...[0, 0, 0, 0], ...(e.data.rawOutstockAmount || 0).toString().split('')].slice(-4)
this.topData.num3 = [...[0, 0, 0, 0], ...(e.data.productInstockAmount || 0).toString().split('')].slice(-4)
this.$refs.chart1.setData({
tooltip: {
trigger: 'item'
},
grid: {
borderWidth: 0,
top: '10%',
left: '10%',
right: '10%',
bottom: '10%'
},
yAxis: {
type: 'category',
axisLabel: {
margin: 10,
color: '#ffffff63'
},
yAxis: {
type: 'category',
axisLabel: {
margin: 10,
color: '#ffffff63'
},
axisTick: {
show: true,
lineStyle: {
color: '#ffffff1f'
}
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#ffffff1f'
}
},
axisLine: {
lineStyle: {
color: '#fff3',
width: 2
}
},
data: [1,2,3]
},
xAxis: {
type: 'value',
axisLabel: {
margin: 10,
color: '#ffffff63'
},
axisLine: {
show: false
},
axisTick: {
show: true,
lineStyle: {
color: '#ffffff1f'
}
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#ffffff1f'
}
axisTick: {
show: true,
lineStyle: {
color: '#ffffff1f'
}
},
series: [
{
name: '',
type: 'bar',
barMaxWidth: '40px',
barWidth: '40%',
itemStyle: {
color: new echarts.graphic.LinearGradient(
0,
0,
1,
0,
[
{
offset: 0,
color: '#0a2ad7'
},
{
offset: 1,
color: '#138dd7'
}
],
false
)
},
data:[11,22,3]
},
{
name: '',
type: 'pictorialBar',
barWidth: '40%',
barMaxWidth: '40px',
symbolSize: [5, '100%'],
symbolPosition: 'end',
symbolOffset: [3, 0],
barGap: '-100%',
itemStyle: {
color: '#138dd7'
},
data:[11,22,3]
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#ffffff1f'
}
]
})
let num11 = e.data.noProductstockAmount + e.data.productstockAmount
let num12 = e.data.productstockAmount
let num12_1
let num13 = e.data.noProductstockAmount
let num13_1
if (num11 === 0) {
num12_1 = 50
num13_1 = 50
} else {
num12_1 = parseFloat(((num12 / num11) * 100).toFixed(2))
num13_1 = parseFloat(((num13 / num11) * 100).toFixed(2))
}
this.$refs.chart2.setData({
title: {
text: '成品库存占比',
style: {
color: '#fff'
},
axisLine: {
lineStyle: {
color: '#fff3',
width: 2
}
},
credits: {
enabled: false
data: [1, 2, 3]
},
xAxis: {
type: 'value',
axisLabel: {
margin: 10,
color: '#ffffff63'
},
chart: {
type: 'pie',
startAngle: Math.PI / 6,
animation: false,
backgroundColor: null,
events: {
load: function() {
let each = Highcharts.each,
points = this.series[0].points
each(points, function(p, i) {
p.graphic.attr({
translateY: -p.shapeArgs.ran
})
p.graphic.side1.attr({
translateY: -p.shapeArgs.ran
})
p.graphic.side2.attr({
translateY: -p.shapeArgs.ran
})
})
}
},
options3d: {
enabled: true,
alpha: 60,
beta: 0
}
axisLine: {
show: false
},
legend: {
reversed: true,
itemStyle: {
color: '#fff'
axisTick: {
show: true,
lineStyle: {
color: '#ffffff1f'
}
},
plotOptions: {
pie: {
allowPointSelect: false,
cursor: 'pointer',
depth: 35,
startAngle: 45,
size: 200,
dataLabels: {
enabled: true,
formatter: function() {
return this.point.options.name + '<br>' + this.point.options.h + '%'
}
},
showInLegend: false,
point: {
events: {
legendItemClick: function(e) {
return false // 直接 return false 即可禁用图例点击事件
}
}
}
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#ffffff1f'
}
}
},
series: [
{
name: '',
type: 'bar',
barMaxWidth: '40px',
barWidth: '40%',
itemStyle: {
color: new echarts.graphic.LinearGradient(
0,
0,
1,
0,
[
{
offset: 0,
color: '#0a2ad7'
},
{
offset: 1,
color: '#138dd7'
}
],
false
)
},
data: [11, 22, 3]
},
series: [
{
type: 'pie',
name: '占比',
data: [
{
'name': '已使用',
y: num12_1,
h: num12_1
},
{
name: '未使用',
y: num12_1,
h: num12_1
}
].sort((a, b) => a.y - b.y)
}]
})
})
purchaseInfo().then(e => {
this.scrollTableData = e.data
})
bomInfo().then(e => {
this.scrollTableData1 = e.data
{
name: '',
type: 'pictorialBar',
barWidth: '40%',
barMaxWidth: '40px',
symbolSize: [5, '100%'],
symbolPosition: 'end',
symbolOffset: [3, 0],
barGap: '-100%',
itemStyle: {
color: '#138dd7'
},
data: [11, 22, 3]
}
]
})
productInAndOutInfo().then(e => {
this.$refs.chart3.setData({
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
this.scrollTableData = []
this.scrollTableData1 = []
this.$refs.chart3.setData({
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
grid: {
left: '2%',
right: '4%',
bottom: '14%',
top: '16%',
containLabel: true
},
legend: {
x: 'center',
top: 12,
textStyle: {
color: '#fff'
},
grid: {
left: '2%',
right: '4%',
bottom: '14%',
top: '16%',
containLabel: true
itemWidth: 12,
itemHeight: 10
// itemGap: 35
},
xAxis: {
type: 'category',
data: e.data.map(v => parseTime(v.day, '{m}-{d}')),
axisLine: {
lineStyle: {
color: 'white'
}
},
legend: {
x: 'center',
top: 12,
axisLabel: {
// interval: 0,
// rotate: 40,
textStyle: {
color: '#fff'
},
itemWidth: 12,
itemHeight: 10
// itemGap: 35
fontFamily: 'Microsoft YaHei'
}
}
},
yAxis: {
type: 'value',
axisLine: {
show: false,
lineStyle: {
color: 'white'
}
},
xAxis: {
type: 'category',
data: e.data.map(v => parseTime(v.day, '{m}-{d}')),
axisLine: {
lineStyle: {
color: 'white'
}
},
axisLabel: {
// interval: 0,
// rotate: 40,
textStyle: {
fontFamily: 'Microsoft YaHei'
}
splitLine: {
show: true,
lineStyle: {
color: 'rgba(255,255,255,0.3)'
}
},
yAxis: {
type: 'value',
axisLine: {
show: false,
lineStyle: {
color: 'white'
}
},
splitLine: {
show: true,
lineStyle: {
color: 'rgba(255,255,255,0.3)'
axisLabel: {}
},
series: [
{
name: '入库',
type: 'bar',
barWidth: '15%',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#fccb05'
},
{
offset: 1,
color: '#f5804d'
}
])
}
},
axisLabel: {}
data: e.data.map(v => v.instockAmount)
},
series: [
{
name: '入库',
type: 'bar',
barWidth: '15%',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#fccb05'
},
{
offset: 1,
color: '#f5804d'
}
])
}
},
data: e.data.map(v => v.instockAmount)
{
name: '出库',
type: 'bar',
barWidth: '15%',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#8bd46e'
},
{
offset: 1,
color: '#09bcb7'
}
])
}
},
{
name: '出库',
type: 'bar',
barWidth: '15%',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#8bd46e'
},
{
offset: 1,
color: '#09bcb7'
}
])
}
},
data: e.data.map(v => v.outStockAmount)
}
]
})
data: e.data.map(v => v.outStockAmount)
}
]
})
}
}

Write Preview
Loading…
Cancel
Save