whyczyk
2021-11-05 03f5ad4913336d2dd6603066fb0b2312bc7bfc89
Merge branch 'master' of http://118.89.139.230:10101/r/work_flow
1个文件已修改
1个文件已添加
266 ■■■■■ 已修改文件
src/pages/alarmWork/workInfo.vue 259 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/router/routes.js 7 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/pages/alarmWork/workInfo.vue
New file
@@ -0,0 +1,259 @@
<template>
    <div class="main">
        <!-- 工单基本信息 -->
        <el-row type="flex" class="row-bg" justify="space-between">
            <el-col :span="6"><div class="grid-content bg-purple">工单编号:WS-211008-00001</div></el-col>
            <el-col :span="8"><div class="grid-content">工单生成时间:2021-10-08 15:02:00</div></el-col>
            <el-col :span="6"><div class="grid-content bg-purple">当前状态:<span class="color_red">TI待处理</span></div></el-col>
        </el-row>
        <div class="list_box">
            <el-tabs type="border-card">
                <el-tab-pane label="工单基本信息">
                    <p class="title_p">工单信息</p>
                    <div class="info_box">
                        <p>
                            <el-row type="flex" class="row-bg" justify="space-between">
                                <el-col :span="8"><div class="grid-content bg-purple"><span class="label_box">工单标题:</span>GB-U800设备发生告警,请及时处理</div></el-col>
                                <el-col :span="8"><div class="grid-content">剩余时间:22小时56分</div></el-col>
                                <el-col :span="6"><div class="grid-content bg-purple">工单完成限时:24小时</div></el-col>
                            </el-row>
                        </p>
                        <p><span class="label_box">告警描述:</span></p>
                        <p>RBS常见故障处理掉站或小区不可用类告警:IMA Group Insufficient Links(at Far End)NbapDedicated_RncRbsControlLinkDown:这是一个NbapD信令承载的告警,RNC对RBS</p>
                        <p><span class="label_box">告警发生时间:</span>2021-09-07 17:09:35</p>
                        <p><span class="label_box">告警结束时间:</span></p>
                        <p><span class="label_box">告警级别:</span><span class="color_red">严重告警</span></p>
                        <p><span class="label_box">告警附件: </span><a href="#" download>某某文件.txt</a></p>
                    </div>
                    <div class="select_box">
                        <p>
                            <span class="label_box">处理动作:</span>
                            <el-select v-model="value" placeholder="请选择" @change="getSelectVal">
                                <el-option
                                v-for="item in selectList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </p>
                    </div>
                    <div class="event_box">
                        <!-- 处理分派回复 -->
                        <div class="change_box" v-if="value==1">
                            <el-button size="mini" type="success">通过</el-button>
                            <el-button size="mini" type="info">驳回</el-button>
                             <el-table :data="tableData" stripe style="width: 100%">
                                <el-table-column type="selection" width="55"></el-table-column>
                                <el-table-column prop="name" label="分派处理人"></el-table-column>
                                <el-table-column prop="data" label="处理回复内容" ></el-table-column>
                                <el-table-column prop="fj" label="附件"></el-table-column>
                                <el-table-column prop="date" label="日期"></el-table-column>
                            </el-table>
                        </div>
                        <!-- 转派T2处理 -->
                        <div class="change_box" v-if="value==2">
                            <el-form ref="form2" :model="form2" label-width="120px">
                                <el-form-item label="要求完成时间:">
                                    <el-col :span="4">
                                        <el-date-picker type="date" placeholder="选择日期" v-model="form2.date1" style="width: 100%;"></el-date-picker>
                                    </el-col>
                                    <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                                    <el-col :span="2">
                                        <el-time-picker placeholder="选择时间" v-model="form2.date2" style="width: 100%;"></el-time-picker>
                                    </el-col>
                                    <!-- <el-date-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-date-time-picker> -->
                                </el-form-item>
                                <el-form-item label="转派意见:">
                                    <el-input type="textarea" v-model="form2.desc" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item >
                                    <el-button size="mini" type="primary">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                        <!-- 分派 -->
                        <div class="change_box" v-if="value==3">
                            <el-form ref="form3" :model="form3" label-width="120px">
                                <el-form-item label="要求完成时间:">
                                    <el-col :span="4">
                                        <el-date-picker type="date" placeholder="选择日期" v-model="form3.date1" style="width: 100%;"></el-date-picker>
                                    </el-col>
                                    <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                                    <el-col :span="2">
                                        <el-time-picker placeholder="选择时间" v-model="form3.date2" style="width: 100%;"></el-time-picker>
                                    </el-col>
                                    <!-- <el-date-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-date-time-picker> -->
                                </el-form-item>
                                <el-form-item label="分派处理人:">
                                    <el-input v-model="form3.user" placeholder="请输入" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item label="转派意见:">
                                    <el-input type="textarea" v-model="form3.desc" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item >
                                    <el-button size="mini" type="primary">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                        <!-- 移交 -->
                        <div class="change_box" v-if="value==4">
                            <el-form ref="form4" :model="form4" label-width="120px">
                                <el-form-item label="要求完成时间:">
                                    <el-col :span="4">
                                        <el-date-picker type="date" placeholder="选择日期" v-model="form4.date1" style="width: 100%;"></el-date-picker>
                                    </el-col>
                                    <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                                    <el-col :span="2">
                                        <el-time-picker placeholder="选择时间" v-model="form4.date2" style="width: 100%;"></el-time-picker>
                                    </el-col>
                                    <!-- <el-date-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-date-time-picker> -->
                                </el-form-item>
                                <el-form-item label="移交处理组:">
                                    <el-input v-model="form4.user" placeholder="请选择" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item label="移交意见:">
                                    <el-input type="textarea" v-model="form4.desc" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item >
                                    <el-button size="mini" type="primary">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                        <!-- 回复 -->
                        <div class="change_box" v-if="value==5">
                            <el-form ref="form5" :model="form5" label-width="120px">
                                <el-form-item label="处理意见:">
                                    <el-input type="textarea" v-model="form5.desc" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item >
                                    <el-button size="mini" type="primary">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                        <!-- 处理并归档 -->
                        <div class="change_box" v-if="value==6">
                            <el-form ref="form6" :model="form6" label-width="120px">
                                <el-form-item label="归档意见:">
                                    <el-input type="textarea" v-model="form6.desc" style="width: 40%;"></el-input>
                                </el-form-item>
                                <el-form-item >
                                    <el-button size="mini" type="primary">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                    </div>
                </el-tab-pane>
                <el-tab-pane label="流程信息">流程信息</el-tab-pane>
                <el-tab-pane label="流程图">流程图</el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return {
            value:"",
            selectList:[
                {value:1,label:"处理分派回复"},
                {value:2,label:"转派T2处理"},
                {value:3,label:"分派"},
                {value:4,label:"移交"},
                {value:5,label:"回复"},
                {value:6,label:"处理并归档"},
            ],
            tableData:[
                {name:"张三",data:"已处理,故障已恢复",fj:"xxx.txt",date:"2021-10-08 15:51:43"},
                {name:"李四",data:"已处理,故障已恢复",fj:"xxx.txt",date:"2021-10-08 15:51:43"},
                {name:"王五",data:"已处理,故障已恢复",fj:"xxx.txt",date:"2021-10-08 15:51:43"}
            ],
            form2:{
                date1:"",
                date2:"",
                desc:""
            },
            form3:{
                date1:"",
                date2:"",
                desc:"",
                user:""
            },
            form4:{
                date1:"",
                date2:"",
                desc:"",
                user:""
            },
            form5:{
                desc:"",
            },
            form6:{
                desc:"",
            },
        }
    },
    mounted(){
    },
    methods: {
        getSelectVal:function(val){
            console.log(val)
            console.log("val:" + this.value)
        }
    },
}
</script>
<style scoped>
.main{
    height: 100%;
    padding: 10px 15px;
    background-color: #fff;
}
.title{
    margin: 5px 0;
}
.list_box{
    height: 95%;
    border:1px #ccc solid;
    padding: 5px 10px;
    overflow: auto;
}
.list_box p{
    margin: 10px;
}
.color_red{
    color: red;
}
.label_box{
    font-weight: bold;
    font-size: 20px;
}
.title_p{
    /* border-bottom: 2px #ccc solid; */
    color: #ccc;
    font-weight: bold;
}
.select_box{
    /* border-top: 2px #ccc solid; */
    /* border-bottom: 2px #ccc solid; */
    margin: 20px 0;
    padding: 15px 0;
}
.el-tabs--border-card>/deep/.el-tabs__content{
    padding: 0;
}
.info_box{
    border-bottom: 2px #ccc solid;
    border-top: 2px #ccc solid;
}
.event_box{
    padding: 15px 5px;
    border-top: 2px #ccc solid;
    border-bottom: 2px #ccc solid;
}
</style>
src/router/routes.js
@@ -33,6 +33,13 @@
                    },
                    component: (resolve) => require(['@/pages/alarmWork/list.vue'], resolve),
                },
                {
                    path: 'workInfo',
                    meta: {
                        title: '工单基本信息',
                    },
                    component: (resolve) => require(['@/pages/alarmWork/workInfo.vue'], resolve),
                },
            ]
        },
        {