You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
917 lines
24 KiB
917 lines
24 KiB
<template>
|
|
<view class="content">
|
|
<view class="navbar_section">
|
|
<view class="title">首页</view>
|
|
</view>
|
|
<view class="head">
|
|
<view class="head-img">
|
|
<!-- <fui-avatar width="136" :src="$util.img(member_info.headimg)"></fui-avatar> -->
|
|
<image class="pic" :src="member_info.memberHasOne ? member_info.memberHasOne.headimg : $util.img('/uniapp_src/static/images/common/yong_hu.png')"></image>
|
|
<view class="head-text">{{member_info.name}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="card">
|
|
<view class="card-back color-style"></view>
|
|
<view class="card-backs color-style"></view>
|
|
<view class="card-con">
|
|
<!-- <view class="card-head">-->
|
|
<!-- <view>-->
|
|
<!-- <span class="card-head-txt">班级</span>-->
|
|
<!-- <span class="card-head-txt1 card-head-back1">篮球少儿班</span>-->
|
|
<!-- </view>-->
|
|
<!-- <view>-->
|
|
<!-- <span class="card-head-txt">已耗课时</span>-->
|
|
<!-- <span class="card-head-txt1 card-head-back2">24/</span><span class="card-head-txt">60</span>-->
|
|
<!-- </view>-->
|
|
<!-- </view>-->
|
|
<!-- <view class="card-con-txt">课程到期时间：2021.12.25</view>-->
|
|
|
|
<view class="card-con-txt1">
|
|
<view class="card-con-txt1-left">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/score.png')" class="overlay-image"></image>
|
|
<view class="card-con-txt1-left-txt top">{{physicalTestInfo.calculateChildHealthScore}}</view>
|
|
<view class="card-con-txt1-left-txt top1">综合评分</view>
|
|
</view>
|
|
<view class="card-con-txt1-right">
|
|
<view style="color: #AAAAAA;padding: 5rpx;">数据测评时间：{{$util.formatToDateTime(physicalTestInfo.created_at,'Y-m-d')}}</view>
|
|
<view style="display: flex;justify-content: space-around;margin-top: 20rpx;">
|
|
<view>
|
|
<view style="font-size: 48rpx;color: #29d3b4;">{{physicalTestInfo.height}}</view>
|
|
<view style="color: #AAAAAA;font-size: 30rpx;">身高（CM）</view>
|
|
</view>
|
|
<view>
|
|
<view style="font-size: 48rpx;color: #29d3b4;">{{physicalTestInfo.weight}}</view>
|
|
<view style="color: #AAAAAA;font-size: 30rpx;">体重（KG）</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="more" @click="physical_examination()">更多</view>
|
|
</view>
|
|
|
|
<view class="upcomin-classes" v-if="personCourseScheduleInfo.id">
|
|
<view class="upcomin-classes-div">
|
|
<view class="upcomin-classes-div-con">
|
|
<view class="upcomin-classes-div-con-left">课程预告</view>
|
|
|
|
<view class="centre_box">
|
|
<view class="upcomin-classes-div-con-centre"></view>
|
|
<view class="centre">
|
|
<view>{{$util.formatToDateTime(personCourseScheduleInfo.course_date,'m-d')}} {{personCourseScheduleInfo.time_slot}}</view>
|
|
<view style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">{{personCourseScheduleInfo.courseScheduleHasOne.venue.venue_name}} {{personCourseScheduleInfo.courseScheduleHasOne.course.course_name}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="upcomin-classes-div-con-right" @click="openViewTimetableInfo(personCourseScheduleInfo)">
|
|
详情
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 功能快捷入口 -->
|
|
<view class="feature-section">
|
|
<view class="feature-title">学习中心</view>
|
|
<view class="feature-grid">
|
|
<view class="feature-item" @click="navigateToTimetable">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/timetable.png')" class="feature-icon"></image>
|
|
<text class="feature-text">课程表</text>
|
|
</view>
|
|
<view class="feature-item" @click="jobList">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/homework.png')" class="feature-icon"></image>
|
|
<text class="feature-text">作业管理</text>
|
|
</view>
|
|
<view class="feature-item" @click="navigateToLearningMaterials">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/materials.png')" class="feature-icon"></image>
|
|
<text class="feature-text">学习资料</text>
|
|
</view>
|
|
<view class="feature-item" @click="navigateToMessages">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/message.png')" class="feature-icon"></image>
|
|
<text class="feature-text">消息中心</text>
|
|
</view>
|
|
<view class="feature-item" @click="navigateToOrders">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/order.png')" class="feature-icon"></image>
|
|
<text class="feature-text">订单管理</text>
|
|
</view>
|
|
<view class="feature-item" @click="navigateToProfile">
|
|
<image :src="$util.img('/uniapp_src/static/images/index/profile.png')" class="feature-icon"></image>
|
|
<text class="feature-text">个人中心</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="after-class">
|
|
<view class="after-class-title">
|
|
<view class="after-class-title-left">课后作业</view>
|
|
<view class="after-class-title-right" @click="jobList">全部</view>
|
|
</view>
|
|
|
|
<view class="after-class-con" v-for="(v,k) in jobAssignmentsInfo" :key="k" @click="openViewWorkDetails(v)">
|
|
<view class="after-class-con-txt">
|
|
<!-- <view style="width: 25%;margin-top: 5%;">-->
|
|
<!-- <view style="font-size: 55rpx;color: #fff;"><span style="color: #29d3b4;">12</span>/23-->
|
|
<!-- </view>-->
|
|
<!-- <view style="font-size: 35rpx;color: #ccc;padding-left: 10rpx;">已完成</view>-->
|
|
<!-- </view>-->
|
|
<view style="width: 100%;">
|
|
<view style="color: #fff;display: flex;justify-content: space-between;align-items: center;">
|
|
<view style="display: flex;align-items: center;">
|
|
<image :src="v.student.customerResources.member.headimg ? v.student.customerResources.member.headimg : $util.img('/uniapp_src/static/images/common/yong_hu.png')" style="width: 50rpx;height: 50rpx;">
|
|
</image>
|
|
<span style="padding-left: 10rpx;font-size: 35rpx;">{{v.student.name}}</span>
|
|
</view>
|
|
<view>
|
|
<fui-button background="#404045" color="#F59A23" borderColor="#F59A23"
|
|
btnSize="mini" @click="submitJob(v)">上传</fui-button>
|
|
</view>
|
|
</view>
|
|
<view style="color: #fff;padding: 10rpx;">时间：{{$util.formatToDateTime(v.created_at, "Y-m-d H:i")}}</view>
|
|
<view style="color: #fff;padding: 10rpx;">类型：{{v.content_type == 1 ? '图片' : (v.content_type == 2 ? '视频':'文本')}}</view>
|
|
<view class="description">
|
|
{{v.description}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 已提交的作业列表-->
|
|
<view class="item" v-for="(v,k) in assignmentsList" :key="k" @click="openViewWorkDetails(v)">
|
|
<view class="box">
|
|
<view class="description">
|
|
描述:{{v.description}}
|
|
</view>
|
|
|
|
<view class="content_box" v-if="v.content_text">
|
|
<video class="video" v-if="v.content_type == 2" :src="v.content_text"></video>
|
|
|
|
<image class="image" v-else-if="v.content_type == 1" :src="v.content_text" mode="aspectFit"></image>
|
|
|
|
<view class="text" v-else-if="v.content_type == 3" >作业内容：{{ v.content_text }}</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <view class="multi-line-ellipsis text-style">-->
|
|
<!-- 作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述作业描述</view>-->
|
|
<!-- <view style="width: 92%;margin: auto;border-radius: 15rpx;">-->
|
|
<!-- <video style="width: 100%;border-radius: 15rpx;"></video>-->
|
|
<!-- </view>-->
|
|
|
|
|
|
</view>
|
|
<view style="height: 180rpx;width: 100%;"></view>
|
|
</view>
|
|
<AQTabber />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {Api_url} from "@/common/config";
|
|
import apiRoute from '@/api/apiRoute.js';
|
|
|
|
import memberApi from '@/api/member.js';
|
|
import AQTabber from "@/components/AQ/AQTabber.vue"
|
|
export default {
|
|
components: {
|
|
AQTabber,
|
|
},
|
|
data() {
|
|
return {
|
|
|
|
//上传接口地址
|
|
uploadApiUrl: ``,
|
|
uploadImageApiUrl: `${Api_url}/memberUploadImage`,//图片上传接口
|
|
uploadVideoApiUrl: `${Api_url}/memberUploadVideo`,//视频上传接口
|
|
|
|
member_info: {},//学生信息
|
|
|
|
assignmentsList: [],//作业列表
|
|
jobAssignmentsInfo: [],//待完成的作业
|
|
|
|
path_arr:{
|
|
'1':'/pages/coach/home/index',//教练
|
|
'2':'/pages/market/index/index',//销售
|
|
'3':'/pages/student/index/index',//学员
|
|
},
|
|
thisPath:'',//当前页面的路径(默认'')
|
|
openPath:'',//正确的跳转路径(默认'')
|
|
|
|
physicalTestInfo:{
|
|
created_at:'',//测评时间
|
|
calculateChildHealthScore:'0',//综合评分
|
|
height:'0',//身高
|
|
weight:'0',//体重
|
|
},//体测报告详情
|
|
|
|
personCourseScheduleInfo:{
|
|
id:'',
|
|
},//课程安排详情
|
|
}
|
|
},
|
|
onLoad() {},
|
|
onShow(){
|
|
this.init()
|
|
},
|
|
methods: {
|
|
//学生页面初始化
|
|
async init(){
|
|
await this.member_init()
|
|
await this.getPhysicalTestList()
|
|
await this.getPersonCourseScheduleList()
|
|
this.getList()
|
|
this.getJobAssignmentsInfo()
|
|
},
|
|
|
|
//获取体测列表
|
|
async getPhysicalTestList(){
|
|
let params = {
|
|
page: 1,//当前页码
|
|
limit: 1,//每页返回数据条数
|
|
total: 1,//数据总条数
|
|
resource_id:this.member_info.id,//学生资源表id
|
|
}
|
|
let res = await apiRoute.xy_physicalTest(params)
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
|
|
console.log('tc',res.data)
|
|
|
|
let arr = res.data.data
|
|
if(arr.length){
|
|
this.physicalTestInfo = arr[0]
|
|
}
|
|
},
|
|
|
|
//学生端-学生课程安排-列表
|
|
async getPersonCourseScheduleList(){
|
|
let params = {
|
|
page: 1,//当前页码
|
|
limit: 1,//每页返回数据条数
|
|
total: 1,//数据总条数
|
|
resources_id:this.member_info.id,//学生资源表id
|
|
status:'0',//状态0待上课1已上课2请假
|
|
}
|
|
let res = await apiRoute.xy_personCourseSchedule(params)
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
|
|
console.log('课程安排',res.data)
|
|
|
|
let arr = res.data.data
|
|
if(arr.length){
|
|
this.personCourseScheduleInfo = arr[0]
|
|
}
|
|
},
|
|
|
|
//获取作业列表
|
|
async getList(){
|
|
let data = {
|
|
page: 1,
|
|
limit: 10,
|
|
resources_id: this.member_info.id,
|
|
status: '3',//1待批改 2未提交 3已提交
|
|
}
|
|
let res = await apiRoute.xy_assignment(data)
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.assignmentsList = res.data.data
|
|
// console.log('作业列表',this.assignmentsList)
|
|
},
|
|
|
|
//获取待提交的作业列表
|
|
async getJobAssignmentsInfo(){
|
|
let data = {
|
|
page: 1,
|
|
limit: 1,
|
|
resources_id: this.member_info.id,
|
|
status: '2',//状态 1待批改 2未提交 3已提交
|
|
}
|
|
let res = await apiRoute.xy_assignment(data)
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.jobAssignmentsInfo = res.data.data
|
|
|
|
// console.log('待提交的作业',this.jobAssignmentsInfo)
|
|
},
|
|
|
|
//获取学员信息
|
|
async member_init() {
|
|
let res = await apiRoute.xy_memberInfo({})
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.member_info = res.data
|
|
console.log('xxxx',this.member_info)
|
|
},
|
|
|
|
//跳转页面-作业详情
|
|
details() {
|
|
this.$navigateTo({
|
|
url: '/pages/student/index/work_details'
|
|
})
|
|
},
|
|
//跳转体测列表
|
|
physical_examination(){
|
|
let resource_id = this.member_info.id
|
|
this.$navigateTo({
|
|
url: `/pages/student/index/physical_examination?resource_id=${resource_id}`
|
|
})
|
|
},
|
|
//跳转作业列表页
|
|
jobList(){
|
|
this.$navigateTo({
|
|
url: '/pages/student/index/job_list'
|
|
})
|
|
},
|
|
|
|
// 上传作业
|
|
async submitJob(item) {
|
|
let type = item.content_type // 作业类型1图片2视频3文本
|
|
|
|
try {
|
|
// 等待上传文件的返回结果
|
|
let uploadRes = await this.uploadFile(type)
|
|
console.log('上传结果', uploadRes)
|
|
|
|
// 检查上传结果
|
|
if (!uploadRes.data.url) {
|
|
return
|
|
}
|
|
|
|
// 构建提交作业的数据
|
|
let data = {
|
|
id: item.id, // 作业列表id
|
|
student_file: uploadRes.data.path, // 附件
|
|
resources_id:this.member_info.id, // 学生资源id
|
|
content_text:uploadRes.data.url
|
|
}
|
|
|
|
// 提交作业
|
|
await this.assignmentsSubmit(data)
|
|
} catch (error) {
|
|
console.error('上传或提交作业失败:', error)
|
|
//alert('上传或提交作业失败')
|
|
//提示
|
|
uni.showToast({
|
|
title: '上传或提交作业失败',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
},
|
|
|
|
// 上传单文件(视频/图片) type=作业类型1图片2视频3文本
|
|
async uploadFile(type) {
|
|
return new Promise((resolve, reject) => {
|
|
if (type == 1) {
|
|
//图片作业
|
|
this.uploadApiUrl = this.uploadImageApiUrl
|
|
uni.chooseImage({
|
|
count: 1,
|
|
sizeType: ['compressed'],
|
|
sourceType: ['album', 'camera'],
|
|
success: async (res) => {
|
|
const tempFilePath = res.tempFilePaths[0]
|
|
// 这里可以调用上传接口
|
|
try {
|
|
let data = await this.uploadFilePromise(tempFilePath)
|
|
resolve(data)
|
|
} catch (error) {
|
|
reject(error)
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
reject(error)
|
|
}
|
|
})
|
|
} else if(type == 2){
|
|
//视频作业
|
|
this.uploadApiUrl = this.uploadVideoApiUrl
|
|
uni.chooseVideo({
|
|
count: 1,
|
|
// sizeType: ['compressed'],
|
|
sourceType: ['album', 'camera'],
|
|
success: async (res) => {
|
|
// console.log('文件选择结果:', res); // 打印 res 检查是否有 tempFilePaths
|
|
const tempFilePath = res.tempFilePath; // 直接获取视频文件路径
|
|
// console.log('上传的文件',tempFilePath)
|
|
|
|
// 这里可以调用上传接口
|
|
try {
|
|
let data = await this.uploadFilePromise(tempFilePath)
|
|
resolve(data)
|
|
} catch (error) {
|
|
reject(error)
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
reject(error)
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
// 执行文件上传
|
|
uploadFilePromise(url) {
|
|
return new Promise((resolve, reject) => {
|
|
let token = uni.getStorageSync('token') || ''
|
|
uni.uploadFile({
|
|
url: this.uploadApiUrl, // 仅为示例，非真实的接口地址
|
|
filePath: url,
|
|
name: 'file',
|
|
header: {
|
|
'token': `${token}`, // 请求头设置token
|
|
},
|
|
success: (e) => {
|
|
let res = JSON.parse(e.data.replace(/\ufeff/g, "") || "{}")
|
|
// console.log('上传成功2', res)
|
|
if (res.code == 1) {
|
|
resolve({
|
|
code: 1,
|
|
data: res.data,
|
|
msg: '上传成功'
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
reject({
|
|
code: 0,
|
|
data: {},
|
|
msg: '上传失败'
|
|
})
|
|
}
|
|
},
|
|
fail: (error) => {
|
|
reject(error)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 提交作业接口
|
|
async assignmentsSubmit(item) {
|
|
let data = {
|
|
resources_id:item.resources_id, // 学生资源id
|
|
id:item.id,
|
|
content_text:item.content_text
|
|
}
|
|
let res = await apiRoute.xy_assignmentSubmitObj(data)
|
|
if (res.code != 1) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'success'
|
|
})
|
|
// 延迟1s执行
|
|
setTimeout(() => {
|
|
this.init()
|
|
}, 1000)
|
|
},
|
|
|
|
//跳转页面-打开作业详情
|
|
openViewWorkDetails(item) {
|
|
let id = item.id
|
|
this.$navigateTo({
|
|
url: `/pages/student/index/work_details?id=${id}`
|
|
})
|
|
},
|
|
|
|
//跳转页面-打开课时详情
|
|
openViewTimetableInfo(item) {
|
|
let person_course_schedule_id = item.id
|
|
this.$navigateTo({
|
|
url: `/pages/student/timetable/info?person_course_schedule_id=${person_course_schedule_id}`
|
|
})
|
|
},
|
|
|
|
// 功能快捷入口导航方法
|
|
navigateToTimetable() {
|
|
this.$navigateTo({
|
|
url: '/pages/student/timetable/index'
|
|
})
|
|
},
|
|
|
|
navigateToLearningMaterials() {
|
|
// 学习资料页面 - 如果存在的话
|
|
uni.showToast({
|
|
title: '学习资料功能开发中',
|
|
icon: 'none'
|
|
})
|
|
},
|
|
|
|
navigateToMessages() {
|
|
this.$navigateTo({
|
|
url: '/pages/common/my_message'
|
|
})
|
|
},
|
|
|
|
navigateToOrders() {
|
|
let resource_id = this.member_info.id || ''
|
|
let resource_name = this.member_info.name || ''
|
|
this.$navigateTo({
|
|
url: `/pages/common/contract_list?resource_id=${resource_id}&resource_name=${resource_name}&staff_id=&staff_id_name=`
|
|
})
|
|
},
|
|
|
|
navigateToProfile() {
|
|
this.$navigateTo({
|
|
url: '/pages/student/my/my'
|
|
})
|
|
},
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
|
|
//自定义导航栏
|
|
.navbar_section{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: #29d3b4;
|
|
.title{
|
|
padding: 40rpx 0rpx;
|
|
|
|
/* 小程序端样式 */
|
|
// #ifdef MP-WEIXIN
|
|
padding: 80rpx 0rpx;
|
|
// #endif
|
|
|
|
|
|
font-size: 30rpx;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
page {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.overlay-image {
|
|
width: 95%;
|
|
height: 90%;
|
|
}
|
|
|
|
.multi-line-ellipsis {
|
|
width: 100%;
|
|
color: #fff;
|
|
padding: 5rpx 10rpx;
|
|
display: -webkit-box;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 2;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.text-style {
|
|
width: 92%;
|
|
margin: 15rpx auto;
|
|
}
|
|
|
|
.content {
|
|
background-color: #292929;
|
|
height: 100vh;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.head {
|
|
background-color: #29d3b4;
|
|
width: 100%;
|
|
}
|
|
|
|
.head-img {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 10rpx 20rpx;
|
|
}
|
|
|
|
.head-text {
|
|
color: #fff;
|
|
font-size: 35rpx;
|
|
padding-left: 20rpx;
|
|
}
|
|
|
|
.card {
|
|
width: 100%;
|
|
height: 450rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.card-back {
|
|
background-color: #29d3b4;
|
|
}
|
|
|
|
.card-backs {
|
|
background-color: #292929;
|
|
}
|
|
|
|
.color-style {
|
|
width: 100%;
|
|
height: 50%;
|
|
}
|
|
|
|
.card-con {
|
|
width: 92%;
|
|
//height: 92%;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.card-head {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 30rpx 20rpx 20rpx;
|
|
}
|
|
|
|
.card-head-txt {
|
|
color: #AAAAAA;
|
|
}
|
|
|
|
.card-head-txt1 {
|
|
padding-left: 10rpx;
|
|
}
|
|
|
|
.card-head-back1 {
|
|
color: #4b4b4b;
|
|
}
|
|
|
|
.card-head-back2 {
|
|
color: #2bd3b5;
|
|
}
|
|
|
|
.card-con-txt {
|
|
color: #AAAAAA;
|
|
padding: 5rpx 20rpx 20rpx;
|
|
}
|
|
|
|
.card-con-txt1 {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx 20rpx 0;
|
|
height: 220rpx;
|
|
}
|
|
|
|
.card-con-txt1-left {
|
|
width: 42%;
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.card-con-txt1-left-txt {
|
|
font-size: 32rpx;
|
|
color: #29d3b4;
|
|
position: absolute;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
.top {
|
|
top: 60%;
|
|
}
|
|
|
|
.top1 {
|
|
top: 80%;
|
|
}
|
|
|
|
.card-con-txt1-right {
|
|
width: 58%;
|
|
height: 100%;
|
|
}
|
|
|
|
.more {
|
|
padding: 0 30rpx 30rpx;
|
|
text-align: right;
|
|
color: #F59A23;
|
|
}
|
|
|
|
.upcomin-classes {
|
|
background-color: #292929;
|
|
width: 100%;
|
|
height: 136rpx;
|
|
}
|
|
|
|
.upcomin-classes-div {
|
|
padding-top: 20rpx;
|
|
width: 92%;
|
|
background-color: #29d3b4;
|
|
height: 106rpx;
|
|
margin: auto;
|
|
border-radius: 50rpx;
|
|
}
|
|
|
|
.upcomin-classes-div-con {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
color: #fff;
|
|
padding: 0 40rpx;
|
|
.upcomin-classes-div-con-left {
|
|
width: 60rpx;
|
|
text-align: right;
|
|
}
|
|
.centre_box{
|
|
display: flex;
|
|
align-items: center;
|
|
.upcomin-classes-div-con-centre {
|
|
margin: 0 20rpx;
|
|
width: 2rpx;
|
|
height: 60rpx;
|
|
background-color: #fff;
|
|
}
|
|
.centre{
|
|
width:80%;
|
|
}
|
|
}
|
|
.upcomin-classes-div-con-right {
|
|
width: 100rpx;
|
|
height: 50rpx;
|
|
background-color: #32baa1;
|
|
text-align: center;
|
|
line-height: 50rpx;
|
|
border-radius: 50rpx;
|
|
}
|
|
}
|
|
|
|
|
|
.after-class {
|
|
background-color: #292929;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.after-class-title {
|
|
width: 92%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: auto;
|
|
}
|
|
|
|
.after-class-title-left {
|
|
color: #fff;
|
|
font-size: 35rpx;
|
|
border-bottom: 4rpx #29d3b4 solid;
|
|
}
|
|
|
|
.after-class-title-right {
|
|
color: #F59A23;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.after-class-con {
|
|
width: 92%;
|
|
//height: 246rpx;
|
|
background-color: #404045;
|
|
border-radius: 20rpx;
|
|
margin: 15rpx auto;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.after-class-con-txt {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx;
|
|
width: 100%;
|
|
align-content: space-around;
|
|
.description{
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.pic {
|
|
width: 144rpx;
|
|
height: 144rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
// 功能快捷入口样式
|
|
.feature-section {
|
|
background-color: #292929;
|
|
padding: 30rpx 20rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.feature-title {
|
|
color: #fff;
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
margin-bottom: 30rpx;
|
|
border-bottom: 2rpx #29d3b4 solid;
|
|
padding-bottom: 15rpx;
|
|
}
|
|
|
|
.feature-grid {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-around;
|
|
padding: 0 10rpx;
|
|
}
|
|
|
|
.feature-item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: rgba(255, 255, 255, 0.1);
|
|
border-radius: 20rpx;
|
|
padding: 30rpx 15rpx;
|
|
margin-bottom: 25rpx;
|
|
width: 30%;
|
|
box-sizing: border-box;
|
|
|
|
/* 小程序端兼容 */
|
|
// #ifdef MP-WEIXIN
|
|
min-height: 140rpx;
|
|
// #endif
|
|
|
|
/* H5端兼容 */
|
|
// #ifdef H5
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
// #endif
|
|
}
|
|
|
|
.feature-item:active {
|
|
transform: scale(0.95);
|
|
background: rgba(41, 211, 180, 0.2);
|
|
}
|
|
|
|
.feature-icon {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
margin-bottom: 15rpx;
|
|
}
|
|
|
|
.feature-text {
|
|
color: #fff;
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.item{
|
|
padding: 40rpx;
|
|
.box{
|
|
color: #fff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
.description{
|
|
}
|
|
.content_box{
|
|
width: 100%;
|
|
margin: auto;
|
|
margin-top: 20rpx;
|
|
border-radius: 15rpx;
|
|
.video{
|
|
width: 100%;
|
|
border-radius: 15rpx;
|
|
}
|
|
.image{
|
|
width: 100%;
|
|
border-radius: 15rpx;
|
|
}
|
|
.text{
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|