|
@@ -1,846 +0,0 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <view v-if="!isHomeLoad">
|
|
|
- <loading></loading>
|
|
|
- </view>
|
|
|
- <view class="page-view" v-if="isHomeLoad">
|
|
|
- <!-- 成绩统计 -->
|
|
|
- <view class="bg1">
|
|
|
- <view class="circle-line1"></view>
|
|
|
- <view class="circle-line2"></view>
|
|
|
- <view class="circle-line3"></view>
|
|
|
- <top-info :timeStamp="timeStamp"></top-info>
|
|
|
- <scroll-view class="scroll-view" scroll-x="true" :scroll-with-animation="true" scroll-left="0">
|
|
|
- <view class="view-box">
|
|
|
- <view class="scroll-view-item" v-for="(item,index) in cardList" :key="index"
|
|
|
- @click="navTab(index)">
|
|
|
- <view class="card-info">
|
|
|
- <view :class="item.icon"></view>
|
|
|
- <view class="title">{{item.title}}</view>
|
|
|
- </view>
|
|
|
- <view class="chart-box">
|
|
|
- <qiun-data-charts type="arcbar" :chartData="item.data" :canvas2d='true'
|
|
|
- :canvasId='item.canvasId' :opts="item.chartOpts" />
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- <!-- 通知 -->
|
|
|
- <view class="bg2">
|
|
|
- <view class="notice">
|
|
|
- <u-notice-bar :text="noticeData" bgColor="rgba(65,105,225,0.4)" color="#FFF"
|
|
|
- url="/subpkg/mine/msgList"></u-notice-bar>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 课程 -->
|
|
|
- <view class="card-view">
|
|
|
- <!-- 今日课程模块 -->
|
|
|
- <view class="card-item" style="width: 100%;" v-if="classCurrent != -1">
|
|
|
- <view class="card-title">
|
|
|
- <view class="front-tag"></view>
|
|
|
- <view class="title">今日课程</view>
|
|
|
- <view class="flex-row" style="margin: 0 0 0 auto;" @click="navClassList">
|
|
|
- <view class="t-icon t-icon-fenlei"></view>
|
|
|
- <view class="title" style="color: #4169E1;margin-left: 10rpx;">课程列表</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="data-list">
|
|
|
- <!-- 上上节 -->
|
|
|
- <view class="data-item" v-if="classCurrent === classList.length">
|
|
|
- <view class="flex-row">
|
|
|
- <view class="t-icon t-icon-classicon-copy" style="width: 60rpx; height: 60rpx;"></view>
|
|
|
- <view class="flex-column">
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-title">{{classList[classCurrent - 3].title}}</view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 3].name}}</view>
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 3].teacher}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-subtitle">上节</view>
|
|
|
- <view class="item-detail">
|
|
|
- {{classList[classCurrent - 3].time}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state">
|
|
|
- <view class="state-text">{{classList[classCurrent - 3].attendance?'已出勤':'未出勤'}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 上节 -->
|
|
|
- <view class="data-item" v-if="classCurrent >= 2">
|
|
|
- <view class="flex-row">
|
|
|
- <view class="t-icon t-icon-classicon-copy" style="width: 60rpx; height: 60rpx;"></view>
|
|
|
- <view class="flex-column">
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-title">{{classList[classCurrent - 2].title}}</view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 2].name}}</view>
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 2].teacher}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-subtitle">上节</view>
|
|
|
- <view class="item-detail">
|
|
|
- {{classList[classCurrent - 2].time}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state">
|
|
|
- <view class="state-text">{{classList[classCurrent - 2].attendance?'已出勤':'未出勤'}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 当前 -->
|
|
|
- <view class="data-item" style="border-image: linear-gradient(to right, #4169E1, #FFF) 1;">
|
|
|
- <view class="flex-row">
|
|
|
- <view class="t-icon t-icon-classicon-copy" style="width: 60rpx; height: 60rpx;"></view>
|
|
|
- <view class="flex-column">
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-title" style="color: #4169E1;">
|
|
|
- {{classList[classCurrent - 1].title}}
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 1].name}}</view>
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent - 1].teacher}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-subtitle" style="color: #4169E1;">当前</view>
|
|
|
- <view class="item-detail" style="color: #4169E1;">
|
|
|
- {{classList[classCurrent - 1].time}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state" style="background-color: #ff5959;">
|
|
|
- <view class="state-text">{{classList[classCurrent - 1].attendance?'课程中':'未出勤'}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 下节 -->
|
|
|
- <view class="data-item" v-if="classCurrent != classList.length">
|
|
|
- <view class="flex-row">
|
|
|
- <view class="t-icon t-icon-classicon-noarrive" style="width: 60rpx; height: 60rpx;">
|
|
|
- </view>
|
|
|
- <view class="flex-column">
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-title">{{classList[classCurrent].title}}</view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent].name}}</view>
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent].teacher}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-subtitle">下节</view>
|
|
|
- <view class="item-detail">
|
|
|
- {{classList[classCurrent].time}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state" style="background-color: #909399;">
|
|
|
- <view class="state-text">未开始</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 下下节 -->
|
|
|
- <view class="data-item" v-if="classCurrent === 1">
|
|
|
- <view class="flex-row">
|
|
|
- <view class="t-icon t-icon-classicon-noarrive" style="width: 60rpx; height: 60rpx;">
|
|
|
- </view>
|
|
|
- <view class="flex-column">
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-title">{{classList[classCurrent+1].title}}</view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent+1].name}}</view>
|
|
|
- </view>
|
|
|
- <view class="tag">
|
|
|
- <view class="tag-text">{{classList[classCurrent+1].teacher}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="row-margin">
|
|
|
- <view class="item-subtitle">下节</view>
|
|
|
- <view class="item-detail">
|
|
|
- {{classList[classCurrent+1].time}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state" style="background-color: #909399;">
|
|
|
- <view class="state-text">未开始</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 插画模块 -->
|
|
|
- <view class="card-item" style="width: 100%;" v-if="classCurrent === -1">
|
|
|
- <view class="card-title">
|
|
|
- <view class="front-tag"></view>
|
|
|
- <view class="title">今日课程</view>
|
|
|
- </view>
|
|
|
- <view class="detail-image-none" :style="{backgroundImage:`url(${image})`}"></view>
|
|
|
- <view class="data-list">
|
|
|
- <view class="data-item" style="height: 120rpx;">
|
|
|
- <view class="flex-row" style="justify-content: space-between;">
|
|
|
- <view class="item-title" v-if="!isAfterDayClass">
|
|
|
- {{classList.length === 0 ? '假期充电' : '课间休息'}}
|
|
|
- </view>
|
|
|
- <view class="item-title" v-if="isAfterDayClass">课程完成</view>
|
|
|
- <view class="tag" style="margin: 0;">
|
|
|
- <view class="tag-text" v-if="!isAfterDayClass">
|
|
|
- {{classList.length === 0 ? '无课' : '下课'}}
|
|
|
- </view>
|
|
|
- <view class="tag-text" v-if="isAfterDayClass">放学</view>
|
|
|
- </view>
|
|
|
- <view class="item-subtitle" style="font-weight: 400;font-size: 26rpx;"
|
|
|
- v-if="!isAfterDayClass">
|
|
|
- {{classList.length === 0 ? '合理规划' : '预习下节'}}
|
|
|
- </view>
|
|
|
- <view class="item-subtitle" style="font-weight: 400;font-size: 26rpx;"
|
|
|
- v-if="isAfterDayClass">巩固所学</view>
|
|
|
- <view class="flex-row" @click="navClassList">
|
|
|
- <view class="t-icon t-icon-fenlei"></view>
|
|
|
- <view class="item-title" style="color: #4169E1;margin-left: 10rpx;">课程列表
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 今日打卡模块 -->
|
|
|
- <view class="card-item" style="height: 300rpx;" @click="navClockStats">
|
|
|
- <view class="flex-row" style="margin: 20rpx 20rpx 0 20rpx;">
|
|
|
- <view class="icon-box" style="width: 120rpx;height: 120rpx; background-color: #d8deff;">
|
|
|
- <view class="t-icon t-icon-a-rilidaka" style="width: 60rpx;height: 60rpx;"></view>
|
|
|
- </view>
|
|
|
- <view class="clock-block">
|
|
|
- <view class="subtitle">打卡记录</view>
|
|
|
- <view class="flex-baseline">
|
|
|
- <view class="YS-title">{{dayTime.split('月')[0]}}</view>
|
|
|
- <view class="YS-title" style="font-size: 30rpx; margin-left: 4rpx;">月</view>
|
|
|
- <view class="YS-title" style="margin-left: 4rpx;">
|
|
|
- {{dayTime.split('月')[1]}}
|
|
|
- </view>
|
|
|
- <view class="YS-title" style="font-size: 30rpx; margin-left: 4rpx;">日</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="flex-row" style="margin: auto 20rpx 20rpx 20rpx;justify-content: space-between;">
|
|
|
- <view class="clock-block">
|
|
|
- <view class="subtitle">打卡时间</view>
|
|
|
- <view class="YS-title" v-if="clockTime === '无记录'">
|
|
|
- {{clockTime}}
|
|
|
- </view>
|
|
|
- <view class="flex-baseline" v-if="clockTime != '无记录'">
|
|
|
- <view class="YS-title">
|
|
|
- {{clockTime.split(':')[0].replace('0','')}}
|
|
|
- </view>
|
|
|
- <view class="YS-title" style="font-size: 30rpx; margin-left: 4rpx;">点</view>
|
|
|
- <view class="YS-title" style="margin-left: 4rpx;">
|
|
|
- {{clockTime.split(':')[1]}}
|
|
|
- </view>
|
|
|
- <view class="YS-title" style="font-size: 30rpx; margin-left: 4rpx;">分</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="icon-box" style="width: 120rpx;height: 120rpx;"
|
|
|
- :style="{backgroundColor: clockState === '未打卡' ? '#ff5959':'#4169E1'}">
|
|
|
- <view class="YS-title" style="color: #FFF;font-size: 32rpx;">
|
|
|
- {{clockState}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view style="width: 0;height: 0;">
|
|
|
- <view class="clock-image"
|
|
|
- :style="{backgroundImage: clockState === '已打卡'?`url(${image2})`:`url(${image1})`}">
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 今日出席模块 -->
|
|
|
- <view class="card-item" style="background-color: #f3f4f9;justify-content: space-between;">
|
|
|
- <!-- 当前课程 -->
|
|
|
- <view class="class-box">
|
|
|
- <view class="icon-box" style="background-color: #d8deff; margin-left: 20rpx;">
|
|
|
- <view class="t-icon t-icon-shangke-"></view>
|
|
|
- </view>
|
|
|
- <view class="info-column">
|
|
|
- <view class="subtitle" style="font-size: 24rpx;">当前课程</view>
|
|
|
- <view class="YS-title" v-if="classCurrent!=-1">
|
|
|
- {{classList[classCurrent - 1].name}}
|
|
|
- </view>
|
|
|
- <view class="YS-title" v-if="classCurrent===-1">无课程</view>
|
|
|
- </view>
|
|
|
- <view v-if="classCurrent != -1">
|
|
|
- <view class="icon-box" style="margin-right: 20rpx;"
|
|
|
- :style="{backgroundColor: classList[classCurrent - 1].attendance ? '#23b46c':'#ff5959'}">
|
|
|
- <view class="YS-title" style="color: #FFF;font-size: 32rpx;">
|
|
|
- {{classList[classCurrent - 1].attendance ? '出勤':'缺勤'}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="classCurrent === -1">
|
|
|
- <view class="icon-box" style="margin-right: 20rpx;background-color: #f9c752;">
|
|
|
- <view class="YS-title" style="color: #FFF;font-size: 32rpx;">休息</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 出勤课程统计 -->
|
|
|
- <view class="class-box">
|
|
|
- <view class="icon-box" style="background-color: #d8deff;margin-left: 20rpx;">
|
|
|
- <view class="t-icon t-icon-shangkejilu"></view>
|
|
|
- </view>
|
|
|
- <view class="info-column">
|
|
|
- <view class="subtitle" style="font-size: 24rpx;">出勤课程</view>
|
|
|
- <view class="YS-title" v-if="classList">{{finishClassNum}}节课</view>
|
|
|
- <view class="YS-title" v-if="!classList">0 节</view>
|
|
|
- </view>
|
|
|
- <view v-if="classList">
|
|
|
- <view class="icon-box" style="margin-right: 20rpx;"
|
|
|
- :style="{backgroundColor: classAttendanceQuality === '全勤' ? '#23b46c':'#ff5959'}">
|
|
|
- <view class="YS-title" style="color: #FFF;font-size: 32rpx;">{{classAttendanceQuality}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="!classList">
|
|
|
- <view class="icon-box" style="margin-right: 20rpx;background-color: #f9c752;">
|
|
|
- <view class="YS-title" style="color: #FFF;font-size: 32rpx;">休息</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 推荐课例列表 -->
|
|
|
- <view class="flex-column" style="margin: 15rpx 0 10rpx 20rpx;">
|
|
|
- <view class="title" style="font-size: 32rpx;">课程推荐</view>
|
|
|
- <view class="bottom-tag"></view>
|
|
|
- </view>
|
|
|
- <view class="flex-row" style="width: 70%;"></view>
|
|
|
- </view>
|
|
|
- <scroll-view class="scroll-view-bottom" scroll-x="true" :scroll-with-animation="true" scroll-left="0">
|
|
|
- <view class="box-container" v-for="(item,index) in classData" :key="index"
|
|
|
- @click="navCourseRecommend(index)">
|
|
|
- <view class="clounm-container" v-for="(classItem,i) in item" :key="i">
|
|
|
- <view class="item-box">
|
|
|
- <view class="thumb" :style="{backgroundImage: `url(${classItem.coverImage})`}"></view>
|
|
|
- <view class="info-box">
|
|
|
- <view class="title" style="font-size: 32rpx;">{{classItem.title}}</view>
|
|
|
- <view class="flex-row">
|
|
|
- <view class="tag-fill">
|
|
|
- <view class="t-icon t-icon-a-wangluokechengzaixianjiaoyu"></view>
|
|
|
- <view class="tag-text">{{classItem.classHour}} 学时</view>
|
|
|
- </view>
|
|
|
- <view class="tag-fill" style="margin-left: 20rpx;">
|
|
|
- <view class="t-icon t-icon-xiaoyuanredian"></view>
|
|
|
- <view class="tag-text">{{classItem.learnNum}} 已学</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="desc">{{classItem.description}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import {
|
|
|
- mapState,
|
|
|
- mapMutations
|
|
|
- } from 'vuex'
|
|
|
-
|
|
|
- export default {
|
|
|
- computed: {
|
|
|
- ...mapState('m_children', ['classList', 'examData', 'workData', 'swapData', 'clockData']),
|
|
|
- ...mapState('m_parent', ['userData', 'classData'])
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- cardList: [{
|
|
|
- icon: 't-icon t-icon-chakandingdan',
|
|
|
- title: '评测记录',
|
|
|
- canvasId: 'tab_home_chart1',
|
|
|
- data: {
|
|
|
- "series": [{
|
|
|
- "name": "评测完成率",
|
|
|
- "data": '无评测',
|
|
|
- "color": "#ff8caf"
|
|
|
- }]
|
|
|
- },
|
|
|
- chartOpts: {}
|
|
|
- }, {
|
|
|
- icon: 't-icon t-icon-renwu',
|
|
|
- title: '作业记录',
|
|
|
- canvasId: 'tab_home_chart2',
|
|
|
- data: {
|
|
|
- "series": [{
|
|
|
- "name": "作业完成率",
|
|
|
- "data": '无作业',
|
|
|
- "color": "#f9c752"
|
|
|
- }]
|
|
|
- },
|
|
|
- chartOpts: {}
|
|
|
- }, {
|
|
|
- icon: 't-icon t-icon-wenjian',
|
|
|
- title: '活动记录',
|
|
|
- canvasId: 'tab_home_chart3',
|
|
|
- data: {
|
|
|
- "series": [{
|
|
|
- "name": "活动完成率",
|
|
|
- "data": '无活动',
|
|
|
- "color": "#FF6D31"
|
|
|
- }]
|
|
|
- },
|
|
|
- chartOpts: {}
|
|
|
- }],
|
|
|
- noticeData: '',
|
|
|
- //当前课程索引
|
|
|
- classCurrent: '',
|
|
|
- //已上课程
|
|
|
- finishClassNum: '',
|
|
|
- //课程缺省image
|
|
|
- image: 'https://image.meiye.art/pic_1631411821366fqhkuMI110LbOlAIdv1SV',
|
|
|
- //时间戳
|
|
|
- timeStamp: '',
|
|
|
- //今日时间
|
|
|
- dayTime: '',
|
|
|
- //打卡状态
|
|
|
- clockState: '',
|
|
|
- //打卡时间
|
|
|
- clockTime: '',
|
|
|
- //出勤课程统计信息
|
|
|
- classAttendanceQuality: '',
|
|
|
- //打卡状态image
|
|
|
- image1: 'https://ouch-cdn2.icons8.com/2farWQUdLe8J4mb4oQoEvJpl5OFXtM5P7AZi8nhuOxk/rs:fit:912:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvOTYz/L2VkZGEwNzAzLTAw/MWYtNGZiZS1hY2I3/LTVlNjRhZGYzNTAx/Mi5zdmc.png',
|
|
|
- image2: 'https://ouch-cdn2.icons8.com/6CkTSZQdyBYaGiqmNJRhbqoYi8QDcLFn-04VEQyQaCo/rs:fit:962:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNzMz/LzlhYmUzYjIyLTRl/ZGQtNDVkMi1iYWEw/LTVjYjk2NThmNDJi/OC5zdmc.png',
|
|
|
- //当前页面加载是否完成
|
|
|
- isHomeLoad: false,
|
|
|
- //今日课程是否上完
|
|
|
- isAfterDayClass: false
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- this.init()
|
|
|
- },
|
|
|
- //刷新页面
|
|
|
- onPullDownRefresh() {
|
|
|
- this.init()
|
|
|
- setTimeout(function() {
|
|
|
- uni.stopPullDownRefresh();
|
|
|
- }, 1000);
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //初始化页面
|
|
|
- async init() {
|
|
|
- await this.$initHome()
|
|
|
- this.dayTime = (new Date()).format('M-d').replace('-', '月')
|
|
|
- this.timeStamp = (new Date()).format("hh:mm")
|
|
|
- this.getClassCurrent()
|
|
|
- this.getChartData()
|
|
|
- this.getNoticeData()
|
|
|
- this.getClockData()
|
|
|
- this.getClassAttendance()
|
|
|
- this.isHomeLoad = true
|
|
|
- },
|
|
|
-
|
|
|
- //计算出当前课程
|
|
|
- getClassCurrent() {
|
|
|
- //当前时间戳是否在课程时间段内
|
|
|
- function CompareDate(start, finish) {
|
|
|
- //获得当前时间时间戳
|
|
|
- let timeNow = (new Date()).format("yyyy-MM-dd hh:mm").replace(new RegExp("-", "gm"), "/")
|
|
|
- let timeHaoMiao = (new Date(timeNow)).getTime()
|
|
|
- //获得课程开始结束时间戳
|
|
|
- let today = (new Date()).format("yyyy-MM-dd ")
|
|
|
- let classStart = (today + start).replace(new RegExp("-", "gm"), "/")
|
|
|
- let classFinish = (today + finish).replace(new RegExp("-", "gm"), "/")
|
|
|
- let classStartHaoMiao = (new Date(classStart)).getTime()
|
|
|
- let classFinishHaoMiao = (new Date(classFinish)).getTime()
|
|
|
- //比较
|
|
|
- if (timeHaoMiao < classFinishHaoMiao) {
|
|
|
- if (classStartHaoMiao < timeHaoMiao)
|
|
|
- return true
|
|
|
- }
|
|
|
- return false
|
|
|
- }
|
|
|
- //当前时间戳是否在课程开始时间之前
|
|
|
- function CompareDateStart(start) {
|
|
|
- //获得当前时间时间戳
|
|
|
- let timeNow = (new Date()).format("yyyy-MM-dd hh:mm").replace(new RegExp("-", "gm"), "/")
|
|
|
- let timeHaoMiao = (new Date(timeNow)).getTime()
|
|
|
- //获得课程开始结束时间戳
|
|
|
- let today = (new Date()).format("yyyy-MM-dd ")
|
|
|
- let classStart = (today + start).replace(new RegExp("-", "gm"), "/")
|
|
|
- let classStartHaoMiao = (new Date(classStart)).getTime()
|
|
|
- //比较
|
|
|
- if (timeHaoMiao < classStartHaoMiao)
|
|
|
- return true
|
|
|
- return false
|
|
|
- }
|
|
|
- //今日有课程
|
|
|
- if (this.classList.length != 0) {
|
|
|
- //当前课程索引
|
|
|
- let classIndex = -100
|
|
|
- //完成课程数目
|
|
|
- let finishNum = -100
|
|
|
- //是否在课堂中
|
|
|
- let isInClass = false
|
|
|
- //判断是否在课程中,若是则赋值为当前课程索引
|
|
|
- this.classList.some((item, index) => {
|
|
|
- let timeArr = item.time.split("-")
|
|
|
- //在课堂中
|
|
|
- let res = CompareDate(timeArr[0], timeArr[1])
|
|
|
- if (res) {
|
|
|
- classIndex = index + 1
|
|
|
- finishNum = index + 1
|
|
|
- return isInClass = true
|
|
|
- }
|
|
|
- })
|
|
|
- if (isInClass) {
|
|
|
- //当前课程赋值
|
|
|
- this.classCurrent = classIndex
|
|
|
- //已上课程赋值
|
|
|
- this.finishClassNum = finishNum
|
|
|
- } else {
|
|
|
- //是否放学
|
|
|
- this.classList.some((item, index) => {
|
|
|
- let timeArr = item.time.split("-")
|
|
|
- //没在课堂中
|
|
|
- let value = CompareDateStart(timeArr[0])
|
|
|
- //课间时间
|
|
|
- if (value) {
|
|
|
- classIndex = -1
|
|
|
- finishNum = index - 1
|
|
|
- this.isAfterDayClass = false
|
|
|
- } else {
|
|
|
- //放学时间(有课程但已上完状态)
|
|
|
- classIndex = -1
|
|
|
- finishNum = this.classList.length
|
|
|
- this.isAfterDayClass = true
|
|
|
- }
|
|
|
- })
|
|
|
- //当前课程赋值
|
|
|
- this.classCurrent = classIndex
|
|
|
- //已上课程赋值
|
|
|
- this.finishClassNum = finishNum
|
|
|
- }
|
|
|
- //无课程,放假时间
|
|
|
- } else {
|
|
|
- //当前课程赋值
|
|
|
- this.classCurrent = -1
|
|
|
- //已上课程赋值
|
|
|
- this.finishClassNum = 0
|
|
|
- }
|
|
|
- },
|
|
|
- //更新图表数据
|
|
|
- getChartData() {
|
|
|
- //完成数据
|
|
|
- if (this.examData.length != 0) {
|
|
|
- let examFinishData = this.examData.filter(x => x.examInfo.progress === 'finish')
|
|
|
- this.cardList[0].data.series[0].data = parseFloat((examFinishData.length / this.examData.length)
|
|
|
- .toFixed(2))
|
|
|
- }
|
|
|
- if (this.workData.length != 0) {
|
|
|
- let workFinishData = this.workData.filter(x => x.work.progress === 'finish')
|
|
|
- this.cardList[1].data.series[0].data = parseFloat((workFinishData.length / this.workData.length)
|
|
|
- .toFixed(2))
|
|
|
- }
|
|
|
- if (this.swapData.length != 0) {
|
|
|
- let swapFinishData = this.swapData.filter(x => x.vote && x.vote.progress === 'finish')
|
|
|
- swapFinishData.push(...this.swapData.filter(x => x.survey && x.survey.progress === 'finish'))
|
|
|
- this.cardList[2].data.series[0].data = parseFloat((swapFinishData.length / this.swapData.length)
|
|
|
- .toFixed(2))
|
|
|
- }
|
|
|
- //完成率传入图表
|
|
|
- for (let i = 0; i < 3; i++) {
|
|
|
- if (typeof(this.cardList[i].data.series[0].data) === typeof(0)) {
|
|
|
- let opt = {
|
|
|
- title: {
|
|
|
- name: (this.cardList[i].data.series[0].data * 100).toFixed(0) + '%',
|
|
|
- color: this.cardList[i].data.series[0].color
|
|
|
- },
|
|
|
- subtitle: {
|
|
|
- name: this.cardList[i].data.series[0].name
|
|
|
- },
|
|
|
- }
|
|
|
- this.cardList[i].chartOpts = JSON.parse(JSON.stringify(opt))
|
|
|
- } else {
|
|
|
- let opt = {
|
|
|
- title: {
|
|
|
- name: this.cardList[i].data.series[0].data,
|
|
|
- color: this.cardList[i].data.series[0].color
|
|
|
- },
|
|
|
- subtitle: {
|
|
|
- name: this.cardList[i].data.series[0].name
|
|
|
- },
|
|
|
- }
|
|
|
- this.cardList[i].chartOpts = JSON.parse(JSON.stringify(opt))
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- //日历数据获取
|
|
|
- getClockData() {
|
|
|
- //获得当前时间时间戳
|
|
|
- let today = (new Date()).format("yyyy-M-dd")
|
|
|
- let timeArr = today.split("-")
|
|
|
- if (this.clockData.length != 0) {
|
|
|
- let val = this.clockData.filter(x => x.year == timeArr[0] && x.month == timeArr[1] && x.date ==
|
|
|
- timeArr[2])
|
|
|
- if (val.length != 0) {
|
|
|
- this.clockState = '已打卡'
|
|
|
- this.clockTime = val[0].time
|
|
|
- } else {
|
|
|
- this.clockState = '未打卡'
|
|
|
- this.clockTime = '无记录'
|
|
|
- }
|
|
|
- } else {
|
|
|
- this.clockState = '未打卡'
|
|
|
- this.clockTime = '无记录'
|
|
|
- }
|
|
|
- },
|
|
|
- //获取滚动通知
|
|
|
- getNoticeData() {
|
|
|
- if (this.userData.msgList)
|
|
|
- this.noticeData = `您有 ${this.userData.msgList.length} 条通知,请点击查看`
|
|
|
- if (!this.userData.msgList)
|
|
|
- this.noticeData = `您已查看全部通知`
|
|
|
- },
|
|
|
- //获取出勤课程统计
|
|
|
- getClassAttendance() {
|
|
|
- let finishClassData = []
|
|
|
- for (let i = 0; i < this.finishClassNum; i++) {
|
|
|
- finishClassData.push(this.classList[i])
|
|
|
- }
|
|
|
- if (finishClassData.length != 0) {
|
|
|
- let isAttendArr = finishClassData.filter(x => x.attendance === true)
|
|
|
- this.classAttendanceQuality = isAttendArr.length === this.finishClassNum ? '全勤' : '缺勤'
|
|
|
- }
|
|
|
- },
|
|
|
- //导航
|
|
|
- navClassList() {
|
|
|
- let current = this.classCurrent
|
|
|
- uni.navigateTo({
|
|
|
- url: `/subpkg/home/classList?index=${current}`
|
|
|
- })
|
|
|
- },
|
|
|
- navTab(index) {
|
|
|
- let urlArr = ['/pages/tab_exam/tab_exam',
|
|
|
- '/pages/tab_work/tab_work',
|
|
|
- '/pages/tab_swap/tab_swap'
|
|
|
- ]
|
|
|
- uni.switchTab({
|
|
|
- url: urlArr[index]
|
|
|
- })
|
|
|
- },
|
|
|
- navClockStats() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/subpkg/home/clockStats'
|
|
|
- })
|
|
|
- },
|
|
|
- navCourseRecommend(index) {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/subpkg/home/courseRecommend?index=${index}`
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
- @import '@/pages/style/tab_pages.scss';
|
|
|
-
|
|
|
- .bg2 {
|
|
|
- margin-top: -1065rpx;
|
|
|
- height: 1200rpx;
|
|
|
- border-radius: 100rpx;
|
|
|
- border-bottom-left-radius: 0;
|
|
|
- background-color: #FFF;
|
|
|
- z-index: 1;
|
|
|
-
|
|
|
- .notice {
|
|
|
- margin: 1095rpx 50rpx 20rpx 50rpx;
|
|
|
- width: 650rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .YS-title {
|
|
|
- font-size: 38rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .row-margin {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin: 10rpx 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .tag {
|
|
|
- margin-left: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- //课程出勤
|
|
|
- .class-box {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- width: 100%;
|
|
|
- height: 140rpx;
|
|
|
- background-color: #FFF;
|
|
|
- border-radius: $border-radius;
|
|
|
-
|
|
|
- .info-column {
|
|
|
- height: 80rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-around;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .icon-box {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 80rpx;
|
|
|
- height: 80rpx;
|
|
|
- border-radius: 12rpx;
|
|
|
- z-index: 9;
|
|
|
-
|
|
|
- .t-icon {
|
|
|
- width: 50rpx;
|
|
|
- height: 50rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .clock-block {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 180rpx;
|
|
|
- height: 120rpx;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .state {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-left: auto;
|
|
|
- border-radius: $border-radius;
|
|
|
- background-color: $color-green;
|
|
|
- padding: 24rpx 12rpx;
|
|
|
-
|
|
|
- .t-icon {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .state-text {
|
|
|
- color: #FFF;
|
|
|
- font-size: 24rpx;
|
|
|
- font-weight: bold;
|
|
|
- transform: skew(-10deg);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .scroll-view-bottom {
|
|
|
- white-space: nowrap;
|
|
|
- padding-bottom: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .clock-image {
|
|
|
- margin-top: -160rpx;
|
|
|
- margin-left: 20rpx;
|
|
|
- height: 160rpx;
|
|
|
- width: 160rpx;
|
|
|
- background-size: 100%;
|
|
|
- background-repeat: no-repeat;
|
|
|
- opacity: 0.25;
|
|
|
- z-index: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .box-container {
|
|
|
- margin: 0 20rpx;
|
|
|
- display: inline-block;
|
|
|
- vertical-align: top;
|
|
|
- width: 84%;
|
|
|
-
|
|
|
- .clounm-container {
|
|
|
- height: 180rpx;
|
|
|
- width: 100%;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- border-radius: $border-radius;
|
|
|
- background-color: #FFF;
|
|
|
- overflow: hidden;
|
|
|
-
|
|
|
- .item-box {
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
-
|
|
|
- .thumb {
|
|
|
- width: 180rpx;
|
|
|
- height: 180rpx;
|
|
|
- border-radius: $border-radius;
|
|
|
- background-size: cover; //背景图片自适应
|
|
|
- background-repeat: no-repeat;
|
|
|
- z-index: 50;
|
|
|
- }
|
|
|
-
|
|
|
- .info-box {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- margin: 20rpx 20rpx 20rpx 30rpx;
|
|
|
- justify-content: space-between;
|
|
|
- width: 400rpx;
|
|
|
-
|
|
|
- .tag-fill {
|
|
|
- background-color: #d8deff;
|
|
|
- width: fit-content;
|
|
|
-
|
|
|
- .t-icon {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- margin-right: 5rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .tag-text {
|
|
|
- color: #4169E1;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .desc {
|
|
|
- line-height: 26rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #909399;
|
|
|
- white-space: nowrap;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|