|
|
|
|
@ -8,23 +8,23 @@
|
|
|
|
|
<div class="title1">班组</div>
|
|
|
|
|
<div class="title2">上线数量</div>
|
|
|
|
|
|
|
|
|
|
<div class="nowClass">总装</div>
|
|
|
|
|
<div class="num">1122</div>
|
|
|
|
|
<div class="nowClass">{{ info.bz }}</div>
|
|
|
|
|
<div class="num">{{ info.sxsl }}</div>
|
|
|
|
|
|
|
|
|
|
<div class="info1Title">产品条码</div>
|
|
|
|
|
<div class="info1">B23120783055009802101</div>
|
|
|
|
|
<div class="info1">{{ info.tm }}</div>
|
|
|
|
|
<div class="info2Title">扫描时间</div>
|
|
|
|
|
<div class="info2">2023/12/7 12:01:53</div>
|
|
|
|
|
<div class="info2">{{ info.sj }}</div>
|
|
|
|
|
<div class="info3Title">产品型号</div>
|
|
|
|
|
<div class="info3">发泡箱体,BCD-530WPG,标准白</div>
|
|
|
|
|
<div class="info3">{{ info.xh }}</div>
|
|
|
|
|
<div class="info4Title">订单编号</div>
|
|
|
|
|
<div class="info4">11232394</div>
|
|
|
|
|
<div class="info4">{{ info.bh }}</div>
|
|
|
|
|
<div class="info5Title">订单数量</div>
|
|
|
|
|
<div class="info5">300</div>
|
|
|
|
|
<div class="info5">{{ info.ddsl }}</div>
|
|
|
|
|
<div class="info6Title">上线数量</div>
|
|
|
|
|
<div class="info6">63</div>
|
|
|
|
|
<div class="info6">{{ info.sxsl2 }}</div>
|
|
|
|
|
<div class="info7Title">提示信息</div>
|
|
|
|
|
<div class="info7">扫描成功</div>
|
|
|
|
|
<div class="info7">{{ info.tsxx }}</div>
|
|
|
|
|
|
|
|
|
|
<div class="scrollTable">
|
|
|
|
|
<div style="background-color: #094170">
|
|
|
|
|
@ -102,6 +102,7 @@ import vueSeamlessScroll from "vue-seamless-scroll";
|
|
|
|
|
import Chart from "../../../components/board/Chart";
|
|
|
|
|
import * as echarts from 'echarts'
|
|
|
|
|
import {getData} from "@/api/board/getData";
|
|
|
|
|
import {mixData} from "@/api/board/mixData";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
@ -130,6 +131,7 @@ export default {
|
|
|
|
|
left: 5.5
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
info: {},
|
|
|
|
|
scrollTableOption: {
|
|
|
|
|
step: 0.5, // 数值越大速度滚动越快
|
|
|
|
|
limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
|
|
|
|
|
@ -141,162 +143,190 @@ export default {
|
|
|
|
|
waitTime: 0,
|
|
|
|
|
},
|
|
|
|
|
scrollTableData: [],
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
getData().then(e => {
|
|
|
|
|
this.scrollTableData = e.table7
|
|
|
|
|
this.$refs.chart1.setData({
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
axisPointer: {
|
|
|
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
|
|
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
grid: {
|
|
|
|
|
left: "0",
|
|
|
|
|
right: "4%",
|
|
|
|
|
bottom: "0",
|
|
|
|
|
top: 20,
|
|
|
|
|
containLabel: true,
|
|
|
|
|
},
|
|
|
|
|
xAxis: {
|
|
|
|
|
type: "category",
|
|
|
|
|
data: e.chart4.x,
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "white",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
// interval: 0,
|
|
|
|
|
// rotate: 40,
|
|
|
|
|
textStyle: {
|
|
|
|
|
fontFamily: "Microsoft YaHei",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
RequestDataSet: [
|
|
|
|
|
{
|
|
|
|
|
e: 'zzsc-01',
|
|
|
|
|
i: "",
|
|
|
|
|
f: (e) => {
|
|
|
|
|
this.info = e
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
e: 'zzsc-02',
|
|
|
|
|
i: "",
|
|
|
|
|
f: (e) => {
|
|
|
|
|
this.$refs.chart1.setData({
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
axisPointer: {
|
|
|
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
|
|
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
grid: {
|
|
|
|
|
left: "0",
|
|
|
|
|
right: "4%",
|
|
|
|
|
bottom: "0",
|
|
|
|
|
top: 20,
|
|
|
|
|
containLabel: true,
|
|
|
|
|
},
|
|
|
|
|
xAxis: {
|
|
|
|
|
type: "category",
|
|
|
|
|
data: e.x,
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "white",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
// interval: 0,
|
|
|
|
|
// rotate: 40,
|
|
|
|
|
textStyle: {
|
|
|
|
|
fontFamily: "Microsoft YaHei",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
type: "value",
|
|
|
|
|
axisLine: {
|
|
|
|
|
show: false,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "white",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {},
|
|
|
|
|
yAxis: {
|
|
|
|
|
type: "value",
|
|
|
|
|
axisLine: {
|
|
|
|
|
show: false,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "white",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {},
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
name: "数量",
|
|
|
|
|
type: "bar",
|
|
|
|
|
barWidth: "30%",
|
|
|
|
|
barMaxWidth: 50,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
normal: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: "#0bca98",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: "#16a144",
|
|
|
|
|
},
|
|
|
|
|
]),
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
data: e.y.data,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
name: "数量",
|
|
|
|
|
type: "bar",
|
|
|
|
|
barWidth: "30%",
|
|
|
|
|
barMaxWidth: 50,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
normal: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: "#0bca98",
|
|
|
|
|
{
|
|
|
|
|
e: 'zzsc-03',
|
|
|
|
|
i: "",
|
|
|
|
|
f: (e) => {
|
|
|
|
|
this.$refs.chart2.setData({
|
|
|
|
|
grid: {
|
|
|
|
|
left: "0",
|
|
|
|
|
right: "4%",
|
|
|
|
|
bottom: '2%',
|
|
|
|
|
top: "10%",
|
|
|
|
|
containLabel: true,
|
|
|
|
|
},
|
|
|
|
|
xAxis: {
|
|
|
|
|
data: e.x,
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#3d5269",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: "#16a144",
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
interval: 0,
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
yAxis: {
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 16,
|
|
|
|
|
},
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#3d5269",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 10,
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: true,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#2d3d53",
|
|
|
|
|
},
|
|
|
|
|
]),
|
|
|
|
|
},
|
|
|
|
|
interval: 500,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
data: e.chart4.y.data,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
})
|
|
|
|
|
this.$refs.chart2.setData({
|
|
|
|
|
grid: {
|
|
|
|
|
left: "0",
|
|
|
|
|
right: "4%",
|
|
|
|
|
bottom: '2%',
|
|
|
|
|
top: "10%",
|
|
|
|
|
containLabel: true,
|
|
|
|
|
},
|
|
|
|
|
xAxis: {
|
|
|
|
|
data: e.chart3.x,
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#3d5269",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
interval: 0,
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 14,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
yAxis: {
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 16,
|
|
|
|
|
},
|
|
|
|
|
axisLine: {
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#3d5269",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
color: "#fff",
|
|
|
|
|
fontSize: 10,
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: true,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: "#2d3d53",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
interval: 500,
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
type: "bar",
|
|
|
|
|
barWidth: '40%',
|
|
|
|
|
itemStyle: {
|
|
|
|
|
normal: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(
|
|
|
|
|
0,
|
|
|
|
|
0,
|
|
|
|
|
0,
|
|
|
|
|
1,
|
|
|
|
|
[
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: "#5ef3ff",
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
type: "bar",
|
|
|
|
|
barWidth: '40%',
|
|
|
|
|
itemStyle: {
|
|
|
|
|
normal: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(
|
|
|
|
|
0,
|
|
|
|
|
0,
|
|
|
|
|
0,
|
|
|
|
|
1,
|
|
|
|
|
[
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: "#5ef3ff",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: "#06a4f4",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
false
|
|
|
|
|
),
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: "#06a4f4",
|
|
|
|
|
},
|
|
|
|
|
label: {
|
|
|
|
|
normal: {
|
|
|
|
|
show: true,
|
|
|
|
|
fontSize: 12,
|
|
|
|
|
fontWeight: "bold",
|
|
|
|
|
color: "#ffffff",
|
|
|
|
|
position: "top",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
false
|
|
|
|
|
),
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
label: {
|
|
|
|
|
normal: {
|
|
|
|
|
show: true,
|
|
|
|
|
fontSize: 12,
|
|
|
|
|
fontWeight: "bold",
|
|
|
|
|
color: "#ffffff",
|
|
|
|
|
position: "top",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
data: e.chart3.y.data,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
data: e.y.data,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
e: 'zzsc-04',
|
|
|
|
|
i: "",
|
|
|
|
|
f: (e) => {
|
|
|
|
|
this.scrollTableData = e
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.RequestDataSet.forEach(val => {
|
|
|
|
|
mixData(val)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
methods: {}
|
|
|
|
|
@ -447,7 +477,6 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.info3Title {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 13.5%;
|
|
|
|
|
@ -489,7 +518,6 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.info5Title {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 18%;
|
|
|
|
|
|
夜笙歌
9 months ago