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 3042 additions and 206 deletions
@@ -131,7 +131,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留 @@ -131,7 +131,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
131 FOR EACH ROW 131 FOR EACH ROW
132 begin 132 begin
133 IF NEW.isLeaf = 1 THEN 133 IF NEW.isLeaf = 1 THEN
134 - 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"); 134 + 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");
135 END IF; 135 END IF;
136 end$$ 136 end$$
137 DELIMITER ; 137 DELIMITER ;
@@ -143,7 +143,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留 @@ -143,7 +143,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
143 FOR EACH ROW 143 FOR EACH ROW
144 begin 144 begin
145 IF NEW.isLeaf = 1 and OLD.isLeaf =1 THEN 145 IF NEW.isLeaf = 1 and OLD.isLeaf =1 THEN
146 - UPDATE `itsm_demo`.`system_handler` SET `system_name` = NEW.busTypeName, `enable`= NEW.isUse, `sort` = NEW.sort WHERE `system_id` = OLD.busId; 146 + UPDATE `itsm_demo`.`system_handler` SET `system_name` = NEW.busTypeName, `sort` = NEW.sort WHERE `system_id` = OLD.busId;
147 ELSE 147 ELSE
148 DELETE FROM `itsm_demo`.`system_handler` where `system_id` = OLD.busId; 148 DELETE FROM `itsm_demo`.`system_handler` where `system_id` = OLD.busId;
149 END IF; 149 END IF;
@@ -211,7 +211,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留 @@ -211,7 +211,7 @@ MODIFY COLUMN `state` int NULL DEFAULT 0 COMMENT '0:正常,1:延期,3:预留
211 UPDATE `itsm_demo`.`system_handler` SET `system_type`=0 ,`isvirtual`=1 WHERE `system_id` = OLD.busId; 211 UPDATE `itsm_demo`.`system_handler` SET `system_type`=0 ,`isvirtual`=1 WHERE `system_id` = OLD.busId;
212 ELSE 212 ELSE
213 -- 修改项目时修改是否是虚拟 213 -- 修改项目时修改是否是虚拟
214 - UPDATE `itsm_demo`.`system_handler` SET `isvirtual`=NEW.isvirtual WHERE `system_id` = OLD.busId; 214 + UPDATE `itsm_demo`.`system_handler` SET `system_type`=1 ,`isvirtual`=0 WHERE `system_id` = OLD.busId;
215 END IF; 215 END IF;
216 end$$ 216 end$$
217 DELIMITER ; 217 DELIMITER ;
  1 +ALTER TABLE `cloud_backend_monitor`.`b_ops_person`
  2 +ADD COLUMN `idcard` varchar(30) NULL COMMENT '身份证' AFTER `certificate`;
@@ -30,7 +30,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -30,7 +30,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
30 sessions: layui.sessions, 30 sessions: layui.sessions,
31 // 获取编辑指标 31 // 获取编辑指标
32 getEditKpiList:function (){ 32 getEditKpiList:function (){
33 -  
34 var editFlag = localStorage.getItem("editFlag");//是否编辑状态 33 var editFlag = localStorage.getItem("editFlag");//是否编辑状态
35 if(!(editFlag && editFlag == "true")){ 34 if(!(editFlag && editFlag == "true")){
36 editKpiList.push('----'); 35 editKpiList.push('----');
@@ -197,12 +196,16 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -197,12 +196,16 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
197 //获取编辑状态 196 //获取编辑状态
198 var editFlag = localStorage.getItem("editFlag");//是否编辑状态 197 var editFlag = localStorage.getItem("editFlag");//是否编辑状态
199 var piechbox = '<div class="layui-form" style="float: left;top: 15px;position: relative;left: 12px;" >' + 198 var piechbox = '<div class="layui-form" style="float: left;top: 15px;position: relative;left: 12px;" >' +
200 - '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" data-unit="'+data.kpiUnit+'" ' +  
201 - 'data-id="' + kpiId + '" data-kpiname="' + data.name + '" data-flag="' + data.flag + '" data-name='+data.name+'></div>'; 199 + '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" data-unit="' + data.kpiUnit + '" ' +
  200 + 'data-id="' + kpiId + '" data-kpiname="' + data.name + '" data-flag="' + data.flag + '" data-name=' + data.name + '></div>';
202 pie.find("li").attr("data-degree", val); 201 pie.find("li").attr("data-degree", val);
203 - var resStyle = obj.alarmEleMatchStyle(data.flag,kpiId); 202 + var resStyle = obj.alarmEleMatchStyle(data.flag, kpiId);
204 203
205 - // Start Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态 204 + // 获取配置指标 ww 优化
  205 + // var kpiList = obj.getEditKpiList();
  206 + //
  207 + // // 没有配置字典指标则按照性能指标判断
  208 + // if(kpiList.length == 1){
206 // // 可编辑状态的性能指标 209 // // 可编辑状态的性能指标
207 // if(data.ident=='1' && editFlag && editFlag == "true"){ 210 // if(data.ident=='1' && editFlag && editFlag == "true"){
208 // pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>"); 211 // pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
@@ -210,33 +213,29 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -210,33 +213,29 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
210 // }else{ 213 // }else{
211 // pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线 214 // pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
212 // } 215 // }
213 - // 获取配置指标  
214 - var kpiList = obj.getEditKpiList();  
215 -  
216 - // 没有配置字典指标则按照性能指标判断  
217 - if(kpiList.length == 1){  
218 - // 可编辑状态的性能指标  
219 - if(data.ident=='1' && editFlag && editFlag == "true"){  
220 - pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");  
221 - form.render();  
222 - }else{  
223 - pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线  
224 - }  
225 - } else {  
226 - // 按照指标配置展示  
227 - let kpiObject = obj.checkKpi(kpiId)  
228 - if(kpiObject[data.id] && kpiObject[data.id] == true && editFlag && editFlag == "true"){  
229 - pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>"); 216 + // } else {
  217 + // // 按照指标配置展示
  218 + // let kpiObject = obj.checkKpi(kpiId)
  219 + // if(kpiObject[data.id] && kpiObject[data.id] == true && editFlag && editFlag == "true"){
  220 + // pie.find(".pie-half-text").html(piechbox+"<b><u style='"+resStyle+"'>"+val + "%</u></b>");
  221 + // form.render();
  222 + // } else {
  223 + // pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线
  224 + // }
  225 + // }
  226 + // End Wang 2021/11/18 15:04 查询字典编辑指标,判断编辑状态
  227 +
  228 + //可编辑状态的性能指标 徐毫杰还原
  229 + if (data.ident == '1' && editFlag && editFlag == "true") {
  230 + pie.find(".pie-half-text").html(piechbox + "<b><u style='" + resStyle + "'>" + val + "%</u></b>");
230 form.render(); 231 form.render();
231 } else { 232 } else {
232 - pie.find(".pie-half-text").find("b").html("<u style='"+resStyle+"'>"+val + "%</u>"); //增加下划线 233 + pie.find(".pie-half-text").find("b").html("<u style='" + resStyle + "'>" + val + "%</u>"); //增加下划线
233 } 234 }
234 - }  
235 - // End Wang 2021/11/18 15:04 查询字典编辑指标,判断编辑状态  
236 235
237 pie.find(".pie-half-text").find("span").text(data.name); 236 pie.find(".pie-half-text").find("span").text(data.name);
238 - pie.find(".pie-half-text").find("b").css('cursor','pointer'); //增加悬浮显示手指样式  
239 - pie.find(".pie-half-text").css('padding-top','50px'); 237 + pie.find(".pie-half-text").find("b").css('cursor', 'pointer'); //增加悬浮显示手指样式
  238 + pie.find(".pie-half-text").css('padding-top', '50px');
240 pie.find(".pie-half-text").find("span").hide(); 239 pie.find(".pie-half-text").find("span").hide();
241 240
242 //计算仪表盘的旋转角度 241 //计算仪表盘的旋转角度
@@ -1736,39 +1735,62 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -1736,39 +1735,62 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
1736 } 1735 }
1737 if (d[v.id] && d[v.id].kpiId) { 1736 if (d[v.id] && d[v.id].kpiId) {
1738 var value = d[v.id]; 1737 var value = d[v.id];
1739 - var resStyle = obj.alarmEleMatchStyle(value.flag,v.id);  
1740 - // Start Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态  
1741 - // //拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标,则可以下探 1738 + var resStyle = obj.alarmEleMatchStyle(value.flag, v.id);
  1739 + // let arr = obj.getEditKpiList();
  1740 + // var chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
  1741 + // 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';
  1742 + // if(arr.length == 1){
1742 // if (value.kpiIdent == '1' || value.isWarning == '1') { 1743 // if (value.kpiIdent == '1' || value.isWarning == '1') {
1743 - // var chbox = '';  
1744 - // if(editFlag && editFlag == "true" && value.kpiIdent == '1'){  
1745 - // chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +  
1746 - // 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="'+v.unit+'">'; 1744 + //
  1745 + // if (!(editFlag && editFlag == "true" && value.kpiIdent == '1')) {
  1746 + // chbox = '';
1747 // } 1747 // }
1748 - // return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;'+resStyle+'" ' + 'data-isWarning="'+value.isWarning+'" data-ident="'+value.kpiIdent+'"'+  
1749 - // 'data-trend="'+value.isTrend+'" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +  
1750 - // '<a class="detail_row_menu hide" data-isWarning="'+value.isWarning+'" data-ident="'+value.kpiIdent+'" data-trend="'+value.isTrend+'" ' + 1748 + // return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
  1749 + // 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
  1750 + // '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
1751 // 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' + 1751 // 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
1752 - // 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="'+resType+'"' + 1752 + // 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
1753 // '>' + 1753 // '>' +
1754 // '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>'; 1754 // '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
1755 // 1755 //
1756 // } else { 1756 // } else {
1757 // var $html = addIconByValue(value.kpiValue); 1757 // var $html = addIconByValue(value.kpiValue);
1758 // //根据资源类型判断 修改样式 1758 // //根据资源类型判断 修改样式
1759 - // if($html!="" && resType!="" && resType=="HOST_X86SERVER" && $html=='<i class="iconfont icon-size serious">\ue668</i>'){  
1760 - // $html='<i class="iconfont icon-size grayColor">\ue61e</i>'; 1759 + // if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
  1760 + // $html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
1761 // } 1761 // }
1762 // return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>'; 1762 // return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
1763 // } 1763 // }
1764 - let arr = obj.getEditKpiList();  
1765 - var chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +  
1766 - 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';  
1767 - if(arr.length == 1){  
1768 - if (value.kpiIdent == '1' || value.isWarning == '1') { 1764 + // } else {
  1765 + // var kpiId = d[v.id].kpiId;
  1766 + // // 按照指标配置展示
  1767 + // let kpiObject = obj.checkKpi(kpiId)
  1768 + // if(kpiObject[kpiId] && kpiObject[kpiId] == true && editFlag && editFlag == "true"){
  1769 + // return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
  1770 + // 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
  1771 + // '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +
  1772 + // 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +
  1773 + // 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +
  1774 + // '>' +
  1775 + // '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';
  1776 + // } else {
  1777 + // var $html = addIconByValue(value.kpiValue);
  1778 + // //根据资源类型判断 修改样式
  1779 + // if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {
  1780 + // $html = '<i class="iconfont icon-size grayColor">\ue61e</i>';
  1781 + // }
  1782 + // return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
  1783 + // }
  1784 + // }
  1785 + //
  1786 + // // End Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态
1769 1787
1770 - if (!(editFlag && editFlag == "true" && value.kpiIdent == '1')) {  
1771 - chbox = ''; 1788 + //拼接表空间名称、文件系统名称等等,如果是性能指标或者趋势指标,则可以下探 徐毫杰还原
  1789 + if (value.kpiIdent == '1' || value.isWarning == '1') {
  1790 + var chbox = '';
  1791 + if (editFlag && editFlag == "true" && value.kpiIdent == '1') {
  1792 + chbox = '<input lay-filter="kpicheckboxfilter" type="checkbox" lay-skin="primary" name="identKpiCheckbox" ' +
  1793 + 'data-id="' + v.id + '" data-kpiname="' + v.name + '" data-flag="' + value.flag + '" data-name="' + kpiname + '" data-unit="' + v.unit + '">';
1772 } 1794 }
1773 return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' + 1795 return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +
1774 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' + 1796 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +
@@ -1787,29 +1809,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -1787,29 +1809,6 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
1787 return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>'; 1809 return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';
1788 } 1810 }
1789 } else { 1811 } else {
1790 - var kpiId = d[v.id].kpiId;  
1791 - // 按照指标配置展示  
1792 - let kpiObject = obj.checkKpi(kpiId)  
1793 - if(kpiObject[kpiId] && kpiObject[kpiId] == true && editFlag && editFlag == "true"){  
1794 - return chbox + '<a class="link showlinechart_' + tableId + '" style="padding-left:5px;' + resStyle + '" ' + 'data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '"' +  
1795 - 'data-trend="' + value.isTrend + '" data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '">' + value.kpiValue + '</a>' +  
1796 - '<a class="detail_row_menu hide" data-isWarning="' + value.isWarning + '" data-ident="' + value.kpiIdent + '" data-trend="' + value.isTrend + '" ' +  
1797 - 'data-id="' + v.id + '" data-kpiname="' + kpiname + '" data-name="' + v.name + '" data-flag="' + value.flag + '"' +  
1798 - 'data-canca="' + value.canCA + '" data-incaing="' + value.inCAing + '" data-restype="' + resType + '"' +  
1799 - '>' +  
1800 - '<img style="width: 20px;height: 20px;" src="/src/style/img/icon_row_menu.png"></a>';  
1801 - } else {  
1802 - var $html = addIconByValue(value.kpiValue);  
1803 - //根据资源类型判断 修改样式  
1804 - if ($html != "" && resType != "" && resType == "HOST_X86SERVER" && $html == '<i class="iconfont icon-size serious">\ue668</i>') {  
1805 - $html = '<i class="iconfont icon-size grayColor">\ue61e</i>';  
1806 - }  
1807 - return '<a data-id="' + v.id + '"data-flag="' + value.flag + '">' + $html + value.kpiValue + '</a>';  
1808 - }  
1809 - }  
1810 -  
1811 - // End Wang 2021/11/18 15:03 查询字典编辑指标,判断编辑状态  
1812 - } else {  
1813 return d[v.id]; 1812 return d[v.id];
1814 } 1813 }
1815 } 1814 }
@@ -4,7 +4,6 @@ @@ -4,7 +4,6 @@
4 4
5 /*最外层样式*/ 5 /*最外层样式*/
6 .container{ 6 .container{
7 - background: white;  
8 background-color: #CCCCCC; 7 background-color: #CCCCCC;
9 padding: 3px 3px; 8 padding: 3px 3px;
10 width:calc(100% - 10px); 9 width:calc(100% - 10px);
@@ -592,13 +592,18 @@ export default { @@ -592,13 +592,18 @@ export default {
592 let arr = getCheckedFile(); 592 let arr = getCheckedFile();
593 593
594 let info = []; 594 let info = [];
  595 + let fileNameData=[];
595 arr.map(function (v) { 596 arr.map(function (v) {
596 info.push(`${v.id}__${v.type}`); 597 info.push(`${v.id}__${v.type}`);
  598 + if (v.checked != undefined && v.checked == true) {
  599 + fileNameData.push(v.fileName)
  600 + }
597 }) 601 })
  602 + alert(fileNameData)
598 603
599 let params = { 604 let params = {
600 info: info.join(","), 605 info: info.join(","),
601 - fileName: '' 606 + fileName:fileNameData
602 } 607 }
603 608
604 proxy.$http.downloadFile('/inspection-report/file/download', params); 609 proxy.$http.downloadFile('/inspection-report/file/download', params);
@@ -25,7 +25,12 @@ @@ -25,7 +25,12 @@
25 </slot> 25 </slot>
26 </template> 26 </template>
27 </el-table-column> 27 </el-table-column>
28 - <slot name="tools" v-if="columns.length > 0" ></slot> 28 +
  29 + <el-table-column v-if="showTools && columns.length > 0" label="操作" width="80">
  30 + <template #default="scope">
  31 + <slot name="tools" :scope="scope" ></slot>
  32 + </template>
  33 + </el-table-column>
29 </el-table> 34 </el-table>
30 <!-- 分页 --> 35 <!-- 分页 -->
31 <div style='text-align: center;background-color: white' v-if="showPage"> 36 <div style='text-align: center;background-color: white' v-if="showPage">
@@ -76,6 +76,10 @@ export default { @@ -76,6 +76,10 @@ export default {
76 type: Number, 76 type: Number,
77 default: window.innerWidth 77 default: window.innerWidth
78 }, 78 },
  79 + showTools:{
  80 + type: Boolean,
  81 + default: false
  82 + },
79 83
80 }, 84 },
81 data() { 85 data() {
@@ -20,6 +20,8 @@ url: @@ -20,6 +20,8 @@ url:
20 bigScreen: http://127.0.0.1:8081 20 bigScreen: http://127.0.0.1:8081
21 # 一体化视图 21 # 一体化视图
22 ythView: http://192.168.0.69:18089 22 ythView: http://192.168.0.69:18089
  23 + # cmdb
  24 + cmdbWeb: http://192.168.0.68:80
23 # 业务健康度 25 # 业务健康度
24 ywHealth: http://80.12.92.117:83 26 ywHealth: http://80.12.92.117:83
25 #流程系统路径,当ssl.enabled=true时,http要改为https,并修改流程nginx的conf文件 27 #流程系统路径,当ssl.enabled=true时,http要改为https,并修改流程nginx的conf文件
  1 +@charset "utf-8";
  2 +*
  3 +{
  4 + margin:0;
  5 + padding:0;
  6 +}
  7 +html
  8 +{
  9 + width:100%;
  10 + height:100%;
  11 + font-size:14px;
  12 + font-family:Arial, Helvetica, sans-serif;
  13 + -webkit-text-size-adjust:none;
  14 + background-image:url("../img/img-beijing.png");
  15 + background-repeat: no-repeat;
  16 + background-position: center;
  17 +}
  18 +body
  19 +{
  20 + padding:5px;
  21 +}
  22 +
  23 +.outlinediv {
  24 + padding-top: 30px;
  25 + border: 2px solid #0a93be;
  26 + width: 900px;
  27 + height: 600px;
  28 + margin: 0 auto;
  29 + font-size: 16px;
  30 + border-radius: 5px;
  31 + text-align: center;
  32 + color: #bbb;
  33 + position: relative;
  34 + display: list-item;
  35 +
  36 +
  37 +}
  38 +.outlinediv span {
  39 + color: rgba(0, 0, 0, 0.89);
  40 + line-height: 20px;
  41 + font-size: 14px;
  42 +}
  43 +.outlinediv .xiaoshansecond-topcabinet{
  44 + margin-top: 20px;
  45 + margin-left: 7%;
  46 + padding: 20px;
  47 + width: 80%;
  48 + height:100px;
  49 +
  50 +}
  51 +
  52 +.outlinediv .xiaoshansecond-middlecabinet{
  53 + margin-top: 50px;
  54 + margin-bottom: 50px;
  55 + margin-left: 7%;
  56 + padding: 20px;
  57 + width: 80%;
  58 + height:100px;
  59 +
  60 +}
  61 +.outlinediv .xiaoshansecond-bottomcabinet{
  62 + margin-left: 7%;
  63 + padding: 20px;
  64 + width: 80%;
  65 + height:100px;
  66 +
  67 +}
  68 +.cabinet{
  69 + width:auto;height:auto;max-height:100%;max-width:100%;
  70 +}
  71 +table{
  72 + margin-top: 20px;
  73 + border-collapse:collapse;
  74 +}
  75 +table tr{
  76 + height: 50px;
  77 +}
  78 +tr.sevenempty {
  79 + height: 10px;
  80 +}
  81 +table tr td{
  82 + position: relative;
  83 + max-width: 35px;
  84 +}
  85 +
  86 +table td .cabinetId{
  87 +
  88 + position: absolute;/*绝对定位*/
  89 + top:20px;
  90 + width: 100%;
  91 + bottom: 0px;/*离底下0像素*/
  92 + left: 0px;/*离左边0像素*/
  93 + text-align: center;
  94 +
  95 + font-size: 12px;
  96 +
  97 + color: white;
  98 +}
  99 +.outlinediv .xiaoshanthird-topcabinet{
  100 + margin-left:22%;
  101 + padding: 20px;
  102 + width: 80%;
  103 + }
  104 +.outlinediv .xiaoshanseven-leftcabinet{
  105 + margin-left:1%;
  106 + width: 40%;
  107 +}
  108 +.outlinediv .xiaoshanseven-rightcabinet{
  109 + margin-left: 5px;
  110 + width: 40%;
  111 +}
  112 +.outlinediv .xiaoshanseven-middlecabinet{
  113 + margin-top: 20px;
  114 + padding-top: 30%;
  115 + border: 2px solid #111D1A;
  116 + width:12% ;
  117 + height: 255px;
  118 + text-align: center;
  119 +}
  120 +.outlinediv .huzhouone-topcabinet{
  121 + margin-left:10%;
  122 + width: 90%;
  123 +}
  124 +tr.zaibeione{
  125 + height: 90px;
  126 +}
  127 +.zaibei.cabinetId{
  128 + position: absolute;/*绝对定位*/
  129 + top:10px;
  130 + width: 100%;
  131 + bottom: 0px;/*离底下0像素*/
  132 + left: 0px;/*离左边0像素*/
  133 + text-align: center;
  134 +
  135 + font-size: 8px;
  136 +
  137 + color: white;
  138 +}
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6 + <meta http-equiv="Pragma" content="no-cache" />
  7 + <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  8 + <meta http-equiv="Expires" content="0" />
  9 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  10 +</head>
  11 +<body>
  12 +<div class="outlinediv" style="height: 666px">
  13 + <span>湖州灾备一机房平面图</span>
  14 + <div class="huzhouone-topcabinet">
  15 + <table>
  16 + <tr>
  17 + <td><img></td>
  18 + <td><img></td>
  19 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 4A</span></a></td>
  20 + <td><img></td>
  21 + <td><img></td>
  22 + <td><img ></td>
  23 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-7</span></a></td>
  24 + <td><img/></td>
  25 + <td><img/></td>
  26 + <td><img ></td>
  27 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FA-6</span></a></td>
  28 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-5</span></a></td>
  29 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FA-4</span></a></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-3</span></a></td>
  31 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-2</span></a></td>
  32 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FA-1</span></a></td>
  33 + <td><img/></td>
  34 + <td><img/></td>
  35 + <td><img ></td>
  36 + <td><img></td>
  37 + <td><img></td>
  38 + <td><img></td>
  39 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-3</span></a></td>
  40 + </tr>
  41 + <tr>
  42 + <td><img></td>
  43 + <td><img></td>
  44 + <td><img ></td>
  45 + <td><img></td>
  46 + <td><img></td>
  47 + <td><img ></td>
  48 + <td><img ></td>
  49 + <td><img/></td>
  50 + <td><img/></td>
  51 + <td><img ></td>
  52 + <td><img ></td>
  53 + <td><img></td>
  54 + <td><img></td>
  55 + <td><img></td>
  56 + <td><img ></td>
  57 + <td><img></td>
  58 + <td><img/></td>
  59 + <td><img/></td>
  60 + <td><img ></td>
  61 + <td><img></td>
  62 + <td><img></td>
  63 + <td><img></td>
  64 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
  65 + </tr>
  66 + <tr>
  67 + <td><img></td>
  68 + <td><img></td>
  69 + <td><img ></td>
  70 + <td><img></td>
  71 + <td><img></td>
  72 + <td><img ></td>
  73 + <td><img ></td>
  74 + <td><img/></td>
  75 + <td><img/></td>
  76 + <td><img ></td>
  77 + <td><img ></td>
  78 + <td><img></td>
  79 + <td><img></td>
  80 + <td><img></td>
  81 + <td><img ></td>
  82 + <td><img></td>
  83 + <td><img/></td>
  84 + <td><img/></td>
  85 + <td><img ></td>
  86 + <td><img></td>
  87 + <td><img></td>
  88 + <td><img></td>
  89 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-4</span></a></td>
  90 + </tr>
  91 + <tr>
  92 + <td><img></td>
  93 + <td><img></td>
  94 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 3A</span></a></td>
  95 + <td><img></td>
  96 + <td><img></td>
  97 + <td><img ></td>
  98 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-7</span></a></td>
  99 + <td><img/></td>
  100 + <td><img/></td>
  101 + <td><img ></td>
  102 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FB-6</span></a></td>
  103 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-5</span></a></td>
  104 + <td><a href="/h5/machineroomDetail/FB-4.html"><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">FB-4</span></a></td>
  105 + <td><a href="/h5/machineroomDetail/FB-3.html"><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-3</span></a></td>
  106 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-2</span></a></td>
  107 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">FB-1</span></a></td>
  108 + <td><img/></td>
  109 + <td><img/></td>
  110 + <td><img ></td>
  111 + <td><img></td>
  112 + <td><img></td>
  113 + <td><img></td>
  114 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
  115 + </tr>
  116 + <tr class="zaibeione"></tr>
  117 + <tr>
  118 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-11</span></a></td>
  119 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-10</span></a></td>
  120 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 1A</span></a></td>
  121 + <td width="10px"></td>
  122 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">EMC1</span></a></td>
  123 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">EMC2</span></a></td>
  124 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">EMC3</span></a></td>
  125 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-7</span></a></td>
  126 + <td><img></td>
  127 + <td><img ></td>
  128 + <td><img></td>
  129 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">小型机595A</span></a></td>
  130 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机595B</span></a></td>
  131 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机3</span></a></td>
  132 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-2</span></a></td>
  133 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-1</span></a></td>
  134 + <td><img></td>
  135 +
  136 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XA-1</span></a></td>
  137 + </tr>
  138 + <tr>
  139 + <td><img></td>
  140 + <td><img></td>
  141 + <td><img ></td>
  142 + <td><img></td>
  143 + <td><img></td>
  144 + <td><img ></td>
  145 + <td><img ></td>
  146 + <td><img/></td>
  147 + <td><img/></td>
  148 + <td><img ></td>
  149 + <td><img ></td>
  150 + <td><img></td>
  151 + <td><img></td>
  152 + <td><img></td>
  153 + <td><img ></td>
  154 + <td><img></td>
  155 + <td><img/></td>
  156 + <td><img/></td>
  157 + <td><img ></td>
  158 + <td><img></td>
  159 + <td><img></td>
  160 + <td><img></td>
  161 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
  162 + </tr>
  163 + <tr>
  164 + <td><img></td>
  165 + <td><img></td>
  166 + <td><img ></td>
  167 + <td><img></td>
  168 + <td><img></td>
  169 + <td><img ></td>
  170 + <td><img ></td>
  171 + <td><img/></td>
  172 + <td><img/></td>
  173 + <td><img ></td>
  174 + <td><img ></td>
  175 + <td><img></td>
  176 + <td><img></td>
  177 + <td><img></td>
  178 + <td><img ></td>
  179 + <td><img></td>
  180 + <td><img/></td>
  181 + <td><img/></td>
  182 + <td><img ></td>
  183 + <td><img></td>
  184 + <td><img></td>
  185 + <td><img></td>
  186 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-2</span></a></td>
  187 + </tr>
  188 + <tr>
  189 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-11</span></a></td>
  190 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-10</span></a></td>
  191 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">PDA 2B</span></a></td>
  192 + <td style="width: 15px"></td>
  193 + <td><img></td>
  194 + <td><img ></td>
  195 + <td><img></td>
  196 + <td><img></td>
  197 + <td><img></td>
  198 + <td><img ></td>
  199 + <td><img></td>
  200 + <td><img/></td>
  201 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">小型机570-4</span></a></td>
  202 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="zaibei cabinetId">小型机570-3</span></a></td>
  203 + <td><img ></td>
  204 + <td><img></td>
  205 + <td><img></td>
  206 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">XB-1</span></a></td>
  207 + <td><img ></td>
  208 + <td><img></td>
  209 + <td><img></td>
  210 + <td><img></td>
  211 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId"></span></a></td>
  212 + </tr>
  213 + <tr>
  214 + <td><img></td>
  215 + <td><img></td>
  216 + <td><img ></td>
  217 + <td><img></td>
  218 + <td><img></td>
  219 + <td><img ></td>
  220 + <td><img ></td>
  221 + <td><img/></td>
  222 + <td><img/></td>
  223 + <td><img ></td>
  224 + <td><img ></td>
  225 + <td><img></td>
  226 + <td><img></td>
  227 + <td><img></td>
  228 + <td><img ></td>
  229 + <td><img></td>
  230 + <td><img/></td>
  231 + <td><img/></td>
  232 + <td><img ></td>
  233 + <td><img></td>
  234 + <td><img></td>
  235 + <td><img></td>
  236 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="zaibei cabinetId">AC-1</span></a></td>
  237 + </tr>
  238 + </table>
  239 + </div>
  240 +</div>
  241 +</body>
  242 +</html>
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6 + <meta http-equiv="Pragma" content="no-cache" />
  7 + <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  8 + <meta http-equiv="Expires" content="0" />
  9 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  10 + <style type="text/css">
  11 + table tr td {
  12 + max-width: 80px;
  13 + }
  14 + </style>
  15 +</head>
  16 +<body>
  17 +<div class="outlinediv" >
  18 + <span>湖州灾备三机房平面图</span>
  19 + <div class="huzhouone-topcabinet" style="margin-left: 25%;padding-top: 30px">
  20 + <table>
  21 + <tr>
  22 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">TB-6</span></a></td>
  23 + <td style="width: 30px"></td>
  24 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">TB-5</span></a></td>
  25 + <td style="width: 30px"></td>
  26 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  27 + <td style="width: 30px"></td>
  28 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  29 + <td style="width: 30px"></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  31 + <td style="width: 30px"></td>
  32 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
  33 +
  34 + </tr>
  35 + <tr>
  36 + <td><img></td>
  37 + <td><img ></td>
  38 + <td><img></td>
  39 + <td><img></td>
  40 + <td><img ></td>
  41 + <td><img ></td>
  42 +
  43 + </tr>
  44 + <tr>
  45 + <td><img></td>
  46 + <td><img ></td>
  47 + <td><img></td>
  48 + <td><img></td>
  49 + <td><img ></td>
  50 + <td><img ></td>
  51 + </tr>
  52 + <tr>
  53 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
  54 + <td style="width: 30px"></td>
  55 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  56 + <td style="width: 30px"></td>
  57 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId"></span></a></td>
  58 + <td style="width: 30px"></td>
  59 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  60 + <td style="width: 30px"></td>
  61 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  62 + <td style="width: 30px"></td>
  63 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  64 + </tr>
  65 + <tr class="zaibeione"></tr>
  66 +
  67 + </table>
  68 + </div>
  69 +</div>
  70 +</body>
  71 +</html>
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6 + <meta http-equiv="Pragma" content="no-cache" />
  7 + <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  8 + <meta http-equiv="Expires" content="0" />
  9 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  10 + <style type="text/css">
  11 + table tr td {
  12 + max-width: 80px;
  13 + }
  14 + </style>
  15 +</head>
  16 +<body>
  17 +<div class="outlinediv" >
  18 + <span>湖州灾备二机房平面图</span>
  19 + <div class="huzhouone-topcabinet" style="margin-left: 20%">
  20 + <table>
  21 + <tr>
  22 +
  23 + <td><img/></td>
  24 + <td style="width: 30px"></td>
  25 +
  26 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-1</span></a></td>
  27 + <td style="width: 30px"></td>
  28 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LA-2</span></a></td>
  29 + <td style="width: 30px"></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-3</span></a></td>
  31 + <td style="width: 30px"></td>
  32 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-2</span></a></td>
  33 + <td style="width: 30px"></td>
  34 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LA-1</span></a></td>
  35 + <td style="width: 30px"></td>
  36 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">PDA6B</span></a></td>
  37 +
  38 + </tr>
  39 + <tr>
  40 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">AC-5</span></a></td>
  41 + <td style="width: 30px"></td>
  42 + <td><img></td>
  43 + <td><img ></td>
  44 + <td><img></td>
  45 + <td><img></td>
  46 + <td><img ></td>
  47 + <td><img ></td>
  48 +
  49 + </tr>
  50 + <tr>
  51 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId"></span></a></td>
  52 + <td style="width: 30px"></td>
  53 + <td><img></td>
  54 + <td><img ></td>
  55 + <td><img></td>
  56 + <td><img></td>
  57 + <td><img ></td>
  58 + <td><img ></td>
  59 + </tr>
  60 + <tr>
  61 + <td><img/></td>
  62 + <td style="width: 30px"></td>
  63 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LB-1</span></a></td>
  64 + <td style="width: 30px"></td>
  65 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-2</span></a></td>
  66 + <td style="width: 30px"></td>
  67 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">LB-3</span></a></td>
  68 + <td style="width: 30px"></td>
  69 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-2</span></a></td>
  70 + <td style="width: 30px"></td>
  71 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">LB-1</span></a></td>
  72 + <td style="width: 30px"></td>
  73 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">PDA5A</span></a></td>
  74 + </tr>
  75 + <tr class="zaibeione"></tr>
  76 +
  77 + </table>
  78 + </div>
  79 +</div>
  80 +</body>
  81 +</html>
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6 + <meta http-equiv="Pragma" content="no-cache" />
  7 + <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  8 + <meta http-equiv="Expires" content="0" />
  9 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  10 +</head>
  11 +<body>
  12 + <div class="outlinediv">
  13 + <span>2号机房平面图</span>
  14 + <div class="xiaoshansecond-topcabinet">
  15 + <table>
  16 + <tr>
  17 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F1</span></a></td>
  18 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F2</span></a></td>
  19 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F3</span></a></td>
  20 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F4</span></a></td>
  21 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F5</span></a></td>
  22 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F6</span></a></td>
  23 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F7</span></a></td>
  24 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F8</span></a></td>
  25 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F9</span></a></td>
  26 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F10</span></a></td>
  27 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F11</span></a></td>
  28 + <td><a href=""><img src="img/emptycabinet.png" class="cabinet"></a></td>
  29 + <td><a href=""><img src="img/emptycabinet.png" class="cabinet"></a></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F14</span></a></td>
  31 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F15</span></a></td>
  32 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F16</span></a></td>
  33 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F17</span></a></td>
  34 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F18</span></a></td>
  35 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F19</span></a></td>
  36 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">F20</span></a></td>
  37 + </tr>
  38 + </table>
  39 + </div>
  40 + <div class="xiaoshansecond-middlecabinet">
  41 + <table>
  42 + <tr>
  43 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G1</span></a></td>
  44 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G2</span></a></td>
  45 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G3</span></a></td>
  46 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G4</span></a></td>
  47 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G5</span></a></td>
  48 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G6</span></a></td>
  49 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G7</span></a></td>
  50 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G8</span></a></td>
  51 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G9</span></a></td>
  52 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G10</span></a></td>
  53 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G11</span></a></td>
  54 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G12</span></a></td>
  55 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G13</span></a></td>
  56 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G14</span></a></td>
  57 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G15</span></a></td>
  58 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G16</span></a></td>
  59 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G17</span></a></td>
  60 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G18</span></a></td>
  61 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">G19</span></a></td>
  62 + </tr>
  63 + </table>
  64 + </div>
  65 + <div class="xiaoshansecond-bottomcabinet">
  66 + <table>
  67 + <tr>
  68 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H1</span></a></td>
  69 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H2</span></a></td>
  70 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H3</span></a></td>
  71 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H4</span></a></td>
  72 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H5</span></a></td>
  73 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H6</span></a></td>
  74 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H7</span></a></td>
  75 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H8</span></a></td>
  76 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H9</span></a></td>
  77 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H10</span></a></td>
  78 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H11</span></a></td>
  79 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H12</span></a></td>
  80 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H13</span></a></td>
  81 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H14</span></a></td>
  82 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H15</span></a></td>
  83 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H16</span></a></td>
  84 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H17</span></a></td>
  85 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H18</span></a></td>
  86 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H19</span></a></td>
  87 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">H20</span></a></td>
  88 + </tr>
  89 + </table>
  90 + </div>
  91 + </div>
  92 +</body>
  93 +</html>
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  6 + <meta http-equiv="Expires" content="0"/>
  7 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  8 +</head>
  9 +<body>
  10 +<div class="outlinediv" style="width: 950px">
  11 + <span>7号机房平面图</span>
  12 + <div style="width: 100%;height: 100%;display: inline-flex">
  13 + <div class="xiaoshanseven-leftcabinet">
  14 + <table>
  15 + <tr>
  16 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I1</span></a></td>
  17 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I2</span></a></td>
  18 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I3</span></a></td>
  19 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I4</span></a></td>
  20 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I5</span></a></td>
  21 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I6</span></a></td>
  22 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I7</span></a></td>
  23 + </tr>
  24 + <tr class="sevenempty"></tr>
  25 + <tr>
  26 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H1</span></a></td>
  27 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H2</span></a></td>
  28 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H3</span></a></td>
  29 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H4</span></a></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H5</span></a></td>
  31 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H6</span></a></td>
  32 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H7</span></a></td>
  33 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H8</span></a></td>
  34 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H9</span></a></td>
  35 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H10</span></a>
  36 + </td>
  37 +
  38 + </tr>
  39 +
  40 + <tr class="sevenempty"></tr>
  41 + <tr>
  42 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G1</span></a></td>
  43 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G2</span></a></td>
  44 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G3</span></a></td>
  45 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G4</span></a></td>
  46 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G5</span></a></td>
  47 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G6</span></a></td>
  48 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G7</span></a></td>
  49 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G8</span></a></td>
  50 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G9</span></a></td>
  51 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G10</span></a>
  52 + </td>
  53 +
  54 + </tr>
  55 + <tr class="sevenempty"></tr>
  56 + <tr>
  57 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F1</span></a></td>
  58 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F2</span></a></td>
  59 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F3</span></a></td>
  60 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F4</span></a></td>
  61 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F5</span></a></td>
  62 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F6</span></a></td>
  63 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F7</span></a></td>
  64 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F8</span></a></td>
  65 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F9</span></a></td>
  66 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F10</span></a>
  67 + </td>
  68 + </tr>
  69 + <tr class="sevenempty"></tr>
  70 + <tr>
  71 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E1</span></a></td>
  72 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E2</span></a></td>
  73 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E3</span></a></td>
  74 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E4</span></a></td>
  75 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E5</span></a></td>
  76 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E6</span></a></td>
  77 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E7</span></a></td>
  78 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E8</span></a></td>
  79 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E9</span></a></td>
  80 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E10</span></a>
  81 + </td>
  82 + </tr>
  83 + <tr class="sevenempty"></tr>
  84 + <tr>
  85 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D1</span></a></td>
  86 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D2</span></a></td>
  87 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D3</span></a></td>
  88 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D4</span></a></td>
  89 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D5</span></a></td>
  90 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D6</span></a></td>
  91 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D7</span></a></td>
  92 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D8</span></a></td>
  93 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D9</span></a></td>
  94 + </tr>
  95 + <tr class="sevenempty"></tr>
  96 + <tr>
  97 + <td><img ></td>
  98 + <td><img ></td>
  99 + <td><img ></td>
  100 + <td><img ></td>
  101 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C5</span></a></td>
  102 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C6</span></a></td>
  103 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C7</span></a></td>
  104 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C8</span></a></td>
  105 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C9</span></a></td>
  106 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C10</span></a></td>
  107 + </tr>
  108 + <tr class="sevenempty"></tr>
  109 + <tr>
  110 + <td><img/></td>
  111 + <td><img/></td>
  112 + <td><img/></td>
  113 + <td><img/></td>
  114 + <td><img/></td>
  115 + <td><img/></td>
  116 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B7</span></a></td>
  117 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B8</span></a></td>
  118 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B9</span></a></td>
  119 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B10</span></a></td>
  120 + </tr>
  121 + </table>
  122 + </div>
  123 + <div class="xiaoshanseven-middlecabinet"><span>过道</span></div>
  124 + <div class="xiaoshanseven-rightcabinet">
  125 + <table>
  126 + <tr>
  127 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I14</span></a></td>
  128 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I15</span></a></td>
  129 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I16</span></a></td>
  130 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I17</span></a></td>
  131 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I18</span></a></td>
  132 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">I19</span></a></td>
  133 + </tr>
  134 + <tr class="sevenempty"></tr>
  135 + <tr>
  136 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H14</span></a></td>
  137 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H15</span></a></td>
  138 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H16</span></a></td>
  139 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H17</span></a></td>
  140 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H18</span></a></td>
  141 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H19</span></a></td>
  142 + <td><img ></td>
  143 + <td><img ></td>
  144 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H22</span></a></td>
  145 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H23</span></a></td>
  146 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">H24</span></a></td>
  147 + </td>
  148 +
  149 + </tr>
  150 +
  151 + <tr class="sevenempty"></tr>
  152 + <tr>
  153 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G14</span></a></td>
  154 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G15</span></a></td>
  155 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G16</span></a></td>
  156 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G17</span></a></td>
  157 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G18</span></a></td>
  158 + <td><img ></td>
  159 + <td><img ></td>
  160 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G21</span></a></td>
  161 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G21</span></a></td>
  162 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G13</span></a></td>
  163 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G24</span></a></td>
  164 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">G25</span></a></td>
  165 + </tr>
  166 + <tr class="sevenempty"></tr>
  167 + <tr>
  168 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F14</span></a></td>
  169 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">F15</span></a></td>
  170 +
  171 + </tr>
  172 + <tr class="sevenempty"></tr>
  173 + <tr>
  174 +
  175 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E14</span></a></td>
  176 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E15</span></a></td>
  177 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E16</span></a></td>
  178 + <td><img></td>
  179 + <td><img ></td>
  180 + <td><img></td>
  181 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E20</span></a></td>
  182 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E21</span></a></td>
  183 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E22</span></a></td>
  184 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E23</span></a></td>
  185 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E24</span></a></td>
  186 +
  187 + </tr>
  188 + <tr class="sevenempty"></tr>
  189 + <tr>
  190 +
  191 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D14</span></a></td>
  192 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D15</span></a></td>
  193 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D16</span></a></td>
  194 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D17</span></a></td>
  195 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D18</span></a></td>
  196 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D19</span></a></td>
  197 + <td><img ></td>
  198 + <td><img></td>
  199 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D22</span></a></td>
  200 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D23</span></a></td>
  201 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D24</span></a></td>
  202 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D25</span></a></td>
  203 + </tr>
  204 + <tr class="sevenempty"></tr>
  205 + <tr>
  206 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C14</span></a></td>
  207 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C15</span></a></td>
  208 + </tr>
  209 + <tr class="sevenempty"></tr>
  210 + <tr>
  211 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B14</span></a></td>
  212 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B15</span></a></td>
  213 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B16</span></a></td>
  214 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B17</span></a></td>
  215 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B18</span></a></td>
  216 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B19</span></a></td>
  217 +
  218 + </tr>
  219 + </table>
  220 + </div>
  221 + </div>
  222 +</div>
  223 +</body>
  224 +</html>
  1 +<!DOCTYPE html>
  2 +<html>
  3 +<head>
  4 + <title></title>
  5 + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6 + <meta http-equiv="Pragma" content="no-cache" />
  7 + <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  8 + <meta http-equiv="Expires" content="0" />
  9 + <link type='text/css' href='css/machineroom.css' rel="stylesheet"/>
  10 +</head>
  11 +<body>
  12 +<div class="outlinediv">
  13 + <span>3号机房平面图</span>
  14 + <div class="xiaoshanthird-topcabinet">
  15 + <table>
  16 + <tr>
  17 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E1</span></a></td>
  18 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E2</span></a></td>
  19 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E3</span></a></td>
  20 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E4</span></a></td>
  21 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E5</span></a></td>
  22 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E6</span></a></td>
  23 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E7</span></a></td>
  24 + <td><img/></td>
  25 + <td><img/></td>
  26 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E10</span></a></td>
  27 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E11</span></a></td>
  28 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E12</span></a></td>
  29 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">E13</span></a></td>
  30 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E14</span></a></td>
  31 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">E15</span></a></td>
  32 + </tr>
  33 + <tr></tr>
  34 + <tr>
  35 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D1</span></a></td>
  36 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D2</span></a></td>
  37 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D3</span></a></td>
  38 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D4</span></a></td>
  39 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D5</span></a></td>
  40 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D6</span></a></td>
  41 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D7</span></a></td>
  42 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D8</span></a></td>
  43 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D9</span></a></td>
  44 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D10</span></a></td>
  45 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">D11</span></a></td>
  46 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D12</span></a></td>
  47 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D13</span></a></td>
  48 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D14</span></a></td>
  49 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">D15</span></a></td>
  50 + </tr>
  51 +
  52 + <tr></tr>
  53 + <tr>
  54 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C1</span></a></td>
  55 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C2</span></a></td>
  56 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C3</span></a></td>
  57 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C4</span></a></td>
  58 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C5</span></a></td>
  59 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C6</span></a></td>
  60 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C7</span></a></td>
  61 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C8</span></a></td>
  62 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C9</span></a></td>
  63 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C10</span></a></td>
  64 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">C11</span></a></td>
  65 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C12</span></a></td>
  66 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C13</span></a></td>
  67 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C14</span></a></td>
  68 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">C15</span></a></td>
  69 + </tr>
  70 + <tr></tr>
  71 + <tr>
  72 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B1</span></a></td>
  73 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B2</span></a></td>
  74 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B3</span></a></td>
  75 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B4</span></a></td>
  76 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B5</span></a></td>
  77 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B6</span></a></td>
  78 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B7</span></a></td>
  79 + <td><img/></td>
  80 + <td><img/></td>
  81 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B10</span></a></td>
  82 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B11</span></a></td>
  83 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B12</span></a></td>
  84 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B13</span></a></td>
  85 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B14</span></a></td>
  86 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B15</span></a></td>
  87 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">B16</span></a></td>
  88 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">B17</span></a></td>
  89 +
  90 + </tr>
  91 + <tr></tr>
  92 + <tr>
  93 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A1</span></a></td>
  94 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A2</span></a></td>
  95 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A3</span></a></td>
  96 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A4</span></a></td>
  97 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A5</span></a></td>
  98 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A6</span></a></td>
  99 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A7</span></a></td>
  100 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A8</span></a></td>
  101 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A9</span></a></td>
  102 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A10</span></a></td>
  103 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A11</span></a></td>
  104 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A12</span></a></td>
  105 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A13</span></a></td>
  106 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A14</span></a></td>
  107 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A15</span></a></td>
  108 + <td><a href=""><img src="img/cabinet.png" class="cabinet"><span class="cabinetId">A16</span></a></td>
  109 + <td><a href=""><img src="img/cabinet.png"class="cabinet"><span class="cabinetId">A17</span></a></td>
  110 + </tr>
  111 + </table>
  112 + </div>
  113 +</div>
  114 +</body>
  115 +</html>
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +
  4 +<head>
  5 + <meta charset="UTF-8">
  6 + <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8 + <title>Document</title>
  9 + <link href="css/Details.css" rel="stylesheet" type="text/css" />
  10 +</head>
  11 +
  12 +<body>
  13 + <div class='all'>
  14 + <!-- 左侧机柜效果图 -->
  15 + <div class='contain'>
  16 +
  17 + <!-- 机柜内部服务器 -->
  18 + <div class='contain-server'>
  19 +
  20 +
  21 + <!-- 第一个物理服务器 -->
  22 + <div class='serve'>
  23 + <div class='img-serve'>
  24 +
  25 + <img src="img/icon-state.png" alt="" class='state'>
  26 + <div class='img-serve-text'>物理服务器</div>
  27 + <div class='lamp'>
  28 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  29 + <div class='img-lamp'>
  30 + <img src="img/nocolor.png" alt="">
  31 + <img src="img/nocolor.png" alt="">
  32 + <img src="img/nocolor.png" alt="">
  33 + <img src="img/greenColor.png" alt="">
  34 + </div>
  35 + </div>
  36 +
  37 + </div>
  38 + </div>
  39 +
  40 + <!-- 第二个物理服务器 -->
  41 + <div class='serve'>
  42 + <div class='img-serve'>
  43 +
  44 + <img src="img/icon-state.png" alt="" class='state'>
  45 + <div class='img-serve-text'>物理服务器</div>
  46 + <div class='lamp'>
  47 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  48 + <div class='img-lamp'>
  49 + <img src="img/nocolor.png" alt="">
  50 + <img src="img/nocolor.png" alt="">
  51 + <img src="img/nocolor.png" alt="">
  52 + <img src="img/greenColor.png" alt="">
  53 + </div>
  54 + </div>
  55 + </div>
  56 + </div>
  57 +
  58 + <!-- 第三个物理服务器 -->
  59 + <div class='serve'>
  60 + <div class='img-serve'>
  61 + <img src="img/icon-state.png" alt="" class='state'>
  62 + <div class='img-serve-text'>物理服务器</div>
  63 + <div class='lamp'>
  64 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  65 + <div class='img-lamp'>
  66 + <img src="img/nocolor.png" alt="">
  67 + <img src="img/nocolor.png" alt="">
  68 + <img src="img/nocolor.png" alt="">
  69 + <img src="img/greenColor.png" alt="">
  70 + </div>
  71 + </div>
  72 + </div>
  73 + </div>
  74 +
  75 +
  76 + </div>
  77 +
  78 +
  79 + </div>
  80 +
  81 +
  82 +
  83 + <!-- 右侧机柜详细信息 -->
  84 + <div class='info'>
  85 +
  86 +<!-- 机柜信息 -->
  87 + <div class='info-top'>
  88 + <div class='info-contain'>
  89 + <div class='info-text'>机柜信息</div>
  90 + <div class='info-text-bot'>
  91 + <p>机 房:萧山7号机</p>
  92 + <p>机柜编号:E07</p>
  93 + <p>机柜容量:42U</p>
  94 + <p>设备数量:3台</p>
  95 + <p>告警量:无告警</p>
  96 + </div>
  97 + </div>
  98 + </div>
  99 +
  100 +<!-- 设备信息 -->
  101 + <div class='info-bottom'>
  102 + <div class='info-contain'>
  103 + <div class='info-text'>设备信息</div>
  104 + <div class='info-text-bot'>
  105 + <p>品 牌:曙光</p>
  106 + <p>型 号:I840—G25</p>
  107 + <p>序 列 号:9800076500643112</p>
  108 + <p>管 理 IP:80.12.92.21</p>
  109 + <p>业 务 IP:80.12.92.31</p>
  110 + <p>用 途:发票系统使用</p>
  111 + </div>
  112 + </div>
  113 + </div>
  114 +
  115 +
  116 + </div>
  117 +
  118 +
  119 + </div>
  120 +
  121 +</body>
  122 +
  123 +</html>
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +
  4 +<head>
  5 + <meta charset="UTF-8">
  6 + <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8 + <title>Document</title>
  9 + <link href="css/FB-3.css" rel="stylesheet" type="text/css" />
  10 +</head>
  11 +
  12 +<body>
  13 + <div class='all'>
  14 + <!-- 左侧机柜效果图 -->
  15 + <div class='contain'>
  16 +
  17 + <!-- 机柜内部服务器 -->
  18 + <div class='contain-serve'>
  19 +
  20 + <div class='serve'>
  21 + <div class='img-serve'>
  22 +
  23 + <img src="img/icon-state.png" alt="" class='state'>
  24 + <div class='img-serve-text'>物理服务器</div>
  25 + <div class='lamp'>
  26 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  27 + <div class='img-lamp'>
  28 + <img src="img/nocolor.png" alt="">
  29 + <img src="img/nocolor.png" alt="">
  30 + <img src="img/nocolor.png" alt="">
  31 + <img src="img/greenColor.png" alt="">
  32 + </div>
  33 + </div>
  34 +
  35 + </div>
  36 + </div>
  37 +
  38 + <!-- 第二个物理服务器 -->
  39 + <div class='serve'>
  40 + <div class='img-serve'>
  41 +
  42 + <img src="img/icon-state.png" alt="" class='state'>
  43 + <div class='img-serve-text'>物理服务器</div>
  44 + <div class='lamp'>
  45 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  46 + <div class='img-lamp'>
  47 + <img src="img/nocolor.png" alt="">
  48 + <img src="img/nocolor.png" alt="">
  49 + <img src="img/nocolor.png" alt="">
  50 + <img src="img/greenColor.png" alt="">
  51 + </div>
  52 + </div>
  53 + </div>
  54 + </div>
  55 +
  56 + <!-- 第三个物理服务器 -->
  57 + <div class='serve'>
  58 + <div class='img-serve'>
  59 + <img src="img/icon-state.png" alt="" class='state'>
  60 + <div class='img-serve-text'>物理服务器</div>
  61 + <div class='lamp'>
  62 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  63 + <div class='img-lamp'>
  64 + <img src="img/nocolor.png" alt="">
  65 + <img src="img/nocolor.png" alt="">
  66 + <img src="img/nocolor.png" alt="">
  67 + <img src="img/greenColor.png" alt="">
  68 + </div>
  69 + </div>
  70 + </div>
  71 + </div>
  72 +
  73 +
  74 + </div>
  75 +
  76 +
  77 + </div>
  78 +
  79 +
  80 + </div>
  81 +
  82 +</body>
  83 +
  84 +</html>
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +
  4 +<head>
  5 + <meta charset="UTF-8">
  6 + <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8 + <title>Document</title>
  9 + <link href="css/FB-4.css" rel="stylesheet" type="text/css" />
  10 +</head>
  11 +
  12 +<body>
  13 + <div class='all'>
  14 + <!-- 左侧机柜效果图 -->
  15 + <div class='contain'>
  16 +
  17 + <!-- 机柜内部服务器 -->
  18 + <div class='contain-serve'>
  19 +
  20 + <div class='serve'>
  21 + <div class='img-serve'>
  22 +
  23 + <img src="img/icon-state.png" alt="" class='state'>
  24 + <div class='img-serve-text'>物理服务器</div>
  25 + <div class='lamp'>
  26 + <img src="img/icon-weblogical.png" alt="" class='img-weblog'>
  27 + <div class='img-lamp'>
  28 + <img src="img/nocolor.png" alt="">
  29 + <img src="img/nocolor.png" alt="">
  30 + <img src="img/nocolor.png" alt="">
  31 + <img src="img/greenColor.png" alt="">
  32 + </div>
  33 + </div>
  34 +
  35 + </div>
  36 + </div>
  37 +
  38 + </div>
  39 +
  40 +
  41 + </div>
  42 +
  43 +
  44 + </div>
  45 +
  46 +</body>
  47 +
  48 +</html>
  1 +
  2 +body{
  3 + background-image: url(../img/img-bg.png);
  4 + background-size: 100%;
  5 +
  6 +}
  7 +li{
  8 + list-style: none
  9 +}
  10 +
  11 +.all{
  12 + display:flex;
  13 +}
  14 +
  15 +
  16 +/* 左侧机柜样式 */
  17 +
  18 +.contain{
  19 +
  20 + width:400px;
  21 + height:710px;
  22 + margin-left:15%;
  23 + margin-top:5%;
  24 + /* background-color: red; */
  25 + background-image: url(../img/img-no-machine.png);
  26 + background-size: 100%;
  27 + background-repeat: no-repeat;
  28 + position: relative;
  29 +
  30 +}
  31 +
  32 +.contain-server{
  33 + position: absolute;
  34 + width:365px;
  35 + height:40%;
  36 + margin-left:18px;
  37 + bottom:7%;
  38 + display: flex;
  39 + justify-content: space-between;
  40 + flex-direction:column;
  41 + /* background-color: red; */
  42 +
  43 +}
  44 +
  45 +
  46 +.serve{
  47 + width:370px;
  48 + height:78px;
  49 + margin-left:-3px;
  50 + background-image: url(../img/img-4Uservice.png);
  51 + background-size: 100% 100%;
  52 + background-repeat: no-repeat;
  53 +
  54 +
  55 +}
  56 +.img-serve{
  57 +
  58 + width:340px;
  59 + height:50px;
  60 + margin:12px auto;
  61 + display: flex;
  62 +
  63 +}
  64 +
  65 +.lamp{
  66 + display:flex;
  67 +}
  68 +
  69 +
  70 +.img-lamp{
  71 + margin-left:15px;
  72 + margin-top:10px
  73 +}
  74 +
  75 +/* 服务器状态图片样式 */
  76 +.state{
  77 + width:35px;
  78 + height:35px;
  79 + margin-top:8px;
  80 + margin-left:4px;
  81 +}
  82 +
  83 +.img-serve-text{
  84 + color:#fff;
  85 + line-height: 50px;
  86 + margin-left:10px;
  87 +}
  88 +
  89 +
  90 +.img-weblog{
  91 + margin-left:50px;
  92 + margin-top:15px;
  93 + width:30px;
  94 + height:20px;
  95 +
  96 +}
  97 +
  98 +
  99 +
  100 +
  101 +/* 右侧机柜详细信息样式 */
  102 +
  103 +.info{
  104 + width:500px;
  105 + height:700px;
  106 + margin-left:8%;
  107 + margin-top:5%;
  108 + /* background-color: red; */
  109 +
  110 +}
  111 +
  112 +
  113 +.info-top{
  114 + height:340px;
  115 + margin-top:-10px;
  116 + background-image: url(../img/img-machineInfo-bg.png);
  117 +
  118 +}
  119 +
  120 +.info-bottom{
  121 + height:340px;
  122 + margin-top:10px;
  123 + background-image: url(../img/img-deviceInfo-bg.png);
  124 +}
  125 +
  126 +.info-contain{
  127 + width:90%;
  128 + display:inline-block;
  129 + height:250px;
  130 + margin-top:60px;
  131 + margin-left: 60px;
  132 +
  133 +}
  134 +
  135 +
  136 +.info-text{
  137 + height:50px;
  138 + font-weight: bolder;
  139 + font-size: 20px;
  140 + color:#fff
  141 + /* background-color: rgb(59, 185, 8); */
  142 +}
  143 +
  144 +.info-text-bot{
  145 + margin-top:-15px;
  146 + height:200px;
  147 + font-size: 16px;
  148 + letter-spacing: 2px;
  149 + color:#fff
  150 + /* background-color: rgb(93, 15, 196); */
  151 +}
  1 +
  2 +body{
  3 + background-image: url(../img/img-bg.png);
  4 + background-size: 100%;
  5 +
  6 +}
  7 +
  8 +
  9 +.all{
  10 + display:flex;
  11 +}
  12 +
  13 +
  14 +/* 机柜样式 */
  15 +
  16 +.contain{
  17 +
  18 + width:400px;
  19 + height:710px;
  20 + margin-left:37%;
  21 + margin-top:5%;
  22 + /* background-color: red; */
  23 + background-image: url(../img/img-no-machine.png);
  24 + background-size: 100%;
  25 + background-repeat: no-repeat;
  26 + position: relative;
  27 +
  28 +}
  29 +
  30 +.contain-serve{
  31 + position: absolute;
  32 + margin-top:60%;
  33 + width:365px;
  34 + height:40%;
  35 + margin-left:18px;
  36 +
  37 + display: flex;
  38 + justify-content: space-between;
  39 + flex-direction:column;
  40 +
  41 +
  42 +}
  43 +
  44 +
  45 +.serve{
  46 + width:370px;
  47 + height:78px;
  48 + margin-left:-3px;
  49 + background-image: url(../img/img-4Uservice.png);
  50 + background-size: 100% 100%;
  51 + background-repeat: no-repeat;
  52 +
  53 +
  54 +}
  55 +.img-serve{
  56 +
  57 + width:340px;
  58 + height:50px;
  59 + margin:12px auto;
  60 + display: flex;
  61 +
  62 +}
  63 +
  64 +.lamp{
  65 + display:flex;
  66 +}
  67 +
  68 +
  69 +.img-lamp{
  70 + margin-left:15px;
  71 + margin-top:10px
  72 +}
  73 +
  74 +
  75 +.state{
  76 + width:35px;
  77 + height:35px;
  78 + margin-top:8px;
  79 + margin-left:4px;
  80 +}
  81 +
  82 +.img-serve-text{
  83 + color:#fff;
  84 + line-height: 50px;
  85 + margin-left:10px;
  86 +}
  87 +
  88 +
  89 +.img-weblog{
  90 + margin-left:50px;
  91 + margin-top:15px;
  92 + width:30px;
  93 + height:20px;
  94 +
  95 +}
  96 +
  97 +
  1 +
  2 +body{
  3 + background-image: url(../img/img-bg.png);
  4 + background-size: 100%;
  5 +
  6 +}
  7 +
  8 +
  9 +.all{
  10 + display:flex;
  11 +}
  12 +
  13 +
  14 +/* 机柜样式 */
  15 +
  16 +.contain{
  17 +
  18 + width:400px;
  19 + height:710px;
  20 + margin-left:37%;
  21 + margin-top:5%;
  22 + /* background-color: red; */
  23 + background-image: url(../img/img-no-machine.png);
  24 + background-size: 100%;
  25 + background-repeat: no-repeat;
  26 + position: relative;
  27 +
  28 +}
  29 +
  30 +.contain-serve{
  31 + position: absolute;
  32 + margin-top:50%;
  33 + width:365px;
  34 + height:40%;
  35 + margin-left:18px;
  36 +
  37 + display: flex;
  38 + justify-content: space-between;
  39 + flex-direction:column;
  40 +
  41 +
  42 +}
  43 +
  44 +
  45 +.serve{
  46 + width:370px;
  47 + height:78px;
  48 + margin-left:-3px;
  49 + background-image: url(../img/img-4Uservice.png);
  50 + background-size: 100% 100%;
  51 + background-repeat: no-repeat;
  52 +
  53 +
  54 +}
  55 +.img-serve{
  56 +
  57 + width:340px;
  58 + height:50px;
  59 + margin:12px auto;
  60 + display: flex;
  61 +
  62 +}
  63 +
  64 +.lamp{
  65 + display:flex;
  66 +}
  67 +
  68 +
  69 +.img-lamp{
  70 + margin-left:15px;
  71 + margin-top:10px
  72 +}
  73 +
  74 +/* 服务器状态图样式 */
  75 +.state{
  76 + width:35px;
  77 + height:35px;
  78 + margin-top:8px;
  79 + margin-left:4px;
  80 +}
  81 +
  82 +.img-serve-text{
  83 + color:#fff;
  84 + line-height: 50px;
  85 + margin-left:10px;
  86 +}
  87 +
  88 +
  89 +.img-weblog{
  90 + margin-left:50px;
  91 + margin-top:15px;
  92 + width:30px;
  93 + height:20px;
  94 +
  95 +}
  96 +
  97 +
@@ -72,7 +72,27 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se @@ -72,7 +72,27 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
72 form.val('form-bustype-edit', busType); 72 form.val('form-bustype-edit', busType);
73 $('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true); 73 $('form[lay-filter="form-bustype-edit"] input[name="busTypeCode"]').attr('readonly', true);
74 userSelect.setValue([busType.admin]); 74 userSelect.setValue([busType.admin]);
75 - opsSelect.setValue(busType.principal.split(",")); 75 + let principal = busType.principal;
  76 + let principalLi = principal ? principal.split(",") : [];
  77 + opsSelect.setValue(principalLi);
  78 +
  79 + //是否启用 1启用 0不启用
  80 + let isUse = busType.isUse || busType.isUse == 0 ? busType.isUse : 1;
  81 + if (isUse != 1) {//不启用
  82 + layui.jquery('input[name="isUse"]').removeAttr('checked'); //改变开关为 关
  83 + }
  84 + //是否是乙方运维 1是,0不是
  85 + let system_type = busType.isOps || busType.isOps == 0 ? busType.isOps : 1;
  86 + if (system_type != 1) {//不是乙方运维 隐藏项目 是否虚拟可以点击
  87 + layui.jquery('input[name="system_type"]').removeAttr('checked'); //改变开关为 关
  88 + $('#select_principalName').addClass("hide");
  89 + layui.jquery('input[name="isvirtual"]').removeAttr('disabled');//可以点击
  90 + }
  91 + //是否是虚拟 0是,1不是
  92 + let isvirtual = busType.isvirtual || busType.isvirtual == 0 ? busType.isvirtual : 0;
  93 + if (isvirtual != 0) {//不是虚拟
  94 + layui.jquery('input[name="isvirtual"]').removeAttr('checked'); //改变开关为 关
  95 + }
76 form.render(); 96 form.render();
77 }); 97 });
78 } 98 }
@@ -88,33 +108,42 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se @@ -88,33 +108,42 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
88 form.on('switch(system_type)', function (obj) { 108 form.on('switch(system_type)', function (obj) {
89 //sign=fale 不是乙方运维项目 sign=true 是乙方运维项目 109 //sign=fale 不是乙方运维项目 sign=true 是乙方运维项目
90 var sign = obj.elem.checked; 110 var sign = obj.elem.checked;
91 - if(!sign){//不是乙方运维 111 + if (!sign) {//不是乙方运维 下拉框隐藏 是否是虚拟项目可以点击
92 $('#select_principalName').addClass("hide"); 112 $('#select_principalName').addClass("hide");
93 opsSelect.setValue([]); 113 opsSelect.setValue([]);
94 - layui.jquery('input[name="isvirtual"]').removeAttr('checked'); //改变开关为 关 114 + layui.jquery('input[name="isvirtual"]').removeAttr('disabled');//可以点击
  115 +
95 //重新渲染 116 //重新渲染
96 form.render(); 117 form.render();
97 - }else{//是乙方运维 118 + } else {//是乙方运维 下拉框展示 只能是虚拟项目 不能更改是否是虚拟项目
98 $('#select_principalName').removeClass('hide'); 119 $('#select_principalName').removeClass('hide');
  120 + //删除原来的组件 新加dom
  121 + $('#isvirtual_ops_switch').empty();//删除子元素
  122 + let html = '<input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked disabled/>';
  123 + $('#isvirtual_ops_switch').append(html);//追加子元素
  124 + //layui.jquery('input[name="isvirtual"]').attr("checked", true);//改变状态为开
  125 + //layui.jquery('input[name="isvirtual"]').attr("disabled", true)//不能点击
  126 +
99 //渲染下拉框 127 //渲染下拉框
100 initUserSelectOps(); 128 initUserSelectOps();
  129 + //重新渲染
  130 + form.render();
101 } 131 }
102 }); 132 });
103 133
104 -  
105 // 绑定表单提交事件 134 // 绑定表单提交事件
106 form.on('submit(bus-type-submit)', function (data) { 135 form.on('submit(bus-type-submit)', function (data) {
107 loading = layer.load(2); 136 loading = layer.load(2);
108 busType = Object.assign(busType, data.field); 137 busType = Object.assign(busType, data.field);
109 - //是否启用 138 + //是否启用 1启用 0不启用
110 if (!data.field.isUse) { 139 if (!data.field.isUse) {
111 busType.isUse = '0' 140 busType.isUse = '0'
112 } 141 }
113 - //是否是乙方运维 142 + //是否是乙方运维 1是,0不是
114 if (!data.field.system_type) { 143 if (!data.field.system_type) {
115 busType.system_type = '0' 144 busType.system_type = '0'
116 } 145 }
117 - //是否是虚拟业务 146 + //是否是虚拟业务 0是,1不是
118 if (!data.field.isvirtual) { 147 if (!data.field.isvirtual) {
119 busType.isvirtual = '1' 148 busType.isvirtual = '1'
120 } 149 }
@@ -123,7 +152,6 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se @@ -123,7 +152,6 @@ layui.define(['table', 'form', 'admin', 'layer', 'laytpl', 'common', 'view', 'se
123 busType.parentId = '0'; 152 busType.parentId = '0';
124 } 153 }
125 //获取业务负责人信息 154 //获取业务负责人信息
126 - userSelect.getValue("")  
127 busType.nickname = userSelect.getValue("name")[0]; 155 busType.nickname = userSelect.getValue("name")[0];
128 busType.admin = userSelect.getValue("value")[0]; 156 busType.admin = userSelect.getValue("value")[0];
129 //获取业务运维负责人 157 //获取业务运维负责人
@@ -673,6 +673,16 @@ layui.define(['view'], function(exports){ @@ -673,6 +673,16 @@ layui.define(['view'], function(exports){
673 , toDZSWJScreen: function () { 673 , toDZSWJScreen: function () {
674 window.open(window.location.origin + '/vue3/index.html#/zj/dp?access_token=' + localStorage.getItem("access_token")); 674 window.open(window.location.origin + '/vue3/index.html#/zj/dp?access_token=' + localStorage.getItem("access_token"));
675 } 675 }
  676 + // xwx add 首页增加CMDB入口 2021-11-21
  677 + , toCMDB: function () {
  678 + var roles=sessionStorage.getItem('roles');
  679 + if (roles.indexOf('zichanyw') != -1 || roles.indexOf('zichanAdmin') != -1){
  680 + window.open(sessionStorage.getItem("cmdbWeb"));
  681 + }else{
  682 + layer.msg('当前用户没有权限', {icon: 0, time: 3000});
  683 + }
  684 +
  685 + }
676 686
677 //向右滚动页面标签 687 //向右滚动页面标签
678 , leftPage: function () { 688 , leftPage: function () {
  1 +<title>对比分析预览</title>
  2 +<script type="text/html" template>
  3 + {{#
  4 + var viewURL = window.location.origin + '/vue3/index.html#/analysis/view';
  5 + layui.use(['sessions','common','admin'], function () {
  6 + var $ = layui.$;
  7 + var common = layui.common;
  8 + var admin = layui.admin;
  9 + var arr = [];
  10 + window.location.hash.split('/').forEach(function (v, i) {
  11 + if (v.indexOf('=') != -1) {
  12 + arr.push(v);
  13 + }
  14 + });
  15 +
  16 + if (arr.length > 0) {
  17 + viewURL += "?" + arr.join("&");
  18 + }
  19 + $('#actionListIframe').attr('src',viewURL);
  20 + });
  21 + }}
  22 + <iframe id="actionListIframe" src="{{viewURL}}" frameborder="0" class="layadmin-iframe" style="height: 99.5%!important;"></iframe>
  23 +</script>
@@ -42,7 +42,7 @@ @@ -42,7 +42,7 @@
42 <div class="layui-form-item"> 42 <div class="layui-form-item">
43 <label class="layui-form-label">是否使用<span style="color: red">*</span></label> 43 <label class="layui-form-label">是否使用<span style="color: red">*</span></label>
44 <div class="layui-input-block"> 44 <div class="layui-input-block">
45 - <input type="checkbox" lay-skin="switch" name="isUse" value="1" lay-text="是|否" checked/> 45 + <input type="checkbox" lay-skin="switch" name="isUse" lay-filter="system_isUse" value="1" lay-text="是|否" checked/>
46 </div> 46 </div>
47 </div> 47 </div>
48 <div class="layui-form-item"> 48 <div class="layui-form-item">
@@ -82,8 +82,8 @@ @@ -82,8 +82,8 @@
82 </div> 82 </div>
83 <div class="layui-form-item"> 83 <div class="layui-form-item">
84 <label class="layui-form-label">虚拟业务<span style="color: red">*</span></label> 84 <label class="layui-form-label">虚拟业务<span style="color: red">*</span></label>
85 - <div class="layui-input-block">  
86 - <input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked/> 85 + <div class="layui-input-block" id="isvirtual_ops_switch">
  86 + <input type="checkbox" lay-skin="switch" name="isvirtual" lay-filter="switch_isVirtual" value="0" lay-text="是|否" checked disabled/>
87 </div> 87 </div>
88 </div> 88 </div>
89 <button id="btn-bustype-submit" class="hide" lay-submit lay-filter="bus-type-submit">提交</button> 89 <button id="btn-bustype-submit" class="hide" lay-submit lay-filter="bus-type-submit">提交</button>
@@ -74,6 +74,7 @@ @@ -74,6 +74,7 @@
74 <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> 74 <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>
75 <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> 75 <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>
76 <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> 76 <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>
  77 + <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>
77 </dl> 78 </dl>
78 </script> 79 </script>
79 </li> 80 </li>
@@ -115,8 +115,8 @@ @@ -115,8 +115,8 @@
115 width:100%; 115 width:100%;
116 } 116 }
117 .middle-left-declare-rate{ 117 .middle-left-declare-rate{
118 - height: 36%;  
119 - width:96%; 118 + height: 100%;
  119 + width:100%;
120 120
121 } 121 }
122 .screen-middle #middle-bottom { 122 .screen-middle #middle-bottom {
1 -<div class="analysis-index-container">  
2 - <div class="iconAdd">  
3 - 点击添加比对分析  
4 - </div>  
5 -</div>  
1 -export default {  
2 - name: 'addIndex',  
3 - template: '',  
4 - components:{},  
5 - data () {  
6 - return {  
7 -  
8 - }  
9 - },  
10 - setup(){  
11 -  
12 - }  
13 -}  
  1 +<div :style="{'height':'380px','padding':'6px'}">
  2 + <slot name="title">
  3 + <div style="text-align: left;margin-bottom: 10px;padding-left: 10px;">对比分析场景</div>
  4 + </slot>
  5 +
  6 + <el-row :gutter="5">
  7 + <el-col :span="4">
  8 + <div style="display: flex;flex-wrap: wrap;width: 100%">
  9 + <slot name="lineName">
  10 + 分析名称
  11 + </slot>
  12 + </div>
  13 + </el-col>
  14 + <el-col :span="20" style="text-align: right;padding-right: 10px">
  15 + <slot name="timeRange"></slot>
  16 + <slot name="frequency"></slot>
  17 + <slot name="tools"></slot>
  18 + </el-col>
  19 + </el-row>
  20 +
  21 + <div :style="{'height':'300px','width':width + 'px'}" :id="id"></div>
  22 +</div>
  1 +
  2 +
  3 +export default {
  4 + name: 'analysisLineChars',
  5 + template: '',
  6 + components: {},
  7 + data() {
  8 + },
  9 + props: {
  10 + showTitle: {
  11 + type: Boolean,
  12 + default: false
  13 + },
  14 + title: {
  15 + type: String,
  16 + default: '示例折线图'
  17 + },
  18 + legend: {
  19 + type: Object,
  20 + default: {
  21 + data: ['示例1']
  22 + }
  23 + },
  24 + xAxis: {
  25 + type: Array,
  26 + default: ['示例1', '示例2', '示例3', '示例4', '示例5', '示例6']
  27 + },
  28 + series: {
  29 + default: [{
  30 + name: '示例1',
  31 + type: 'bar',
  32 + data: [5, 20, 36, 10, 10, 20]
  33 + }]
  34 + }
  35 + },
  36 + setup(props, {attrs, slots, emit}) {
  37 + const {proxy} = Vue.getCurrentInstance();
  38 + let height = Vue.ref(window.innerHeight - 10);
  39 + let width = Vue.ref(window.innerWidth - 50);
  40 +
  41 + let id = Vue.ref('analysisLineChars'+(new Date()).getTime());
  42 + // echarts实例的dom
  43 + var myChart = null;
  44 +
  45 + let init = () => {
  46 + if(myChart == null){
  47 + myChart = echarts.init(document.getElementById(id.value));
  48 + }
  49 +
  50 + // 指定图表的配置项和数据
  51 + var option = {
  52 + title: {
  53 + text: props.title
  54 + },
  55 + grid: {
  56 + left: '1%',
  57 + right: '1%',
  58 + bottom: '1%',
  59 + containLabel: true,
  60 + },
  61 + tooltip: {},
  62 + legend: props.legend,
  63 + xAxis: {
  64 + data: props.xAxis
  65 + },
  66 + yAxis: {},
  67 + series: props.series
  68 + };
  69 +
  70 + if (!props.showTitle) {
  71 + delete option.title;
  72 + }
  73 +
  74 + // 使用刚指定的配置项和数据显示图表。
  75 + myChart.setOption(option);
  76 + }
  77 +
  78 +
  79 + // 挂载完
  80 + Vue.onMounted(() => {
  81 + init();
  82 +
  83 + console.log('onMounted');
  84 + })
  85 +
  86 + // 监听编辑状态
  87 + Vue.watch(
  88 + () => props.xAxis, (newValue, oldVlaue) => {
  89 + console.log("id=",id.value);
  90 + init();
  91 + }
  92 + );
  93 +
  94 + return {
  95 + height,
  96 + width,
  97 + id
  98 + }
  99 + }
  100 +}
@@ -8,19 +8,23 @@ const assets = (props, {attrs, slots, emit}) => { @@ -8,19 +8,23 @@ const assets = (props, {attrs, slots, emit}) => {
8 }); 8 });
9 9
10 // 类型 bastion 堡垒机,dam 防水坝,virtual 虚拟桌面 10 // 类型 bastion 堡垒机,dam 防水坝,virtual 虚拟桌面
11 - let icon = {  
12 - bastion: {  
13 - name: '堡垒机',  
14 - icon: 'icon-baoleiji'  
15 - },  
16 - dam: {  
17 - name: '防水坝',  
18 - icon: 'icon-shuiba2'  
19 - },  
20 - virtual: {  
21 - name: '虚拟桌面',  
22 - icon: 'icon-xunizhuomian'  
23 - }, 11 + let icon = Vue.ref({});
  12 +
  13 + //查询资产类型列表
  14 + let getAssetType = () => {
  15 + proxy.$http.post(`/api-web/manage/ddic/findSucDdics/OPS_SECOND_PROPERTY`, {}, function (res) {
  16 + if (res && res.data.length > 0) {
  17 + icon.value = {};
  18 + res.data.forEach(function(item, index, arr){
  19 + let code = item.ddicCode;
  20 + let obj = {};
  21 + code = code.substring(code.lastIndexOf("_") + 1, code.length).toLowerCase();
  22 + obj.name=item.ddicName;
  23 + obj.icon=item.ddicDesc;
  24 + icon.value[code] =obj;
  25 + });
  26 + }
  27 + });
24 } 28 }
25 29
26 // 查询列表 30 // 查询列表
@@ -166,7 +170,6 @@ const assets = (props, {attrs, slots, emit}) => { @@ -166,7 +170,6 @@ const assets = (props, {attrs, slots, emit}) => {
166 } 170 }
167 171
168 return { 172 return {
169 - icon,  
170 getAssets, 173 getAssets,
171 assetsMaps, 174 assetsMaps,
172 addAssets, 175 addAssets,
@@ -177,7 +180,9 @@ const assets = (props, {attrs, slots, emit}) => { @@ -177,7 +180,9 @@ const assets = (props, {attrs, slots, emit}) => {
177 okFunc, 180 okFunc,
178 btnClick, 181 btnClick,
179 btnType, 182 btnType,
180 - assetsAdd 183 + assetsAdd,
  184 + getAssetType,
  185 + icon
181 } 186 }
182 } 187 }
183 188
@@ -288,7 +293,6 @@ export default { @@ -288,7 +293,6 @@ export default {
288 } 293 }
289 294
290 const { 295 const {
291 - icon,  
292 getAssets, 296 getAssets,
293 assetsMaps, 297 assetsMaps,
294 addAssets, 298 addAssets,
@@ -299,17 +303,21 @@ export default { @@ -299,17 +303,21 @@ export default {
299 okFunc, 303 okFunc,
300 btnClick, 304 btnClick,
301 btnType, 305 btnType,
302 - assetsAdd 306 + assetsAdd,
  307 + getAssetType,
  308 + icon
303 } = assets(props, {attrs, slots, emit}); 309 } = assets(props, {attrs, slots, emit});
304 310
305 // // 挂载完 311 // // 挂载完
306 Vue.onMounted(() => { 312 Vue.onMounted(() => {
  313 + getAssetType();
307 getPage(); 314 getPage();
308 getAssets(); 315 getAssets();
309 }) 316 })
310 317
311 // 监听编辑状态 318 // 监听编辑状态
312 Vue.watch(() => props.projectId, (newValue, oldVlaue) => { 319 Vue.watch(() => props.projectId, (newValue, oldVlaue) => {
  320 + getAssetType();
313 getPage(); 321 getPage();
314 getAssets(); 322 getAssets();
315 }); 323 });
@@ -320,8 +328,6 @@ export default { @@ -320,8 +328,6 @@ export default {
320 getFile, 328 getFile,
321 beforeAvatarUpload, 329 beforeAvatarUpload,
322 isAdmin, 330 isAdmin,
323 - // 资产属性  
324 - icon,  
325 getAssets, 331 getAssets,
326 assetsMaps, 332 assetsMaps,
327 addAssets, 333 addAssets,
@@ -332,7 +338,10 @@ export default { @@ -332,7 +338,10 @@ export default {
332 okFunc, 338 okFunc,
333 btnClick, 339 btnClick,
334 btnType, 340 btnType,
335 - assetsAdd 341 + assetsAdd,
  342 + getAssetType,
  343 + // 资产属性
  344 + icon,
336 } 345 }
337 } 346 }
338 } 347 }
@@ -48,7 +48,7 @@ @@ -48,7 +48,7 @@
48 48
49 <cm-table-page :columns="columns" :dataList="dataList" @loaddata="getPage" :showIndex="true" 49 <cm-table-page :columns="columns" :dataList="dataList" @loaddata="getPage" :showIndex="true"
50 :showBorder="true" :currentPage="currentPage" :loading="false" 50 :showBorder="true" :currentPage="currentPage" :loading="false"
51 - :showPage="false" :height="(height - 20)"> 51 + :showPage="false" :showTools="true" :height="(height - 20)">
52 <template #default="{row,prop,column}"> 52 <template #default="{row,prop,column}">
53 <span v-if="prop == 'resListId'">{{currentNode.label}}</span> 53 <span v-if="prop == 'resListId'">{{currentNode.label}}</span>
54 <div v-else> 54 <div v-else>
@@ -128,7 +128,7 @@ @@ -128,7 +128,7 @@
128 128
129 </div> 129 </div>
130 </template> 130 </template>
131 - <template #tools> 131 + <!-- <template #tools>
132 <el-table-column fixed="right" label="操作" width="80" align="center"> 132 <el-table-column fixed="right" label="操作" width="80" align="center">
133 <template #default="scope"> 133 <template #default="scope">
134 <el-button type="text" size="small" @click.prevent="deleteRow(row,scope.$index)"> 134 <el-button type="text" size="small" @click.prevent="deleteRow(row,scope.$index)">
@@ -136,6 +136,11 @@ @@ -136,6 +136,11 @@
136 </el-button> 136 </el-button>
137 </template> 137 </template>
138 </el-table-column> 138 </el-table-column>
  139 + </template>-->
  140 + <template #tools="{scope}">
  141 + <el-button type="text" size="small" @click.prevent="deleteRow(scope.row,scope.$index)">
  142 + <i class="el-icon-delete"/>
  143 + </el-button>
139 </template> 144 </template>
140 </cm-table-page> 145 </cm-table-page>
141 </div> 146 </div>
@@ -108,18 +108,17 @@ const routes = [{ @@ -108,18 +108,17 @@ const routes = [{
108 { 108 {
109 path: '/analysis', 109 path: '/analysis',
110 name: 'analysis', 110 name: 'analysis',
111 - // component: () => myImport('views/analysis/components/addIndex/index')  
112 component: () => myImport('views/analysis/index') 111 component: () => myImport('views/analysis/index')
113 }, 112 },
114 { 113 {
115 path: '/analysis/add', 114 path: '/analysis/add',
116 name: 'analysisAdd', 115 name: 'analysisAdd',
117 - component: () => myImport('components/page/analysis/add/index') 116 + component: () => myImport('views/analysis/config/index')
118 }, 117 },
119 { 118 {
120 - path: '/faultDiagnosis',  
121 - name: 'faultDiagnosisIndex',  
122 - component: () => myImport('views/faultDiagnosis/index') 119 + path: '/analysis/view',
  120 + name: 'view',
  121 + component: () => myImport('views/analysis/view/index')
123 } 122 }
124 ]; 123 ];
125 124
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 <div class="add-top"> 3 <div class="add-top">
4 <el-row> 4 <el-row>
5 <el-col :span="16" class="add-top-title"> 5 <el-col :span="16" class="add-top-title">
6 - <el-button type="primary">场景名称</el-button> 6 + <el-input v-model="input" placeholder="请输入场景名称" />
7 </el-col> 7 </el-col>
8 <el-col :span="8" class="add-top-select"> 8 <el-col :span="8" class="add-top-select">
9 <el-dropdown> 9 <el-dropdown>
@@ -59,7 +59,6 @@ export default { @@ -59,7 +59,6 @@ export default {
59 create: 'Create' 59 create: 'Create'
60 } 60 }
61 let columns = Vue.ref([ 61 let columns = Vue.ref([
62 -  
63 { 62 {
64 prop: 'busId', 63 prop: 'busId',
65 label: '业务系统', 64 label: '业务系统',
  1 +<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
  2 + <div class="cm-card" :style="{'min-height':height+'px','height':'100%'}">
  3 + <analysis-line :legend="lineChart.legend" :xAxis="lineChart.xAxis" :series="lineChart.series">
  4 + <template #lineName="scope">
  5 + <el-input v-model="form.scene.name" placeholder="请输入场景名称"/>
  6 + </template>
  7 + <template #tools="scope">
  8 + <el-button type="primary" style="margin-left: 10px" @click="showDialogForm(true)">保存</el-button>
  9 + </template>
  10 + <template #timeRange="scope">
  11 + <el-dropdown>
  12 + <el-button>
  13 + 时间范围 <i class="el-icon el-icon-arrow-down"></i>
  14 + </el-button>
  15 + <template #dropdown>
  16 + <el-dropdown-menu>
  17 + <el-dropdown-item @click="timeRangeChange(item)" v-for="item in timeRangeArr"
  18 + :key="item.ddicId"
  19 + :command="{value:item.ddicCode,label:item.ddicName,flag:1}">
  20 + <el-radio v-model="form.scene.timeScope" :label="item.ddicCode">{{item.ddicName}}
  21 + </el-radio>
  22 + </el-dropdown-item>
  23 + </el-dropdown-menu>
  24 + </template>
  25 + </el-dropdown>
  26 + </template>
  27 + <template #frequency="scope">
  28 + <el-dropdown style="margin-left: 10px">
  29 + <el-button>
  30 + 聚合频率 <i class="el-icon el-icon-arrow-down"></i>
  31 + </el-button>
  32 + <template #dropdown>
  33 + <el-dropdown-menu>
  34 + <el-dropdown-item v-for="item in frequencyArr"
  35 + :key="item.ddicId"
  36 + :command="{value:item.ddicCode,label:item.ddicName,flag:1}">
  37 + <el-radio v-model="form.scene.frequency" :label="item.ddicCode">{{item.ddicName}}
  38 + </el-radio>
  39 + </el-dropdown-item>
  40 + </el-dropdown-menu>
  41 + </template>
  42 + </el-dropdown>
  43 + </template>
  44 + </analysis-line>
  45 + <el-divider content-position="left">
  46 + <div>
  47 + <i class="iconfont icon-liebiaomoshi"></i>
  48 + <span style="margin-left: 5px">查询条件</span>
  49 + </div>
  50 + </el-divider>
  51 + <div style="width: calc(100% - 12px);padding: 0px 6px">
  52 + <el-row :gutter="5">
  53 + <el-col :span="4">
  54 + <div style="display: flex;flex-wrap: wrap;width: 100%;padding-left: 15px;">
  55 + <el-dropdown>
  56 + <el-icon class="el-icon--right">
  57 + <arrow-down/>
  58 + </el-icon>
  59 + <cm-biz-type-tree-input multiple clearable collapseTags @callback="getBizType"/>
  60 + </el-dropdown>
  61 +
  62 + <el-dropdown>
  63 + <el-icon class="el-icon--right">
  64 + <arrow-down/>
  65 + </el-icon>
  66 + <cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/>
  67 + </el-dropdown>
  68 +
  69 + <el-dropdown>
  70 + <el-icon class="el-icon--right">
  71 + <arrow-down/>
  72 + </el-icon>
  73 + <cm-kpi-type-tree-input multiple clearable collapseTags @callback="getKpiType"/>
  74 + </el-dropdown>
  75 +
  76 + <el-input v-model="keyWords" placeholder="输入关键字" style="margin-top: 15px;width: 225px;"/>
  77 +
  78 + <div style="margin-top: 10px;text-align: center">
  79 + <el-button type="primary" @click="onReset()">重置</el-button>
  80 + <el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>
  81 + </div>
  82 + </div>
  83 + </el-col>
  84 + <el-col :span="20">
  85 +
  86 + <el-tabs v-model="activeName" @tab-click="tabClick">
  87 + <el-tab-pane label="已添加" name="first">
  88 + <cm-table-page :columns="columns" :dataList="tabFirstList" @loaddata="loadFirstList"
  89 + :showIndex="true"
  90 + :showBorder="true" :loading="false"
  91 + :showPage="false" :showTools="true" :height="(height - 500)">
  92 + <template #tools="{scope}">
  93 + <el-button type="text" size="small"
  94 + @click.prevent="deleteRes(scope.row,scope.$index)">
  95 + <i class="el-icon-delete"/> 移除
  96 + </el-button>
  97 + </template>
  98 + </cm-table-page>
  99 + </el-tab-pane>
  100 + <el-tab-pane label="未添加" name="second">
  101 + <cm-table-page :columns="columns" :dataList="tabSecondList" @loaddata="loadSecondList"
  102 + :showIndex="true"
  103 + :showBorder="true" :loading="false"
  104 + :showPage="false" :showTools="true" :height="(height - 500)">
  105 + <template #tools="{scope}">
  106 + <el-button type="text" size="small" @click.prevent="addRes(scope.row,scope.$index)">
  107 + <i class="el-icon-plus"/> 添加
  108 + </el-button>
  109 + </template>
  110 + </cm-table-page>
  111 + </el-tab-pane>
  112 +
  113 + </el-tabs>
  114 +
  115 + </el-col>
  116 + </el-row>
  117 + </div>
  118 + </div>
  119 +
  120 + <cm-dialog title="保存场景" width="500px" :showDialogVisible="dialogFormVisible" @hidedialog="showDialogForm"
  121 + @okfunc="saveAnalysis">
  122 + <template v-slot>
  123 + <div style="display:inline-block;margin-bottom: 10px">
  124 + <el-radio-group v-model="isAdd" @change="analysisChange">
  125 + <el-radio :label="false" border>
  126 + 新增场景分类
  127 + </el-radio>
  128 + <el-radio :label="true" border>
  129 + 追加场景分类
  130 + </el-radio>
  131 + </el-radio-group>
  132 + </div>
  133 + <div v-if="!isAdd" style="padding: 3px 10px;">
  134 + <el-input v-model="form.parentName" placeholder="请输入场景分类"/>
  135 + </div>
  136 + <div v-else style="padding: 3px 10px;">
  137 + <el-select v-model="form.parentId" placeholder="请选择场景分类" style="width: 100%">
  138 + <el-option
  139 + v-for="item in parentList"
  140 + :key="item.id"
  141 + :label="item.configName"
  142 + :value="item.id">
  143 + </el-option>
  144 + </el-select>
  145 + </div>
  146 + <div style="padding: 3px 10px;">
  147 + <el-input v-model="form.scene.sort" type="number" placeholder="请输入排序"/>
  148 + </div>
  149 + </template>
  150 + </cm-dialog>
  151 +
  152 +</div>
  1 +/**
  2 + * 时间范围:time_scope
  3 + * <p>
  4 + * 作者: Wang
  5 + * 时间:2021/11/20 16:13
  6 + */
  7 +const timeRange = () => {
  8 + const {proxy} = Vue.getCurrentInstance();
  9 + let timeRangeArr = Vue.ref([]);
  10 +
  11 + let loadTimeRange = (callback) => {
  12 + if (timeRangeArr.value.length > 0) {
  13 + return;
  14 + }
  15 + proxy.$http.post(`/api-web/manage/ddic/findSucDdics/time_scope`, {}, function (res) {
  16 + if (res && res.data) {
  17 + timeRangeArr.value = res.data;
  18 +
  19 + if (callback) {
  20 + callback(res.data[0].ddicCode);
  21 + }
  22 + }
  23 + });
  24 + }
  25 +
  26 + return {
  27 + timeRangeArr,
  28 + loadTimeRange
  29 + }
  30 +}
  31 +
  32 +/**
  33 + * 契合频率
  34 + * <p>
  35 + * 作者: Wang
  36 + * 时间:2021/11/20 16:38
  37 + */
  38 +const frequency = () => {
  39 + const {proxy} = Vue.getCurrentInstance();
  40 + let frequencyArr = Vue.ref([]);
  41 +
  42 + let loadFrequency = (defCode, callback) => {
  43 + if (frequencyArr.value.lnegth > 0) {
  44 + return;
  45 + }
  46 +
  47 + let param = {
  48 + ddicName: defCode
  49 + }
  50 + proxy.$http.get(`/api-web/ContrastAnalysis/selectTogetherRate`, param, function (res) {
  51 + if (res && res.data) {
  52 + frequencyArr.value = res.data;
  53 + if (callback) {
  54 + callback();
  55 + }
  56 + }
  57 + });
  58 + }
  59 +
  60 + return {
  61 + frequencyArr,
  62 + loadFrequency
  63 + }
  64 +}
  65 +
  66 +export default {
  67 + name: 'resIndex',
  68 + template: '',
  69 + components: {
  70 + 'analysis-line': Vue.defineAsyncComponent(
  71 + () => myImport('components/page/analysis/lineChars/index')
  72 + ),
  73 + },
  74 + data() {
  75 + return {
  76 + props: {
  77 + label: 'label',
  78 + children: 'children'
  79 + }
  80 + }
  81 + },
  82 + setup() {
  83 + const {proxy} = Vue.getCurrentInstance();
  84 + let height = Vue.ref(window.innerHeight - 10);
  85 +
  86 + let columns = Vue.ref([
  87 + {
  88 + prop: 'busTypeName',
  89 + label: '业务系统',
  90 + sortable: true,
  91 + align: 'center',
  92 + },
  93 + {
  94 + prop: 'resTypeName',
  95 + label: '资源类型',
  96 + sortable: true,
  97 + align: 'center',
  98 + },
  99 + {
  100 + prop: 'resName',
  101 + label: '资源名称',
  102 + sortable: true,
  103 + align: 'center',
  104 + },
  105 + {
  106 + prop: 'ip',
  107 + label: 'ip地址',
  108 + sortable: true,
  109 + align: 'center',
  110 + },
  111 + {
  112 + prop: 'kpiName',
  113 + label: '指标名称',
  114 + sortable: true,
  115 + align: 'center',
  116 + },
  117 + {
  118 + prop: 'flag',
  119 + label: '指标标识',
  120 + sortable: true,
  121 + align: 'center',
  122 + }
  123 + ]);
  124 +
  125 +
  126 + var id = proxy.$global.getQueryVariable('configId');
  127 +
  128 + let resTypeArr = Vue.ref([]);
  129 + let kpiTypeArr = Vue.ref([]);
  130 + let busTypeArr = Vue.ref([]);
  131 + let keyWords = Vue.ref('');
  132 + let config = Vue.ref(id);
  133 + let lineChart = Vue.ref({
  134 + legend: {
  135 + data: []
  136 + },
  137 + xAxis: [],
  138 + series: [{
  139 + name: '',
  140 + type: 'bar',
  141 + data: []
  142 + }]
  143 + });
  144 + let activeName = Vue.ref('first');
  145 + const tabFirstList = Vue.ref([]);
  146 + const tabSecondList = Vue.ref([]);
  147 + let dialogFormVisible = Vue.ref(false);
  148 + let parentList = Vue.ref([]);
  149 + let isAdd = Vue.ref(false);
  150 +
  151 + let form = Vue.ref({
  152 + parentId: '',
  153 + parentName: '',
  154 + desc: '',
  155 + scene: {
  156 + name: '',
  157 + desc: '',
  158 + sort: 1,
  159 + timeScope: '',
  160 + frequency: '',
  161 + },
  162 + resourceList: []
  163 + });
  164 +
  165 +
  166 + let getResType = (arr) => {
  167 + console.log(arr);
  168 + var types = arr.map(function (v) {
  169 + return v.id;
  170 + });
  171 + resTypeArr.value = types;
  172 + loeadTable();
  173 + }
  174 + let getKpiType = (arr) => {
  175 + console.log(arr);
  176 + var types = arr.map(function (v) {
  177 + e
  178 + return v.kpiId;
  179 + });
  180 + kpiTypeArr.value = types;
  181 + loeadTable();
  182 + }
  183 + let getBizType = (arr) => {
  184 + console.log(arr);
  185 + var types = arr.map(function (v) {
  186 + return v.busId;
  187 + });
  188 + busTypeArr.value = types;
  189 + loeadTable();
  190 + }
  191 +
  192 + // 查询参数
  193 + let params = {
  194 + keyWords: keyWords.value,
  195 + resType: resTypeArr.value.join(','),
  196 + kpiType: kpiTypeArr.value.join(','),
  197 + bizType: busTypeArr.value.join(','),
  198 + configId: config.value
  199 + }
  200 +
  201 + let loadFirstList = (reload) => {
  202 + if (!reload && tabFirstList.value.length > 0) {
  203 + return false;
  204 + }
  205 +
  206 + proxy.$http.get(`/api-web/ContrastAnalysis/added`, params, function (res) {
  207 + if (res && res.data) {
  208 + tabFirstList.value = res.data;
  209 + }
  210 + });
  211 + }
  212 +
  213 + let loadSecondList = (reload) => {
  214 + if (!reload && tabSecondList.value.length > 0) {
  215 + return false;
  216 + }
  217 + proxy.$http.get(`/api-web/ContrastAnalysis/notAdded`, params, function (res) {
  218 + if (res && res.data) {
  219 + tabSecondList.value = res.data;
  220 + }
  221 + });
  222 + }
  223 +
  224 +
  225 + let tabClick = (tab, event) => {
  226 + let name = tab.paneName;
  227 + if (name == 'first') {
  228 + loadFirstList(false);
  229 + } else {
  230 + loadSecondList(false);
  231 + }
  232 + }
  233 +
  234 + let loeadTable = (reload) => {
  235 + if (activeName.value == 'first') {
  236 + loadFirstList(reload);
  237 + } else {
  238 + loadSecondList(reload);
  239 + }
  240 + }
  241 +
  242 + const {
  243 + frequencyArr,
  244 + loadFrequency
  245 + } = frequency();
  246 +
  247 + const {
  248 + timeRangeArr,
  249 + loadTimeRange,
  250 + } = timeRange();
  251 +
  252 + let timeRangeChange = (item) => {
  253 + let code = item.ddicCode;
  254 + loadFrequency(code);
  255 + }
  256 +
  257 + let addRes = (row, index) => {
  258 + tabFirstList.value.push(row);
  259 + activeName.value = 'first'
  260 + //proxy.$global.showMsg("添加成功!");
  261 +
  262 + // 加载折线图
  263 + getChartData();
  264 +
  265 + }
  266 + let deleteRes = (row, index) => {
  267 + proxy.$global.confirm("确认删除资源吗?", function () {
  268 + // proxy.$global.showMsg("删除成功!")
  269 + tabFirstList.value.splice(index, 1);
  270 + getChartData();
  271 + })
  272 + }
  273 +
  274 + let getChartData = () => {
  275 +
  276 + let timeScope = form.value.scene.timeScope.replaceAll("time_scope_", "")
  277 + if (timeScope == '') {
  278 + proxy.$global.showMsg("请选择时间范围!", "warning");
  279 + return;
  280 + }
  281 + if (form.value.scene.frequency == '') {
  282 + proxy.$global.showMsg("请选择契合频率!", "warning");
  283 + return;
  284 + }
  285 +
  286 + let resList = tabFirstList.value.map(function (v) {
  287 + return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag}
  288 + });
  289 +
  290 + // let p = {
  291 + // timeScope: timeScope,
  292 + // frequency: form.value.scene.frequency,
  293 + // resource: resList,
  294 + // type : 'avg'
  295 + // }
  296 + let p = {
  297 + "timeScope": timeScope,
  298 + "frequency": form.value.scene.frequency,
  299 + "resource": [
  300 + {
  301 + "resId": "F6F24DADC01ADE5DD9583144BE6E8E15",
  302 + "kpiId": "KPI20352505",
  303 + "kpiFlg": "mem"
  304 + },
  305 + {
  306 + "resId": "C5DC239D719ACAB61231ACED7CE68CD1",
  307 + "kpiId": "KPI7054BC34",
  308 + "kpiFlg": "cpu"
  309 + }
  310 + ],
  311 + "type": "avg"
  312 + }
  313 +
  314 + proxy.$http.post(`/api-web/ContrastAnalysis/getLineData`, p, function (res) {
  315 + if (res && res.map) {
  316 + let map = res.map;
  317 +
  318 + let legend = map.legend;
  319 + //let units = map.units;
  320 + let xAxis = map.x;
  321 +
  322 + let yArr = map.y;
  323 +
  324 + //
  325 + let series = [];
  326 + legend.forEach(function (v, i) {
  327 + series.push({
  328 + name: v,
  329 + type: 'line',
  330 + data: yArr[i]
  331 + });
  332 + })
  333 +
  334 +
  335 + lineChart.value = {
  336 + legend: {
  337 + data: legend
  338 + },
  339 + xAxis: xAxis,
  340 + series: series
  341 + }
  342 + }
  343 + });
  344 + }
  345 +
  346 +
  347 + // 点击按钮搜索
  348 + let onBtnSearch = () => {
  349 + loeadTable(true);
  350 + }
  351 +
  352 + let onReset = () => {
  353 + keyWords.value = '';
  354 + resTypeArr.value = [];
  355 + kpiTypeArr.value = [];
  356 + busTypeArr.value = [];
  357 + }
  358 +
  359 + let showDialogForm = (flg) => {
  360 + dialogFormVisible.value = flg;
  361 + }
  362 +
  363 + let analysisChange = (val) => {
  364 + if (val && val === true && parentList.value.length == 0) {
  365 + // 加载数据
  366 + proxy.$http.post(`/api-web/ContrastAnalysis/selectScene`, {}, function (res) {
  367 + if (res && res.data) {
  368 + parentList.value = res.data;
  369 + }
  370 + });
  371 + }
  372 + }
  373 + let saveAnalysis = () => {
  374 + let formVal = form.value;
  375 + let parentName = formVal.parentName;
  376 + let parentId = formVal.parentId;
  377 + let name = formVal.scene.name;
  378 + let sort = formVal.scene.sort;
  379 + let timeScope = formVal.scene.timeScope;
  380 + let frequency = formVal.scene.frequency;
  381 + let resourceList = tabFirstList.value;
  382 +
  383 + if(name == ''){
  384 + proxy.$global.showMsg("请输入场景名称!","warning");
  385 + return;
  386 + }
  387 +
  388 + if(resourceList && resourceList.length == 0){
  389 + proxy.$global.showMsg("请添加资源!","warning");
  390 + return;
  391 + }
  392 +
  393 + let resList = resourceList.map(function (v) {
  394 + return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag,resType:v.resType,kpiUnit:v.kpiUnit}
  395 + });
  396 +
  397 +
  398 + let addParam = {
  399 + scene: [{
  400 + name: name,
  401 + desc: '',
  402 + sort: sort,
  403 + timeScope: timeScope,
  404 + frequency: frequency,
  405 + resourceList: resList
  406 + }]
  407 + }
  408 +
  409 + let url = '';
  410 + if (isAdd.value == false) {
  411 + if(parentName == ''){
  412 + proxy.$global.showMsg("请输入场景分类!","warning");
  413 + return;
  414 + }
  415 + addParam['parentName'] = parentName;
  416 + url = '/api-web/ContrastAnalysis/insertScene';
  417 + } else {
  418 + if(parentId == ''){
  419 + proxy.$global.showMsg("请选择场景分类!","warning");
  420 + return;
  421 + }
  422 + addParam['parentId'] = parentId;
  423 + url = '/api-web/ContrastAnalysis/updateNode';
  424 + }
  425 +
  426 + proxy.$http.post(url, addParam, function (res) {
  427 + if (res && res.success) {
  428 + proxy.$global.showMsg("添加成功!");
  429 + setTimeout(function () {
  430 + window.top.location.href = window.top.location.origin + "/#/analysis/index"
  431 + }, 1500)
  432 + }
  433 + });
  434 + }
  435 +
  436 +
  437 + // 挂载完
  438 + Vue.onMounted(() => {
  439 + if(!id){
  440 + activeName.value = 'second';
  441 + }
  442 + loeadTable();
  443 +
  444 + // 先加载时间范围,然后在加载
  445 + loadTimeRange(function (defCode) {
  446 + form.value.scene.timeScope = defCode;
  447 + loadFrequency(defCode, function () {
  448 + if (frequencyArr.value.length > 0) {
  449 + form.value.scene.frequency = frequencyArr.value[0].ddicCode;
  450 + }
  451 + });
  452 + });
  453 + console.log('onMounted');
  454 + })
  455 +
  456 +
  457 + return {
  458 + height,
  459 + lineChart,
  460 + form,
  461 + columns,
  462 + tabFirstList,
  463 + tabSecondList,
  464 + addRes,
  465 + deleteRes,
  466 + onBtnSearch,
  467 + onReset,
  468 +
  469 + getResType,
  470 + getKpiType,
  471 + getBizType,
  472 + keyWords,
  473 +
  474 + loadFirstList,
  475 + loadSecondList,
  476 +
  477 + activeName,
  478 + tabClick,
  479 +
  480 + frequencyArr,
  481 + loadFrequency,
  482 + timeRangeArr,
  483 + loadTimeRange,
  484 + timeRangeChange,
  485 +
  486 + isAdd,
  487 + analysisChange,
  488 + dialogFormVisible,
  489 + showDialogForm,
  490 + saveAnalysis,
  491 + parentList
  492 + }
  493 + }
  494 +}
  1 +<div class="container" :style="{'height':height+'px','max-height':height+'px'}">
  2 + <div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}">
  3 + <div v-for="(item,index) in childArr">
  4 + <analysis-line :legend="lineChart[item.node.id].legend" :xAxis="lineChart[item.node.id].xAxis" :series="lineChart[item.node.id].series">
  5 + <template #title="scope" >
  6 + {{ index == 0 ? item.node.configName : '' }}
  7 + </template>
  8 + <template #lineName="scope">
  9 + {{ item.node.configName }}
  10 + </template>
  11 +
  12 + <template #timeRange="scope">
  13 + {{ item.node.timeScope }}
  14 + </template>
  15 + <template #frequency="scope">
  16 + {{ item.node.frequency }}
  17 + </template>
  18 +
  19 + <template #tools="scope">
  20 + <router-link :to="'/analysis/add?configId=' + item.node.id " class="analysis link-type">
  21 + 编辑
  22 + </router-link>
  23 + </template>
  24 + </analysis-line>
  25 + <el-divider content-position="left">
  26 + <!--<div>
  27 + <i class="iconfont icon-liebiaomoshi"></i>
  28 + <span style="margin-left: 5px">查询条件</span>
  29 + </div>-->
  30 + </el-divider>
  31 + </div>
  32 + </div>
  33 +</div>
  1 +export default {
  2 + name: 'analysisViewIndex',
  3 + template: '',
  4 + components: {
  5 + 'analysis-line': Vue.defineAsyncComponent(
  6 + () => myImport('components/page/analysis/lineChars/index')
  7 + )
  8 + },
  9 + data() {
  10 + return {}
  11 + },
  12 + setup() {
  13 + const {proxy} = Vue.getCurrentInstance();
  14 + let height = Vue.ref(window.innerHeight - 10);
  15 + let parentInfo = Vue.ref([]);
  16 + let childArr = Vue.ref({});
  17 + let lineChart = Vue.ref({});
  18 +
  19 + var id = proxy.$global.getQueryVariable('id');
  20 +
  21 + if(id && id == ''){
  22 + proxy.$global.showMsg("获取场景信息异常,请联系管理员!","warning");
  23 + return;
  24 + }
  25 +
  26 + let loadDetail = () => {
  27 + // 加载数据
  28 + proxy.$http.get(`/api-web/ContrastAnalysis/getNode`, {id:id}, function (res) {
  29 + if (res && res.map) {
  30 + let child = res.map.sNode;
  31 + let parentList = res.map.pNode;
  32 +
  33 + parentInfo.value = parentList;
  34 + childArr.value =child;
  35 +
  36 + child.forEach(function (v){
  37 + getChartData(v);
  38 + })
  39 +
  40 + }
  41 + });
  42 + }
  43 +
  44 + let getChartData = (v) => {
  45 +
  46 + let nodeId = v.node.id;
  47 + let resource = v.resource;
  48 +
  49 + lineChart.value[nodeId] = {
  50 + legend: {
  51 + data: []
  52 + },
  53 + xAxis: [],
  54 + series: []
  55 + }
  56 +
  57 +
  58 + let resList = resource.map(function (v) {
  59 + return {resId: v.resId, kpiId: v.kpiId, kpiFlg: v.flag}
  60 + });
  61 +
  62 + // let p = {
  63 + // "timeScope": v.node.timeScope,
  64 + // "frequency": v.node.frequency,
  65 + // "resource": resList,
  66 + // "type": "avg"
  67 + // }
  68 +
  69 + let p = {
  70 + "timeScope": 'DAY',
  71 + "frequency": '15',
  72 + "resource": [
  73 + {
  74 + "resId": "F6F24DADC01ADE5DD9583144BE6E8E15",
  75 + "kpiId": "KPI20352505",
  76 + "kpiFlg": "mem"
  77 + },
  78 + {
  79 + "resId": "C5DC239D719ACAB61231ACED7CE68CD1",
  80 + "kpiId": "KPI7054BC34",
  81 + "kpiFlg": "cpu"
  82 + }
  83 + ],
  84 + "type": "avg"
  85 + }
  86 +
  87 + proxy.$http.post(`/api-web/ContrastAnalysis/getLineData`, p, function (res) {
  88 + if (res && res.map) {
  89 + let map = res.map;
  90 +
  91 + let legend = map.legend;
  92 + //let units = map.units;
  93 + let xAxis = map.x;
  94 +
  95 + let yArr = map.y;
  96 +
  97 + //
  98 + let series = [];
  99 + legend.forEach(function (v, i) {
  100 + series.push({
  101 + name: v,
  102 + type: 'line',
  103 + data: yArr[i]
  104 + });
  105 + })
  106 +
  107 +
  108 + lineChart.value[nodeId] = {
  109 + legend: {
  110 + data: legend
  111 + },
  112 + xAxis: xAxis,
  113 + series: series
  114 + }
  115 + }
  116 + },undefined,undefined,false);
  117 + }
  118 +
  119 +
  120 + // 挂载完
  121 + Vue.onMounted(() => {
  122 + loadDetail();
  123 + console.log('onMounted');
  124 + })
  125 +
  126 +
  127 + return {
  128 + height,
  129 + childArr,
  130 + parentInfo,
  131 + lineChart
  132 + }
  133 + }
  134 +}
  1 +<div class="machine-room">
  2 + <div class="room-top">
  3 + <el-tabs type="card" @tab-click="handleCommand" v-model="commandVal">
  4 + <el-tab-pane v-for="item in commandNameData" :label="item.name" :name="item.val"></el-tab-pane>
  5 +
  6 + </el-tabs>
  7 + <!--<el-dropdown @command="handleCommand" class="elSelf" :popper-append-to-body="false">
  8 + <span class="el-dropdown-link">
  9 + {{commandName}}
  10 + <i class="icon-arrow"></i>
  11 + </span>
  12 + <template #dropdown>
  13 + <el-dropdown-menu class="cpuDropdown">
  14 + <el-dropdown-item v-for="item in commandNameData" :command="item.val">{{item.name}}</el-dropdown-item>
  15 +
  16 +
  17 + </el-dropdown-menu>
  18 + </template>
  19 + </el-dropdown>-->
  20 + </div>
  21 + <div class="room-html">
  22 + <el-row>
  23 + <el-col class="video-item" :span="24" >
  24 + <MachineRoom v-if="src" :src="src"></MachineRoom>
  25 + </el-col>
  26 + </el-row>
  27 + </div>
  28 +
  29 +</div>
  1 +export default {
  2 + name: 'machineRoom',
  3 + template: '',
  4 + components: {
  5 + 'MachineRoom': Vue.defineAsyncComponent(
  6 + () => myImport('views/commonComponents/machineRoom/index')
  7 + ),
  8 + },
  9 + props:['commandNameData'],
  10 + data(){
  11 + return {
  12 + domainName:sessionStorage.getItem('domainName'),
  13 + accessToken:localStorage.getItem('access_token'),
  14 + commandName:'',//下拉选择默认显示名称
  15 + htmlName:'',//机房组件名称-html名称
  16 + commandVal:'',//下拉选择选中值
  17 + src:'',//机房布局html地址
  18 + changeIndex:1//每点击tab的值变化
  19 +
  20 + }
  21 + },
  22 + watch:{
  23 + changeIndex(newValue, oldValue) {
  24 + console.log("changeIndex",newValue)
  25 + }
  26 +
  27 + },
  28 +
  29 + setup(props, {attrs, slots, emit}) {
  30 + const {proxy} = Vue.getCurrentInstance();
  31 + proxy.htmlName=Vue.ref();
  32 + proxy.commandVal=Vue.ref()
  33 + proxy.commandName=Vue.ref();
  34 + proxy.src=Vue.ref();
  35 +
  36 +
  37 + // 挂载完
  38 + Vue.onMounted(() => {
  39 + proxy.commandVal='one';
  40 + proxy.getMachine(proxy.commandVal);
  41 +
  42 + })
  43 + //初始获取默认机房选择信息
  44 + const getMachine=(command)=>{
  45 + //commandNameData机房机柜数据
  46 + props.commandNameData.map((item,index)=>{
  47 + if(command==item.val){
  48 + proxy.htmlName=item.htmlName;
  49 + proxy.commandName=item.name;
  50 + proxy.commandVal=item.val;
  51 + }
  52 + })
  53 + proxy.src='/h5/machineroom/'+proxy.htmlName+'.html?access_token='+proxy.accessToken+'&changeIndex='+proxy.changeIndex
  54 + console.log("htmlName",proxy.htmlName,proxy.src)
  55 +
  56 + }
  57 + const handleCommand=(command,event)=>{
  58 + proxy.changeIndex++;
  59 + proxy.commandVal=command.props.name;
  60 +
  61 + proxy.getMachine(proxy.commandVal)
  62 +
  63 + // proxy.innerVisible=true;
  64 + }
  65 +
  66 + return{
  67 + getMachine,
  68 + handleCommand
  69 +
  70 + }
  71 + }
  72 +}
  1 +<iframe v-if="src" style="width:1100px;height:720px;" :src="src" frameborder="0" ref="machineIframe" ></iframe>
  1 +export default {
  2 + name: 'machineRoom',
  3 + template: '',
  4 + components: {},
  5 + props:['src'],
  6 + data(){
  7 + return {
  8 + domainName:sessionStorage.getItem('domainName'),
  9 + accessToken:localStorage.getItem('access_token'),
  10 +
  11 + // src:'/h5/machineroom/huzhouzaibeione.html?access_token='+this.accessToken
  12 +
  13 + }
  14 + },
  15 +
  16 + setup(props, {attrs, slots, emit}) {
  17 + const {proxy} = Vue.getCurrentInstance();
  18 +
  19 +
  20 + // 挂载完
  21 + Vue.onMounted(() => {
  22 +
  23 + })
  24 +
  25 + return{
  26 + // src:'/h5/machineroom/'+props.htmlName+'.html?access_token='+proxy.accessToken
  27 +
  28 + }
  29 + }
  30 +}
@@ -41,17 +41,17 @@ export default { @@ -41,17 +41,17 @@ export default {
41 41
42 // 半透明的颜色值 42 // 半透明的颜色值
43 const colorArr1 = [ 43 const colorArr1 = [
44 - 'rgba(151,213,244, 0.8)',  
45 - 'rgba(239,224,167, 0.8)',  
46 - 'rgba(44, 110, 255, 0.8)',  
47 - 'rgba(151,170,255, 0.8)' 44 + 'rgba(255,0,255, 0.8)',
  45 + 'rgba(23,212,152, 0.8)',
  46 + 'rgba(253,152,58, 0.8)',
  47 + 'rgba(255,113,66, 0.8)'
48 ] 48 ]
49 // 全透明的颜色值 49 // 全透明的颜色值
50 const colorArr2 = [ 50 const colorArr2 = [
51 - 'rgba(151,213,244, 0)',  
52 - 'rgba(239,224,167, 0)',  
53 - 'rgba(44, 110, 255, 0)',  
54 - 'rgba(151,170,255, 0)' 51 + 'rgba(255,0,255, 0)',
  52 + 'rgba(23,212,152, 0)',
  53 + 'rgba(253,152,58, 0)',
  54 + 'rgba(255,113,66, 0)'
55 ] 55 ]
56 // 挂载完 56 // 挂载完
57 Vue.onMounted(() => { 57 Vue.onMounted(() => {
@@ -13,7 +13,7 @@ export default { @@ -13,7 +13,7 @@ export default {
13 allData: { 13 allData: {
14 polyline: { 14 polyline: {
15 title: "申报库CPU监控", 15 title: "申报库CPU监控",
16 - unit: "cpu使用率%", 16 + unit: "使用率%",
17 data: [{ 17 data: [{
18 name: "80.12.97.3", 18 name: "80.12.97.3",
19 datas: ["12","15","21","18","20","37","45","23","12","5","7","14"] 19 datas: ["12","15","21","18","20","37","45","23","12","5","7","14"]
@@ -109,8 +109,15 @@ export default { @@ -109,8 +109,15 @@ export default {
109 109
110 } 110 }
111 that.allData.polyline.data.push(resData.series[0]) 111 that.allData.polyline.data.push(resData.series[0])
112 - that.updateChart() 112 + that.allData.polyline.data.map((item,index)=>{
  113 + if(index==0){
  114 + item.name="80.12.97.3"
  115 + }else{
  116 + item.name="80.12.97.2"
113 117
  118 + }
  119 + })
  120 + that.updateChart()
114 121
115 }); 122 });
116 }, 123 },
@@ -143,7 +150,7 @@ export default { @@ -143,7 +150,7 @@ export default {
143 that.allData = { 150 that.allData = {
144 polyline: { 151 polyline: {
145 title: "申报库CPU监控", 152 title: "申报库CPU监控",
146 - unit: "cpu使用率%", 153 + unit: "使用率%",
147 data: seriesData1 154 data: seriesData1
148 }, 155 },
149 xAxis: { 156 xAxis: {
@@ -251,7 +258,8 @@ export default { @@ -251,7 +258,8 @@ export default {
251 258
252 }, 259 },
253 legend: { 260 legend: {
254 - data: ["80.12.97.3","80.12.97.2"], 261 + // data: ["80.12.97.3","80.12.97.2"],
  262 + data: legendArr,
255 itemHeight:0,//图例圆圈大小设置 263 itemHeight:0,//图例圆圈大小设置
256 right: '5%', 264 right: '5%',
257 top: '5%', 265 top: '5%',
@@ -286,7 +294,7 @@ export default { @@ -286,7 +294,7 @@ export default {
286 }, 294 },
287 yAxis: { 295 yAxis: {
288 type: 'value', 296 type: 'value',
289 - name:'cpu使用率%', 297 + name:unit,
290 nameTextStyle:{ 298 nameTextStyle:{
291 color:'#ffffff', 299 color:'#ffffff',
292 padding:[0,0,0,-20] 300 padding:[0,0,0,-20]
@@ -167,7 +167,7 @@ export default { @@ -167,7 +167,7 @@ export default {
167 167
168 }, 168 },
169 grid: { 169 grid: {
170 - top:'3%', 170 + // top:'10%',
171 left: '3%', 171 left: '3%',
172 right: '4%', 172 right: '4%',
173 bottom: '2%', 173 bottom: '2%',
@@ -12,7 +12,7 @@ export default { @@ -12,7 +12,7 @@ export default {
12 allData: { 12 allData: {
13 polyline: { 13 polyline: {
14 title: "文书库CPU监控", 14 title: "文书库CPU监控",
15 - unit: "cpu使用率%", 15 + unit: "使用率%",
16 data: [{ 16 data: [{
17 name: "80.12.97.7", 17 name: "80.12.97.7",
18 data: ["12","15","21","18","20","37","45","23","12","5","7","14"] 18 data: ["12","15","21","18","20","37","45","23","12","5","7","14"]
@@ -104,6 +104,14 @@ export default { @@ -104,6 +104,14 @@ export default {
104 resData=that.res2.data 104 resData=that.res2.data
105 } 105 }
106 that.allData.polyline.data.push(resData.series[0]) 106 that.allData.polyline.data.push(resData.series[0])
  107 + that.allData.polyline.data.map((item,index)=>{
  108 + if(index==0){
  109 + item.name="80.12.97.7"
  110 + }else{
  111 + item.name="80.12.97.8"
  112 +
  113 + }
  114 + })
107 that.updateChart() 115 that.updateChart()
108 }); 116 });
109 }, 117 },
@@ -135,7 +143,7 @@ export default { @@ -135,7 +143,7 @@ export default {
135 that.allData = { 143 that.allData = {
136 polyline: { 144 polyline: {
137 title: "文书库CPU监控", 145 title: "文书库CPU监控",
138 - unit: "cpu使用率%", 146 + unit: "使用率%",
139 data: seriesData1 147 data: seriesData1
140 }, 148 },
141 xAxis: { 149 xAxis: {
@@ -237,7 +245,8 @@ export default { @@ -237,7 +245,8 @@ export default {
237 245
238 }, 246 },
239 legend: { 247 legend: {
240 - data: ["80.12.97.7","80.12.97.8"], 248 + // data: ["80.12.97.7","80.12.97.8"],
  249 + data: legendArr,
241 itemHeight:0,//图例圆圈大小设置 250 itemHeight:0,//图例圆圈大小设置
242 right: '5%', 251 right: '5%',
243 top: '5%', 252 top: '5%',
@@ -52,7 +52,8 @@ export default { @@ -52,7 +52,8 @@ export default {
52 return { 52 return {
53 titleFontSize: 30, 53 titleFontSize: 30,
54 dateTime: '00-00-00 00:00:00', 54 dateTime: '00-00-00 00:00:00',
55 - colorData:['#0D45FE','#00FFB9','#A35CFF'], 55 + // colorData:['#0D45FE','#00FFB9','#A35CFF'],
  56 + colorData:["#97d5f4",'#efe0a7','#e5abd1'],
56 commandName:'最大值', 57 commandName:'最大值',
57 commandVal:'max' 58 commandVal:'max'
58 } 59 }
@@ -5,8 +5,8 @@ @@ -5,8 +5,8 @@
5 5
6 </div> 6 </div>
7 <div class="ypt"> 7 <div class="ypt">
8 - <el-carousel direction="vertical" :autoplay="true" indicator-position="none" interval="4000" >  
9 - <el-carousel-item v-for="(item,index) in cloudData" :key="index"> 8 + <el-carousel direction="vertical" :autoplay="true" indicator-position="none" interval="20000" ref="cloudCarousel" >
  9 + <el-carousel-item v-for="(item,index) in cloudData" :key="index" name="index">
10 <div class="item swiper-slide" > 10 <div class="item swiper-slide" >
11 <div class="ui_base u_p3d"> 11 <div class="ui_base u_p3d">
12 <!--<div class="circlediv"> 12 <!--<div class="circlediv">
@@ -54,6 +54,11 @@ export default { @@ -54,6 +54,11 @@ export default {
54 }) 54 })
55 proxy.cloudData=data; 55 proxy.cloudData=data;
56 56
  57 + setTimeout(function (){
  58 + proxy.$refs.cloudCarousel.setActiveItem(1);
  59 +
  60 + },1000)
  61 +
57 run(); 62 run();
58 //鼠标移入停止环绕动画 63 //鼠标移入停止环绕动画
59 $(".ypt__info .ball_base").hover(function() { 64 $(".ypt__info .ball_base").hover(function() {
@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
5 5
6 </div> 6 </div>
7 <div class="sjzx"> 7 <div class="sjzx">
8 - <div class="item sjzx_machineroom" v-for="item in jfdata" > 8 + <div class="item sjzx_machineroom" v-for="(item,index) in jfdata" >
9 <h5 >{{item.machineRoomName}}</h5> 9 <h5 >{{item.machineRoomName}}</h5>
10 <div class="imgDiv"> 10 <div class="imgDiv">
11 <!-- <img @click="isShow(item)" class="imgDiv-video" src="/vue3/src/assets/images/zjdp/icon-jf.png">--> 11 <!-- <img @click="isShow(item)" class="imgDiv-video" src="/vue3/src/assets/images/zjdp/icon-jf.png">-->
@@ -14,8 +14,8 @@ @@ -14,8 +14,8 @@
14 </div> 14 </div>
15 15
16 <ul class="float-container"> 16 <ul class="float-container">
17 - <li><i class='icon-wd'></i><span>温度:{{item.wd}}</span></li>  
18 - <li><i class='icon-sd'></i><span>湿度:{{item.sd}}</span></li> 17 + <li><i class='icon-wd'></i><span v-show="index==0">机柜:252</span><span v-show="index==1">机柜:42</span></li>
  18 + <li><i class='icon-sd'></i><span v-show="index==0">资产:1568</span><span v-show="index==1">资产:46</span></li>
19 <li><i class='icon-mj'></i><span>面积:{{item.area}}</span></li> 19 <li><i class='icon-mj'></i><span>面积:{{item.area}}</span></li>
20 </ul> 20 </ul>
21 </div> 21 </div>
@@ -35,21 +35,8 @@ @@ -35,21 +35,8 @@
35 </el-dialog> 35 </el-dialog>
36 36
37 <!--机房布局--> 37 <!--机房布局-->
38 - <el-dialog v-model="outerVisible" title="机房布局" width="60%">  
39 - <el-row>  
40 - <el-col :span="11"></el-col>  
41 - <el-col :span="2">过道</el-col>  
42 - <el-col :span="11"></el-col>  
43 - </el-row>  
44 - <template #default>  
45 - <el-dialog  
46 - v-model="innerVisible"  
47 - width="60%"  
48 - title="Inner Dialog"  
49 - append-to-body  
50 - >  
51 - </el-dialog>  
52 - </template> 38 + <el-dialog v-model="outerVisible" :title="dialogMachineName" width="60%" @close="closeDialog">
  39 + <GetMachineRoom v-if="commandNameData" :commandNameData="commandNameData"></GetMachineRoom>
53 40
54 </el-dialog> 41 </el-dialog>
55 42
1 export default { 1 export default {
2 name: 'dataCenter', 2 name: 'dataCenter',
3 template: '', 3 template: '',
4 - components: {}, 4 + components: {
  5 + 'GetMachineRoom': Vue.defineAsyncComponent(
  6 + () => myImport('views/commonComponents/getMachineRoom/index')
  7 + ),
  8 + },
5 data(){ 9 data(){
6 return { 10 return {
7 domainName:sessionStorage.getItem('domainName'), 11 domainName:sessionStorage.getItem('domainName'),
@@ -9,10 +13,53 @@ export default { @@ -9,10 +13,53 @@ export default {
9 apiUrl:'/api-web/bigScreen/getMachineRoomInfoList', 13 apiUrl:'/api-web/bigScreen/getMachineRoomInfoList',
10 jfdata:'', 14 jfdata:'',
11 dialogMachineName:'', 15 dialogMachineName:'',
  16 + commandNameData:'',
  17 + commandNameDataH:[
  18 + {
  19 + name:'湖州灾备机房一',
  20 + htmlName:'huzhouzaibeione',
  21 + val:'one'
  22 + },
  23 + {
  24 + name:'湖州灾备机房二',
  25 + htmlName:'huzhouzaibeitwo',
  26 + val:'two'
  27 + },
  28 + {
  29 + name:'湖州灾备机房三',
  30 + htmlName:'huzhouzaibeithree',
  31 + val:'three'
  32 + }
  33 + ],//机房布局html数据
  34 + commandNameDataX:[
  35 + {
  36 + name:'萧山IDC二号机房',
  37 + htmlName:'xiaoshansecond',
  38 + val:'one'
  39 + },
  40 + {
  41 + name:'萧山IDC三号机房',
  42 + htmlName:'xiaoshanthird',
  43 + val:'two'
  44 + },
  45 + {
  46 + name:'萧山IDC七号机房',
  47 + htmlName:'xiaoshanseven',
  48 + val:'three'
  49 + }
  50 + ],
  51 + commandName:'',//下拉选择默认显示名称
  52 + htmlName:'',//机房组件名称-html名称
  53 + commandVal:'',//下拉选择选中值
  54 + src:'',//机房布局html地址
12 } 55 }
13 }, 56 },
14 setup(props, {attrs, slots, emit}) { 57 setup(props, {attrs, slots, emit}) {
15 const {proxy} = Vue.getCurrentInstance(); 58 const {proxy} = Vue.getCurrentInstance();
  59 + proxy.htmlName=Vue.ref();
  60 + proxy.commandVal=Vue.ref()
  61 + proxy.commandName=Vue.ref();
  62 + proxy.src=Vue.ref();
16 63
17 // 挂载完 64 // 挂载完
18 Vue.onMounted(() => { 65 Vue.onMounted(() => {
@@ -37,31 +84,36 @@ export default { @@ -37,31 +84,36 @@ export default {
37 });*/ 84 });*/
38 } 85 }
39 }) 86 })
40 - proxy.jfdata=[  
41 - {machineRoomName:'兴议机房',wd:'0',sd:'0',area:'0'},  
42 - {machineRoomName:'湖州机房',wd:'0',sd:'0',area:'0'}  
43 - ] 87 +
44 }) 88 })
45 const isShow=(item)=>{ 89 const isShow=(item)=>{
46 - console.log("999",item)  
47 -  
48 - proxy.dialogMachineName=item.machineRoomName  
49 - proxy.centerDialogVisible = true 90 + proxy.dialogMachineName=item.machineRoomName;
  91 + proxy.centerDialogVisible = true;
50 } 92 }
51 const isShowOuter=(item)=>{ 93 const isShowOuter=(item)=>{
52 - console.log(";;;",item)  
53 - if(item.layout == 1){  
54 - proxy.outerVisible = true  
55 - } 94 + proxy.dialogMachineName=item.machineRoomName;
  95 + proxy.outerVisible = true;
56 96
  97 + if(item.layout == 0){
  98 + proxy.commandNameData=proxy.commandNameDataH;//湖州机房布局数据
  99 + }else{
  100 + // proxy.commandNameData=proxy.commandNameDataX;//兴议机房布局数据
57 101
58 } 102 }
  103 + }
  104 + //关闭弹框时清空数据
  105 + const closeDialog=()=>{
  106 + proxy.commandNameData=Vue.ref();
  107 +
  108 + }
  109 +
59 return{ 110 return{
60 centerDialogVisible: Vue.ref(false), 111 centerDialogVisible: Vue.ref(false),
61 outerVisible: Vue.ref(false), 112 outerVisible: Vue.ref(false),
62 innerVisible: Vue.ref(false), 113 innerVisible: Vue.ref(false),
63 isShowOuter, 114 isShowOuter,
64 - isShow 115 + isShow,
  116 + closeDialog
65 } 117 }
66 } 118 }
67 } 119 }
@@ -16,6 +16,7 @@ export default { @@ -16,6 +16,7 @@ export default {
16 ySeriesCommon:[], 16 ySeriesCommon:[],
17 legendData:[], 17 legendData:[],
18 xAxisDataDate:[], 18 xAxisDataDate:[],
  19 + yAxisData:[],
19 optionData:'', 20 optionData:'',
20 colorData:["#97d5f4",'#efe0a7','#e5abd1'], 21 colorData:["#97d5f4",'#efe0a7','#e5abd1'],
21 chartId:'line-echart-declare' 22 chartId:'line-echart-declare'
@@ -42,14 +43,21 @@ export default { @@ -42,14 +43,21 @@ export default {
42 let declareLineData=data.data; 43 let declareLineData=data.data;
43 let legendData=[]; 44 let legendData=[];
44 let xAxisDataDate=[]; 45 let xAxisDataDate=[];
  46 + let yAxisData=[];
45 $.each(declareLineData,function (i,v){ 47 $.each(declareLineData,function (i,v){
  48 + let index=0;
  49 + if(i==2){
  50 + index=1;
  51 + }else{
  52 + index=0;
  53 + }
46 ySeriesCommon.push({ 54 ySeriesCommon.push({
47 name:v.name, 55 name:v.name,
48 type:'line', 56 type:'line',
49 smooth:true, 57 smooth:true,
50 - stack:'Total', 58 + // stack:'Total',//修改数据值在最大值时折线被遮挡
51 data:v.number, 59 data:v.number,
52 - // yAxisIndex:0, 60 + yAxisIndex:index,
53 showSymbol:false, 61 showSymbol:false,
54 itemStyle : { 62 itemStyle : {
55 normal : { 63 normal : {
@@ -64,6 +72,7 @@ export default { @@ -64,6 +72,7 @@ export default {
64 } 72 }
65 }, 73 },
66 }) 74 })
  75 + yAxisData.push(v.number);
67 legendData.push(v.name); 76 legendData.push(v.name);
68 xAxisDataDate.push(v.days); 77 xAxisDataDate.push(v.days);
69 78
@@ -71,6 +80,7 @@ export default { @@ -71,6 +80,7 @@ export default {
71 proxy.ySeriesCommon=ySeriesCommon; 80 proxy.ySeriesCommon=ySeriesCommon;
72 proxy.legendData=legendData; 81 proxy.legendData=legendData;
73 proxy.xAxisDataDate=xAxisDataDate[0]; 82 proxy.xAxisDataDate=xAxisDataDate[0];
  83 + proxy.yAxisData=yAxisData;
74 proxy.optionInit(); 84 proxy.optionInit();
75 } 85 }
76 }) 86 })
@@ -78,6 +88,14 @@ export default { @@ -78,6 +88,14 @@ export default {
78 88
79 }) 89 })
80 const optionInit=()=>{ 90 const optionInit=()=>{
  91 + console.log("888",proxy.yAxisData)
  92 + let data1=proxy.yAxisData[0];
  93 + let data2=proxy.yAxisData[1];
  94 + let data3=proxy.yAxisData[2];
  95 + let min1=proxy.calMin([data1,data2]);
  96 + let max1=proxy.calMax([data1,data2]);
  97 + let min2=proxy.calMin([data3,data3]);
  98 + let max2=proxy.calMax([data3,data3]);
81 99
82 proxy.optionData = { 100 proxy.optionData = {
83 title: { 101 title: {
@@ -132,7 +150,8 @@ export default { @@ -132,7 +150,8 @@ export default {
132 }, 150 },
133 151
134 }, 152 },
135 - yAxis:{ 153 + yAxis:[
  154 + {
136 type: 'value', 155 type: 'value',
137 splitLine:{ 156 splitLine:{
138 lineStyle: { 157 lineStyle: {
@@ -142,16 +161,70 @@ export default { @@ -142,16 +161,70 @@ export default {
142 axisLabel:{ 161 axisLabel:{
143 color:'#ffffff', 162 color:'#ffffff',
144 }, 163 },
  164 + splitNumber:5,
  165 + min:min1,
  166 + max:max1,
  167 + interval:(max1-min1)/5
145 }, 168 },
  169 + {
  170 + type: 'value',
  171 + splitLine:{
  172 + lineStyle: {
  173 + color:'#0a1b31'
  174 + }
  175 + },
  176 + axisLabel:{
  177 + color:'#ffffff',
  178 + },
  179 + splitNumber:5,
  180 + min:min2,
  181 + max:max2,
  182 + interval:(max2-min2)/5
  183 + }
  184 + ],
146 series: proxy.ySeriesCommon, 185 series: proxy.ySeriesCommon,
147 itemStyle:{ 186 itemStyle:{
148 showSymbol:false 187 showSymbol:false
149 } 188 }
150 }; 189 };
151 } 190 }
  191 + //计算最大值
  192 + const calMax=(arr)=>{
  193 + let max=0;
  194 + arr.forEach((el)=>{
  195 + el.forEach((el1)=>{
  196 + if(!(el1 === undefined || el1 === '')){
  197 + if(max<el1){
  198 + max=el1;
  199 + }
  200 + }
  201 + })
  202 + })
  203 + let maxint=Math.ceil(max/9.5);
  204 + let maxval=maxint * 10;//让显示的刻度是整数
  205 + return maxval;
  206 + }
  207 + //计算最小值
  208 + const calMin=(arr)=>{
  209 + let min=0;
  210 + arr.forEach((el)=>{
  211 + el.forEach((el1)=>{
  212 + if(!(el1 === undefined || el1 === '')){
  213 + if(min>el1){
  214 + min=el1;
  215 + }
  216 + }
  217 + })
  218 + })
  219 + let minint=Math.floor(min/10);
  220 + let minval=minint * 10;//让显示的刻度是整数
  221 + return minval;
  222 + }
152 223
153 return{ 224 return{
154 - optionInit 225 + optionInit,
  226 + calMax,
  227 + calMin
155 } 228 }
156 } 229 }
157 } 230 }
@@ -19,7 +19,6 @@ export default { @@ -19,7 +19,6 @@ export default {
19 timer:null, 19 timer:null,
20 domainName:sessionStorage.getItem('domainName'), 20 domainName:sessionStorage.getItem('domainName'),
21 apiUrl:'/api-web/sxview/getbizListByUser?access_token=', 21 apiUrl:'/api-web/sxview/getbizListByUser?access_token=',
22 - apiUrl1:'/api-web/sxview/getHealthDegree?busId=53bebbd79f384f619513b50666ea1d48&kpiId=KPIFB844B8B',  
23 checkId:0,//当前选中的tabs 22 checkId:0,//当前选中的tabs
24 listItem:1,//轮播数-总页数 23 listItem:1,//轮播数-总页数
25 pageSize:5,//每页显示5条数据 24 pageSize:5,//每页显示5条数据
@@ -196,7 +196,7 @@ export default { @@ -196,7 +196,7 @@ export default {
196 }, 196 },
197 {//被攻击点 197 {//被攻击点
198 // type: 'scatter', 198 // type: 'scatter',
199 - type:'effectScatter', 199 + type:'effectScatter',//涟漪状态
200 hoverAnimation:true,//鼠标移入是否显示动画 200 hoverAnimation:true,//鼠标移入是否显示动画
201 coordinateSystem: 'geo', 201 coordinateSystem: 'geo',
202 zlevel: 3, 202 zlevel: 3,
@@ -206,7 +206,8 @@ export default { @@ -206,7 +206,8 @@ export default {
206 brushType: 'fill', 206 brushType: 'fill',
207 scale: 2 207 scale: 2
208 }, 208 },
209 - symbol: 'circle', 209 + // symbol: 'circle',//圆形涟漪状态
  210 + symbol: 'pin',
210 symbolSize: 30, 211 symbolSize: 30,
211 itemStyle:{ 212 itemStyle:{
212 color:'#EE4237', 213 color:'#EE4237',
@@ -46,20 +46,18 @@ export default { @@ -46,20 +46,18 @@ export default {
46 }); 46 });
47 // 半透明的颜色值 47 // 半透明的颜色值
48 const colorArr1 = [ 48 const colorArr1 = [
49 - 'rgba(151,213,244, 0.8)',  
50 - 'rgba(239,224,167, 0.8)',  
51 - 'rgba(44, 110, 255, 0.8)',  
52 - 'rgba(151,170,255, 0.8)' 49 + 'rgba(255,0,255, 0.8)',
  50 + 'rgba(23,212,152, 0.8)',
  51 + 'rgba(253,152,58, 0.8)',
  52 + 'rgba(255,113,66, 0.8)'
53 ] 53 ]
54 // 全透明的颜色值 54 // 全透明的颜色值
55 const colorArr2 = [ 55 const colorArr2 = [
56 - 'rgba(151,213,244, 0)',  
57 - 'rgba(239,224,167, 0)',  
58 - 'rgba(44, 110, 255, 0)',  
59 - 'rgba(151,170,255, 0)' 56 + 'rgba(255,0,255, 0)',
  57 + 'rgba(23,212,152, 0)',
  58 + 'rgba(253,152,58, 0)',
  59 + 'rgba(255,113,66, 0)'
60 ] 60 ]
61 -  
62 -  
63 // 挂载完 61 // 挂载完
64 Vue.onMounted(() => { 62 Vue.onMounted(() => {
65 proxy.getData(); 63 proxy.getData();