Authored by CN守护者

Merge branch 'master' of http://192.168.1.136:82/monitor_v3/hg-monitor-web into wuhl-master

# Conflicts:
#	hg-monitor-web-zj/src/main/resources/static/vue3/src/router/index.js
Showing 88 changed files with 3085 additions and 249 deletions
... ... @@ -131,7 +131,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
FOR EACH ROW
begin
IF NEW.isLeaf = 1 THEN
INSERT INTO `itsm_demo`.`system_handler` (`system_id`, `system_name`, `sort`, `system_type`, `enable`,`isvirtual`) VALUES (NEW.busId, NEW.busTypeName, NEW.sort, "0",NEW.isUse,"1");
INSERT INTO `itsm_demo`.`system_handler` (`system_id`, `system_name`, `sort`, `system_type`, `enable`,`isvirtual`) VALUES (NEW.busId, NEW.busTypeName, NEW.sort, "0","0","1");
END IF;
end$$
DELIMITER ;
... ... @@ -143,7 +143,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
FOR EACH ROW
begin
IF NEW.isLeaf = 1 and OLD.isLeaf =1 THEN
UPDATE `itsm_demo`.`system_handler` SET `system_name` = NEW.busTypeName, `enable`= NEW.isUse, `sort` = NEW.sort WHERE `system_id` = OLD.busId;
UPDATE `itsm_demo`.`system_handler` SET `system_name` = NEW.busTypeName, `sort` = NEW.sort WHERE `system_id` = OLD.busId;
ELSE
DELETE FROM `itsm_demo`.`system_handler` where `system_id` = OLD.busId;
END IF;
... ... @@ -211,7 +211,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
UPDATE `itsm_demo`.`system_handler` SET `system_type`=0 ,`isvirtual`=1 WHERE `system_id` = OLD.busId;
ELSE
-- 修改项目时修改是否是虚拟
UPDATE `itsm_demo`.`system_handler` SET `isvirtual`=NEW.isvirtual WHERE `system_id` = OLD.busId;
UPDATE `itsm_demo`.`system_handler` SET `system_type`=1 ,`isvirtual`=0 WHERE `system_id` = OLD.busId;
END IF;
end$$
DELIMITER ;
... ...
ALTER TABLE `cloud_backend_monitor`.`b_ops_person`
ADD COLUMN `idcard` varchar(30) NULL COMMENT '身份证' AFTER `certificate`;
\ No newline at end of file
... ...
... ... @@ -30,7 +30,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
sessions: layui.sessions,
// 获取编辑指标
getEditKpiList:function (){
var editFlag = localStorage.getItem("editFlag");//是否编辑状态
if(!(editFlag && editFlag == "true")){
editKpiList.push('----');
... ... @@ -197,46 +196,46 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
//获取编辑状态
var editFlag = localStorage.getItem("editFlag");//是否编辑状态
var piechbox = '<div class="layui-form" style="float: left;top: 15px;position: relative;left: 12px;" >' +
'<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" data-unit="'+data.kpiUnit+'" ' +
'data-id="' + kpiId + '" data-kpiname="' + data.name + '" data-flag="' + data.flag + '" data-name='+data.name+'></div>';
'<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" data-unit="' + data.kpiUnit + '" ' +
'data-id="' + kpiId + '" data-kpiname="' + data.name + '" data-flag="' + data.flag + '" data-name=' + data.name + '></div>';
pie.find("li").attr("data-degree", val);
var resStyle = obj.alarmEleMatchStyle(data.flag,kpiId);
// Start Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态
// // 可编辑状态的性能指标
// if(data.ident=='1' && editFlag && editFlag == "true"){
// pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
// form.render();
// }else{
// pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
var resStyle = obj.alarmEleMatchStyle(data.flag, kpiId);
// 获取配置指标 ww 优化
// var kpiList = obj.getEditKpiList();
//
// // 没有配置字典指标则按照性能指标判断
// if(kpiList.length == 1){
// // 可编辑状态的性能指标
// if(data.ident=='1' && editFlag && editFlag == "true"){
// pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
// form.render();
// }else{
// pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
// }
// } else {
// // 按照指标配置展示
// let kpiObject = obj.checkKpi(kpiId)
// if(kpiObject[data.id] && kpiObject[data.id] == true && editFlag && editFlag == "true"){
// pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
// form.render();
// } else {
// pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
// }
// }
// 获取配置指标
var kpiList = obj.getEditKpiList();
// 没有配置字典指标则按照性能指标判断
if(kpiList.length == 1){
// 可编辑状态的性能指标
if(data.ident=='1' && editFlag && editFlag == "true"){
pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
form.render();
}else{
pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
}
// End Wang 2021/11/18 15:04 查询字典编辑指标,判断编辑状态
//可编辑状态的性能指标 徐毫杰还原
if (data.ident == '1' && editFlag && editFlag == "true") {
pie.find(".pie-half-text").html(piechbox + "<b><u style='" + resStyle + "'>" + val + "%</u></b>");
form.render();
} else {
// 按照指标配置展示
let kpiObject = obj.checkKpi(kpiId)
if(kpiObject[data.id] && kpiObject[data.id] == true && editFlag && editFlag == "true"){
pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
form.render();
} else {
pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
}
pie.find(".pie-half-text").find("b").html("<u style='" + resStyle + "'>" + val + "%</u>"); //增加下划线
}
// End Wang 2021/11/18 15:04 查询字典编辑指标,判断编辑状态
pie.find(".pie-half-text").find("span").text(data.name);
pie.find(".pie-half-text").find("b").css('cursor','pointer'); //增加悬浮显示手指样式
pie.find(".pie-half-text").css('padding-top','50px');
pie.find(".pie-half-text").find("b").css('cursor', 'pointer'); //增加悬浮显示手指样式
pie.find(".pie-half-text").css('padding-top', '50px');
pie.find(".pie-half-text").find("span").hide();
//计算仪表盘的旋转角度
... ... @@ -1736,79 +1735,79 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
}
if (d[v.id] && d[v.id].kpiId) {
var value = d[v.id];
var resStyle = obj.alarmEleMatchStyle(value.flag,v.id);
// Start Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态
// //拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标,则可以下探
// if (value.kpiIdent == '1' || value.isWarning == '1') {
// var chbox = '';
// if(editFlag && editFlag == "true" && value.kpiIdent == '1'){
// chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
// 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="'+v.unit+'">';
// }
// return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;'+resStyle+'" ' + 'data-isWarning="'+value.isWarning+'" data-ident="'+value.kpiIdent+'"'+
// 'data-trend="'+value.isTrend+'" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
// '<a class="detail_row_menu hide" data-isWarning="'+value.isWarning+'" data-ident="'+value.kpiIdent+'" data-trend="'+value.isTrend+'" ' +
// 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
// 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="'+resType+'"' +
// '>' +
// '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
var resStyle = obj.alarmEleMatchStyle(value.flag, v.id);
// let arr = obj.getEditKpiList();
// var chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
// 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';
// if(arr.length == 1){
// if (value.kpiIdent == '1' || value.isWarning == '1') {
//
// if (!(editFlag && editFlag == "true" && value.kpiIdent == '1')) {
// chbox = '';
// }
// return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
// 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
// '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
// 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
// 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
// '>' +
// '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
//
// } else {
// var $html = addIconByValue(value.kpiValue);
// //根据资源类型判断 修改样式
// if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
// $html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
// }
// return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
// }
// } else {
// var $html = addIconByValue(value.kpiValue);
// //根据资源类型判断 修改样式
// if($html!="" && resType!="" && resType=="HOST_X86SERVER" && $html=='<i class="iconfont icon-size serious">\ue668</i>'){
// $html='<i class="iconfont icon-size grayColor">\ue61e</i>';
// var kpiId = d[v.id].kpiId;
// // 按照指标配置展示
// let kpiObject = obj.checkKpi(kpiId)
// if(kpiObject[kpiId] && kpiObject[kpiId] == true && editFlag && editFlag == "true"){
// return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
// 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
// '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
// 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
// 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
// '>' +
// '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
// } else {
// var $html = addIconByValue(value.kpiValue);
// //根据资源类型判断 修改样式
// if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
// $html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
// }
// return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
// }
// return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
// }
let arr = obj.getEditKpiList();
var chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';
if(arr.length == 1){
if (value.kpiIdent == '1' || value.isWarning == '1') {
if (!(editFlag && editFlag == "true" && value.kpiIdent == '1')) {
chbox = '';
}
return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
'<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
'>' +
'<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
} else {
var $html = addIconByValue(value.kpiValue);
//根据资源类型判断 修改样式
if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
$html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
}
return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
//
// // End Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态
//拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标,则可以下探 徐毫杰还原
if (value.kpiIdent == '1' || value.isWarning == '1') {
var chbox = '';
if (editFlag && editFlag == "true" && value.kpiIdent == '1') {
chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';
}
return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
'<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
'>' +
'<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
} else {
var kpiId = d[v.id].kpiId;
// 按照指标配置展示
let kpiObject = obj.checkKpi(kpiId)
if(kpiObject[kpiId] && kpiObject[kpiId] == true && editFlag && editFlag == "true"){
return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
'<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
'>' +
'<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
} else {
var $html = addIconByValue(value.kpiValue);
//根据资源类型判断 修改样式
if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
$html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
}
return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
var $html = addIconByValue(value.kpiValue);
//根据资源类型判断 修改样式
if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
$html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
}
return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
}
// End Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态
} else {
return d[v.id];
}
... ...
... ... @@ -4,7 +4,6 @@
/*最外层样式*/
.container{
background: white;
background-color: #CCCCCC;
padding: 3px 3px;
width:calc(100% - 10px);
... ...
... ... @@ -592,13 +592,18 @@ export default {
let arr = getCheckedFile();
let info = [];
let fileNameData=[];
arr.map(function (v) {
info.push(`${v.id}__${v.type}`);
if (v.checked != undefined && v.checked == true) {
fileNameData.push(v.fileName)
}
})
alert(fileNameData)
let params = {
info: info.join(","),
fileName: ''
fileName:fileNameData
}
proxy.$http.downloadFile('/inspection-report/file/download', params);
... ...
... ... @@ -25,7 +25,12 @@
</slot>
</template>
</el-table-column>
<slot name="tools" v-if="columns.length > 0" ></slot>
<el-table-column v-if="showTools && columns.length > 0" label="操作" width="80">
<template #default="scope">
<slot name="tools" :scope="scope" ></slot>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div style='text-align: center;background-color: white' v-if="showPage">
... ...
... ... @@ -76,6 +76,10 @@ export default {
type: Number,
default: window.innerWidth
},
showTools:{
type: Boolean,
default: false
},
},
data() {
... ...
... ... @@ -20,6 +20,8 @@ url:
bigScreen: http://127.0.0.1:8081
# 一体化视图
ythView: http://192.168.0.69:18089
# cmdb
cmdbWeb: http://192.168.0.68:80
# 业务健康度
ywHealth: http://80.12.92.117:83
#流程系统路径,当ssl.enabled=true时,http要改为https,并修改流程nginx的conf文件
... ...
@charset "utf-8";
*
{
margin:0;
padding:0;
}
html
{
width:100%;
height:100%;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
-webkit-text-size-adjust:none;
background-image:url("../img/img-beijing.png");
background-repeat: no-repeat;
background-position: center;
}
body
{
padding:5px;
}
.outlinediv {
padding-top: 30px;
border: 2px solid #0a93be;
width: 900px;
height: 600px;
margin: 0 auto;
font-size: 16px;
border-radius: 5px;
text-align: center;
color: #bbb;
position: relative;
display: list-item;
}
.outlinediv span {
color: rgba(0, 0, 0, 0.89);
line-height: 20px;
font-size: 14px;
}
.outlinediv .xiaoshansecond-topcabinet{
margin-top: 20px;
margin-left: 7%;
padding: 20px;
width: 80%;
height:100px;
}
.outlinediv .xiaoshansecond-middlecabinet{
margin-top: 50px;
margin-bottom: 50px;
margin-left: 7%;
padding: 20px;
width: 80%;
height:100px;
}
.outlinediv .xiaoshansecond-bottomcabinet{
margin-left: 7%;
padding: 20px;
width: 80%;
height:100px;
}
.cabinet{
width:auto;height:auto;max-height:100%;max-width:100%;
}
table{
margin-top: 20px;
border-collapse:collapse;
}
table tr{
height: 50px;
}
tr.sevenempty {
height: 10px;
}
table tr td{
position: relative;
max-width: 35px;
}
table td .cabinetId{
position: absolute;/*绝对定位*/
top:20px;
width: 100%;
bottom: 0px;/*离底下0像素*/
left: 0px;/*离左边0像素*/
text-align: center;
font-size: 12px;
color: white;
}
.outlinediv .xiaoshanthird-topcabinet{
margin-left:22%;
padding: 20px;
width: 80%;
}
.outlinediv .xiaoshanseven-leftcabinet{
margin-left:1%;
width: 40%;
}
.outlinediv .xiaoshanseven-rightcabinet{
margin-left: 5px;
width: 40%;
}
.outlinediv .xiaoshanseven-middlecabinet{
margin-top: 20px;
padding-top: 30%;
border: 2px solid #111D1A;
width:12% ;
height: 255px;
text-align: center;
}
.outlinediv .huzhouone-topcabinet{
margin-left:10%;
width: 90%;
}
tr.zaibeione{
height: 90px;
}
.zaibei.cabinetId{
position: absolute;/*绝对定位*/
top:10px;
width: 100%;
bottom: 0px;/*离底下0像素*/
left: 0px;/*离左边0像素*/
text-align: center;
font-size: 8px;
color: white;
}
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
<meta http-equiv="Expires" content="0" />
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
</head>
<body>
<div class="outlinediv" style="height: 666px">
<span>湖州灾备一机房平面图</span>
<div class="huzhouone-topcabinet">
<table>
<tr>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 4A</span></a></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-7</span></a></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FA-6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FA-4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-1</span></a></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-3</span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-4</span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 3A</span></a></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-7</span></a></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FB-6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-5</span></a></td>
<td><a href="/h5/machineroomDetail/FB-4.html"><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FB-4</span></a></td>
<td><a href="/h5/machineroomDetail/FB-3.html"><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-1</span></a></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
</tr>
<tr class="zaibeione"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-10</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 1A</span></a></td>
<td width="10px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">EMC1</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">EMC2</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">EMC3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-7</span></a></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">小型机595A</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机595B</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-1</span></a></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-1</span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-2</span></a></td>
</tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-10</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 2B</span></a></td>
<td style="width: 15px"></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">小型机570-3</span></a></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-1</span></a></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
</tr>
<tr>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img/></td>
<td><img/></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-1</span></a></td>
</tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
<meta http-equiv="Expires" content="0" />
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
<style type="text/css">
table tr td {
max-width: 80px;
}
</style>
</head>
<body>
<div class="outlinediv" >
<span>湖州灾备三机房平面图</span>
<div class="huzhouone-topcabinet" style="margin-left: 25%;padding-top: 30px">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">TB-6</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">TB-5</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
</tr>
<tr>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
</tr>
<tr>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
</tr>
<tr>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
</tr>
<tr class="zaibeione"></tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
<meta http-equiv="Expires" content="0" />
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
<style type="text/css">
table tr td {
max-width: 80px;
}
</style>
</head>
<body>
<div class="outlinediv" >
<span>湖州灾备二机房平面图</span>
<div class="huzhouone-topcabinet" style="margin-left: 20%">
<table>
<tr>
<td><img/></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-1</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LA-2</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-3</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-2</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-1</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">PDA6B</span></a></td>
</tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">AC-5</span></a></td>
<td style="width: 30px"></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
</tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
<td style="width: 30px"></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><img></td>
<td><img ></td>
<td><img ></td>
</tr>
<tr>
<td><img/></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LB-1</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-2</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LB-3</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-2</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-1</span></a></td>
<td style="width: 30px"></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">PDA5A</span></a></td>
</tr>
<tr class="zaibeione"></tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
<meta http-equiv="Expires" content="0" />
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
</head>
<body>
<div class="outlinediv">
<span>2号机房平面图</span>
<div class="xiaoshansecond-topcabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F11</span></a></td>
<td><a href=""><img src="img/emptycabinet.png" class="cabinet"></a></td>
<td><a href=""><img src="img/emptycabinet.png" class="cabinet"></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F16</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F17</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F18</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F19</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F20</span></a></td>
</tr>
</table>
</div>
<div class="xiaoshansecond-middlecabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G16</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G17</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G18</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G19</span></a></td>
</tr>
</table>
</div>
<div class="xiaoshansecond-bottomcabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H16</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H17</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H18</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H19</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H20</span></a></td>
</tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="Expires" content="0"/>
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
</head>
<body>
<div class="outlinediv" style="width: 950px">
<span>7号机房平面图</span>
<div style="width: 100%;height: 100%;display: inline-flex">
<div class="xiaoshanseven-leftcabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I5</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I7</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H5</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H10</span></a>
</td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G5</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G10</span></a>
</td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F5</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F10</span></a>
</td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E4</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E5</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E10</span></a>
</td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D9</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><img ></td>
<td><img ></td>
<td><img ></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C10</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><img/></td>
<td><img/></td>
<td><img/></td>
<td><img/></td>
<td><img/></td>
<td><img/></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B10</span></a></td>
</tr>
</table>
</div>
<div class="xiaoshanseven-middlecabinet"><span>过道</span></div>
<div class="xiaoshanseven-rightcabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I16</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I17</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I18</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I19</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H16</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H17</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H18</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H19</span></a></td>
<td><img ></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H22</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H23</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H24</span></a></td>
</td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G16</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G17</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G18</span></a></td>
<td><img ></td>
<td><img ></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G21</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G21</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G24</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G25</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F15</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E16</span></a></td>
<td><img></td>
<td><img ></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E20</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E21</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E22</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E23</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E24</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D14</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D15</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D16</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D17</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D18</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D19</span></a></td>
<td><img ></td>
<td><img></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D22</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D23</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D24</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D25</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C14</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C15</span></a></td>
</tr>
<tr class="sevenempty"></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B14</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B15</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B16</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B17</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B18</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B19</span></a></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
<meta http-equiv="Expires" content="0" />
<link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
</head>
<body>
<div class="outlinediv">
<span>3号机房平面图</span>
<div class="xiaoshanthird-topcabinet">
<table>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E7</span></a></td>
<td><img/></td>
<td><img/></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E12</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E15</span></a></td>
</tr>
<tr></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D15</span></a></td>
</tr>
<tr></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C15</span></a></td>
</tr>
<tr></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B7</span></a></td>
<td><img/></td>
<td><img/></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B16</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B17</span></a></td>
</tr>
<tr></tr>
<tr>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A1</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A2</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A3</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A4</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A5</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A6</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A7</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A8</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A9</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A10</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A11</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A12</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A13</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A14</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A15</span></a></td>
<td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A16</span></a></td>
<td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A17</span></a></td>
</tr>
</table>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="css/Details.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class='all'>
<!-- 左侧机柜效果图 -->
<div class='contain'>
<!-- 机柜内部服务器 -->
<div class='contain-server'>
<!-- 第一个物理服务器 -->
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
<!-- 第二个物理服务器 -->
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
<!-- 第三个物理服务器 -->
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 右侧机柜详细信息 -->
<div class='info'>
<!-- 机柜信息 -->
<div class='info-top'>
<div class='info-contain'>
<div class='info-text'>机柜信息</div>
<div class='info-text-bot'>
<p>机 房:萧山7号机</p>
<p>机柜编号:E07</p>
<p>机柜容量:42U</p>
<p>设备数量:3台</p>
<p>告警量:无告警</p>
</div>
</div>
</div>
<!-- 设备信息 -->
<div class='info-bottom'>
<div class='info-contain'>
<div class='info-text'>设备信息</div>
<div class='info-text-bot'>
<p>品 牌:曙光</p>
<p>型 号:I840—G25</p>
<p>序 列 号:9800076500643112</p>
<p>管 理 IP:80.12.92.21</p>
<p>业 务 IP:80.12.92.31</p>
<p>用 途:发票系统使用</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="css/FB-3.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class='all'>
<!-- 左侧机柜效果图 -->
<div class='contain'>
<!-- 机柜内部服务器 -->
<div class='contain-serve'>
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
<!-- 第二个物理服务器 -->
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
<!-- 第三个物理服务器 -->
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="css/FB-4.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class='all'>
<!-- 左侧机柜效果图 -->
<div class='contain'>
<!-- 机柜内部服务器 -->
<div class='contain-serve'>
<div class='serve'>
<div class='img-serve'>
<img src="img/icon-state.png" alt="" class='state'>
<div class='img-serve-text'>物理服务器</div>
<div class='lamp'>
<img src="img/icon-weblogical.png" alt="" class='img-weblog'>
<div class='img-lamp'>
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/nocolor.png" alt="">
<img src="img/greenColor.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
... ...
body{
background-image: url(../img/img-bg.png);
background-size: 100%;
}
li{
list-style: none
}
.all{
display:flex;
}
/* 左侧机柜样式 */
.contain{
width:400px;
height:710px;
margin-left:15%;
margin-top:5%;
/* background-color: red; */
background-image: url(../img/img-no-machine.png);
background-size: 100%;
background-repeat: no-repeat;
position: relative;
}
.contain-server{
position: absolute;
width:365px;
height:40%;
margin-left:18px;
bottom:7%;
display: flex;
justify-content: space-between;
flex-direction:column;
/* background-color: red; */
}
.serve{
width:370px;
height:78px;
margin-left:-3px;
background-image: url(../img/img-4Uservice.png);
background-size: 100% 100%;
background-repeat: no-repeat;
}
.img-serve{
width:340px;
height:50px;
margin:12px auto;
display: flex;
}
.lamp{
display:flex;
}
.img-lamp{
margin-left:15px;
margin-top:10px
}
/* 服务器状态图片样式 */
.state{
width:35px;
height:35px;
margin-top:8px;
margin-left:4px;
}
.img-serve-text{
color:#fff;
line-height: 50px;
margin-left:10px;
}
.img-weblog{
margin-left:50px;
margin-top:15px;
width:30px;
height:20px;
}
/* 右侧机柜详细信息样式 */
.info{
width:500px;
height:700px;
margin-left:8%;
margin-top:5%;
/* background-color: red; */
}
.info-top{
height:340px;
margin-top:-10px;
background-image: url(../img/img-machineInfo-bg.png);
}
.info-bottom{
height:340px;
margin-top:10px;
background-image: url(../img/img-deviceInfo-bg.png);
}
.info-contain{
width:90%;
display:inline-block;
height:250px;
margin-top:60px;
margin-left: 60px;
}
.info-text{
height:50px;
font-weight: bolder;
font-size: 20px;
color:#fff
/* background-color: rgb(59, 185, 8); */
}
.info-text-bot{
margin-top:-15px;
height:200px;
font-size: 16px;
letter-spacing: 2px;
color:#fff
/* background-color: rgb(93, 15, 196); */
}
... ...
body{
background-image: url(../img/img-bg.png);
background-size: 100%;
}
.all{
display:flex;
}
/* 机柜样式 */
.contain{
width:400px;
height:710px;
margin-left:37%;
margin-top:5%;
/* background-color: red; */
background-image: url(../img/img-no-machine.png);
background-size: 100%;
background-repeat: no-repeat;
position: relative;
}
.contain-serve{
position: absolute;
margin-top:60%;
width:365px;
height:40%;
margin-left:18px;
display: flex;
justify-content: space-between;
flex-direction:column;
}
.serve{
width:370px;
height:78px;
margin-left:-3px;
background-image: url(../img/img-4Uservice.png);
background-size: 100% 100%;
background-repeat: no-repeat;
}
.img-serve{
width:340px;
height:50px;
margin:12px auto;
display: flex;
}
.lamp{
display:flex;
}
.img-lamp{
margin-left:15px;
margin-top:10px
}
.state{
width:35px;
height:35px;
margin-top:8px;
margin-left:4px;
}
.img-serve-text{
color:#fff;
line-height: 50px;
margin-left:10px;
}
.img-weblog{
margin-left:50px;
margin-top:15px;
width:30px;
height:20px;
}
... ...
body{
background-image: url(../img/img-bg.png);
background-size: 100%;
}
.all{
display:flex;
}
/* 机柜样式 */
.contain{
width:400px;
height:710px;
margin-left:37%;
margin-top:5%;
/* background-color: red; */
background-image: url(../img/img-no-machine.png);
background-size: 100%;
background-repeat: no-repeat;
position: relative;
}
.contain-serve{
position: absolute;
margin-top:50%;
width:365px;
height:40%;
margin-left:18px;
display: flex;
justify-content: space-between;
flex-direction:column;
}
.serve{
width:370px;
height:78px;
margin-left:-3px;
background-image: url(../img/img-4Uservice.png);
background-size: 100% 100%;
background-repeat: no-repeat;
}
.img-serve{
width:340px;
height:50px;
margin:12px auto;
display: flex;
}
.lamp{
display:flex;
}
.img-lamp{
margin-left:15px;
margin-top:10px
}
/* 服务器状态图样式 */
.state{
width:35px;
height:35px;
margin-top:8px;
margin-left:4px;
}
.img-serve-text{
color:#fff;
line-height: 50px;
margin-left:10px;
}
.img-weblog{
margin-left:50px;
margin-top:15px;
width:30px;
height:20px;
}
... ...
... ... @@ -72,7 +72,27 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
form.val('form-bustype-edit', busType);
$('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true);
userSelect.setValue([busType.admin]);
opsSelect.setValue(busType.principal.split(","));
let principal = busType.principal;
let principalLi = principal ? principal.split(",") : [];
opsSelect.setValue(principalLi);
//是否启用 1启用 0不启用
let isUse = busType.isUse || busType.isUse == 0 ? busType.isUse : 1;
if (isUse != 1) {//不启用
layui.jquery('input[name="isUse"]').removeAttr('checked'); //改变开关为 关
}
//是否是乙方运维 1是,0不是
let system_type = busType.isOps || busType.isOps == 0 ? busType.isOps : 1;
if (system_type != 1) {//不是乙方运维 隐藏项目 是否虚拟可以点击
layui.jquery('input[name="system_type"]').removeAttr('checked'); //改变开关为 关
$('#select_principalName').addClass("hide");
layui.jquery('input[name="isvirtual"]').removeAttr('disabled');//可以点击
}
//是否是虚拟 0是,1不是
let isvirtual = busType.isvirtual || busType.isvirtual == 0 ? busType.isvirtual : 0;
if (isvirtual != 0) {//不是虚拟
layui.jquery('input[name="isvirtual"]').removeAttr('checked'); //改变开关为 关
}
form.render();
});
}
... ... @@ -88,33 +108,42 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
form.on('switch(system_type)', function (obj) {
//sign=fale 不是乙方运维项目 sign=true 是乙方运维项目
var sign = obj.elem.checked;
if(!sign){//不是乙方运维
if (!sign) {//不是乙方运维 下拉框隐藏 是否是虚拟项目可以点击
$('#select_principalName').addClass("hide");
opsSelect.setValue([]);
layui.jquery('input[name="isvirtual"]').removeAttr('checked'); //改变开关为 关
layui.jquery('input[name="isvirtual"]').removeAttr('disabled');//可以点击
//重新渲染
form.render();
}else{//是乙方运维
} else {//是乙方运维 下拉框展示 只能是虚拟项目 不能更改是否是虚拟项目
$('#select_principalName').removeClass('hide');
//删除原来的组件 新加dom
$('#isvirtual_ops_switch').empty();//删除子元素
let html = '<input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked disabled/>';
$('#isvirtual_ops_switch').append(html);//追加子元素
//layui.jquery('input[name="isvirtual"]').attr("checked", true);//改变状态为开
//layui.jquery('input[name="isvirtual"]').attr("disabled", true)//不能点击
//渲染下拉框
initUserSelectOps();
//重新渲染
form.render();
}
});
// 绑定表单提交事件
form.on('submit(bus-type-submit)', function (data) {
loading = layer.load(2);
busType = Object.assign(busType, data.field);
//是否启用
//是否启用 1启用 0不启用
if (!data.field.isUse) {
busType.isUse = '0'
}
//是否是乙方运维
//是否是乙方运维 1是,0不是
if (!data.field.system_type) {
busType.system_type = '0'
}
//是否是虚拟业务
//是否是虚拟业务 0是,1不是
if (!data.field.isvirtual) {
busType.isvirtual = '1'
}
... ... @@ -123,7 +152,6 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
busType.parentId = '0';
}
//获取业务负责人信息
userSelect.getValue("")
busType.nickname = userSelect.getValue("name")[0];
busType.admin = userSelect.getValue("value")[0];
//获取业务运维负责人
... ...
... ... @@ -673,6 +673,16 @@ layui.define(['view'], function(exports){
, toDZSWJScreen: function () {
window.open(window.location.origin + '/vue3/index.html#/zj/dp?access_token=' + localStorage.getItem("access_token"));
}
// xwx add 首页增加CMDB入口 2021-11-21
, toCMDB: function () {
var roles=sessionStorage.getItem('roles');
if (roles.indexOf('zichanyw') != -1 || roles.indexOf('zichanAdmin') != -1){
window.open(sessionStorage.getItem("cmdbWeb"));
}else{
layer.msg('当前用户没有权限', {icon: 0, time: 3000});
}
}
//向右滚动页面标签
, leftPage: function () {
... ...
<title>对比分析配置</title>
<iframe src="/vue3/index.html#/analysis" class="layadmin-iframe" style="height: 99.5%!important;"/>
\ No newline at end of file
<iframe src="/vue3/index.html#/analysis" class="layadmin-iframe" style="height: 99.5%!important;"/>
... ...
<title>对比分析预览</title>
<script type="text/html" template>
{{#
var viewURL = window.location.origin + '/vue3/index.html#/analysis/view';
layui.use(['sessions','common','admin'], function () {
var $ = layui.$;
var common = layui.common;
var admin = layui.admin;
var arr = [];
window.location.hash.split('/').forEach(function (v, i) {
if (v.indexOf('=') != -1) {
arr.push(v);
}
});
if (arr.length > 0) {
viewURL += "?" + arr.join("&");
}
$('#actionListIframe').attr('src',viewURL);
});
}}
<iframe id="actionListIframe" src="{{viewURL}}" frameborder="0" class="layadmin-iframe" style="height: 99.5%!important;"></iframe>
</script>
... ...
... ... @@ -42,7 +42,7 @@
<div class="layui-form-item">
<label class="layui-form-label">是否使用<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="checkbox" lay-skin="switch" name="isUse" value="1" lay-text="是|否" checked/>
<input type="checkbox" lay-skin="switch" name="isUse" lay-filter="system_isUse" value="1" lay-text="是|否" checked/>
</div>
</div>
<div class="layui-form-item">
... ... @@ -82,8 +82,8 @@
</div>
<div class="layui-form-item">
<label class="layui-form-label">虚拟业务<span style="color: red">*</span></label>
<div class="layui-input-block">
<input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked/>
<div class="layui-input-block" id="isvirtual_ops_switch">
<input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked disabled/>
</div>
</div>
<button id="btn-bustype-submit" class="hide" lay-submit lay-filter="bus-type-submit">提交</button>
... ...
... ... @@ -74,6 +74,7 @@
<dd layadmin-event="toDZSWJScreen" style="text-align: left;"><a><img src="/src/style/img/icon-dianzishuiwuju.png" style="width: 16px;height: 16px">&nbsp;&nbsp;电子税务大屏</a></dd>
<dd layadmin-event="toYTHViewScreen" style="text-align: left;"><a><img src="/src/style/img/icon-yitihuadaping.png" style="width: 16px;height: 16px">&nbsp;&nbsp;一体化视图</a></dd>
<dd layadmin-event="toBiZhEalZhSYS" style="text-align: left;"><a><img src="/src/style/img/icon-YWJKD.png" style="width: 16px;height: 16px">&nbsp;&nbsp;业务健康度</a></dd>
<dd layadmin-event="toCMDB" style="text-align: left;"><a><img src="/src/style/img/loading-mj.png" style="width: 16px;height: 16px">&nbsp;&nbsp;CMDB</a></dd>
</dl>
</script>
</li>
... ...
... ... @@ -115,8 +115,8 @@
width:100%;
}
.middle-left-declare-rate{
height: 36%;
width:96%;
height: 100%;
width:100%;
}
.screen-middle #middle-bottom {
... ...
<div class="analysis-index-container">
<div class="iconAdd">
点击添加比对分析
</div>
</div>
\ No newline at end of file
export default {
name: 'addIndex',
template: '',
components:{},
data () {
return {
}
},
setup(){
}
}
\ No newline at end of file
<div :style="{'height':'380px','padding':'6px'}">
<slot name="title">
<div style="text-align: left;margin-bottom: 10px;padding-left: 10px;">对比分析场景</div>
</slot>
<el-row :gutter="5">
<el-col :span="4">
<div style="display: flex;flex-wrap: wrap;width: 100%">
<slot name="lineName">
分析名称
</slot>
</div>
</el-col>
<el-col :span="20" style="text-align: right;padding-right: 10px">
<slot name="timeRange"></slot>
<slot name="frequency"></slot>
<slot name="tools"></slot>
</el-col>
</el-row>
<div :style="{'height':'300px','width':width + 'px'}" :id="id"></div>
</div>
... ...
export default {
name: 'analysisLineChars',
template: '',
components: {},
data() {
},
props: {
showTitle: {
type: Boolean,
default: false
},
title: {
type: String,
default: '示例折线图'
},
legend: {
type: Object,
default: {
data: ['示例1']
}
},
xAxis: {
type: Array,
default: ['示例1', '示例2', '示例3', '示例4', '示例5', '示例6']
},
series: {
default: [{
name: '示例1',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
let height = Vue.ref(window.innerHeight - 10);
let width = Vue.ref(window.innerWidth - 50);
let id = Vue.ref('analysisLineChars'+(new Date()).getTime());
// echarts实例的dom
var myChart = null;
let init = () => {
if(myChart == null){
myChart = echarts.init(document.getElementById(id.value));
}
// 指定图表的配置项和数据
var option = {
title: {
text: props.title
},
grid: {
left: '1%',
right: '1%',
bottom: '1%',
containLabel: true,
},
tooltip: {},
legend: props.legend,
xAxis: {
data: props.xAxis
},
yAxis: {},
series: props.series
};
if (!props.showTitle) {
delete option.title;
}
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
}
// 挂载完
Vue.onMounted(() => {
init();
console.log('onMounted');
})
// 监听编辑状态
Vue.watch(
() => props.xAxis, (newValue, oldVlaue) => {
console.log("id=",id.value);
init();
}
);
return {
height,
width,
id
}
}
}
... ...
... ... @@ -8,19 +8,23 @@ const assets = (props, {attrs, slots, emit}) => {
});
// 类型 bastion 堡垒机,dam 防水坝,virtual 虚拟桌面
let icon = {
bastion: {
name: '堡垒机',
icon: 'icon-baoleiji'
},
dam: {
name: '防水坝',
icon: 'icon-shuiba2'
},
virtual: {
name: '虚拟桌面',
icon: 'icon-xunizhuomian'
},
let icon = Vue.ref({});
//查询资产类型列表
let getAssetType = () => {
proxy.$http.post(`/api-web/manage/ddic/findSucDdics/OPS_SECOND_PROPERTY`, {}, function (res) {
if (res && res.data.length > 0) {
icon.value = {};
res.data.forEach(function(item, index, arr){
let code = item.ddicCode;
let obj = {};
code = code.substring(code.lastIndexOf("_") + 1, code.length).toLowerCase();
obj.name=item.ddicName;
obj.icon=item.ddicDesc;
icon.value[code] =obj;
});
}
});
}
// 查询列表
... ... @@ -166,7 +170,6 @@ const assets = (props, {attrs, slots, emit}) => {
}
return {
icon,
getAssets,
assetsMaps,
addAssets,
... ... @@ -177,7 +180,9 @@ const assets = (props, {attrs, slots, emit}) => {
okFunc,
btnClick,
btnType,
assetsAdd
assetsAdd,
getAssetType,
icon
}
}
... ... @@ -288,7 +293,6 @@ export default {
}
const {
icon,
getAssets,
assetsMaps,
addAssets,
... ... @@ -299,17 +303,21 @@ export default {
okFunc,
btnClick,
btnType,
assetsAdd
assetsAdd,
getAssetType,
icon
} = assets(props, {attrs, slots, emit});
// // 挂载完
Vue.onMounted(() => {
getAssetType();
getPage();
getAssets();
})
// 监听编辑状态
Vue.watch(() => props.projectId, (newValue, oldVlaue) => {
getAssetType();
getPage();
getAssets();
});
... ... @@ -320,8 +328,6 @@ export default {
getFile,
beforeAvatarUpload,
isAdmin,
// 资产属性
icon,
getAssets,
assetsMaps,
addAssets,
... ... @@ -332,7 +338,10 @@ export default {
okFunc,
btnClick,
btnType,
assetsAdd
assetsAdd,
getAssetType,
// 资产属性
icon,
}
}
}
... ...
... ... @@ -48,7 +48,7 @@
<cm-table-page :columns="columns" :dataList="dataList" @loaddata="getPage" :showIndex="true"
:showBorder="true" :currentPage="currentPage" :loading="false"
:showPage="false" :height="(height - 20)">
:showPage="false" :showTools="true" :height="(height - 20)">
<template #default="{row,prop,column}">
<span v-if="prop == 'resListId'">{{currentNode.label}}</span>
<div v-else>
... ... @@ -128,7 +128,7 @@
</div>
</template>
<template #tools>
<!-- <template #tools>
<el-table-column fixed="right" label="操作" width="80" align="center">
<template #default="scope">
<el-button type="text" size="small" @click.prevent="deleteRow(row,scope.$index)">
... ... @@ -136,6 +136,11 @@
</el-button>
</template>
</el-table-column>
</template>-->
<template #tools="{scope}">
<el-button type="text" size="small" @click.prevent="deleteRow(scope.row,scope.$index)">
<i class="el-icon-delete"/>
</el-button>
</template>
</cm-table-page>
</div>
... ...
... ... @@ -108,18 +108,17 @@ const routes = [{
{
path: '/analysis',
name: 'analysis',
// component: () => myImport('views/analysis/components/addIndex/index')
component: () => myImport('views/analysis/index')
},
{
path: '/analysis/add',
name: 'analysisAdd',
component: () => myImport('components/page/analysis/add/index')
component: () => myImport('views/analysis/config/index')
},
{
path: '/faultDiagnosis',
name: 'faultDiagnosisIndex',
component: () => myImport('views/faultDiagnosis/index')
path: '/analysis/view',
name: 'view',
component: () => myImport('views/analysis/view/index')
}
];
... ...
... ... @@ -3,7 +3,7 @@
<div class="add-top">
<el-row>
<el-col :span="16" class="add-top-title">
<el-button type="primary">场景名称</el-button>
<el-input v-model="input" placeholder="请输入场景名称" />
</el-col>
<el-col :span="8" class="add-top-select">
<el-dropdown>
... ... @@ -172,4 +172,4 @@
</el-button>
</div>
</el-dialog>
</div>
\ No newline at end of file
</div>
... ...
... ... @@ -59,7 +59,6 @@ export default {
create: 'Create'
}
let columns = Vue.ref([
{
prop: 'busId',
label: '业务系统',
... ... @@ -438,4 +437,4 @@ export default {
},
}
}
\ No newline at end of file
}
... ...
<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
<div class="cm-card" :style="{'min-height':height+'px','height':'100%'}">
<analysis-line :legend="lineChart.legend" :xAxis="lineChart.xAxis" :series="lineChart.series">
<template #lineName="scope">
<el-input v-model="form.scene.name" placeholder="请输入场景名称"/>
</template>
<template #tools="scope">
<el-button type="primary" style="margin-left: 10px" @click="showDialogForm(true)">保存</el-button>
</template>
<template #timeRange="scope">
<el-dropdown>
<el-button>
时间范围 <i class="el-icon el-icon-arrow-down"></i>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="timeRangeChange(item)" v-for="item in timeRangeArr"
:key="item.ddicId"
:command="{value:item.ddicCode,label:item.ddicName,flag:1}">
<el-radio v-model="form.scene.timeScope" :label="item.ddicCode">{{item.ddicName}}
</el-radio>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</template>
<template #frequency="scope">
<el-dropdown style="margin-left: 10px">
<el-button>
聚合频率 <i class="el-icon el-icon-arrow-down"></i>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="item in frequencyArr"
:key="item.ddicId"
:command="{value:item.ddicCode,label:item.ddicName,flag:1}">
<el-radio v-model="form.scene.frequency" :label="item.ddicCode">{{item.ddicName}}
</el-radio>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</template>
</analysis-line>
<el-divider content-position="left">
<div>
<i class="iconfont icon-liebiaomoshi"></i>
<span style="margin-left: 5px">查询条件</span>
</div>
</el-divider>
<div style="width: calc(100% - 12px);padding: 0px 6px">
<el-row :gutter="5">
<el-col :span="4">
<div style="display: flex;flex-wrap: wrap;width: 100%;padding-left: 15px;">
<el-dropdown>
<el-icon class="el-icon--right">
<arrow-down/>
</el-icon>
<cm-biz-type-tree-input multiple clearable collapseTags @callback="getBizType"/>
</el-dropdown>
<el-dropdown>
<el-icon class="el-icon--right">
<arrow-down/>
</el-icon>
<cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/>
</el-dropdown>
<el-dropdown>
<el-icon class="el-icon--right">
<arrow-down/>
</el-icon>
<cm-kpi-type-tree-input multiple clearable collapseTags @callback="getKpiType"/>
</el-dropdown>
<el-input v-model="keyWords" placeholder="输入关键字" style="margin-top: 15px;width: 225px;"/>
<div style="margin-top: 10px;text-align: center">
<el-button type="primary" @click="onReset()">重置</el-button>
<el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>
</div>
</div>
</el-col>
<el-col :span="20">
<el-tabs v-model="activeName" @tab-click="tabClick">
<el-tab-pane label="已添加" name="first">
<cm-table-page :columns="columns" :dataList="tabFirstList" @loaddata="loadFirstList"
:showIndex="true"
:showBorder="true" :loading="false"
:showPage="false" :showTools="true" :height="(height - 500)">
<template #tools="{scope}">
<el-button type="text" size="small"
@click.prevent="deleteRes(scope.row,scope.$index)">
<i class="el-icon-delete"/> 移除
</el-button>
</template>
</cm-table-page>
</el-tab-pane>
<el-tab-pane label="未添加" name="second">
<cm-table-page :columns="columns" :dataList="tabSecondList" @loaddata="loadSecondList"
:showIndex="true"
:showBorder="true" :loading="false"
:showPage="false" :showTools="true" :height="(height - 500)">
<template #tools="{scope}">
<el-button type="text" size="small" @click.prevent="addRes(scope.row,scope.$index)">
<i class="el-icon-plus"/> 添加
</el-button>
</template>
</cm-table-page>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
</div>
</div>
<cm-dialog title="保存场景" width="500px" :showDialogVisible="dialogFormVisible" @hidedialog="showDialogForm"
@okfunc="saveAnalysis">
<template v-slot>
<div style="display:inline-block;margin-bottom: 10px">
<el-radio-group v-model="isAdd" @change="analysisChange">
<el-radio :label="false" border>
新增场景分类
</el-radio>
<el-radio :label="true" border>
追加场景分类
</el-radio>
</el-radio-group>
</div>
<div v-if="!isAdd" style="padding: 3px 10px;">
<el-input v-model="form.parentName" placeholder="请输入场景分类"/>
</div>
<div v-else style="padding: 3px 10px;">
<el-select v-model="form.parentId" placeholder="请选择场景分类" style="width: 100%">
<el-option
v-for="item in parentList"
:key="item.id"
:label="item.configName"
:value="item.id">
</el-option>
</el-select>
</div>
<div style="padding: 3px 10px;">
<el-input v-model="form.scene.sort" type="number" placeholder="请输入排序"/>
</div>
</template>
</cm-dialog>
</div>
... ...
/**
* 时间范围:time_scope
* <p>
* 作者: Wang
* 时间:2021/11/20 16:13
*/
const timeRange = () => {
const {proxy} = Vue.getCurrentInstance();
let timeRangeArr = Vue.ref([]);
let loadTimeRange = (callback) => {
if (timeRangeArr.value.length > 0) {
return;
}
proxy.$http.post(`/api-web/manage/ddic/findSucDdics/time_scope`, {}, function (res) {
if (res && res.data) {
timeRangeArr.value = res.data;
if (callback) {
callback(res.data[0].ddicCode);
}
}
});
}
return {
timeRangeArr,
loadTimeRange
}
}
/**
* 契合频率
* <p>
* 作者: Wang
* 时间:2021/11/20 16:38
*/
const frequency = () => {
const {proxy} = Vue.getCurrentInstance();
let frequencyArr = Vue.ref([]);
let loadFrequency = (defCode, callback) => {
if (frequencyArr.value.lnegth > 0) {
return;
}
let param = {
ddicName: defCode
}
proxy.$http.get(`/api-web/ContrastAnalysis/selectTogetherRate`, param, function (res) {
if (res && res.data) {
frequencyArr.value = res.data;
if (callback) {
callback();
}
}
});
}
return {
frequencyArr,
loadFrequency
}
}
export default {
name: 'resIndex',
template: '',
components: {
'analysis-line': Vue.defineAsyncComponent(
() => myImport('components/page/analysis/lineChars/index')
),
},
data() {
return {
props: {
label: 'label',
children: 'children'
}
}
},
setup() {
const {proxy} = Vue.getCurrentInstance();
let height = Vue.ref(window.innerHeight - 10);
let columns = Vue.ref([
{
prop: 'busTypeName',
label: '业务系统',
sortable: true,
align: 'center',
},
{
prop: 'resTypeName',
label: '资源类型',
sortable: true,
align: 'center',
},
{
prop: 'resName',
label: '资源名称',
sortable: true,
align: 'center',
},
{
prop: 'ip',
label: 'ip地址',
sortable: true,
align: 'center',
},
{
prop: 'kpiName',
label: '指标名称',
sortable: true,
align: 'center',
},
{
prop: 'flag',
label: '指标标识',
sortable: true,
align: 'center',
}
]);
var id = proxy.$global.getQueryVariable('configId');
let resTypeArr = Vue.ref([]);
let kpiTypeArr = Vue.ref([]);
let busTypeArr = Vue.ref([]);
let keyWords = Vue.ref('');
let config = Vue.ref(id);
let lineChart = Vue.ref({
legend: {
data: []
},
xAxis: [],
series: [{
name: '',
type: 'bar',
data: []
}]
});
let activeName = Vue.ref('first');
const tabFirstList = Vue.ref([]);
const tabSecondList = Vue.ref([]);
let dialogFormVisible = Vue.ref(false);
let parentList = Vue.ref([]);
let isAdd = Vue.ref(false);
let form = Vue.ref({
parentId: '',
parentName: '',
desc: '',
scene: {
name: '',
desc: '',
sort: 1,
timeScope: '',
frequency: '',
},
resourceList: []
});
let getResType = (arr) => {
console.log(arr);
var types = arr.map(function (v) {
return v.id;
});
resTypeArr.value = types;
loeadTable();
}
let getKpiType = (arr) => {
console.log(arr);
var types = arr.map(function (v) {
e
return v.kpiId;
});
kpiTypeArr.value = types;
loeadTable();
}
let getBizType = (arr) => {
console.log(arr);
var types = arr.map(function (v) {
return v.busId;
});
busTypeArr.value = types;
loeadTable();
}
// 查询参数
let params = {
keyWords: keyWords.value,
resType: resTypeArr.value.join(','),
kpiType: kpiTypeArr.value.join(','),
bizType: busTypeArr.value.join(','),
configId: config.value
}
let loadFirstList = (reload) => {
if (!reload && tabFirstList.value.length > 0) {
return false;
}
proxy.$http.get(`/api-web/ContrastAnalysis/added`, params, function (res) {
if (res && res.data) {
tabFirstList.value = res.data;
}
});
}
let loadSecondList = (reload) => {
if (!reload && tabSecondList.value.length > 0) {
return false;
}
proxy.$http.get(`/api-web/ContrastAnalysis/notAdded`, params, function (res) {
if (res && res.data) {
tabSecondList.value = res.data;
}
});
}
let tabClick = (tab, event) => {
let name = tab.paneName;
if (name == 'first') {
loadFirstList(false);
} else {
loadSecondList(false);
}
}
let loeadTable = (reload) => {
if (activeName.value == 'first') {
loadFirstList(reload);
} else {
loadSecondList(reload);
}
}
const {
frequencyArr,
loadFrequency
} = frequency();
const {
timeRangeArr,
loadTimeRange,
} = timeRange();
let timeRangeChange = (item) => {
let code = item.ddicCode;
loadFrequency(code);
}
let addRes = (row, index) => {
tabFirstList.value.push(row);
activeName.value = 'first'
//proxy.$global.showMsg("添加成功!");
// 加载折线图
getChartData();
}
let deleteRes = (row, index) => {
proxy.$global.confirm("确认删除资源吗?", function () {
// proxy.$global.showMsg("删除成功!")
tabFirstList.value.splice(index, 1);
getChartData();
})
}
let getChartData = () => {
let timeScope = form.value.scene.timeScope.replaceAll("time_scope_", "")
if (timeScope == '') {
proxy.$global.showMsg("请选择时间范围!", "warning");
return;
}
if (form.value.scene.frequency == '') {
proxy.$global.showMsg("请选择契合频率!", "warning");
return;
}
let resList = tabFirstList.value.map(function (v) {
return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag}
});
// let p = {
// timeScope: timeScope,
// frequency: form.value.scene.frequency,
// resource: resList,
// type : 'avg'
// }
let p = {
"timeScope": timeScope,
"frequency": form.value.scene.frequency,
"resource": [
{
"resId": "F6F24DADC01ADE5DD9583144BE6E8E15",
"kpiId": "KPI20352505",
"kpiFlg": "mem"
},
{
"resId": "C5DC239D719ACAB61231ACED7CE68CD1",
"kpiId": "KPI7054BC34",
"kpiFlg": "cpu"
}
],
"type": "avg"
}
proxy.$http.post(`/api-web/ContrastAnalysis/getLineData`, p, function (res) {
if (res && res.map) {
let map = res.map;
let legend = map.legend;
//let units = map.units;
let xAxis = map.x;
let yArr = map.y;
//
let series = [];
legend.forEach(function (v, i) {
series.push({
name: v,
type: 'line',
data: yArr[i]
});
})
lineChart.value = {
legend: {
data: legend
},
xAxis: xAxis,
series: series
}
}
});
}
// 点击按钮搜索
let onBtnSearch = () => {
loeadTable(true);
}
let onReset = () => {
keyWords.value = '';
resTypeArr.value = [];
kpiTypeArr.value = [];
busTypeArr.value = [];
}
let showDialogForm = (flg) => {
dialogFormVisible.value = flg;
}
let analysisChange = (val) => {
if (val && val === true && parentList.value.length == 0) {
// 加载数据
proxy.$http.post(`/api-web/ContrastAnalysis/selectScene`, {}, function (res) {
if (res && res.data) {
parentList.value = res.data;
}
});
}
}
let saveAnalysis = () => {
let formVal = form.value;
let parentName = formVal.parentName;
let parentId = formVal.parentId;
let name = formVal.scene.name;
let sort = formVal.scene.sort;
let timeScope = formVal.scene.timeScope;
let frequency = formVal.scene.frequency;
let resourceList = tabFirstList.value;
if(name == ''){
proxy.$global.showMsg("请输入场景名称!","warning");
return;
}
if(resourceList && resourceList.length == 0){
proxy.$global.showMsg("请添加资源!","warning");
return;
}
let resList = resourceList.map(function (v) {
return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag,resType:v.resType,kpiUnit:v.kpiUnit}
});
let addParam = {
scene: [{
name: name,
desc: '',
sort: sort,
timeScope: timeScope,
frequency: frequency,
resourceList: resList
}]
}
let url = '';
if (isAdd.value == false) {
if(parentName == ''){
proxy.$global.showMsg("请输入场景分类!","warning");
return;
}
addParam['parentName'] = parentName;
url = '/api-web/ContrastAnalysis/insertScene';
} else {
if(parentId == ''){
proxy.$global.showMsg("请选择场景分类!","warning");
return;
}
addParam['parentId'] = parentId;
url = '/api-web/ContrastAnalysis/updateNode';
}
proxy.$http.post(url, addParam, function (res) {
if (res && res.success) {
proxy.$global.showMsg("添加成功!");
setTimeout(function () {
window.top.location.href = window.top.location.origin + "/#/analysis/index"
}, 1500)
}
});
}
// 挂载完
Vue.onMounted(() => {
if(!id){
activeName.value = 'second';
}
loeadTable();
// 先加载时间范围,然后在加载
loadTimeRange(function (defCode) {
form.value.scene.timeScope = defCode;
loadFrequency(defCode, function () {
if (frequencyArr.value.length > 0) {
form.value.scene.frequency = frequencyArr.value[0].ddicCode;
}
});
});
console.log('onMounted');
})
return {
height,
lineChart,
form,
columns,
tabFirstList,
tabSecondList,
addRes,
deleteRes,
onBtnSearch,
onReset,
getResType,
getKpiType,
getBizType,
keyWords,
loadFirstList,
loadSecondList,
activeName,
tabClick,
frequencyArr,
loadFrequency,
timeRangeArr,
loadTimeRange,
timeRangeChange,
isAdd,
analysisChange,
dialogFormVisible,
showDialogForm,
saveAnalysis,
parentList
}
}
}
... ...
<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
<div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">
<div v-for="(item,index) in childArr">
<analysis-line :legend="lineChart[item.node.id].legend" :xAxis="lineChart[item.node.id].xAxis" :series="lineChart[item.node.id].series">
<template #title="scope" >
{{ index == 0 ? item.node.configName : '' }}
</template>
<template #lineName="scope">
{{ item.node.configName }}
</template>
<template #timeRange="scope">
{{ item.node.timeScope }}
</template>
<template #frequency="scope">
{{ item.node.frequency }}
</template>
<template #tools="scope">
<router-link :to="'/analysis/add?configId=' + item.node.id " class="analysis link-type">
编辑
</router-link>
</template>
</analysis-line>
<el-divider content-position="left">
<!--<div>
<i class="iconfont icon-liebiaomoshi"></i>
<span style="margin-left: 5px">查询条件</span>
</div>-->
</el-divider>
</div>
</div>
</div>
... ...
export default {
name: 'analysisViewIndex',
template: '',
components: {
'analysis-line': Vue.defineAsyncComponent(
() => myImport('components/page/analysis/lineChars/index')
)
},
data() {
return {}
},
setup() {
const {proxy} = Vue.getCurrentInstance();
let height = Vue.ref(window.innerHeight - 10);
let parentInfo = Vue.ref([]);
let childArr = Vue.ref({});
let lineChart = Vue.ref({});
var id = proxy.$global.getQueryVariable('id');
if(id && id == ''){
proxy.$global.showMsg("获取场景信息异常,请联系管理员!","warning");
return;
}
let loadDetail = () => {
// 加载数据
proxy.$http.get(`/api-web/ContrastAnalysis/getNode`, {id:id}, function (res) {
if (res && res.map) {
let child = res.map.sNode;
let parentList = res.map.pNode;
parentInfo.value = parentList;
childArr.value =child;
child.forEach(function (v){
getChartData(v);
})
}
});
}
let getChartData = (v) => {
let nodeId = v.node.id;
let resource = v.resource;
lineChart.value[nodeId] = {
legend: {
data: []
},
xAxis: [],
series: []
}
let resList = resource.map(function (v) {
return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag}
});
// let p = {
// "timeScope": v.node.timeScope,
// "frequency": v.node.frequency,
// "resource": resList,
// "type": "avg"
// }
let p = {
"timeScope": 'DAY',
"frequency": '15',
"resource": [
{
"resId": "F6F24DADC01ADE5DD9583144BE6E8E15",
"kpiId": "KPI20352505",
"kpiFlg": "mem"
},
{
"resId": "C5DC239D719ACAB61231ACED7CE68CD1",
"kpiId": "KPI7054BC34",
"kpiFlg": "cpu"
}
],
"type": "avg"
}
proxy.$http.post(`/api-web/ContrastAnalysis/getLineData`, p, function (res) {
if (res && res.map) {
let map = res.map;
let legend = map.legend;
//let units = map.units;
let xAxis = map.x;
let yArr = map.y;
//
let series = [];
legend.forEach(function (v, i) {
series.push({
name: v,
type: 'line',
data: yArr[i]
});
})
lineChart.value[nodeId] = {
legend: {
data: legend
},
xAxis: xAxis,
series: series
}
}
},undefined,undefined,false);
}
// 挂载完
Vue.onMounted(() => {
loadDetail();
console.log('onMounted');
})
return {
height,
childArr,
parentInfo,
lineChart
}
}
}
... ...
<div class="machine-room">
<div class="room-top">
<el-tabs type="card" @tab-click="handleCommand" v-model="commandVal">
<el-tab-pane v-for="item in commandNameData" :label="item.name" :name="item.val"></el-tab-pane>
</el-tabs>
<!--<el-dropdown @command="handleCommand" class="elSelf" :popper-append-to-body="false">
<span class="el-dropdown-link">
{{commandName}}
<i class="icon-arrow"></i>
</span>
<template #dropdown>
<el-dropdown-menu class="cpuDropdown">
<el-dropdown-item v-for="item in commandNameData" :command="item.val">{{item.name}}</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>-->
</div>
<div class="room-html">
<el-row>
<el-col class="video-item" :span="24" >
<MachineRoom v-if="src" :src="src"></MachineRoom>
</el-col>
</el-row>
</div>
</div>
\ No newline at end of file
... ...
export default {
name: 'machineRoom',
template: '',
components: {
'MachineRoom': Vue.defineAsyncComponent(
() => myImport('views/commonComponents/machineRoom/index')
),
},
props:['commandNameData'],
data(){
return {
domainName:sessionStorage.getItem('domainName'),
accessToken:localStorage.getItem('access_token'),
commandName:'',//下拉选择默认显示名称
htmlName:'',//机房组件名称-html名称
commandVal:'',//下拉选择选中值
src:'',//机房布局html地址
changeIndex:1//每点击tab的值变化
}
},
watch:{
changeIndex(newValue, oldValue) {
console.log("changeIndex",newValue)
}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
proxy.htmlName=Vue.ref();
proxy.commandVal=Vue.ref()
proxy.commandName=Vue.ref();
proxy.src=Vue.ref();
// 挂载完
Vue.onMounted(() => {
proxy.commandVal='one';
proxy.getMachine(proxy.commandVal);
})
//初始获取默认机房选择信息
const getMachine=(command)=>{
//commandNameData机房机柜数据
props.commandNameData.map((item,index)=>{
if(command==item.val){
proxy.htmlName=item.htmlName;
proxy.commandName=item.name;
proxy.commandVal=item.val;
}
})
proxy.src='/h5/machineroom/'+proxy.htmlName+'.html?access_token='+proxy.accessToken+'&changeIndex='+proxy.changeIndex
console.log("htmlName",proxy.htmlName,proxy.src)
}
const handleCommand=(command,event)=>{
proxy.changeIndex++;
proxy.commandVal=command.props.name;
proxy.getMachine(proxy.commandVal)
// proxy.innerVisible=true;
}
return{
getMachine,
handleCommand
}
}
}
\ No newline at end of file
... ...
<iframe v-if="src" style="width:1100px;height:720px;" :src="src" frameborder="0" ref="machineIframe" ></iframe>
... ...
export default {
name: 'machineRoom',
template: '',
components: {},
props:['src'],
data(){
return {
domainName:sessionStorage.getItem('domainName'),
accessToken:localStorage.getItem('access_token'),
// src:'/h5/machineroom/huzhouzaibeione.html?access_token='+this.accessToken
}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
// 挂载完
Vue.onMounted(() => {
})
return{
// src:'/h5/machineroom/'+props.htmlName+'.html?access_token='+proxy.accessToken
}
}
}
\ No newline at end of file
... ...
... ... @@ -41,17 +41,17 @@ export default {
// 半透明的颜色值
const colorArr1 = [
'rgba(151,213,244, 0.8)',
'rgba(239,224,167, 0.8)',
'rgba(44, 110, 255, 0.8)',
'rgba(151,170,255, 0.8)'
'rgba(255,0,255, 0.8)',
'rgba(23,212,152, 0.8)',
'rgba(253,152,58, 0.8)',
'rgba(255,113,66, 0.8)'
]
// 全透明的颜色值
const colorArr2 = [
'rgba(151,213,244, 0)',
'rgba(239,224,167, 0)',
'rgba(44, 110, 255, 0)',
'rgba(151,170,255, 0)'
'rgba(255,0,255, 0)',
'rgba(23,212,152, 0)',
'rgba(253,152,58, 0)',
'rgba(255,113,66, 0)'
]
// 挂载完
Vue.onMounted(() => {
... ...
... ... @@ -13,7 +13,7 @@ export default {
allData: {
polyline: {
title: "申报库CPU监控",
unit: "cpu使用率%",
unit: "使用率%",
data: [{
name: "80.12.97.3",
datas: ["12","15","21","18","20","37","45","23","12","5","7","14"]
... ... @@ -109,8 +109,15 @@ export default {
}
that.allData.polyline.data.push(resData.series[0])
that.updateChart()
that.allData.polyline.data.map((item,index)=>{
if(index==0){
item.name="80.12.97.3"
}else{
item.name="80.12.97.2"
}
})
that.updateChart()
});
},
... ... @@ -143,7 +150,7 @@ export default {
that.allData = {
polyline: {
title: "申报库CPU监控",
unit: "cpu使用率%",
unit: "使用率%",
data: seriesData1
},
xAxis: {
... ... @@ -251,7 +258,8 @@ export default {
},
legend: {
data: ["80.12.97.3","80.12.97.2"],
// data: ["80.12.97.3","80.12.97.2"],
data: legendArr,
itemHeight:0,//图例圆圈大小设置
right: '5%',
top: '5%',
... ... @@ -286,7 +294,7 @@ export default {
},
yAxis: {
type: 'value',
name:'cpu使用率%',
name:unit,
nameTextStyle:{
color:'#ffffff',
padding:[0,0,0,-20]
... ...
... ... @@ -167,7 +167,7 @@ export default {
},
grid: {
top:'3%',
// top:'10%',
left: '3%',
right: '4%',
bottom: '2%',
... ...
... ... @@ -12,7 +12,7 @@ export default {
allData: {
polyline: {
title: "文书库CPU监控",
unit: "cpu使用率%",
unit: "使用率%",
data: [{
name: "80.12.97.7",
data: ["12","15","21","18","20","37","45","23","12","5","7","14"]
... ... @@ -104,6 +104,14 @@ export default {
resData=that.res2.data
}
that.allData.polyline.data.push(resData.series[0])
that.allData.polyline.data.map((item,index)=>{
if(index==0){
item.name="80.12.97.7"
}else{
item.name="80.12.97.8"
}
})
that.updateChart()
});
},
... ... @@ -135,7 +143,7 @@ export default {
that.allData = {
polyline: {
title: "文书库CPU监控",
unit: "cpu使用率%",
unit: "使用率%",
data: seriesData1
},
xAxis: {
... ... @@ -237,7 +245,8 @@ export default {
},
legend: {
data: ["80.12.97.7","80.12.97.8"],
// data: ["80.12.97.7","80.12.97.8"],
data: legendArr,
itemHeight:0,//图例圆圈大小设置
right: '5%',
top: '5%',
... ...
... ... @@ -52,7 +52,8 @@ export default {
return {
titleFontSize: 30,
dateTime: '00-00-00 00:00:00',
colorData:['#0D45FE','#00FFB9','#A35CFF'],
// colorData:['#0D45FE','#00FFB9','#A35CFF'],
colorData:["#97d5f4",'#efe0a7','#e5abd1'],
commandName:'最大值',
commandVal:'max'
}
... ...
... ... @@ -5,8 +5,8 @@
</div>
<div class="ypt">
<el-carousel direction="vertical" :autoplay="true" indicator-position="none" interval="4000" >
<el-carousel-item v-for="(item,index) in cloudData" :key="index">
<el-carousel direction="vertical" :autoplay="true" indicator-position="none" interval="20000" ref="cloudCarousel" >
<el-carousel-item v-for="(item,index) in cloudData" :key="index" name="index">
<div class="item swiper-slide" >
<div class="ui_base u_p3d">
<!--<div class="circlediv">
... ...
... ... @@ -54,9 +54,14 @@ export default {
})
proxy.cloudData=data;
setTimeout(function (){
proxy.$refs.cloudCarousel.setActiveItem(1);
},1000)
run();
//鼠标移入停止环绕动画
$(".ypt__info .ball_base").hover(function() {
$(".ypt__info .ball_base").hover(function() {
//停止平台切换
const top = $(this).position().top;
if(top < 10){
... ...
... ... @@ -5,7 +5,7 @@
</div>
<div class="sjzx">
<div class="item sjzx_machineroom" v-for="item in jfdata" >
<div class="item sjzx_machineroom" v-for="(item,index) in jfdata" >
<h5 >{{item.machineRoomName}}</h5>
<div class="imgDiv">
<!-- <img @click="isShow(item)" class="imgDiv-video" src="/vue3/src/assets/images/zjdp/icon-jf.png">-->
... ... @@ -14,8 +14,8 @@
</div>
<ul class="float-container">
<li><i class='icon-wd'></i><span>温度:{{item.wd}}</span></li>
<li><i class='icon-sd'></i><span>湿度:{{item.sd}}</span></li>
<li><i class='icon-wd'></i><span v-show="index==0">机柜:252</span><span v-show="index==1">机柜:42</span></li>
<li><i class='icon-sd'></i><span v-show="index==0">资产:1568</span><span v-show="index==1">资产:46</span></li>
<li><i class='icon-mj'></i><span>面积:{{item.area}}</span></li>
</ul>
</div>
... ... @@ -35,21 +35,8 @@
</el-dialog>
<!--机房布局-->
<el-dialog v-model="outerVisible" title="机房布局" width="60%">
<el-row>
<el-col :span="11"></el-col>
<el-col :span="2">过道</el-col>
<el-col :span="11"></el-col>
</el-row>
<template #default>
<el-dialog
v-model="innerVisible"
width="60%"
title="Inner Dialog"
append-to-body
>
</el-dialog>
</template>
<el-dialog v-model="outerVisible" :title="dialogMachineName" width="60%" @close="closeDialog">
<GetMachineRoom v-if="commandNameData" :commandNameData="commandNameData"></GetMachineRoom>
</el-dialog>
... ...
export default {
name: 'dataCenter',
template: '',
components: {},
components: {
'GetMachineRoom': Vue.defineAsyncComponent(
() => myImport('views/commonComponents/getMachineRoom/index')
),
},
data(){
return {
domainName:sessionStorage.getItem('domainName'),
... ... @@ -9,10 +13,53 @@ export default {
apiUrl:'/api-web/bigScreen/getMachineRoomInfoList',
jfdata:'',
dialogMachineName:'',
commandNameData:'',
commandNameDataH:[
{
name:'湖州灾备机房一',
htmlName:'huzhouzaibeione',
val:'one'
},
{
name:'湖州灾备机房二',
htmlName:'huzhouzaibeitwo',
val:'two'
},
{
name:'湖州灾备机房三',
htmlName:'huzhouzaibeithree',
val:'three'
}
],//机房布局html数据
commandNameDataX:[
{
name:'萧山IDC二号机房',
htmlName:'xiaoshansecond',
val:'one'
},
{
name:'萧山IDC三号机房',
htmlName:'xiaoshanthird',
val:'two'
},
{
name:'萧山IDC七号机房',
htmlName:'xiaoshanseven',
val:'three'
}
],
commandName:'',//下拉选择默认显示名称
htmlName:'',//机房组件名称-html名称
commandVal:'',//下拉选择选中值
src:'',//机房布局html地址
}
},
setup(props, {attrs, slots, emit}) {
const {proxy} = Vue.getCurrentInstance();
proxy.htmlName=Vue.ref();
proxy.commandVal=Vue.ref()
proxy.commandName=Vue.ref();
proxy.src=Vue.ref();
// 挂载完
Vue.onMounted(() => {
... ... @@ -37,31 +84,36 @@ export default {
});*/
}
})
proxy.jfdata=[
{machineRoomName:'兴议机房',wd:'0',sd:'0',area:'0'},
{machineRoomName:'湖州机房',wd:'0',sd:'0',area:'0'}
]
})
const isShow=(item)=>{
console.log("999",item)
proxy.dialogMachineName=item.machineRoomName
proxy.centerDialogVisible = true
proxy.dialogMachineName=item.machineRoomName;
proxy.centerDialogVisible = true;
}
const isShowOuter=(item)=>{
console.log(";;;",item)
if(item.layout == 1){
proxy.outerVisible = true
}
proxy.dialogMachineName=item.machineRoomName;
proxy.outerVisible = true;
if(item.layout == 0){
proxy.commandNameData=proxy.commandNameDataH;//湖州机房布局数据
}else{
// proxy.commandNameData=proxy.commandNameDataX;//兴议机房布局数据
}
}
//关闭弹框时清空数据
const closeDialog=()=>{
proxy.commandNameData=Vue.ref();
}
return{
centerDialogVisible: Vue.ref(false),
outerVisible: Vue.ref(false),
innerVisible: Vue.ref(false),
isShowOuter,
isShow
isShow,
closeDialog
}
}
}
... ...
... ... @@ -16,6 +16,7 @@ export default {
ySeriesCommon:[],
legendData:[],
xAxisDataDate:[],
yAxisData:[],
optionData:'',
colorData:["#97d5f4",'#efe0a7','#e5abd1'],
chartId:'line-echart-declare'
... ... @@ -42,14 +43,21 @@ export default {
let declareLineData=data.data;
let legendData=[];
let xAxisDataDate=[];
let yAxisData=[];
$.each(declareLineData,function (i,v){
let index=0;
if(i==2){
index=1;
}else{
index=0;
}
ySeriesCommon.push({
name:v.name,
type:'line',
smooth:true,
stack:'Total',
// stack:'Total',//修改数据值在最大值时折线被遮挡
data:v.number,
// yAxisIndex:0,
yAxisIndex:index,
showSymbol:false,
itemStyle : {
normal : {
... ... @@ -64,6 +72,7 @@ export default {
}
},
})
yAxisData.push(v.number);
legendData.push(v.name);
xAxisDataDate.push(v.days);
... ... @@ -71,6 +80,7 @@ export default {
proxy.ySeriesCommon=ySeriesCommon;
proxy.legendData=legendData;
proxy.xAxisDataDate=xAxisDataDate[0];
proxy.yAxisData=yAxisData;
proxy.optionInit();
}
})
... ... @@ -78,6 +88,14 @@ export default {
})
const optionInit=()=>{
console.log("888",proxy.yAxisData)
let data1=proxy.yAxisData[0];
let data2=proxy.yAxisData[1];
let data3=proxy.yAxisData[2];
let min1=proxy.calMin([data1,data2]);
let max1=proxy.calMax([data1,data2]);
let min2=proxy.calMin([data3,data3]);
let max2=proxy.calMax([data3,data3]);
proxy.optionData = {
title: {
... ... @@ -132,26 +150,81 @@ export default {
},
},
yAxis:{
type: 'value',
splitLine:{
lineStyle: {
color:'#0a1b31'
}
yAxis:[
{
type: 'value',
splitLine:{
lineStyle: {
color:'#0a1b31'
}
},
axisLabel:{
color:'#ffffff',
},
splitNumber:5,
min:min1,
max:max1,
interval:(max1-min1)/5
},
axisLabel:{
color:'#ffffff',
},
},
{
type: 'value',
splitLine:{
lineStyle: {
color:'#0a1b31'
}
},
axisLabel:{
color:'#ffffff',
},
splitNumber:5,
min:min2,
max:max2,
interval:(max2-min2)/5
}
],
series: proxy.ySeriesCommon,
itemStyle:{
showSymbol:false
}
};
}
//计算最大值
const calMax=(arr)=>{
let max=0;
arr.forEach((el)=>{
el.forEach((el1)=>{
if(!(el1 === undefined || el1 === '')){
if(max<el1){
max=el1;
}
}
})
})
let maxint=Math.ceil(max/9.5);
let maxval=maxint * 10;//让显示的刻度是整数
return maxval;
}
//计算最小值
const calMin=(arr)=>{
let min=0;
arr.forEach((el)=>{
el.forEach((el1)=>{
if(!(el1 === undefined || el1 === '')){
if(min>el1){
min=el1;
}
}
})
})
let minint=Math.floor(min/10);
let minval=minint * 10;//让显示的刻度是整数
return minval;
}
return{
optionInit
optionInit,
calMax,
calMin
}
}
}
\ No newline at end of file
... ...
... ... @@ -19,7 +19,6 @@ export default {
timer:null,
domainName:sessionStorage.getItem('domainName'),
apiUrl:'/api-web/sxview/getbizListByUser?access_token=',
apiUrl1:'/api-web/sxview/getHealthDegree?busId=53bebbd79f384f619513b50666ea1d48&kpiId=KPIFB844B8B',
checkId:0,//当前选中的tabs
listItem:1,//轮播数-总页数
pageSize:5,//每页显示5条数据
... ...
... ... @@ -196,7 +196,7 @@ export default {
},
{//被攻击点
// type: 'scatter',
type:'effectScatter',
type:'effectScatter',//涟漪状态
hoverAnimation:true,//鼠标移入是否显示动画
coordinateSystem: 'geo',
zlevel: 3,
... ... @@ -206,7 +206,8 @@ export default {
brushType: 'fill',
scale: 2
},
symbol: 'circle',
// symbol: 'circle',//圆形涟漪状态
symbol: 'pin',
symbolSize: 30,
itemStyle:{
color:'#EE4237',
... ...
... ... @@ -46,20 +46,18 @@ export default {
});
// 半透明的颜色值
const colorArr1 = [
'rgba(151,213,244, 0.8)',
'rgba(239,224,167, 0.8)',
'rgba(44, 110, 255, 0.8)',
'rgba(151,170,255, 0.8)'
'rgba(255,0,255, 0.8)',
'rgba(23,212,152, 0.8)',
'rgba(253,152,58, 0.8)',
'rgba(255,113,66, 0.8)'
]
// 全透明的颜色值
const colorArr2 = [
'rgba(151,213,244, 0)',
'rgba(239,224,167, 0)',
'rgba(44, 110, 255, 0)',
'rgba(151,170,255, 0)'
'rgba(255,0,255, 0)',
'rgba(23,212,152, 0)',
'rgba(253,152,58, 0)',
'rgba(255,113,66, 0)'
]
// 挂载完
Vue.onMounted(() => {
proxy.getData();
... ...