Commit 9ba91d90 authored by 11528's avatar 11528

工单管理:我创建的,我的任务

parent 1025eb90
...@@ -802,6 +802,7 @@ export default { ...@@ -802,6 +802,7 @@ export default {
}, },
assetsPreservation() { assetsPreservation() {
this.selectAssets = false this.selectAssets = false
this.information = 1
this.dataS = [] this.dataS = []
this.addData = this.addData1 this.addData = this.addData1
}, },
......
<!--我创建的-->
<template>
<div id="container_max" class="warnModule">
<div class="warnHead">
<span style="font-size:24px;margin-right: 10px ">我的任务</span>
<div class="warnBtns">
<!-- <el-input v-model.trim="searchBy.userName" prefix-icon="el-icon-search" class="searchInput" style="width: 20%;margin-left: 10px" clearable placeholder="工单主题" />-->
<el-button type="primary" class="headBtnW" @click="addPlan">新增</el-button>
<!-- <el-select-->
<!-- v-model="value"-->
<!-- class="headBtnW"-->
<!-- placeholder="更多操作"-->
<!-- clearable-->
<!-- style="width: 100px;margin-right: 10px;float: right"-->
<!-- maxlength="15"-->
<!-- >-->
<!-- <el-option label="删除" value="" @click.native="userLove">删除</el-option>-->
<!-- <el-option label="启用" value="" @click.native="userMassage">启用</el-option>-->
<!-- <el-option label="停用" value="" @click.native="userHistory">停用</el-option>-->
<!-- </el-select>-->
<el-button class="headBtnW" type="primary" @click="deleteRow">导出工单</el-button>
<el-button class="headBtnW" type="primary" @click="refresh">刷新</el-button>
</div>
</div>
<div class="warnBody">
<el-table
:data="tableData"
border
style="width: 100%;padding-top: 20px;padding-left: 10px"
>
<el-table-column type="selection" width="60" align="center" />
<el-table-column label="编号" prop="number" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.number }}</span>
</template>
</el-table-column>
<el-table-column label="主题" prop="theme" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.theme }}</span>
</template>
</el-table-column>
<el-table-column label="来源" prop="source" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.source }}</span>
</template>
</el-table-column>
<el-table-column label="状态" prop="status" show-overflow-tooltip />
<el-table-column label="类型" prop="type" show-overflow-tooltip />
<el-table-column label="优先级" prop="priority" show-overflow-tooltip />
<el-table-column label="创建人" prop="founder" show-overflow-tooltip />
<el-table-column label="创建时间" prop="creationTime" show-overflow-tooltip />
<el-table-column label="更新时间" prop="updateTime" show-overflow-tooltip />
<el-table-column label="下步经办人" prop="currentHandler" show-overflow-tooltip />
<el-table-column width="150px" label="操作">
<template slot-scope="scope">
<el-link v-if="scope.row.status === '1' || scope.row.status === '2'" type="primary" @click="userLove(scope.row)">撤回</el-link>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog class="addGroup" width="50%" title="新增工单" :visible.sync="addDialog">
<el-form ref="addWarnForm" label-width="auto" :model="addWarnForm">
<el-form-item label="工单编号:">
<el-input v-model="addWarnForm.number" />
</el-form-item>
<el-form-item label="主题:">
<el-input v-model="addWarnForm.theme" />
</el-form-item>
<el-form-item label="经办人:">
<el-select
v-model="addWarnForm.currentHandler"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in Inspector"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="内容描述:">
<el-input v-model="addWarnForm.contentDescription" type="textarea" :rows="4" />
</el-form-item>
<el-form-item label="设备信息:">
<div>
<el-input v-model="addWarnForm.equipmentInformation" style="width: 50%" placeholder="请选择设备信息" :disabled="true" />
<el-button @click="equipmentInformation"> 设备</el-button>
</div>
<el-table
:data="equipmenData"
border
style="width: 100%;padding-top: 20px;padding-left: 10px"
>
<el-table-column type="selection" width="60" align="center" />
<el-table-column label="监测点名称" prop="number" show-overflow-tooltip />
<el-table-column label="监测点类型" prop="theme" show-overflow-tooltip />
<el-table-column label="监测点状态" prop="source" show-overflow-tooltip />
</el-table>
</el-form-item>
<el-form-item label="来源:">
<el-select
v-model="addWarnForm.source"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in sourceOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="类型:">
<el-select
v-model="addWarnForm.type"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in typeOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="优先级:">
<el-select
v-model="addWarnForm.priority"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in priorityOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="SLA:">
<el-select
v-model="addWarnForm.SLA"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in SLAOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="closeDialog">确定</el-button>
<el-button @click="closeDialog">取消</el-button>
</span>
</el-dialog>
<el-dialog class="addGroup" width="50%" title="工单详情" :visible.sync="updateDialog">
<el-form ref="addWarnForm" label-position="left" label-width="auto" :model="updateWarnForm">
<el-form-item label="创建人:">
<span>{{ updateWarnForm.founder }}</span>
</el-form-item>
<el-form-item class="formColor" label="主题:">
<span>{{ updateWarnForm.theme }}</span>
</el-form-item>
<el-form-item label="创建时间:">
<span>{{ updateWarnForm.creationTime }}</span>
</el-form-item>
<el-form-item class="formColor" label="当前经办人:">
<span>{{ updateWarnForm.currentHandler }}</span>
</el-form-item>
<el-form-item label="提交时间:">
<span>{{ "2022-04-03 16:49:18" }}</span>
<!-- <span>{{ updateWarnForm.submitTime }}</span>-->
</el-form-item>
<el-form-item class="formColor" label="内容描述:">
<!-- <span>{{ updateWarnForm.contentDescription }}</span>-->
<span>{{ "CPU使用率(当前值:70.000(%)) 低于故障阈值(95.000(%))" }}</span>
</el-form-item>
<el-form-item label="类型:">
<span>{{ updateWarnForm.type }}</span>
</el-form-item>
<el-form-item class="formColor" label="优先级:">
<span>{{ updateWarnForm.priority }}</span>
</el-form-item>
<el-form-item label="来源:">
<span>{{ updateWarnForm.source }}</span>
</el-form-item>
<el-form-item class="formColor" label="设备信息:">
<!-- <span>{{ updateWarnForm.equipmentInformation }}</span>-->
<span>{{ "127.0.0.1" }}</span>
</el-form-item>
<el-form-item label="SLA:">
<!-- <span>{{ updateWarnForm.SLA }}</span>-->
<span>{{ "默认" }}</span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="closeUpdateDialog">记录</el-button>
<el-button @click="closeUpdateDialog">关闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import Template from '@/views/instance/Template'
export default {
name: 'MyCreated',
components: { Template },
data() {
return {
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'
}]
}]
}],
stepActive: 1,
equipmenData: [],
updateWarnForm: {
founder: '',
theme: '',
creationTime: '',
currentHandler: '',
submitTime: '2022-04-03 16:49:18',
contentDescription: '',
type: '',
priority: '',
source: '',
equipmentInformation: '',
SLA: ''
},
addWarnForm: {
number: '',
theme: '',
currentHandler: '',
contentDescription: '',
equipmentInformation: '',
source: '',
type: '',
priority: '',
SLA: ''
},
operation: {
restartInstructions: '',
submit: '',
submitTo: '',
explanationReasons: '',
restartMode: 1,
remarks: '',
isItSolved: 1
},
restart: false,
submit: false,
hang: false,
complete: false,
addDialog: false,
updateDialog: false,
isEdit: '',
// 是否显示弹出层
open: false,
queryParams: {
page: 1,
rows: 10,
status: 1,
startTime: '',
endTime: '',
ipAddress: '',
logContent: ''
},
radio: 1,
value1: '',
whatNumber: '',
whatNumbers: '',
checkCity: [],
checkAll: false,
checkInvert: false,
checkCity1: [],
checkAll1: false,
checkInvert1: false,
cityOptions: [
{ name: '管理员' },
{ name: 'admin' },
{ name: '张三' },
{ name: 'admin1' }
],
name: [],
name1: [],
cityOption1: ['管理员', '张三 889922@sina.com', 'abc 889922@sina.com', 'testcll call36@126.com'],
searchBy: {
userName: '',
operationStatus: ''
},
submitTo: [
'管理员', '张三', 'abc', 'testcll'
],
riskTypeOption1: [
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '2'
}
],
weekly: '',
weekLy: [
{
label: '周一',
value: '1'
},
{
label: '周二',
value: '2'
},
{
label: '周三',
value: '3'
},
{
label: '周四',
value: '4'
},
{
label: '周五',
value: '5'
},
{
label: '周六',
value: '6'
},
{
label: '周日',
value: '7'
}
],
inspectors: '',
Inspector: [
{
label: '管理员'
},
{
label: '张三'
},
{
label: 'abc'
},
{
label: 'test'
}
],
sourceOptions: [
{
label: '手动创建'
},
{
label: '自动生成'
}
],
typeOptions: [
{
label: '问题'
}
],
priorityOptions: [
{
label: 'P1'
},
{
label: 'P2'
},
{
label: 'P3'
}
],
SLAOptions: [
{
label: '默认'
},
{
label: 'SLA级别A'
},
{
label: 'SLA级别B'
}
],
riskTypeOptions: [
{
label: '删除',
value: '3'
},
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '2'
}
],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [
{
number: 'XX-20220514-01',
theme: '测试工单',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AA-20220514-02',
theme: '办公室交换机C故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P3',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'DV-20220514-03',
theme: '办公室交换机B故障',
source: '自动生成',
status: '3',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AC-20220514-04',
theme: '办公室交换机故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'HJ-20220514-05',
theme: 'windows服务器-服务器故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'KG-20220514-07',
theme: 'windows服务器-办公台式机故障',
source: '手动生成',
status: '3',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'GE-20220514-22',
theme: '192.168.7.7故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'BG-20220514-55',
theme: '192.168.32.155故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'HT-20220514-08',
theme: '192.168.8.1故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'JT-20220514-12',
theme: '192.168.32.12故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'ER-20220514-24',
theme: '192.168.55.33故障',
source: '自动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'UY-20220514-31',
theme: '192.168.5.1故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'KU-20220514-25',
theme: '192.168.15.1故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'GG-20220514-21',
theme: '192.168.5.2故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
}
]
}
},
computed: {
// eslint-disable-next-line vue/return-in-computed-property
dialogTitle() {
if (this.isEdit === 1) {
return '编辑巡检计划'
} else if (this.isEdit === 2) {
return '新增巡检计划'
} else {
return '复制巡检计划'
}
}
},
mounted() {
if (this.$route.query.type === '1') {
this.addWarnDialog = true
}
},
methods: {
refresh() {
window.location.reload() // 刷新页面
},
/**
* 工单详情
*/
workOrderDetails(row) {
this.updateDialog = true
this.updateWarnForm = JSON.parse(JSON.stringify(row))
},
/**
* 导出工单
*/
deleteRow() {
this.$confirm('此操作将导出选中数据数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
userLove() {
this.$confirm('此操作将删除选中数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
closeUpdateDialog() {
this.updateDialog = false
},
addPlan() {
this.addDialog = true
},
closeDialog() {
this.addDialog = false
},
addWarn() {
this.isEdit = 3
this.addDialog = true
},
/** 查询按钮操作 */
changeTime() {
this.open = !this.open
},
handleChange() {
},
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
},
checkName3(val) {
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
}
}
}
</script>
<style lang="scss" scoped>
.warnModule{
.strategyRow{
padding: 5px 0;
}
.el-input__inner{
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{
height: 58px;
padding: 15px 20px 10px 20px;
background-color: #edeef3 !important;
border-bottom: 1px solid #DBDDE3;
.warnBtns{
float: right;
.headBtn{
line-height: 10px;
width: 100px;
color: #fff;
border-color: #768398;
background-color: #768398;
}
.headBtnW{
border-radius: 4px;
line-height: 22px;
font-size: 12px;
padding: 0 10px;
margin: 0 5px;
}
}
}
.mointorHead{
padding-top: 10px;
line-height: 32px;
display: flex;
justify-content: space-between;
.headSearch{
.searchInput{
border-left: 0;
.el-input__inner{
border-radius: 0;
border: 0;
}
}
.el-form-item__content{
display: flex;
}
}
.headBtn{
border-radius: 4px;
line-height: 30px;
font-size: 16px;
padding: 0 20px;
color: #444;
border-color: #ddd;
}
}
.warnBody{
}
.caretDown{
display: inline-block;
width: 0;
height: 0;
margin-left: 8px;
//vertical-align: middle;
//border-top: 4px solid;
//border-right: 4px solid transparent;
//border-left: 4px solid transparent;
}
}
.addWarnClass{
.StepTitle{
font-size: 16px;
font-weight: bold;
color: #333333;
}
}
.timePlan{
margin-top: 10px;
margin-bottom: 20px;
}
.mouse {
cursor: pointer;
}
.addGroup{
display: flex;
flex-direction: row;
.formColor{
background-color: #e5e5e5;
}
.equipmentDiv{
flex: 1;
max-height: 150px;
height: 150px;
overflow: auto;
border: 1px solid #d2d6de;
padding: 10px 0;
border-radius: 4px;
.el-checkbox__inner {
border: none;
width: 0;
}
}
.equipmentDiv1{
flex: 1;
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>
<!--我的任务-->
<template>
<div id="container_max" class="warnModule">
<div class="warnHead">
<span style="font-size:24px;margin-right: 10px ">我的任务</span>
<div class="warnBtns">
<!-- <el-input v-model.trim="searchBy.userName" prefix-icon="el-icon-search" class="searchInput" style="width: 20%;margin-left: 10px" clearable placeholder="工单主题" />-->
<el-button type="primary" class="headBtnW" @click="addPlan">新增</el-button>
<!-- <el-select-->
<!-- v-model="value"-->
<!-- class="headBtnW"-->
<!-- placeholder="更多操作"-->
<!-- clearable-->
<!-- style="width: 100px;margin-right: 10px;float: right"-->
<!-- maxlength="15"-->
<!-- >-->
<!-- <el-option label="删除" value="" @click.native="userLove">删除</el-option>-->
<!-- <el-option label="启用" value="" @click.native="userMassage">启用</el-option>-->
<!-- <el-option label="停用" value="" @click.native="userHistory">停用</el-option>-->
<!-- </el-select>-->
<el-button class="headBtnW" type="primary" @click="deleteRow">导出工单</el-button>
<el-button class="headBtnW" type="primary" @click="refresh">刷新</el-button>
</div>
</div>
<div class="warnBody">
<el-table
:data="tableData"
border
style="width: 100%;padding-top: 20px;padding-left: 10px"
>
<el-table-column type="selection" width="60" align="center" />
<el-table-column label="编号" prop="number" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.number }}</span>
</template>
</el-table-column>
<el-table-column label="主题" prop="theme" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.theme }}</span>
</template>
</el-table-column>
<el-table-column label="来源" prop="source" show-overflow-tooltip>
<template slot-scope="scope">
<span style="color: #3e98f9;text-decoration: underline" @click="workOrderDetails(scope.row)">{{ scope.row.source }}</span>
</template>
</el-table-column>
<el-table-column label="状态" prop="status" show-overflow-tooltip />
<el-table-column label="类型" prop="type" show-overflow-tooltip />
<el-table-column label="优先级" prop="priority" show-overflow-tooltip />
<el-table-column label="创建人" prop="founder" show-overflow-tooltip />
<el-table-column label="创建时间" prop="creationTime" show-overflow-tooltip />
<el-table-column label="更新时间" prop="updateTime" show-overflow-tooltip />
<el-table-column label="当前经办人" prop="currentHandler" show-overflow-tooltip />
<el-table-column label="SLA响应时长" prop="SLAResponseTime" show-overflow-tooltip />
<el-table-column label="SLA处理时长" prop="SLAProcessingTime" show-overflow-tooltip />
<el-table-column width="150px" label="操作">
<template slot-scope="scope">
<el-link v-if="scope.row.status === '1'" type="primary" @click="implement(scope.row)">重启</el-link>
<el-link v-if="scope.row.status === '2'" type="primary" @click="report(scope.row)">接单</el-link>
<el-link v-if="scope.row.status === '3'" type="primary" @click="orderSubmit(scope.row)">提交</el-link>
<el-link v-if="scope.row.status === '3'" type="primary" @click="orderHang(scope.row)">挂起</el-link>
<el-link v-if="scope.row.status === '3'" type="primary" @click="orderComplete(scope.row)">完成</el-link>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog class="addGroup" width="50%" title="新增工单" :visible.sync="addDialog">
<el-form ref="addWarnForm" label-width="auto" :model="addWarnForm">
<el-form-item label="工单编号:">
<el-input v-model="addWarnForm.number" />
</el-form-item>
<el-form-item label="主题:">
<el-input v-model="addWarnForm.theme" />
</el-form-item>
<el-form-item label="经办人:">
<el-select
v-model="addWarnForm.currentHandler"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in Inspector"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="内容描述:">
<el-input v-model="addWarnForm.contentDescription" type="textarea" :rows="4" />
</el-form-item>
<el-form-item label="设备信息:">
<div>
<el-input v-model="addWarnForm.equipmentInformation" style="width: 50%" placeholder="请选择设备信息" :disabled="true" />
<el-button @click="equipmentInformation"> 设备</el-button>
</div>
<el-table
:data="equipmenData"
border
style="width: 100%;padding-top: 20px;padding-left: 10px"
>
<el-table-column type="selection" width="60" align="center" />
<el-table-column label="监测点名称" prop="number" show-overflow-tooltip />
<el-table-column label="监测点类型" prop="theme" show-overflow-tooltip />
<el-table-column label="监测点状态" prop="source" show-overflow-tooltip />
</el-table>
</el-form-item>
<el-form-item label="来源:">
<el-select
v-model="addWarnForm.source"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in sourceOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="类型:">
<el-select
v-model="addWarnForm.type"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in typeOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="优先级:">
<el-select
v-model="addWarnForm.priority"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in priorityOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<el-form-item label="SLA:">
<el-select
v-model="addWarnForm.SLA"
placeholder="请选择"
clearable
style="width: 100%"
>
<el-option
v-for="(item,index) in SLAOptions"
:key="index"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="closeDialog">确定</el-button>
<el-button @click="closeDialog">取消</el-button>
</span>
</el-dialog>
<el-dialog class="addGroup" width="50%" title="工单详情" :visible.sync="updateDialog">
<el-form ref="addWarnForm" label-position="left" label-width="auto" :model="updateWarnForm">
<el-form-item label="创建人:">
<span>{{ updateWarnForm.founder }}</span>
</el-form-item>
<el-form-item class="formColor" label="主题:">
<span>{{ updateWarnForm.theme }}</span>
</el-form-item>
<el-form-item label="创建时间:">
<span>{{ updateWarnForm.creationTime }}</span>
</el-form-item>
<el-form-item class="formColor" label="当前经办人:">
<span>{{ updateWarnForm.currentHandler }}</span>
</el-form-item>
<el-form-item label="提交时间:">
<span>{{ "2022-04-03 16:49:18" }}</span>
<!-- <span>{{ updateWarnForm.submitTime }}</span>-->
</el-form-item>
<el-form-item class="formColor" label="内容描述:">
<!-- <span>{{ updateWarnForm.contentDescription }}</span>-->
<span>{{ "CPU使用率(当前值:70.000(%)) 低于故障阈值(95.000(%))" }}</span>
</el-form-item>
<el-form-item label="类型:">
<span>{{ updateWarnForm.type }}</span>
</el-form-item>
<el-form-item class="formColor" label="优先级:">
<span>{{ updateWarnForm.priority }}</span>
</el-form-item>
<el-form-item label="来源:">
<span>{{ updateWarnForm.source }}</span>
</el-form-item>
<el-form-item class="formColor" label="设备信息:">
<!-- <span>{{ updateWarnForm.equipmentInformation }}</span>-->
<span>{{ "127.0.0.1" }}</span>
</el-form-item>
<el-form-item label="SLA:">
<!-- <span>{{ updateWarnForm.SLA }}</span>-->
<span>{{ "默认" }}</span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="closeUpdateDialog">记录</el-button>
<el-button @click="closeUpdateDialog">关闭</el-button>
</span>
</el-dialog>
<el-dialog :visible.sync="restart" title="工单重启" width="40%" :model="operation">
<el-form label-width="100px" >
<el-form-item label="重启说明">
<el-input v-model="operation.restartInstructions" type="textarea" :rows="3"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="restart = false">提交</el-button>
<el-button type="primary" @click="restart = false">取消</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="submit" title="工单提交" width="40%" :model="operation">
<el-form label-width="100px">
<el-form-item label="提交给:">
<el-select
v-model="operation.submitTo"
class="searchInput"
placeholder="请选择"
clearable
style="width: 100%"
maxlength="30"
>
<el-option
v-for="item in submitTo"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="提交说明:">
<el-input v-model="operation.submit" type="textarea" :rows="4" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="submit = false">提交</el-button>
<el-button type="primary" @click="submit = false">取消</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="hang" title="工单挂起" width="40%" :model="operation">
<el-form label-width="100px">
<el-form-item label="重启方式">
<el-radio v-model="operation.restartMode" :label="1">手动</el-radio>
</el-form-item>
<el-form-item label="原因说明">
<el-input v-model="operation.explanationReasons" type="textarea" :rows="4" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="hang = false">提交</el-button>
<el-button type="primary" @click="hang = false">取消</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="complete" title="完成工单" width="50%" :model="operation">
<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>
<div slot="footer" class="dialog-footer">
<el-button @click="complete = false">提交</el-button>
<el-button type="primary" @click="complete = false">取消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import Template from '@/views/instance/Template'
export default {
name: 'MyMission',
components: { Template },
data() {
return {
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'
}]
}]
}],
stepActive: 1,
equipmenData: [],
updateWarnForm: {
founder: '',
theme: '',
creationTime: '',
currentHandler: '',
submitTime: '2022-04-03 16:49:18',
contentDescription: '',
type: '',
priority: '',
source: '',
equipmentInformation: '',
SLA: ''
},
addWarnForm: {
number: '',
theme: '',
currentHandler: '',
contentDescription: '',
equipmentInformation: '',
source: '',
type: '',
priority: '',
SLA: ''
},
operation: {
restartInstructions: '',
submit: '',
submitTo: '',
explanationReasons: '',
restartMode: 1,
remarks: '',
isItSolved: 1
},
restart: false,
submit: false,
hang: false,
complete: false,
addDialog: false,
updateDialog: false,
isEdit: '',
// 是否显示弹出层
open: false,
queryParams: {
page: 1,
rows: 10,
status: 1,
startTime: '',
endTime: '',
ipAddress: '',
logContent: ''
},
radio: 1,
value1: '',
whatNumber: '',
whatNumbers: '',
checkCity: [],
checkAll: false,
checkInvert: false,
checkCity1: [],
checkAll1: false,
checkInvert1: false,
cityOptions: [
{ name: '管理员' },
{ name: 'admin' },
{ name: '张三' },
{ name: 'admin1' }
],
name: [],
name1: [],
cityOption1: ['管理员', '张三 889922@sina.com', 'abc 889922@sina.com', 'testcll call36@126.com'],
searchBy: {
userName: '',
operationStatus: ''
},
submitTo: [
'管理员', '张三', 'abc', 'testcll'
],
riskTypeOption1: [
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '2'
}
],
weekly: '',
weekLy: [
{
label: '周一',
value: '1'
},
{
label: '周二',
value: '2'
},
{
label: '周三',
value: '3'
},
{
label: '周四',
value: '4'
},
{
label: '周五',
value: '5'
},
{
label: '周六',
value: '6'
},
{
label: '周日',
value: '7'
}
],
inspectors: '',
Inspector: [
{
label: '管理员'
},
{
label: '张三'
},
{
label: 'abc'
},
{
label: 'test'
}
],
sourceOptions: [
{
label: '手动创建'
},
{
label: '自动生成'
}
],
typeOptions: [
{
label: '问题'
}
],
priorityOptions: [
{
label: 'P1'
},
{
label: 'P2'
},
{
label: 'P3'
}
],
SLAOptions: [
{
label: '默认'
},
{
label: 'SLA级别A'
},
{
label: 'SLA级别B'
}
],
riskTypeOptions: [
{
label: '删除',
value: '3'
},
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '2'
}
],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [
{
number: 'AK-20220514-01',
theme: '127.0.0.1故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-02',
theme: '127.0.0.1故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P3',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-03',
theme: '127.0.0.1故障',
source: '自动生成',
status: '3',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'CF-20220514-04',
theme: '127.0.0.1故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'FG-20220514-05',
theme: '127.0.0.1故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'DF-20220514-07',
theme: '127.0.0.1故障',
source: '手动生成',
status: '3',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'QW-20220514-22',
theme: '192.168.7.7故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-55',
theme: '192.168.32.155故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'CM-20220514-08',
theme: '192.168.8.1故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P2',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'EF-20220514-12',
theme: '192.168.32.12故障',
source: '手动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-24',
theme: '192.168.55.33故障',
source: '自动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-31',
theme: '192.168.5.1故障',
source: '手动生成',
status: '2',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-25',
theme: '192.168.15.1故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
},
{
number: 'AK-20220514-21',
theme: '192.168.5.2故障',
source: '自动生成',
status: '1',
type: '问题',
priority: 'P1',
founder: '管理员',
creationTime: '2022-04-02 16:49:18',
updateTime: '2022-05-24 08:34:31',
currentHandler: '管理员',
SLAResponseTime: '-1个月20天15小时44分钟',
SLAProcessingTime: '-1个月20天13小时45分钟'
}
]
}
},
computed: {
// eslint-disable-next-line vue/return-in-computed-property
dialogTitle() {
if (this.isEdit === 1) {
return '编辑巡检计划'
} else if (this.isEdit === 2) {
return '新增巡检计划'
} else {
return '复制巡检计划'
}
}
},
mounted() {
if (this.$route.query.type === '1') {
this.addWarnDialog = true
}
},
methods: {
refresh() {
window.location.reload() // 刷新页面
},
/**
* 工单详情
*/
workOrderDetails(row) {
this.updateDialog = true
this.updateWarnForm = JSON.parse(JSON.stringify(row))
},
/**
* 重启
*/
implement() {
this.restart = true
},
/**
* 接单
*/
report() {
this.$confirm('确定接单?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
/**
* 导出工单
*/
deleteRow() {
this.$confirm('此操作将导出选中数据数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
enable() {
this.$confirm('此操作将启用此数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
userLove() {
this.$confirm('此操作将删除选中数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
userMassage() {
this.$confirm('此操作将启用选中数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
userHistory() {
this.$confirm('此操作将停用选中数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {})
},
/**
*工单提交
*/
orderSubmit() {
this.submit = true
},
/**
* 工单挂起
*/
orderHang() {
this.hang = true
},
/**
* 工单完成
*/
orderComplete() {
this.complete = true
},
closeUpdateDialog() {
this.updateDialog = false
},
addPlan() {
this.addDialog = true
},
closeDialog() {
this.addDialog = false
},
addWarn() {
this.isEdit = 3
this.addDialog = true
},
/** 查询按钮操作 */
changeTime() {
this.open = !this.open
},
handleChange() {
},
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
},
checkName3(val) {
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
}
}
}
</script>
<style lang="scss" scoped>
.warnModule{
.strategyRow{
padding: 5px 0;
}
.el-input__inner{
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{
height: 58px;
padding: 15px 20px 10px 20px;
background-color: #edeef3 !important;
border-bottom: 1px solid #DBDDE3;
.warnBtns{
float: right;
.headBtn{
line-height: 10px;
width: 100px;
color: #fff;
border-color: #768398;
background-color: #768398;
}
.headBtnW{
border-radius: 4px;
line-height: 22px;
font-size: 12px;
padding: 0 10px;
margin: 0 5px;
}
}
}
.mointorHead{
padding-top: 10px;
line-height: 32px;
display: flex;
justify-content: space-between;
.headSearch{
.searchInput{
border-left: 0;
.el-input__inner{
border-radius: 0;
border: 0;
}
}
.el-form-item__content{
display: flex;
}
}
.headBtn{
border-radius: 4px;
line-height: 30px;
font-size: 16px;
padding: 0 20px;
color: #444;
border-color: #ddd;
}
}
.warnBody{
}
.caretDown{
display: inline-block;
width: 0;
height: 0;
margin-left: 8px;
//vertical-align: middle;
//border-top: 4px solid;
//border-right: 4px solid transparent;
//border-left: 4px solid transparent;
}
}
.addWarnClass{
.StepTitle{
font-size: 16px;
font-weight: bold;
color: #333333;
}
}
.timePlan{
margin-top: 10px;
margin-bottom: 20px;
}
.mouse {
cursor: pointer;
}
.addGroup{
display: flex;
flex-direction: row;
.formColor{
background-color: #e5e5e5;
}
.equipmentDiv{
flex: 1;
max-height: 150px;
height: 150px;
overflow: auto;
border: 1px solid #d2d6de;
padding: 10px 0;
border-radius: 4px;
.el-checkbox__inner {
border: none;
width: 0;
}
}
.equipmentDiv1{
flex: 1;
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>
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