|
@@ -7,27 +7,27 @@
|
|
|
<text style="padding: 0 15rpx;">{{ calendarStudyVo.year }}年 {{ calendarStudyVo.month }}月</text>
|
|
|
<u-icon name="arrow-right" size="28" v-if="haveNextMonth" @click="swipeMonth(1)"></u-icon>
|
|
|
</view>
|
|
|
- <view style="width: 100%;display: flex;justify-content:center;margin-top: 20rpx;">
|
|
|
+ <view style="width: 100%;margin-top: 20rpx;">
|
|
|
<view v-for="(item, index) in date" :key="index" class="card_date">{{ item }}</view>
|
|
|
</view>
|
|
|
<view style="width: 100%;margin-top: 20rpx;">
|
|
|
<view v-for="(item, index) in showDayList" :key="index" class="date_num">
|
|
|
- <view v-if="item.color == 0" class="date_num_color0" v-show="item.date > 0">
|
|
|
+ <view v-if="item.color == 0" @click="itemClick(item,index)" class="date_num_color0" :class="{active_color:item.date == activeDate}" v-show="item.date > 0">
|
|
|
{{ item.date }}
|
|
|
<view v-if="item.note > 0" class="date_note">{{ item.note }}</view>
|
|
|
<view v-if="item.dot" class="date_dot"></view>
|
|
|
</view>
|
|
|
- <view v-if="item.color == 1" class="date_num_color1">
|
|
|
+ <view v-if="item.color == 1" @click="itemClick(item,index)" class="date_num_color1" :class="{active_color:item.date == activeDate}">
|
|
|
{{ item.date }}
|
|
|
<view v-if="item.note > 0" class="date_note">{{ item.note }}</view>
|
|
|
<view v-if="item.dot" class="date_dot"></view>
|
|
|
</view>
|
|
|
- <view v-if="item.color == 2" class="date_num_color2">
|
|
|
+ <view v-if="item.color == 2" @click="itemClick(item,index)" class="date_num_color2" :class="{active_color:item.date == activeDate}">
|
|
|
{{ item.date }}
|
|
|
<view v-if="item.note > 0" class="date_note">{{ item.note }}</view>
|
|
|
<view v-if="item.dot" class="date_dot"></view>
|
|
|
</view>
|
|
|
- <view v-if="item.color == 3" class="date_num_color3">
|
|
|
+ <view v-if="item.color == 3" @click="itemClick(item,index)" class="date_num_color3" :class="{active_color:item.date == activeDate}">
|
|
|
{{ item.date }}
|
|
|
<view v-if="item.note > 0" class="date_note">{{ item.note }}</view>
|
|
|
<view v-if="item.dot" class="date_dot"></view>
|
|
@@ -178,6 +178,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
],
|
|
|
+ activeDate:'',
|
|
|
dayStudyList: [],
|
|
|
listItem: {},
|
|
|
currentMonth: 0,
|
|
@@ -197,6 +198,21 @@ export default {
|
|
|
this.getList();
|
|
|
},
|
|
|
methods: {
|
|
|
+ itemClick(item,index) {
|
|
|
+ console.log(item)
|
|
|
+ this.activeDate = item.date;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 根据选中日期获取需要学习的课程
|
|
|
+ */
|
|
|
+ getStudyCourseByDay() {
|
|
|
+ let courseList = [];
|
|
|
+ this.showDayList.forEach(day => {
|
|
|
+ if(day.date == this.activeDate) {
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
planNow(){
|
|
|
uni.switchTab({
|
|
|
url: '/pages/course/index'
|
|
@@ -555,6 +571,7 @@ export default {
|
|
|
border-radius: 50%;
|
|
|
width: 29rpx;
|
|
|
height: 29rpx;
|
|
|
+ line-height: 25rpx;
|
|
|
border: 1px solid #ffcc00;
|
|
|
font-size: 18rpx;
|
|
|
color: #ffcc00;
|
|
@@ -599,26 +616,55 @@ export default {
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
.date_num_color0 {
|
|
|
+ display: inline-block;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
color: #32467b;
|
|
|
}
|
|
|
.date_num_color1 {
|
|
|
+ display: inline-block;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
color: #34c759;
|
|
|
}
|
|
|
.date_num_color2 {
|
|
|
+ display: inline-block;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
color: #ff3b30;
|
|
|
}
|
|
|
.date_num_color3 {
|
|
|
- color: #ffffff;
|
|
|
- background-color: #ffcc00;
|
|
|
+ color: #007AFF;
|
|
|
+ background-color: rgba(229,241,255,1);
|
|
|
border-radius: 50%;
|
|
|
- width: 40rpx;
|
|
|
- height: 40rpx;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.active_color{
|
|
|
+ color: #fff;
|
|
|
+ background-color: #007AFF;
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ text-align: center;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
.card_date {
|
|
|
width: 14%;
|
|
|
text-align: center;
|
|
|
color: #7f8caf;
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
.date_t1 {
|
|
|
font-size: 24rpx;
|