Commit fcaf8ba2 authored by 11528's avatar 11528

样式修改

parent 68a34490
......@@ -20,7 +20,16 @@
:data="tableData"
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>
<template slot-scope="scope">
<span v-if="scope.row.available === '可用'" class="st-square" style="background-color: #3db58d;" />
......@@ -53,7 +62,14 @@
:default-expanded-keys="[2, 3]"
:default-checked-keys="[5]"
:props="defaultProps"
/>
>
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div>
</el-form-item>
</el-form>
......@@ -79,7 +95,14 @@
:default-expanded-keys="[2, 3]"
:default-checked-keys="[5]"
:props="defaultProps"
/>
>
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div>
</el-form-item>
</el-form>
......@@ -117,46 +140,54 @@
</template>
<script>
import screenfull from 'screenfull'
import Template from "@/views/instance/Template";
import Template from '@/views/instance/Template'
export default {
name: 'TheServer',
components: {Template},
components: { Template },
data() {
return {
fullscreen: false,
data: [{
id: 1,
label: '本机容器',
label: '本机容器', icon: require('@/assets/image/shebei.png'),
children: [{
id: 4,
label: '虚拟化平台',
icon: require('@/assets/image/shebei9-guzhang.png'),
children: [{
id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '127.0.0.1'
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.1.1'
}]
}, {
id: 5,
label: '虚拟设备',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{
id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.5.4'
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.44.2'
}]
}, {
id: 6,
label: '服务器硬件',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{
id: 9,
label: '打印机'
label: '打印机',
icon: require('@/assets/image/shebei2-zhengchang.png')
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.2.5'
}]
}]
......@@ -194,16 +225,16 @@ export default {
logContent: ''
},
tableData: [
{ serverName: '人脸识别服务器', 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: '人脸识别服务器', 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: '人脸识别服务器', 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: '人脸识别服务器', 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: '人脸识别服务器', 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: '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: '人脸识别服务器', 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: '云打印服务器-硬件', 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: '智盘服务器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: '停车服务器', 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: '智盘服务器-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: '短信平台', 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: '指纹识别服务器', 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: '打印机', 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: '设备服务器', 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 {
}
}
}
.treeIcon{
width: 17px;
height: 17px;
}
.warnBody{
padding: 10px 10px 0 10px;
.st-square{
......@@ -343,6 +378,26 @@ export default {
height: 9px;
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{
......
......@@ -166,7 +166,14 @@
:data="treeData"
: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>
</div>
</el-tabs>
</el-col>
......@@ -287,29 +294,36 @@ export default {
treeData: [
{
id: 1,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '服务器'
},
{
id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '网络'
},
{
id: 3,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机',
children: [{
id: 4,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '物联',
children: [{
id: 5,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '电表'
}, {
id: 6,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机3'
}]
}]
},
{
id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: 'dvr'
}
],
......@@ -804,6 +818,10 @@ export default {
color: #333333;
}
}
.treeIcon{
width: 17px;
height: 17px;
}
.mouse {
cursor: pointer;
}
......
......@@ -290,8 +290,14 @@
:data="treeData"
:props="defaultProps"
@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-col>
<el-col :span="17">
......@@ -435,29 +441,36 @@ export default {
treeData: [
{
id: 1,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '服务器'
},
{
id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '网络'
},
{
id: 3,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机',
children: [{
id: 4,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '物联',
children: [{
id: 5,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '电表'
}, {
id: 6,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: '摄像机3'
}]
}]
},
{
id: 2,
icon: require('@/assets/image/shebei9-guzhang.png'),
label: 'dvr'
}
],
......@@ -895,6 +908,10 @@ export default {
height: 14px!important;
background-color: #F1F1F1!important;
}
.treeIcon{
width: 17px;
height: 17px;
}
.warnHead{
height: 58px;
padding: 15px 20px 10px 20px;
......
......@@ -57,7 +57,7 @@
<el-link type="primary" @click="report">报告</el-link>
<el-link type="primary" @click="handleUpdate">编辑</el-link>
<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="enable">启用</div>
<el-link>...
......@@ -191,7 +191,14 @@
:default-expanded-keys="[2, 3]"
:default-checked-keys="[5]"
:props="defaultProps"
/>
>
<template slot-scope="{ node, data }">
<span>
<img :src="data.icon" class="treeIcon">
<label>{{ node.label }}</label>
</span>
</template>
</el-tree>
</div>
</el-form-item>
<el-form-item label="报告生成发送邮箱:">
......@@ -286,35 +293,44 @@ export default {
fullscreen: false,
data: [{
id: 1,
label: '本机容器',
label: '本机容器', icon: require('@/assets/image/shebei.png'),
children: [{
id: 4,
label: '虚拟化平台',
icon: require('@/assets/image/shebei9-guzhang.png'),
children: [{
id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '127.0.0.1'
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.1.1'
}]
}, {
id: 5,
label: '虚拟设备',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{
id: 9,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.5.4'
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.44.2'
}]
}, {
id: 6,
label: '服务器硬件',
icon: require('@/assets/image/shebei9-weixian.png'),
children: [{
id: 9,
label: '打印机'
label: '打印机',
icon: require('@/assets/image/shebei2-zhengchang.png')
}, {
id: 10,
icon: require('@/assets/image/shebei2-zhengchang.png'),
label: '192.168.2.5'
}]
}]
......@@ -450,25 +466,25 @@ export default {
label: 'label'
},
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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' },
{ 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: '无' }
]
}
......@@ -721,6 +737,10 @@ export default {
}
}
}
.treeIcon{
width: 17px;
height: 17px;
}
.warnBody{
padding: 10px 10px 0 10px;
.st-square{
......@@ -730,6 +750,7 @@ export default {
height: 9px;
display: inline-block;
}
}
.caretDown{
display: inline-block;
......
......@@ -104,8 +104,9 @@
<el-table-column label="巡检结果" prop="sendingMethod" show-overflow-tooltip />
<el-table-column label="报告发送状态" prop="reportsNumber" align="center" show-overflow-tooltip>
<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: #30B08F;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"></span>
<span>{{ scope.row.reportsNumber }}</span>
</template>
</el-table-column>
<el-table-column label="报告发送时间" prop="latestTime" show-overflow-tooltip />
......
......@@ -119,7 +119,7 @@
<el-form-item label="设备信息:">
<div>
<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>
<el-table
:data="equipmenData"
......@@ -316,21 +316,44 @@
<el-button type="primary" @click="complete = false">取消</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="complete" title="设备信息" width="50%" :model="information">
<el-form label-width="100px">
<el-form-item label="是否解决">
<el-radio v-model="operation.isItSolved" :label="1">已解决</el-radio>
<el-radio v-model="operation.isItSolved" :label="2">未解决</el-radio>
<el-radio v-model="operation.isItSolved" :label="3">不解决</el-radio>
</el-form-item>
<el-form-item label="备注说明">
<el-input v-model="operation.remarks" type="textarea" :rows="4" />
</el-form-item>
</el-form>
<el-dialog :visible.sync="equipmentInformation" title="设备信息" width="50%" class="addGroup" :model="information">
<el-row>
<el-col :span="12" class="equipmentDiv">
<span>选择告警设备</span>
<el-form ref="addWarnForm" label-width="auto" :model="addWarnForm">
<el-form-item label="">
<el-tree
:data="data"
node-key="id"
:default-expanded-keys="[2, 3]"
: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">
<el-button @click="complete = false">提交</el-button>
<el-button type="primary" @click="complete = false">取消</el-button>
<el-button @click="equipmentInformation = false">提交</el-button>
<el-button type="primary" @click="equipmentInformation = false">取消</el-button>
</div>
</el-dialog>
<el-dialog class="addGroup" width="50%" title="高级查询" :visible.sync="advancedQueryDialog">
......@@ -481,7 +504,9 @@ export default {
}]
}],
stepActive: 1,
equipmenData: [],
equipmenData: [
{ number: '/dev/sda1 (/boot)' }
],
updateWarnForm: {
founder: '',
theme: '',
......@@ -525,6 +550,7 @@ export default {
submit: false,
hang: false,
complete: false,
equipmentInformation: false,
addDialog: false,
updateDialog: false,
advancedQueryDialog: false,
......@@ -1032,8 +1058,8 @@ export default {
/**
* 设备信息
*/
equipmentInformation() {
equipmentInformations() {
this.equipmentInformation = true
},
handleSelectAll(val) {
this.name = []
......@@ -1235,5 +1261,9 @@ export default {
width: 0;
}
}
.treeIcon{
width: 17px;
height: 17px;
}
}
</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