3.30-2

components/todayclass-box/todayclass-box.vue

@@ -2,16 +2,15 @@
 	<!-- 今日课程 -->
 	<!-- 内容 -->
 	<view>
-		<view class="home-title-text" style="margin: 0 0 30rpx 0;">
-			<view class="msg">最近课程</view>
+		<view class="home-title-text" style="margin: 0 0 20rpx 0;">
 			<view style="display: flex; align-items: center;margin: 0 30rpx 0 auto;">
-				<view class="t-icon t-icon-chakan" @click="navClass"></view>
-				<view class="msg" style="margin-left: 10rpx;" @click="navClass">查看课程列表</view>
+				<u-icon name="list-dot" @click="navClass"></u-icon>
+				<view class="msg" style="margin-left: 10rpx;" @click="navClass">查看更多</view>
 			</view>
 		</view>
 
 		<!-- 课程列表 -->
-		<view>
+		<view style="margin-bottom: 20rpx;">
 			<view class="class-block" v-if="classCurrent > 1">
 				<view class="block-title">{{classList[classCurrent-2].name}}</view>
 				<u-tag :text="classList[classCurrent-2].teacher" size="mini" plain shape="circle"></u-tag>
@@ -33,7 +32,7 @@
 				<u-tag :text="classList[classCurrent].teacher" size="mini" plain shape="circle"></u-tag>
 				<view class="block-subtitle">下节</view>
 				<view class="block-subtitle">{{classList[classCurrent].time}}</view>
-				<u-tag text="暂未开始" plain icon="pushpin"></u-tag>
+				<u-tag text="暂未开始" plain icon="pushpin" type="warning"></u-tag>
 			</view>
 			
 			

information/chart.js

@@ -520,7 +520,7 @@ export default {
 			evaluationArcbar: {
 				"series": [{
 					"name": "评测完成",
-					"data": 0.84,
+					"data": 0.60,
 					"color": "#0080ff"
 				}]
 			},
@@ -528,7 +528,7 @@ export default {
 			homeworkArcbar: {
 				"series": [{
 					"name": "作业完成",
-					"data": 0.7,
+					"data": 1,
 					"color": "#ff8caf"
 				}]
 			},
@@ -536,7 +536,7 @@ export default {
 			activityArcbar: {
 				"series": [{
 					"name": "活动完成",
-					"data": 0.95,
+					"data": 0.83,
 					"color": "#f9c752"
 				}]
 			},

pages/common/blockmsg.scss

@@ -3,14 +3,14 @@
 		align-items: center;
 		justify-content: space-around;
 		background-color: #f6f6f6;
-		margin: 10rpx auto 20rpx auto;
+		margin: 10rpx auto 10rpx auto;
 		padding: 5rpx;
 		width: 94%;
 		height: 120rpx;
 		border-radius: $card-border-radius;
 	
 		.block-title {
-			font-size: 30rpx;
+			font-size: 32rpx;
 			font-weight: bold;
 			color: $color-title;
 		}

pages/common/mainpage.scss

@@ -18,8 +18,7 @@
 				width: 48%;
 				height: auto;
 				display: flex;
-				flex-direction: column;
-				justify-content: space-around;
+				flex-direction: column;
 				background-color: #FFF;
 				// box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.05);
 				border-radius: $card-border-radius;
@@ -41,7 +40,7 @@
 		}
 	}
 	.card-content {
-		font-size: 35rpx;
+		font-size: 38rpx;
 		margin: 10rpx 0 10rpx 25rpx;
 		color: $u-primary;
 		font-weight: bold;
@@ -51,17 +50,12 @@
 		display: flex;
 		align-items: center;
 		flex-wrap: wrap;
-		margin: -10rpx 0 10rpx 0;
-		.t-icon {
-			width: 30rpx;
-			height: 30rpx;
-		}
+		margin: -10rpx 0 10rpx 0;
 	}
 	.msg {
 		color: $color-title;
 		margin-left: 30rpx;
-		font-size: 30rpx;
-		font-weight: bold;
+		font-size: 26rpx;
 	}
 	.charts-box {
 		width: 100%;

pages/home/home.vue

@@ -12,7 +12,7 @@
 
 			<!-- 今日课程 -->
 			<view class="card-item" style="width: 100%;">
-				<view class="card-info">
+				<view class="card-info" style="padding-bottom: 5rpx;">
 					<view :class="icon.class"></view>
 					<text class="info-text">今日课程</text>
 				</view>
@@ -20,35 +20,33 @@
 			</view>
 
 			<!-- 今日打卡 -->
-			<view class="card-item">
+			<view class="card-item" @click="navCalendar">
 				<view class="card-info">
 					<view :class="icon.record"></view>
 					<text class="info-text">今日打卡</text>
 				</view>
-				<view style="display: flex; align-items: center; margin:0 0 20rpx 30rpx;">
-					<view class="t-icon t-icon-chakan" style="width: 30rpx; height: 30rpx;" @click="navCalendar"></view>
-					<view class="msg" style="margin-left: 10rpx;" @click="navCalendar">查看详细记录</view>
-				</view>
-				<view class="home-title-text">
-					<view class="msg">今日出勤:</view>
-					<view class="card-content">{{homeData.attendance}}</view>
-				</view>
-				<view class="home-title-text">
-					<view class="msg">打卡时间:</view>
-					<view style="margin-left: 10rpx;">
-						<!-- <u-tag text="8点15分" plain shape="circle"></u-tag> -->
-						<view style="display: flex; align-items: center; margin-left: 10rpx;">
-							<view class="number-box">08</view>
-							<view style="color: #3C9CFF;">:</view>
-							<view class="number-box">15</view>
+
+				<view class="space">
+					<view class="home-title-text">
+						<view class="msg">今日出勤:</view>
+						<view class="card-content">{{homeData.attendance}}</view>
+					</view>
+					<view class="home-title-text">
+						<view class="msg">打卡时间:</view>
+						<view style="margin-left: 10rpx;">
+							<!-- <u-tag text="8点15分" plain shape="circle"></u-tag> -->
+							<view style="display: flex; align-items: center; margin-left: 10rpx;">
+								<view class="number-box">{{homeData.attendanceTimeAfter[0]}}</view>
+								<view style="color: #3C9CFF;">:</view>
+								<view class="number-box">{{homeData.attendanceTimeAfter[1]}}</view>
+							</view>
 						</view>
 					</view>
+					<view class="home-title-text">
+						<view class="msg">本周出勤质量:</view>
+						<view class="card-content">{{homeData.attendanceQuality}}</view>
+					</view>
 				</view>
-				<view class="home-title-text">
-					<view class="msg">本周出勤质量:</view>
-					<view class="card-content">优秀</view>
-				</view>
-
 			</view>
 
 
@@ -106,14 +104,17 @@
 				noticeMsg: '',
 				//当前课程索引
 				classIndex: '',
-				//作业页面展示索引
-				homeworkPageIndex: [0,1,2],
 				//首页数据
 				homeData: {
 					//出勤状况
 					attendance: '已打卡',
+					//打卡时间
+					attendanceTime: '08:15',
+					//处理后时间
+					attendanceTimeAfter: [],
+					//出勤质量
+					attendanceQuality: '优秀'
 				},
-
 				//属性(不修改)
 				//图标
 				icon: {
@@ -139,6 +140,7 @@
 			this.$getTimeStamp()
 			this.getNoticeMsg()
 			this.getClassCurrent()
+			this.getAttendanceTimeAfter()
 		},
 		onPullDownRefresh() {
 			this.$getTimeStamp()
@@ -186,6 +188,10 @@
 				this.classIndex = i
 				i = 0
 			},
+			//处理打卡时间
+			getAttendanceTimeAfter(){
+				this.homeData.attendanceTimeAfter = this.homeData.attendanceTime.split(':')
+			},
 			navHomework(index) {
 				uni.reLaunch({
 					url: `/pages/homework/homework?index=${index}`
@@ -265,4 +271,12 @@
 		justify-content: center;
 		align-items: center;
 	}
+
+	.space {
+		height: 100%;
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-around;
+	}
 </style>

pages/homework/homework.vue

@@ -293,9 +293,9 @@
 				}],
 				//历史数据
 				historyData: {
-					test: [90, 89, 98, 100, 50, 55, 77],
+					test: [90, 89, 98, 100, 50, 55, 60],
 					homework: [10, 29, 38, 60, 50, 88, 100],
-					activity: [70, 19, 28, 40, 60, 100, 100]
+					activity: [70, 19, 28, 40, 60, 100, 83]
 				},
 
 

subpkg/calendarmsg/calendarmsg.vue

@@ -1,40 +1,76 @@
-<template>
-	<view>
+<template>
+	<view class="card">
 		<view class="calendar_container">
 			<zsyCalendar :sundayIndex="6" @change="dateHandler" />
-		</view>
-	</view>
-</template>
-
+		</view>
+		<view class="state-box">
+			<view class="state">
+				<view class="state-text">已打卡</view>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
 <script>
-	import zsyCalendar from '@/subpkg/zsy-calendar/zsy-calendar.vue'
+	import zsyCalendar from '@/subpkg/zsy-calendar/zsy-calendar.vue'
 	export default {
 		name: 'Calendar',
 		components: {
 			zsyCalendar
-		},
-		data() {
-			return {
-				
-			};
 		},
-		methods:{
+		data() {
+			return {
+
+			};
+		},
+		methods: {
 			//日历事件
 			dateHandler(e) {
 				console.log(e)
 			},
-		}
-	}
-</script>
-
-<style lang="scss">
-//日历组件
-	.calendar_container {
-		height: 100%;
-		width: auto;
-		background-color: #FFF;
-		margin: 20rpx;
-		box-sizing: border-box;
-		border-radius: $card-border-radius;
-	}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.card {
+		margin: 0 20rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		background-color: #FFF;
+		border-radius: $card-border-radius;
+		//日历组件
+		.calendar_container {
+			height: 100%;
+			width: 100%;
+			background-color: #FFF;
+			margin: 0 20rpx;
+			box-sizing: border-box;
+			border-radius: $card-border-radius;
+		}
+		.state-box{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			height: 300rpx;
+			width: 100%;
+			.state{
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin: 20rpx;
+				border-radius: 100%;
+				height: 150rpx;
+				width: 150rpx;
+				background-color: #3C9CFF;
+				.state-text{
+					font-size: 34rpx;
+					font-weight: bold;
+					color: #FFF;
+				}
+			}
+		}
+	}
 </style>

subpkg/classmsg/classmsg.vue

@@ -9,26 +9,32 @@
 					<text class="info-text">今日课程列表</text>
 				</view>
 
-				<view class="home-title-text" style="margin: 0 0 30rpx 0;">
+				<view class="home-title-text">
 					<view class="msg">今日课程数:</view>
 					<view class="card-content">{{classList.length}}</view>
 					<view style="display: flex; align-items: center; margin-left: auto; margin-right: 30rpx;">
 						<view class="t-icon t-icon-lishi"></view>
-						<view class="msg" style="margin-left: 10rpx;">3月29日</view>
-						<view class="msg" style="margin-left: 10rpx;">星期二</view>
+						<view class="msg" style="margin-left: 10rpx;">3月30日</view>
+						<view class="msg" style="margin-left: 10rpx;">星期三</view>
 					</view>
 				</view>
-
-
-				<view class="class-block" v-for="(item,index) in classList" :key="index">
-					<view class="block-title">{{item.name}}</view>
-					<view class="block-tag-box">
-						<view class="block-tag">{{item.teacher}}</view>
+				<!-- 课程列表 -->
+				<view style="margin-bottom: 20rpx;">
+					<view style="display: flex; align-items: center;" v-for="(item,index) in classList" :key="index">
+						<view class="index"></view>
+
+						<view class="class-block" style="width: 90%;">
+							<view class="block-title">{{item.name}}</view>
+							<view class="block-tag-box">
+								<view class="block-tag">{{item.teacher}}</view>
+							</view>
+							<view class="block-subtitle">{{item.timeFrame}}</view>
+							<view class="block-title">{{item.time}}</view>
+						</view>
 					</view>
-					<view class="block-subtitle">{{item.timeFrame}}</view>
-					<view class="block-subtitle">{{item.time}}</view>
 				</view>
 
+
 			</view>
 
 			<view class="card-item" style="width: 100%;">
@@ -61,6 +67,7 @@
 
 <style lang="scss">
 	@import '@/pages/common/blockmsg.scss';
+
 	.card-box {
 		display: flex;
 		flex-flow: column wrap;
@@ -90,6 +97,14 @@
 					margin-left: 10rpx;
 				}
 			}
+
+			.index {
+				width: 1%;
+				height: 120rpx;
+				background-color: #3C9CFF;
+				border-radius: 20rpx;
+				margin-left: 20rpx;
+			}
 		}
 	}
 
@@ -104,7 +119,7 @@
 		display: flex;
 		align-items: center;
 		flex-wrap: wrap;
-		margin: -10rpx 0 10rpx 0;
+		margin: 10rpx 0 10rpx 0;
 
 		.t-icon {
 			width: 30rpx;
@@ -116,7 +131,6 @@
 		color: $color-title;
 		margin-left: 30rpx;
 		font-size: 30rpx;
-		font-weight: bold;
 	}
 
 	.t-icon {

subpkg/zsy-calendar/dateBox.vue

@@ -1,100 +1,108 @@
-<template>
-	<!-- 日期显示 -->
-	<view class="date_box">
-		<view
-			v-for="(dateInfo, dateIndex) in dates"
-			:key="dateIndex"
-			class="calendar_date__box"
-		>
-			<view
-				class="calendar_date"
-				:class="{ isSelected: dateInfo.isSelected }"
-				:style="{
-					height: cellHeight + 'rpx',
-					width: cellHeight + 'rpx',
-					color: swiperMode === 'open' ? dateInfo.type === 'cur' ? '#2C2C2C' : '#959595' : '#2C2C2C',
-					backgroundColor: dateInfo.isSelected ? dateActiveColor : ''
-				}"
-				@tap="chooseDate(dateInfo, dateIndex)"
-			>
-				<view class="calendar_date__number">{{ dateInfo.date }}</view>
-				<view class="calendar_date__isToday" v-if="dateInfo.isToday" :style="{ backgroundColor: dateActiveColor }"></view>
-				<view class="calendar_date__cricle"></view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		props: {
-			dates: {
-				type: Array,
-				default: []
-			},
-			cellHeight: { // 一列的高度
-				type: Number,
-				default: 75
-			},
-			dateActiveColor: { // 日期选中颜色
-				type: String,
-				default: '#FE6601'
-			},
-			swiperMode: { // 日历显示模式
-				type: String,
-				default: 'open'
-			}
-		},
-		methods: {
-			chooseDate(dateInfo, dateIndex) {
-				this.$emit('chooseDate', dateInfo, dateIndex)
-			}
-		}
-	}
-</script>
-
-<style>
-	/* 日历轮播 */
-	.date_box {
-		display: flex;
-		flex-wrap: wrap;
-		justify-content: space-between;
-	}
-	.date_box .calendar_date__box {
-		width: calc(100% / 7);
-		margin-top: 20rpx;
-	}
-	.calendar_date__box .calendar_date {
-		text-align: center;
-		margin: 0 auto;
-		font-weight: bold;
-		font-size: 28rpx;
-		border-radius: 50%;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		position: relative;
-	}
-	.calendar_date__box .calendar_date.isSelected {
-		color: #FFFFFF !important;
-	}
-	.calendar_date .calendar_date__isToday {
-		width: 100%;
-		height: 100%;
-		position: absolute;
-		top: 0;
-		left: 0;
-		border-radius: 50%;
-		z-index: -1;
-		opacity: 0.4;
-	}
-	.calendar_date .calendar_date__cricle {
-		width: 9rpx;
-		height: 9rpx;
-		border-radius: 50%;
-		margin-top: 5rpx;
-		background-color: #FFFFFF;
-	}
-	/* 日历轮播 */
+<template>
+	<!-- 日期显示 -->
+	<view class="date_box">
+		<view v-for="(dateInfo, dateIndex) in dates" :key="dateIndex" class="calendar_date__box">
+			<!-- <view class="attendance_box" :style="{backgroundColor: dateAttendanceColor}"> -->
+				<view class="calendar_date" :class="{ isSelected: dateInfo.isSelected }" :style="{
+						height: cellHeight + 'rpx',
+						width: cellHeight + 'rpx',
+						color: swiperMode === 'open' ? dateInfo.type === 'cur' ? '#2C2C2C' : '#959595' : '#2C2C2C',
+						backgroundColor: dateInfo.isSelected ? dateActiveColor : ''
+					}" @tap="chooseDate(dateInfo, dateIndex)">
+					<view class="calendar_date__number">{{ dateInfo.date }}</view>
+					<view class="calendar_date__isToday" v-if="dateInfo.isToday"
+						:style="{ backgroundColor: dateActiveColor }"></view>
+					<view class="calendar_date__cricle"></view>
+				</view>
+			<!-- </view> -->
+			
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			dates: {
+				type: Array,
+				default: []
+			},
+			cellHeight: { // 一列的高度
+				type: Number,
+				default: 75
+			},
+			dateAttendanceColor: {
+				type: String,
+				default: '#89d0ff'
+			},
+			dateActiveColor: { // 日期选中颜色
+				type: String,
+				default: '#3C9CFF'
+			},
+			swiperMode: { // 日历显示模式
+				type: String,
+				default: 'open'
+			}
+		},
+		methods: {
+			chooseDate(dateInfo, dateIndex) {
+				this.$emit('chooseDate', dateInfo, dateIndex)
+			}
+		}
+	}
+</script>
+
+<style>
+	/* 日历轮播 */
+	.date_box {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+	}
+
+	.date_box .calendar_date__box {
+		width: calc(100% / 7);
+		margin-top: 20rpx;
+	}
+	.date_box .attendance_box{
+		border-radius: 50%;
+	}
+
+	.calendar_date__box .calendar_date {
+		text-align: center;
+		margin: 0 auto;
+		font-weight: bold;
+		font-size: 28rpx;
+		border-radius: 50%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		position: relative;
+	}
+
+	.calendar_date__box .calendar_date.isSelected {
+		color: #FFFFFF !important;
+	}
+
+	.calendar_date .calendar_date__isToday {
+		width: 100%;
+		height: 100%;
+		position: absolute;
+		top: 0;
+		left: 0;
+		border-radius: 50%;
+		z-index: -1;
+		opacity: 0.4;
+	}
+
+	.calendar_date .calendar_date__cricle {
+		width: 9rpx;
+		height: 9rpx;
+		border-radius: 50%;
+		margin-top: 5rpx;
+		background-color: #FFFFFF;
+	}
+
+	/* 日历轮播 */
 </style>

subpkg/zsy-calendar/zsy-calendar.vue

@@ -5,7 +5,7 @@
 		<view class="calendar_info">
 			<text class="title">打卡记录</text>
 			<text class="desc">
-				({{ getAssignDateInfo(false, 0) === getAssignDateInfo(true, 0) ? '' : getAssignDateInfo(false, 0) + '年' }}{{ getAssignDateInfo(false, 1) }}月)
+				[{{ getAssignDateInfo(false, 0) === getAssignDateInfo(true, 0) ? '' : getAssignDateInfo(false, 0) + '年' }}{{ getAssignDateInfo(false, 1) }}月]
 			</text>
 			<text v-show="showBackToTodayBtn" class="backToToday" :style="{color: dateActiveColor}" @tap="goToDate()">回到今天</text>
 		</view>
@@ -88,7 +88,7 @@
 			},
 			dateActiveColor: { // 日期选中颜色
 				type: String,
-				default: '#FE6601'
+				default: '#3C9CFF'
 			},
 			sundayIndex: { // 星期天所在索引，0表示第一个、6表示最后一个
 				type: Number,
@@ -543,7 +543,7 @@
 <style>
 	.zsy_calendar {
 		width: 100%;
-		padding: 20rpx 0;
+		padding: 30rpx 10rpx 0rpx 10rpx;
 		box-sizing: border-box;
 		background-color: #fff;
 		border-radius: 20rpx;
@@ -556,7 +556,7 @@
 		padding: 0 20rpx;
 	}
 	.calendar_info .title {
-		font-size: 30rpx;
+		font-size: 32rpx;
 		font-weight: bold;
 		color: #2C2C2C;
 	}
@@ -567,7 +567,7 @@
 	}
 	.calendar_info .backToToday {
 		margin-left: auto;
-		font-size: 24rpx;
+		font-size: 26rpx;
 	}
 	/* 日历顶部信息 */
 	
@@ -597,7 +597,7 @@
 	.calendar_toggle .icon {
 		width: 30rpx;
 		height: 30rpx;
-		background-image: url('../../static/zsy-calendar/arrow.png');
+		background-image: url('../../subpkg/zsy-calendar/icon/arrow.png');
 		background-size: contain;
 		background-repeat: no-repeat;
 		margin: 0 auto;