Commit a9813361 authored by 11528's avatar 11528

操作日志,服务器,网络设备页面编写

parent 8cc4d81a
...@@ -23,34 +23,55 @@ ...@@ -23,34 +23,55 @@
<el-table-column label="备注" prop="remarks" show-overflow-tooltip />\ <el-table-column label="备注" prop="remarks" show-overflow-tooltip />\
</el-table> </el-table>
</div> </div>
<el-dialog class="addGroup" width="50%" title="添加日志" :visible.sync="addDialog"> <el-dialog class="addGroup" width="50%" :title="dialogTitle" :visible.sync="addDialog">
<el-form ref="addWarnForm" label-width="auto" :model="updateWarnForm"> <el-form ref="addWarnForm" label-width="auto" :model="updateWarnForm">
<el-form-item label="名称:"> <el-form-item label="名称:">
<el-input v-model="updateWarnForm.name" /> <el-input v-model="updateWarnForm.name" />
</el-form-item> </el-form-item>
<el-form-item label="每页条数:"> <el-form-item label="每页条数:">
<el-input v-model="updateWarnForm.articlesNumber" /> <el-input-number v-model="updateWarnForm.articlesNumber" style="width: 100%;height: 30px" controls-position="right" :min="0" @change="handleChange" />
<el-button size="small" class="mouse" @click="delRow">
<a-icon type="minus" />
</el-button>
<el-button size="small" class="mouse" @click="addRow">
<a-icon type="plus" />
</el-button>
</el-form-item> </el-form-item>
<el-form-item label="时间:"> <el-form-item label="时间:">
<el-button-group style="margin-right: 10px"> <div>
<el-button>今天</el-button> <el-radio-group v-model="radio" style="margin-right: 10px">
<el-button>昨天</el-button> <el-radio label="1">一天</el-radio>
<el-button>三天</el-button> <el-radio label="2">三天</el-radio>
<el-button>一周</el-button> <el-radio label="3">七天</el-radio>
<el-button @click="changeTime">自定义时间</el-button> <el-radio label="4" @change="changeTime">自定义时间</el-radio>
</el-button-group> </el-radio-group>
</div>
</el-form-item> </el-form-item>
<el-form-item label="操作人:"> <el-form-item label="操作人:">
<el-input v-model="updateWarnForm.userName" /> <div class="equipmentDiv">
<el-checkbox-group v-model="checkCity" @change="handleCheckedCitiesChange">
<el-checkbox
v-for="item in cityOptions "
:key="item"
:label="item.name"
style="display:block;margin-left: 30px"
/>
</el-checkbox-group>
</div>
<div style="margin-top: 5px">
<el-button v-model="checkAll" style="width: 30%" @click="checkName1">全选</el-button>
<el-button v-model="checkInvert" style="width: 30%" @click="checkName2">反选</el-button>
</div>
</el-form-item> </el-form-item>
<el-form-item label="操作类型:"> <el-form-item label="操作类型:">
<el-input v-model="updateWarnForm.operationType" /> <div class="equipmentDiv">
<el-checkbox-group v-model="checkCity1" @change="handleCheckedCitiesChange1">
<el-checkbox
v-for="item in cityOption1"
:key="item"
:label="item"
style="display:block;margin-left: 30px"
/>
</el-checkbox-group>
</div>
<div style="margin-top: 5px">
<el-button v-model="checkAll1" style="width: 30%" @click="checkName3">全选</el-button>
<el-button v-model="checkInvert1" style="width: 30%" @click="checkName4">反选</el-button>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -120,20 +141,21 @@ export default { ...@@ -120,20 +141,21 @@ export default {
stepActive: 1, stepActive: 1,
updateWarnForm: { updateWarnForm: {
name: '', name: '',
articlesNumber: '', articlesNumber: 0,
operationTime: '', operationTime: '',
userName: '', userName: '',
operationType: '' operationType: ''
}, },
addWarnForm: { addWarnForm: {
name: '', name: '',
articlesNumber: '', articlesNumber: 0,
operationTime: '', operationTime: '',
userName: '', userName: '',
operationType: '' operationType: ''
}, },
addDialog: false, addDialog: false,
updateDialog: false, updateDialog: false,
isEdit: false,
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
queryParams: { queryParams: {
...@@ -145,6 +167,22 @@ export default { ...@@ -145,6 +167,22 @@ export default {
ipAddress: '', ipAddress: '',
logContent: '' logContent: ''
}, },
radio: 0,
checkCity: [],
checkAll: false,
checkInvert: false,
checkCity1: [],
checkAll1: false,
checkInvert1: false,
cityOptions: [
{ name: '管理员' },
{ name: 'admin' },
{ name: '张三' },
{ name: 'admin1' }
],
name: [],
name1: [],
cityOption1: ['TS删除', 'TS添加', 'TS编辑', '用户删除', '用户注销登陆', '用户添加', '用户登陆'],
tableData: [ tableData: [
{ userName: 'admin', operationType: '用户登录', operationStatus: '成功', operationTime: '2022-05-19 10:12:14', remarks: 'host=218.94.141.34,port=49986,id=user_1,name=admin' }, { userName: 'admin', operationType: '用户登录', operationStatus: '成功', operationTime: '2022-05-19 10:12:14', remarks: 'host=218.94.141.34,port=49986,id=user_1,name=admin' },
{ userName: 'admin1', operationType: '用户登录', operationStatus: '成功', operationTime: '2022-05-19 10:12:14', remarks: 'host=218.94.141.34,port=49986,id=user_1,name=admin1' }, { userName: 'admin1', operationType: '用户登录', operationStatus: '成功', operationTime: '2022-05-19 10:12:14', remarks: 'host=218.94.141.34,port=49986,id=user_1,name=admin1' },
...@@ -159,6 +197,11 @@ export default { ...@@ -159,6 +197,11 @@ export default {
] ]
} }
}, },
computed: {
dialogTitle() {
return this.isEdit ? '编辑日志' : '添加日志'
}
},
created() { created() {
}, },
mounted() { mounted() {
...@@ -180,12 +223,14 @@ export default { ...@@ -180,12 +223,14 @@ export default {
window.location.reload() // 刷新页面 window.location.reload() // 刷新页面
}, },
handleUpdate() { handleUpdate() {
this.updateDialog = true this.isEdit = true
this.addDialog = true
}, },
closeUpdateDialog() { closeUpdateDialog() {
this.updateDialog = false this.updateDialog = false
}, },
handleAdd() { handleAdd() {
this.isEdit = false
this.addDialog = true this.addDialog = true
}, },
closeDialog() { closeDialog() {
...@@ -198,11 +243,45 @@ export default { ...@@ -198,11 +243,45 @@ export default {
changeTime() { changeTime() {
this.open = !this.open this.open = !this.open
}, },
delRow() { handleChange() {
return this.updateWarnForm.articlesNumber++ },
checkName1(val) {
this.name = []
for (let i = 0; i < this.cityOptions.length; i++) {
this.name[i] = this.cityOptions[i].name
}
this.checkCity = val ? this.name : []
},
handleCheckedCitiesChange(value) {
this.checkCity = value
const checkedCount = value.length
this.checkAll = checkedCount !== 0 && checkedCount === this.name.length
},
checkName2(value) {
const c = []
this.cityOptions.forEach(item => {
!this.checkCity.includes(item.name) && c.push(item.name)
})
this.checkCity = c
},
handleCheckedCitiesChange1(value) {
this.checkCity1 = value
const checkedCount = value.length
this.checkAll1 = checkedCount !== 0 && checkedCount === this.name.length
}, },
addRow() { checkName3(val) {
return this.updateWarnForm.articlesNumber === 0 || this.updateWarnForm.articlesNumber === null ? 0 : this.updateWarnForm.articlesNumber-- this.name1 = []
for (let i = 0; i < this.cityOption1.length; i++) {
this.name1[i] = this.cityOption1[i]
}
this.checkCity1 = val ? this.name1 : []
},
checkName4() {
const d = []
this.cityOption1.forEach(item => {
!this.checkCity1.includes(item) && d.push(item)
})
this.checkCity1 = d
}, },
deleteRow() { deleteRow() {
this.$confirm('此操作将删除本页数据, 是否继续?', '提示', { this.$confirm('此操作将删除本页数据, 是否继续?', '提示', {
...@@ -276,4 +355,18 @@ export default { ...@@ -276,4 +355,18 @@ export default {
.mouse { .mouse {
cursor: pointer; cursor: pointer;
} }
.addGroup{
.equipmentDiv{
max-height: 150px;
height: 150px;
overflow: auto;
border: 1px solid #d2d6de;
padding: 10px 0;
border-radius: 4px;
.el-checkbox__inner {
border: none;
width: 0;
}
}
}
</style> </style>
...@@ -27,34 +27,25 @@ ...@@ -27,34 +27,25 @@
<el-table-column label="今日告警" prop="todayAlarm" show-overflow-tooltip />\ <el-table-column label="今日告警" prop="todayAlarm" show-overflow-tooltip />\
</el-table> </el-table>
</div> </div>
<el-dialog class="addGroup" width="50%" title="添加日志" :visible.sync="addDialog"> <el-dialog class="addGroup" width="50%" title="添加页面" :visible.sync="addDialog">
<el-form ref="addWarnForm" label-width="auto" :model="updateWarnForm"> <el-form ref="addWarnForm" label-width="auto" :model="addWarnForm">
<el-form-item label="名称:"> <el-form-item label="名称:">
<el-input v-model="updateWarnForm.name" /> <el-input v-model="updateWarnForm.name" />
</el-form-item> </el-form-item>
<el-form-item label="每页条数:"> <el-form-item label="每页显示报告条数:">
<el-input v-model="updateWarnForm.articlesNumber" /> <el-input v-model="updateWarnForm.articlesNumber" />
<el-button size="small" class="mouse" @click="delRow">
<a-icon type="minus" />
</el-button>
<el-button size="small" class="mouse" @click="addRow">
<a-icon type="plus" />
</el-button>
</el-form-item>
<el-form-item label="时间:">
<el-button-group style="margin-right: 10px">
<el-button>今天</el-button>
<el-button>昨天</el-button>
<el-button>三天</el-button>
<el-button>一周</el-button>
<el-button @click="changeTime">自定义时间</el-button>
</el-button-group>
</el-form-item>
<el-form-item label="操作人:">
<el-input v-model="updateWarnForm.userName" />
</el-form-item> </el-form-item>
<el-form-item label="操作类型:"> <el-form-item label="选择设备:">
<el-input v-model="updateWarnForm.operationType" /> <div class="equipmentDiv">
<el-tree
:data="data"
show-checkbox
node-key="id"
:default-expanded-keys="[2, 3]"
:default-checked-keys="[5]"
:props="defaultProps"
/>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -62,22 +53,25 @@ ...@@ -62,22 +53,25 @@
<el-button @click="closeDialog">取消</el-button> <el-button @click="closeDialog">取消</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog class="addGroup" width="50%" title="编辑日志" :visible.sync="updateDialog"> <el-dialog class="addGroup" width="50%" title="编辑页面" :visible.sync="updateDialog">
<el-form ref="addWarnForm" label-width="auto" :model="updateWarnForm"> <el-form ref="addWarnForm" label-width="auto" :model="updateWarnForm">
<el-form-item label="名称:"> <el-form-item label="名称:">
<el-input v-model="updateWarnForm.name" /> <el-input v-model="updateWarnForm.name" />
</el-form-item> </el-form-item>
<el-form-item label="每页条数:"> <el-form-item label="每页显示报告条数:">
<el-input v-model="updateWarnForm.articlesNumber" /> <el-input v-model="updateWarnForm.articlesNumber" />
</el-form-item> </el-form-item>
<el-form-item label="时间:"> <el-form-item label="选择设备:">
<el-input v-model="updateWarnForm.operationTime" /> <div class="equipmentDiv">
</el-form-item> <el-tree
<el-form-item label="操作人:"> :data="data"
<el-input v-model="updateWarnForm.userName" /> show-checkbox
</el-form-item> node-key="id"
<el-form-item label="操作类型:"> :default-expanded-keys="[2, 3]"
<el-input v-model="updateWarnForm.operationType" /> :default-checked-keys="[5]"
:props="defaultProps"
/>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -120,7 +114,45 @@ export default { ...@@ -120,7 +114,45 @@ export default {
name: 'TheServer', name: 'TheServer',
data() { data() {
return { return {
data: [], data: [{
id: 1,
label: '本机容器',
children: [{
id: 4,
label: '虚拟化平台',
children: [{
id: 9,
label: '127.0.0.1'
}, {
id: 10,
label: '192.168.1.1'
}]
}, {
id: 5,
label: '虚拟设备',
children: [{
id: 9,
label: '192.168.5.4'
}, {
id: 10,
label: '192.168.44.2'
}]
}, {
id: 6,
label: '服务器硬件',
children: [{
id: 9,
label: '打印机'
}, {
id: 10,
label: '192.168.2.5'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
stepActive: 1, stepActive: 1,
updateWarnForm: { updateWarnForm: {
name: '', name: '',
...@@ -234,23 +266,6 @@ export default { ...@@ -234,23 +266,6 @@ export default {
.el-input__inner{ .el-input__inner{
padding: 0 0 0 9px; padding: 0 0 0 9px;
} }
.treebody{
border: solid 1px #d7d7d7;
font-size: 12px;
padding: 6px;
height: 250px;
overflow-y: scroll;
}
.ninthSteps{
padding: 10px 30px 30px;
.el-steps--simple{
padding-left: 10px;
padding-right: 10px;
}
.el-step.is-simple:not(:last-of-type) .el-step__title{
max-width: 73%;
}
}
.warnHead{ .warnHead{
height: 58px; height: 58px;
padding: 15px 20px 10px 20px; padding: 15px 20px 10px 20px;
...@@ -277,14 +292,14 @@ export default { ...@@ -277,14 +292,14 @@ export default {
padding: 15px; padding: 15px;
} }
} }
.addWarnClass{ .addGroup{
.StepTitle{ .equipmentDiv{
font-size: 16px; max-height: 150px;
font-weight: bold; height: 150px;
color: #333333; overflow: auto;
border: 1px solid #d2d6de;
padding: 10px 0;
border-radius: 4px;
} }
} }
.mouse {
cursor: pointer;
}
</style> </style>
<!--出入记录-->
<template>
</template>
<script>
export default {
name: 'AccessRecord'
}
</script>
<style scoped>
</style>
<!--巡检计划-->
<template>
</template>
<script>
export default {
name: 'PatrolInspectionPlan'
}
</script>
<style scoped>
</style>
<!--巡检报告-->
<template>
</template>
<script>
export default {
name: "PatrolInspectionReport"
}
</script>
<style scoped>
</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