设备状态ui提交
parent
b9c62d3afd
commit
9ce4e69c2f
|
|
@ -0,0 +1,44 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
// 查询系统消息中心列表
|
||||
export function listMessage(query) {
|
||||
return request({
|
||||
url: '/warn/message/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询系统消息中心详细
|
||||
export function getMessage(id) {
|
||||
return request({
|
||||
url: '/warn/message/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增系统消息中心
|
||||
export function addMessage(data) {
|
||||
return request({
|
||||
url: '/warn/message',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改系统消息中心
|
||||
export function updateMessage(data) {
|
||||
return request({
|
||||
url: '/warn/message',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除系统消息中心
|
||||
export function delMessage(id) {
|
||||
return request({
|
||||
url: '/warn/message/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
66
pages.json
66
pages.json
|
|
@ -24,19 +24,27 @@
|
|||
{
|
||||
"path": "pages/data/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "数据中心"
|
||||
"navigationBarTitleText": "数据中心",
|
||||
// "navigationBarBackgroundColor": "pink",
|
||||
// "navigationBarTextStyle": "white",
|
||||
"navigationBarShadow": {
|
||||
// grey、blue、green、orange、red、yellow
|
||||
"colorType": "red"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/data/indexDemo",
|
||||
"style": {
|
||||
"navigationBarTitleText": "数据中心11"
|
||||
}
|
||||
},
|
||||
// {
|
||||
// "path": "pages/data/indexDemo",
|
||||
// "style": {
|
||||
// "navigationBarTitleText": "数据中心11"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
"path": "pages/news/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "消息中心"
|
||||
"navigationBarTitleText": "消息中心",
|
||||
"navigationStyle": "custom",
|
||||
"disableScroll": true
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -92,12 +100,36 @@
|
|||
"root": "pages/data",
|
||||
"pages": [
|
||||
]
|
||||
},*/
|
||||
{
|
||||
"root": "pages/news/subpages",
|
||||
"pages": [
|
||||
{
|
||||
"path": "sysNotice/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "系统公告"
|
||||
}
|
||||
},
|
||||
{
|
||||
"root": "pages/news",
|
||||
"pages": [
|
||||
"path": "eventCenter/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "videoCenter/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "视频中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "deviceCenter/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "设备状态"
|
||||
}
|
||||
}
|
||||
]
|
||||
},*/
|
||||
},
|
||||
{
|
||||
"root": "pages/work",
|
||||
"pages": [
|
||||
|
|
@ -187,12 +219,12 @@
|
|||
"selectedIconPath": "static/images/tabbar/data_.png",
|
||||
"text": "历史数据"
|
||||
},
|
||||
// {
|
||||
// "pagePath": "pages/data/indexDemo",
|
||||
// "iconPath": "static/images/tabbar/data.png",
|
||||
// "selectedIconPath": "static/images/tabbar/data_.png",
|
||||
// "text": "历史数据"
|
||||
// },
|
||||
{
|
||||
"pagePath": "pages/data/indexDemo",
|
||||
"iconPath": "static/images/tabbar/data.png",
|
||||
"selectedIconPath": "static/images/tabbar/data_.png",
|
||||
"text": "历史数据"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/news/index",
|
||||
"iconPath": "static/images/tabbar/news.png",
|
||||
|
|
|
|||
|
|
@ -24,13 +24,15 @@
|
|||
</view>
|
||||
|
||||
<!-- 系统通知提示条 -->
|
||||
<view class="notice-bar" >
|
||||
<view class="notice-out">
|
||||
<view class="notice-bar" v-if="isShowTips">
|
||||
<view class="notice-left">
|
||||
<uni-icons @click="goToClose" style="margin-right: 12rpx" type="closeempty" color="#FF6D00" size="15"/>
|
||||
<text class="notice-text">系统通知未开启，报警消息无法通知</text>
|
||||
</view>
|
||||
<view class="notice-btn" @click="goToOpen">去开启</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 功能入口区 -->
|
||||
<view class="func-wrap">
|
||||
|
|
@ -103,6 +105,7 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
title: '消息中心',
|
||||
isShowTips: true,
|
||||
isShowNumBadge: true,
|
||||
messageList: [
|
||||
{
|
||||
|
|
@ -143,18 +146,13 @@ export default {
|
|||
// iconBg: '#FFA726',
|
||||
title: '活动中心',
|
||||
desc: '没有新的消息',
|
||||
time: Date.now()-9900000,
|
||||
time: Date.now()-119900000,
|
||||
badge: false,
|
||||
numBadge: 25, // 无值则不显示
|
||||
width: '100rpx'
|
||||
}
|
||||
],
|
||||
options: [{
|
||||
text: '置顶',
|
||||
style: {
|
||||
backgroundColor: '#FFA726'
|
||||
}
|
||||
},
|
||||
options: [
|
||||
{
|
||||
text: '删除',
|
||||
style: {
|
||||
|
|
@ -167,32 +165,36 @@ export default {
|
|||
methods: {
|
||||
isTodayDate,
|
||||
navBack() {
|
||||
// 消息推送设置
|
||||
this.showDrawer('showLeft');
|
||||
console.log('点击消息中心')
|
||||
console.log('点击消息中心：消息推送设置')
|
||||
},
|
||||
clearUnread() {
|
||||
// 全部已读
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('清除未读')
|
||||
console.log('清除未读：当前页面全部已读')
|
||||
},
|
||||
openSetting() {
|
||||
// 当前页面勿扰模式设置
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('打开通知设置')
|
||||
console.log('打开通知设置：当前页面勿扰模式设置')
|
||||
},
|
||||
goToOpen() {
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('去开启系统通知')
|
||||
console.log('去开启系统通知：同左侧消息中心')
|
||||
},
|
||||
goToClose() {
|
||||
this.isShowTips = false
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('关闭系统通知')
|
||||
console.log('关闭系统通知提示')
|
||||
},
|
||||
goToSubscribe() {
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('进入消息订阅')
|
||||
console.log('进入消息订阅：暂未开发')
|
||||
},
|
||||
goToAI() {
|
||||
this.$modal.showToast('模块建设中~')
|
||||
console.log('进入AI识别')
|
||||
console.log('进入AI识别：暂未开发')
|
||||
},
|
||||
handleItemClick(item) {
|
||||
this.$modal.showToast('敬请期待~')
|
||||
|
|
@ -203,11 +205,12 @@ export default {
|
|||
this.$tab.navigateTo('/pages/news/subpages/eventCenter/index');
|
||||
} else if (item.title === '视频中心') {
|
||||
this.$tab.navigateTo('/pages/news/subpages/videoCenter/index');
|
||||
} else if (item.title === '设备状态') {
|
||||
this.$tab.navigateTo('/pages/news/subpages/deviceCenter/index');
|
||||
}
|
||||
},
|
||||
deleteItem(event, index) {
|
||||
this.$modal.showToast('敬请期待~')
|
||||
console.log('删除消息:', event, index)
|
||||
this.$modal.showToast('敬请期待~，删除当前消息')
|
||||
},
|
||||
// 打开窗口
|
||||
showDrawer(e) {
|
||||
|
|
@ -288,12 +291,14 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.notice-out {
|
||||
margin: 20rpx 30rpx;
|
||||
}
|
||||
/* 系统通知提示条 */
|
||||
.notice-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 20rpx 30rpx;
|
||||
padding: 20rpx;
|
||||
background-color: #FFF3E0;
|
||||
border-radius: 12rpx;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,208 @@
|
|||
<template>
|
||||
<view class="message-page">
|
||||
<!-- 消息列表 -->
|
||||
<scroll-view scroll-y class="message-list">
|
||||
<view
|
||||
v-for="(item, index) in messageList"
|
||||
:key="index"
|
||||
class="message-item"
|
||||
>
|
||||
<!-- 时间标签 -->
|
||||
<view class="time-label">{{ formatTime(item.time) }}</view>
|
||||
|
||||
<!-- 点赞消息卡片 -->
|
||||
<view class="like-card" v-if="item.type === 'like'">
|
||||
<view class="sender-info">
|
||||
<image class="avatar" :src="item.avatar" mode="aspectFill"></image>
|
||||
<text class="sender-text">{{ item.sender }} 刚刚赞了你</text>
|
||||
</view>
|
||||
<text class="arrow">></text>
|
||||
</view>
|
||||
|
||||
<!-- 步数数据卡片 -->
|
||||
<view class="step-card" v-else-if="item.type === 'step'">
|
||||
<view class="step-item">
|
||||
<text class="step-num">{{ item.rank }}</text>
|
||||
<text class="step-label">名次</text>
|
||||
</view>
|
||||
<view class="step-item">
|
||||
<text class="step-num">{{ item.steps }}</text>
|
||||
<text class="step-label">步数</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 冠军通知卡片 -->
|
||||
<view class="champion-card" v-else-if="item.type === 'champion'">
|
||||
<view class="sender-info">
|
||||
<image class="avatar" :src="item.avatar" mode="aspectFill"></image>
|
||||
<text class="sender-text">{{ item.sender }} 夺得{{ item.date }}日排行榜冠军</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
messageList: [
|
||||
{
|
||||
time: '2026-03-26 22:19:00',
|
||||
type: 'champion',
|
||||
avatar: 'https://picsum.photos/id/237/60/60',
|
||||
sender: '王冕',
|
||||
date: '03月26'
|
||||
},
|
||||
{
|
||||
time: '2026-03-25 22:19:00',
|
||||
type: 'step',
|
||||
rank: 71,
|
||||
steps: 6084
|
||||
},
|
||||
{
|
||||
time: '2026-03-16 22:19:00',
|
||||
type: 'champion',
|
||||
avatar: 'https://picsum.photos/id/237/60/60',
|
||||
sender: '王冕',
|
||||
date: '03月25'
|
||||
},
|
||||
{
|
||||
time: '2026-03-26 05:36:00',
|
||||
type: 'like',
|
||||
avatar: 'https://picsum.photos/id/1005/60/60',
|
||||
sender: 'JFather'
|
||||
},
|
||||
{
|
||||
time: '2026-03-24 22:19:00',
|
||||
type: 'step',
|
||||
rank: 160,
|
||||
steps: 1838
|
||||
},
|
||||
{
|
||||
time: '2026-03-27 05:36:00',
|
||||
type: 'champion',
|
||||
avatar: 'https://picsum.photos/id/1012/60/60',
|
||||
sender: 'T薛策恒',
|
||||
date: '03月24'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 核心时间格式化方法
|
||||
formatTime(timeStr) {
|
||||
const now = new Date();
|
||||
const target = new Date(timeStr);
|
||||
const nowTime = now.getTime();
|
||||
const targetTime = target.getTime();
|
||||
const diffTime = nowTime - targetTime;
|
||||
const oneDay = 24 * 60 * 60 * 1000;
|
||||
const sevenDays = 7 * oneDay;
|
||||
|
||||
// 格式化时分秒
|
||||
const hh = String(target.getHours()).padStart(2, '0');
|
||||
const mm = String(target.getMinutes()).padStart(2, '0');
|
||||
const timeSuffix = `${hh}:${mm}`;
|
||||
|
||||
// 今天
|
||||
if (now.toDateString() === target.toDateString()) {
|
||||
return `今天 ${timeSuffix}`;
|
||||
}
|
||||
// 昨天
|
||||
const yesterday = new Date(now);
|
||||
yesterday.setDate(now.getDate() - 1);
|
||||
if (yesterday.toDateString() === target.toDateString()) {
|
||||
return `昨天 ${timeSuffix}`;
|
||||
}
|
||||
// 7天内（含昨天）
|
||||
if (diffTime <= sevenDays) {
|
||||
const weekMap = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
const week = weekMap[target.getDay()];
|
||||
return `星期${week} ${timeSuffix}`;
|
||||
}
|
||||
// 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} ${timeSuffix}`;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 页面容器 */
|
||||
.message-page {
|
||||
height: 100vh;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 消息列表 */
|
||||
.message-list {
|
||||
padding: 20rpx;
|
||||
}
|
||||
.message-item {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
/* 时间标签 */
|
||||
.time-label {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
/* 通用卡片样式 */
|
||||
.like-card, .step-card, .champion-card {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* 发送者信息（点赞/冠军） */
|
||||
.sender-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.avatar {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.sender-text {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
.arrow {
|
||||
font-size: 32rpx;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
/* 步数卡片 */
|
||||
.step-card {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.step-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.step-num {
|
||||
font-size: 64rpx;
|
||||
color: #09bb07;
|
||||
font-weight: 500;
|
||||
}
|
||||
.step-label {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue