Skip to content

I
IT-monitor
Commit 51a5843e authored by 张伯涛's avatar 张伯涛
Browse files
Options

添加设备，加数据

parent aa306577
Hide whitespace changes
Inline Side-by-side
Showing with 344 additions and 31 deletions
src/views/IntegratedMonitor/addEquipment.vue
View file @ 51a5843e
......@@ -17,6 +17,51 @@
</div>
</el-card>
</div>
<div class="equipmentBody">Linux 服务器</div>
<div v-for="(item, index) in firstListLinux" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">IBM 服务器</div>
<div v-for="(item, index) in firstListIBM" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">HP UX 服务器</div>
<div v-for="(item, index) in firstListHP" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">FreeBSD 服务器</div>
<div v-for="(item, index) in firstListFree" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">SCO UNIX 服务器</div>
<div v-for="(item, index) in firstListSCO" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="应用和业务" name="second">
<el-form inline label-width="auto" label-position="right">
......@@ -33,6 +78,24 @@
</div>
</el-card>
</div>
<div class="equipmentBody">Web应用</div>
<div v-for="(item, index) in secondListWeb" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">中间商</div>
<div v-for="(item, index) in secondListMiddle" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="网络设备" name="third">
<el-form inline label-width="auto" label-position="right">
......@@ -49,8 +112,26 @@
</div>
</el-card>
</div>
<div class="equipmentBody">设备厂商：浪潮</div>
<div v-for="(item, index) in thirdListWave" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">设备厂商：H3C</div>
<div v-for="(item, index) in thirdListH3C" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="存储设备" name="fourth">
<el-tab-pane label="安全设备" name="fourth">
<el-form inline label-width="auto" label-position="right">
<el-form-item class="headSearch" label=" ">
<el-input v-model.trim="serchForm.CONNAMECN" suffix-icon="el-icon-search" class="searchInput" clearable placeholder="请输入关键字" />
......@@ -65,6 +146,24 @@
</div>
</el-card>
</div>
<div class="equipmentBody">上网行为管理</div>
<div v-for="(item, index) in fourthListSurf" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">Web应用防护系统</div>
<div v-for="(item, index) in fourthListWeb" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="虚拟机监测" name="fifth">
<el-form inline label-width="auto" label-position="right">
......@@ -72,7 +171,7 @@
<el-input v-model.trim="serchForm.CONNAMECN" suffix-icon="el-icon-search" class="searchInput" clearable placeholder="请输入关键字" />
</el-form-item>
</el-form>
<div class="equipmentBody">HP</div>
<div class="equipmentBody">VMware服务器</div>
<div v-for="(item, index) in fifthList" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
......@@ -81,6 +180,33 @@
</div>
</el-card>
</div>
<div class="equipmentBody">Microsoft</div>
<div v-for="(item, index) in fifthListMic" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">Xen</div>
<div v-for="(item, index) in fifthListXen" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">IBM HMC</div>
<div v-for="(item, index) in fifthListIBM" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="物联网" name="sixth">
<el-form inline label-width="auto" label-position="right">
......@@ -88,7 +214,7 @@
<el-input v-model.trim="serchForm.CONNAMECN" suffix-icon="el-icon-search" class="searchInput" clearable placeholder="请输入关键字" />
</el-form-item>
</el-form>
<div class="equipmentBody">VMware服务器</div>
<div class="equipmentBody">设备厂商：科士达</div>
<div v-for="(item, index) in sixthList" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
......@@ -97,8 +223,35 @@
</div>
</el-card>
</div>
<div class="equipmentBody">设备厂商：CSTC</div>
<div v-for="(item, index) in sixthListCSTC" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">设备厂商：通用</div>
<div v-for="(item, index) in sixthListCurrency" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">设备厂商：APC</div>
<div v-for="(item, index) in sixthListAPC" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="UPS" name="seventh">
<el-tab-pane label="其他" name="seventh">
<el-form inline label-width="auto" label-position="right">
<el-form-item class="headSearch" label=" ">
<el-input v-model.trim="serchForm.CONNAMECN" suffix-icon="el-icon-search" class="searchInput" clearable placeholder="请输入关键字" />
......@@ -113,6 +266,33 @@
</div>
</el-card>
</div>
<div class="equipmentBody">被动式设备</div>
<div v-for="(item, index) in sevenListPassive" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">自定义</div>
<div v-for="(item, index) in sevenListCustom" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
<div class="equipmentBody">天楚云x-sky</div>
<div v-for="(item, index) in sevenListSky" :key="index" class="equipmentList">
<el-card class="box-card" @click.native="addEquipmentForm">
<div style="display: flex">
<img :src="item.img">
<div style="line-height: 30px;padding-left: 10px">{{ item.name }}</div>
</div>
</el-card>
</div>
</el-tab-pane>
</el-tabs>
</div>
......@@ -188,41 +368,174 @@ export default {
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' }
],
firstListLinux: [
{ img: require('@/assets/image/26linux_1.png'), name: 'Agent Linux' },
{ img: require('@/assets/image/26linux_1.png'), name: 'SSH Linux' },
{ img: require('@/assets/image/26linux_1.png'), name: 'Telnet Linux' },
{ img: require('@/assets/image/26linux_1.png'), name: 'Snmp Linux' }
],
firstListIBM: [
{ img: require('@/assets/image/img_6.png'), name: 'SSH IBM AIX' },
{ img: require('@/assets/image/img_6.png'), name: 'Telnet IBM AIX' },
{ img: require('@/assets/image/img_6.png'), name: 'Snmp IBM AIX' }
],
firstListHP: [
{ img: require('@/assets/image/img_7.png'), name: 'SSH HP UX' },
{ img: require('@/assets/image/img_7.png'), name: 'Telnet HP UX' },
{ img: require('@/assets/image/img_7.png'), name: 'Snmp HP UX' }
],
firstListFree: [
{ img: require('@/assets/image/img_8.png'), name: 'SSH FreeBSD' },
{ img: require('@/assets/image/img_8.png'), name: 'Telnet FreeBSD' },
{ img: require('@/assets/image/img_8.png'), name: 'Snmp FreeBSD' }
],
firstListSCO: [
{ img: require('@/assets/image/img_9.png'), name: 'SSH SCO UNIX' },
{ img: require('@/assets/image/img_9.png'), name: 'Telnet SCO UNIX' },
{ img: require('@/assets/image/img_9.png'), name: 'Snmp SCO UNIX' }
],
secondList: [
{ img: require('@/assets/image/img_1.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_1.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_1.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_1.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img.png'), name: 'SQL Server 2008' },
{ img: require('@/assets/image/img.png'), name: 'SQL Server' },
{ img: require('@/assets/image/img_6.png'), name: 'DB2' },
{ img: require('@/assets/image/img_6.png'), name: 'DB2_linux' },
{ img: require('@/assets/image/img_8.png'), name: 'Oracle' },
{ img: require('@/assets/image/img_8.png'), name: 'Oracle RAC' },
{ img: require('@/assets/image/img_8.png'), name: 'ODBC Oracle' },
{ img: require('@/assets/image/img_1.png'), name: 'Postgresql 9.x' },
{ img: require('@/assets/image/img_1.png'), name: 'Postgresql 8.x 9.0.x' },
{ img: require('@/assets/image/img_10.png'), name: 'SyBase' },
{ img: require('@/assets/image/img_10.png'), name: 'Sybase_New' },
{ img: require('@/assets/image/img_10.png'), name: '人大金仓' },
{ img: require('@/assets/image/img_10.png'), name: '人大金仓(v8)' }
],
secondListWeb: [
{ img: require('@/assets/image/img_11.png'), name: 'URL' },
{ img: require('@/assets/image/img_11.png'), name: 'Url Transaction' },
{ img: require('@/assets/image/img_11.png'), name: 'DNS' }
],
secondListMiddle: [
{ img: require('@/assets/image/img_12.png'), name: '金蝶' },
{ img: require('@/assets/image/img_6.png'), name: 'WebSphere' },
{ img: require('@/assets/image/img_6.png'), name: 'WebSphere' },
{ img: require('@/assets/image/img_13.png'), name: 'JBoss 4.x' },
{ img: require('@/assets/image/img_13.png'), name: 'JBoss 4.0.x 5.x' },
{ img: require('@/assets/image/img_13.png'), name: 'JBoss 6.x' },
{ img: require('@/assets/image/img_13.png'), name: 'JBoss 7.1.x' },
{ img: require('@/assets/image/img_8.png'), name: 'WebLogic 8.x' },
{ img: require('@/assets/image/img_8.png'), name: 'WebLogic 9.x 10.x' },
{ img: require('@/assets/image/img_8.png'), name: 'weblogic 11' },
{ img: require('@/assets/image/img_14.png'), name: 'Tomcat JMX' }
],
thirdList: [
{ img: require('@/assets/image/img_2.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_2.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_2.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_2.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS12800系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS8900系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS6600系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS5820系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS5800系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS4320系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS4300系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS3320系列' },
{ img: require('@/assets/image/img_2.png'), name: 'MyPower NSS3300系列' }
],
thirdListWave: [
{ img: require('@/assets/image/img_15.png'), name: '浪潮S5350|s6350' },
{ img: require('@/assets/image/img_15.png'), name: 'S5560系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'S5960系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'S6550系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'S6650系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'S6650L系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'S6850系列(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: 'IAC6000系列' },
{ img: require('@/assets/image/img_15.png'), name: 'CN60000(交换机)' },
{ img: require('@/assets/image/img_15.png'), name: '浪潮堆叠交换机' }
],
thirdListH3C: [
{ img: require('@/assets/image/img_16.png'), name: 'WX5510E' },
{ img: require('@/assets/image/img_16.png'), name: 'H3C' },
{ img: require('@/assets/image/img_16.png'), name: 'H3C无线AC' }
],
fourthList: [
{ img: require('@/assets/image/img_3.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_3.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_3.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_3.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img_17.png'), name: 'Pix' },
{ img: require('@/assets/image/img_17.png'), name: 'Tos3.3.002' },
{ img: require('@/assets/image/img_17.png'), name: 'TOSV3.2073N' },
{ img: require('@/assets/image/img_17.png'), name: 'Tosvi3.3.005' },
{ img: require('@/assets/image/img_18.png'), name: '联想网御' },
{ img: require('@/assets/image/img_18.png'), name: '联想网御' },
{ img: require('@/assets/image/img_3.png'), name: '启明星辰' },
{ img: require('@/assets/image/img_3.png'), name: '14600' },
{ img: require('@/assets/image/img_3.png'), name: '启明星辰' },
{ img: require('@/assets/image/img_3.png'), name: '天玥设备' },
{ img: require('@/assets/image/img_3.png'), name: '启明星辰WAG' }
],
fourthListSurf: [
{ img: require('@/assets/image/img_19.png'), name: '迪普UAG3000' },
{ img: require('@/assets/image/img_20.png'), name: '深信服上网行为' },
{ img: require('@/assets/image/img_20.png'), name: '深信服AC6.1设备' },
{ img: require('@/assets/image/img_21.png'), name: '锐捷UAC3.2.30' },
{ img: require('@/assets/image/img_21.png'), name: '锐捷RG上网行为管理' },
{ img: require('@/assets/image/img_21.png'), name: '锐捷行为管理' },
{ img: require('@/assets/image/img_21.png'), name: 'Uac 6000-e50' }
],
fourthListWeb: [
{ img: require('@/assets/image/img_22.png'), name: '华为（waf系列）' },
{ img: require('@/assets/image/img_23.png'), name: '安恒-WAF-150AG' },
{ img: require('@/assets/image/img_24.png'), name: '360（waf系列）' },
{ img: require('@/assets/image/img_25.png'), name: '天融信堡垒机器(yzh)' },
{ img: require('@/assets/image/img_25.png'), name: '天融信waf(yzh)' },
{ img: require('@/assets/image/img_25.png'), name: '天融信堡垒机器' },
],
fifthList: [
{ img: require('@/assets/image/img_4.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_4.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_4.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_4.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img_4.png'), name: 'ESX Server' },
{ img: require('@/assets/image/img_4.png'), name: ' 硬件监控' },
{ img: require('@/assets/image/img_4.png'), name: 'vCenter Server' },
{ img: require('@/assets/image/img_4.png'), name: 'ESXI Server' },
{ img: require('@/assets/image/img_4.png'), name: 'VMware(定制)' }
],
fifthListMic: [
{ img: require('@/assets/image/img.png'), name: ' Hyper-V' }
],
fifthListXen: [
{ img: require('@/assets/image/img_26.png'), name: ' Xen Server' }
],
fifthListIBM: [
{ img: require('@/assets/image/img_6.png'), name: 'IBM HMC' },
{ img: require('@/assets/image/img_6.png'), name: 'IBM HMC API' }
],
sixthList: [
{ img: require('@/assets/image/img_5.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_5.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_5.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img_5.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img_5.png'), name: '科士达UPS(YMK33)' },
{ img: require('@/assets/image/img_5.png'), name: '科士达 EP20 UPS' },
{ img: require('@/assets/image/img_5.png'), name: '科士达 EP20 UPS' }
],
sixthListCSTC: [
{ img: require('@/assets/image/img_5.png'), name: 'CSTC-UPS' }
],
sixthListCurrency: [
{ img: require('@/assets/image/img_5.png'), name: 'UPS' }
],
sixthListAPC: [
{ img: require('@/assets/image/img_5.png'), name: 'APC(APC)' },
{ img: require('@/assets/image/img_5.png'), name: 'APC(2200 RM)UPS' },
{ img: require('@/assets/image/img_5.png'), name: 'APC(GALAXY)UPS' }
],
sevenList: [
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' },
{ img: require('@/assets/image/img.png'), name: 'Agent Windows' }
{ img: require('@/assets/image/img_27.png'), name: 'Ping' },
{ img: require('@/assets/image/img_28.png'), name: 'Port' }
],
sevenListPassive: [
{ img: require('@/assets/image/img_29.png'), name: '被动式设备监测' }
],
sevenListCustom: [
{ img: require('@/assets/image/img_30.png'), name: 'Xml自定义监测' },
{ img: require('@/assets/image/img_30.png'), name: '对监测点的统计运算' }
],
sevenListSky: [
{ img: require('@/assets/image/img_31.png'), name: 'x-sky存储池' },
{ img: require('@/assets/image/img_31.png'), name: 'x-sky服务器' },
{ img: require('@/assets/image/img_31.png'), name: 'x-sky硬盘' },
{ img: require('@/assets/image/img_31.png'), name: 'x-sky缓存分区' },
{ img: require('@/assets/image/img_31.png'), name: 'x-sky块存储卷' }
],
serchForm: {
CONNAMECN: ''
......
src/views/overView/dashboard/equipment.vue
View file @ 51a5843e
......@@ -117,7 +117,7 @@
<el-card class="box-card">
<div style="display: flex;margin-top: 10px">
<el-divider direction="vertical" />
<div class="cardTitle">故障统计折线图</div>2
<div class="cardTitle">故障统计折线图</div>
</div>
<el-row style="margin-top: 20px">
<div id="echarts-enterFirst" class="span_1">
......@@ -380,7 +380,7 @@ export default {
grid: {
top: '3%',
left: '3%',
right: '4%',
right: '8%',
containLabel: true
},
xAxis: {
......@@ -458,7 +458,7 @@ export default {
grid: {
top: '3%',
left: '3%',
right: '4%',
right: '8%',
containLabel: true
},
xAxis: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment