6170控制面板添加解除报警逻辑

This commit is contained in:
fengerli
2025-10-09 11:40:21 +08:00
parent 2dca6e3ff8
commit 8e552df724
12 changed files with 140 additions and 36 deletions

View File

@ -42,7 +42,8 @@ export interface DeviceDetail {
name: string; // 姓名
code: string; // ID身份证/工号)
};
chargeState: string
chargeState: string;
alarmStatus:number
}
// 定义灯光模式的类型接口
export interface LightMode {

View File

@ -5,6 +5,7 @@ export interface deviceQuery extends PageQuery {
deviceType: string;
deviceStatus: string;
bluetoothName?: string; // 蓝牙名称查询字段
onlineStatus?: string;
}
export interface deviceForm {

View File

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="_图层_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.99 18">
<path id="_矢量_42" d="M17.82,5.81L9.5.08c-.16-.11-.38-.11-.54,0L.2,5.81c-.13.08-.2.21-.2.35v11.41c0,.24.21.43.46.43h5.54c.25,0,.46-.19.46-.43v-2.48c0-1.42,1.17-2.65,2.68-2.69,1.57-.04,2.85,1.13,2.85,2.58v2.59c0,.24.21.43.46.43h5.08c.25,0,.46-.19.46-.43V6.15c0-.14-.06-.26-.18-.35h.01Z"/>
</svg>

After

Width:  |  Height:  |  Size: 417 B

View File

@ -43,7 +43,7 @@ export const constantRoutes: RouteRecordRaw[] = [
path: "/homeIndex",
name: "HomeIndex",
component: () => import("@/views/homeIndex/index.vue"),
meta: {title: '数据大屏', icon: 'dashboard', preload: true, keepAlive: true },
meta: {title: '数据大屏', icon: 'home', preload: true, keepAlive: true },
},
{
path: '',
@ -54,7 +54,7 @@ export const constantRoutes: RouteRecordRaw[] = [
path: '/index',
component: () => import('@/views/index.vue'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix: true, keepAlive: false }
meta: { title: '首页', icon: 'home', affix: true, keepAlive: false }
}
]
},

View File

@ -6,7 +6,7 @@
<div>设备型号{{ deviceDetail.deviceImei }}</div>
<div class="device-status">设备状态
<span :class="{ online: deviceDetail.onlineStatus === 1, offline: deviceDetail?.onlineStatus === 0 }">
{{ deviceDetail.onlineStatus === 1 ? "在线" : "离线" }}
{{ deviceDetail.onlineStatus === 1 ? '在线' : (deviceDetail.onlineStatus === 2 ? '故障' : '离线') }}
</span>
</div>
<div>电量{{ deviceDetail.batteryPercentage || 0 }}%</div>
@ -15,6 +15,14 @@
<!-- 主体内容区域 -->
<div class="content-wrapper">
<el-row :gutter="20" class="content-row" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'" >
<el-col :lg="24" :xs="24">
<div class="staticRwo" :class="deviceDetail.alarmStatus == 1 ? '' : 'displayNone'"
@click="showClose()">
设备强制报警中!
</div>
</el-col>
</el-row>
<!-- 第一行灯光模式 + 灯光亮度强制报警位置信息 -->
<el-row :gutter="20" class="content-row">
<el-col :lg="16" :xs="24">
@ -50,8 +58,8 @@
:loading-text="lightModesLoading ? '保存中...' : '保存'"> {{
lightModesLoading ? '保存中' : '保存' }}</el-button>
</div>
<el-button type="danger" class="alarm-btn" @click="forceAlarm" :loading="forceAlarmLoading"
:loading-text="forceAlarmLoading ? '报警中...' : '强制报警'"> {{
<el-button type="danger" class="alarm-btn" @click="forceAlarm" :loading="forceAlarmLoading" v-if="deviceDetail.alarmStatus === 0 || deviceDetail.alarmStatus === null"
:loading-text="forceAlarmLoading ? '报警中...' : '强制报警'" > {{
forceAlarmLoading ? '报警中' : '强制报警' }}</el-button>
</div>
<div class="content-card_gps">
@ -248,7 +256,8 @@ const deviceDetail = ref<DeviceDetail & { typeName: string }>({
address: '',
sendMsg: '',
chargeState: '0',
typeName: ''
typeName: '',
alarmStatus: 0
});
// 保留原有的操作中标志位
const isUpdatingStatus = ref(false);
@ -357,7 +366,7 @@ const handleLaserClick = async () => {
laserMode.value.switchStatus = !targetStatus;
}
} catch (error: any) {
proxy?.$modal.msgError(error.msg) ;
proxy?.$modal.msgError(error.msg);
// 恢复之前的状态
laserMode.value.switchStatus = !laserMode.value.switchStatus;
} finally { }
@ -425,6 +434,51 @@ const saveBtn = () => {
})
}
// 解除报警
const showClose = async () => {
try {
await proxy?.$modal.confirm('确定要对该设备解除报警?', '提示');
// 2. 准备请求数据
const batchId = generateShortId();
let data = {
deviceIds: [route.params.deviceId],
typeName: deviceDetail.value.typeName,
deviceImeiList: [deviceDetail.value.deviceImei],
batchId: batchId,
instructValue: '0', //强制报警1解除报警0
}
const registerRes = await api.sendAlarmMessage(data);
if (registerRes.code !== 200) {
proxy?.$modal.msgWarning(registerRes.msg)
return
}
// 4. 获取设备状态
let deviceImei = deviceDetail.value.deviceImei
const statusRes = await getDeviceStatus({
functionMode: 2,
batchId,
typeName: 'FunctionAccessBatchStatusRule',
deviceImei,
interval: 500
},
api.deviceRealTimeStatus
);
// 只有当状态为'OK'时才显示成功弹窗
if (statusRes.data.functionAccess === 'OK') {
proxy?.$modal.msgSuccess(statusRes.msg);
await getList();
}
} catch (error: any) {
}
}
// 强制报警
const forceAlarm = async () => {
try {
@ -458,10 +512,12 @@ const forceAlarm = async () => {
// 只有当状态为'OK'时才显示成功弹窗
if (statusRes.data.functionAccess === 'OK') {
proxy?.$modal.msgSuccess(statusRes.msg);
await getList();
}
} catch (error: any) {
proxy?.$modal.msgWarning(error.msg)
forceAlarmLoading.value = false;
} finally {
forceAlarmLoading.value = false;
@ -586,8 +642,12 @@ const handleDeviceMessage = (msg: any) => {
deviceDetail.value.batteryRemainingTime = deviceState[5]; //续航时间
// getList(); // 重新获取设备详情
if (deviceDetail.value.batteryPercentage < 20 && Number(deviceDetail.value.chargeState) == 0) {
centerDialogVisible.value=true
centerDialogVisible.value = true
}
break;
case 7:
deviceDetail.value.alarmStatus = deviceState[1];
break;
default:
// 其他类型消息(不处理,仅打印)
@ -638,12 +698,13 @@ onUnmounted(() => {
</script>
<style lang="scss" scoped>
.p-2{
background: rgba(247, 248, 252, 1);
min-height: 100vh;
box-sizing: border-box;
padding: 15px;
.p-2 {
background: rgba(247, 248, 252, 1);
min-height: 100vh;
box-sizing: border-box;
padding: 15px;
}
.device-page {
.header-bar {
border-radius: 8px;
@ -948,4 +1009,23 @@ onUnmounted(() => {
width: 52px;
height: 28px;
}
.staticRwo {
border-radius: 8px;
box-shadow: 0 2px 12px rgba(0, 34, 96, 0.1);
background: white;
border: 1px solid #ebeef5;
height: auto;
line-height: 36px;
box-sizing: border-box;
text-indent: 15px;
color: #ff0000;
font-weight: bold;
font-size: 17px;
margin-bottom: 5px;
}
.displayNone {
display: none !important;
}
</style>

View File

@ -20,7 +20,7 @@
<el-col :lg="24" :xs="24">
<div class="staticRwo" :class="deviceDetail.sta_ShakeBit == 1 ? '' : 'displayNone'">设备静止报警中!</div>
<div class="staticRwo" :class="deviceDetail.staSOSGrade == 1 ? '' : 'displayNone'" @click="showClose()">
设备强制报警中,<span v-show="Status.timeOut>0">{{ Status.timeOut }}S</span>!
设备强制报警中<span v-show="Status.timeOut>0">{{ Status.timeOut }}S</span>!
</div>
</el-col>
</el-row>

View File

@ -130,6 +130,12 @@
<div class="normal red" v-if="scope.row.bindingStatus == 0">未绑定</div>
</template>
</el-table-column>
<el-table-column label="报警状态" align="center" prop="alarmStatus">
<template #default="scope">
<div class="normal red" v-if="scope.row.alarmStatus == 1">报警中</div>
<div class="normal green" v-if="scope.row.alarmStatus == 0">未报警</div>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="180" class-name="small-padding fixed-width">
<template #default="scope">

View File

@ -562,7 +562,7 @@ function SaveMultiData() {
// return api.uploadBoot(formData);
// }
// 上传开机画面根据类型适配不同的上传接口其他类型暂且默认670
function updaeLogo(ids, file, deviceType?: number,) {
function updaeLogo(ids, file, deviceType?: number) {
const selectedRows = getSelectionRows(grid);
let realDeviceType = 670; // 默认670
if (selectedRows.length > 0) {

View File

@ -131,7 +131,11 @@
<div>{{ scope.row.deviceImei }} {{ scope.row.deviceMac }}</div>
</template>
</el-table-column>
<el-table-column label="报警地点" align="center" prop="location" show-overflow-tooltip/>
<el-table-column label="报警地点" align="center" prop="location" show-overflow-tooltip>
<template #default="scope">
<div>{{ scope.row.location && scope.row.location !== '[]' ? scope.row.location : '无' }}</div>
</template>
</el-table-column>
<el-table-column label="报警事项" align="center" prop="deviceAction">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.deviceAction == 0">强制报警</el-tag>

View File

@ -12,7 +12,7 @@
<el-form-item label="设备MAC" prop="deviceMac">
<el-input v-model="queryParams.deviceMac" placeholder="请输入设备MAC" clearable />
</el-form-item>
<el-form-item label="请输入设备IMEI" prop="deviceImei">
<el-form-item label="设备IMEI" prop="deviceImei">
<el-input v-model="queryParams.deviceImei" placeholder="请输入设备IMEI" clearable />
</el-form-item>
<el-form-item label="设备类型" prop="deviceType">
@ -27,6 +27,13 @@
<el-option label="失效" value="0" />
</el-select>
</el-form-item>
<el-form-item label="在线状态" prop="onlineStatus">
<el-select v-model="queryParams.onlineStatus" placeholder="在线状态" style="margin-left: 10px">
<el-option label="在线" value="1" />
<el-option label="离线" value="0" />
<el-option label="故障" value="2" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD HH:mm:ss" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
@ -88,7 +95,7 @@
<el-popover placement="right" trigger="click">
<template #reference>
<img v-if="scope.row.devicePic" :src="scope.row.devicePic"
style="width: 40px; height: 40px; cursor: pointer; object-fit: contain"
style="width: 50px; height: 50px; cursor: pointer; object-fit: contain"
class="hover:opacity-80 transition-opacity" />
<img v-else src="@/assets/index/IMG.png" alt="" style="width: 40px; height: 40px;">
</template>
@ -107,10 +114,10 @@
</el-tag>
</template>
</el-table-column>
<el-table-column prop="onlineStatus" label="设备状态">
<el-table-column prop="onlineStatus" label="设备状态">
<template #default="scope">
<el-tag :type="scope.row.onlineStatus === 1 ? 'success' : 'info'">
{{ scope.row.onlineStatus === 1 ? '在线' : '离线' }}
{{ scope.row.onlineStatus === 1 ? '在线' : (scope.row.onlineStatus === 2 ? '故障' : '离线') }}
</el-tag>
</template>
</el-table-column>
@ -451,7 +458,8 @@ const initData: PageData<deviceForm, deviceQuery> = {
deviceMac: '',
deviceImei: '',
deviceType: '',
deviceStatus: ''
deviceStatus: '',
onlineStatus:''
},
rules: {
deviceName: [{ required: true, message: '请输入设备名称', trigger: 'blur' }],
@ -711,17 +719,17 @@ const httpRequestImg = (parm): Promise<any> => {
return Promise.resolve();
};
const beforeUpload = (file) => {
const isLt2M = file.size / 1024 / 1024 < 2;
//const isLt2M = file.size / 1024 / 1024 < 2;
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
if (!isJPG) {
ElMessage.warning('请上传jpg、png格式大小不超过2M的照片');
ElMessage.warning('请上传jpg、png格式');
return false;
}
if (!isLt2M) {
ElMessage.warning('大小不超过2M的照片片');
return false;
}
return isJPG && isLt2M;
// if (!isLt2M) {
// ElMessage.warning('大小不超过2M的照片片');
// return false;
// }
return isJPG;
};
// 文件上传状态改变时触发
const fileUploadChange = (files, fileList) => {
@ -922,16 +930,16 @@ const handleImportSuccess = (response: any) => {
if (response.code == 200) {
console.log('导入成功了么');
importResult.value.isShow = true;
if (response.data) {
console.log(response.data,'response.data');
console.log(response.data, 'response.data');
importResult.value.succeed = response.data.successCount;
importResult.value.errorSun = response.data.failureCount;
importResult.value.total = importResult.value.succeed + importResult.value.errorSun;
importResult.value.link = response.data.errorExcelUrl;
}
if (importUpload.value) {
if (importUpload.value) {
importUpload.value.clearFiles();
}
getList(); // 初始化列表数据

View File

@ -201,6 +201,6 @@ onUnmounted(() => {
.chartRef {
width: 100%;
height: 24vh;
height: 25vh;
}
</style>

View File

@ -16,7 +16,7 @@
<div class="item-cell alarm-event">
{{ getEventName(item.deviceAction) }}
</div>
<div class="item-cell loaction">{{ item.location }}</div>
<div class="item-cell loaction"> {{ item.location && item.location !== '[]' ? item.location : '无' }}</div>
</div>
<div v-for="(item, index) in displayData" :key="`second-${getKey(item, index)}`" class="alarm-item">
<div class="item-cell">{{ item.startTime }}</div>
@ -25,7 +25,7 @@
<div class="item-cell alarm-event">
{{ getEventName(item.deviceAction) }}
</div>
<div class="item-cell loaction">{{ item.location }}</div>
<div class="item-cell loaction"> {{ item.location && item.location !== '[]' ? item.location : '无' }}</div>
</div>
</div>
</div>