消息日志ui
parent
09c81f575a
commit
a464432585
1
App.vue
1
App.vue
|
|
@ -137,6 +137,7 @@ export default {
|
|||
}
|
||||
// ========== 新增:登出时清空localStorage的订阅列表 ==========
|
||||
uni.removeStorageSync('mqtt_subscribe_list')
|
||||
uni.removeStorageSync('agri_list')
|
||||
console.log('登出成功,MQTT已断开')
|
||||
},
|
||||
// token过期处理逻辑(核心)
|
||||
|
|
|
|||
|
|
@ -70,21 +70,20 @@
|
|||
<view v-if="item.numBadge>0 && item.badge" class="item-badge"></view>
|
||||
</view>
|
||||
<view class="item-content">
|
||||
<view class="item-title">{{ item.title }}</view>
|
||||
<view class="item-title">
|
||||
<text>{{ item.title }}</text>
|
||||
<text class="item-time">
|
||||
<uni-dateformat v-if="item.createTime" :date="item.createTime" :format="formatTime(item.createTime)"
|
||||
:threshold="[60000, 3600000]"></uni-dateformat>
|
||||
<text v-else>--</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="item-desc">
|
||||
<view v-if="item.content">{{ item.content }}</view>
|
||||
<view v-else>暂无更多{{item.title.substring(0,2)}}消息 ... </view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 右侧时间+角标列 -->
|
||||
<view class="item-right">
|
||||
<view class="item-time">
|
||||
<uni-dateformat v-if="item.createTime" :date="item.createTime" :format="formatTime(item.createTime)"
|
||||
:threshold="[60000, 3600000]"></uni-dateformat>
|
||||
<view v-else>--</view>
|
||||
</view>
|
||||
<view v-if="item.numBadge>0 && !item.badge">
|
||||
<uni-badge :text="item.numBadge" type="error" size="mini" />
|
||||
<view v-if="item.numBadge>0 && !item.badge">
|
||||
<uni-badge :text="item.numBadge" type="error" size="mini" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -435,31 +434,41 @@ export default {
|
|||
.item-content {
|
||||
flex: 1;
|
||||
min-width: 0; /* 必须加,防止flex溢出 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.item-title {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
text:first-child {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
.item-desc {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
line-height: 1.4;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
view:first-child {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
view:last-child {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 右侧时间 + 角标 固定区域 */
|
||||
.item-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
flex-shrink: 0; /* 时间不被挤压 */
|
||||
margin-left: 20rpx;
|
||||
.item-time {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
<script>
|
||||
import {listMessage, updateRead} from "@/api/warn/message";
|
||||
import * as mqttUtil from "@/utils/mqtt";
|
||||
|
||||
import {formatTime} from "@/utils/agri";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -72,7 +72,6 @@ export default {
|
|||
this.getList();
|
||||
},
|
||||
onShow() {
|
||||
this.updateRead();
|
||||
console.info("消息日志监听")
|
||||
mqttUtil.setOnMessageCallback(this.ackAlarm);
|
||||
},
|
||||
|
|
@ -89,7 +88,7 @@ export default {
|
|||
mqttUtil.removeOnMessageCallback();
|
||||
},
|
||||
methods: {
|
||||
|
||||
formatTime,
|
||||
// 判断两个时间是否是同一天同一分钟
|
||||
isSameMinute(time1, time2) {
|
||||
const date1 = new Date(time1);
|
||||
|
|
@ -100,40 +99,7 @@ export default {
|
|||
date1.getHours() === date2.getHours() &&
|
||||
date1.getMinutes() === date2.getMinutes();
|
||||
},
|
||||
formatTime(timeStr) {
|
||||
const now = new Date();
|
||||
const target = new Date(timeStr);
|
||||
const diff = now - target;
|
||||
const day = 86400000;
|
||||
const week = 7 * day;
|
||||
|
||||
// 时间
|
||||
const h = String(target.getHours()).padStart(2, '0');
|
||||
const m = String(target.getMinutes()).padStart(2, '0');
|
||||
const time = `${h}:${m}`;
|
||||
|
||||
// 今天
|
||||
if (now.toDateString() === target.toDateString())
|
||||
return `今天 ${time}`;
|
||||
|
||||
// 昨天
|
||||
const yest = new Date(now);
|
||||
yest.setDate(now.getDate() - 1);
|
||||
if (yest.toDateString() === target.toDateString())
|
||||
return `昨天 ${time}`;
|
||||
|
||||
// 7天内
|
||||
if (diff <= week) {
|
||||
const weekMap = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
return `星期${weekMap[target.getDay()]} ${time}`;
|
||||
}
|
||||
|
||||
// 7天前
|
||||
const Y = target.getFullYear();
|
||||
const M = String(target.getMonth() + 1).padStart(2, '0');
|
||||
const D = String(target.getDate()).padStart(2, '0');
|
||||
return `${Y}-${M}-${D} ${time}`;
|
||||
},
|
||||
getSortDate(messageList) {
|
||||
return messageList.sort((a, b) => new Date(a.createTime) - new Date(b.createTime));
|
||||
},
|
||||
|
|
@ -166,6 +132,7 @@ export default {
|
|||
this.isHaveOldData = false;
|
||||
}
|
||||
}).finally(()=>{
|
||||
this.updateRead();
|
||||
if (this.messageList.length>10) {
|
||||
// 在数据更新后设置 scrollId
|
||||
this.$nextTick(() => {
|
||||
|
|
@ -178,6 +145,9 @@ export default {
|
|||
})
|
||||
},
|
||||
updateRead() {
|
||||
if (this.msgList.length === 0) return;
|
||||
var unReadList = this.messageList.filter(item => item.readStatus === 0);
|
||||
if (unReadList.length === 0) return;
|
||||
updateRead({msgType: "status"}).then(response => {
|
||||
if (response.code === 200) {
|
||||
console.info("更新已读成功")
|
||||
|
|
@ -218,7 +188,10 @@ export default {
|
|||
},
|
||||
|
||||
gotoDevice(item) {
|
||||
|
||||
const agriList = uni.getStorageSync('agri_list')
|
||||
if (agriList.length === 0 || !agriList.includes(item.imei)) {
|
||||
return
|
||||
}
|
||||
this.$tab.navigateTo(item.linkUrl)
|
||||
},
|
||||
ackAlarm(topic, payload) {
|
||||
|
|
|
|||
|
|
@ -76,7 +76,6 @@
|
|||
|
||||
<script>
|
||||
import {listAgri} from "@/api/system/assets/agri";
|
||||
import {getAutoLogList} from "@/api/warn/autolog";
|
||||
import {formatDate} from "@/uni_modules/uni-dateformat/components/uni-dateformat/date-format";
|
||||
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -342,6 +342,43 @@ export function isTodayDate(dateInput) {
|
|||
return targetDateOnly.getTime() === todayDate.getTime();
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function formatTime(timeStr) {
|
||||
console.info('timeStr', timeStr)
|
||||
const now = new Date();
|
||||
const target = new Date(timeStr);
|
||||
const diff = now - target;
|
||||
const day = 86400000;
|
||||
const week = 7 * day;
|
||||
|
||||
// 时间
|
||||
const h = String(target.getHours()).padStart(2, '0');
|
||||
const m = String(target.getMinutes()).padStart(2, '0');
|
||||
const time = `${h}:${m}`;
|
||||
|
||||
// 今天
|
||||
if (now.toDateString() === target.toDateString())
|
||||
return `${time}`;
|
||||
|
||||
// 昨天
|
||||
const yest = new Date(now);
|
||||
yest.setDate(now.getDate() - 1);
|
||||
if (yest.toDateString() === target.toDateString())
|
||||
return `昨天 ${time}`;
|
||||
|
||||
// 7天内
|
||||
if (diff <= week) {
|
||||
const weekMap = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
return `星期${weekMap[target.getDay()]} ${time}`;
|
||||
}
|
||||
|
||||
// 7天前
|
||||
const Y = target.getFullYear();
|
||||
const M = String(target.getMonth() + 1).padStart(2, '0');
|
||||
const D = String(target.getDate()).padStart(2, '0');
|
||||
return `${Y}-${M}-${D} ${time}`;
|
||||
}
|
||||
/**
|
||||
* 判断传入的日期是否是今天
|
||||
* 支持格式:Date对象、时间戳、字符串(yyyy-MM-dd HH:mm:ss、yyyy-MM-dd、ISO格式等)
|
||||
|
|
|
|||
|
|
@ -337,6 +337,7 @@ export function updateSubscribeTopic() {
|
|||
if (!clientId) {
|
||||
throw new Error('MQTT clientId 为空,无法生成订阅主题');
|
||||
}
|
||||
const agriList = [];
|
||||
// 1. 获取设备列表(纯.then/.catch回调)
|
||||
listAgri().then(response => {
|
||||
if (response.code === 200) {
|
||||
|
|
@ -344,10 +345,12 @@ export function updateSubscribeTopic() {
|
|||
// 生成设备订阅主题(校验imei非空)
|
||||
response.rows.forEach(item => {
|
||||
if (item?.imei) {
|
||||
agriList.push(item.imei);
|
||||
subscribeList.push(`frontend/${clientId}/dtu/${item.imei}/+`);
|
||||
subscribeList.push(`device/${item.imei}/+`);
|
||||
}
|
||||
});
|
||||
uni.setStorageSync('agri_list', agriList);
|
||||
// 管理员额外订阅指定设备
|
||||
if (store.getters && store.getters.name === 'admin') {
|
||||
subscribeList.push(`frontend/${clientId}/dtu/862538065276061/+`);
|
||||
|
|
|
|||
Loading…
Reference in New Issue