<template>
|
<div class="page-header">
|
<div class="page-header-container">
|
<flex-layout direction="row">
|
<div class="page-header-left" slot="header">
|
<img class="header-first-logo" :src="logoUrl" v-if="logoConfig.value">
|
<!-- <img class="header-first-logo" src="../assets/images/gjdx-log.png">-->
|
<span class="header-carve-up" v-if="logoConfig.value"></span>
|
<span>通信电源监控主站</span>
|
<!-- <span>综合电力监控平台</span>-->
|
<span class="sys-version">{{ version }}</span>
|
</div>
|
<div class="page-header-content">
|
<div class="header-info-list">
|
<el-tooltip class="item" effect="dark" :content="serverInfo.disk.message" placement="bottom">
|
<div class="header-info-item">
|
<progress-bar v-if="showProgress" :options="options" :value="serverInfo.disk.progress">
|
</progress-bar>
|
</div>
|
</el-tooltip>
|
<el-tooltip class="item" effect="dark" :content="serverInfo.cpu.message" placement="bottom">
|
<div class="header-info-item">
|
<progress-bar v-if="showProgress" :options="options" :value="serverInfo.cpu.progress">
|
</progress-bar>
|
</div>
|
</el-tooltip>
|
<el-tooltip class="item" effect="dark" :content="serverInfo.memory.message" placement="bottom">
|
<div class="header-info-item">
|
<progress-bar v-if="showProgress" :options="options"
|
:value="serverInfo.memory.progress"></progress-bar>
|
</div>
|
</el-tooltip>
|
<el-tooltip class="item" effect="dark" :content="serverInfo.linkNum.message" placement="bottom">
|
<div class="header-info-item">
|
<progress-bar v-if="showProgress" :options="options"
|
:value="serverInfo.linkNum.progress"></progress-bar>
|
</div>
|
</el-tooltip>
|
<div class="header-info-item" style="margin-left: 60px;">
|
<progress-state icon="el-icon-fuwuqi" :state="processInfo.sql" :content="processSqlMsg">
|
</progress-state>
|
<progress-state icon="el-icon-WIFIwofi" :state="processInfo.link" :content="processLinkMsg">
|
</progress-state>
|
<progress-state icon="el-icon-dianchi" :state="processInfo.behind"
|
:content="processBehindMsg"></progress-state>
|
<progress-state icon="el-icon-gaojing" @click.native="alarmAlert()"
|
:state="processInfo.alarm" :content="processAlarmMsg"></progress-state>
|
<progress-state icon="el-icon-jihua" :state="processInfo.displan"
|
:content="processDisplanMsg"></progress-state>
|
<progress-state icon="el-icon-tingdian" :state="processInfo.power"
|
:content="processPowerMsg"></progress-state>
|
<progress-state icon="el-icon-jiankong" :state="processInfo.control"
|
:content="processControlMsg"></progress-state>
|
<progress-state icon="el-icon-pifu" :state="1" :content="themeInfo"
|
@handleClick="handleClick"></progress-state>
|
</div>
|
</div>
|
<div class="data-totals">
|
<hdw-badge-btn text="电源告警数" :value="numbers.powerWarn" @click="goPages('powerWarn')">
|
</hdw-badge-btn>
|
<hdw-badge-btn text="机房停电数" :value="numbers.powerOff" @click="goPages('powerOff')">
|
</hdw-badge-btn>
|
<hdw-badge-btn text="电池告警数" :value="numbers.battWarn" @click="goPages('battWarn')">
|
</hdw-badge-btn>
|
<hdw-badge-btn text="设备告警数" :value="numbers.devWarn" @click="goPages('devWarn')">
|
</hdw-badge-btn>
|
<!-- <hdw-badge-btn text="容量落后单体数量" :value="numbers.lowMon" @click="goPages('lowMon')"></hdw-badge-btn>-->
|
<!-- <hdw-badge-btn text="未完成放电计划数" :value="numbers.plan" @click="goPages('plan')"></hdw-badge-btn>-->
|
<hdw-badge-btn text="核容测试设备" :value="numbers.nuclear" @click="goPages('nuclear')">
|
</hdw-badge-btn>
|
<hdw-badge-btn text="严重告警数" :value="numbers.levelNum" @click="goPages('powerBoxAlarm')">
|
</hdw-badge-btn>
|
<div class="term-date" v-show="termDateShow">
|
<span>有效期：</span>
|
<span class="term-date-value">{{ termDate }}</span>
|
<span>天</span>
|
</div>
|
</div>
|
<!-- <div class="system-tools">-->
|
<!-- <div class="tools-item"><i class="iconfont el-icon-pifu-"></i></div>-->
|
<!-- </div>-->
|
</div>
|
<div class="page-header-right" slot="footer">
|
<div class="hdw-avatar">
|
<span class="hdw-avatar-icon">
|
<i class="iconfont el-icon-Userselect"></i>
|
</span>
|
<el-dropdown @command="commandClick">
|
<span class="hdw-avatar-text">
|
{{ username }}<i class="el-icon-arrow-down el-icon--right"
|
v-if="!$store.state.user.autoLogin"></i>
|
</span>
|
<el-dropdown-menu slot="dropdown" v-if="!$store.state.user.autoLogin">
|
<el-dropdown-item command="passwordChange">密码修改</el-dropdown-item>
|
<el-dropdown-item command="outSystem">安全退出</el-dropdown-item>
|
</el-dropdown-menu>
|
</el-dropdown>
|
<img v-if="showLogo" src="../assets/images/fuguang_logo.jpg" class="fuguang-logo">
|
</div>
|
</div>
|
</flex-layout>
|
</div>
|
<el-drawer title="我是标题" :visible.sync="pifuDrawer" size="360px" :with-header="false">
|
<pifu-list></pifu-list>
|
</el-drawer>
|
<!-- 密码修改 -->
|
<el-dialog title="密码修改" width="400px" :visible.sync="pwd.show" :close-on-click-modal="false" top="0"
|
class="dialog-center" :modal-append-to-body="false">
|
<pwd-change v-if="pwd.show" :visible.sync="pwd.show"></pwd-change>
|
</el-dialog>
|
<!-- 短信猫和声光告警的配置 -->
|
<el-dialog title="短信猫和声光告警的配置" width="600px" :visible.sync="alarmAlertStatus" :close-on-click-modal="false"
|
top="0" class="dialog-center" :modal-append-to-body="false">
|
<alarm-alert v-if="alarmAlertStatus" :visible.sync="alarmAlertStatus"></alarm-alert>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import config from '../../package.json'
|
import HdwBadgeBtn from './HdwBadgeBtn'
|
import ProgressState from './ProcessState'
|
import PifuList from "@/pages/dataTest/PifuList";
|
import PwdChange from "@/components/PwdChange";
|
import alarmAlert from "@/components/alarmAlert";
|
import platform from '@/assets/js/config';
|
import nfdw from '@/assets/images/nfdw-log.png';
|
import gjdw from '@/assets/images/gjdw-log.png';
|
import gjdx from '@/assets/images/gjdx-log.png';
|
import {
|
Timeout
|
} from '../assets/js/tools'
|
|
export default {
|
components: {
|
HdwBadgeBtn,
|
ProgressState,
|
PifuList,
|
PwdChange,
|
alarmAlert
|
},
|
data() {
|
return {
|
alarmAlertStatus: false,
|
skinActive: 'science-blue',
|
logoConfig: platform.logo,
|
showProgress: false,
|
pifuDrawer: false,
|
showLogo: false,
|
version: '',
|
username: sessionStorage.getItem('username'),
|
termDateShow: true,
|
termDate: 0,
|
options: {
|
text: {
|
color: '#041F6C',
|
shadowEnable: true,
|
shadowColor: 'transparent',
|
fontSize: 12,
|
fontWeight: 'bold',
|
fontFamily: 'Helvetica',
|
dynamicPosition: false,
|
hideText: false
|
},
|
progress: {
|
color: '#f06824',
|
backgroundColor: '#FFE329'
|
},
|
layout: {
|
height: 15,
|
width: 60,
|
verticalTextAlign: 70,
|
horizontalTextAlign: 35,
|
zeroOffset: 0,
|
strokeWidth: 30,
|
progressPadding: 0,
|
type: 'line'
|
}
|
},
|
numbers: {
|
lowMon: 0,
|
powerOff: 0,
|
battWarn: 0,
|
devWarn: 0,
|
plan: 0,
|
nuclear: 0,
|
powerWarn: 0,
|
levelNum:0,
|
},
|
serverInfo: {
|
disk: {
|
progress: 0,
|
message: '服务器数据磁盘总量：未知;剩余：未知'
|
},
|
cpu: {
|
progress: 0,
|
message: 'TM:未知'
|
},
|
memory: {
|
progress: 0,
|
message: 'FM:未知',
|
},
|
linkNum: {
|
progress: 0,
|
message: 'DBC:未知'
|
},
|
},
|
processInfo: {
|
// 0:异常 1:正常 2:暂未开启
|
alarm: 0, //告警标识位
|
behind: 0, //落后标识位
|
displan: 0, //放电计划标识位
|
power: 0, //机房停电标识位
|
control: 0, //线程监控标识位
|
sql: 0, //服务器数据实时更新
|
link: 0, //服务器连接
|
},
|
value: 0,
|
timer: new Timeout(),
|
pwd: {
|
show: false,
|
}
|
}
|
},
|
methods: {
|
alarmAlert() {
|
this.alarmAlertStatus = !this.alarmAlertStatus;
|
},
|
handleClick() {
|
this.pifuDrawer = true;
|
},
|
outSystem() {
|
this.$router.push('/login');
|
},
|
passwordChange() {
|
this.pwd.show = true;
|
},
|
commandClick(name) {
|
switch (name) {
|
case 'outSystem':
|
this.outSystem();
|
break;
|
case "passwordChange":
|
this.passwordChange();
|
break;
|
default:
|
this.$layer.msg('该功能暂未开放！');
|
break;
|
}
|
},
|
startSearch() {
|
this.timer.start(() => {
|
this.$axios.all([
|
this.searchAlmNum(), this.searchLowMonNum(),
|
this.searchPowerOffNum(), this.searchDevAlarmNum(),
|
this.searchNotComplanNum(), this.searchServerState(),
|
this.searchProcessState(), this.search61850Nuclear(),
|
this.searchPowerWarnNum(),this.getSeriousAlarmCount(),
|
]).then(() => {
|
this.timer.open();
|
}).catch(error => {
|
console.log(error);
|
})
|
}, 4000);
|
},
|
// 查询电池告警总数
|
searchAlmNum() {
|
this.$apis.top.searchAlmNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
this.numbers.battWarn = rs.sum;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
// 查询落后单体总数
|
searchLowMonNum() {
|
this.$apis.top.searchLowMonNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
this.numbers.lowMon = rs.sum;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
// 查询机房停电总数
|
searchPowerOffNum() {
|
this.$apis.top.searchPowerOffNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
this.numbers.powerOff = rs.sum;
|
}).catch(error => {
|
console.log(error);
|
});
|
},
|
// 查询设备实时告警总数
|
searchDevAlarmNum() {
|
this.$apis.top.searchDevAlarmNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
this.numbers.devWarn = rs.sum;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
searchNotComplanNum() {
|
this.$apis.top.searchNotComplanNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
|
this.numbers.plan = rs.sum;
|
}).catch(error => {
|
console.log(error);
|
})
|
},
|
// 查询正在核容测试的信息
|
search61850Nuclear() {
|
this.$apis.top.search61850Nuclear().then(res => {
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
let data = rs.data;
|
this.numbers.nuclear = data.length;
|
} else {
|
this.numbers.nuclear = 0;
|
}
|
|
}).catch(error => {
|
|
});
|
},
|
// 查询电源告警个数
|
searchPowerWarnNum() {
|
this.$apis.top.searchPowerWarnNum().then(res => {
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
this.numbers.powerWarn = rs.data;
|
} else {
|
this.numbers.powerWarn = 0;
|
}
|
}).catch(error => {
|
|
});
|
},
|
// 查询紧急告警个数
|
getSeriousAlarmCount() {
|
this.$apis.top.getSeriousAlarmCount().then(res => {
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
this.numbers.levelNum = rs.data;
|
} else {
|
this.numbers.levelNum = 0;
|
}
|
}).catch(error => {
|
|
});
|
},
|
// 查询服务器信息
|
searchServerState() {
|
this.$apis.top.searchServerState().then(res => {
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
let data = rs.data[0];
|
let totalDiscSpace = data.total_disc_space;
|
// 设置服务器磁盘信息
|
this.serverInfo.disk.progress = data.diskRate;
|
this.serverInfo.disk.message = '服务器数据磁盘总量' + (data.total_disc_space - data
|
.free_disc_space) + 'G/' + data.total_disc_space + 'G';
|
|
// 设置服务器cpu信息
|
this.serverInfo.cpu.progress = data.server_cpu_rate;
|
this.serverInfo.cpu.message = 'CPU使用率:' + data.server_cpu_rate + '/100';
|
|
// 设置服务器内存的信息
|
this.serverInfo.memory.progress = data.memRate;
|
this.serverInfo.memory.message = '服务器内存:' + (data.total_mem - data.free_men).toHold(2) +
|
'G/' + data.total_mem + 'G';
|
|
// 设置服务器的连接数
|
this.serverInfo.linkNum.progress = data.connRate;
|
this.serverInfo.linkNum.message = 'DBC:' + data.db_conn_count + '/' + data.db_conn_max;
|
|
// 更新服务器更新和连接状态
|
var nowtime = new Date((data.note).replace(/\-/g, "/"));
|
var sertime = new Date((data.server_datetime).replace(/\-/g, "/"));
|
var timelong = Math.abs(parseInt(sertime - nowtime));
|
if ((timelong / (1000 * 60)) > 2) {
|
this.processInfo.sql = 0;
|
} else {
|
this.processInfo.sql = 1;
|
}
|
this.processInfo.link = 1;
|
} else {
|
this.processInfo.sql = 0;
|
this.processInfo.link = 0;
|
}
|
}).catch(error => {
|
console.log(error);
|
this.processInfo.sql = 0;
|
this.processInfo.link = 0;
|
})
|
},
|
// 查询线程状态
|
searchProcessState() {
|
this.$apis.dataMager.threadMager.search().then(res => {
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
let alarm_batt = false; //电池告警
|
let alarm_dev = false; //设备告警
|
let alarm_cap = false; //容量告警
|
let badmon = false; //落后单体
|
//console.log(rs.data);
|
// 遍历并处理数据
|
rs.data.forEach(item => {
|
switch (item.ServerName) {
|
// 告警线程
|
case 'BMS_FBSDEV_ALARM':
|
if (item.ProcessName == 'BMS_FBSDEV_ALARM_BATT') {
|
if (item.ServerFlag == 0) {
|
alarm_batt = 0;
|
} else {
|
alarm_batt = this.checkTimeOut2(item);
|
}
|
} else if (item.ProcessName == 'BMS_FBSDEV_ALARM_DEV') {
|
if (item.ServerFlag == 0) {
|
alarm_dev = 0;
|
} else {
|
alarm_dev = this.checkTimeOut2(item);
|
}
|
}
|
|
if (this.processInfo.alarm == 2 || item.ServerFlag == 2) {
|
this.processInfo.alarm = 2;
|
} else {
|
this.processInfo.alarm = alarm_batt && alarm_batt;
|
}
|
break;
|
// 电池落后
|
case 'BMS_FBSDEV_BADBATT':
|
if (item.ProcessName == 'BMS_FBSDEV_BADBATT_MON') {
|
//落后单体线程
|
if (item.ServerFlag == 0) {
|
badmon = 0;
|
} else {
|
badmon = this.checkTimeOut2(item);
|
}
|
} else if (item.ProcessName == 'BMS_FBSDEV_BADBATT_CAP') {
|
//容量告警线程
|
if (item.ServerFlag == 0) {
|
alarm_cap = 0;
|
} else {
|
alarm_cap = this.checkTimeOut2(item);
|
}
|
}
|
if (this.processInfo.behind == 2 || item.ServerFlag == 2) {
|
this.processInfo.behind = 2;
|
|
} else {
|
this.processInfo.behind = badmon && alarm_cap;
|
}
|
break;
|
// 放电计划线程
|
case 'BMS_FBSDEV_PLAN':
|
if (item.ProcessName == 'BMS_FBSDEV_PLAN') {
|
if (item.ServerFlag == 0) {
|
this.processInfo.displan = 0;
|
} else {
|
this.processInfo.displan = this.checkTimeOut2(item);
|
}
|
}
|
if (this.processInfo.displan == 2 || item.ServerFlag == 2) {
|
this.processInfo.displan = 2;
|
}
|
break;
|
case 'BMS_FBSDEV_POWER_FAIL':
|
if (item.ProcessName == 'BMS_FBSDEV_POWER_FAIL') {
|
if (item.ServerFlag == 0) {
|
this.processInfo.power = 0;
|
} else {
|
this.processInfo.power = this.checkTimeOut2(item);
|
}
|
}
|
if (this.processInfo.power == 2 || item.ServerFlag == 2) {
|
this.processInfo.power = 2;
|
}
|
break;
|
// 线程监控线程
|
case 'BMS_FBSDEV_LISTEN':
|
if (item.ProcessName == 'BMS_FBSDEV_LISTEN') {
|
if (item.ServerFlag == 0) {
|
this.processInfo.control = 0;
|
} else {
|
this.processInfo.control = this.checkTimeOut2(item);
|
}
|
}
|
if (this.processInfo.control == 2 || item.ServerFlag == 2) {
|
this.processInfo.control = 2;
|
}
|
break;
|
}
|
});
|
}
|
}).catch(error => {
|
console.log(error);
|
});
|
},
|
checkTimeOut2(temp) {
|
var flag = 0;
|
if (temp != undefined) {
|
let startTime = new Date(temp.ProcessTime);
|
let endTime = new Date(temp.note);
|
let totalms = (endTime.getTime() - startTime.getTime()) / 1000;
|
if (totalms < temp.OutTime) {
|
flag = 1;
|
}
|
}
|
return flag;
|
},
|
goPages(type) {
|
let message = {
|
cmd: 'syncPage',
|
params: {}
|
};
|
switch (type) {
|
case 'powerOff':
|
message.params = {
|
pageInfo: {
|
label: "机房停电查询",
|
name: "powercutMager",
|
src: "#/dataMager/powercut",
|
closable: true
|
}
|
};
|
break;
|
case 'battWarn':
|
message.params = {
|
pageInfo: {
|
label: "电池告警实时查询",
|
name: "batteryrTimequery",
|
src: "#/batteryrTimequery",
|
closable: true
|
}
|
};
|
break;
|
case 'devWarn':
|
message.params = {
|
pageInfo: {
|
label: "设备告警实时查询",
|
name: "deviceTimequery",
|
src: "#/deviceTimequery",
|
closable: true
|
}
|
};
|
break;
|
case "nuclear":
|
message.params = {
|
pageInfo: {
|
label: "核容测试数据",
|
name: "btsStatusTest",
|
src: "#/dataMager/btsStatus?workStauts=2",
|
closable: true
|
}
|
};
|
break;
|
case "powerWarn":
|
message.params = {
|
pageInfo: {
|
label: "通信电源实时告警",
|
name: "powerBoxAlarm",
|
src: "#/powerBoxAlarm",
|
closable: true
|
}
|
};
|
break;
|
case "powerBoxAlarm":
|
message.params = {
|
pageInfo: {
|
label: "通讯电源实时告警",
|
name: "powerBoxAlarm",
|
src: "#/powerBoxAlarm?level=1",
|
closable: true
|
}
|
};
|
break;
|
default:
|
message = false;
|
this.$layer.msg('该功能暂未开放！');
|
break;
|
}
|
if (message) {
|
this.$emit('handle-message', message);
|
}
|
},
|
changeSkin() {
|
this.$nextTick(() => {
|
this.showProgress = true;
|
if (this.skinActive == 'science-green') {
|
this.options.progress.color = '#fb8d1a';
|
this.options.progress.backgroundColor = '#1ccfe5';
|
} else if (this.skinActive == 'science-blue') {
|
this.options.progress.color = '#f06824';
|
this.options.progress.backgroundColor = '#FFE329';
|
} else if (this.skinActive == 'science-black') {
|
this.options.progress.color = '#ff6502';
|
this.options.progress.backgroundColor = '#fffffe';
|
}
|
})
|
},
|
getLicenseResTime() {
|
this.$apis.license.getLicenseResTime().then(res => {
|
let rs = JSON.parse(res.data.result);
|
console.log(rs);
|
if (rs.code == 1) {
|
this.termDateShow = true;
|
this.termDate = rs.data;
|
} else if (rs.code == 2) {
|
this.termDateShow = false;
|
}
|
}).catch(error => {
|
console.log(error);
|
});
|
},
|
searchVersion() {
|
this.$apis.pageSetting.realTime.searchVersion().then(res=>{
|
let rs = JSON.parse(res.data.result);
|
if(rs.code == 1) {
|
let data = rs.data[0];
|
this.version = data.param;
|
}
|
}).catch(error=>{
|
|
});
|
}
|
},
|
computed: {
|
processAlarmMsg() {
|
let result = '未知';
|
switch (this.processInfo.alarm) {
|
case 0:
|
result = '告警监测线程：异常';
|
break;
|
case 1:
|
result = '告警监测线程：正常';
|
break;
|
case 2:
|
result = '告警监测线程：未启用';
|
break;
|
}
|
return result;
|
},
|
processBehindMsg() {
|
let result = '未知';
|
switch (this.processInfo.behind) {
|
case 0:
|
result = '落后单体监测线程：异常';
|
break;
|
case 1:
|
result = '落后单体监测线程：正常';
|
break;
|
case 2:
|
result = '落后单体监测线程：未启用';
|
break;
|
}
|
return result;
|
},
|
processDisplanMsg() {
|
let result = '未知';
|
switch (this.processInfo.displan) {
|
case 0:
|
result = '放电计划监测线程：异常';
|
break;
|
case 1:
|
result = '放电计划监测线程：正常';
|
break;
|
case 2:
|
result = '放电计划监测线程：未启用';
|
break;
|
}
|
return result;
|
},
|
processPowerMsg() {
|
let result = '未知';
|
switch (this.processInfo.power) {
|
case 0:
|
result = '机房停电监测线程：异常';
|
break;
|
case 1:
|
result = '机房停电监测线程：正常';
|
break;
|
case 2:
|
result = '机房停电监测线程：未启用';
|
break;
|
}
|
return result;
|
},
|
processControlMsg() {
|
let result = '未知';
|
switch (this.processInfo.control) {
|
case 0:
|
result = '线程监控程序运行：异常';
|
break;
|
case 1:
|
result = '线程监控程序运行：正常';
|
break;
|
case 2:
|
result = '线程监控程序运行：未启用';
|
break;
|
}
|
return result;
|
},
|
processSqlMsg() {
|
let result = '未知';
|
switch (this.processInfo.sql) {
|
case 0:
|
result = '服务器实时更新数据：异常';
|
break;
|
case 1:
|
result = '服务器实时更新数据：正常';
|
break;
|
}
|
return result;
|
},
|
processLinkMsg() {
|
let result = '未知';
|
switch (this.processInfo.link) {
|
case 0:
|
result = '服务器连接：异常';
|
break;
|
case 1:
|
result = '服务器连接：正常';
|
break;
|
}
|
return result;
|
},
|
themeInfo() {
|
return "当前主题：" + this.$store.state.theme.themeName;
|
},
|
logoUrl() {
|
let logoConfig = this.logoConfig;
|
let image = gjdw;
|
switch (logoConfig.fileName) {
|
case "nfdw":
|
image = nfdw
|
break;
|
case "gjdx":
|
image = gjdx;
|
break;
|
}
|
return image;
|
}
|
},
|
created() {
|
this.skinActive = localStorage.getItem('activeSkin');
|
window.addEventListener('activeSkin', (e) => {
|
this.showProgress = false;
|
this.skinActive = e.newValue;
|
this.changeSkin();
|
});
|
this.changeSkin();
|
},
|
mounted() {
|
// 启动请求
|
this.startSearch();
|
|
// 查询剩余天数
|
this.getLicenseResTime();
|
|
// 查询版本
|
this.searchVersion();
|
},
|
destroyed() {
|
this.timer.stop();
|
}
|
}
|
</script>
|
|
<style scoped>
|
.page-header-container {
|
height: 70px;
|
}
|
|
.page-header-content {
|
position: relative;
|
height: 100%;
|
overflow: hidden;
|
padding-top: 5px;
|
box-sizing: border-box;
|
}
|
|
.page-header-left {
|
height: 100%;
|
display: flex;
|
align-items: center;
|
padding-right: 130px;
|
}
|
|
.page-header-left img {
|
height: 40px;
|
vertical-align: middle;
|
}
|
|
.page-header-left span {
|
font-size: 33px;
|
font-weight: bold;
|
letter-spacing: 4px;
|
}
|
|
.page-header-left span.sys-version {
|
font-size: 24px;
|
margin-left: 4px;
|
font-weight: normal;
|
padding-top: 8px;
|
}
|
|
.data-totals {
|
padding-left: 18px;
|
}
|
|
.data-totals-item {
|
margin-right: 18px;
|
}
|
|
.header-info-list {
|
padding-left: 18px;
|
display: flex;
|
align-items: center;
|
}
|
|
.header-info-item {
|
display: inline-block;
|
min-width: 85Px;
|
padding-top: 4px;
|
padding-bottom: 2px;
|
}
|
|
.info-banner {
|
display: inline-block;
|
color: #FFFFFF;
|
background-color: blue;
|
}
|
|
.info-banner-text {
|
display: inline-block;
|
padding-top: 8px;
|
padding-bottom: 8px;
|
}
|
|
.hdw-avatar {
|
display: inline-block;
|
margin-top: 10px;
|
margin-right: 16px;
|
cursor: pointer;
|
color: #e4e3e3;
|
}
|
|
.hdw-avatar:hover {
|
color: #FFFFFF;
|
}
|
|
.hdw-avatar:hover .el-icon-arrow-down {
|
transform: rotate(180deg);
|
}
|
|
.hdw-avatar-icon {
|
display: inline-flex;
|
width: 38px;
|
height: 38px;
|
border-radius: 50%;
|
justify-content: center;
|
background-color: #4ba1fa;
|
align-items: center;
|
color: #032c8f;
|
}
|
|
.hdw-avatar-icon .iconfont {
|
font-size: 16px;
|
}
|
|
.hdw-avatar-text {
|
color: #4ba1fa;
|
margin-left: 8px;
|
}
|
|
.hdw-avatar-text .el-icon-arrow-down {
|
margin-left: 4px;
|
}
|
|
.fuguang-logo {
|
height: 45px;
|
margin-left: 8px;
|
vertical-align: middle;
|
}
|
|
.header-first-logo {
|
margin-left: 20px;
|
}
|
|
.header-carve-up {
|
display: inline-block;
|
height: 28px;
|
width: 1px;
|
background-color: #00FEFF;
|
margin-left: 12px;
|
margin-right: 12px;
|
}
|
|
.system-tools {
|
position: absolute;
|
top: 8px;
|
right: 8px;
|
}
|
|
.tools-item {
|
display: inline-block;
|
padding: 8px;
|
border-radius: 50%;
|
background-color: #4ba1fa;
|
}
|
|
.system-tools .iconfont {
|
font-size: 20px;
|
color: #041f6c;
|
}
|
|
.term-date {
|
display: inline-block;
|
margin-left: 16px;
|
font-size: 12px;
|
padding: 2px 8px;
|
}
|
|
.term-date-value {
|
display: inline-block;
|
text-align: center;
|
padding: 0 8px;
|
font-size: 14px;
|
border-radius: 6px;
|
margin-right: 8px;
|
}
|
</style>
|
