Skip to content

I
IT-monitor
Commit fcaf8ba2 authored by 11528's avatar 11528
Browse files
Options

样式修改

parent 68a34490
Hide whitespace changes
Inline Side-by-side
Showing with 284 additions and 72 deletions
src/views/IntegratedMonitor/reportStatistics/networkEquipment.vue
View file @ fcaf8ba2
...@@ -25,7 +25,9 @@ ...@@ -25,7 +25,9 @@
> >
<el-table-column :show-overflow-tooltip="true" label="设备名称" align="center" prop="equipmentName"> <el-table-column :show-overflow-tooltip="true" label="设备名称" align="center" prop="equipmentName">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.equipmentName || '-' }} <img v-if="scope.row.noIcon === '1'" :src="scope.row.icon" class="name-icon">
<img v-if="scope.row.noIcon === '2'" :src="scope.row.icon" class="name-icon">
<span>{{ scope.row.equipmentName }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :show-overflow-tooltip="true" label="可用性" align="center" prop="usability"> <el-table-column :show-overflow-tooltip="true" label="可用性" align="center" prop="usability">
...@@ -89,7 +91,9 @@ ...@@ -89,7 +91,9 @@
> >
<el-table-column :show-overflow-tooltip="true" label="设备名称" align="center" prop="equipmentName"> <el-table-column :show-overflow-tooltip="true" label="设备名称" align="center" prop="equipmentName">
<template slot-scope="scope"> <template slot-scope="scope">
<span @click="belongLayer(scope.$index,scope.row), dialogVisible=true">{{ scope.row.equipmentName || '-' }}</span> <img v-if="scope.row.noIcon === '1'" :src="scope.row.icon" class="name-icon">
<img v-if="scope.row.noIcon === '2'" :src="scope.row.icon" class="name-icon">
<span>{{ scope.row.equipmentName }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :show-overflow-tooltip="true" label="接口名称" align="center" prop="interfaceName"> <el-table-column :show-overflow-tooltip="true" label="接口名称" align="center" prop="interfaceName">
...@@ -191,7 +195,14 @@ ...@@ -191,7 +195,14 @@
:default-expanded-keys="[2, 3]" :default-expanded-keys="[2, 3]"
:default-checked-keys="[5]" :default-checked-keys="[5]"
:props="defaultProps" :props="defaultProps"
/> >
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -253,7 +264,9 @@ export default { ...@@ -253,7 +264,9 @@ export default {
dialogVisible: false, dialogVisible: false,
data: [ data: [
{ {
equipmentName: '人脸验证服务器', equipmentName: '130网段虚拟设备',
noIcon: '1',
icon: require('@/assets/image/shebei.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -264,7 +277,9 @@ export default { ...@@ -264,7 +277,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: 'F5负载均衡',
noIcon: '1',
icon: require('@/assets/image/shebei1-weizhi.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -275,7 +290,9 @@ export default { ...@@ -275,7 +290,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '光环新网',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '2', usability: '2',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -286,7 +303,9 @@ export default { ...@@ -286,7 +303,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '核心交换机',
noIcon: '1',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '2', usability: '2',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -297,7 +316,9 @@ export default { ...@@ -297,7 +316,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '电信出口',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -308,8 +329,10 @@ export default { ...@@ -308,8 +329,10 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '联通出口',
usability: '1', noIcon: '1',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '2',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
shake: '1.25', shake: '1.25',
...@@ -319,7 +342,9 @@ export default { ...@@ -319,7 +342,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '移动出口',
noIcon: '1',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -330,8 +355,10 @@ export default { ...@@ -330,8 +355,10 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '防火墙',
usability: '1', noIcon: '1',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '2',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
shake: '1.25', shake: '1.25',
...@@ -341,7 +368,9 @@ export default { ...@@ -341,7 +368,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '虚拟设备',
noIcon: '1',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -352,7 +381,9 @@ export default { ...@@ -352,7 +381,9 @@ export default {
todayAlarm: '0' todayAlarm: '0'
}, },
{ {
equipmentName: '人脸验证服务器', equipmentName: '10.4.5.6',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
usability: '1', usability: '1',
serverSuccessRate: '100', serverSuccessRate: '100',
averageResponseTime: '0.8', averageResponseTime: '0.8',
...@@ -366,6 +397,8 @@ export default { ...@@ -366,6 +397,8 @@ export default {
initialData: [ initialData: [
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -384,6 +417,8 @@ export default { ...@@ -384,6 +417,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -402,6 +437,8 @@ export default { ...@@ -402,6 +437,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -420,6 +457,8 @@ export default { ...@@ -420,6 +457,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '2', managementStatus: '2',
...@@ -438,6 +477,8 @@ export default { ...@@ -438,6 +477,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '2', managementStatus: '2',
...@@ -456,6 +497,8 @@ export default { ...@@ -456,6 +497,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -474,6 +517,8 @@ export default { ...@@ -474,6 +517,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -492,6 +537,8 @@ export default { ...@@ -492,6 +537,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -510,6 +557,8 @@ export default { ...@@ -510,6 +557,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -528,6 +577,8 @@ export default { ...@@ -528,6 +577,8 @@ export default {
}, },
{ {
equipmentName: '核心交换机', equipmentName: '核心交换机',
noIcon: '2',
icon: require('@/assets/image/shebei1-zhengchang.png'),
interfaceName: 'Port-channel1', interfaceName: 'Port-channel1',
operationStatus: '1', operationStatus: '1',
managementStatus: '1', managementStatus: '1',
...@@ -547,35 +598,44 @@ export default { ...@@ -547,35 +598,44 @@ export default {
], ],
treeData: [{ treeData: [{
id: 1, id: 1,
label: '本机容器', label: '本机容器', icon: require('@/assets/image/shebei.png'),
children: [{ children: [{
id: 4, id: 4,
label: '虚拟化平台', label: '虚拟化平台',
icon: require('@/assets/image/shebei9-guzhang.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '127.0.0.1' label: '127.0.0.1'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.1.1' label: '192.168.1.1'
}] }]
}, { }, {
id: 5, id: 5,
label: '虚拟设备', label: '虚拟设备',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.5.4' label: '192.168.5.4'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.44.2' label: '192.168.44.2'
}] }]
}, { }, {
id: 6, id: 6,
label: '服务器硬件', label: '服务器硬件',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
label: '打印机' label: '打印机',
icon: require('@/assets/image/shebei2-zhengchang.png')
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.2.5' label: '192.168.2.5'
}] }]
}] }]
...@@ -755,6 +815,12 @@ export default { ...@@ -755,6 +815,12 @@ export default {
height: 9px; height: 9px;
display: inline-block; display: inline-block;
} }
.name-icon{
width: 20px;
height: 20px;
position: relative;
top: 5px;
}
} }
} }
.addGroup{ .addGroup{
...@@ -767,5 +833,9 @@ export default { ...@@ -767,5 +833,9 @@ export default {
border-radius: 4px; border-radius: 4px;
} }
} }
.treeIcon{
width: 17px;
height: 17px;
}
</style> </style>
src/views/IntegratedMonitor/reportStatistics/theServer.vue
View file @ fcaf8ba2
...@@ -20,7 +20,16 @@ ...@@ -20,7 +20,16 @@
:data="tableData" :data="tableData"
border border
> >
<el-table-column label="服务器名称" prop="serverName" show-overflow-tooltip /> <el-table-column label="服务器名称" prop="serverName" show-overflow-tooltip>
<template slot-scope="scope">
<img v-if="scope.row.noIcon === '1'" :src="scope.row.icon" class="name-icon">
<img v-if="scope.row.noIcon === '2'" :src="scope.row.icon" class="name-icon">
<!-- <span v-if="scope.row.noIcon === '1'" class="square-green" />-->
<!-- <span v-if="scope.row.noIcon !== '1'" class="square-yellow" />-->
<span>{{ scope.row.serverName }}</span>
</template>
</el-table-column>
<el-table-column label="可用性" prop="available" show-overflow-tooltip> <el-table-column label="可用性" prop="available" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.available === '可用'" class="st-square" style="background-color: #3db58d;" /> <span v-if="scope.row.available === '可用'" class="st-square" style="background-color: #3db58d;" />
...@@ -53,7 +62,14 @@ ...@@ -53,7 +62,14 @@
:default-expanded-keys="[2, 3]" :default-expanded-keys="[2, 3]"
:default-checked-keys="[5]" :default-checked-keys="[5]"
:props="defaultProps" :props="defaultProps"
/> >
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -79,7 +95,14 @@ ...@@ -79,7 +95,14 @@
:default-expanded-keys="[2, 3]" :default-expanded-keys="[2, 3]"
:default-checked-keys="[5]" :default-checked-keys="[5]"
:props="defaultProps" :props="defaultProps"
/> >
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -117,46 +140,54 @@ ...@@ -117,46 +140,54 @@
</template> </template>
<script> <script>
import screenfull from 'screenfull' import Template from '@/views/instance/Template'
import Template from "@/views/instance/Template";
export default { export default {
name: 'TheServer', name: 'TheServer',
components: {Template}, components: { Template },
data() { data() {
return { return {
fullscreen: false, fullscreen: false,
data: [{ data: [{
id: 1, id: 1,
label: '本机容器', label: '本机容器', icon: require('@/assets/image/shebei.png'),
children: [{ children: [{
id: 4, id: 4,
label: '虚拟化平台', label: '虚拟化平台',
icon: require('@/assets/image/shebei9-guzhang.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '127.0.0.1' label: '127.0.0.1'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.1.1' label: '192.168.1.1'
}] }]
}, { }, {
id: 5, id: 5,
label: '虚拟设备', label: '虚拟设备',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.5.4' label: '192.168.5.4'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.44.2' label: '192.168.44.2'
}] }]
}, { }, {
id: 6, id: 6,
label: '服务器硬件', label: '服务器硬件',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
label: '打印机' label: '打印机',
icon: require('@/assets/image/shebei2-zhengchang.png')
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.2.5' label: '192.168.2.5'
}] }]
}] }]
...@@ -194,16 +225,16 @@ export default { ...@@ -194,16 +225,16 @@ export default {
logContent: '' logContent: ''
}, },
tableData: [ tableData: [
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '192.168.5.6', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '人脸识别服务器', noIcon: '2', icon: require('@/assets/image/shebei2-guzhang.png'), available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '云打印服务器-硬件', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '智盘服务器10.1.1.50', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '不可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '停车服务器', noIcon: '2', icon: require('@/assets/image/shebei2-guzhang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '智盘服务器-10.1.1.54', noIcon: '2', icon: require('@/assets/image/shebei2-guzhang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '短信平台', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '指纹识别服务器', noIcon: '2', icon: require('@/assets/image/shebei2-guzhang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }, { serverName: '打印机', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' },
{ serverName: '人脸识别服务器', available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' } { serverName: '设备服务器', noIcon: '1', icon: require('@/assets/image/shebei2-zhengchang.png'), available: '可用', correspondingTime: '0', cpu: '4', physicalMemory: '70.2', virtualMemory: '0', diskMax: '6', diskUsageMax: '80', todayAlarm: '0' }
] ]
} }
}, },
...@@ -334,6 +365,10 @@ export default { ...@@ -334,6 +365,10 @@ export default {
} }
} }
} }
.treeIcon{
width: 17px;
height: 17px;
}
.warnBody{ .warnBody{
padding: 10px 10px 0 10px; padding: 10px 10px 0 10px;
.st-square{ .st-square{
...@@ -343,6 +378,26 @@ export default { ...@@ -343,6 +378,26 @@ export default {
height: 9px; height: 9px;
display: inline-block; display: inline-block;
} }
.name-icon{
width: 20px;
height: 20px;
position: relative;
top: 5px;
}
.square-green{
background-color: #3db58d;
margin-right: 6px;
width: 9px;
height: 9px;
display: inline-block;
}
.square-yellow{
background-color: #edb845;
margin-right: 6px;
width: 9px;
height: 9px;
display: inline-block;
}
} }
} }
.addGroup{ .addGroup{
......
src/views/assetManagement/assetMaintenance/index.vue
View file @ fcaf8ba2
...@@ -166,7 +166,14 @@ ...@@ -166,7 +166,14 @@
:data="treeData" :data="treeData"
:props="defaultProps" :props="defaultProps"
@node-click="handleNodeClick" @node-click="handleNodeClick"
/> >
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div> </div>
</el-tabs> </el-tabs>
</el-col> </el-col>
...@@ -287,29 +294,36 @@ export default { ...@@ -287,29 +294,36 @@ export default {
treeData: [ treeData: [
{ {
id: 1, id: 1,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '服务器' label: '服务器'
}, },
{ {
id: 2, id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '网络' label: '网络'
}, },
{ {
id: 3, id: 3,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机', label: '摄像机',
children: [{ children: [{
id: 4, id: 4,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '物联', label: '物联',
children: [{ children: [{
id: 5, id: 5,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '电表' label: '电表'
}, { }, {
id: 6, id: 6,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机3' label: '摄像机3'
}] }]
}] }]
}, },
{ {
id: 2, id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: 'dvr' label: 'dvr'
} }
], ],
...@@ -804,6 +818,10 @@ export default { ...@@ -804,6 +818,10 @@ export default {
color: #333333; color: #333333;
} }
} }
.treeIcon{
width: 17px;
height: 17px;
}
.mouse { .mouse {
cursor: pointer; cursor: pointer;
} }
......
src/views/assetManagement/informationChange/index.vue
View file @ fcaf8ba2
...@@ -290,8 +290,14 @@ ...@@ -290,8 +290,14 @@
:data="treeData" :data="treeData"
:props="defaultProps" :props="defaultProps"
@node-click="handleNodeClick" @node-click="handleNodeClick"
/> >
</div> <template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree></div>
</el-tabs> </el-tabs>
</el-col> </el-col>
<el-col :span="17"> <el-col :span="17">
...@@ -435,29 +441,36 @@ export default { ...@@ -435,29 +441,36 @@ export default {
treeData: [ treeData: [
{ {
id: 1, id: 1,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '服务器' label: '服务器'
}, },
{ {
id: 2, id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '网络' label: '网络'
}, },
{ {
id: 3, id: 3,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机', label: '摄像机',
children: [{ children: [{
id: 4, id: 4,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '物联', label: '物联',
children: [{ children: [{
id: 5, id: 5,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '电表' label: '电表'
}, { }, {
id: 6, id: 6,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机3' label: '摄像机3'
}] }]
}] }]
}, },
{ {
id: 2, id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: 'dvr' label: 'dvr'
} }
], ],
...@@ -895,6 +908,10 @@ export default { ...@@ -895,6 +908,10 @@ export default {
height: 14px!important; height: 14px!important;
background-color: #F1F1F1!important; background-color: #F1F1F1!important;
} }
.treeIcon{
width: 17px;
height: 17px;
}
.warnHead{ .warnHead{
height: 58px; height: 58px;
padding: 15px 20px 10px 20px; padding: 15px 20px 10px 20px;
......
src/views/patrolManagement/patrolInspectionPlan.vue
View file @ fcaf8ba2
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
<el-link type="primary" @click="report">报告</el-link> <el-link type="primary" @click="report">报告</el-link>
<el-link type="primary" @click="handleUpdate">编辑</el-link> <el-link type="primary" @click="handleUpdate">编辑</el-link>
<el-tooltip effect="light" placement="bottom" popper-class="moreTip"> <el-tooltip effect="light" placement="bottom" popper-class="moreTip">
<div slot="content" class="tooltipText" @click="deleteRow">删除</div> <div slot="content" class="tooltipText" @click="deleteRow">删除</div>
<div slot="content" class="tooltipText" @click="addWarn">复制</div> <div slot="content" class="tooltipText" @click="addWarn">复制</div>
<div slot="content" class="tooltipText" @click="enable">启用</div> <div slot="content" class="tooltipText" @click="enable">启用</div>
<el-link>... <el-link>...
...@@ -191,7 +191,14 @@ ...@@ -191,7 +191,14 @@
:default-expanded-keys="[2, 3]" :default-expanded-keys="[2, 3]"
:default-checked-keys="[5]" :default-checked-keys="[5]"
:props="defaultProps" :props="defaultProps"
/> >
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="报告生成发送邮箱:"> <el-form-item label="报告生成发送邮箱:">
...@@ -286,35 +293,44 @@ export default { ...@@ -286,35 +293,44 @@ export default {
fullscreen: false, fullscreen: false,
data: [{ data: [{
id: 1, id: 1,
label: '本机容器', label: '本机容器', icon: require('@/assets/image/shebei.png'),
children: [{ children: [{
id: 4, id: 4,
label: '虚拟化平台', label: '虚拟化平台',
icon: require('@/assets/image/shebei9-guzhang.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '127.0.0.1' label: '127.0.0.1'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.1.1' label: '192.168.1.1'
}] }]
}, { }, {
id: 5, id: 5,
label: '虚拟设备', label: '虚拟设备',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.5.4' label: '192.168.5.4'
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.44.2' label: '192.168.44.2'
}] }]
}, { }, {
id: 6, id: 6,
label: '服务器硬件', label: '服务器硬件',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{ children: [{
id: 9, id: 9,
label: '打印机' label: '打印机',
icon: require('@/assets/image/shebei2-zhengchang.png')
}, { }, {
id: 10, id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.2.5' label: '192.168.2.5'
}] }]
}] }]
...@@ -450,25 +466,25 @@ export default { ...@@ -450,25 +466,25 @@ export default {
label: 'label' label: 'label'
}, },
tableData: [ tableData: [
{ patrolInspectionTitle: 'test', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'test', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'test1', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'test1', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'test2', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'test2', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'test3', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'test3', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'smoking ', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'smoking ', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'eating', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'eating', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'formatter', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'formatter', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'sss', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'sss', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'ddd', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'ddd', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }, sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' },
{ patrolInspectionTitle: 'fff', patrolStatus: '1', inspector: '管理员', patrolInspectionCycle: '每日', { patrolInspectionTitle: 'fff', patrolStatus: '启用', inspector: '管理员', patrolInspectionCycle: '每日',
sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' } sendingMethod: '自动', reportsNumber: '1', latestTime: '2022-05-08 10:22:33', NextTime: '2022-05-09 10:22:33', describe: '无' }
] ]
} }
...@@ -721,6 +737,10 @@ export default { ...@@ -721,6 +737,10 @@ export default {
} }
} }
} }
.treeIcon{
width: 17px;
height: 17px;
}
.warnBody{ .warnBody{
padding: 10px 10px 0 10px; padding: 10px 10px 0 10px;
.st-square{ .st-square{
...@@ -730,6 +750,7 @@ export default { ...@@ -730,6 +750,7 @@ export default {
height: 9px; height: 9px;
display: inline-block; display: inline-block;
} }
} }
.caretDown{ .caretDown{
display: inline-block; display: inline-block;
......
src/views/patrolManagement/patrolInspectionReport.vue
View file @ fcaf8ba2
...@@ -104,8 +104,9 @@ ...@@ -104,8 +104,9 @@
<el-table-column label="巡检结果" prop="sendingMethod" show-overflow-tooltip /> <el-table-column label="巡检结果" prop="sendingMethod" show-overflow-tooltip />
<el-table-column label="报告发送状态" prop="reportsNumber" align="center" show-overflow-tooltip> <el-table-column label="报告发送状态" prop="reportsNumber" align="center" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.reportsNumber === '失败'" class="st-square" style="background-color: #C03639;text-align: center">{{ scope.row.reportsNumber }}</span> <span v-if="scope.row.reportsNumber === '失败'" class="st-square" style="background-color: #C03639;text-align: center"></span>
<span v-if="scope.row.reportsNumber === '成功'" class="st-square" style="background-color: #30B08F;text-align: center">{{ scope.row.reportsNumber }}</span> <span v-if="scope.row.reportsNumber === '成功'" class="st-square" style="background-color: #30B08F;text-align: center"></span>
<span>{{ scope.row.reportsNumber }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="报告发送时间" prop="latestTime" show-overflow-tooltip /> <el-table-column label="报告发送时间" prop="latestTime" show-overflow-tooltip />
......
src/views/workManagement/myMission.vue
View file @ fcaf8ba2
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
<el-form-item label="设备信息:"> <el-form-item label="设备信息:">
<div> <div>
<el-input v-model="addWarnForm.equipmentInformation" style="width: 50%" placeholder="请选择设备信息" :disabled="true" /> <el-input v-model="addWarnForm.equipmentInformation" style="width: 50%" placeholder="请选择设备信息" :disabled="true" />
<el-button @click="equipmentInformation"> 设备</el-button> <el-button @click="equipmentInformations"> 设备</el-button>
</div> </div>
<el-table <el-table
:data="equipmenData" :data="equipmenData"
...@@ -316,21 +316,44 @@ ...@@ -316,21 +316,44 @@
<el-button type="primary" @click="complete = false">取消</el-button> <el-button type="primary" @click="complete = false">取消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog :visible.sync="complete" title="设备信息" width="50%" :model="information"> <el-dialog :visible.sync="equipmentInformation" title="设备信息" width="50%" class="addGroup" :model="information">
<el-form label-width="100px"> <el-row>
<el-form-item label="是否解决"> <el-col :span="12" class="equipmentDiv">
<el-radio v-model="operation.isItSolved" :label="1">已解决</el-radio> <span>选择告警设备</span>
<el-radio v-model="operation.isItSolved" :label="2">未解决</el-radio> <el-form ref="addWarnForm" label-width="auto" :model="addWarnForm">
<el-radio v-model="operation.isItSolved" :label="3">不解决</el-radio> <el-form-item label="">
</el-form-item> <el-tree
<el-form-item label="备注说明"> :data="data"
<el-input v-model="operation.remarks" type="textarea" :rows="4" /> node-key="id"
</el-form-item> :default-expanded-keys="[2, 3]"
</el-form> :default-checked-keys="[5]"
:props="defaultProps"
@node-click="handleNodeClick"
>
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</el-form-item>
</el-form>
</el-col>
<el-col :span="12" class="equipmentDiv">
<span>选择检测点</span>
<el-table
:data="equipmenData"
border
>
<el-table-column type="selection" align="center" width="50px"/>
<el-table-column label="监测点名称" prop="number" show-overflow-tooltip />
</el-table>
</el-col>
</el-row>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="complete = false">提交</el-button> <el-button @click="equipmentInformation = false">提交</el-button>
<el-button type="primary" @click="complete = false">取消</el-button> <el-button type="primary" @click="equipmentInformation = false">取消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog class="addGroup" width="50%" title="高级查询" :visible.sync="advancedQueryDialog"> <el-dialog class="addGroup" width="50%" title="高级查询" :visible.sync="advancedQueryDialog">
...@@ -481,7 +504,9 @@ export default { ...@@ -481,7 +504,9 @@ export default {
}] }]
}], }],
stepActive: 1, stepActive: 1,
equipmenData: [], equipmenData: [
{ number: '/dev/sda1 (/boot)' }
],
updateWarnForm: { updateWarnForm: {
founder: '', founder: '',
theme: '', theme: '',
...@@ -525,6 +550,7 @@ export default { ...@@ -525,6 +550,7 @@ export default {
submit: false, submit: false,
hang: false, hang: false,
complete: false, complete: false,
equipmentInformation: false,
addDialog: false, addDialog: false,
updateDialog: false, updateDialog: false,
advancedQueryDialog: false, advancedQueryDialog: false,
...@@ -1032,8 +1058,8 @@ export default { ...@@ -1032,8 +1058,8 @@ export default {
/** /**
* 设备信息 * 设备信息
*/ */
equipmentInformation() { equipmentInformations() {
this.equipmentInformation = true
}, },
handleSelectAll(val) { handleSelectAll(val) {
this.name = [] this.name = []
...@@ -1235,5 +1261,9 @@ export default { ...@@ -1235,5 +1261,9 @@ export default {
width: 0; width: 0;
} }
} }
.treeIcon{
width: 17px;
height: 17px;
}
} }
</style> </style>
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