renren/yaobo
4
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

更新

Browse Source
This commit is contained in:
朱文强 2023-08-10 10:20:21 +08:00
parent 58fe569ba0
commit 5a537dd66e
10 changed files with 275 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/index.html
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2022-08-22 14:57:50 * @Date: 2022-08-22 14:57:50
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-06-02 10:02:23 * @LastEditTime: 2023-08-07 16:11:40
* @Description: * @Description:
--> -->
<!DOCTYPE html> <!DOCTYPE html>
@ -58,7 +58,7 @@
<% if (process.env.VUE_APP_NODE_ENV === 'prod') { %> <% if (process.env.VUE_APP_NODE_ENV === 'prod') { %>
<script> <script>
window.SITE_CONFIG['apiURL'] = '/api'; // api请求地址 window.SITE_CONFIG['apiURL'] = '/api'; // api请求地址
window.SITE_CONFIG['wbURL'] = '192.168.1.12:8080/ym-wms-wcs'; window.SITE_CONFIG['wbURL'] = '192.168.1.101:8080/ym-wms-wcs';
</script> </script>
<% } %> <% } %>
</head> </head>

39
src/router/index.js
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:39 * @Date: 2023-01-04 10:29:39
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-05-31 11:00:34 * @LastEditTime: 2023-08-08 09:19:20
* @Description: * @Description:
*/ */
import Vue from 'vue' import Vue from 'vue'
@ -37,7 +37,7 @@ export const moduleRoutes = {
path: '/', path: '/',
component: () => import('@/views/main'), component: () => import('@/views/main'),
name: 'main', name: 'main',
redirect: { name: 'home' }, redirect: { name: 'main' },
meta: { title: '主入口布局' }, meta: { title: '主入口布局' },
children: [ children: [
{ path: '/home', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } }, { path: '/home', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
@ -86,24 +86,25 @@ router.beforeEach((to, from, next) => {
return next() return next()
} }
// 获取字典列表, 添加并全局变量保存 // 获取字典列表, 添加并全局变量保存
http.get('/sys/dict/type/all').then(({ data: res }) => { // http.get('/sys/dict/type/all').then(({ data: res }) => {
if (res.code !== 0) { // if (res.code !== 0) {
return // return
} // }
window.SITE_CONFIG['dictList'] = res.data // window.SITE_CONFIG['dictList'] = res.data
}).catch(() => {}) // }).catch(() => {})
// 获取菜单列表, 添加并全局变量保存 // 获取菜单列表, 添加并全局变量保存
http.get('/sys/menu/nav').then(({ data: res }) => { // http.get('/sys/menu/nav').then(({ data: res }) => {
if (res.code !== 0) { // if (res.code !== 0) {
Vue.prototype.$message.error(res.msg) // Vue.prototype.$message.error(res.msg)
return next({ name: 'main' }) // return next({ name: 'main' })
} // }
window.SITE_CONFIG['menuList'] = res.data // window.SITE_CONFIG['menuList'] = res.data
fnAddDynamicMenuRoutes(window.SITE_CONFIG['menuList']) // fnAddDynamicMenuRoutes(window.SITE_CONFIG['menuList'])
next({ ...to, replace: true }) // next({ ...to, replace: true })
}).catch(() => { // }).catch(() => {
next({ name: 'main' }) // next({ name: 'main' })
}) // })
next({ name: 'main' })
}) })
/** /**

4
src/utils/request.js
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-01-04 10:29:39 * @Date: 2023-01-04 10:29:39
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-06-01 09:23:35 * @LastEditTime: 2023-08-07 15:44:58
* @Description: * @Description:
*/ */
import axios from 'axios' import axios from 'axios'
@ -62,7 +62,7 @@ http.interceptors.request.use(config => {
http.interceptors.response.use(response => { http.interceptors.response.use(response => {
if (response.data.code === 401 || response.data.code === 10001) { if (response.data.code === 401 || response.data.code === 10001) {
clearLoginInfo() clearLoginInfo()
router.replace({ name: 'ceshi' }) router.replace({ name: 'main' })
return Promise.reject(response.data.msg) return Promise.reject(response.data.msg)
} }
return response return response

6
src/views/main-navbar.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2022-08-22 14:57:51 * @Date: 2022-08-22 14:57:51
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-02-28 15:17:13 * @LastEditTime: 2023-08-07 15:46:06
* @Description: * @Description:
--> -->
<template> <template>
@ -26,7 +26,7 @@
<el-menu-item index="6" @click="$router.push({ name: 'home' })"> <el-menu-item index="6" @click="$router.push({ name: 'home' })">
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-home"></use></svg> <svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-home"></use></svg>
</el-menu-item> </el-menu-item>
<el-menu-item index="7"> <!-- <el-menu-item index="7">
<el-dropdown trigger="click" class="international" @command="handleSetLanguage"> <el-dropdown trigger="click" class="international" @command="handleSetLanguage">
<div> <div>
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"> <svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true">
@ -42,7 +42,7 @@
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</el-menu-item> </el-menu-item> -->
<el-menu-item index="4" @click="fullscreenHandle()"> <el-menu-item index="4" @click="fullscreenHandle()">
<svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg> <svg class="icon-svg aui-navbar__icon-menu" aria-hidden="true"><use xlink:href="#icon-fullscreen"></use></svg>
</el-menu-item> </el-menu-item>

140
src/views/modules/bottomInfo.vue
View File

@ -2,58 +2,70 @@
* @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-06 16:33:01 * @LastEditTime: 2023-08-08 16:25:02
* @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="9"> <el-col :span="3">
<el-row :gutter="20"> <div class="text-div">
<el-col :span="12"> <div class="titleStyle">
<echart-1 上一班组下料数:
class="echart-div" </div>
ref="chartRef1" <h1 style="text-align: center;">{{ GroutCount.lastGroutCount }}</h1>
v-if="chartVisible" </div>
:echart-data="echartData.echart1" <div class="text-div">
:id="'echart1'" <div class="titleStyle">
:title="'窑头1-1'" 当前班组下料数:
></echart-1> </div>
</el-col> <h1 style="text-align: center;">{{ GroutCount.nowGroupCount }}</h1>
<el-col :span="12"> </div>
<echart-1
class="echart-div"
ref="chartRef2"
v-if="chartVisible"
:echart-data="echartData.echart2"
:id="'echart2'"
:title="'窑头1-2'"
></echart-1>
</el-col>
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef3"
v-if="chartVisible"
:echart-data="echartData.echart3"
:id="'echart3'"
:title="'窑头1-3'"
></echart-1>
</el-col>
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef4"
v-if="chartVisible"
:echart-data="echartData.echart4"
:id="'echart4'"
:title="'窑头1-4'"
></echart-1>
</el-col>
</el-row>
</el-col> </el-col>
<el-col :span="15"> <el-col :span="9">
<div class="echart-all">
<el-row :gutter="20">
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef1"
v-if="chartVisible"
:id="'echart1'"
:title="'窑头1-1'"
></echart-1>
</el-col>
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef2"
v-if="chartVisible"
:id="'echart2'"
:title="'窑头1-2'"
></echart-1>
</el-col>
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef3"
v-if="chartVisible"
:id="'echart3'"
:title="'窑头1-3'"
></echart-1>
</el-col>
<el-col :span="12">
<echart-1
class="echart-div"
ref="chartRef4"
v-if="chartVisible"
:id="'echart4'"
:title="'窑头1-4'"
></echart-1>
</el-col>
</el-row>
</div>
</el-col>
<el-col :span="12">
<div class="table2"> <div class="table2">
<div class="titleStyle"> <div class="titleStyle">
当前报警 当前报警
@ -88,7 +100,8 @@ export default {
}, },
data() { data() {
return { return {
chartVisible:false chartVisible: false,
GroutCount: {},
}; };
}, },
components: { components: {
@ -98,14 +111,18 @@ export default {
}, },
created() {}, created() {},
methods: { methods: {
init() { init(data) {
this.chartVisible = true this.chartVisible = true;
this.$nextTick(() => { if (data) {
this.$refs.chartRef1.initChart(); this.GroutCount = data;
this.$refs.chartRef2.initChart(); } else {
this.$refs.chartRef3.initChart(); this.$nextTick(() => {
this.$refs.chartRef4.initChart(); this.$refs.chartRef1.initChart(this.echartData.echart1);
}); this.$refs.chartRef2.initChart(this.echartData.echart2);
this.$refs.chartRef3.initChart(this.echartData.echart3);
this.$refs.chartRef4.initChart(this.echartData.echart4);
});
}
}, },
}, },
}; };
@ -116,6 +133,10 @@ export default {
background-color: #f2f4f9; background-color: #f2f4f9;
padding: 0; padding: 0;
} }
.echart-all {
margin-left: -8px;
}
.echart-div { .echart-div {
background: #ffffff; background: #ffffff;
border-radius: 8px; border-radius: 8px;
@ -127,6 +148,17 @@ export default {
margin: 8px 0 0 0; margin: 8px 0 0 0;
padding: 17px 24px; padding: 17px 24px;
} }
.text-div {
background: #ffffff;
border-radius: 8px;
margin: 8px 0 0 0;
padding: 17px;
line-height: 50px;
color: #47E282;
font-size: 50px;
height: 213px;
}
.titleStyle { .titleStyle {
margin: -8px 0 10px -10px; margin: -8px 0 10px -10px;
font-size: 16px; font-size: 16px;

6
src/views/modules/ceshi1.vue
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-07-07 10:15:15 * @LastEditTime: 2023-08-08 16:58:37
* @Description: * @Description:
--> -->
<template> <template>
@ -180,8 +180,6 @@ export default {
</script> </script>
<style scoped> <style scoped>
.aui-card--fill >>> .el-card__body {
}
.car { .car {
width: 110px; width: 110px;
height: 46px; height: 46px;
@ -201,8 +199,6 @@ export default {
margin: 3px 0 0 3px; margin: 3px 0 0 3px;
float: left; float: left;
} }
.line-pot {
}
.line-div { .line-div {
width: 39px; width: 39px;
height: 39px; height: 39px;

24
src/views/modules/echart1.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2023-06-01 10:47:42 * @Date: 2023-06-01 10:47:42
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2023-07-06 16:41:08 * @LastEditTime: 2023-08-08 15:38:39
* @Description: * @Description:
--> -->
<template> <template>
@ -13,10 +13,6 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
export default { export default {
props: { props: {
echartData: {
type: Number,
default: 0,
},
id: { id: {
type: String, type: String,
default: "", default: "",
@ -41,10 +37,10 @@ export default {
}, },
methods: { methods: {
// 折线图 // 折线图
initChart() { initChart(data) {
if (this.echart !== "") { // if (this.echart !== "") {
this.echart.dispose(); //去掉控制台多个echarts Dom的警告 // this.echart.dispose(); //去掉控制台多个echarts Dom的警告
} // }
var option = { var option = {
title: { title: {
text: "{space|}{tip|}{space|}{value|" + this.title + "}", text: "{space|}{tip|}{space|}{value|" + this.title + "}",
@ -186,7 +182,7 @@ export default {
}, },
data: [ data: [
{ {
value: this.echartData, value: data,
}, },
], ],
radius: "90%", radius: "90%",
@ -194,8 +190,12 @@ export default {
}, },
], ],
}; };
this.echart = echarts.init(document.getElementById(this.id)); if (this.echart !== "") {
this.echart.setOption(option); this.echart.setOption(option);
} else {
this.echart = echarts.init(document.getElementById(this.id));
this.echart.setOption(option);
}
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
this.echart.resize(); this.echart.resize();
}); });

164
src/views/modules/main.vue
View File

@ -2,11 +2,14 @@
* @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:02:22 * @LastEditTime: 2023-08-09 09:54:14
* @Description: * @Description:
--> -->
<template> <template>
<div style="background-color:#f2f4f9;height:100vh"> <div style="background-color:#f2f4f9;">
<div id="alertOverlay" :class="{ alertOverlay: showAlarm }">
<div></div>
</div>
<div class="title"> <div class="title">
<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
@ -19,20 +22,26 @@
</span> </span>
</div> </div>
<div class="tab-div" style="margin:5px 12px"> <div class="tab-div" style="margin:5px 12px">
<el-tabs v-model="activeName" style="width:100%;" tab-position="left" @tab-click="handleClick"> <el-tabs
v-model="activeName"
style="width:100%;"
tab-position="left"
@tab-click="handleClick"
>
<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: 60px;" 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"
:radio='radio' :radio="radio"
:arrow='arrow' :arrow="arrow"
:modelData='modelData' :modelData="modelData"
v-if="activeName === 'first'"></ceshi-1> v-if="activeName === 'first'"
></ceshi-1>
</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">
@ -49,11 +58,12 @@
<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-tabs> </el-tabs>
<bottom-info <bottom-info
:echartData='echartData' :echartData="echartData"
:table2Data='tableData' :table2Data="tableData"
ref="bottomInfo" ref="bottomInfo"
style="margin:12px 0px"> style="margin:12px 0px"
>
</bottom-info> </bottom-info>
</div> </div>
</div> </div>
@ -77,9 +87,10 @@ export default {
echartData: {}, echartData: {},
tableData: [], tableData: [],
rgv: 0, rgv: 0,
radio:1, radio: 1,
arrow:1, arrow: 1,
modelData: {} modelData: {},
showAlarm: false,
}; };
}, },
components: { components: {
@ -91,7 +102,7 @@ export default {
created() { created() {
this.url = window.SITE_CONFIG["wbURL"]; this.url = window.SITE_CONFIG["wbURL"];
this.initWebSocket(); this.initWebSocket();
}, },
mounted() { mounted() {
this.init(); this.init();
this.getCurrentTime(); this.getCurrentTime();
@ -146,7 +157,6 @@ export default {
}, },
websocketonmessage(e) { websocketonmessage(e) {
let dataJson = JSON.parse(e.data); let dataJson = JSON.parse(e.data);
console.log(dataJson);
// 数据接收 // 数据接收
this.wbData = dataJson; this.wbData = dataJson;
@ -162,8 +172,24 @@ export default {
this.$refs.bottomInfo.init(); this.$refs.bottomInfo.init();
}); });
} }
if ("lastGroutCount" in dataJson) {
const data = {
lastGroutCount: JSON.parse(JSON.stringify(dataJson)).lastGroutCount,
nowGroupCount: JSON.parse(JSON.stringify(dataJson)).nowGroupCount,
};
this.$nextTick(() => {
this.$refs.bottomInfo.init(data);
});
}
if ("alarm" in dataJson) { if ("alarm" in dataJson) {
this.tableData = JSON.parse(JSON.stringify(dataJson)).alarm; this.tableData = JSON.parse(JSON.stringify(dataJson)).alarm;
if (this.tableData.length > 0 && this.tableData.find((i) => i.type !== "RGV1提示")) {
this.showAlarm = true;
this.setAlertState(true);
} else {
this.showAlarm = false;
this.setAlertState(false);
}
} }
if ("model1" in dataJson) { if ("model1" in dataJson) {
this.modelData = JSON.parse(JSON.stringify(dataJson)); this.modelData = JSON.parse(JSON.stringify(dataJson));
@ -185,6 +211,14 @@ export default {
// 关闭 // 关闭
console.log("断开连接", e); console.log("断开连接", e);
}, },
setAlertState(active) {
var alertOverlay = document.getElementById("alertOverlay");
if (active) {
alertOverlay.classList.add("alert-active");
} else {
alertOverlay.classList.remove("alert-active");
}
},
}, },
}; };
</script> </script>
@ -209,8 +243,6 @@ export default {
right: 30px; right: 30px;
top: 22px; top: 22px;
} }
.tab-div {
}
.tab-div >>> .el-tabs__item { .tab-div >>> .el-tabs__item {
width: 220px; width: 220px;
height: 160px; height: 160px;
@ -233,7 +265,7 @@ export default {
} }
.tab-div >>> .el-tabs__active-bar { .tab-div >>> .el-tabs__active-bar {
border-radius: 2px; border-radius: 2px;
background: #3FC471; background: #3fc471;
} }
.tab-div >>> .el-tabs__nav-wrap::after { .tab-div >>> .el-tabs__nav-wrap::after {
display: none; display: none;
@ -242,3 +274,87 @@ export default {
text-align: center; text-align: center;
} }
</style> </style>
<style>
html,
body {
margin: 0;
padding: 0;
overflow: hidden;
}
:root {
--alert-size: 120px;
}
.alertOverlay::before,
.alertOverlay::after {
content: "";
position: absolute;
width: var(--alert-size);
height: 100%;
}
.alertOverlay > div::before,
.alertOverlay > div::after {
content: "";
position: absolute;
width: 100%;
height: var(--alert-size);
}
.alertOverlay::before {
background: linear-gradient(to right, red, transparent);
top: 0;
left: 0;
transform: rotate(0deg);
}
.alertOverlay::after {
background: linear-gradient(to left, red, transparent);
top: 0%;
left: 100%;
transform: rotate(0deg) translate(calc(-1 * var(--alert-size)), 0px);
}
.alertOverlay > div::before {
background: linear-gradient(to top, red, transparent);
top: 0;
left: 0;
transform: rotate(180deg);
}
.alertOverlay > div::after {
background: linear-gradient(to top, red, transparent);
top: 100%;
left: 0;
transform: rotate(0deg) translate(0px, calc(-1 * var(--alert-size)));
}
.alertOverlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
opacity: 1;
transition: opacity 0.5s;
pointer-events: none;
z-index: 10;
}
.alert-active {
animation: blink 1s infinite;
}
@keyframes blink {
0% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 0;
}
}
</style>

9
src/views/pages/404.vue
View File

@ -1,3 +1,10 @@
<!--
* @Author: zwq
* @Date: 2023-08-07 08:26:17
* @LastEditors: zwq
* @LastEditTime: 2023-08-07 16:02:48
* @Description:
-->
<template> <template>
<div class="aui-wrapper aui-page__not-found"> <div class="aui-wrapper aui-page__not-found">
<div class="aui-content__wrapper"> <div class="aui-content__wrapper">
@ -6,7 +13,7 @@
<p class="desc" v-html="$t('notFound.desc')"></p> <p class="desc" v-html="$t('notFound.desc')"></p>
<div class="btn-bar"> <div class="btn-bar">
<el-button @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button> <el-button @click="$router.go(-1)">{{ $t('notFound.back') }}</el-button>
<el-button type="primary" @click="$router.push({ name: 'home' })">{{ $t('notFound.home') }}</el-button> <el-button type="primary" @click="$router.push({ name: 'main' })">{{ $t('notFound.home') }}</el-button>
</div> </div>
</div> </div>
</div> </div>

2
src/views/pages/login.vue
View File

@ -101,7 +101,7 @@ export default {
return this.$message.error(res.msg) return this.$message.error(res.msg)
} }
Cookies.set('token', res.data.token) Cookies.set('token', res.data.token)
this.$router.replace({ name: 'home' }) this.$router.replace({ name: 'main' })
}).catch(() => {}) }).catch(() => {})
}) })
}, 1000, { 'leading': true, 'trailing': false }) }, 1000, { 'leading': true, 'trailing': false })