forked from dyf/dyf-vue-ui
6170控制面板添加解除报警逻辑
This commit is contained in:
@ -42,7 +42,8 @@ export interface DeviceDetail {
|
||||
name: string; // 姓名
|
||||
code: string; // ID(身份证/工号)
|
||||
};
|
||||
chargeState: string
|
||||
chargeState: string;
|
||||
alarmStatus:number
|
||||
}
|
||||
// 定义灯光模式的类型接口
|
||||
export interface LightMode {
|
||||
|
||||
@ -5,6 +5,7 @@ export interface deviceQuery extends PageQuery {
|
||||
deviceType: string;
|
||||
deviceStatus: string;
|
||||
bluetoothName?: string; // 蓝牙名称查询字段
|
||||
onlineStatus?: string;
|
||||
}
|
||||
|
||||
export interface deviceForm {
|
||||
|
||||
4
src/assets/icons/svg/home.svg
Normal file
4
src/assets/icons/svg/home.svg
Normal 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 |
@ -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 }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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">
|
||||
|
||||
@ -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) {
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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) => {
|
||||
@ -924,14 +932,14 @@ const handleImportSuccess = (response: any) => {
|
||||
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(); // 初始化列表数据
|
||||
|
||||
@ -201,6 +201,6 @@ onUnmounted(() => {
|
||||
|
||||
.chartRef {
|
||||
width: 100%;
|
||||
height: 24vh;
|
||||
height: 25vh;
|
||||
}
|
||||
</style>
|
||||
@ -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>
|
||||
|
||||
Reference in New Issue
Block a user