优化跳转

components/area-chart/area-chart.vue

@@ -1,4 +1,4 @@
-<template>
+<template>
 	<view class="chart-container">
 		<view class="chart-name">
 			<text class="chart-name-text">单科成绩走向图</text>
@@ -12,20 +12,19 @@
 		<view class="charts-box">
 			<qiun-data-charts type="area" :chartData="chartData" :loadingType="4" background="none" />
 		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: "area-chart",
-		data() {
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
 			return {
 				
 				show: false,
 				subject:[
 					['语文','数学','英语','体育','思品','科学']
 				],
-				
+				
 				chartData: {
 					categories: [
 						"测验1",
@@ -70,7 +69,9 @@
 						}
 					],
 				},
-			};
+				
+				
+			};
 		},
 		methods:{
 			confirm(e){
@@ -78,12 +79,11 @@
 				uni.$showMsg('切换完成')
 				this.show = false
 			}
-		}
-		
-	}
-</script>
-
-<style lang="scss">
+		}
+	}
+</script>
+
+<style lang="scss">
 .chart-container {
 		margin: 20px 10px;
 		padding: 5px 5px 5px 2px;
@@ -112,6 +112,7 @@
 				width: 50px;
 				font-size: 13px;
 				margin:-4px 30px 0 0;
+				z-index: 999;
 			}
 		}
 
@@ -120,5 +121,5 @@
 			width: 100%;
 			height: 190px;
 		}
-	}
+	}
 </style>

gradepkg/column-chart/column-chart.vue

@@ -0,0 +1,87 @@
+<template>
+	<view class="chart-container">
+		<view class="chart-name">
+			<text class="chart-name-text">近期成绩对比</text>
+		</view>
+		<view class="charts-box">
+			<qiun-data-charts type="column" :chartData="chartData" :loadingType="4" background="none" />
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				chartData: {
+					categories: [
+						"数学",
+						"语文",
+						"英语",
+						"体育",
+						"科学",
+						"思品"
+					],
+					series: [{
+							"name": "最近成绩",
+							"data": [
+								91,
+								92,
+								94,
+								88,
+								82,
+								89
+							]
+						},
+						{
+							"name": "上次成绩",
+							"data": [
+								88,
+								84,
+								97,
+								92,
+								89,
+								81
+							]
+						}
+					],
+				},
+				
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+.chart-container {
+		margin: 20px 10px;
+		padding: 5px 5px 5px 2px;
+		border-radius: 15px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		background-color: #FFFFFF;
+		box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+	
+		.chart-name {
+			width: 100%;
+			text-align: left;
+			margin-left: 30px;
+			margin-top: 8px;
+			font-weight: bold;
+			color: #3B4144;
+	
+			.chart-name-text {
+				font-size: 13px;
+			}
+		}
+	
+		/* 请根据需求修改图表容器尺寸，如果父容器没有高度图表则会显示异常 */
+		.charts-box {
+			width: 100%;
+			height: 190px;
+		}
+	}
+</style>

gradepkg/line-chart/line-chart.vue

@@ -0,0 +1,93 @@
+<template>
+	<view class="chart-container">
+		<view class="chart-name">
+			<text class="chart-name-text">总成绩对比</text>
+		</view>
+		<view class="charts-box">
+			<qiun-data-charts type="line" :chartData="chartData" :loadingType="4"/>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				chartData: {
+					categories: [
+						"测验1",
+						"测验2",
+						"测验3",
+						"测验4",
+						"测验5",
+					],
+					series: [{
+							"name": "孩子总分",
+							"data": [
+								400,
+								390,
+								380,
+								399,
+								366,
+							]
+						},
+						{
+							"name": "班级平均分",
+							"data": [
+								360,
+								377,
+								355,
+								322,
+								338,
+							]
+						},
+						{
+							"name": "年级平均分",
+							"data": [
+								333,
+								346,
+								364,
+								347,
+								355,
+							]
+						}
+					],
+				},
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+	.chart-container {
+		margin: 20px 10px;
+		padding: 4px 4px 4px 2px;
+		border-radius: 15px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		background-color: #FFFFFF;
+		box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+	
+		.chart-name {
+			width: 100%;
+			text-align: left;
+			margin-left: 30px;
+			margin-top: 8px;
+			font-weight: bold;
+			color: #3B4144;
+	
+			.chart-name-text {
+				font-size: 13px;
+			}
+		}
+	
+		/* 请根据需求修改图表容器尺寸，如果父容器没有高度图表则会显示异常 */
+		.charts-box {
+			width: 100%;
+			height: 190px;
+		}
+	}
+
+</style>

information/parent.js

@@ -30,12 +30,6 @@ export default {
 				classid: '0301',
 				className: '三年级一班',
 				tmdid: 'tmdid01'
-			}, {
-				avatar: '/static/boy.png',
-				name: '张五',
-				classid: '0304',
-				className: '三年级四班',
-				tmdid: 'tmdid02'
 			}, {
 				avatar: '/static/girl.png',
 				name: '张梅',

pages.json

@@ -1,34 +1,43 @@
 {
 	"pages": [{
-		"path": "pages/home/home",
-		"style": {
-			// "navigationBarTitleText": "",
-			"enablePullDownRefresh": false,
-			"navigationStyle": "custom"
-		}
+			"path": "pages/init/init",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
 
-	}, {
-		"path": "pages/grade/grade",
-		"style": {
-			"enablePullDownRefresh": false,
-			"navigationStyle": "custom"
-		}
+		},
+		{
+			"path": "pages/home/home",
+			"style": {
+				// "navigationBarTitleText": "",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
 
-	}, {
-		"path": "pages/approval/approval",
-		"style": {
-			"enablePullDownRefresh": false,
-			"navigationStyle": "custom"
-		}
+		}, {
+			"path": "pages/grade/grade",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
 
-	}, {
-		"path": "pages/my/my",
-		"style": {
-			"enablePullDownRefresh": false,
-			"navigationStyle": "custom",
-			"disableScroll": true
+		}, {
+			"path": "pages/approval/approval",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
+
+		}, {
+			"path": "pages/my/my",
+			"style": {
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom",
+				"disableScroll": true
+			}
 		}
-	}],
+	],
 	//分包配置
 	"subPackages": [{
 		"root": "subpkg",
@@ -61,6 +70,27 @@
 				"enablePullDownRefresh": false
 			}
 
+		}, {
+			"path": "line-chart/line-chart",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+
+		}, {
+			"path": "area-chart/area-chart",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+
+		}, {
+			"path": "column-chart/column-chart",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+
 		}]
 	}],
 	"preloadRule": {

pages/grade/grade.vue

@@ -2,17 +2,18 @@
 	<view class="chart-list-container">
 		<!-- 头部区域 -->
 		<top-box></top-box>
+		
 		<!-- 缩略图区域 -->
 		<view class="mini-chart-list">
-			<view class="mini-chart-item" >
+			<view class="mini-chart-item" @click="navLineChart">
 				<line-mini-chart></line-mini-chart>
 			</view>
 			
-			<view class="mini-chart-item">
+			<view class="mini-chart-item" @click="navAreaChart">
 				<area-mini-chart></area-mini-chart>
 			</view>
 			
-			<view class="mini-chart-item">
+			<view class="mini-chart-item" @click="navColumnChart">
 				<column-mini-chart></column-mini-chart>
 			</view>
 			<!-- 按钮区域 -->
@@ -29,20 +30,12 @@
 					<rose-mini-chart></rose-mini-chart>
 				</view>
 			</view>
-			<!-- 缩略图区域 -->
-			<view class="mini-chart-item">
-				<area-mini-chart></area-mini-chart>
-			</view>
 			
-			<view class="mini-chart-item">
-				<area-mini-chart></area-mini-chart>
-			</view>
 			
 		</view>
 		
 		<view class="chart-card">
 			<line-chart></line-chart>
-			<area-chart></area-chart>
 			<column-chart></column-chart>
 			<bar-chart></bar-chart>
 		</view>
@@ -64,6 +57,27 @@
 			open(e){
 				console.log(e);
 			},
+			//导航柱状图页面
+			navColumnChart(e){
+				console.log(e);
+				uni.navigateTo({
+					url:"../../gradepkg/column-chart/column-chart"
+				})
+			},
+			//导航面积折线图页面
+			navAreaChart(e){
+				console.log(e);
+				uni.navigateTo({
+					url:"../../gradepkg/area-chart/area-chart"
+				})
+			},
+			//导航折线图页面
+			navLineChart(e){
+				console.log(e);
+				uni.navigateTo({
+					url:"../../gradepkg/line-chart/line-chart"
+				})
+			},
 			//导航玫瑰图页面
 			navRoseChart(e){
 				console.log(e);
@@ -89,6 +103,7 @@
 <style lang="scss">
 	.chart-list-container{
 		height: 100%;
+		overflow-x: hidden;
 		.home-topinfo{
 			background: linear-gradient(#FFC600, #f1f3f5);
 		}

pages/home/home.vue

@@ -117,17 +117,12 @@
 		},
 		
 		computed:{
-			...mapState('m_parent', ['token']),
 			...mapState('m_children',['childreninfo'])
 		},
 
 	
-		onLoad() {
-			if(!this.token){
-				uni.reLaunch({
-					url:'/subpkg/login/login'
-				})
-			}
+		onShow() {
+			
 		},
 		
 		methods: {

pages/init/init.vue

@@ -0,0 +1,32 @@
+<template>
+	<view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			};
+		},
+		onLoad() {
+			//缓存中同步token
+			const value = uni.getStorageSync('token')
+			if(!value){
+				uni.redirectTo({
+					url:'/subpkg/login/login'
+				})
+			} else{
+				uni.switchTab({
+					url:'/pages/home/home'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>