|
|
@@ -1,21 +1,44 @@
|
|
|
<template>
|
|
|
<view class="center">
|
|
|
- <view class="english">various courses for children</view>
|
|
|
<scroll-view scroll-y="true" class="list">
|
|
|
<view v-for="(item,index) in courseList" :key="index" class="listBox" @click="nav(index)">
|
|
|
- <view class="bg"></view>
|
|
|
- <view class="title">暑假培训阅读精品课</view>
|
|
|
- <view class="teacher">授课科目:{{ item.subject}} {{ item.teacher}}</view>
|
|
|
- <view class="bzr">{{ item.bzr }}</view>
|
|
|
+ <view class="type">待完成</view>
|
|
|
+ <view class="top flex">
|
|
|
+ <image src="../../static/img/indexMycourse.png"></image>
|
|
|
+ <view class="font">
|
|
|
+ <view class="title">奥数能力提升班</view>
|
|
|
+ <view class="time">{{item.start_time}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="main">
|
|
|
+ <view class="left">
|
|
|
+ <view class="font">授课科目: {{item.subject}}</view>
|
|
|
+ <view class="font">班主任:</view>
|
|
|
+ </view>
|
|
|
+ <view class="right">
|
|
|
+ <view class="font">授课老师: {{item.teacher}}</view>
|
|
|
+ <view class="font">电话:</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="button">请假</view>
|
|
|
</view>
|
|
|
+ <uni-load-more :status="loadingType"></uni-load-more>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { getCourse } from '@/api/course.js'
|
|
|
+ import { getCourse } from '@/api/course.js';
|
|
|
+ import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
|
|
|
+ import { mapState, mapMutations } from 'vuex';
|
|
|
+ import { saveUrl, interceptor } from '@/utils/loginUtils.js';
|
|
|
export default {
|
|
|
+ computed: {
|
|
|
+ ...mapState(['hasLogin', 'userInfo', 'baseURL', 'urlFile'])
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ uniLoadMore
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
page: 1,
|
|
|
@@ -27,7 +50,26 @@
|
|
|
}
|
|
|
},
|
|
|
onLoad() {
|
|
|
- this.loadData();
|
|
|
+ if (this.hasLogin) {
|
|
|
+ console.log(this.userInfo)
|
|
|
+ this.loadData();
|
|
|
+ }else{
|
|
|
+ uni.showModal({
|
|
|
+ title: '登录',
|
|
|
+ content: '您未登录,是否马上登陆?',
|
|
|
+ success: e => {
|
|
|
+ console.log(e)
|
|
|
+ if (e.confirm) {
|
|
|
+ console.log("1111")
|
|
|
+ interceptor();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: e => {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
},
|
|
|
//下拉刷新
|
|
|
onPullDownRefresh() {
|
|
|
@@ -62,7 +104,7 @@
|
|
|
obj.courseList = obj.courseList.concat(e.data.data);
|
|
|
console.log(obj.courseList);
|
|
|
//判断是否还有下一页,有是more 没有是nomore
|
|
|
- if (obj.limit==e.data.length) {
|
|
|
+ if (obj.limit==e.data.data.length) {
|
|
|
obj.page++
|
|
|
obj.loadingType='more'
|
|
|
} else{
|
|
|
@@ -93,73 +135,86 @@ page,
|
|
|
height: 100%;
|
|
|
background-color: #f8f8f8;
|
|
|
}
|
|
|
-.english {
|
|
|
- padding-left: 41rpx;
|
|
|
- font-size: 25rpx;
|
|
|
- font-family: Source Han Sans CN;
|
|
|
- font-weight: 400;
|
|
|
- color: #C2C2C2;
|
|
|
-}
|
|
|
-.list {
|
|
|
- height: 1100rpx;
|
|
|
-}
|
|
|
+
|
|
|
.listBox {
|
|
|
position: relative;
|
|
|
- width: 90%;
|
|
|
- height: 250rpx;
|
|
|
+ padding-left: 28rpx;
|
|
|
+ padding-top: 42rpx;
|
|
|
margin: 0 auto;
|
|
|
- margin-top: 34rpx;
|
|
|
- box-shadow: 0rpx 5rpx 16rpx 0rpx rgba(253, 90, 84, 0.48);
|
|
|
- border-radius: 28rpx;
|
|
|
- .bg {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
+ margin: 20rpx;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0px 5rpx 24rpx 0px rgba(4, 0, 0, 0.06);
|
|
|
+ border-radius: 15rpx;
|
|
|
+ .type {
|
|
|
position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- background-color: #4EADFA;;
|
|
|
- border-radius: 28rpx;
|
|
|
- }
|
|
|
- .title {
|
|
|
- position: relative;
|
|
|
- padding-top: 36rpx;
|
|
|
- padding-left: 36rpx;
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #FFFFFF;
|
|
|
- z-index: 1;
|
|
|
- }
|
|
|
- .teacher {
|
|
|
- position: relative;
|
|
|
- margin-top: 56rpx;
|
|
|
- margin-left: 36rpx;
|
|
|
- font-size: 24rpx;
|
|
|
+ top: 38rpx;
|
|
|
+ right: 32rpx;
|
|
|
+ width: 97rpx;
|
|
|
+ height: 38rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: #FFDEDF;
|
|
|
+ border-radius: 5rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
font-weight: 500;
|
|
|
- color: #FFFFFF;
|
|
|
- z-index: 1;
|
|
|
+ color: #FF5850;
|
|
|
+ line-height: 38rpx;
|
|
|
}
|
|
|
- .bzr {
|
|
|
- position: relative;
|
|
|
- margin-left: 36rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- font-weight: 500;
|
|
|
- color: #FFFFFF;
|
|
|
- z-index: 1;
|
|
|
+ .top {
|
|
|
+ justify-content: start;
|
|
|
+ margin-bottom: 34rpx;
|
|
|
+ image {
|
|
|
+ width: 76rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ }
|
|
|
+ .font {
|
|
|
+ margin-left: 10rpx;
|
|
|
+ .title {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ .time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #808080;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .main {
|
|
|
+ display: flex;
|
|
|
+ justify-content: start;
|
|
|
+ .left {
|
|
|
+ width: 50%;
|
|
|
+ .font{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #808080;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right {
|
|
|
+ padding-left: 10rpx;
|
|
|
+ .font{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #808080;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.button {
|
|
|
- position: absolute;
|
|
|
- right: 26rpx;
|
|
|
- bottom: 35rpx;
|
|
|
- width: 160rpx;
|
|
|
- height: 57rpx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 28rpx;
|
|
|
+ margin-top: 40rpx;
|
|
|
+ margin-left: 500rpx;
|
|
|
+ width: 145rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ border: 1rpx solid #FF8219;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #FF8219;
|
|
|
text-align: center;
|
|
|
- line-height: 57rpx;
|
|
|
- font-size: 27rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #FD5954;
|
|
|
+ line-height: 48rpx;
|
|
|
}
|
|
|
}
|
|
|
</style>
|
|
|
|
|
|
+
|