调整微信小程序菜单

App.vue

@@ -60,7 +60,7 @@ export default {
     console.log('小程序切前台/首次显示')
     const token = getToken() || this.globalData.mqtt.token
     if (token) {
-      this.$tab.reLaunch('/pages/control/index')
+      this.$tab.reLaunch('/pages/index')
       // 兜底检查：如果globalData里没有列表，但缓存里有，补充恢复
       if (this.globalData.mqtt.subscribeList.length === 0) {
         const savedSubscribeList = uni.getStorageSync('mqtt_subscribe_list')

pages.json

@@ -12,8 +12,17 @@
   }, {
     "path": "pages/index",
     "style": {
-      "navigationBarTitleText": "智能农业移动端框架",
-      "navigationStyle": "custom"
+      "navigationBarTitleText": "首页"
+    }
+  },{
+    "path": "pages/data/index",
+    "style": {
+      "navigationBarTitleText": "数据中心"
+    }
+  }, {
+    "path": "pages/news/index",
+    "style": {
+      "navigationBarTitleText": "消息中心"
     }
   }, {
     "path": "pages/work/index",
@@ -88,21 +97,27 @@
   }],
   "tabBar": {
     "color": "#000000",
-    "selectedColor": "#000000",
+    "selectedColor": "#406ee9",
     "borderStyle": "white",
     "backgroundColor": "#ffffff",
     "list": [
       {
-        "pagePath": "pages/control/index",
-        "iconPath": "static/images/tabbar/work.png",
-        "selectedIconPath": "static/images/tabbar/work_.png",
-        "text": "控制中心"
+        "pagePath": "pages/index",
+        "iconPath": "static/images/tabbar/home.png",
+        "selectedIconPath": "static/images/tabbar/home_.png",
+        "text": "首页"
       },
       {
-        "pagePath": "pages/work/index",
-        "iconPath": "static/images/tabbar/work.png",
-        "selectedIconPath": "static/images/tabbar/work_.png",
-        "text": "工作台"
+        "pagePath": "pages/data/index",
+        "iconPath": "static/images/tabbar/data.png",
+        "selectedIconPath": "static/images/tabbar/data_.png",
+        "text": "历史数据"
+      },
+      {
+        "pagePath": "pages/news/index",
+        "iconPath": "static/images/tabbar/news.png",
+        "selectedIconPath": "static/images/tabbar/news_.png",
+        "text": "消息中心"
       },
       {
         "pagePath": "pages/mine/index",

pages/data/index.vue

@@ -0,0 +1,38 @@
+<script setup>
+</script>
+<template>
+  <view class="content">
+    <image class="logo" src="@/static/logo200.png"></image>
+    <view class="text-area">
+      <text class="title">页面建设中~</text>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.logo {
+  height: 200rpx;
+  width: 200rpx;
+  margin-top: 200rpx;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 50rpx;
+}
+
+.text-area {
+  display: flex;
+  justify-content: center;
+}
+
+.title {
+  font-size: 36rpx;
+  color: #8f8f94;
+}
+</style>

pages/login.vue

@@ -113,7 +113,7 @@
     onLoad() {
       //#ifdef H5
       if (getToken()) {
-        this.$tab.reLaunch('/pages/control/index')
+        this.$tab.reLaunch('/pages/index')
       }
       //#endif
       // ========== 新增：页面加载时自动回填密码 ==========
@@ -282,7 +282,7 @@
           app.loginSuccess(token)
 
           // ========== 原有逻辑保留 ==========
-          this.$tab.reLaunch('/pages/control/index')
+          this.$tab.reLaunch('/pages/index')
         })
       }
     }

pages/mine/setting/index.vue

@@ -56,7 +56,7 @@
             // 2. 调用App.vue的logout方法（断开MQTT+清空订阅列表）
             app.logout()
           }).finally(()=>{
-            this.$tab.reLaunch('/pages/control/index')
+            this.$tab.reLaunch('/pages/index')
           })
         })
       }

pages/news/index.vue

@@ -0,0 +1,299 @@
+<template>
+  <view >
+<!--    <view class="nav-list">
+      <view class="nav-item" v-for="(item, index) in navItems" :key="index" @tap="switchTab(index)">
+        <image :src="item.icon" mode="aspectFit" class="nav-icon"></image>
+        <text :class="['nav-text', { 'active': currentTab === index }]">{{ item.title }}</text>
+        <view v-if="item.count > 0" class="nav-badge">{{ item.count }}</view>
+      </view>
+    </view>-->
+
+    <scroll-view scroll-y class="message-list" @scrolltolower="loadMore">
+      <view v-for="(msg, index) in filteredMessages" :key="index" class="message-item" @tap="onMessageTap(msg)">
+        <image :src="msg.avatar" class="avatar" mode="aspectFill"></image>
+        <view class="message-content">
+          <view class="message-header">
+            <text class="sender">{{ msg.sender }}</text>
+            <text class="time">{{ msg.time }}</text>
+          </view>
+          <text class="preview" :class="{ 'unread': msg.unread }">{{ msg.preview }}</text>
+        </view>
+        <view v-if="msg.unread" class="unread-badge">
+          <text>{{ msg.unreadCount }}</text>
+        </view>
+      </view>
+      <view v-if="isLoading" class="loading">
+        <uni-icons type="spinner-cycle" size="24" color="#007AFF"></uni-icons>
+        <text>加载中...</text>
+      </view>
+    </scroll-view>
+
+
+    <view v-if="filteredMessages.length === 0" class="empty-state">
+      <uni-icons type="inbox" size="64" color="#999"></uni-icons>
+      <text>暂无消息</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      currentTab: 0,
+      navItems: [{
+        title: '评论',
+        icon: 'https://www.zenkuai.com/attachment/demo/1.png',
+        count: 5
+      },
+        {
+          title: '粉丝',
+          icon: 'https://www.zenkuai.com/attachment/demo/2.png',
+          count: 2
+        },
+        {
+          title: '点赞',
+          icon: 'https://www.zenkuai.com/attachment/demo/2.png',
+          count: 10
+        }
+      ],
+      searchText: '',
+      messages: [
+        {
+        id: 1,
+        sender: '系统通知',
+        avatar: '/static/news.png',
+        preview: '您有一条新的系统通知，请查看',
+        time: '10:30',
+        unread: true,
+        unreadCount: 1
+      },
+        {
+          id: 2,
+          sender: '告警中心',
+          avatar: '/static/alarm.png',
+          preview: '您有一条新告警->',
+          time: '昨天',
+          unread: false,
+          unreadCount: 0
+        },
+        {
+          id: 3,
+          sender: '客服小美',
+          avatar: '/static/cs.png',
+          preview: '您好，请问有什么可以帮到您的吗？',
+          time: '昨天',
+          unread: false,
+          unreadCount: 0
+        },
+        // 可以添加更多消息数据
+      ],
+      isLoading: false
+    }
+  },
+  computed: {
+    filteredMessages() {
+      return this.messages.filter(msg =>
+          msg.sender.toLowerCase().includes(this.searchText.toLowerCase()) ||
+          msg.preview.toLowerCase().includes(this.searchText.toLowerCase())
+      )
+    }
+  },
+  methods: {
+    switchTab(index) {
+      this.currentTab = index;
+      // 这里可以根据选中的标签加载相应的消息数据
+      console.log('Switched to tab:', this.navItems[index].title);
+    },
+    onMessageTap(msg) {
+      console.log('Message tapped:', msg)
+      uni.navigateTo({
+        url: `/pages/message-detail/message-detail?id=${msg.id}`
+      })
+    },
+    loadMore() {
+      if (this.isLoading) return
+      this.isLoading = true
+      // 模拟加载更多消息
+      setTimeout(() => {
+        // 这里应该是从服务器加载更多消息的逻辑
+        this.messages.push(...[{
+          id: this.messages.length + 1,
+          sender: '新消息',
+          avatar: 'https://www.zenkuai.com/attachment/demo/1.png',
+          preview: '这是一条新加载的消息',
+          time: '刚刚',
+          unread: true,
+          unreadCount: 1
+        }])
+        this.isLoading = false
+      }, 1000)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+.msg-center {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  background-color: #f5f5f5;
+}
+
+
+.header {
+  background-color: #ffffff;
+  padding: 40rpx 20rpx 20rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+}
+
+.title {
+  font-size: 36rpx;
+  font-weight: bold;
+  margin-bottom: 20rpx;
+}
+
+
+.nav-list {
+  display: flex;
+  justify-content: space-around;
+  margin: 20rpx;
+  background-color: #fff;
+  padding: 20rpx;
+  border-radius: 20rpx;
+}
+
+.nav-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+
+.nav-icon {
+  width: 60rpx;
+  height: 60rpx;
+  margin-bottom: 10rpx;
+}
+
+.nav-text {
+  font-size: 24rpx;
+  color: #666;
+}
+
+.nav-text.active {
+  color: #007AFF;
+  font-weight: bold;
+}
+
+.nav-badge {
+  position: absolute;
+  top: -10rpx;
+  right: -10rpx;
+  background-color: #FF3B30;
+  color: #ffffff;
+  border-radius: 20rpx;
+  padding: 2rpx 10rpx;
+  font-size: 20rpx;
+}
+
+.message-list {
+  flex: 1;
+  margin: 30rpx 20rpx;
+}
+.message-item {
+  display: flex;
+  align-items: center;
+  padding: 20rpx;
+  background-color: #ffffff;
+  border-radius: 10rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  transition: all 0.3s ease;
+  width: 94%;
+  height: 150rpx;
+}
+
+.message-item:active {
+  transform: scale(0.98);
+}
+
+.avatar {
+  width: 90rpx;
+  height: 90rpx;
+  border-radius: 50%;
+  margin-right: 20rpx;
+}
+
+.message-content {
+  flex: 1;
+  margin-right: 20rpx;
+}
+
+.message-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 10rpx;
+}
+
+.sender {
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.time {
+  font-size: 24rpx;
+  color: #999;
+}
+
+.preview {
+  font-size: 26rpx;
+  color: #666;
+}
+
+.preview.unread {
+  font-weight: bold;
+  color: #333;
+}
+
+.unread-badge {
+  background-color: #007AFF;
+  color: #ffffff;
+  border-radius: 20rpx;
+  padding: 4rpx 12rpx;
+  font-size: 24rpx;
+}
+
+
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  color: #999;
+}
+
+.empty-state text {
+  margin-top: 20rpx;
+  font-size: 28rpx;
+}
+
+
+.loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20rpx;
+}
+
+.loading text {
+  margin-left: 10rpx;
+  font-size: 28rpx;
+  color: #007AFF;
+}
+</style>