工单 告警 报事 修改

This commit is contained in:
2025-08-23 17:35:55 +08:00
parent 9a60d90592
commit ee9021b6af
10 changed files with 866 additions and 649 deletions

View File

@@ -1,50 +1,61 @@
<template>
<view class="warn-container">
<!-- 顶部导航 -->
<view class="warn-navbar">
<image src="/static/ic_back.png" class="warn-back" @click="goBack" />
<text class="warn-title">预警处理</text>
<text class="warn-right-txt" @click="goStatistics">预警统计</text>
</view>
<view class="warn-container">
<!-- 顶部导航 -->
<view class="warn-navbar">
<image src="/static/ic_back.png" class="warn-back" @click="goBack" />
<text class="warn-title">预警处理</text>
<text class="warn-right-txt" @click="goStatistics">预警统计</text>
</view>
<!-- tab栏 -->
<view class="warn-tabs">
<view v-for="(tab, idx) in tabs" :key="idx" :class="['warn-tab', { active: idx === activeTab }]"
@click="changeTab(idx)">
{{ tab }}
<view v-if="idx === activeTab" class="tab-underline"></view>
</view>
</view>
<!-- tab栏 -->
<view class="warn-tabs">
<view v-for="(tab, idx) in tabs" :key="idx" :class="['warn-tab', { active: idx === activeTab }]"
@click="changeTab(idx)">
{{ tab }}
<view v-if="idx === activeTab" class="tab-underline"></view>
</view>
</view>
<!-- 列表区 -->
<scroll-view class="warn-list" scroll-y refresher-enabled refresher-background="#f7f7f7"
:refresher-triggered="refresherTriggered" @refresherrefresh="onRefresh" @scrolltolower="loadMore"
:lower-threshold="50">
<view v-for="(item, idx) in list" :key="idx" class="warn-card" @click="goDetail2(item)">
<view class="warn-row">
<view class="warn-no">{{item.smallTypeName}}</view>
<view class="warn-status">{{item.levelName}}</view>
</view>
<image class="warn-line-image" src="/static/ic_my_repair_03.png" />
<view class="warn-info">预警内容{{ item.description }}</view>
<view class="warn-info">预警位置{{ item.deviceGroupName }}</view>
<view class="warn-info">预警时间{{ item.reportTime }}</view>
<view class="warn-info">预警设备{{ item.deviceName }}</view>
<view v-if="[20, 30, 31, 32].includes(item.state)" class="warn-eval-wrap" @click.stop="goDetail(item)">
<view class="warn-eval-btn">去处理</view>
</view>
</view>
<!-- 为每个标签页创建独立的scroll-view -->
<view class="warn-list-container">
<scroll-view
v-for="(tab, idx) in tabs"
:key="idx"
v-show="idx === activeTab"
class="warn-list"
scroll-y
:refresher-enabled="true"
refresher-background="#f7f7f7"
:refresher-triggered="refresherTriggered"
@refresherrefresh="onRefresh"
@scrolltolower="loadMore"
:lower-threshold="50">
<view v-for="(item, index) in tabData[idx]" :key="index" class="warn-card" @click="goDetail2(item)">
<view class="warn-row">
<view class="warn-no">{{item.smallTypeName}}</view>
<view class="warn-status">{{item.levelName}}</view>
</view>
<image class="warn-line-image" src="/static/ic_my_repair_03.png" />
<view class="warn-info">预警内容{{ item.description }}</view>
<view class="warn-info">预警位置{{ item.deviceGroupName }}</view>
<view class="warn-info">预警时间{{ item.reportTime }}</view>
<view class="warn-info">预警设备{{ item.deviceName }}</view>
<view v-if="[20, 30, 31, 32].includes(item.state)" class="warn-eval-wrap" @click.stop="goDetail(item)">
<view class="warn-eval-btn">去处理</view>
</view>
</view>
<!-- 底部加载提示 -->
<view v-if="loading" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
加载中...
</view>
<view v-if="noMore[activeTab]" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
没有更多数据了
</view>
<!-- 底部加载提示 -->
<view v-if="loading" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
加载中...
</view>
<view v-if="noMore[idx]" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
没有更多数据了
</view>
</scroll-view>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
@@ -72,13 +83,12 @@
}
},
created() {
this.onRefresh()
},
onShow() {
uni.$once('refreshData', () => {
this.tabLoaded = [false, false]
this.onRefresh()
});
this.loadAllTabsData()
},
onShow() {
uni.$once('refreshData', () => {
this.loadAllTabsData()
});
},
methods: {
goBack() {
@@ -87,9 +97,12 @@
// 切换 tab
async changeTab(idx) {
this.activeTab = idx;
// 移除切换标签时的加载逻辑,避免重复调用接口
/*
if (!this.tabLoaded[idx]) {
this.onRefresh()
}
*/
},
// 下拉刷新
async onRefresh() {
@@ -144,6 +157,19 @@
uni.navigateTo({
url: "/pages/sys/workbench/earlyWarning/warnStatistics"
});
},
// 添加预加载所有标签页数据的方法
async loadAllTabsData() {
// 并行加载所有标签页数据,提高加载速度
const loadPromises = [0, 1].map((index) => {
return this.loadTabData(index);
});
await Promise.all(loadPromises);
// 标记所有标签页已加载
this.tabLoaded = [true, true];
}
}
};
@@ -155,6 +181,7 @@
background: #fff;
display: flex;
flex-direction: column;
overflow: hidden;
}
.warn-navbar {
@@ -165,6 +192,7 @@
justify-content: stretch;
position: relative;
margin-top: 50rpx;
flex-shrink: 0;
}
.warn-back {
@@ -193,7 +221,7 @@
justify-content: space-around;
background: #fff;
height: 80rpx;
bwarn-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid #f0f0f0;
flex-shrink: 0;
}
@@ -217,23 +245,32 @@
width: 60rpx;
height: 6rpx;
background: #2186ff;
bwarn-radius: 3rpx;
border-radius: 3rpx;
margin: 0 auto;
margin-top: 8rpx;
}
.warn-list {
padding: 0 24rpx;
.warn-list-container {
flex: 1;
overflow-y: auto;
padding-bottom: 30rpx;
height: calc(100vh - 80rpx - 32rpx);
position: relative;
background: #f7f7f7;
}
.warn-list {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 0 24rpx;
padding-bottom: 30rpx;
height: calc(100vh - 80rpx - 32rpx - 100rpx - 50rpx); /* 减去顶部导航和tab区域高度 */
box-sizing: border-box;
}
.warn-card {
background: #fff;
bwarn-radius: 12rpx;
border-radius: 12rpx;
margin-top: 24rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03);
padding-top: 25rpx;

View File

@@ -65,7 +65,7 @@
<image
v-for="(img, idx) in realImages"
:key="idx"
:src="img.imagePath"
:src="img"
mode="aspectFill"
class="preview-image"
@click="previewImage(idx)"
@@ -139,11 +139,19 @@ export default {
this.loadEevetInfo();
},
methods: {
async loadEevetInfo() {
let res = await this.$u.api.getWarnEventInfo({}, this.warnInfo.id);
if (res.code == "200") {
this.handleDesc = res.data.workReply
this.realImages = res.data.attachments
const imgIds= res.data.attachments.map(img =>img.ossId)
if (!imgIds) return;
const result = await this.$u.api.getImageUrl({}, imgIds);
if (result.code == 200 && result.data) {
// 提取res.data数组中每个对象的url字段
this.realImages = result.data.map(item => item.url);
}
}
this.loading = false;
},