feat：小程序消息中心研发

project.config.json

@@ -1,31 +1,56 @@
 {
-  "miniprogramRoot": "dist/",
+    "miniprogramRoot": "dist/",
-  "projectname": "taro-react-tailwind-vscode-template",
+    "projectname": "taro-react-tailwind-vscode-template",
-  "description": "",
+    "description": "",
-  "appid": "touristappid",
+    "appid": "wxc422ab9e3d9174d8",
-  "setting": {
+    "setting": {
-    "urlCheck": true,
+        "urlCheck": true,
-    "es6": false,
+        "es6": false,
-    "enhance": false,
+        "enhance": false,
-    "compileHotReLoad": false,
+        "postcss": false,
-    "postcss": false,
+        "preloadBackgroundData": false,
-    "minified": false,
+        "minified": false,
-    "babelSetting": {
+        "newFeature": false,
-      "ignore": [],
+        "coverView": true,
-      "disablePlugins": [],
+        "nodeModules": false,
-      "outputPath": ""
+        "autoAudits": false,
-    }
+        "showShadowRootInWxmlPanel": true,
-  },
+        "scopeDataCheck": false,
-  "compileType": "miniprogram",
+        "uglifyFileName": false,
-  "libVersion": "2.30.3",
+        "checkInvalidKey": true,
-  "srcMiniprogramRoot": "dist/",
+        "checkSiteMap": true,
-  "packOptions": {
+        "uploadWithSourceMap": true,
-    "ignore": [],
+        "compileHotReLoad": false,
-    "include": []
+        "lazyloadPlaceholderEnable": false,
-  },
+        "useMultiFrameRuntime": true,
-  "condition": {},
+        "useApiHook": true,
-  "editorSetting": {
+        "useApiHostProcess": true,
-    "tabIndent": "insertSpaces",
+        "babelSetting": {
-    "tabSize": 2
+            "ignore": [],
-  }
+            "disablePlugins": [],
+            "outputPath": ""
+        },
+        "useIsolateContext": true,
+        "userConfirmedBundleSwitch": false,
+        "packNpmManually": false,
+        "packNpmRelationList": [],
+        "minifyWXSS": true,
+        "disableUseStrict": false,
+        "minifyWXML": true,
+        "showES6CompileOption": false,
+        "useCompilerPlugins": false,
+        "ignoreUploadUnusedFiles": true
+    },
+    "compileType": "miniprogram",
+    "libVersion": "2.30.3",
+    "srcMiniprogramRoot": "dist/",
+    "packOptions": {
+        "ignore": [],
+        "include": []
+    },
+    "editorSetting": {
+        "tabIndent": "insertSpaces",
+        "tabSize": 2
+    },
+    "condition": {}
 }

project.private.config.json

@@ -1,7 +1,21 @@
 {
-  "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
+    "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
-  "projectname": "taro-react-tailwind-vscode-template",
+    "projectname": "taro-react-tailwind-vscode-template",
-  "setting": {
+    "setting": {
-    "compileHotReLoad": false
+        "compileHotReLoad": false
-  }
+    },
+    "condition": {
+        "plugin": {
+            "list": []
+        },
+        "game": {
+            "list": []
+        },
+        "gamePlugin": {
+            "list": []
+        },
+        "miniprogram": {
+            "list": []
+        }
+    }
 }

src/pages/msgCenter/index.tsx

@@ -1,8 +1,98 @@
-import { View } from "@tarojs/components"
+import { View,Image } from "@tarojs/components"
-
+import { useState } from "react"
+import warn from './assets/warn.png'
+import rang from './assets/rang.png'
+import './index.scss'
 const MsgCenter = () => {
+    const [selectedMenuId, setSelectedMenuId] = useState('all')
+    let contList=[
+        {
+            title:'土壤EC值预警',
+            time:'2024/3/13 16:30',
+            url:'./assets/rang.png',
+            message:'1号基地土壤EC值低于0.4阈值报警',
+            id:'1'
+        },
+        {
+            title:'棚内温度报警',
+            url:'./assets/rang.png',
+            time:'2024/3/1 10:30',
+            message:'3号棚内温度39度,超过阈值37度,建议打开放风机',
+            id:'1'
+        },
+        {
+            title:'系统通知',
+            url:'./assets/warn.png',
+            time:'2024/3/13 8:30',
+            message:'今日设备巡检结果尚未填报',
+            id:'0'
+        },
+        {
+            title:'虫情预警',
+            url:'./assets/rang.png',
+            time:'2024/3/13 6:30',
+            message:'1号棚内虫害数量接近阈值预警',
+            id:'1'
+        },
+    ]
+    const topMenus = [
+        {
+            id: 'all',
+            title: '全部'
+        },
+        {
+            id: '1',
+            title: '预警'
+        },
+        {
+            id: '2',
+            title: '通知'
+        },
+    ]
+
+    const dataList = [
+        {
+            id: '1',
+        },
+        {
+            id: '2',
+        },
+    ]
+  
     return (
-        <View>MsgCenter</View>
+        <View>
+            <View className='flex px-2 py-1 border-b-2 border-slate-100' >
+                    {
+                        topMenus.map(item => {
+                            return (
+                                <View
+                                    className={`p-1 px-3 ${selectedMenuId === item.id ? 'text-lime-600 border-b-4 border-lime-800' : ''}`}
+                                    key={item.id}
+                                    onClick={() => setSelectedMenuId(item.id)}
+                                >{ item.title }</View>
+                            )
+                        })
+                    }
+            </View>
+            <View className='main'>
+                {
+                    contList.map((item,index)=>{
+                        return (
+                            <View className='cont' key={index}>
+                                <Image src={item.id=='1'?rang:warn} className='w-12 h-12'></Image>
+                                <View className='right'>
+                                    <View className='right-top'>
+                                        <View className='top-left'>{item.title}</View>
+                                        <View className='top-right'>{item.time}</View>
+                                    </View>
+                                    <View className={item.id=='1'?'rang':'warn'}>{item.message}</View>
+                                </View>
+                            </View>
+                        )
+                    })
+                }
+            </View>
+        </View>
     )
 }