Commit 1e085c45 authored by zhanglw's avatar zhanglw

报警后台+卡调大屏测试反馈

parent c64f5fca
......@@ -51,20 +51,12 @@
<el-table-column prop="driver" label="司机" align="center"></el-table-column>
<el-table-column prop="type" label="报警类型" align="center" :formatter="baojingleixingChange"></el-table-column>
<el-table-column prop="areaName" label="报警区域" align="center"></el-table-column>
<el-table-column prop="operator" label="处理人" align="center"></el-table-column>
<el-table-column prop="handleTime" label="处理时间" align="center"></el-table-column>
<el-table-column label="解除报警" align="center">
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button size="mini" type="primary" @click="toRelieveAlarm(scope.row)" v-if="scope.row.status == 1">解除报警</el-button>
<span v-if="scope.row.status == 0">已解除报警</span>
</template>
</el-table-column>
<!-- <el-table-column label="操作" align="center" fixed="right">
<template slot-scope="scope">
<el-button size="mini" type="primary" icon="el-icon-edit" @click="toEdit(scope.row)"></el-button>
<el-button size="mini" type="danger" icon="el-icon-delete" @click="toDelete(scope.row)"></el-button>
</template>
</el-table-column> -->
</el-table>
<!--分页组件-->
<el-pagination :total="total" :current-page="page" style="margin-top: 8px;" layout="total, prev, pager, next, sizes" @size-change="sizeChange" @current-change="pageChange" />
......@@ -163,7 +155,7 @@ export default {
param1.size = 99999;
this.$nextTick(()=>{
if(this.query.createTime == undefined){
}else{
console.log(this.query.createTime);
param.startTime = this.query.createTime[0]
......@@ -392,7 +384,7 @@ export default {
.el-table .success-row {
background: #f0f9eb;
}
.device-manage{
.panel-bottom{
.el-button{margin:2px 0;padding:6px 15px;font-size:14px;}
......@@ -407,7 +399,7 @@ export default {
}
}
}
.ecahrt1-dialog{
display:flex;align-items:center;
.el-dialog{
......
<template>
<div class="common-page device-manage">
<div class="option page-row">
<!--工具栏-->
<div class="head-container">
<label class="el-form-item-label" style="font-weight: 500;">车辆牌号</label>
<el-select v-model="query.number" placeholder="车辆牌号" style="width:180px;">
<el-option v-for="(obj,index) in carInforSelectList" :label="obj.number" :value="obj.number" :key="index"></el-option>
</el-select>
<label class="el-form-item-label" style="font-weight: 500;">司机姓名</label>
<el-select v-model="query.driver" placeholder="司机姓名" style="width:180px;">
<el-option v-for="(obj,index) in driverInforSelectList" :label="obj.name" :value="obj.name" :key="index"></el-option>
</el-select>
<label class="el-form-item-label" style="font-weight: 500;">报警类型</label>
<el-select v-model="query.carclass" placeholder="请选择卡车类型" style="width:180px;">
<el-option v-for="(obj,index) in carTypeData" :label="obj.name" :value="obj.name" :key="index"></el-option>
</el-select>
<el-date-picker
v-model="query.createTime"
type="datetimerange"
value-format="yyyy-MM-dd HH:MM:SS"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
<el-button size="mini" type="success" icon="el-icon-search" @click="toSearch">搜索</el-button>
<el-button size="mini" icon="el-icon-refresh" @click="clearLimit">重置</el-button>
</div>
</div>
<!-- 表格 -->
<div class="panel-bottom page-row">
<h3>报警管理</h3>
<div class="ctin-box">
<div class="content-within">
<div class="content-fix">
<div class="toolbar">
<!-- <el-button size="mini" type="primary" icon="el-icon-plus" @click="toAdd">新增</el-button> -->
</div>
<div class="content">
<el-table :data="tableData" v-loading="loading" border style="width:auto" :row-class-name="tableRowClassName" height="64vh">
<!-- <el-table-column prop="name" label="设备编号" align="center"></el-table-column>-->
<el-table-column type="index" width="50" :index="indexMethod"></el-table-column>
<el-table-column prop="number" label="车辆牌号" align="center"></el-table-column>
<el-table-column prop="driver" label="司机" align="center"></el-table-column>
<el-table-column prop="type" label="报警类型" align="center" :formatter="baojingleixingChange"></el-table-column>
<el-table-column prop="alarmTime" label="报警时间" align="center"></el-table-column>
<el-table-column prop="carclass" label="报警原因" align="center"></el-table-column>
<el-table-column prop="areaName" label="状态" align="center"></el-table-column>
<el-table-column prop="operator" label="解除报警时间" align="center"></el-table-column>
<el-table-column prop="handleTime" label="解除报警原因" align="center"></el-table-column>
<!-- <el-table-column label="操作" align="center" fixed="right">
<template slot-scope="scope">
<el-button size="mini" type="primary" icon="el-icon-edit" @click="toEdit(scope.row)"></el-button>
<el-button size="mini" type="danger" icon="el-icon-delete" @click="toDelete(scope.row)"></el-button>
</template>
</el-table-column> -->
</el-table>
<!--分页组件-->
<el-pagination :total="total" :current-page="page" style="margin-top: 8px;" layout="total, prev, pager, next, sizes" @size-change="sizeChange" @current-change="pageChange" />
</div>
</div>
</div>
</div>
</div>
<!-- 表单渲染 -->
<el-dialog append-to-body :close-on-click-modal="true" :before-close="cancelForm" :visible.sync="form.visible" :title="form.title" width="700px">
<el-form :model="form.item" :rules="rules" ref="form1" :inline="true" size="small" label-width="150px">
<el-form-item label="报警名称" prop="name">
<el-input v-model="form.item.name" style="width:280px;" placeholder="请输入报警名称"/>
</el-form-item>
<el-form-item label="报警编码" prop="code">
<el-input v-model="form.item.code" style="width:280px;" placeholder="请输入车牌号"/>
</el-form-item>
<el-form-item label="报警状态" prop="status">
<el-select v-model="form.item.status" placeholder="请选择报警状态" style="width:280px;">
<el-option label="正常" value="正常"></el-option>
<el-option label="故障" value="故障"></el-option>
</el-select>
</el-form-item>
<el-form-item label="终端车辆类型" prop="carclass">
<el-select v-model="form.item.carclass" placeholder="请选择终端车辆类型" style="width:280px;">
<el-option label="卡车" value="卡车"></el-option>
<el-option label="铲车" value="铲车"></el-option>
</el-select>
</el-form-item>
<el-form-item label="安装车辆" prop="carname">
<el-select v-model="form.item.carname" placeholder="请选择安装车辆" style="width:280px;">
<el-option :label="item.name + '/' + item.number" :value="item.name + '/' + item.number" v-for="(item,index) in selectList" :key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input type="textarea" v-model="form.item.remarks" style="width:280px;"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancelForm">取消</el-button>
<el-button :loading="form.status.cu === 2" type="primary" @click="submitForm('form1', form.item)">确认</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { Tools, HttpReq, Dates} from '@/assets/js/common.js';
export default {
name: 'CallPoliceLog',
components: {},
data() {
return {
loading: false,
page: 1,
size: 10,
total: 0,
query:{},
tableData: [],
selectList:[],
//车辆类型数据
carTypeData:[],
//车辆信息数据
carInforSelectList:[],
//司机信息数据
driverInforSelectList:[],
form: {
title:'新增报警',
visible:false,
reqType:'add',
status:{cu:0},
item:{},
},
rules: {
// number: [
// {required: true, message: '请输入车牌号', trigger: 'blur' }
// ],
},
}
},
mounted() {
this.loadData();
},
methods: {
indexMethod(index) {
return 1+index+this.page*this.size-this.size;
},
loadData() {
var param = {...this.query};
param.page = this.page - 1;
param.size = this.size;
param.sort = 'alarmTime,desc';
var param1 = {...this.query};
param1.page = 0;
param1.size = 99999;
this.$nextTick(()=>{
if(this.query.createTime == undefined){
}else{
console.log(this.query.createTime);
param.startTime = this.query.createTime[0]
param.endTime = this.query.createTime[1]
param1.startTime = this.query.createTime[0]
param1.endTime = this.query.createTime[1]
}
//获取报警信息
if(param.createTime){
delete param.createTime
}
if(param1.createTime){
delete param1.createTime
}
HttpReq.truckDispatching.apiMineAlarmHistoryLbQuery(param).then((res) => {
this.loading = false;
this.tableData = res.data;
})
HttpReq.truckDispatching.apiMineAlarmHistoryLbQuery(param1).then((res) => {
this.total = res.data.length;
})
//获取车辆类型
HttpReq.truckDispatching.carTypeQuery({size:9999}).then((res) => {
if(res.code == 200){
this.carTypeData = res.data.content;
}
})
//获取车辆信息
HttpReq.truckDispatching.carInformationQuery({size:9999}).then((res) => {
if(res.code == 200){
this.carInforSelectList = res.data.content;
}
})
//获取司机人员信息
HttpReq.truckDispatching.driverManagementPCQuery({size:9999}).then((res) => {
if(res.code == 200){
this.driverInforSelectList = res.data.content;
}
})
})
},
tableRowClassName({row, rowIndex}) {
if (rowIndex === 1) {
return 'warning-row';
} else if (rowIndex === 3) {
return 'success-row';
}
return '';
},
cancelForm(a, b, c){
this.form.visible = false;
},
// 点击搜索
toSearch() {
this.page = 1;
this.loadData();
},
// 重置搜索
clearLimit(){
this.query = {};
this.loadData()
},
toAdd() {
// 请除表单验证
this.$refs['form1'] && this.$refs['form1'].clearValidate();
this.form.title = '新增报警';
this.form.status.cu = 0;
this.form.visible = true;
this.form.reqType = 'add';
this.form.item = {};
},
toEdit(item) {
// 请除表单验证
this.$refs['form1'] && this.$refs['form1'].clearValidate();
this.form.title = '修改报警';
this.form.status.cu = 0;
this.form.visible = true;
this.form.item = {...item};
this.form.reqType = 'edit';
},
toDelete(item) {
var id = item.id;
this.$confirm('确认删除该条数据吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then((e) => {
this.reqRemoveProject([id])
}).catch((e) => {})
},
pageChange(e) {
this.page = e
this.loadData()
},
sizeChange(e) {
this.page = 1
this.size = e
this.loadData()
},
submitForm(validateName, item){
if(!this.form.status.cu){
this.form.status.cu = 2;
this.$refs[validateName].validate(valid => {
if(valid){
if(this.form.reqType === 'add'){
this.reqAddItem(this.form, item)
}else{
this.reqUpdateItem(this.form, item)
}
}else{
this.form.status.cu = 0
}
});
}
},
//新增报警
reqAddItem(form, item){
let lastData = {...item};
HttpReq.truckDispatching.callPoliceHistroyAdd(lastData).then((res) => {
form.visible = false;
if(res.code == 200){
this.$notify({
title: '报警新增成功!',
type: 'success',
duration: 2500
});
this.loadData()
}else{
this.$notify({
title: res.msg,
type: 'error',
duration: 2500
})
}
}).catch(function(error) {
form.status.cu = 0
});
},
//修改报警
reqUpdateItem(form, item){
let lastData = {...item};
HttpReq.truckDispatching.callPoliceHistroyUpdate(lastData).then((res) => {
form.visible = false;
if(res.code == 200){
this.$notify({
title: '报警修改成功!',
type: 'success',
duration: 2500
});
this.loadData()
}else{
this.$notify({
title: res.msg,
type: 'error',
duration: 2500
})
}
}).catch(function(error) {
form.status.cu = 0
});
},
//删除报警
reqRemoveProject(item){
HttpReq.truckDispatching.callPoliceHistroyDel(item).then((res) => {
if(res.status == 400){
this.$notify({
title: res.msg,
type: 'error',
duration: 2500
})
}else{
this.$notify({
title: '删除成功!',
type: 'success',
duration: 2500
});
}
this.loadData();
})
},
//解除报警提示
toRelieveAlarm(item){
this.$confirm('确认解除报警吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then((e) => {
this.relieveAlarm(item)
}).catch((e) => {})
},
//解除报警
relieveAlarm(item){
let lastData = {...item};
lastData.status = 0;
HttpReq.truckDispatching.callPoliceHistroyUpdate(lastData).then((res) => {
if(res.code == 200){
this.$notify({
title: '报警解除成功!',
type: 'success',
duration: 2500
});
this.loadData()
}else{
this.$notify({
title: res.msg,
type: 'error',
duration: 2500
})
}
}).catch(function(error) {
form.status.cu = 0
});
},
baojingleixingChange(row){
return row.type == '1' ? '限入电子围栏报警' : row.type == '2' ? '限出电子围栏报警' : row.type == '3' ? '无故停车报警' : row.type == '4' ? '防碰撞报警' : '其他报警';
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scope>
.el-table .warning-row {
background: oldlace;
}
.el-table .success-row {
background: #f0f9eb;
}
.device-manage{
.panel-bottom{
.el-button{margin:2px 0;padding:6px 15px;font-size:14px;}
.btn-groub2{
display:inline-block;
.el-button{margin:2px 0;padding:6px 15px;font-size:15px;}
.el-button--warning {
background-color: #e6a23c;
border-color: #e6a23c;
}
.el-button--warning:focus,.el-button--warning:hover{background:#ebb563;border-color:#ebb563;}
}
}
}
.ecahrt1-dialog{
display:flex;align-items:center;
.el-dialog{
margin-top:inherit !important;display:table !important;width:fit-content;
.el-form-item{margin-right:0;}
}
.el-dialog__header{height:0;padding:0;display:block;}
.form-body{
border:1px solid #999;width:800px;height:500px;position:relative;
>div{position:absolute;top:0;left:0;height:100%;width:100%;}
}
}
</style>
......@@ -3,6 +3,7 @@
<!-- 头部标题 -->
<div class="top_title">
<div class="top_titl_left">
<div></div>
<div v-for="(item,index) in topSmallTitleLeftData" :key="index" style="cursor: pointer;" @click="changeOver(item)">
<div :class="selectModule == item.componentName ? 'top_titl_left_textStyle2' : 'top_titl_left_textStyle1' ">{{item.title}}</div>
<img src="../../assets/images/cutGraph/light7.png" width="85" style="margin-top:-1vh;" v-if="selectModule == item.componentName">
......@@ -182,10 +183,10 @@ export default {
let array1 = res.data.content.sort(function(a,b){
return parseInt(a.dsort) - parseInt(b.dsort);
});
for(let i = 0 ; i<3 ; i++){
for(let i = 0 ; i<2 ; i++){
leftTemporaryData.push(array1[i]);
}
for(let j = 3 ; j<res.data.totalElements ; j++){
for(let j = 2 ; j<res.data.totalElements ; j++){
rightTemporaryData.push(array1[j]);
}
this.topSmallTitleLeftData = leftTemporaryData;
......
......@@ -14,7 +14,7 @@
<el-table :data="tableData" v-loading="loading" border style="width:auto" :row-class-name="tableRowClassName">
<el-table-column prop="name" label="采点名称" align="center"></el-table-column>
<el-table-column prop="areaName" label="所属采区" align="center"></el-table-column>
<el-table-column prop="areashovel" label="铲车名称" align="center"></el-table-column>
<!-- <el-table-column prop="areashovel" label="铲车名称" align="center"></el-table-column>-->
<el-table-column prop="arearesources" label="矿种" align="center"></el-table-column>
<el-table-column prop="areaore" label="是否配矿" align="center"></el-table-column>
<el-table-column prop="areapriority" label="优先级" align="center"></el-table-column>
......@@ -45,11 +45,11 @@
<el-option v-for="(obj,index) in caidianAreaInformationData" :label="obj.name" :value="obj.name" :key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="铲车" prop="areashovel">
<el-select v-model="form.item.areashovel" multiple placeholder="请选择铲车" style="width:280px;">
<el-option v-for="(obj,index) in dianchanCarInformationData" :label="obj.number" :value="obj.number" :key="index">{{obj.number}}</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="铲车" prop="areashovel">-->
<!-- <el-select v-model="form.item.areashovel" multiple placeholder="请选择铲车" style="width:280px;">-->
<!-- <el-option v-for="(obj,index) in dianchanCarInformationData" :label="obj.number" :value="obj.number" :key="index">{{obj.number}}</el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="矿种" prop="arearesources">
<el-select v-model="form.item.arearesources" placeholder="请选择矿种" style="width:280px;">
<el-option label="废石" value="废石"></el-option>
......@@ -141,16 +141,16 @@ export default {
name: [
{required: true, message: '请输入采点名称', trigger: 'blur' }
],
areashovel: [
{required: true, message: '请选择铲车', trigger: 'change' }
],
// areashovel: [
// {required: true, message: '请选择铲车', trigger: 'change' }
// ],
areaName: [
{required: true, message: '请选择所属采区', trigger: 'change' }
],
},
//品味设置数据
dialogTableVisible: false,
gridData: [],
......@@ -180,7 +180,7 @@ export default {
param.page = this.page - 1;
param.size = this.size;
param.sort = sort;
this.$nextTick(()=>{
HttpReq.truckDispatching.RegionalCaiDianQuery(param).then((res) => {
if(res.code == 200){
......@@ -209,7 +209,7 @@ export default {
return 'success-row';
}
return '';
},
},
cancelForm(a, b, c){
this.form.visible = false;
},
......@@ -225,9 +225,9 @@ export default {
},
toEdit(item) {
// 请除表单验证
this.form.item.areashovel = this.dianchanCarInformationData.map(function(v) {
return v.number;
});
// this.form.item.areashovel = this.dianchanCarInformationData.map(function(v) {
// return v.number;
// });
this.$refs['form1'] && this.$refs['form1'].clearValidate();
this.form.title = '修改采点';
this.form.status.cu = 0;
......@@ -257,7 +257,7 @@ export default {
submitForm(validateName, item){
if(!this.form.status.cu){
this.form.status.cu = 2;
item.areashovel = item.areashovel.toLocaleString();
// item.areashovel = item.areashovel.toLocaleString();
this.$refs[validateName].validate(valid => {
if(valid){
if(this.form.reqType === 'add'){
......@@ -357,7 +357,7 @@ export default {
}
}
})
},
......@@ -373,7 +373,7 @@ export default {
var param = {};
param.sort = sort;
param.areaId = this.gradeQueryId;
this.$nextTick(()=>{
HttpReq.truckDispatching.RegionalInformationGradeQuery(param).then((res) => {
if(res.code == 200){
......@@ -511,7 +511,7 @@ export default {
.el-table .success-row {
background: #f0f9eb;
}
.device-manage{
.panel-bottom{
.el-button{margin:2px 0;padding:6px 15px;font-size:14px;}
......@@ -526,7 +526,7 @@ export default {
}
}
}
.ecahrt1-dialog{
display:flex;align-items:center;
.el-dialog{
......
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