通知绑定，通知页面优化，首页优化

components/back/back.vue

@@ -1,7 +1,6 @@
 <template>
 	<view class="back" :style="'height:'+capsuleHeight+ 'px;top:'+capsuleHighly+'px;'">
-		<!-- <view class="t-icon t-icon-fanhui2-copy" @click="backIconHandler"></view> -->
-		<u-icon name="arrow-left" color="#000000" size="18" @click="backIconHandler"></u-icon>
+		<u-icon name="arrow-left" color="#000000" size="20" @click="backIconHandler"></u-icon>
 		<view class="back-text">
 			{{ text }}
 		</view>
@@ -30,14 +29,11 @@
 		},
 		methods:{
 			backIconHandler(){
-				//调用自定义事件
-				// this.$emit('click')
 				uni.navigateBack()
 			},
 			//获取胶囊位置信息
 			getCapsuleSite(){
 				let res=uni.getMenuButtonBoundingClientRect()
-				console.log(res)
 				this.capsuleHeight = res.height
 				this.capsuleHighly = res.top 
 			}
@@ -60,7 +56,7 @@
 		
 		.back-text{
 			font-size: 40rpx;
-			margin-left: 20rpx;
+			margin:0 0 10rpx 20rpx;
 		}
 	}
 </style>

components/todaydata-box/todaydata-box.vue

@@ -194,7 +194,7 @@
 
 	.module-item-text {
 		color: #FFF;
-		font-size: 44rpx;
+		font-size: 40rpx;
 		font-weight: bold;
 		z-index: 5;
 	}
@@ -205,7 +205,7 @@
 
 		.module-item-num {
 			color: #FFF;
-			font-size: 38rpx;
+			font-size: 30rpx;
 			font-weight: bold;
 		}
 	}

gradepkg/area-chart/area-chart.vue

@@ -85,11 +85,7 @@
 				//newValue为变化后的新值
 				handler(newValue) {
 					//拿到对应图表数据
-					// let findResult = this.gradeData.subjectAreaChart.areaComparison.series[0].name.indexOf(newValue)
-					//获得图表展示的科目名称数据并与变化后的新值做比对
 					let subjectChartData = this.getdata.data.find(x => x.series[0].name.includes(newValue))
-					console.log(newValue)
-					console.log(subjectChartData)
 					this.updateSubjectAreaComparison(subjectChartData)
 				},
 				//immediate 属性用来声明此监听器是否在页面初次加载完毕后立即调用
@@ -117,7 +113,6 @@
 			...mapMutations('m_chart', ['updateSubjectAreaComparison']),
 			//科目切换事件
 			changeHandler(e) {
-				console.log(e)
 				this.temp = e.value[0]
 			},
 			//设置孩子科目

gradepkg/radar-chart/radar-chart.vue

@@ -19,7 +19,7 @@
 					<view v-if="mainExamUndulate>=quizExamUndulate" class="t-icon t-icon-jiangbei-4"></view>
 					<view v-if="mainExamUndulate<quizExamUndulate" class="t-icon t-icon-jiangbei-3"></view>
 					<view v-if="mainExamUndulate>=quizExamUndulate" class="icon-text-item">重要考试时沉住气稳住心态</view>
-					<view v-if="mainExamUndulate<quizExamUndulate" class="icon-text-item">普通考试也不能掉以轻心</view>
+					<view v-if="mainExamUndulate<quizExamUndulate" class="icon-text-item">普通考试时也不能掉以轻心</view>
 				</view>
 			</view>
 

information/parent.js

@@ -14,11 +14,28 @@ export default {
 
 		parentdetail: JSON.parse(uni.getStorageSync('parentdetail') || '{}'),
 		myData: {
-			msgList: {
-				'成绩通知':[''],
-				'系统通知':[],
-				'任务通知':[],
+			msgList: [{
+					icon: 't-icon t-icon-shuju',
+					title: '成绩通知',
+					msgTime: '12分钟前',
+					content: '您的孩子【张梅】在 【青城山学校】的【2020年语文期末测试】成绩已经生成，请点击查看详情 > ',
+					image: 'https://image.meiye.art/pic_9ikZaVYnJE38Ao6AZlVIx?imageMogr2/thumbnail/450x/interlace/1'
+				},
+				{
+					icon: 't-icon t-icon-tishi',
+					title: '系统通知',
+					msgTime: '20分钟前',
+					content: '您以成功绑定【青城山学校】【五年级8班】【张梅】学生。',
+					image: 'https://image.meiye.art/pic_ucQUd7WwkuW1vKvjbgUlv?imageMogr2/thumbnail/450x/interlace/1'
+				},
+				{
+					icon: 't-icon t-icon-bianji',
+					title: '任务通知',
+					msgTime: '40分钟前',
+					content: '您的孩子【张梅】班主任李老师给您发布一个新的问卷活动【周末孩子表现问卷调查】，快去填写吧 ',
+					image: 'https://image.meiye.art/pic_1628927180566LfOmH3IV5i24Mmc65BGE0?imageMogr2/thumbnail/450x/interlace/1'
 				}
+			]
 		}
 
 	}),
@@ -53,7 +70,7 @@ export default {
 		saveTokenToStorage(state) {
 			uni.setStorageSync('token',state.token)
 		},
-		//删除我的消息
+		//更新我的消息
 		updateMyMsg(state,msgList) {
 			state.msgList = msgList
 		},
@@ -65,6 +82,6 @@ export default {
 	},
 	//模块属性(数据包装)
 	getters: {
-
+		
 	}
 }

main.js

@@ -9,8 +9,10 @@ import store from '@/information/store.js'
 //导入uView组件库
 import uView from '@/uni_modules/uview-ui'
 //导入公共方法
-import RepeatClick from './utils/RepeatClick.js'
+import RepeatClick from './utils/RepeatClick.js'
+import TimeUtils from './utils/TimeUtils.js'
 Vue.prototype.$noMultipleClicks = RepeatClick.noMultipleClicks;
+Vue.prototype.$getTimeStamp = TimeUtils.getTimeStamp;
 
 //挂载到uni.$http上方便调用
 uni.$http = $http

pages/grade/grade.vue

@@ -102,6 +102,17 @@
 				timeStamp: '',
 			}
 		},
+		onLoad() {
+			this.$getTimeStamp()
+		},
+		//刷新页面
+		onPullDownRefresh() {
+			this.$getTimeStamp()
+			console.log('refresh');
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
+		},
 		methods: {
 			//导航柱状图页面
 			navColumnChart(e) {
@@ -124,25 +135,8 @@
 					url: "/gradepkg/line-chart/line-chart"
 				})
 			},
-			//更新时间戳
-			getTimeStamp() {
-				var date = new Date(),
-					hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
-					minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
-				this.timeStamp = (hour + ':' + minute).toString();
-			}
 		},
-		onLoad() {
-			this.getTimeStamp()
-		},
-		//刷新页面
-		onPullDownRefresh() {
-			this.getTimeStamp()
-			console.log('refresh');
-			setTimeout(function() {
-				uni.stopPullDownRefresh();
-			}, 1000);
-		}
+		
 	}
 </script>
 

pages/home/home.vue

@@ -4,7 +4,7 @@
 		<top-box v-bind:timeStamp="timeStamp"></top-box>
 		<!-- 滚动条 -->
 		<view class="notice">
-			<u-notice-bar :text="noticeMsg" mode="closable" bgColor="rgba(91, 126, 220, 0.5)" color="#FFFFFF"></u-notice-bar>
+			<u-notice-bar :text="noticeMsg" mode="closable" bgColor="rgba(73, 125, 220, 0.25)" color="#FFF" url="/subpkg/mymsg/mymsg"></u-notice-bar>
 		</view>
 		<!-- 卡片区域 -->
 		<view class="card-box">
@@ -150,11 +150,12 @@
 		},
 		onLoad() {
 			this.setOpts()
-			this.getTimeStamp()
+			this.$getTimeStamp()
+			this.getNoticeMsg()
 		},
 		onPullDownRefresh() {
 			this.setOpts()
-			this.getTimeStamp()
+			this.$getTimeStamp()
 			console.log('refresh')
 			setTimeout(function() {
 				uni.stopPullDownRefresh()
@@ -163,9 +164,7 @@
 		methods: {
 			//获取滚动通知
 			getNoticeMsg(){
-				for(let msg in this.myData.msgList){
-					console.log(msg)
-				}
+				this.noticeMsg = `您有 ${this.myData.msgList.length} 个通知,请点击查看`
 			},
 			//设置更新
 			setOpts() {
@@ -205,13 +204,6 @@
 			chooseCalendar(e) {
 				console.log(e)
 			},
-			//更新时间戳
-			getTimeStamp() {
-				var date = new Date(),
-					hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
-					minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
-				this.timeStamp = (hour + ':' + minute).toString();
-			}
 
 		},
 	}
@@ -221,7 +213,7 @@
 	@import '@/pages/common/mainpage.scss';
 	//日历
 	.calendar_container {
-		background-color: #FFFFFF;
+		background-color: #FFF;
 		padding: 10rpx;
 		margin: 10rpx;
 		box-sizing: border-box;

pages/my/my.vue

@@ -165,7 +165,6 @@
 </script>
 
 <style lang="scss">
-	page,
 	.my-container {
 		height: 100%;
 

pages/subscribe/subscribe.vue

@@ -41,26 +41,20 @@
 				]
 			}
 		},
-		methods: {
-			//更新时间戳
-			getTimeStamp() {
-				var date = new Date(),
-					hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
-					minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
-				this.timeStamp = (hour + ':' + minute).toString();
-			}
-		},
 		onLoad() {
-			this.getTimeStamp()
+			this.$getTimeStamp()
 		},
 		//刷新页面
 		onPullDownRefresh() {
-			this.getTimeStamp()
+			this.$getTimeStamp()
 			console.log('refresh');
 			setTimeout(function() {
 				uni.stopPullDownRefresh();
 			}, 1000);
-		}
+		},
+		methods: {
+	
+		},
 	}
 </script>
 

subpkg/MyMsg/MyMsg.vue

@@ -2,39 +2,24 @@
 	<view class="notice-container">
 		<!-- 返回按钮 -->
 		<back text="通知"></back>
-		<!-- <p class="notice-title">通知</p> -->
+
 		<view class="notice-wrap">
-			<view class="notice-item">
-				<view class="notice-item-title">
-					<view class="left">
-						<view class="t-icon t-icon-shuju" ></view>成绩通知
-					</view>
-					<text>12分钟前</text>
-				</view>
-				<view class="notice-item-content">您的孩子【张梅】在 【青城山学校】的【2020年语文期末测试】成绩已经生成，请点击查看详情 > </view>
-				<image class="notice-item-poster" src="https://image.meiye.art/pic_9ikZaVYnJE38Ao6AZlVIx?imageMogr2/thumbnail/450x/interlace/1" mode="widthFix"></image>
-			</view>
-			<view class="notice-item">
-				<view class="notice-item-title">
-					<view class="left">
-						<view class="t-icon t-icon-tishi" ></view>系统通知
-					</view>
-					<text>12分钟前</text>
-				</view>
-				<view class="notice-item-content">您以成功绑定【青城山学校】【五年级8班】【张梅】学生。</view>
-				<image class="notice-item-poster" src="https://image.meiye.art/pic_ucQUd7WwkuW1vKvjbgUlv?imageMogr2/thumbnail/450x/interlace/1" mode="widthFix"></image>
-			</view>
-			<view class="notice-item">
+
+			<view class="notice-item" v-for="(item,index) in myData.msgList" :key="index">
 				<view class="notice-item-title">
 					<view class="left">
-						<view class="t-icon t-icon-bianji" ></view>任务通知
+						<view :class="item.icon"></view>{{item.title}}
 					</view>
-					<text>12分钟前</text>
+					<text>{{item.msgTime}}</text>
 				</view>
-				<view class="notice-item-content">您的孩子【张梅】班主任李老师给您发布一个新的问卷活动【周末孩子表现问卷调查】，快去填写吧 ></view>
-				<image class="notice-item-poster" src="https://image.meiye.art/pic_1628927180566LfOmH3IV5i24Mmc65BGE0?imageMogr2/thumbnail/450x/interlace/1" mode="widthFix"></image>
+				<view class="notice-item-content">{{item.content}}</view>
+				<image class="notice-item-poster"
+					:src="item.image"
+					mode="widthFix"></image>
 			</view>
+
 		</view>
+		
 	</view>
 </template>
 
@@ -49,7 +34,9 @@
 			...mapState('m_parent', ['myData'])
 		},
 		data() {
-			return {};
+			return {
+				
+			};
 		},
 		methods: {
 			...mapMutations('m_parent', ['updateMyMsg']),
@@ -67,60 +54,62 @@
 	.u-alert-item {
 		margin: 20rpx;
 	}
-	
-	.notice-container{
-		.notice-title{
+
+	.notice-container {
+		.notice-title {
 			font-size: 48rpx;
 			padding-left: 40rpx;
 		}
-		
-		.notice-wrap{
+
+		.notice-wrap {
 			padding: 40rpx;
-			
-			.notice-item{
+
+			.notice-item {
 				// width: 100%;
 				// height: 400rpx;
 				border-radius: $card-border-radius;
 				margin-bottom: 40rpx;
 				background-color: #fff;
 				padding: 30rpx;
-				&-title{
+
+				&-title {
 					font-size: 32rpx;
 					display: flex;
 					align-items: center;
 					justify-content: space-between;
-					.t-icon{
+
+					.t-icon {
 						display: inline-block;
 						margin-right: 10rpx;
 						width: 40rpx;
 						height: 40rpx;
 					}
-					
-					.left{
+
+					.left {
 						display: flex;
 						align-items: center;
 						justify-content: space-between;
 					}
-					
-					text{
+
+					text {
 						font-size: 24rpx;
 						color: #848587;
 					}
 				}
-				
-				&-content{
+
+				&-content {
 					font-size: 24rpx;
 					margin: 16rpx 0;
 					color: #6c6c6c;
-					display: -webkit-box!important;
+					display: -webkit-box !important;
 					overflow: hidden;
 					text-overflow: ellipsis;
 					word-break: break-all;
 					-webkit-line-clamp: 2;
-					-webkit-box-orient: vertical!important;
+					-webkit-box-orient: vertical !important;
 				}
-				
-				&-poster{
+
+				&-poster {
 					width: 100%;
 					border-radius: 10rpx;
 				}

subpkg/common/infopage.scss

@@ -12,7 +12,7 @@
 				width: 140rpx;
 				height: 140rpx;
 				border-radius: 100%;
-				border: 6rpx solid #FFFFFF;
+				border: 6rpx solid #FFF;
 				box-shadow: 0 10rpx 20rpx rgba(0, 0, 0, 0.2);
 			}
 
@@ -29,7 +29,7 @@
 				}
 
 				.detail {
-					color: $color-subtitle;
+					color: #FFF;
 					font-size: 40rpx;
 					font-weight: bold;
 				}
@@ -38,8 +38,8 @@
 		//背景大卡片
 		.card-box {
 			position: relative;
-			background-color: #FFFFFF;
-			box-shadow: 0 6rpx 10rpx rgba(0, 0, 0, 0.2);
+			background-color: #FFF;
+			box-shadow: 0 6rpx 10rpx rgba(0, 0, 0, 0.1);
 			top: 80rpx;
 			left: 50rpx;
 			border-radius: 50rpx;
@@ -57,7 +57,7 @@
 			display: flex;
 			flex-direction: column;
 			margin: 20rpx;
-			background-color: #FFFFFF;
+			background-color: #FFF;
 			border-radius: $card-border-radius;
 			width: 280rpx;
 			height: 280rpx;
@@ -77,7 +77,7 @@
 			.item-number {
 				font-size: 60rpx;
 				margin: 20rpx 0 10rpx 30rpx;
-				color: #FFFFFF;
+				color: #FFF;
 				font-weight: bold;
 			}
 		}

utils/TimeUtils.js

@@ -0,0 +1,11 @@
+//处理更新时间
+function getTimeStamp(){
+	let date = new Date(),
+		hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
+		minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
+	this.timeStamp = (hour + ':' + minute).toString();
+}
+
+export default{
+	getTimeStamp,
+}