Skip to content

Z
zhxf_vue
Commit 970a1d36 authored by xiexingan's avatar xiexingan
Browse files
Options

Merge branch 'dev' of gitlab.suntrayoa.com:geqilin/zhxf_vue into dev

parents ecf27e41 476038b8
Hide whitespace changes
Inline Side-by-side
Showing with 277 additions and 387 deletions
src/App.vue
View file @ 970a1d36
......@@ -336,6 +336,7 @@ export default {
})
}).then((data) => {
if (data && data.code === 0) {
console.log('报警信息:', data.list)
this.tipList = data.list
if (this.tipList.length < 4) {
......
src/pages/alarms/untreated/alarm-detail.vue
View file @ 970a1d36
......@@ -66,369 +66,258 @@
</div>
</div>
</div>
div.alarms-untreated-dialog-bottom(v-if="dataForm.type !== null")
el-tabs(v-model="activeName" type='border-card')
el-tab-pane(v-if="dataForm.type === 1" label="处理报警" name="first")
<div class="instruct-list-dialog" style="width:100%; height:230px">
<div style="margin:20px;" :style="{'width':`${opinionList.length}`*200+'px'}">
el-steps(:space="300" :active="opinionActive")
el-step(v-for="item in opinionList" :key='item.id' icon='el-icon-stepsIcon' )
template(slot="description")
div 处理人： {{item.name }}
div 处理时间： {{item.opinionTime}}
div 处理意见：
font(:title="item.content") {{item.content,82|substr}}
</div>
</div>
el-tab-pane(v-if="dataForm.type === 2" label="应急预案" name="second" )
div.instruct-list-dialog(v-if="planStepList.length > 0" style="width:100%; height:230px" v-loading="loading")
div(style="margin:20px;" :style="{'width':`${planStepList.length}`*200+'px'}")
el-steps(:space="300" :active="stepActive")
el-step(v-for="(item,index) in planStepList" :key='index' icon='el-icon-stepsIcon')
template(slot="description")
div(v-if="item.instrId == null")
el-row
el-col(:span="24" v-if="item.runMode === 1") 人为响应：
el-col(:span="24" v-if="item.runMode === 2") 系统响应：
el-row
el-col(:span="24" v-if="item.runMode === 1") 执行单位：{{item.exeName}}
el-col(:span="24" v-if="item.runMode === 2") 资源点：{{item.resName}}
el-row
el-col(:span="24" v-if="item.runMode === 1")
div 动作：
font(:title="item.content" ) {{item.content,25|substr}}
el-col(:span="24" v-if="item.runMode === 2") 动作：{{item.actionName}}
el-row(v-if="item.runMode == 2 && item.status === 2")
el-col(:span="24" )
div 执行结果：
span(v-if="item.byx1 === '1'")
font(color='#67C23A') 成功
font.action_font(class="el-icon-picture" v-if="item.actionName === '抓图'" @click="queryActionHandle(item.id,1)") 抓图详情
font.action_font(class="el-icon-picture" v-if="item.actionName === '录像下载'" @click="queryActionHandle(item.id,2)") 录像下载详情
font(color='#F56C6C' v-if="item.byx1 === '2'") 失败
font(color='#F56C6C' v-if="item.byx1 === '3'") 中止
el-row
el-col(:span="24") 开始执行：{{item.updateTime}}
el-row
el-col(:span="24") 执行完成：{{item.byx1 === '1' ? item.endTime: item.runMode == 1 ? item.endTime : ''}}
//el-row(v-if="stepActive === index && item.runMode === 1")
el-col(:span="24")
el-button(mini="size" type="primary" @click="nextHandle(item)") 下一步
<span slot="footer" class="dialog-footer">
<el-button size='medium' type='primary' @click="visible = false">关闭</el-button>
</span>
el-dialog(:modal="false" width="35%" :modal-append-to-body="false" class="dialogActionClass" :close-on-press-escape="false" :visible.sync="actionVisible")
div(slot="title")
span.title-bold {{actionType == 0 ? '' : actionType==1 ? '抓图详情' : '录像下载详情'}}
div(v-loading="actionLoading")
img(v-if="actionList.length === 0" height="360px" width="100%" src="../../../assets/images/videoImg.png" alt="")
el-carousel(v-if="actionList.length > 0" height="360px" arrow="always")
el-carousel-item(v-for="(item,index) in actionList")
img(v-if="item.fileType === 'jpg' && item.path && item.path != 'null'" :src="urlPath+item.path" height="320px" width="100%")
video(v-else-if="item.fileType === 'mp4' && item.path && item.path != 'null'" height="320px" width="100%" :src="urlPath+item.path" autoplay loop controls muted="true")
img(v-else height="360px" width="100%" src="../../../assets/images/videoImg.png" alt="")
div.action_div
span.action_span(style="") {{index+1}}</span>{{'/'+actionList.length}}
//span.dialog-footer(slot="footer" style="padding:0 20px 0px 20px;")
el-button(size='medium' type='primary' @click="actionVisible = false") 关闭
</template>
<script>
export default {
data() {
return {
visible: false,
loading: false,
actionVisible: false,
actionLoading: false,
actionList: [],
actionType: 0,
dataForm: {}, //基本信息
disposeForm: {}, //处理报警
urlPath: window.CONFIG.urlPath,
planForm: {},
planList: [], //应急预案
opinionList: [], //处理报警步骤集合
stepList: [], //应急预案步骤集合
planStepList: [],
opinionActive: 0,
stepActive: 0,
activeName: 'first',
imgList: [],
videoList: []
}
},
filters: {
substr (val, len) {
if (!val) return ''
if (val.length > len) {
return val.slice(1, len) + '...'
}
return val
}
},
methods: {
//指令步骤抓图和录像下载查询
queryActionHandle(id, type) {
this.actionType = type
this.actionList = []
this.actionVisible = true
this.actionLoading = true
this.$http({
url: this.$http.adornUrlAlarm(`/orAttachment/queryByAlarmStepId/` + id),
method: 'get'
}).then(data => {
this.actionLoading = false
if (data && data.code === 0) {
this.actionList = data.list
}
})
},
init(bean) {
this.activeName = 'first'
this.visible = true
this.dataForm = {}
this.disposeForm = {}
this.planList = {}
this.planForm = {}
this.opinionList = []
this.stepList = []
this.planStepList = []
this.getById(bean.id)
this.getListByAlarmsId(bean.id)
this.getHmdListByAlarmsId(bean.id)
},
//获取报警基本信息
getById(id) {
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsInfo/getId`),
method: 'get',
params: {
id: id,
stationId: null
}
}).then(data => {
if (data && data.code === 0) {
this.dataForm = data.bean
}
}).then(data => {
//初始化处理报警信息
if (this.dataForm.type === 1) {
this.activeName = 'first'
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsOpinion/getAlarmsId/`),
method: 'get',
params: this.$http.adornParams({
stationId: null,
alarmsId: this.dataForm.id
})
}).then(data => {
if (data && data.code === 0) {
this.opinionList = data.list
this.opinionActive = this.opinionList.length
}
})
}
//应急预案
if (this.dataForm.type === 2) {
this.activeName = 'second'
this.getPlanInfo()
}
})
},
//获取截图和视频
getListByAlarmsId(id) {
this.imgList = []
this.videoList = []
this.$http({
url: this.$http.adornUrlAlarm(`/linkAttachment/queryListByAlarmsId/` + id),
method: 'get'
}).then(data => {
if (data && data.code === 0) {
let arr = data.list
for (let i in arr) {
let val = { 'src': this.urlPath + arr[i].path }
if (arr[i].fileType === 'jpg') {
this.imgList.push(val)
}
if (arr[i].fileType === 'mp4') {
this.videoList.push(val)
}
}
}
})
},
//获取截图和视频
getHmdListByAlarmsId(id) {
// this.num = this.num + 1
this.imgList = []
this.videoList = []
this.$http({
url: this.$http.adornUrlAlarm(`/alarmAttachment/list`),
method: 'post',
params: {
alarmsId: id,
stationId: null
}
}).then(data => {
if (data && data.code === 0) {
let arr = data.list
for (let i in arr) {
let val = { 'src': this.urlPath + arr[i].path }
this.imgList.push(val)
}
}
})
},
//获取应急预案信息
getPlanInfo() {
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsPlanStep/getPlanStepList`),
method: 'get',
params: {
alarmsId: this.dataForm.id,
stationId: null
}
}).then(data => {
if (data && data.code === 0) {
this.planStepList = data.list
for (let i in this.planStepList) {
if (this.planStepList[i].status === 1) {
this.stepActive = Number(i)
break
}
}
}
})
}
}
}
</script>
<style lang="scss" scoped>
.action_font{
cursor:pointer;
line-height: 20px;
padding-left:10px;
}
.action_div{
float:left;
width:100%;
height:40px;
background: #F6F7FB;
line-height: 40px;
bottom: 0;
export default {
data() {
return {
visible: false,
loading: false,
actionVisible: false,
actionLoading: false,
actionList: [],
actionType: 0,
dataForm: {}, //基本信息
disposeForm: {}, //处理报警
urlPath: window.CONFIG.urlPath,
planForm: {},
planList: [], //应急预案
opinionList: [], //处理报警步骤集合
stepList: [], //应急预案步骤集合
planStepList: [],
opinionActive: 0,
stepActive: 0,
activeName: 'first',
imgList: [],
videoList: []
}
.action_span{
float:left;
text-indent: 1rem;
font-size:18px;
font-weight:bold;
color:rgba(33,172,252,1)
},
filters: {
substr(val, len) {
if (!val) return ''
if (val.length > len) {
return val.slice(1, len) + '...'
}
return val
}
.dialogActionClass{
/deep/ .el-dialog__body{
padding: 10px;
},
methods: {
init(bean) {
this.activeName = 'first'
this.visible = true
this.dataForm = {}
this.disposeForm = {}
this.planList = {}
this.planForm = {}
this.opinionList = []
this.stepList = []
this.planStepList = []
this.getById(bean.id)
// this.getListByAlarmsId(bean.id)
// this.getHmdListByAlarmsId(bean.id)
},
//获取报警基本信息
getById(id) {
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsInfo/getId`),
method: 'get',
params: {
id: id,
stationId: null
}
}
.el_form_item{
margin-bottom: 0px !important;
}
.col_style{
height: 2rem;
line-height: 2rem;
}
.row_div{
padding: 1rem 1.5rem 1rem 0rem;
border: 1px #DCDFE6 solid;
/*background-color: #EBEEF5;*/
height: 20rem;
}
.col_div{
padding: 1rem;
border: 1px #DCDFE6 solid;
/*background-color: #EBEEF5;*/
height: 13rem;
max-height: 13rem;
overflow-x:auto;
overflow-y:hidden;
}
.no_img{
text-align: center;
font-size: 36px;
font-weight: bold;
}
.col_div_two{
padding: 1rem;
border: 1px #DCDFE6 solid;
/*background-color: #EBEEF5;*/
border-left: none;
height: 13rem;
}
.row_image_div{
padding: 1.5rem 2rem;
border: 1px #DCDFE6 solid;
border-left: none;
/*background-color: #EBEEF5;*/
height: 20rem;
}
.alarms_font{
color:#409EFF;
line-height: 2rem;
font-weight: bold;
}
.dialogClass {
/deep/ .el-dialog__body{
padding-bottom: 10px;
}).then((data) => {
if (data && data.code === 0) {
this.dataForm = data.bean
}
})
}
.instruct-list-dialog{
height:410px; width: 450px; float: left;background: #fff; box-shadow:0px 2px 8px 0px rgba(0, 0, 0, 0.2); overflow: auto;
.header{
height: 40px; background: #EEF8FF; line-height: 40px; padding-left: 15px;font-weight:400;margin-bottom: 20px;
}
.el-tree{
background:rgba(255,255,255,0);
}
.el-tree-node__content:hover{
background: #35AFF8
}
.el-input{
width: 90%;
}
.el-carousel__container{
width:300px; margin:0 auto;
}
.el-carousel__arrow--left {
left:-50px;
}
.el-carousel__arrow--right{
right:-50px;
}
.carousel-name{
position: absolute;
width:100%; height:40px;background:#F6F7FB;bottom:0; line-height:40px;
}
}
.alarms-untreated-dialog-bottom{
.el-tabs__nav-scroll {
height: 40px;
padding-top: 10px;
padding-left: 10px;
background: #EEF8FF;
.el-tabs__item{
border-top-color: #DCDFE6 !important;
}
}
//获取截图和视频
// getListByAlarmsId(id) {
// this.imgList = []
// this.videoList = []
// this.$http({
// url: this.$http.adornUrlAlarm(`/linkAttachment/queryListByAlarmsId/` + id),
// method: 'get'
// }).then(data => {
// if (data && data.code === 0) {
// let arr = data.list
// for (let i in arr) {
// let val = { 'src': this.urlPath + arr[i].path }
// if (arr[i].fileType === 'jpg') {
// this.imgList.push(val)
// }
// if (arr[i].fileType === 'mp4') {
// this.videoList.push(val)
// }
// }
// }
// })
// },
//获取截图和视频
// getHmdListByAlarmsId(id) {
// // this.num = this.num + 1
// this.imgList = []
// this.videoList = []
// this.$http({
// url: this.$http.adornUrlAlarm(`/alarmAttachment/list`),
// method: 'post',
// params: {
// alarmsId: id,
// stationId: null
// }
// }).then(data => {
// if (data && data.code === 0) {
// let arr = data.list
// for (let i in arr) {
// let val = { 'src': this.urlPath + arr[i].path }
// this.imgList.push(val)
// }
// }
// })
// },
}
}
</script>
<style lang="scss" scoped>
.action_font {
cursor: pointer;
line-height: 20px;
padding-left: 10px;
}
.action_div {
float: left;
width: 100%;
height: 40px;
background: #f6f7fb;
line-height: 40px;
bottom: 0;
}
.action_span {
float: left;
text-indent: 1rem;
font-size: 18px;
font-weight: bold;
color: rgba(33, 172, 252, 1);
}
.dialogActionClass {
/deep/ .el-dialog__body {
padding: 10px;
}
}
.el_form_item {
margin-bottom: 0px !important;
}
.col_style {
height: 2rem;
line-height: 2rem;
}
.row_div {
padding: 1rem 1.5rem 1rem 0rem;
border: 1px #dcdfe6 solid;
/*background-color: #EBEEF5;*/
height: 20rem;
}
.col_div {
padding: 1rem;
border: 1px #dcdfe6 solid;
/*background-color: #EBEEF5;*/
height: 13rem;
max-height: 13rem;
overflow-x: auto;
overflow-y: hidden;
}
.no_img {
text-align: center;
font-size: 36px;
font-weight: bold;
}
.col_div_two {
padding: 1rem;
border: 1px #dcdfe6 solid;
/*background-color: #EBEEF5;*/
border-left: none;
height: 13rem;
}
.row_image_div {
padding: 1.5rem 2rem;
border: 1px #dcdfe6 solid;
border-left: none;
/*background-color: #EBEEF5;*/
height: 20rem;
}
.alarms_font {
color: #409eff;
line-height: 2rem;
font-weight: bold;
}
.dialogClass {
/deep/ .el-dialog__body {
padding-bottom: 10px;
}
}
.instruct-list-dialog {
height: 410px;
width: 450px;
float: left;
background: #fff;
box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.2);
overflow: auto;
.header {
height: 40px;
background: #eef8ff;
line-height: 40px;
padding-left: 15px;
font-weight: 400;
margin-bottom: 20px;
}
.el-tree {
background: rgba(255, 255, 255, 0);
}
.el-tree-node__content:hover {
background: #35aff8;
}
.el-input {
width: 90%;
}
.el-carousel__container {
width: 300px;
margin: 0 auto;
}
.el-carousel__arrow--left {
left: -50px;
}
.el-carousel__arrow--right {
right: -50px;
}
.carousel-name {
position: absolute;
width: 100%;
height: 40px;
background: #f6f7fb;
bottom: 0;
line-height: 40px;
}
}
.alarms-untreated-dialog-bottom {
.el-tabs__nav-scroll {
height: 40px;
padding-top: 10px;
padding-left: 10px;
background: #eef8ff;
.el-tabs__item {
border-top-color: #dcdfe6 !important;
}
}
}
.alarms-untreated-dialog-bottom{
.el-tabs{
.el-tabs__content{
padding:0 !important;
}
}
.alarms-untreated-dialog-bottom {
.el-tabs {
.el-tabs__content {
padding: 0 !important;
}
}
}
</style>
src/pages/alarms/untreated/index.vue
View file @ 970a1d36
......@@ -7,13 +7,13 @@
div.left_main_body
div.left_col_header 报警处理情况
el-row.row_style()
el-col(:span="8")
el-col(:span="12")
div(style="color:#F56C6C;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{status.oneCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 未处理
el-col(:span="8")
div(style="color:#E6A23C;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{status.twoCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 处理中
el-col(:span="8")
//- el-col(:span="8")
//- div(style="color:#E6A23C;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{status.twoCount}}
//- div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 处理中
el-col(:span="12")
div(style="color:#409EFF;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{status.threeCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 已处理
div.left_main_body
......@@ -48,11 +48,11 @@ export default {
activeName: '0',
level: {},
status: {},
chartData: null,
chartData: null
}
},
components: {
QueryList,
QueryList
},
created() {
this.eventList = []
......@@ -69,12 +69,12 @@ export default {
let option = {
tooltip: {
trigger: 'item',
formatter: '{b}: {c} ({d}%)',
formatter: '{b}: {c} ({d}%)'
},
legend: {
orient: 'horizontal',
bottom: 10,
data: ['特别重大', '重大', '一般'],
data: ['特别重大', '重大', '一般']
},
series: [
{
......@@ -87,7 +87,7 @@ export default {
//自定义文字
//return element.name + '：' + element.value + '(' + element.percent + '%)'
return element.percent + '%'
},
}
},
itemStyle: {
normal: {
......@@ -95,15 +95,15 @@ export default {
//自定义颜色
let colorList = ['#F56C6C', '#E6A23C', '#409EFF']
return colorList[params.dataIndex]
},
},
}
}
},
labelLine: {
show: true,
show: true
},
data: this.chartData,
},
],
data: this.chartData
}
]
}
myCharts.setOption(option)
},
......@@ -114,8 +114,8 @@ export default {
url: this.$http.adornUrlAlarm(`/alarmsInfo/queryGroupUntreated`),
method: 'get',
params: this.$http.adornParams({
stationId: localStorage.getItem('stationId'),
}),
stationId: localStorage.getItem('stationId')
})
}).then((data) => {
this.leftLoading = false
if (data && data.code === 0) {
......@@ -125,7 +125,7 @@ export default {
this.chartData = [
{ value: this.level.oneCount, name: '特别重大' },
{ value: this.level.twoCount, name: '重大' },
{ value: this.level.threeCount, name: '一般' },
{ value: this.level.threeCount, name: '一般' }
]
this.groupInit()
}
......@@ -135,8 +135,8 @@ export default {
this.$nextTick(() => {
this.$refs.queryList.init(this.activeName)
})
},
},
}
}
}
</script>
<style lang="scss" scoped>
......
src/pages/alarms/untreated/query-list.vue
View file @ 970a1d36
......@@ -11,11 +11,11 @@
el-option(label="特别重大" value=1)
el-option(label="重大" value=2)
el-option(label="一般" value=3)
el-form-item(v-if="systemType === '0'" label="报警类型:")
el-form-item(label="报警类型:")
el-select(v-model="dataForm.eventType" style="width:150px" placeholder="请选择" clearable)
el-option(v-for="(item,index) in alarmOption" :label="item.eventName" :value="item.id" :key="index")
el-form-item(label="报警状态:")
el-select(v-model="dataForm.status" style="width:150px" placeholder="请选择" clearable)
el-select(v-model="dataForm.status" style="width:100px" placeholder="请选择" clearable)
el-option(label="未处理" value=1)
el-option(label="处理中" value=2)
el-option(label="已处理" value=3)
......@@ -86,17 +86,17 @@ export default {
{ label: '资源点名称', prop: 'resourceName' },
{ label: '发生时间', prop: 'occurrenceTime', slot: true },
{ label: '发生地点', prop: 'occurrenceSite' },
{ label: '处理状态', prop: 'status', slot: true, width: 120 },
{ label: '处理状态', prop: 'status', slot: true, width: 120 }
],
tableOption: {
border: false, //是否边框
maxHeight: 500, //高度
},
maxHeight: 500 //高度
}
}
},
components: {
dragTable,
AlarmDetail,
AlarmDetail
},
watch: {
totalPage() {
......@@ -107,7 +107,7 @@ export default {
this.pageIndex = pages || 1
this.getDataList() //获取表格数据的方法
}
},
}
},
created() {
this.checkList = [...this.tableHeader]
......@@ -136,8 +136,8 @@ export default {
page: this.pageIndex,
rows: this.pageSize,
sort: sort,
order: order,
},
order: order
}
}).then((data) => {
if (data && data.code === 0) {
this.dataList = data.page.rows
......@@ -168,7 +168,7 @@ export default {
this.$http({
url: this.$http.adornUrl(`/linkEvent/list`),
method: 'post',
params: {},
params: {}
}).then((data) => {
if (data && data.code === 0) {
this.alarmOption = data.list
......@@ -199,7 +199,7 @@ export default {
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsInfo/update`),
method: 'post',
data: bean,
data: bean
}).then((data) => {
if (data && data.code === 0) {
this.$message({
......@@ -208,7 +208,7 @@ export default {
duration: 1500,
onClose: () => {
this.getDataList()
},
}
})
} else {
this.$message.error(data.msg)
......@@ -221,8 +221,8 @@ export default {
this.$nextTick(() => {
this.$refs.alarmDetail.init(bean)
})
},
},
}
}
}
</script>
<style lang="scss" scoped>
......
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