更新页面,对接接口

This commit is contained in:
2026-04-23 19:58:52 +08:00
parent 76819af5ad
commit 5766bfaff5
8 changed files with 216 additions and 244 deletions

View File

@ -23,7 +23,7 @@ export function getTrafficEventDetail(taskId) {
return service({ return service({
url: `/traffic/eventTask/detail/${taskId}`, url: `/traffic/eventTask/detail/${taskId}`,
// url: `/traffic/event/info/2/${taskId}`, // url: `/traffic/event/info/2/${taskId}`,
method: 'get' method: 'get',
}); });
} }

View File

@ -102,8 +102,7 @@ function _idCardlogin() {
isLoading.value = true; isLoading.value = true;
// form.userName = userinfo.app_sfzh; // form.userName = userinfo.app_sfzh;
const encryptedIdCard = encryptAES(sfzh); const encryptedIdCard = encryptAES(sfzh);
idCardlogin({ username: encryptedIdCard }) idCardlogin({ username: encryptedIdCard }).then((res) => {
.then((res) => {
if(res){ if(res){
const token = res.accessToken; const token = res.accessToken;

View File

@ -9,20 +9,8 @@
<!-- 预警类型切换按钮 --> <!-- 预警类型切换按钮 -->
<div class="type-tabs"> <div class="type-tabs">
<button <button class="type-tab" :class="{ active: activeAlertType === 'road' }" @click="activeAlertType = 'road'">路况预警</button>
class="type-tab" <button class="type-tab" :class="{ active: activeAlertType === 'violation' }" @click="activeAlertType = 'violation'" >违章预警</button>
:class="{ active: activeAlertType === 'road' }"
@click="activeAlertType = 'road'"
>
路况预警
</button>
<button
class="type-tab"
:class="{ active: activeAlertType === 'violation' }"
@click="activeAlertType = 'violation'"
>
违章预警
</button>
</div> </div>
<!-- 地图区域 --> <!-- 地图区域 -->
@ -31,12 +19,8 @@
<!-- 右下角浮动按钮 --> <!-- 右下角浮动按钮 -->
<div class="float-buttons"> <div class="float-buttons">
<div class="float-btn" @click="handleLocationClick"> <div class="float-btn" @click="handleLocationClick"><van-icon name="location" /></div>
<van-icon name="location" /> <div class="float-btn"><van-icon name="layer" /></div>
</div>
<div class="float-btn">
<van-icon name="layer" />
</div>
</div> </div>
<!-- 标记详情卡片 --> <!-- 标记详情卡片 -->
@ -99,7 +83,7 @@
</template> </template>
<script setup> <script setup>
import { ref, computed, onMounted, watch, nextTick } from "vue"; import { ref, onMounted, watch, nextTick } from "vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import BottomTabs from "@/components/bottomTabs.vue"; import BottomTabs from "@/components/bottomTabs.vue";
import GdMap from "@/components/GdMap/index.vue"; import GdMap from "@/components/GdMap/index.vue";
@ -123,11 +107,6 @@ const alertTypeOptions = [
{ value: "emergency", label: "紧急任务" } { value: "emergency", label: "紧急任务" }
]; ];
// 我的位置
const myLocation = ref({
top: "60%",
left: "40%"
});
// 标记点数据(从接口获取) // 标记点数据(从接口获取)
const markers = ref([]); const markers = ref([]);
@ -226,11 +205,6 @@ function goBack() {
router.back(); router.back();
} }
// 标记点点击
function handleMarkerClick(marker) {
selectedMarker.value = marker;
}
// 定位点击 // 定位点击
function handleLocationClick() { function handleLocationClick() {
console.log("定位到当前位置"); console.log("定位到当前位置");

View File

@ -72,15 +72,15 @@
<div v-for="alert in alertList" :key="alert.id" class="alert-item" @click="handleAlertClick(alert)"> <div v-for="alert in alertList" :key="alert.id" class="alert-item" @click="handleAlertClick(alert)">
<!-- 类型和等级 --> <!-- 类型和等级 -->
<div class="alert-header"> <div class="alert-header">
<span class="alert-type">{{ alert.type }}</span> <span class="alert-type">{{ alert.eventType }}</span>
<span class="alert-priority" :class="alert.priorityColor"> <span class="alert-priority" :class="getLevelClass(alert.eventLevel)">
{{ alert.priority }} {{ getStatusText(alert.eventLevel) }}
</span> </span>
</div> </div>
<!-- 违章预警显示车牌信息 --> <!-- 违章预警显示车牌信息 -->
<div class="alert-vehicle"> <div class="alert-vehicle">
<van-icon name="cart" class="vehicle-icon" /> <van-icon name="logistics" />
<span>{{ alert.plateNo }}</span> <span>{{ alert.plateNo }}</span>
<span class="separator">|</span> <span class="separator">|</span>
<span>{{ alert.vehicleColor }}</span> <span>{{ alert.vehicleColor }}</span>
@ -90,14 +90,14 @@
<!-- 检测点位 --> <!-- 检测点位 -->
<div class="alert-location"> <div class="alert-location">
<van-icon name="location" class="info-icon" /> <van-icon name="location-o" />
<span class="label">检测点位</span> <span class="label">检测点位</span>
<span>{{ alert.siteName }}</span> <span>{{ alert.siteName }}</span>
</div> </div>
<!-- 检测时间 --> <!-- 检测时间 -->
<div class="alert-time"> <div class="alert-time">
<van-icon name="clock" class="info-icon" /> <van-icon name="clock-o" />
<span class="label">检测时间</span> <span class="label">检测时间</span>
<span>{{ alert.passTime }}</span> <span>{{ alert.passTime }}</span>
</div> </div>
@ -233,7 +233,7 @@ function goToReport() {
// 跳转到预警列表 // 跳转到预警列表
function goToAlertList() { function goToAlertList() {
router.push("/traffic-alerts"); router.push("/warningList");
} }
// 处理卡片点击 // 处理卡片点击
@ -251,7 +251,7 @@ function handleAlertClick(alert) {
} else { } else {
router.push({ router.push({
path: "/violation-detail", path: "/violation-detail",
query: { id: alert.id, status: alert.status } query: { id: alert.taskId, status: alert.status }
}); });
} }
} }
@ -281,6 +281,27 @@ async function fetchTaskStats() {
console.error("获取任务统计数据失败:", error); console.error("获取任务统计数据失败:", error);
} }
} }
// 等级样式
function getLevelClass(level) {
const map = {
1: "level-red",
2: "level-orange",
// 3: "level-yellow",
3: "level-blue",
};
return map[level] || "level-blue";
}
// 状态样式
function getStatusText(status) {
const map = {
1: "一级",
2: "二级",
3: "三级",
};
return map[status] || "三级";
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -571,6 +592,22 @@ async function fetchTaskStats() {
background: #fee2e2; background: #fee2e2;
color: #dc2626; color: #dc2626;
} }
&.level-red {
background: #ffe2e2;
color: #e8101a;
}
&.level-orange {
background: #fff3e0;
color: #ff9800;
}
&.level-yellow {
background: #fffde7;
color: #ffc107;
}
&.level-blue {
background: #e3f2fd;
color: #2196f3;
}
} }
} }

View File

@ -27,10 +27,12 @@
</div> </div>
<!-- 图片 --> <!-- 图片 -->
<div class="card-image" v-if="alertDetail.image"> <div class="card-image">
<van-image <van-image
:src="alertDetail.imgUrl" :src="alertDetail.imgUrl"
:error-icon="defaultImg"
fit="cover" fit="cover"
lazy-load
class="alert-img" class="alert-img"
/> />
</div> </div>
@ -55,7 +57,7 @@
<!-- 视频展示按钮 --> <!-- 视频展示按钮 -->
<div class="video-btn-wrapper" v-if="alertDetail.videoUrls && alertDetail.videoUrls.length > 0"> <div class="video-btn-wrapper" v-if="alertDetail.videoUrls && alertDetail.videoUrls.length > 0">
<van-button block round class="video-btn" @click="openVideo(alertDetail.videoUrls[0])"> <van-button block round color="#2a7efe" class="video-btn" @click="openVideo(alertDetail.videoUrls[0])">
<van-icon name="video-o" class="video-icon" /> <van-icon name="video-o" class="video-icon" />
视频展示 视频展示
</van-button> </van-button>
@ -70,20 +72,25 @@
<!-- 蓝色边框卡片 --> <!-- 蓝色边框卡片 -->
<div class="execution-box"> <div class="execution-box">
<!-- 绿色边框内层卡片 --> <!-- 绿色边框内层卡片 -->
<div class="info-box" v-if="taskDetail"> <div class="info-box">
<div class="info-row">
<span class="info-label">要求任务完成时间</span>
<span class="info-value">{{ taskDetail.eventTime }}</span>
</div>
<div class="info-row">
<span class="info-text">{{ taskDetail.deptName }}</span>
<span class="info-divider" v-if="taskDetail.deptName">|</span>
<span class="info-text">联系电话{{ taskDetail.phoneNumber }}</span>
</div>
<div class="info-row"> <div class="info-row">
<span class="info-label">任务地点</span> <span class="info-label">任务地点</span>
<span class="info-value">{{ taskDetail.clickAddress }}</span> <span class="info-value">{{ taskDetail.clickAddress }}</span>
</div> </div>
<div class="info-row" v-if="taskDetail.deptName">
<span class="info-text">{{ taskDetail.deptName }}</span>
<span class="info-divider" v-if="taskDetail.phoneNumber">|</span>
<span class="info-text" v-if="taskDetail.phoneNumber">联系电话{{ taskDetail.phoneNumber }}</span>
</div>
</div> </div>
<!-- 任务描述 --> <!-- 任务描述 -->
<div class="task-desc" v-if="taskDetail"> <div class="task-desc">
{{ taskDetail.taskContent }} {{ taskDetail.taskContent }}
</div> </div>
@ -119,6 +126,7 @@
:key="index" :key="index"
block block
round round
color="#00c84f"
class="feedback-btn success" class="feedback-btn success"
@click="showFeedback(index + 1)" @click="showFeedback(index + 1)"
> >
@ -128,6 +136,7 @@
v-if="allDetail.taskStatus == '1'" v-if="allDetail.taskStatus == '1'"
block block
round round
color="#2a7efe"
type="primary" type="primary"
class="action-btn" class="action-btn"
@click="handleFeedback" @click="handleFeedback"
@ -158,7 +167,11 @@
:src="img" :src="img"
fit="cover" fit="cover"
class="feedback-img" class="feedback-img"
/> >
<template v-slot:error>
<van-image :src="defaultImg" fit="cover" class="feedback-img" />
</template>
</van-image>
</div> </div>
</div> </div>
<!-- 现场照片 --> <!-- 现场照片 -->
@ -205,6 +218,7 @@ import { ref, computed, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { getTrafficEventDetail } from "@/api/traffic"; import { getTrafficEventDetail } from "@/api/traffic";
import { ImagePreview } from 'vant'; import { ImagePreview } from 'vant';
import defaultImg from "@/assets/error.png";
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
@ -289,7 +303,8 @@ const fetchDetail = async () => {
const data = res.data || res; const data = res.data || res;
// 处理详情数据 // 处理详情数据
alertDetail.value = data.eventDetailVO; alertDetail.value = data.eventDetailVO;
taskDetail.value = data.eventDetailVO.tasksVo; taskDetail.value = data.eventDetailVO.tasksVo || {};
console.log(data,'=============00');
allDetail.value = data allDetail.value = data
// 处理打卡记录 // 处理打卡记录
@ -563,14 +578,14 @@ onMounted(() => {
.execution-box { .execution-box {
background: #eff6ff; background: #eff6ff;
border: 2px solid #2563eb; border: 1px solid #2563eb;
border-radius: 16px; border-radius: 16px;
padding: 16px; padding: 16px;
} }
.info-box { .info-box {
background: #f0fdf4; background: #f0fdf4;
border: 2px solid #16a34a; border: 1px solid #16a34a;
border-radius: 12px; border-radius: 12px;
padding: 10px; padding: 10px;
@ -586,6 +601,7 @@ onMounted(() => {
.info-label { .info-label {
color: #64748b; color: #64748b;
letter-spacing: 2px;
} }
.info-value { .info-value {

View File

@ -292,7 +292,7 @@ function goBack() {
// 前往地图 // 前往地图
function goToMap() { function goToMap() {
router.push("/map"); router.push("/videoMonitorMap");
} }
// 选择监控点 // 选择监控点

View File

@ -6,164 +6,143 @@
<h1 class="nav-title">违章详情</h1> <h1 class="nav-title">违章详情</h1>
<div class="nav-placeholder"></div> <div class="nav-placeholder"></div>
</div> </div>
<!-- 加载状态 --> <!-- 违章信息卡片 -->
<van-loading v-if="loading" class="loading-state" color="#2563eb">加载中...</van-loading> <div class="detail-card">
<template v-else> <!-- 车牌号和状态 -->
<!-- 违章信息卡片 --> <div class="card-header">
<div class="detail-card"> <div class="vehicle-info">
<!-- 车牌号和状态 --> <van-icon name="cart" class="vehicle-icon" />
<div class="card-header"> <span class="plate-number">{{ violationDetail.plateNo }}</span>
<div class="vehicle-info"> <span class="plate-color">{{ violationDetail.plateColor }}</span>
<van-icon name="cart" class="vehicle-icon" /> <span class="separator">|</span>
<span class="plate-number">{{ violationDetail.plateNo }}</span> <span class="vehicle-type">{{ violationDetail.vehicleType }}</span>
<span class="plate-color">{{ violationDetail.plateColor }}</span>
<span class="separator">|</span>
<span class="vehicle-type">{{ violationDetail.vehicleType }}</span>
</div>
<span class="status-tag" :class="getStatusClass(allDetail.taskStatus)">
{{ statusMap[allDetail.taskStatus] }}
</span>
</div>
<!-- 等级和标题 -->
<div class="title-row">
<span class="level-tag" :class="getLevelClass(violationDetail.eventLevel)">
{{ levelMap[violationDetail.eventLevel] }}
</span>
<span class="alert-title">{{ violationDetail.eventContent }}</span>
</div>
<!-- 图片 -->
<div class="card-image" v-if="violationDetail.imgUrl">
<van-image :src="violationDetail.imgUrl" fit="cover" class="alert-img" />
</div>
<!-- 检测信息 -->
<div class="card-details">
<div class="detail-item">
<van-icon name="location" class="detail-icon" />
<span class="label">检测点位</span>
<span class="value">{{ violationDetail.siteName }}</span>
</div>
<div class="detail-item">
<van-icon name="clock" class="detail-icon" />
<span class="label">检测时间</span>
<span class="value">{{ violationDetail.eventTime }}</span>
</div>
</div> </div>
<span class="status-tag" :class="getStatusClass(allDetail.taskStatus)"> {{ statusMap[allDetail.taskStatus] }} </span>
</div> </div>
<!-- 打卡情况 - 执行中和已完成状态显示 --> <!-- 等级和标题 -->
<div v-if="allDetail.taskStatus == '1' || allDetail.taskStatus == '2'" class="checkin-card"> <div class="title-row">
<div class="checkin-time-row"> <span class="level-tag" :class="getLevelClass(violationDetail.eventLevel)">
<span class="checkin-date">{{allDetail.clickTime}}</span> {{ levelMap[violationDetail.eventLevel] }}
<span class="checkin-type">定位打卡</span> </span>
</div> <span class="alert-title">{{ violationDetail.eventContent }}</span>
<div class="checkin-row">
<span class="checkin-label">打卡账号</span>
<span class="checkin-value">21515800</span>
</div>
<div class="checkin-row checkin-location">
<van-icon name="location" class="location-icon" />
<span>{{allDetail.clickAddress}}</span>
</div>
<!-- 未拦截成功标识 -->
<div v-if="violationId !== '1' && violationId !== '3' && allDetail.taskStatus === '1'" class="intercept-status">
<span v-if="violationId === '6'" class="result-btn" @click="goToResult">
处罚结果
</span>
<span v-else class="fail-tag">未拦截成功</span>
</div>
</div> </div>
<!-- 卡口预警折叠面板 --> <!-- 图片 -->
<van-collapse v-model="activeNames" :border="false" class="alert-collapse"> <div class="card-image">
<van-collapse-item name="1" :border="false"> <van-image :src="violationDetail.imgUrls" fit="cover" class="alert-img" />
<template #title> </div>
<div class="collapse-title">卡口预警</div>
</template>
<van-list
v-model:loading="alertLoading"
:finished="alertFinished"
finished-text="没有更多了"
@load="onLoadAlerts"
:immediate-check="false"
>
<div class="alert-list">
<div v-for="(item, index) in checkinAlerts" :key="item.id" class="alert-item">
<!-- 顶部序号和基本信息 -->
<div class="item-header">
<div class="item-index">{{ index + 1 }}</div>
<div class="item-info">
<div class="info-row">
<van-icon name="location-o" class="info-icon" />
<span class="label">检测点位</span>
<span class="value">{{ item.siteName }}</span>
</div>
<div class="info-row">
<van-icon name="clock-o" class="info-icon" />
<span class="label">检测时间</span>
<span class="value">{{ item.eventTime }}</span>
</div>
</div>
</div>
<!-- 抓拍图片区域 --> <!-- 检测信息 -->
<div class="capture-section"> <div class="card-details">
<div class="section-title">抓拍图片</div> <div class="detail-item">
<van-image :src="item.imgUrl" fit="cover" class="capture-img" radius="12" /> <van-icon name="location" class="detail-icon" />
</div> <span class="label">检测点位</span>
<span class="value">{{ violationDetail.siteName }}</span>
</div>
<div class="detail-item">
<van-icon name="clock" class="detail-icon" />
<span class="label">检测时间</span>
<span class="value">{{ violationDetail.eventTime }}</span>
</div>
</div>
</div>
<!-- 详细网格信息 --> <!-- 打卡情况 - 执行中和已完成状态显示 -->
<div class="detail-grid"> <div v-if="allDetail.taskStatus == '1' || allDetail.taskStatus == '2'" class="checkin-card">
<div class="grid-item"> <div class="checkin-time-row">
<span class="label">速度</span> <span class="checkin-date">{{allDetail.clickTime}}</span>
<span class="value">{{ item.speed }}</span> <span class="checkin-type">定位打卡</span>
</div>
<div class="checkin-row">
<span class="checkin-label">打卡账号</span>
<span class="checkin-value">21515800</span>
</div>
<div class="checkin-row checkin-location">
<van-icon name="location" class="location-icon" />
<span>{{allDetail.clickAddress}}</span>
</div>
<!-- 未拦截成功标识 -->
<div v-if="violationId !== '1' && violationId !== '3' && allDetail.taskStatus === '1'" class="intercept-status">
<span v-if="violationId === '6'" class="result-btn" @click="goToResult">处罚结果</span>
<span v-else class="fail-tag">未拦截成功</span>
</div>
</div>
<!-- 卡口预警折叠面板 -->
<van-collapse v-model="activeNames" :border="false" class="alert-collapse">
<van-collapse-item name="1" :border="false">
<template #title><div class="collapse-title">卡口预警</div></template>
<van-list :finished="true" finished-text="没有更多了" >
<div class="alert-list">
<div v-for="(item, index) in checkinAlerts" :key="item.id" class="alert-item">
<!-- 顶部序号和基本信息 -->
<div class="item-header">
<div class="item-index">{{ index + 1 }}</div>
<div class="item-info">
<div class="info-row">
<van-icon name="location-o" class="info-icon" />
<span class="label">检测点位</span>
<span class="value">{{ item.siteName }}</span>
</div> </div>
<div class="grid-item"> <div class="info-row">
<span class="label">车道号</span> <van-icon name="clock-o" class="info-icon" />
<span class="value">{{ item.laneNo }}</span> <span class="label">检测时间</span>
</div> <span class="value">{{ item.passTime }}</span>
<div class="grid-item">
<span class="label">方向</span>
<span class="value">{{ item.direction }}</span>
</div>
<div class="grid-item">
<van-icon name="user-o" class="grid-icon" />
<span class="label">执法人员</span>
<span class="value">{{ item.person }}</span>
</div>
<div class="grid-item">
<span class="label">工号</span>
<span class="value">{{ item.workNo }}</span>
</div> </div>
</div> </div>
<!-- 分割线 -->
<div v-if="index < checkinAlerts.length - 1" class="item-divider"></div>
</div> </div>
<!-- 抓拍图片区域 -->
<div class="capture-section">
<div class="section-title">抓拍图片</div>
<van-image :src="item.imgUrl" fit="cover" class="capture-img" radius="12" />
</div>
<!-- 详细网格信息 -->
<div class="detail-grid">
<div class="grid-item">
<span class="label">速度</span>
<span class="value">{{ item.speed }}</span>
</div>
<div class="grid-item">
<span class="label">车道号</span>
<span class="value">{{ item.laneNo }}</span>
</div>
<div class="grid-item">
<span class="label">方向</span>
<span class="value">{{ item.direction }}</span>
</div>
<div class="grid-item">
<van-icon name="user-o" class="grid-icon" />
<span class="label">执法人员</span>
<span class="value">{{ item.userName }}</span>
</div>
<div class="grid-item">
<span class="label">工号</span>
<span class="value">{{ item.workNo }}</span>
</div>
</div>
<!-- 分割线 -->
<div v-if="index < checkinAlerts.length - 1" class="item-divider"></div>
</div> </div>
</van-list> </div>
</van-collapse-item> </van-list>
</van-collapse> </van-collapse-item>
</van-collapse>
<!-- 底部按钮 - 未执行状态 --> <!-- 底部按钮 - 未执行状态 -->
<div v-if="allDetail.taskStatus == '0'" class="action-bar"> <div v-if="allDetail.taskStatus == '0'" class="action-bar">
<van-button block round type="primary" class="action-btn" @click="handleCheckIn"> <van-button block round type="primary" class="action-btn" @click="handleCheckIn">定位打卡</van-button>
定位打卡 </div>
</van-button>
</div>
<!-- 底部按钮 - 执行中状态 --> <!-- 底部按钮 - 执行中状态 -->
<div v-if="allDetail.taskStatus == '1'" class="action-bar"> <div v-if="allDetail.taskStatus == '1'" class="action-bar">
<van-button block round type="primary" class="action-btn" @click="showResultDialog"> <van-button block round type="primary" class="action-btn" @click="showResultDialog">执行结果</van-button>
执行结果 </div>
</van-button>
</div>
</template>
<!-- 执行结果弹框 --> <!-- 执行结果弹框 -->
<van-popup v-model:show="showMatchDialog" round class="result-popup"> <van-popup v-model:show="showMatchDialog" round class="result-popup">
@ -188,7 +167,6 @@
import { ref, computed, onMounted } from "vue"; import { ref, computed, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { getTrafficEventDetail, interceptNotSuccess } from "@/api/traffic"; import { getTrafficEventDetail, interceptNotSuccess } from "@/api/traffic";
import { ImagePreview } from 'vant';
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
@ -220,50 +198,8 @@ const taskDetail = ref({})
// 卡口预警模拟数据 // 卡口预警模拟数据
const checkinAlerts = ref([]) const checkinAlerts = ref([])
const alertLoading = ref(false)
const alertFinished = ref(false)
const alertPage = ref(1) // 分页当前页码
const activeNames = ref(['1']) // 默认展开第一个面板 const activeNames = ref(['1']) // 默认展开第一个面板
// 模拟加载卡口预警数据
const onLoadAlerts = () => {
// 模拟异步请求
setTimeout(() => {
const newData = [
{
id: checkinAlerts.value.length + 1,
siteName: '解放大道循礼门路口东',
eventTime: '2026-03-27 09:15:32',
imgUrl: 'https://img0.baidu.com/it/u=2535738879,1652433069&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500',
speed: '65 km/h',
laneNo: '2',
direction: '由东向西',
person: '张伟',
workNo: '210001'
},
{
id: checkinAlerts.value.length + 2,
siteName: '解放大道循礼门路口东',
eventTime: '2026-03-27 09:15:35',
imgUrl: 'https://img0.baidu.com/it/u=2535738879,1652433069&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500',
speed: '68 km/h',
laneNo: '2',
direction: '由东向西',
person: '张伟',
workNo: '210001'
}
];
checkinAlerts.value.push(...newData);
alertLoading.value = false;
alertPage.value++;
// 模拟加载 5 页后结束
if (alertPage.value > 5) {
alertFinished.value = true;
}
}, 1000);
};
// 获取详情数据 // 获取详情数据
const fetchDetail = async () => { const fetchDetail = async () => {
@ -277,6 +213,7 @@ const fetchDetail = async () => {
violationDetail.value = data.eventDetailVO; violationDetail.value = data.eventDetailVO;
taskDetail.value = data.eventDetailVO.tasksVo; taskDetail.value = data.eventDetailVO.tasksVo;
allDetail.value = data allDetail.value = data
checkinAlerts.value = data.interceptWarns || [];
} }
} catch (error) { } catch (error) {
console.error("获取详情失败:", error); console.error("获取详情失败:", error);
@ -356,7 +293,6 @@ function handlePlateMatch(matched) {
// 页面初始化 // 页面初始化
onMounted(() => { onMounted(() => {
fetchDetail(); fetchDetail();
onLoadAlerts(); // 初始化加载预警数据
}); });
</script> </script>

View File

@ -552,6 +552,16 @@ const routes = [
name: "video-monitor", name: "video-monitor",
component: () => import("../pages/videoMonitor/index.vue"), component: () => import("../pages/videoMonitor/index.vue"),
}, },
{
path: "/videoMonitorMap",
name: "videoMonitorMap",
component: () => import("../pages/videoMonitorMap/index.vue"),
},
{
path: "/warningList",
name: "warningList",
component: () => import("../pages/warningList/index.vue"),
},
// 新增Greeting message 完整转换页面 // 新增Greeting message 完整转换页面
{ {
path: "/keyDetection", path: "/keyDetection",