314 lines
7.0 KiB
Vue
314 lines
7.0 KiB
Vue
<template>
|
||
<view class="event-handle">
|
||
<uni-nav-bar @clickLeft="goBack()" class="nav-bar" height="110rpx" leftWidth="200rpx" leftText="报警处理"
|
||
leftIcon="left" border backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
|
||
|
||
<block>
|
||
<view class="event-info">
|
||
<view class="form-item">
|
||
<view class="form-left">
|
||
<text class="form-left-text">{{eventDetail.voice_msg}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<view class="form-left">
|
||
<text class="form-left-text">事件类型：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-for="cate in eventDetail.cates_">{{cate.name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<view class="form-left">
|
||
<text class="form-left-text">事件对象：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-if="eventDetail.obj_cate==='opl'">作业</view>
|
||
<view v-else-if="eventDetail.obj_cate==='people'">人员</view>
|
||
<view v-else>其他</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<view class="form-left">
|
||
<text class="form-left-text">报警区域：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-if="eventDetail.area_!=null">{{eventDetail.area_.name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item" v-if="eventDetail.obj_cate==='people'">
|
||
<view class="form-left">
|
||
<text class="form-left-text">触发人：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-if="eventDetail.employee_!=null">{{eventDetail.employee_.name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item" v-if="eventDetail.obj_cate==='people'">
|
||
<view class="form-left">
|
||
<text class="form-left-text">触发人部门：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-if="eventDetail.employee_!=null">{{eventDetail.employee_.belong_dept_name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item" v-if="eventDetail.obj_cate==='opl'">
|
||
<view class="form-left">
|
||
<text class="form-left-text">触发事件：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view v-if="eventDetail.opl_nmae">{{eventDetail.operation_name}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item">
|
||
<view class="form-left">
|
||
<text class="form-left-text">触发时间：</text>
|
||
</view>
|
||
<view class="form-right">
|
||
<view>{{eventDetail.create_time}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="form-item" v-if="eventDetail.global_img!==null&&eventDetail.global_img!==undefined">
|
||
<view class="form-left form-left-img">
|
||
<text class="form-left-text">事件截图：</text>
|
||
</view>
|
||
<view class="form-right" style="">
|
||
<image fit="cover" class="form-img" :src="eventDetail.global_img"></image>
|
||
<image fit="cover" class="form-img form-img-face" v-if="eventDetail.face_img!==null&&eventDetail.face_img!==undefined" :src="eventDetail.face_img"></image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view class="event-info">
|
||
<view class="form-item" style="height: 300rpx;">
|
||
<view class="form-left-text">
|
||
<text class="star">*</text>
|
||
<text>处理描述</text>
|
||
</view>
|
||
<textarea class="apply-reason-text" v-model="form.handle_desc" maxlength="250" placeholder="请输入处理意见" />
|
||
</view>
|
||
<view class="form-item">
|
||
<view class="form-left-text">
|
||
<text class="star">*</text>
|
||
<text>事件标记</text>
|
||
</view>
|
||
<radio-group @change="radioChange">
|
||
<label class="radio">
|
||
<radio value="10" />正常
|
||
</label>
|
||
<label class="radio">
|
||
<radio value="20" />误报
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
<view class="btn" style="display: flex;justify-content: space-between;margin-top: 20rpx;">
|
||
<button class="mini-btn" size="mini" type="primary" @click="eventHandle">处理</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "eventHandle",
|
||
data() {
|
||
return {
|
||
form: {
|
||
handle_desc: '',
|
||
mark: 10
|
||
},
|
||
eventId: null,
|
||
eventDetail: {},
|
||
}
|
||
},
|
||
computed: {
|
||
startDate() {
|
||
return this.getDate('start');
|
||
},
|
||
endDate() {
|
||
return this.getDate('end');
|
||
}
|
||
},
|
||
onLoad(params) {
|
||
debugger;
|
||
console.log(params)
|
||
this.eventId = params.eventId;
|
||
// that.type = params.type;
|
||
},
|
||
onShow() {
|
||
this.getEventItem();
|
||
},
|
||
methods: {
|
||
//报警详情
|
||
getEventItem() {
|
||
this.$u.api.eventtItem(this.eventId).then((res) => {
|
||
this.eventDetail = res;
|
||
if(res.global_img){
|
||
res.global_img = this.vuex_host + res.global_img
|
||
}
|
||
if(res.face_img){
|
||
res.face_img = this.vuex_host + res.face_img
|
||
}
|
||
debugger;
|
||
console.log(res)
|
||
});
|
||
},
|
||
|
||
eventHandle() {
|
||
debugger;
|
||
console.log(this.form)
|
||
this.$u.api.eventtHandle(this.eventId, this.form).then(res => {
|
||
if (res.err_msg) {} else {
|
||
|
||
}
|
||
})
|
||
},
|
||
goBack() {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
/* 主体 */
|
||
>>>.uni-navbar__header,
|
||
>>>.uni-status-bar {
|
||
background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%), linear-gradient(#e60012, #e60012) !important;
|
||
}
|
||
|
||
.handleBtn {
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.event-handle {
|
||
background-color: #f3fbff;
|
||
padding-bottom: 227rpx;
|
||
}
|
||
|
||
|
||
>>>.uni-navbar-btn-text text {
|
||
font-size: 32rpx !important;
|
||
}
|
||
|
||
.event-info {
|
||
width: 720rpx;
|
||
margin: 0 auto;
|
||
background-color: #FFFFFF;
|
||
border-radius: 10rpx;
|
||
padding: 25rpx 32rpx;
|
||
box-sizing: border-box;
|
||
margin-top: 24rpx;
|
||
}
|
||
|
||
.star {
|
||
color: red;
|
||
}
|
||
|
||
.top-title-text {
|
||
padding-left: 24rpx;
|
||
position: relative;
|
||
font-family: PingFang-SC-Medium;
|
||
font-size: 34rpx;
|
||
line-height: 72rpx;
|
||
color: #383838;
|
||
}
|
||
|
||
.top-title-text::before {
|
||
content: "";
|
||
width: 6rpx;
|
||
height: 29rpx;
|
||
background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%);
|
||
border-radius: 3rpx;
|
||
display: block;
|
||
position: absolute;
|
||
left: -4rpx;
|
||
top: 22rpx;
|
||
}
|
||
|
||
.form-item {
|
||
font-family: PingFang-SC-Medium;
|
||
font-size: 30rpx;
|
||
min-height: 80upx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
}
|
||
|
||
.form-left-img {
|
||
height: 80upx;
|
||
line-height: 80upx;
|
||
}
|
||
|
||
.form-left-text {
|
||
color: #212121;
|
||
}
|
||
|
||
.form-right {
|
||
margin-left: 20rpx;
|
||
flex: 1;
|
||
color: #414141;
|
||
}
|
||
|
||
.form-right input {
|
||
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.form-right {
|
||
flex: 1;
|
||
color: #414141;
|
||
}
|
||
|
||
.form-date>>>.uni-date__x-input {
|
||
height: 97rpx;
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.form-date>>>.uni-icons {
|
||
display: none;
|
||
}
|
||
|
||
.event-handle>>>uni-input {
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.apply-reason-text {
|
||
width: 653rpx;
|
||
height: 179rpx;
|
||
background-color: #f6f8fc;
|
||
border: solid 1rpx #e5e5e5;
|
||
margin-top: 21rpx;
|
||
padding: 14rpx 24rpx;
|
||
font-size: 26rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.apply_require {
|
||
margin-top: 0rpx !important;
|
||
}
|
||
|
||
.form-img {
|
||
/* width: 600upx; */
|
||
height: 300upx;
|
||
}
|
||
.form-img-face{
|
||
width: 250upx;
|
||
}
|
||
/* radios */
|
||
|
||
uni-radio-group {
|
||
margin-left: 30upx;
|
||
}
|
||
|
||
.uni-label-pointer {
|
||
width: 150upx;
|
||
display: inline-block;
|
||
}
|
||
</style>
|