yinq
/
aucma-mes-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改路由

Browse Source
master
夜笙歌 11 months ago
parent 4f3098b9c1
commit 3d19ecb41a
9 changed files with 2084 additions and 1275 deletions
Show Stats Download Patch File Download Diff File

42
public/data.json
Unescape Escape View File

@ -353,6 +353,48 @@
"value17": "100", "value17": "100",
"value18": "100", "value18": "100",
"value19": "100" "value19": "100"
},
{
"value1": "11",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
},
{
"value1": "12",
"value2": "A-06",
"value3": "生产中",
"value4": "1000",
"value5": "1000%",
"value6": "100%",
"value7": "100",
"value8": "100",
"value9": "100",
"value10": "100",
"value11": "100",
"value12": "100",
"value13": "100",
"value14": "100",
"value15": "100",
"value16": "100",
"value17": "100",
"value18": "100",
"value19": "100"
} }
], ],
"table31": [ "table31": [

8
src/api/board/getData.js
Unescape Escape View File

@ -16,3 +16,11 @@ export function generalInterfaceList(query) {
data: query data: query
}) })
} }
export function getSimulateData(query) {
return request({
url: '/base/customData/list',
method: 'get',
params: {customType: 1, ...query}
})
}

7
src/api/board/liner.js
Unescape Escape View File

@ -1,7 +0,0 @@
import request from '@/utils/request'

24
src/api/board/mixData.js
Unescape Escape View File

@ -0,0 +1,24 @@
import {generalInterfaceList, getSimulateData} from '@/api/board/getData'
export function mixData(params) {
getSimulateData({customCode: params?.e || ''}).then(val => {
if (val.rows.length > 0 && val.rows[0].isFlag === 0) {
let data = JSON.parse(val.rows[0].customData);
(params?.f || (() => {
}))(data)
} else {
generalInterfaceList({
method: params?.i || ''
}).then(val2 => {
(params?.f || (() => {
}))(val2)
})
}
})
}

3
src/store/modules/permission.js
Unescape Escape View File

@ -40,8 +40,6 @@ const permission = {
const rdata = JSON.parse(JSON.stringify(res.data)) const rdata = JSON.parse(JSON.stringify(res.data))
const sidebarRoutes = filterAsyncRouter(sdata) const sidebarRoutes = filterAsyncRouter(sdata)
const rewriteRoutes = filterAsyncRouter(rdata, false, true) const rewriteRoutes = filterAsyncRouter(rdata, false, true)
console.log('sidebarRoutes',sidebarRoutes)
console.log('rewriteRoutes',rewriteRoutes)
const asyncRoutes = filterDynamicRoutes(dynamicRoutes); const asyncRoutes = filterDynamicRoutes(dynamicRoutes);
rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true }) rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true })
router.addRoutes(asyncRoutes); router.addRoutes(asyncRoutes);
@ -88,7 +86,6 @@ function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
} }
return true return true
}) })
console.log('data',data)
return data return data
} }

2
src/views/base/customData/boardIndex.vue
Unescape Escape View File

@ -138,7 +138,7 @@
<el-input v-model="form.customFunction" placeholder="请输入自定义功能" :disabled="editDisabled"/> <el-input v-model="form.customFunction" placeholder="请输入自定义功能" :disabled="editDisabled"/>
</el-form-item> </el-form-item>
<el-form-item label="自定义编号" prop="customCode"> <el-form-item label="自定义编号" prop="customCode">
<el-input v-model="form.customCode" placeholder="请输入自定义编号" :disabled="editDisabled"/> <el-input v-model="form.customCode" placeholder="请输入自定义编号" />
</el-form-item> </el-form-item>
<el-form-item label="自定义数据" prop="customData"> <el-form-item label="自定义数据" prop="customData">
<el-input v-model="form.customData" type="textarea" placeholder="请输入内容"/> <el-input v-model="form.customData" type="textarea" placeholder="请输入内容"/>

163
src/views/board/caseShell/index2.vue
Unescape Escape View File

@ -4,7 +4,7 @@
<div class="topNum team">{{ team }}</div> <div class="topNum team">{{ team }}</div>
<div class="topNum planNum">{{ planNum }}</div> <div class="topNum planNum">{{ planNum }}</div>
<div class="topNum practicalNum">{{ practicalNum }}</div> <div class="topNum practicalNum">{{ practicalNum }}</div>
<div class="topNum differenceValue">{{ differenceValue }}</div> <div class="topNum differenceValue">{{ practicalNum - planNum }}</div>
<div class="title" v-for="(i, k) in title" <div class="title" v-for="(i, k) in title"
:style="'top:' + (titlePosition[k] && titlePosition[k].top || 0) + '%;left:' + (titlePosition[k] && titlePosition[k].left || 0) + '%'"> :style="'top:' + (titlePosition[k] && titlePosition[k].top || 0) + '%;left:' + (titlePosition[k] && titlePosition[k].left || 0) + '%'">
{{ i }} {{ i }}
@ -81,6 +81,9 @@ import vueSeamlessScroll from "vue-seamless-scroll";
import Chart from "../../../components/board/Chart"; import Chart from "../../../components/board/Chart";
import * as echarts from 'echarts' import * as echarts from 'echarts'
import {getData} from "@/api/board/getData"; import {getData} from "@/api/board/getData";
import {mixData} from "@/api/board/mixData";
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default { export default {
components: { components: {
@ -90,11 +93,11 @@ export default {
name: "Liner", name: "Liner",
data() { data() {
return { return {
linerNum: 50, linerNum: 0,
caseNum: 44, caseNum: 0,
meter: 30, meter: 0,
frontNum: 100, frontNum: 0,
laterNum: 100, laterNum: 0,
title: [ title: [
'生产计划', '生产计划',
'小时产量统计', '小时产量统计',
@ -124,10 +127,9 @@ export default {
left: 68.5 left: 68.5
}, },
], ],
team: '白班', team: '',
planNum: 1000, planNum: 0,
practicalNum: 1000, practicalNum: 0,
differenceValue: 1000,
scrollTableOption: { scrollTableOption: {
step: 0.5, // 数值越大速度滚动越快 step: 0.5, // 数值越大速度滚动越快
limitMoveNum: 9999999999999, // 开始无缝滚动的数据量 this.dataList.length limitMoveNum: 9999999999999, // 开始无缝滚动的数据量 this.dataList.length
@ -139,13 +141,39 @@ export default {
waitTime: 0, waitTime: 0,
}, },
scrollTableData: [], scrollTableData: [],
RequestDataSet: [
{
e: 'xkqhb-01',
i: "",
f: (e) => {
this.team = e
} }
}, },
mounted() { {
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 e: 'xkqhb-02',
getData().then(e => { i: "",
this.scrollTableData = e.caseShell2.table1 f: (e) => {
this.planNum = e
}
},
{
e: 'xkqhb-03',
i: "",
f: (e) => {
this.practicalNum = e
}
},
{
e: 'xkqhb-04',
i: "",
f: (e) => {
this.scrollTableData = e
}
},
{
e: 'xkqhb-05',
i: "",
f: (e) => {
this.$refs.chart1.setData({ this.$refs.chart1.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -162,7 +190,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.caseShell2.ImportAndExportStatistics.y.map(val => val.name), data: e.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -174,7 +202,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.caseShell2.ImportAndExportStatistics.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -204,7 +232,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.caseShell2.ImportAndExportStatistics.y[0].name, name: e.y[0].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -234,10 +262,10 @@ export default {
]), ]),
}, },
}, },
data: e.caseShell2.ImportAndExportStatistics.y[0].data, data: e.y[0].data,
}, },
{ {
name: e.caseShell2.ImportAndExportStatistics.y[1].name, name: e.y[1].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -267,10 +295,23 @@ export default {
]), ]),
}, },
}, },
data: e.caseShell2.ImportAndExportStatistics.y[1].data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'xkqhb-06',
i: "",
f: (e) => {
this.meter = e
}
},
{
e: 'xkqhb-07',
i: "SCADA_INV_STATS_01('')",
f: (e) => {
this.$refs.chart2.setData({ this.$refs.chart2.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -287,7 +328,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.chart2.y.map(val => val.name), data: e.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -299,7 +340,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.chart2.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -329,7 +370,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.chart2.y[0].name, name: e.y[0].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -359,10 +400,10 @@ export default {
]), ]),
}, },
}, },
data: e.chart2.y[0].data, data: e.y[0].data,
}, },
{ {
name: e.chart2.y[1].name, name: e.y[1].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -392,10 +433,30 @@ export default {
]), ]),
}, },
}, },
data: e.chart2.y[1].data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'xkqhb-08',
i: "",
f: (e) => {
this.linerNum = e
}
},
{
e: 'xkqhb-09',
i: "",
f: (e) => {
this.caseNum = e
}
},
{
e: 'xkqhb-10',
i: "",
f: (e) => {
this.$refs.chart3.setData({ this.$refs.chart3.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -412,7 +473,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.caseShell2.chart2.y.map(val => val.name), data: e.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -424,7 +485,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.caseShell2.chart2.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -454,7 +515,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.caseShell2.chart2.y[0].name, name: e.y[0].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -484,10 +545,10 @@ export default {
]), ]),
}, },
}, },
data: e.caseShell2.chart2.y[0].data, data: e.y[0].data,
}, },
{ {
name: e.caseShell2.chart2.y[1].name, name: e.y[1].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -517,10 +578,30 @@ export default {
]), ]),
}, },
}, },
data: e.caseShell2.chart2.y[1].data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'xkqhb-11',
i: "",
f: (e) => {
this.frontNum = e
}
},
{
e: 'xkqhb-12',
i: "",
f: (e) => {
this.laterNum = e
}
},
{
e: 'xkqhb-13',
i: "",
f: (e) => {
this.$refs.chart4.setData({ this.$refs.chart4.setData({
legend: { legend: {
data: ['运行中夹具数量'], data: ['运行中夹具数量'],
@ -549,7 +630,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.liner.foamFixtureState.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -579,7 +660,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.liner.foamFixtureState.y.name, name: e.y.name,
type: "bar", type: "bar",
barWidth: '30%', barWidth: '30%',
barMaxWidth: 50, barMaxWidth: 50,
@ -609,10 +690,20 @@ export default {
]), ]),
}, },
}, },
data: e.liner.foamFixtureState.y.data, data: e.y.data,
} }
] ]
}) })
this.laterNum = e
}
},
]
}
},
mounted() {
this.RequestDataSet.forEach(val => {
mixData(val)
}) })
}, },
methods: {} methods: {}

804
src/views/board/foaming/index.vue
Unescape Escape View File

@ -1,9 +1,16 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="headTitle">箱体发泡生产数据监控平台</div> <div class="headTitle">箱体发泡生产数据监控平台</div>
<div class="topNum planNum">{{ planNum }}</div> <div class="topNum planNum">{{
<div class="topNum practicalNum">{{ practicalNum }}</div> planNum.toString().split('').concat(['0', '0', '0', '0']).slice(0, 4).join('')
<div class="topNum differenceValue">{{ differenceValue }}</div> }}
</div>
<div class="topNum practicalNum">
{{ practicalNum.toString().split('').concat(['0', '0', '0', '0']).slice(0, 4).join('') }}
</div>
<div class="topNum differenceValue">
{{ (practicalNum - planNum).toString().split('').concat(['0', '0', '0', '0']).slice(0, 4).join('') }}
</div>
<div class="title" v-for="(i,k) in title" <div class="title" v-for="(i,k) in title"
:style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"> :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'">
{{ i }} {{ i }}
@ -461,6 +468,7 @@ import vueSeamlessScroll from "vue-seamless-scroll";
import Chart from "../../../components/board/Chart"; import Chart from "../../../components/board/Chart";
import * as echarts from 'echarts' import * as echarts from 'echarts'
import {getData} from "@/api/board/getData"; import {getData} from "@/api/board/getData";
import {mixData} from "@/api/board/mixData";
export default { export default {
components: { components: {
@ -471,9 +479,8 @@ export default {
data() { data() {
return { return {
show: true, show: true,
planNum: 1000, planNum: 0,
practicalNum: 1000, practicalNum: 0,
differenceValue: 1000,
title: [ title: [
'生产计划', '生产计划',
'生产统计', '生产统计',
@ -521,17 +528,34 @@ export default {
scrollTableData: [], scrollTableData: [],
scrollTableData1: [], scrollTableData1: [],
scrollTableData2: [], scrollTableData2: [],
RequestDataSet: [
{
e: 'fp-1-01',
i: "",
f: (e) => {
this.planNum = e
} }
}, },
mounted() { {
let timeInter = setInterval(() => { e: 'fp-1-02',
this.show = !this.show i: "",
}, 30 * 1000) f: (e) => {
getData().then(e => { this.practicalNum = e
this.scrollTableData = e.table2 }
this.scrollTableData1 = e.table3.slice(0,6) },
this.scrollTableData2 = e.table32.slice(0,6) {
this.$refs.chart1.setData({ e: 'fp-1-03',
i: "",
f: (e) => {
this.scrollTableData = e
}
},
{
e: 'fp-1-04',
i: "",
f: (e) => {
this.$refs.chart2.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
axisPointer: { axisPointer: {
@ -542,31 +566,20 @@ export default {
grid: { grid: {
left: "0", left: "0",
right: "4%", right: "4%",
bottom: "0", bottom: 0,
top: 35, top: 20,
containLabel: true, containLabel: true,
}, },
legend: {
data: e.chart5.y.map(val => val.name),
right: 'center',
top: 0,
textStyle: {
color: "#fff",
},
itemWidth: 12,
itemHeight: 10,
// itemGap: 35
},
xAxis: { xAxis: {
type: "category", type: "category",
data: e.chart5.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
}, },
}, },
axisLabel: { axisLabel: {
// interval: 0, interval: 0,
// rotate: 40, // rotate: 40,
textStyle: { textStyle: {
fontFamily: "Microsoft YaHei", fontFamily: "Microsoft YaHei",
@ -589,38 +602,9 @@ export default {
}, },
series: [ series: [
{ {
name: e.chart5.y[0].name, name: e.y.name,
type: "bar",
barWidth: "30%",
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#39ffff",
},
{
offset: 1,
color: "#f5804d",
},
]),
borderRadius: 2,
},
},
data: e.chart5.y[0].data,
},
{
name: e.chart5.y[1].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "40%",
barGap: '40%',
label: { label: {
show: true, show: true,
position: "top", position: "top",
@ -640,14 +624,30 @@ export default {
color: "#3e8aff", color: "#3e8aff",
}, },
]), ]),
borderRadius: 2, borderRadius: 3,
}, },
}, },
data: e.chart5.y[1].data, data: e.y.data,
}, },
], ],
}) })
this.$refs.chart2.setData({ }
},
{
e: 'fp-1-05',
i: "SCADA_INV_STATS_01('')",
f: (e) => {
getData().then(val => {
this.scrollTableData1 = val.table3.slice(0, 6)
this.scrollTableData2 = val.table3.slice(6, 12)
})
}
},
{
e: 'fp-1-06',
i: "",
f: (e) => {
this.$refs.chart1.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
axisPointer: { axisPointer: {
@ -658,20 +658,31 @@ export default {
grid: { grid: {
left: "0", left: "0",
right: "4%", right: "4%",
bottom: 0, bottom: "0",
top: 20, top: 35,
containLabel: true, containLabel: true,
}, },
legend: {
data: e.y.map(val => val.name),
right: 'center',
top: 0,
textStyle: {
color: "#fff",
},
itemWidth: 12,
itemHeight: 10,
// itemGap: 35
},
xAxis: { xAxis: {
type: "category", type: "category",
data: e.chart3.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
}, },
}, },
axisLabel: { axisLabel: {
interval: 0, // interval: 0,
// rotate: 40, // rotate: 40,
textStyle: { textStyle: {
fontFamily: "Microsoft YaHei", fontFamily: "Microsoft YaHei",
@ -694,9 +705,38 @@ export default {
}, },
series: [ series: [
{ {
name: e.chart3.y.name, name: e.y[0].name,
type: "bar", type: "bar",
barWidth: "40%", barWidth: "30%",
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#39ffff",
},
{
offset: 1,
color: "#f5804d",
},
]),
borderRadius: 2,
},
},
data: e.y[0].data,
},
{
name: e.y[1].name,
type: "bar",
barWidth: "30%",
barGap: '40%',
label: { label: {
show: true, show: true,
position: "top", position: "top",
@ -716,16 +756,22 @@ export default {
color: "#3e8aff", color: "#3e8aff",
}, },
]), ]),
borderRadius: 3, borderRadius: 2,
}, },
}, },
data: e.chart3.y.data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'fp-1-07',
i: "",
f: (e) => {
this.$refs.chart3.setData({ this.$refs.chart3.setData({
legend: { legend: {
data: e.chart6.y.map(val => val.name), data: e.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -792,7 +838,7 @@ export default {
show: false, show: false,
}, },
boundaryGap: false, boundaryGap: false,
data: e.chart6.x, data: e.x,
}, },
], ],
@ -825,7 +871,7 @@ export default {
], ],
series: [ series: [
{ {
name: e.chart6.y[0].name, name: e.y[0].name,
type: "line", type: "line",
showAllSymbol: true, showAllSymbol: true,
symbol: "circle", symbol: "circle",
@ -868,10 +914,10 @@ export default {
shadowBlur: 20, shadowBlur: 20,
}, },
}, },
data: e.chart6.y[0].data, data: e.y[0].data,
}, },
{ {
name: e.chart6.y[1].name, name: e.y[1].name,
type: "line", type: "line",
// smooth: true, //是否平滑 // smooth: true, //是否平滑
showAllSymbol: true, showAllSymbol: true,
@ -917,10 +963,16 @@ export default {
shadowBlur: 20, shadowBlur: 20,
}, },
}, },
data: e.chart6.y[1].data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'fp-1-08',
i: "",
f: (e) => {
this.$refs.chart4.setData({ this.$refs.chart4.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -938,7 +990,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.chart3.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -968,7 +1020,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.chart3.y.name, name: e.y.name,
type: "bar", type: "bar",
barWidth: "33%", barWidth: "33%",
label: { label: {
@ -993,34 +1045,582 @@ export default {
borderRadius: 2, borderRadius: 2,
}, },
}, },
data: e.chart3.y.data, data: e.y.data,
}, },
], ],
}) })
}) }
}, },
methods: {} ],
}; RequestDataSet1: [
</script> {
<style scoped> e: 'fp-2-01',
.title { i: "",
position: absolute; f: (e) => {
transform: translateY(-50%); this.planNum = e
color: #dddddd;
font-size: 1vw;
letter-spacing: 2px;
} }
.foamingMachine{ },
background-image: url("../../../assets/board/foamingMachine.png"); {
background-repeat: no-repeat; e: 'fp-2-02',
background-size: 100% 100%; i: "",
position: absolute; f: (e) => {
transform: translateX(-50%); this.practicalNum = e
top: 35%; }
left: 50%; },
width: 36vw; {
height: 12vw; e: 'fp-2-03',
i: "",
f: (e) => {
this.scrollTableData = e
}
},
{
e: 'fp-2-04',
i: "",
f: (e) => {
this.$refs.chart2.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: {},
},
series: [
{
name: e.y.name,
type: "bar",
barWidth: "40%",
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#47cbfd",
},
{
offset: 1,
color: "#3e8aff",
},
]),
borderRadius: 3,
},
},
data: e.y.data,
},
],
})
} }
},
{
e: 'fp-2-05',
i: "SCADA_INV_STATS_01('')",
f: (e) => {
getData().then(val => {
this.scrollTableData1 = val.table3.slice(0, 6)
this.scrollTableData2 = val.table3.slice(6, 12)
})
}
},
{
e: 'fp-2-06',
i: "",
f: (e) => {
this.$refs.chart1.setData({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
grid: {
left: "0",
right: "4%",
bottom: "0",
top: 35,
containLabel: true,
},
legend: {
data: e.y.map(val => val.name),
right: 'center',
top: 0,
textStyle: {
color: "#fff",
},
itemWidth: 12,
itemHeight: 10,
// itemGap: 35
},
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: {},
},
series: [
{
name: e.y[0].name,
type: "bar",
barWidth: "30%",
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#39ffff",
},
{
offset: 1,
color: "#f5804d",
},
]),
borderRadius: 2,
},
},
data: e.y[0].data,
},
{
name: e.y[1].name,
type: "bar",
barWidth: "30%",
barGap: '40%',
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#47cbfd",
},
{
offset: 1,
color: "#3e8aff",
},
]),
borderRadius: 2,
},
},
data: e.y[1].data,
},
],
})
}
},
{
e: 'fp-2-07',
i: "",
f: (e) => {
this.$refs.chart3.setData({
legend: {
data: e.y.map(val => val.name),
right: 'center',
top: 0,
textStyle: {
color: "#fff",
},
itemWidth: 12,
itemHeight: 10,
// itemGap: 35
},
tooltip: {
trigger: "axis",
axisPointer: {
lineStyle: {
color: {
type: "linear",
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: "rgba(0, 255, 233,0)",
},
{
offset: 0.5,
color: "rgba(255, 255, 255,1)",
},
{
offset: 1,
color: "rgba(0, 255, 233,0)",
},
],
global: false,
},
},
},
},
grid: {
top: "15%",
left: 40,
right: "5%",
bottom: "15%",
// containLabel: true
},
xAxis: [
{
show: false,
type: "category",
axisLine: {
show: true,
},
splitArea: {
// show: true,
color: "#f00",
lineStyle: {
color: "#f00",
},
},
axisLabel: {
color: "#fff",
},
splitLine: {
show: false,
},
boundaryGap: false,
data: e.x,
},
],
yAxis: [
{
type: "value",
min: 18,
max: 24,
splitNumber: 4,
splitLine: {
show: true,
lineStyle: {
color: "rgba(255,255,255,0.1)",
},
},
axisLine: {
show: true,
},
axisLabel: {
show: true,
margin: 20,
textStyle: {
color: "#d1e6eb",
},
},
axisTick: {
show: true,
},
},
],
series: [
{
name: e.y[0].name,
type: "line",
showAllSymbol: true,
symbol: "circle",
symbolSize: 5,
lineStyle: {
normal: {
color: "#49d9ff",
},
},
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
color: "#49d9ff",
},
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "rgba(108,80,243,0.3)",
},
{
offset: 1,
color: "rgba(108,80,243,0)",
},
],
false
),
shadowColor: "rgba(108,80,243, 0.9)",
shadowBlur: 20,
},
},
data: e.y[0].data,
},
{
name: e.y[1].name,
type: "line",
// smooth: true, //是否平滑
showAllSymbol: true,
// symbol: 'image://./static/images/guang-circle.png',
symbol: "circle",
symbolSize: 5,
lineStyle: {
normal: {
color: "#668e84",
},
},
label: {
show: true,
position: "top",
textStyle: {
color: "#668e84",
},
},
itemStyle: {
color: "#00ca95",
},
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "rgba(0,202,149,0.3)",
},
{
offset: 1,
color: "rgba(0,202,149,0)",
},
],
false
),
shadowColor: "rgba(0,202,149, 0.9)",
shadowBlur: 20,
},
},
data: e.y[1].data,
},
],
})
}
},
{
e: 'fp-2-08',
i: "",
f: (e) => {
this.$refs.chart4.setData({
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
},
},
grid: {
left: "0",
right: "4%",
bottom: "0",
top: "10%",
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: {},
},
series: [
{
name: e.y.name,
type: "bar",
barWidth: "33%",
label: {
show: true,
position: "top",
textStyle: {
color: "#49d9ff",
},
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "#39ffff",
},
{
offset: 1,
color: "#f5804d",
},
]),
borderRadius: 2,
},
},
data: e.y.data,
},
],
})
}
},
],
}
},
mounted() {
let timeInter = setInterval(() => {
this.show = !this.show
}, 30 * 1000)
console.log(this.$route.query.id)
if (this.$route.query.id === '1') {
this.RequestDataSet.forEach(val => {
mixData(val)
})
} else if (this.$route.query.id === '2') {
this.RequestDataSet1.forEach(val => {
mixData(val)
})
} else {
this.RequestDataSet.forEach(val => {
mixData(val)
})
}
},
methods: {}
};
</script>
<style scoped>
.title {
position: absolute;
transform: translateY(-50%);
color: #dddddd;
font-size: 1vw;
letter-spacing: 2px;
}
.foamingMachine {
background-image: url("../../../assets/board/foamingMachine.png");
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
transform: translateX(-50%);
top: 35%;
left: 50%;
width: 36vw;
height: 12vw;
}
.app-container { .app-container {
background-image: url("../../../assets/board/foaming1.jpg"); background-image: url("../../../assets/board/foaming1.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;

160
src/views/board/liner/index.vue
Unescape Escape View File

@ -4,7 +4,7 @@
<div class="topNum team">{{ team }}</div> <div class="topNum team">{{ team }}</div>
<div class="topNum planNum">{{ planNum }}</div> <div class="topNum planNum">{{ planNum }}</div>
<div class="topNum practicalNum">{{ practicalNum }}</div> <div class="topNum practicalNum">{{ practicalNum }}</div>
<div class="topNum differenceValue">{{ differenceValue }}</div> <div class="topNum differenceValue">{{ practicalNum - planNum }}</div>
<div class="title" v-for="(i,k) in title" <div class="title" v-for="(i,k) in title"
:style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"> :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'">
{{ i }} {{ i }}
@ -93,7 +93,10 @@
import vueSeamlessScroll from "vue-seamless-scroll"; import vueSeamlessScroll from "vue-seamless-scroll";
import Chart from "../../../components/board/Chart"; import Chart from "../../../components/board/Chart";
import * as echarts from 'echarts' import * as echarts from 'echarts'
import {getData, generalInterfaceList} from '@/api/board/getData' import {getData, generalInterfaceList, getSimulateData} from '@/api/board/getData'
import {mixData} from '@/api/board/mixData'
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
export default { export default {
components: { components: {
@ -110,9 +113,9 @@ export default {
'泡前库存统计', '泡前库存统计',
'箱体发泡实时状态', '箱体发泡实时状态',
], ],
meter: 30, meter: 0,
linerNum: 50, linerNum: 0,
caseNum: 44, caseNum: 0,
titlePosition: [ titlePosition: [
{ {
top: 19.8, top: 19.8,
@ -135,10 +138,9 @@ export default {
left: 68.5 left: 68.5
}, },
], ],
team: '白班', team: '',
planNum: 1000, planNum: 0,
practicalNum: 1000, practicalNum: 0,
differenceValue: 1000,
scrollTableOption: { scrollTableOption: {
step: 0.5, step: 0.5,
limitMoveNum: 9999999999, limitMoveNum: 9999999999,
@ -150,38 +152,40 @@ export default {
waitTime: 0, waitTime: 0,
}, },
scrollTableData: [], scrollTableData: [],
RequestDataSet: [
{
e: 'nd-01',
i: "",
f: (e) => {
this.team = e
} }
}, },
mounted() { {
const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 e: 'nd-02',
generalInterfaceList({ i: "",
"method": "SCADA_INV_STATS_01('')" f: (e) => {
}).then(e => { this.planNum = e
console.log(e) }
}) },
generalInterfaceList({ {
"method": "SCADA_INV_STATS_SUM('')" e: 'nd-03',
}).then(e => { i: "",
console.log(e) f: (e) => {
}) this.practicalNum = e
generalInterfaceList({
"method": "scada_inv_stats_02('')"
}).then(e => {
console.log(e)
})
generalInterfaceList({
"method": "scada_in_store_01('')"
}).then(e => {
console.log(e)
})
generalInterfaceList({
"method": "scada_xk_pro_01('')"
}).then(e => {
console.log(e) console.log(e)
}) }
getData().then(e => { },
this.scrollTableData = e.table1 {
e: 'nd-04',
i: "",
f: (e) => {
this.scrollTableData = e
}
},
{
e: 'nd-05',
i: "",
f: (e) => {
this.$refs.chart1.setData({ this.$refs.chart1.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -199,7 +203,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.liner.ImportAndExportStatistics.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -229,7 +233,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.liner.ImportAndExportStatistics.y[0].name, name: e.y[0].name,
label: { label: {
normal: { normal: {
show: true, show: true,
@ -259,10 +263,23 @@ export default {
]), ]),
}, },
}, },
data: e.liner.ImportAndExportStatistics.y[0].data, data: e.y[0].data,
}, },
], ],
}) })
}
},
{
e: 'nd-06',
i: "",
f: (e) => {
this.meter = e
}
},
{
e: 'nd-07',
i: "SCADA_INV_STATS_01('')",
f: (e) => {
this.$refs.chart2.setData({ this.$refs.chart2.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -279,7 +296,7 @@ export default {
containLabel: true, containLabel: true,
}, },
legend: { legend: {
data: e.liner.inventoryStatus.y.map(val => val.name), data: e.y.map(val => val.name),
right: 'center', right: 'center',
top: 0, top: 0,
textStyle: { textStyle: {
@ -291,7 +308,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.liner.inventoryStatus.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -321,7 +338,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.liner.inventoryStatus.y[0].name, name: e.y[0].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -351,10 +368,10 @@ export default {
]), ]),
}, },
}, },
data: e.liner.inventoryStatus.y[0].data, data: e.y[0].data,
}, },
{ {
name: e.liner.inventoryStatus.y[1].name, name: e.y[1].name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
barMaxWidth: 50, barMaxWidth: 50,
@ -384,10 +401,30 @@ export default {
]), ]),
}, },
}, },
data: e.liner.inventoryStatus.y[1].data, data: e.y[1].data,
}, },
], ],
}) })
}
},
{
e: 'nd-08',
i: "",
f: (e) => {
this.linerNum = e
}
},
{
e: 'nd-09',
i: "",
f: (e) => {
this.caseNum = e
}
},
{
e: 'nd-10',
i: "",
f: (e) => {
this.$refs.chart3.setData({ this.$refs.chart3.setData({
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -405,7 +442,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.liner.inventoryStatistics.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -435,7 +472,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.liner.inventoryStatistics.y.name, name: e.y.name,
type: "bar", type: "bar",
barWidth: "30%", barWidth: "30%",
label: { label: {
@ -465,10 +502,17 @@ export default {
]), ]),
}, },
}, },
data: e.liner.inventoryStatistics.y.data, data: e.y.data,
}, },
], ],
}) })
console.log(e)
}
},
{
e: 'nd-11',
i: "",
f: (e) => {
this.$refs.chart4.setData({ this.$refs.chart4.setData({
legend: { legend: {
data: ['运行中夹具数量'], data: ['运行中夹具数量'],
@ -497,7 +541,7 @@ export default {
}, },
xAxis: { xAxis: {
type: "category", type: "category",
data: e.liner.foamFixtureState.x, data: e.x,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "white", color: "white",
@ -527,7 +571,7 @@ export default {
}, },
series: [ series: [
{ {
name: e.liner.foamFixtureState.y.name, name: e.y.name,
type: "bar", type: "bar",
barWidth: '30%', barWidth: '30%',
barMaxWidth: 50, barMaxWidth: 50,
@ -557,10 +601,20 @@ export default {
]), ]),
}, },
}, },
data: e.liner.foamFixtureState.y.data, data: e.y.data,
} }
] ]
}) })
console.log(e)
}
},
]
}
},
mounted() {
this.RequestDataSet.forEach(val => {
mixData(val)
}) })
}, },
methods: {} methods: {}

Write Preview
Loading…
Cancel
Save