更新首页+异常告警接口对接和仓库首页跳转问题
This commit is contained in:
parent
5711468b10
commit
4b621a6699
54
src/api/home.js
Normal file
54
src/api/home.js
Normal file
@ -0,0 +1,54 @@
|
||||
/*
|
||||
* @Author: zwq
|
||||
* @Date: 2024-09-12 13:38:33
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2024-09-13 15:25:07
|
||||
* @Description:
|
||||
*/
|
||||
import request from '@/utils/request'
|
||||
// 获得首页生产总览以及工单监控
|
||||
export function getHomeOrder(data) {
|
||||
return request({
|
||||
url: '/base/core-work-order/homeOrder',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
// 获得首页生产总览-完成订单数量
|
||||
export function getHomeOrderNum(data) {
|
||||
return request({
|
||||
url: '/base/order/homeOrder',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
// 首页设备总览
|
||||
export function getHomeEquipment() {
|
||||
return request({
|
||||
url: '/monitoring/equipment-monitor/homeEquipment',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 首页设备报警信息
|
||||
export function getHomeEquipmentAlarmList() {
|
||||
return request({
|
||||
url: '/base/equipment-alarm-realtime/homeEquipmentAlarmList',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 获取是否存在报警（右上角红点）
|
||||
export function getHomeGetAlarm() {
|
||||
return request({
|
||||
url: '/base/core-alarm-log/homeGetAlarm',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 条件查询获得异常警告列表
|
||||
export function getHomeAlarmList(query) {
|
||||
return request({
|
||||
url: '/base/core-alarm-log/listbyfilter',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
15
src/assets/icons/svg/home-alarm-white-circle.svg
Normal file
15
src/assets/icons/svg/home-alarm-white-circle.svg
Normal file
@ -0,0 +1,15 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title></title>
|
||||
<g id="主界面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="主页" transform="translate(-1713.000000, -32.000000)">
|
||||
<g id="icon/banner/消息" transform="translate(1713.000000, 32.000000)">
|
||||
<g id="编组">
|
||||
<rect id="矩形" x="0" y="0" width="24" height="24"></rect>
|
||||
<path d="M13.875,20.6585751 L13.9796526,20.6647179 C14.3523487,20.7094224 14.6,20.9943408 14.6,21.3949387 C14.6,21.793137 14.3546839,22.079785 13.9805499,22.1250542 L13.8720425,22.1313899 L10.125,22.1313023 L10.0203474,22.1251595 C9.64765132,22.080455 9.4,21.7955365 9.4,21.3949387 C9.4,20.9967404 9.64531608,20.7100924 10.0194501,20.6648232 L10.1279575,20.6584875 L13.875,20.6585751 Z M12,0.930991914 L12.114202,0.938656892 C12.4461465,0.982430206 12.6786924,1.21840343 12.7188472,1.56053658 L12.7250824,1.6705356 L12.724,2.83025932 L12.975759,2.90430031 L13.2244725,2.9413468 C16.687784,3.51732717 19.3536312,6.48703662 19.5838508,10.0724929 L19.5959741,10.3244915 L19.6000064,10.5775585 L19.6,18.0623023 L20.7499628,18.1131205 L20.8641749,18.1204751 C21.1961465,18.1642484 21.4286924,18.4002216 21.4688472,18.7423548 L21.4750824,18.8523538 L21.4678171,18.9675593 C21.4246486,19.3025982 21.1922705,19.5388574 20.8555499,19.5795997 L20.7470425,19.5859353 L3.25,19.5859353 L3.14534744,19.5797049 C2.77265132,19.5350005 2.525,19.250082 2.525,18.8494841 C2.525,18.4512975 2.77030543,18.1646386 3.1443756,18.1193685 L3.25285992,18.113033 L4.35003719,18.1123023 L4.4,10.5767569 L4.40403631,10.3246942 C4.524824,6.55675169 7.34298069,3.38911146 11.0266305,2.90405757 L11.229889,2.87995432 L11.275,1.66770897 L11.2823355,1.55103724 C11.3211556,1.24947788 11.5116242,1.02739927 11.7956288,0.955808301 L11.897531,0.937079811 L12,0.930991914 Z M12,4.31312051 C8.70150639,4.31312051 5.97362451,6.99932148 5.85407645,10.3480678 L5.85000794,10.5758657 L5.849,18.0622956 L18.099,18.1123023 L18.15,10.5767635 L18.1459233,10.3480647 C18.0266869,7.00812062 15.3071214,4.31312051 12,4.31312051 Z" id="形状结合" fill="#FFFFFF" fill-rule="nonzero"></path>
|
||||
</g>
|
||||
<circle id="Oval-1-Copy-2" fill="#F5222D" cx="18" cy="6" r="3"></circle>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.4 KiB |
@ -8,8 +8,7 @@
|
||||
<rect id="矩形" x="0" y="0" width="24" height="24"></rect>
|
||||
<path d="M13.875,20.6585751 L13.9796526,20.6647179 C14.3523487,20.7094224 14.6,20.9943408 14.6,21.3949387 C14.6,21.793137 14.3546839,22.079785 13.9805499,22.1250542 L13.8720425,22.1313899 L10.125,22.1313023 L10.0203474,22.1251595 C9.64765132,22.080455 9.4,21.7955365 9.4,21.3949387 C9.4,20.9967404 9.64531608,20.7100924 10.0194501,20.6648232 L10.1279575,20.6584875 L13.875,20.6585751 Z M12,0.930991914 L12.114202,0.938656892 C12.4461465,0.982430206 12.6786924,1.21840343 12.7188472,1.56053658 L12.7250824,1.6705356 L12.724,2.83025932 L12.975759,2.90430031 L13.2244725,2.9413468 C16.687784,3.51732717 19.3536312,6.48703662 19.5838508,10.0724929 L19.5959741,10.3244915 L19.6000064,10.5775585 L19.6,18.0623023 L20.7499628,18.1131205 L20.8641749,18.1204751 C21.1961465,18.1642484 21.4286924,18.4002216 21.4688472,18.7423548 L21.4750824,18.8523538 L21.4678171,18.9675593 C21.4246486,19.3025982 21.1922705,19.5388574 20.8555499,19.5795997 L20.7470425,19.5859353 L3.25,19.5859353 L3.14534744,19.5797049 C2.77265132,19.5350005 2.525,19.250082 2.525,18.8494841 C2.525,18.4512975 2.77030543,18.1646386 3.1443756,18.1193685 L3.25285992,18.113033 L4.35003719,18.1123023 L4.4,10.5767569 L4.40403631,10.3246942 C4.524824,6.55675169 7.34298069,3.38911146 11.0266305,2.90405757 L11.229889,2.87995432 L11.275,1.66770897 L11.2823355,1.55103724 C11.3211556,1.24947788 11.5116242,1.02739927 11.7956288,0.955808301 L11.897531,0.937079811 L12,0.930991914 Z M12,4.31312051 C8.70150639,4.31312051 5.97362451,6.99932148 5.85407645,10.3480678 L5.85000794,10.5758657 L5.849,18.0622956 L18.099,18.1123023 L18.15,10.5767635 L18.1459233,10.3480647 C18.0266869,7.00812062 15.3071214,4.31312051 12,4.31312051 Z" id="形状结合" fill="#FFFFFF" fill-rule="nonzero"></path>
|
||||
</g>
|
||||
<circle id="Oval-1-Copy-2" fill="#F5222D" cx="18" cy="6" r="3"></circle>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.3 KiB |
22
src/views/abnormalWarning/alarmGrade.vue
Normal file
22
src/views/abnormalWarning/alarmGrade.vue
Normal file
@ -0,0 +1,22 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2024-09-12 14:55:26
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2024-09-12 15:00:14
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<dict-tag
|
||||
:type="DICT_TYPE.EQU_ALARM_LEVEL"
|
||||
:value="injectData.alarmGrade" />
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -34,6 +34,12 @@
|
||||
import Navbar from './components/Navbar';
|
||||
import moment from 'moment';
|
||||
import tableHeightMixin from '@/mixins/tableHeightMixin';
|
||||
import { listData } from '@/api/system/dict/data';
|
||||
import alarmGrade from './alarmGrade.vue'
|
||||
import {
|
||||
getHomeAlarmList
|
||||
} from '@/api/home';
|
||||
|
||||
export default {
|
||||
name: 'AbnormalWarning',
|
||||
mixins: [tableHeightMixin],
|
||||
@ -45,25 +51,28 @@ export default {
|
||||
type: 'input',
|
||||
label: '报警来源',
|
||||
placeholder: '报警来源',
|
||||
param: 'content',
|
||||
param: 'alarmSource',
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
type: 'datePicker',
|
||||
label: '时间段',
|
||||
selectOptions: [],
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
param: 'typeId',
|
||||
filterable: true,
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd',
|
||||
valueFormat: 'timestamp',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: '开始时间',
|
||||
endPlaceholder: '结束时间',
|
||||
param: 'alarmTime',
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: '报警级别',
|
||||
selectOptions: [],
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
param: 'typeId',
|
||||
param: 'alarmGrade',
|
||||
defaultSelect: '',
|
||||
filterable: true,
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
@ -75,60 +84,79 @@ export default {
|
||||
heightNum: 280,
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'createTime',
|
||||
prop: 'alarmTime',
|
||||
label: '报警时间',
|
||||
width: 180,
|
||||
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||
},
|
||||
{
|
||||
prop: 'productionLineName1',
|
||||
prop: 'alarmSource',
|
||||
label: '报警来源',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'productionLineName2',
|
||||
prop: 'alarmType',
|
||||
label: '报警类型',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'productionLineName3',
|
||||
prop: 'alarmGrade',
|
||||
label: '报警级别',
|
||||
showOverflowtooltip: true,
|
||||
subcomponent: alarmGrade
|
||||
},
|
||||
{
|
||||
prop: 'productionLineName4',
|
||||
prop: 'alarmReason',
|
||||
label: '报警原因',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'sectionName5',
|
||||
prop: 'alarmContent',
|
||||
label: '报警详情',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
],
|
||||
list: [
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
],
|
||||
list: [],
|
||||
listQuery: {
|
||||
alarmSource: undefined,
|
||||
alarmTime: undefined,
|
||||
alarmGrade: undefined,
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
created() {
|
||||
const queryParams = {
|
||||
pageNo: 1,
|
||||
pageSize: 99,
|
||||
dictType: 'equ_alarm_level',
|
||||
};
|
||||
listData(queryParams).then((response) => {
|
||||
this.formConfig[2].selectOptions = response.data.list;
|
||||
});
|
||||
this.getDataList()
|
||||
},
|
||||
methods: {
|
||||
buttonClick(val) {},
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
case 'search':
|
||||
this.listQuery.alarmSource = val.alarmSource;
|
||||
this.listQuery.alarmGrade = val.alarmGrade;
|
||||
this.listQuery.alarmTime = val.alarmTime ? val.alarmTime : null;
|
||||
this.getDataList();
|
||||
break;
|
||||
default:
|
||||
console.log(val);
|
||||
}
|
||||
},
|
||||
getDataList(){
|
||||
getHomeAlarmList(this.listQuery).then(response => {
|
||||
if(response.hasOwnProperty('data')){
|
||||
this.list = response.data;
|
||||
}else{
|
||||
this.list = []
|
||||
}
|
||||
});
|
||||
},
|
||||
toHome() {
|
||||
this.$router.push({ path: '/' });
|
||||
},
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
style="font-size: 24px; cursor: pointer"
|
||||
@click="toHome" /> -->
|
||||
<svg-icon
|
||||
icon-class="home-alarm-white"
|
||||
:icon-class="isAlarm ? 'home-alarm-white-circle' : 'home-alarm-white'"
|
||||
style="font-size: 24px; cursor: pointer"
|
||||
@click="toAlarm" />
|
||||
</div>
|
||||
@ -46,16 +46,15 @@
|
||||
import moment from 'moment';
|
||||
import { getUser } from '@/api/system/user.js';
|
||||
import { getPath } from '@/utils/ruoyi';
|
||||
import { getHomeGetAlarm } from '@/api/home';
|
||||
export default {
|
||||
name: 'navRight',
|
||||
data() {
|
||||
return {
|
||||
// topDate: '',
|
||||
// topTime: '',
|
||||
// timeZone: '',
|
||||
timer: '',
|
||||
dept: ' ',
|
||||
nickname: this.$store.getters.nickname,
|
||||
isAlarm: false,
|
||||
};
|
||||
},
|
||||
props: {
|
||||
@ -68,21 +67,18 @@ export default {
|
||||
},
|
||||
created() {
|
||||
this.getUserMsg();
|
||||
// this.getTime();
|
||||
this.getHomeGetAlarm();
|
||||
this.timer = setInterval(this.getHomeGetAlarm(), 3600000);
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
},
|
||||
// beforeDestroy() {
|
||||
// clearInterval(this.timer);
|
||||
// },
|
||||
methods: {
|
||||
// getTime() {
|
||||
// let _this = this;
|
||||
// this.timer = setInterval(function () {
|
||||
// _this.topDate = moment().format('YYYY/MM/DD');
|
||||
// let temp = moment().format('A-hh:mm').split('-');
|
||||
// _this.timeZone = temp[0];
|
||||
// _this.topTime = temp[1];
|
||||
// }, 1000);
|
||||
// },
|
||||
getHomeGetAlarm() {
|
||||
getHomeGetAlarm().then((response) => {
|
||||
this.isAlarm = response.data || false;
|
||||
});
|
||||
},
|
||||
getUserMsg() {
|
||||
let id = this.$store.getters.userId;
|
||||
getUser(id).then((res) => {
|
||||
|
||||
@ -3,50 +3,47 @@
|
||||
<div>
|
||||
<navbar />
|
||||
</div>
|
||||
<div class="date-tabs">
|
||||
<el-tabs v-model="activeName" :stretch="true">
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002日\u2002\u2002'"
|
||||
name="日"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002周\u2002\u2002'"
|
||||
name="周"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002月\u2002\u2002'"
|
||||
name="月"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002年\u2002\u2002'"
|
||||
name="年"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="current-date">(6.13-6.20)</div>
|
||||
<div class="current-time">
|
||||
<span style="display: inline-block; margin-right: 16px">
|
||||
{{ topTime + timeZone }}
|
||||
</span>
|
||||
<span>{{ topDate }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<el-row class="main-top" :gutter="16">
|
||||
<el-col :span="12" style="position: relative">
|
||||
<div class="title">
|
||||
<svg-icon icon-class="home-produce" />
|
||||
<span class="title-inner">生产总览</span>
|
||||
<div class="date-tabs">
|
||||
<el-tabs
|
||||
v-model="activeName"
|
||||
@tab-click="handleClick"
|
||||
:stretch="true">
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002日\u2002\u2002'"
|
||||
name="日"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002周\u2002\u2002'"
|
||||
name="周"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002月\u2002\u2002'"
|
||||
name="月"></el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u2002\u2002年\u2002\u2002'"
|
||||
name="年"></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
<div class="current-date">( {{ showTime }} )</div>
|
||||
</div>
|
||||
<el-row class="box">
|
||||
<el-col :span="6" class="num-box shadow">
|
||||
<div class="num-style">9,301.01</div>
|
||||
<div class="num-style">{{ homeProduce.quantity }}</div>
|
||||
<div class="unit-style">产量/千片</div>
|
||||
</el-col>
|
||||
<el-col :span="4" class="num-box shadow">
|
||||
<div class="num-style">94.34</div>
|
||||
<div class="num-style">{{ homeProduce.yieldRate }}</div>
|
||||
<div class="unit-style">良品率/%</div>
|
||||
</el-col>
|
||||
<el-col :span="8" class="num-box shadow">
|
||||
<div class="num-style">29,301.01</div>
|
||||
<div class="num-style">{{ homeProduce.endWorkOrderQuantity }}</div>
|
||||
<div class="unit-style">完成工单数量/千片</div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="num-box">
|
||||
<div class="num-style">1,340</div>
|
||||
<div class="num-style">{{ homeProduce.endOrderQuantity }}</div>
|
||||
<div class="unit-style">完成订单数量/个</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -55,22 +52,29 @@
|
||||
<div class="title">
|
||||
<svg-icon icon-class="home-device" />
|
||||
<span class="title-inner">设备总览</span>
|
||||
<!-- <div class="date-tabs">
|
||||
<div class="current-time">
|
||||
<span>
|
||||
{{ topTime + timeZone + ' '+ topDate }}
|
||||
</span>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<el-row class="box">
|
||||
<el-col :span="6" class="num-box shadow">
|
||||
<div class="num-style">2,931</div>
|
||||
<div class="num-style">{{ homeDevice.allEquipment }}</div>
|
||||
<div class="unit-style">设备总数/台</div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="num-box shadow">
|
||||
<div class="num-style">931</div>
|
||||
<div class="num-style">{{ homeDevice.onlineEquipment }}</div>
|
||||
<div class="unit-style">在线设备总数/台</div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="num-box shadow">
|
||||
<div class="num-style">7</div>
|
||||
<div class="num-style">{{ homeDevice.errorEquipment }}</div>
|
||||
<div class="unit-style">故障设备总数/台</div>
|
||||
</el-col>
|
||||
<el-col :span="6" class="num-box">
|
||||
<div class="num-style">0</div>
|
||||
<div class="num-style">{{ homeDevice.stopEquipment }}</div>
|
||||
<div class="unit-style">停机设备总数/台</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -81,6 +85,7 @@
|
||||
class="item"
|
||||
:class="{ shadow: index !== middleMenu.length - 1 }"
|
||||
v-for="(item, index) in middleMenu"
|
||||
@click="goPage(item)"
|
||||
:key="index">
|
||||
<div style="width: 160px; margin: 0 auto; padding-top: 20px">
|
||||
<svg-icon :icon-class="item.icon" style="font-size: 56px" />
|
||||
@ -105,14 +110,14 @@
|
||||
<div class="order-box">
|
||||
<div
|
||||
class="order-item"
|
||||
v-for="(item, index) in orderList"
|
||||
v-for="(item, index) in homeProduce.orderList"
|
||||
:key="index">
|
||||
<div>
|
||||
<span class="order-name">{{ item.name }}</span>
|
||||
<span class="order-value">{{ item.value }}%</span>
|
||||
<span class="order-name">{{ item.orderName }}</span>
|
||||
<span class="order-value">{{ item.completeRate * 100 }}%</span>
|
||||
</div>
|
||||
<el-progress
|
||||
:percentage="item.value"
|
||||
:percentage="item.completeRate * 100"
|
||||
:text-inside="false"
|
||||
:stroke-width="15"
|
||||
:show-text="false"></el-progress>
|
||||
@ -130,7 +135,7 @@
|
||||
:page="1"
|
||||
:limit="100000"
|
||||
:table-props="tableProps"
|
||||
:table-data="list"
|
||||
:table-data="homeDevice.list"
|
||||
:max-height="tableH" />
|
||||
</div>
|
||||
</el-col>
|
||||
@ -155,6 +160,13 @@
|
||||
import Navbar from './components/Navbar';
|
||||
import moment from 'moment';
|
||||
import tableHeightMixin from '@/mixins/tableHeightMixin';
|
||||
import {
|
||||
getHomeOrder,
|
||||
getHomeOrderNum,
|
||||
getHomeEquipment,
|
||||
getHomeEquipmentAlarmList,
|
||||
} from '@/api/home';
|
||||
|
||||
export default {
|
||||
name: 'Home',
|
||||
mixins: [tableHeightMixin],
|
||||
@ -175,69 +187,107 @@ export default {
|
||||
topTime: '',
|
||||
timeZone: '',
|
||||
middleMenu: [
|
||||
{ name: '工单管理', url: '', icon: 'home-work-menu' },
|
||||
{ name: '订单管理', url: '', icon: 'home-order-menu' },
|
||||
{ name: '设备管理', url: '', icon: 'home-device-menu' },
|
||||
{ name: '质量管理', url: '', icon: 'home-quality-menu' },
|
||||
{ name: '仓库管理', url: '', icon: 'home-store-menu' },
|
||||
],
|
||||
orderList: [
|
||||
{ name: '工单1', value: 50 },
|
||||
{ name: '工单2', value: 60 },
|
||||
{ name: '工单3', value: 30 },
|
||||
{ name: '工单4', value: 60 },
|
||||
{ name: '工单5', value: 10 },
|
||||
{ name: '工单6', value: 60 },
|
||||
{ name: '工单7', value: 40 },
|
||||
{ name: '工单8', value: 70 },
|
||||
{ name: '工单9', value: 90 },
|
||||
{ name: '生产管理', url: 'productLine24h', icon: 'home-work-menu' },
|
||||
{
|
||||
name: '能源管理',
|
||||
url: 'EnergyQuantityRealtime',
|
||||
icon: 'home-order-menu',
|
||||
},
|
||||
{ name: '设备管理', url: 'PlanConfig', icon: 'home-device-menu' },
|
||||
{ name: '质量管理', url: 'qualityScrapLog', icon: 'home-quality-menu' },
|
||||
{ name: '仓库管理', url: 'warehouse-info', icon: 'home-store-menu' },
|
||||
],
|
||||
heightNum: 640,
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'productionLineName',
|
||||
prop: 'equipmentName',
|
||||
label: '设备名称',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'sectionName',
|
||||
prop: 'alarmContent',
|
||||
label: '告警内容',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'createTime',
|
||||
prop: 'updateTime',
|
||||
label: '告警时间',
|
||||
width: 180,
|
||||
filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||
},
|
||||
],
|
||||
list: [
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
{ productionLineName: 1 },
|
||||
],
|
||||
homeProduce: {
|
||||
quantity: undefined,
|
||||
yieldRate: undefined,
|
||||
endWorkOrderQuantity: undefined,
|
||||
endOrderQuantity: undefined,
|
||||
orderList: [],
|
||||
},
|
||||
homeDevice: {
|
||||
allEquipment: undefined,
|
||||
onlineEquipment: undefined,
|
||||
errorEquipment: undefined,
|
||||
stopEquipment: undefined,
|
||||
list: [],
|
||||
},
|
||||
times: [],
|
||||
showTime: '',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getTime();
|
||||
this.handleClick();
|
||||
this.getHomeEquipment();
|
||||
this.showTime = moment(new Date()).subtract(0, 'days').format('YYYY-MM-DD');
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
},
|
||||
methods: {
|
||||
handleClick() {
|
||||
let start =
|
||||
Date.parse(new Date())
|
||||
let end =
|
||||
Date.parse(new Date())
|
||||
switch (this.activeName) {
|
||||
case '日':
|
||||
this.showTime = moment(new Date())
|
||||
.subtract(0, 'days')
|
||||
.format('YYYY-MM-DD');
|
||||
this.times = [start, end];
|
||||
break;
|
||||
case '周':
|
||||
start =
|
||||
moment(new Date()).subtract(6, 'days').format('x')
|
||||
this.showTime =
|
||||
moment(new Date()).subtract(6, 'days').format('MM-DD') +
|
||||
' ~ ' +
|
||||
moment(new Date()).subtract(0, 'days').format('MM-DD');
|
||||
this.times = [start, end];
|
||||
break;
|
||||
case '月':
|
||||
start =
|
||||
moment(new Date()).subtract(1, 'month').format('x')
|
||||
this.showTime =
|
||||
moment(new Date()).subtract(1, 'month').format('MM-DD') +
|
||||
' ~ ' +
|
||||
moment(new Date()).subtract(0, 'days').format('MM-DD');
|
||||
this.times = [start, end];
|
||||
break;
|
||||
case '年':
|
||||
start =
|
||||
moment(new Date()).subtract(1, 'year').format('x')
|
||||
this.showTime =
|
||||
moment(new Date()).subtract(1, 'year').format('YYYY') +
|
||||
' ~ ' +
|
||||
moment(new Date()).subtract(0, 'days').format('YYYY');
|
||||
this.times = [start, end];
|
||||
break;
|
||||
default:
|
||||
console.log(val);
|
||||
}
|
||||
this.getHomeOrder();
|
||||
},
|
||||
getTime() {
|
||||
let _this = this;
|
||||
this.timer = setInterval(function () {
|
||||
@ -247,6 +297,59 @@ export default {
|
||||
_this.topTime = temp[1];
|
||||
}, 1000);
|
||||
},
|
||||
getHomeOrder() {
|
||||
getHomeOrder(this.times).then((response) => {
|
||||
if (response.hasOwnProperty('data')) {
|
||||
this.homeProduce.quantity = response.data.quantity;
|
||||
this.homeProduce.yieldRate = response.data.yieldRate * 100;
|
||||
this.homeProduce.endWorkOrderQuantity =
|
||||
response.data.endWorkOrderQuantity;
|
||||
this.homeProduce.orderList = response.data.orderMonitorVO;
|
||||
} else {
|
||||
this.homeProduce = {
|
||||
quantity: undefined,
|
||||
yieldRate: undefined,
|
||||
endWorkOrderQuantity: undefined,
|
||||
endOrderQuantity: undefined,
|
||||
orderList: [],
|
||||
};
|
||||
}
|
||||
});
|
||||
getHomeOrderNum(this.times).then((response) => {
|
||||
if (response.hasOwnProperty('data')) {
|
||||
this.homeProduce.endOrderQuantity = response.data.endOrderQuantity;
|
||||
} else {
|
||||
this.homeProduce.endOrderQuantity = '-';
|
||||
}
|
||||
});
|
||||
},
|
||||
getHomeEquipment() {
|
||||
getHomeEquipment().then((response) => {
|
||||
if (response.hasOwnProperty('data')) {
|
||||
this.homeDevice.allEquipment = response.data.allEquipment;
|
||||
this.homeDevice.onlineEquipment = response.data.onlineEquipment;
|
||||
this.homeDevice.errorEquipment = response.data.errorEquipment;
|
||||
this.homeDevice.stopEquipment = response.data.stopEquipment;
|
||||
} else {
|
||||
this.homeDevice = {
|
||||
allEquipment: undefined,
|
||||
onlineEquipment: undefined,
|
||||
errorEquipment: undefined,
|
||||
stopEquipment: undefined,
|
||||
};
|
||||
}
|
||||
});
|
||||
getHomeEquipmentAlarmList().then((response) => {
|
||||
if (response.hasOwnProperty('data')) {
|
||||
this.homeDevice.list = response.data;
|
||||
} else {
|
||||
this.homeDevice.list = [];
|
||||
}
|
||||
});
|
||||
},
|
||||
goPage(val) {
|
||||
this.$router.push({ name: val.url });
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -260,56 +363,14 @@ export default {
|
||||
height: 300px;
|
||||
width: 100%;
|
||||
}
|
||||
.date-tabs {
|
||||
padding-left: 40px;
|
||||
padding-top: 20px;
|
||||
position: relative;
|
||||
}
|
||||
:deep(.date-tabs) {
|
||||
.el-tabs__header {
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.el-tabs__item {
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 36px !important;
|
||||
height: 36px;
|
||||
}
|
||||
.el-tabs__item.is-active {
|
||||
color: #0b58ff;
|
||||
}
|
||||
}
|
||||
.current-date {
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
position: absolute;
|
||||
left: 260px;
|
||||
top: 14px;
|
||||
}
|
||||
.current-time {
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
position: absolute;
|
||||
right: 38px;
|
||||
top: 14px;
|
||||
}
|
||||
.main-top {
|
||||
width: 100%;
|
||||
padding: 0 20px 0 40px;
|
||||
padding: 10px 20px 0 40px;
|
||||
.title {
|
||||
position: absolute;
|
||||
left: 34px;
|
||||
top: 20px;
|
||||
width: 180px;
|
||||
width: 90%;
|
||||
font-size: 32px;
|
||||
z-index: 10;
|
||||
.title-inner {
|
||||
@ -318,12 +379,53 @@ export default {
|
||||
top: 5px;
|
||||
font-size: 24px;
|
||||
}
|
||||
.date-tabs {
|
||||
position: absolute;
|
||||
right: 100px;
|
||||
top: 5px;
|
||||
font-size: 18px;
|
||||
}
|
||||
:deep(.date-tabs) {
|
||||
.el-tabs__header {
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.el-tabs__item {
|
||||
font-size: 18px;
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 20px !important;
|
||||
height: 24px;
|
||||
}
|
||||
.el-tabs__item.is-active {
|
||||
color: #0b58ff;
|
||||
}
|
||||
}
|
||||
.current-date {
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 5px;
|
||||
}
|
||||
// .current-time {
|
||||
// width: 160px;
|
||||
// font-size: 18px;
|
||||
// position: absolute;
|
||||
// right: -20px;
|
||||
// top: 5px;
|
||||
// }
|
||||
}
|
||||
.box {
|
||||
background-color: #fff;
|
||||
border-radius: 24px;
|
||||
height: 192px;
|
||||
padding: 40px 24px 32px 24px;
|
||||
height: 232px;
|
||||
padding: 60px 24px 32px 24px;
|
||||
.num-box {
|
||||
height: 120px;
|
||||
padding-top: 26px;
|
||||
|
||||
@ -144,21 +144,24 @@ export default {
|
||||
this.chart.getZr().off('click');
|
||||
this.chart.getZr().on('click', function () {
|
||||
if (_this.targetId !== '') {
|
||||
switch (_this.targetId) {
|
||||
case 1:
|
||||
_this.$router.push({
|
||||
path: 'warehouse-manage1/InventoryOverview/' + _this.targetId,
|
||||
});
|
||||
break;
|
||||
case '1818175999715164161':
|
||||
_this.$router.push({
|
||||
path: 'warehouse-manage2/InventoryOverview/' + _this.targetId,
|
||||
});
|
||||
break;
|
||||
default:
|
||||
console.log(_this.targetId);
|
||||
break;
|
||||
}
|
||||
_this.$router.push({
|
||||
path: `warehouse-manage${_this.targetId}/InventoryOverview/` + _this.targetId,
|
||||
});
|
||||
// switch (_this.targetId) {
|
||||
// case 1:
|
||||
// _this.$router.push({
|
||||
// path: 'warehouse-manage1/InventoryOverview/' + _this.targetId,
|
||||
// });
|
||||
// break;
|
||||
// case '1818175999715164161':
|
||||
// _this.$router.push({
|
||||
// path: 'warehouse-manage2/InventoryOverview/' + _this.targetId,
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// console.log(_this.targetId);
|
||||
// break;
|
||||
// }
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2024-07-02 15:56:48
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2024-08-02 14:57:52
|
||||
* @LastEditTime: 2024-09-23 09:15:30
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -59,21 +59,24 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
toPage(i) {
|
||||
switch (i.id) {
|
||||
case 1:
|
||||
this.$router.push({
|
||||
path: 'warehouse-manage1/InventoryOverview/' + i.id,
|
||||
this.$router.push({
|
||||
path: `warehouse-manage${i.id}/InventoryOverview/` + i.id,
|
||||
});
|
||||
break;
|
||||
case '1818175999715164161':
|
||||
this.$router.push({
|
||||
path: 'warehouse-manage2/InventoryOverview/' + i.id,
|
||||
});
|
||||
break;
|
||||
default:
|
||||
console.log(i.id);
|
||||
break;
|
||||
}
|
||||
// switch (i.id) {
|
||||
// case 1:
|
||||
// this.$router.push({
|
||||
// path: 'warehouse-manage1/InventoryOverview/' + i.id,
|
||||
// });
|
||||
// break;
|
||||
// case '1818175999715164161':
|
||||
// this.$router.push({
|
||||
// path: 'warehouse-manage2/InventoryOverview/' + i.id,
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// console.log(i.id);
|
||||
// break;
|
||||
// }
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user