页面与组件代码简化,孩子信息头部学期切换,学期信息全局存储等

App.vue

@@ -1,14 +1,14 @@
 <script>
 	export default {
 		onLaunch: function() {
-			console.warn('当前组件仅支持 uni_modules 目录结构 ，请升级 HBuilderX 到 3.1.0 版本以上！')
-			console.log('App Launch')
+			// console.warn('当前组件仅支持 uni_modules 目录结构 ，请升级 HBuilderX 到 3.1.0 版本以上！')
+			// console.log('App Launch')
 		},
 		onShow: function() {
-			console.log('App Show')
+			// console.log('App Show')
 		},
 		onHide: function() {
-			console.log('App Hide')
+			// console.log('App Hide')
 		}
 	}
 </script>

components/arcbar-mini-chart/arcbar-mini-chart.vue

@@ -1,72 +0,0 @@
-<template>
-	<view class="chart-container">
-		<view class="chart-name">
-			<view class="t-icon t-icon-xtubiao-4"></view>
-			<text class="chart-name-text">排名占比</text>
-		</view>
-		
-		<view class="charts-box">
-		  <qiun-data-charts
-		    type="arcbar"
-		    :chartData="chartData"
-		    :loadingType="4"
-				:title.name="series.name"
-		    background="none"
-		  />
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name:"arcbar-mini-chart",
-		data() {
-			return {
-				chartData:{
-				  series:[ {
-				    "data": 0.88,
-				    "color": "#0052d4"
-				}],
-				},
-				
-				
-			};
-		}
-	}
-</script>
-
-<style lang="scss">
-.chart-container {
-		border-radius: 20rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-		background-color: #FFFFFF;
-		box-shadow: 0 4rpx 8rpx rgba(0,0,0,0.05);
-		width: 340rpx;
-	
-		.chart-name {
-			display: flex;
-			align-items: center;
-			justify-content: flex-start;
-			width: 100%;
-			margin: 20rpx 0 20rpx 40rpx;
-			
-			.chart-name-text {
-				margin-left: 20rpx;
-				font-size: 30rpx;
-				font-weight: bold;
-				color: #3B4144;
-			}
-		}
-	.charts-box{
-		width: 100%;
-		height: 240rpx;
-	}
-}
-.t-icon{
-		width: 40rpx;
-		height: 40rpx;
-	}
-</style>

components/top-box/top-box.vue

@@ -6,11 +6,11 @@
 			<view class="children-name">
 				<text class="name">{{childreninfo.name}}</text>
 				<view class="detail-box">
-					<text class="detail">{{childreninfo.className}}</text>
+					<text class="detail" @click="select = true">{{semester}}</text>
 					<!-- 选择学期 -->
 					<view class="select-box">
-						<u-picker :show="select" :columns="semester" ref="uPicker" @confirm="selectemester" @change="changeHandler"></u-picker>
-						<!-- <u-button class="select-btn" @click="select = true" size="small" shape="circle">学期</u-button> -->
+						<u-picker :show="select" :columns="semesterList" ref="uPicker" @confirm="selectSemester" @cancel="selectCancel"></u-picker>
+						<view class="t-icon t-icon-youjiantou" @click="select = true"></view>
 					</view>
 				</view>
 			</view>
@@ -42,24 +42,30 @@
 				show: false,
 				
 				select: false,
-				semester:[
-					['19学年','20学年','21学年','22学年']
+				semesterList:[
+					['19学年上学期','19学年下学期','20学年上学期','20学年下学期']
 				],
 				
-				
 			};
 		},
 		computed: {
-			...mapState('m_children', ['childreninfo']),
+			...mapState('m_children', ['childreninfo','semester']),
 			...mapState('m_parent',['parentdetail'])
 		},
 		methods: {
-			...mapMutations('m_children',['updateChildrenInfo']),
+			...mapMutations('m_children',['updateChildrenInfo','updateChildrenSemester']),
 			
 			//学期选择
-			selectemester(e){
-				console.log('selectemester',e)
+			selectSemester(e){
+				console.log('selectSemester',e)
 				uni.$showMsg('切换完成')
+				this.updateChildrenSemester(e.value[0])
+				this.select = false
+			},
+			//取消选择
+			selectCancel(e){
+				console.log('selectCancel',e)
+				uni.$showMsg('取消选择')
 				this.select = false
 			},
 			
@@ -97,7 +103,7 @@
 		}
 
 		.children-name {
-			margin-top: 24rpx;
+			margin-top: 44rpx;
 			margin-left: 20rpx;
 			display: flex;
 			flex-direction: column;
@@ -108,11 +114,18 @@
 				margin: 4rpx 0 0 10rpx;
 				font-weight: bold;
 			}
-			.detail {
-				color: #6b778d;
-				font-weight: bold;
-				font-size: 28rpx;
-				margin: 10rpx 0rpx 0 10rpx;
+			.detail-box{
+				display: flex;
+
+				.detail {
+					color: #2197ef;
+					font-weight: bold;
+					font-size: 28rpx;
+					margin: 10rpx 0rpx 0 10rpx;
+				}
+				.select-box{
+					margin: 10rpx;
+				}
 			}
 		}
 	}
@@ -141,4 +154,8 @@
 			}
 		}
 	}
+	.t-icon{
+			width: 40rpx;
+			height: 40rpx;
+		}
 </style>

gradepkg/arcbar-chart/arcbar-chart.vue

@@ -1,63 +0,0 @@
-<template>
-	<view class="chart-container">
-		<view class="chart-name">
-			<text class="chart-name-text">排名占比</text>
-		</view>
-		<view class="charts-box">
-		  <qiun-data-charts
-		    type="arcbar"
-		    :chartData="chartData"
-		    :loadingType="4"
-		  />
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				chartData:{
-				  series:[ {
-            "name": "排名",
-            "data": 0.88,
-            "color": "#0052d4"
-        }],
-				},
-			};
-		}
-	}
-</script>
-
-<style lang="scss">
-.chart-container {
-		margin: 40rpx 20rpx;
-		padding: 10rpx 10rpx 10rpx 4rpx;
-		border-radius: 30rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-		background-color: #FFFFFF;
-		box-shadow: 0 4rpx 8rpx rgba(0,0,0,0.1);
-	
-		.chart-name {
-			width: 100%;
-			text-align: left;
-			margin-left: 60rpx;
-			margin-top: 16rpx;
-			font-weight: bold;
-			color: #3B4144;
-	
-			.chart-name-text {
-				font-size: 26rpx;
-			}
-		}
-	
-		/* 请根据需求修改图表容器尺寸，如果父容器没有高度图表则会显示异常 */
-		.charts-box {
-			width: 100%;
-			height: 600rpx;
-		}
-	}
-</style>

information/children.js

@@ -10,15 +10,23 @@ export default{
 		
 		childreninfo: JSON.parse(uni.getStorageSync('childreninfo') || '{}'),
 		
+		semester: uni.getStorageSync('semester') || '请选择学期'
+		
 	}),
 	//模块方法(修改数据)
 	mutations: {
+		//更新学期信息
+		updateChildrenSemester(state,semester){
+			state.semester = semester
+			this.commit('m_children/saveChildrenSemesterToStorage')
+		},
+		
 		//更新学生信息
 		updateChildrenInfo(state,childreninfo){
 			state.childreninfo = childreninfo
 			this.commit('m_children/saveChildrenInfoToStorage')
 		},
-		//学生成绩信息
+		//更新成绩信息
 		updateChildrenGrade(state,grade){
 			state.grade = grade
 			this.commit('m_children/saveChildrenGradeToStorage')
@@ -32,6 +40,10 @@ export default{
 		//学生成绩
 		saveChildrenGradeToStorage(state){
 			uni.setStorageSync('grade',JSON.stringify(state.grade))
+		},
+		//学期信息
+		saveChildrenSemesterToStorage(state){
+			uni.setStorageSync('semester',state.semester)
 		}
 		
 	},

pages.json

@@ -91,16 +91,7 @@
 				"enablePullDownRefresh": false
 			}
 
-		}    ,{
-                    "path" : "arcbar-chart/arcbar-chart",
-                    "style" :                                                                                    
-                {
-                    "navigationBarTitleText": "",
-                    "enablePullDownRefresh": false
-                }
-                
-                }
-            ]
+		}]
 	}],
 	"preloadRule": {
 		"subpkg/login/login": {

pages/grade/grade.vue

@@ -31,10 +31,6 @@
 				</view>
 			</view>
 			
-			<view class="mini-chart-item">
-				<arcbar-mini-chart></arcbar-mini-chart>
-			</view>
-			
 			
 		</view>