From 2dd822a24baea9e0cf703a04896fe69a33d2f048 Mon Sep 17 00:00:00 2001
From: "@wpf" <15514537552@163.com>
Date: Sun, 5 May 2024 11:24:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B6=88=E6=81=AF=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/footers/footers.vue      |  11 ++
 node_modules/.package-lock.json     |   2 +-
 pages.json                          |  22 ++++
 pages/messageTask/messageDetail.vue |  64 +++++++++++
 pages/messageTask/messageList.vue   | 166 ++++++++++++++++++++++++++++
 pages/messageTask/messageTask.vue   | 133 ++++++++++++++++++++++
 6 files changed, 397 insertions(+), 1 deletion(-)
 create mode 100644 pages/messageTask/messageDetail.vue
 create mode 100644 pages/messageTask/messageList.vue
 create mode 100644 pages/messageTask/messageTask.vue

diff --git a/components/footers/footers.vue b/components/footers/footers.vue
index 4518ab76..e44132d3 100644
--- a/components/footers/footers.vue
+++ b/components/footers/footers.vue
@@ -29,6 +29,12 @@
 			this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
 			if (this.userInfo.accountType == 5 || this.userInfo.accountType == 6 || this.userInfo.accountType == 10) {
 				this.tabList.push({
+					appName: '消息',
+					moduleIcon2: 'tabIcon-index',
+					moduleIcon: 'tabIcon-index-active',
+					plugin: 'messageTask',
+					appShow: 1
+				},{
 					appName: '首页',
 					moduleIcon2: 'tabIcon-index',
 					moduleIcon: 'tabIcon-index-active',
@@ -173,6 +179,11 @@
 							url: '../../pages/markRoomManage/markRoomManage'
 						})
 						break;
+					case 'messageTask':
+						uni.redirectTo({
+							url: '/pages/messageTask/messageTask'
+						})
+						break;
 				}
 			}
 		}
diff --git a/node_modules/.package-lock.json b/node_modules/.package-lock.json
index b0c98b9f..13df6de5 100644
--- a/node_modules/.package-lock.json
+++ b/node_modules/.package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "zhgdyunapp",
-  "lockfileVersion": 2,
+  "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "node_modules/@babel/runtime": {
diff --git a/pages.json b/pages.json
index 70116fc3..6829739f 100644
--- a/pages.json
+++ b/pages.json
@@ -1597,6 +1597,28 @@
             }
             
         }
+		,{
+			"path": "pages/messageTask/messageTask",
+			"style": {}
+		}
+		,{
+		    "path" : "pages/messageTask/messageList",
+		    "style" :                                                                                    
+		    {
+		        "navigationBarTitleText": "",
+		        "enablePullDownRefresh": false
+		    }
+		    
+		}
+		,{
+		    "path" : "pages/messageTask/messageDetail",
+		    "style" :                                                                                    
+		    {
+		        "navigationBarTitleText": "",
+		        "enablePullDownRefresh": false
+		    }
+		    
+		}
 	],
 	// "subPackages":[{
 	// 	"root": "carManage",
diff --git a/pages/messageTask/messageDetail.vue b/pages/messageTask/messageDetail.vue
new file mode 100644
index 00000000..a8e49bd5
--- /dev/null
+++ b/pages/messageTask/messageDetail.vue
@@ -0,0 +1,64 @@
+<template>
+	<view class="">
+		<headers :showBack="true">
+			<view class="headerName">
+				查看详情
+			</view>
+		</headers>
+		<view class="main">
+			<view class="head">
+				【#梅大高速塌方货车司机夫妇喊停后车#：车身长掉头时堵路摆手拦住后车】
+			</view>
+			<view class="hint">
+				#梅大高速塌方货车司机大车堵路喊停来车#据广东梅州大埔县委宣传部通报，截至5月1日15时，事故造成20辆车陷落，涉及54人，其中24人死亡，30人正在医院全力救治。1日2时许，在梅大高速驶向泉州的冷藏车司机王先生和妻子发现异常。王先生回忆，当时他们距离塌方路段约100多米，看到几辆小车逆行驶来，“我赶紧降速打双闪，有个大姐说前面道路塌陷起火了。我尝试掉头，冷藏车车身较长把路堵住了，后车都纷纷减速了，后来我把车回正，和妻子下车摆手示意让后车停车。”
+			</view>
+			<image class="picture" src="../../static/titleBg.png" mode=""></image>
+			<view class="time">
+				2023-12-12 02:00:00
+			</view>
+		</view>
+		<view class="btn">
+			处置违规
+		</view>
+	</view>
+</template>
+
+<script>
+</script>
+
+<style lang="scss" scoped>
+	.main{
+		padding: 12px;
+		padding-bottom: 50px;
+		.head{
+			font-size: 18px;
+			font-weight: 700;
+			margin-bottom: 24px;
+		}
+		.hint{
+			font-size: 14px;
+			color: #666;
+			margin-bottom: 24px;
+		}
+		.picture{
+			width: 100%;
+			margin-bottom: 24px;
+		}
+		.time{
+			display: flex;
+			justify-content: flex-end;
+		}
+	}
+	.btn{
+		position: absolute;
+		bottom: 0;
+		width: 100%;
+		height: 48px;
+		background-color: #1E90FF;
+		color: #fff;
+		font-size: 16px;
+		font-weight: 700;
+		text-align: center;
+		line-height: 48px;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/messageTask/messageList.vue b/pages/messageTask/messageList.vue
new file mode 100644
index 00000000..52ed4235
--- /dev/null
+++ b/pages/messageTask/messageList.vue
@@ -0,0 +1,166 @@
+<template>
+	<view class="">
+		<headers :showBack="true">
+			<view class="headerName">
+				{{headersName}}
+			</view>
+		</headers>
+		<!--选项 -->
+		<view class="item">
+			<view class="itemInner" :class="tabIndex==0?'active':''" @click="tabIndex=0">
+				<view class="">
+					未读
+				</view>
+			</view>
+			<view class="itemInner" :class="tabIndex==1?'active':''" @click="tabIndex=1">
+				<view class="">
+					全部
+				</view>
+			</view>
+		</view>
+		<!--列表 -->
+		<view class="list" v-if="tabIndex==0">
+			<view class="list-item" v-for="item in 12" @click="toDetail">
+				<view class="content">
+					<view class="head">
+						您有一条【安全隐患大项待整改】您有一条【安全隐患大项待整改】
+					</view>
+					<view class="hint">
+						点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入
+					</view>
+				</view>
+				
+				<view class="box">
+					<view class="left">
+						发生时间：2023-12-12
+					</view>
+					<view class="right">
+						查看更多
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="list" v-if="tabIndex==1">
+			<view class="list-item" v-for="item in 5" @click="toDetail">
+				<view class="content">
+					<view class="head">
+						您有一条【安全隐患大项待整改】您有一条【安全隐患大项待整改】
+					</view>
+					<view class="hint">
+						点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入点击进入
+					</view>
+				</view>
+				
+				<view class="box">
+					<view class="left">
+						发生时间：2023-12-12
+					</view>
+					<view class="right">
+						查看更多
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import headers from "@/components/headers/headers.vue"
+	export default {
+		components: {
+			headers
+		},
+		data() {
+			return{
+				headersName:'',
+				tabIndex:0
+			}
+		},
+		onLoad(e){
+			console.log(e.name)
+			this.headersName = e.name
+		},
+		methods: {
+			toDetail(){
+				uni.navigateTo({
+					url: './messageDetail'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.item {
+		display: flex;
+		box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.4);
+		margin-bottom: 20px;
+		.itemInner {
+			display: flex;
+			flex: 1;
+			align-items: center;
+			justify-content: center;
+			padding: 15px 0;
+		}
+		.active {
+			color: #1E90FF;
+			font-weight: bold;
+			border-bottom: 1px solid #1E90FF;
+		}
+	}
+	.list{
+		padding-bottom: 30px;
+		.list-item{
+			height: 92px;
+			box-sizing: border-box;
+			display: flex;
+			justify-content: space-between;
+			flex-direction: column;
+			margin: 6px 12px;
+			padding: 6px 12px;
+			border-radius: 6px;
+			box-shadow: 0px 0px 8px -3px rgba(0, 0, 0, 0.4);
+			.content{
+				.head{
+					font-size: 14px;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+					margin-bottom: 2px;
+				}
+				.hint{
+					font-size: 10px;
+					color: #666;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					display: -webkit-box;
+					-webkit-line-clamp: 2;  
+					-webkit-box-orient: vertical;
+				}
+			}
+			.box{
+				display: flex;
+				justify-content: space-between;
+				.left{
+					display: flex;
+					align-items: flex-end;
+					font-size: 10px;
+					color: #666;
+				}
+				.right{
+					display: flex;
+					align-items: flex-end;
+					height: 20px;
+					padding: 0 6px;
+					background: linear-gradient(to right, #c3c3c3, #fff);
+					border-radius: 12px;
+					color: #DA70D6;
+					box-sizing: border-box;
+					font-size: 14px;
+					line-height: 20px;
+				}
+			}
+		}
+	}
+	
+</style>
\ No newline at end of file
diff --git a/pages/messageTask/messageTask.vue b/pages/messageTask/messageTask.vue
new file mode 100644
index 00000000..b68ca7b9
--- /dev/null
+++ b/pages/messageTask/messageTask.vue
@@ -0,0 +1,133 @@
+<template>
+	<view>
+		<headers :showBack="false" :themeType="'white'">
+			<view class="headerName">
+				消息
+			</view>
+		</headers>
+		<view class="operateBar" @click="toList('通知公告')">
+			<view class="left">
+				<view class="box">
+					<view class="num">
+						26
+					</view>
+					<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
+				</view>
+				通知公告
+			</view>
+			<view class="right">
+				<view class="time">
+					2023-3-21
+				</view>
+			</view>
+		</view>
+		<view class="operateBar" @click="toList('任务代办')">
+			<view class="left">
+				<view class="box">
+					<view class="num">
+						26
+					</view>
+					<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
+				</view>
+				任务代办
+			</view>
+			<view class="right">
+				<view class="time">
+					2023-3-21
+				</view>
+			</view>
+		</view>
+		<view class="operateBar" @click="toList('风险预警')">
+			<view class="left">
+				<view class="box">
+					<view class="num">
+						26
+					</view>
+					<image class="operateIcon" src="@/static/file.png" mode="widthFix"></image>
+				</view>
+				风险预警
+			</view>
+			<view class="right">
+				<view class="time">
+					2023-3-21
+				</view>
+			</view>
+		</view>
+	
+		<footers :activeTab="'messageTask'"></footers>
+	</view>
+</template>
+
+<script>
+	import footers from "../../components/footers/footers.vue"
+	import headers from "@/components/headers/headers.vue"
+	
+	export default {
+		components: {
+			footers,
+			headers
+		},
+		data() {
+			return{
+				accountType: 1,
+			}
+		},
+		methods: {
+			toList(name){
+				//带头部名称跳转
+				uni.navigateTo({
+					url: './messageList?name='+name
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.operateBar {
+		background-color: #FFFFFF;
+		font-size: 14px;
+		height: 58px;
+		display: flex;
+		margin: 0 15px;
+		padding: 12px 0;
+		justify-content: space-between;
+		border-bottom: 1px solid #f3f3f3;
+	
+		.left {
+			display: flex;
+			align-items: center;
+			.box{
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				position: relative;
+				width: 32px;
+				height: 32px;
+				margin-right: 10px;
+				.num{
+					position: absolute;
+					right: 0;
+					top: 0;
+					font-size: 8px;
+					padding: 0 4px;
+					background-color: red;
+					color: #fff;
+					border-radius: 12px;
+				}
+				.operateIcon {
+					width: 20px;
+					height: 20px;
+				}
+			}
+		}
+		.right{
+			display: flex;
+			.time{
+				font-size: 12px;
+				color: #c3c3c3;
+			}
+		}
+		
+	}
+</style>
\ No newline at end of file