feat：小程序消息中心研发

project.config.json

@@ -2,19 +2,44 @@
     "miniprogramRoot": "dist/",
     "projectname": "taro-react-tailwind-vscode-template",
     "description": "",
-  "appid": "touristappid",
+    "appid": "wxc422ab9e3d9174d8",
     "setting": {
         "urlCheck": true,
         "es6": false,
         "enhance": false,
-    "compileHotReLoad": false,
         "postcss": false,
+        "preloadBackgroundData": false,
         "minified": false,
+        "newFeature": false,
+        "coverView": true,
+        "nodeModules": false,
+        "autoAudits": false,
+        "showShadowRootInWxmlPanel": true,
+        "scopeDataCheck": false,
+        "uglifyFileName": false,
+        "checkInvalidKey": true,
+        "checkSiteMap": true,
+        "uploadWithSourceMap": true,
+        "compileHotReLoad": false,
+        "lazyloadPlaceholderEnable": false,
+        "useMultiFrameRuntime": true,
+        "useApiHook": true,
+        "useApiHostProcess": true,
         "babelSetting": {
             "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",
@@ -23,9 +48,9 @@
         "ignore": [],
         "include": []
     },
-  "condition": {},
     "editorSetting": {
         "tabIndent": "insertSpaces",
         "tabSize": 2
-  }
+    },
+    "condition": {}
 }

project.private.config.json

@@ -3,5 +3,19 @@
     "projectname": "taro-react-tailwind-vscode-template",
     "setting": {
         "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>
     )
 }