This commit is contained in:
朱文强 2024-01-30 16:00:55 +08:00
parent 3d2e1d95e5
commit 9b4aaa12ea
13 changed files with 352 additions and 41 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

View File

@ -8,7 +8,7 @@
</linearGradient> </linearGradient>
</defs> </defs>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="凯君恒药玻" transform="translate(-115.000000, -110.000000)" fill-rule="nonzero"> <g id="凯君恒药玻" transform="translate(-115.000000, -110.000000)" fill-rule="nonzero">
<g id="编组-19" transform="translate(24.000000, 88.000000)"> <g id="编组-19" transform="translate(24.000000, 88.000000)">
<g id="运行状态" transform="translate(91.000000, 22.000000)"> <g id="运行状态" transform="translate(91.000000, 22.000000)">
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="68" height="68"></rect> <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="68" height="68"></rect>

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@ -2,28 +2,54 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:40 * @Date: 2023-01-04 10:29:40
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-08-08 16:25:02 * @LastEditTime: 2024-01-29 15:17:11
* @Description: * @Description:
--> -->
<template> <template>
<el-card shadow="never" class="aui-card--fill"> <el-card shadow="never" class="aui-card--fill">
<div class="bottom-info"> <div class="bottom-info">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="3"> <el-col :span="4">
<el-row :gutter="10">
<el-col :span="12">
<div class="text-div"> <div class="text-div">
<div class="titleStyle"> <div class="titleStyle">
上一班组下料数: 一号窑
<div style="color: #000;font-weight: 400;">上一班组下料数:</div>
</div> </div>
<h1 style="text-align: center;">{{ GroutCount.lastGroutCount }}</h1> <h2 style="text-align: center;">{{ GroutCount.lastGroutCount }}</h2>
</div>
<div class="text-div">
<div class="titleStyle">
当前班组下料数:
</div>
<h1 style="text-align: center;">{{ GroutCount.nowGroupCount }}</h1>
</div> </div>
</el-col> </el-col>
<el-col :span="9"> <el-col :span="12">
<div class="text-div">
<div class="titleStyle">
二号窑
<div style="color: #000;font-weight: 400;">上一班组下料数:</div>
</div>
<h2 style="text-align: center;">{{ GroutCount.kiln2LastGroutCount }}</h2>
</div>
</el-col>
<el-col :span="12">
<div class="text-div">
<div class="titleStyle">
一号窑
<div style="color: #000;font-weight: 400;">当前班组下料数:</div>
</div>
<h2 style="text-align: center;">{{ GroutCount.nowGroupCount }}</h2>
</div>
</el-col>
<el-col :span="12">
<div class="text-div">
<div class="titleStyle">
二号窑
<div style="color: #000;font-weight: 400;">当前班组下料数:</div>
</div>
<h2 style="text-align: center;">{{ GroutCount.kiln2NowGroupCount }}</h2>
</div>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<div class="echart-all"> <div class="echart-all">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
@ -50,7 +76,7 @@
ref="chartRef3" ref="chartRef3"
v-if="chartVisible" v-if="chartVisible"
:id="'echart3'" :id="'echart3'"
:title="'窑头1-3'" :title="'窑头2-1'"
></echart-1> ></echart-1>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
@ -59,7 +85,7 @@
ref="chartRef4" ref="chartRef4"
v-if="chartVisible" v-if="chartVisible"
:id="'echart4'" :id="'echart4'"
:title="'窑头1-4'" :title="'窑头2-2'"
></echart-1> ></echart-1>
</el-col> </el-col>
</el-row> </el-row>
@ -153,18 +179,18 @@ export default {
background: #ffffff; background: #ffffff;
border-radius: 8px; border-radius: 8px;
margin: 8px 0 0 0; margin: 8px 0 0 0;
padding: 17px;
line-height: 50px; line-height: 50px;
color: #47E282; padding-top: 5px;
color: #47e282;
font-size: 50px; font-size: 50px;
height: 213px; height: 213px;
} }
.titleStyle { .titleStyle {
margin: -8px 0 10px -10px; margin: 0px 0 10px 5px;
font-size: 16px; font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 600;
color: rgba(0, 0, 0, 0.85); color: #35ab63;
line-height: 16px; line-height: 16px;
} }
.titleStyle::before { .titleStyle::before {

View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:40 * @Date: 2023-01-04 10:29:40
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-08-08 16:58:37 * @LastEditTime: 2024-01-29 10:22:22
* @Description: * @Description:
--> -->
<template> <template>
@ -23,8 +23,12 @@
:class="[item.name, potArr[potData[item.name.split('-')[1]]]]" :class="[item.name, potArr[potData[item.name.split('-')[1]]]]"
:key="item.name" :key="item.name"
></div> ></div>
<div class="kname kname1">1-1</div>
<div class="kname kname2">1-2</div>
<div class="kname kname3">2-1</div>
<div class="kname kname4">2-2</div>
</div> </div>
<div class="car uncar"> <div class="car" id="uncar">
<div class="carDiv" :class="[potArr[potData.pot13]]"></div> <div class="carDiv" :class="[potArr[potData.pot13]]"></div>
<div class="carDiv" :class="[potArr[potData.pot14]]"></div> <div class="carDiv" :class="[potArr[potData.pot14]]"></div>
</div> </div>
@ -83,6 +87,10 @@ export default {
type: Number, type: Number,
default: 0.1, default: 0.1,
}, },
rgv2: {
type: Number,
default: 0.6,
},
radio: { radio: {
type: Number, type: Number,
default: 1, default: 1,
@ -96,6 +104,7 @@ export default {
return { return {
dispatchMode: this.radio, dispatchMode: this.radio,
car: "", car: "",
uncar: "",
zhigui: "", zhigui: "",
potArr: ["", "pot1", "pot2", "pot3", "pot4"], potArr: ["", "pot1", "pot2", "pot3", "pot4"],
modelArr: ["hand", "auto"], modelArr: ["hand", "auto"],
@ -131,8 +140,10 @@ export default {
methods: { methods: {
init() { init() {
this.car = document.getElementById("car"); this.car = document.getElementById("car");
this.uncar = document.getElementById("uncar");
this.zhigui = document.getElementById("zhigui"); this.zhigui = document.getElementById("zhigui");
this.car.style.right = this.zhigui.clientWidth * this.rgv + "px"; this.car.style.right = this.zhigui.clientWidth * this.rgv + "px";
this.uncar.style.right = this.zhigui.clientWidth * this.rgv2 + "px";
//this.runCar(); //this.runCar();
}, },
setMode() { setMode() {
@ -199,6 +210,32 @@ export default {
margin: 3px 0 0 3px; margin: 3px 0 0 3px;
float: left; float: left;
} }
.kname {
width: 40px;
color: #8ee1a9;
font-weight: bolder;
font-size: 25px;
}
.kname1{
right: 16.2%;
bottom: 20%;
position: absolute;
}
.kname2{
right: 19.1%;
bottom: 20%;
position: absolute;
}
.kname3{
right: 39.2%;
bottom: 20%;
position: absolute;
}
.kname4{
right: 42.2%;
bottom: 20%;
position: absolute;
}
.line-div { .line-div {
width: 39px; width: 39px;
height: 39px; height: 39px;
@ -426,7 +463,7 @@ export default {
} }
.bg { .bg {
margin-bottom: -40px; margin-bottom: -40px;
height: 512px; height: 505px;
width: 1612px; width: 1612px;
position: relative; position: relative;
z-index: 1; z-index: 1;

View File

@ -2,13 +2,13 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:40 * @Date: 2023-01-04 10:29:40
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-07-07 09:15:55 * @LastEditTime: 2024-01-26 14:49:01
* @Description: * @Description:
--> -->
<template> <template>
<el-card shadow="never" class="aui-card--fill"> <el-card shadow="never" class="aui-card--fill">
<base-table <base-table
height="425" height="420"
:table-props="tableProps" :table-props="tableProps"
:page="listQuery.page" :page="listQuery.page"
:limit="listQuery.limit" :limit="listQuery.limit"

View File

@ -2,13 +2,13 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:40 * @Date: 2023-01-04 10:29:40
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-07-07 09:16:52 * @LastEditTime: 2024-01-26 14:49:15
* @Description: * @Description:
--> -->
<template> <template>
<el-card shadow="never" class="aui-card--fill"> <el-card shadow="never" class="aui-card--fill">
<base-table <base-table
height="425" height="420"
:table-props="tableProps" :table-props="tableProps"
:page="listQuery.page" :page="listQuery.page"
:limit="listQuery.limit" :limit="listQuery.limit"

View File

@ -0,0 +1,119 @@
<!--
* @Author: zwq
* @Date: 2023-06-01 10:47:42
* @LastEditors: zwq
* @LastEditTime: 2024-01-30 15:52:49
* @Description:
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="echart-all">
<el-row :gutter="20">
<el-col :span="12">
<echart-2
class="echart-div"
ref="chartRef1"
v-if="chartVisible"
:id="'zhexian1'"
:title="'1-1半小时消耗'"
></echart-2>
</el-col>
<el-col :span="12">
<echart-2
class="echart-div"
ref="chartRef2"
v-if="chartVisible"
:id="'zhexian2'"
:title="'1-2半小时消耗'"
></echart-2>
</el-col>
<el-col :span="12">
<echart-2
class="echart-div"
ref="chartRef3"
v-if="chartVisible"
:id="'zhexian3'"
:title="'2-1半小时消耗'"
></echart-2>
</el-col>
<el-col :span="12">
<echart-2
class="echart-div"
ref="chartRef4"
v-if="chartVisible"
:id="'zhexian4'"
:title="'2-2半小时消耗'"
></echart-2>
</el-col>
</el-row>
</div>
</el-card>
</template>
<script>
import echart2 from "./echart2";
export default {
data() {
return {
chartVisible: false,
};
},
components: {
echart2,
},
mounted() {
this.startFun();
},
methods: {
init() {
this.getData();
this.startFun();
},
startFun() {
const timer = setInterval(() => {
this.getData();
}, 60000);
this.$once("hook:beforeDestroy", () => {
clearInterval(timer);
});
},
getData() {
this.chartVisible = true;
for (let i = 1; i <= 4; i++) {
const params = {
location: i,
order:'desc',
orderField:'create_time',
limit: 24,
page:1
};
this.$http
.get("/code/mtBbybWeightSum/page", {
params,
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
const arr = res.data.list.reverse()
this.$nextTick(() => {
this.$refs["chartRef" + i].initChart(arr);
});
})
.catch(() => {});
}
},
},
};
</script>
<style scoped>
.echart-all {
margin-left: -8px;
}
.echart-div {
background: #ffffff;
border-radius: 8px;
padding-top: 10px;
}
</style>

View File

@ -6,7 +6,7 @@
* @Description: * @Description:
--> -->
<template> <template>
<div style="width: 349px;height: 213px" class="echart-div" :id="id"></div> <div style="width: 320px;height: 213px" class="echart-div" :id="id"></div>
</template> </template>
<script> <script>

View File

@ -0,0 +1,107 @@
<!--
* @Author: zwq
* @Date: 2023-06-01 10:47:42
* @LastEditors: zwq
* @LastEditTime: 2024-01-29 10:31:36
* @Description:
-->
<template>
<div style="width: 90%;height: 233px;" class="echart-div" :id="id"></div>
</template>
<script>
import * as echarts from "echarts";
export default {
props: {
id: {
type: String,
default: "zhexian",
},
title: {
type: String,
default: "",
},
},
name: "echarts",
data() {
return {
echart: "",
};
},
mounted() {},
activated() {
// echartresize, resize, bug
if (this.echart) {
this.echart.resize();
}
},
methods: {
// 线
initChart(data) {
var option = {
title: {
text: "{space|}{tip|}{space|}{value|" + this.title + "}",
left: "0%",
top: "2%",
textStyle: {
rich: {
tip: {
width: 4,
height: 16,
backgroundColor: "#1FC495",
marginRight: 6,
},
space: {
width: 8,
},
value: {
fontSize: 16,
fontWeight: "bold",
},
},
},
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
grid: {
show: false,
z: 0,
left: "10%",
top: 40,
right: "10%",
bottom: 10,
containLabel: true,
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
series: [
{
name: '消耗',
data: data.map(item=>{return item.weightSum}),
type: "line",
},
],
};
if (this.echart !== "") {
this.echart.setOption(option);
} else {
this.echart = echarts.init(document.getElementById(this.id));
this.echart.setOption(option);
}
window.addEventListener("resize", () => {
this.echart.resize();
});
},
},
};
</script>
<style scoped></style>

View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:40 * @Date: 2023-01-04 10:29:40
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-08-14 09:20:13 * @LastEditTime: 2024-01-26 15:37:59
* @Description: * @Description:
--> -->
<template> <template>
@ -17,7 +17,7 @@
<img style="height: 52px;float:left;margin:12px 24px" src="~@/assets/img/横版logo.png" /> <img style="height: 52px;float:left;margin:12px 24px" src="~@/assets/img/横版logo.png" />
<img <img
style="height: 30px;float:right;margin:22px;margin-right:140px" style="height: 30px;float:right;margin:22px;margin-right:140px"
src="~@/assets/img/RGV/凯君恒药玻RGV输送线@2x.png" src="~@/assets/img/RGV/凯君恒药玻RGV输送线@2x.png"
/> />
<span class="title-time"> <span class="title-time">
{{ gettime.split("/")[0] }}<br /> {{ gettime.split("/")[0] }}<br />
@ -33,13 +33,14 @@
> >
<el-tab-pane name="first"> <el-tab-pane name="first">
<span slot="label" class="tab-item"> <span slot="label" class="tab-item">
<img style="height: 60px;" src="~@/assets/img/RGV/运行状态@2x.png" /> <img style="height: 40px;" src="~@/assets/img/RGV/运行状态@2x.png" />
<br /><span>运行状态</span> <br /><span>运行状态</span>
</span> </span>
<ceshi-1 <ceshi-1
ref="ceshi1" ref="ceshi1"
:potData="potData" :potData="potData"
:rgv="rgv" :rgv="rgv"
:rgv2="rgv2"
:radio="radio" :radio="radio"
:arrow="arrow" :arrow="arrow"
:modelData="modelData" :modelData="modelData"
@ -48,18 +49,25 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="second"> <el-tab-pane name="second">
<span slot="label" class="tab-item"> <span slot="label" class="tab-item">
<img style="height: 60px;" src="~@/assets/img/RGV/历史数据@2x.png" /> <img style="height: 40px;" src="~@/assets/img/RGV/历史数据@2x.png" />
<br /><span>历史数据</span> <br /><span>历史数据</span>
</span> </span>
<ceshi-2 ref="ceshi2" v-if="activeName === 'second'"></ceshi-2> <ceshi-2 ref="ceshi2" v-if="activeName === 'second'"></ceshi-2>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="third"> <el-tab-pane name="third">
<span slot="label" class="tab-item"> <span slot="label" class="tab-item">
<img style="height: 60px;" src="~@/assets/img/RGV/历史报警@2x.png" /> <img style="height: 40px;" src="~@/assets/img/RGV/历史报警@2x.png" />
<br /><span>历史报警</span> <br /><span>历史报警</span>
</span> </span>
<ceshi-3 ref="ceshi3" v-if="activeName === 'third'"></ceshi-3> <ceshi-3 ref="ceshi3" v-if="activeName === 'third'"></ceshi-3>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="four">
<span slot="label" class="tab-item">
<img style="height: 40px;" src="~@/assets/img/RGV/echart.jpeg" />
<br /><span>下料速度</span>
</span>
<ceshi-4 ref="ceshi4" v-if="activeName === 'four'"></ceshi-4>
</el-tab-pane>
</el-tabs> </el-tabs>
<bottom-info <bottom-info
:echartData="echartData" :echartData="echartData"
@ -77,6 +85,7 @@ import ceshi1 from "./ceshi1";
import bottomInfo from "./bottomInfo"; import bottomInfo from "./bottomInfo";
import ceshi2 from "./ceshi2"; import ceshi2 from "./ceshi2";
import ceshi3 from "./ceshi3"; import ceshi3 from "./ceshi3";
import ceshi4 from "./ceshi4";
export default { export default {
data() { data() {
return { return {
@ -89,7 +98,8 @@ export default {
potData: {}, potData: {},
echartData: {}, echartData: {},
tableData: [], tableData: [],
rgv: 0, rgv: 0.1,
rgv2: 0.8,
radio: 1, radio: 1,
arrow: 1, arrow: 1,
modelData: {}, modelData: {},
@ -100,6 +110,7 @@ export default {
ceshi1, ceshi1,
ceshi2, ceshi2,
ceshi3, ceshi3,
ceshi4,
bottomInfo, bottomInfo,
}, },
created() { created() {
@ -124,10 +135,14 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.ceshi2.getDataList(); this.$refs.ceshi2.getDataList();
}); });
} else { } else if (tab.index === "2") {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.ceshi3.getDataList(); this.$refs.ceshi3.getDataList();
}); });
} else if (tab.index === "3") {
this.$nextTick(() => {
this.$refs.ceshi4.init();
});
} }
}, },
getCurrentTime() { getCurrentTime() {
@ -179,6 +194,8 @@ export default {
const data = { const data = {
lastGroutCount: JSON.parse(JSON.stringify(dataJson)).lastGroutCount, lastGroutCount: JSON.parse(JSON.stringify(dataJson)).lastGroutCount,
nowGroupCount: JSON.parse(JSON.stringify(dataJson)).nowGroupCount, nowGroupCount: JSON.parse(JSON.stringify(dataJson)).nowGroupCount,
kiln2LastGroutCount: JSON.parse(JSON.stringify(dataJson)).kiln2LastGroutCount,
kiln2NowGroupCount: JSON.parse(JSON.stringify(dataJson)).kiln2NowGroupCount,
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.bottomInfo.init(data); this.$refs.bottomInfo.init(data);
@ -207,6 +224,7 @@ export default {
this.radio = JSON.parse(JSON.stringify(dataJson)).dispatchMode; this.radio = JSON.parse(JSON.stringify(dataJson)).dispatchMode;
this.arrow = JSON.parse(JSON.stringify(dataJson)).direction; this.arrow = JSON.parse(JSON.stringify(dataJson)).direction;
this.rgv = JSON.parse(JSON.stringify(dataJson)).rgv1; this.rgv = JSON.parse(JSON.stringify(dataJson)).rgv1;
this.rgv2 = JSON.parse(JSON.stringify(dataJson)).rgv2;
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.ceshi1.init(); this.$refs.ceshi1.init();
}); });
@ -254,7 +272,7 @@ export default {
} }
.tab-div >>> .el-tabs__item { .tab-div >>> .el-tabs__item {
width: 220px; width: 220px;
height: 160px; height: 124px;
font-size: 22px; font-size: 22px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
@ -267,12 +285,16 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-bottom: 16px; margin-bottom: 4px;
}
.tab-div >>> .el-tabs__item.is-active {
box-shadow: 0 0 10px 10px inset rgba(0, 102, 255, 0.6);
} }
.tab-div >>> .el-tabs__item:last-child { .tab-div >>> .el-tabs__item:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.tab-div >>> .el-tabs__active-bar { .tab-div >>> .el-tabs__active-bar {
display: none;
border-radius: 2px; border-radius: 2px;
background: #3fc471; background: #3fc471;
} }