|
|
@@ -14,23 +14,66 @@
|
|
|
</view>
|
|
|
<view class="btn">立即查看</view>
|
|
|
</view>
|
|
|
- <view class="date-list">
|
|
|
- <view class="title">距离最近一次考试还剩 36 天</view>
|
|
|
- <view class="list">
|
|
|
- <view class="item" v-for="(item,index) in 7" :key="index">
|
|
|
- <view class="top">{{text[index]}}</view>
|
|
|
- <view class="bottom" :class="{red:item==1,green:item==2,blue:item==3}">
|
|
|
- {{item}}
|
|
|
-
|
|
|
- <view class="note" v-if="item==3">3</view>
|
|
|
- <view class="point" v-if="item==4"></view>
|
|
|
+ <view>
|
|
|
+ <!-- 日历-->
|
|
|
+ <view class="calendar_card">
|
|
|
+ <view class="card_box">
|
|
|
+ <u-row gutter="16">
|
|
|
+ <u-col span="11" v-if="false">
|
|
|
+ <view>
|
|
|
+ <text class="t1">距离</text>
|
|
|
+ <text class="t2">二级建造师</text>
|
|
|
+ <text class="t1">考试</text>
|
|
|
+ <text class="t3">365</text>
|
|
|
+ <text class="t1">天,继续加油哦！</text>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ <u-col offset="11" span="1">
|
|
|
+ <view @click="jumpPlan"><image src="/static/more.png" class="img_more"></image></view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <u-line color="#EEEEEE" />
|
|
|
+ <view style="width: 100%;display: flex;justify-content:center;margin-top: 20rpx;">
|
|
|
+ <view v-for="(item, index) in date" :key="index" class="card_date">{{ item }}</view>
|
|
|
+ </view>
|
|
|
+ <view style="width: 100%;display: flex;justify-content:center;margin-top: 40rpx;">
|
|
|
+ <view v-for="(item, index) in date_num" :key="index" class="date_num">
|
|
|
+ <view v-if="item.color == 0" class="date_num_color0" 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">
|
|
|
+ {{ 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">
|
|
|
+ {{ 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">
|
|
|
+ {{ 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>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <view class="btns">
|
|
|
- <image class="left" src="/static/left.png"></image>
|
|
|
- <view class="center">二级建造师市政公用工程</view>
|
|
|
- <image class="right" src="/static/right.png"></image>
|
|
|
+ <view style="width: 100%;margin-top: 20rpx;" v-if="workList.length > 0">
|
|
|
+ <u-row gutter="16">
|
|
|
+ <u-col span="2" text-align="center">
|
|
|
+ <view><image src="/static/left.png" class="arr-icon" @click="preveItem"></image></view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8" text-align="center">
|
|
|
+ <view class="course_title" @click="jumpCourseDetail()">{{ workList[0].goodsName }}</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="2" text-align="center">
|
|
|
+ <view><image src="/static/right.png" class="arr-icon" @click="nextItem"></image></view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<u-tabs class="tabs" :current="tabCurrent" @change="tab" :list="list1" :activeStyle="{fontSize:'36rpx'}" :inactiveStyle="{color:'#EAEEF1',fontSize:'30rpx'}" sticky></u-tabs>
|
|
|
@@ -69,7 +112,8 @@ export default {
|
|
|
'https://cdn.uviewui.com/uview/swiper/swiper1.png',
|
|
|
],
|
|
|
tabCurrent:0,
|
|
|
- text:['日','一','二','三','四','五','六'],
|
|
|
+ date:['日','一','二','三','四','五','六'],
|
|
|
+ date_num: [],
|
|
|
current:0,
|
|
|
indicatorDots: true,
|
|
|
autoplay: true,
|
|
|
@@ -79,11 +123,16 @@ export default {
|
|
|
name: '推荐课程',
|
|
|
}, {
|
|
|
name: '推荐题库',
|
|
|
- }]
|
|
|
+ }],
|
|
|
+ goodsIndex: 0,
|
|
|
+ workList: [],
|
|
|
+ workTextList: []
|
|
|
};
|
|
|
},
|
|
|
onPullDownRefresh() {},
|
|
|
- onLoad(option) {},
|
|
|
+ onLoad(option) {
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
onShow() {
|
|
|
/* if(this.current === 2 && this.$method.isLogin()){
|
|
|
this.$refs.refMy.init();
|
|
|
@@ -97,6 +146,92 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
+ jumpPlan() {
|
|
|
+ if (!this.$method.isLogin()) {
|
|
|
+ this.$navTo.togo('/pages/login/login');
|
|
|
+ } else {
|
|
|
+ this.$navTo.togo('/pages2/plan/index', {});
|
|
|
+ }
|
|
|
+ },
|
|
|
+ init() {
|
|
|
+ if (!this.$method.isLogin()) {
|
|
|
+ //未登录
|
|
|
+ this.date_num = [];
|
|
|
+ this.workList = [];
|
|
|
+ this.initDay();
|
|
|
+ } else {
|
|
|
+ this.date_num = [];
|
|
|
+ this.workList = [];
|
|
|
+ this.userPlanSeven();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getMonDate() {
|
|
|
+ var d = new Date(),
|
|
|
+ day = d.getDay(),
|
|
|
+ date = d.getDate();
|
|
|
+ if (day == 0) return d;
|
|
|
+ else d.setDate(date - day);
|
|
|
+ return d;
|
|
|
+ },
|
|
|
+ initDay() {
|
|
|
+ // d是当前星期一的日期对象
|
|
|
+ var d = this.getMonDate();
|
|
|
+ var arr = [];
|
|
|
+ let date = new Date();
|
|
|
+ let num = date.getDate();
|
|
|
+ for (var i = 0; i < 7; i++) {
|
|
|
+ let item = { date: d.getDate() };
|
|
|
+ item.color = 0;
|
|
|
+ if (d.getDate() == num) {
|
|
|
+ item.color = 3;
|
|
|
+ }
|
|
|
+ this.date_num.push(item);
|
|
|
+ d.setDate(d.getDate() + 1);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ userPlanSeven() {
|
|
|
+ let self = this;
|
|
|
+ this.$api.userPlanSeven().then(result => {
|
|
|
+ if (result.data.data.length>0) {
|
|
|
+
|
|
|
+ self.workList = result.data.data[0].goodsVos;
|
|
|
+ if (self.workList != null && self.workList.length > 0) {
|
|
|
+ self.courseItem = self.workList[self.goodsIndex];
|
|
|
+ }
|
|
|
+ console.log(self.workList)
|
|
|
+ let date = new Date();
|
|
|
+ let num = date.getDate();
|
|
|
+ let month = date.getMonth() + 1;
|
|
|
+ let list = [];
|
|
|
+ for (let i = 0; i < result.data.data[0].calendarStudyVo.length; i++) {
|
|
|
+ let item = result.data.data[0].calendarStudyVo[i];
|
|
|
+ if (item.month == month) {
|
|
|
+ list = item.dayStudyList;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (let i = 0; i < list.length; i++) {
|
|
|
+ let item = list[i];
|
|
|
+ item.color = 0;
|
|
|
+ if (item.date == num) {
|
|
|
+ item.color = 3;
|
|
|
+ }
|
|
|
+ if (item.perform == 1) {
|
|
|
+ item.color = 1;
|
|
|
+ }
|
|
|
+ if (item.perform == 2) {
|
|
|
+ item.color = 2;
|
|
|
+ }
|
|
|
+ item.note = item.studyCourseKnob;
|
|
|
+ if (item.note > 0) {
|
|
|
+ item.dot = true;
|
|
|
+ }
|
|
|
+ self.date_num.push(item);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ self.initDay();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
tab(e) {
|
|
|
this.tabCurrent = e;
|
|
|
},
|
|
|
@@ -372,4 +507,175 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.date_dot {
|
|
|
+ width: 6rpx;
|
|
|
+ height: 6rpx;
|
|
|
+ background: #ffcc00;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+.date_note {
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 29rpx;
|
|
|
+ height: 29rpx;
|
|
|
+ border: 1px solid #ffcc00;
|
|
|
+ font-size: 18rpx;
|
|
|
+ color: #ffcc00;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ position: absolute;
|
|
|
+ top: -19rpx;
|
|
|
+ right: 9rpx;
|
|
|
+}
|
|
|
+.circle_num {
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 29rpx;
|
|
|
+ height: 29rpx;
|
|
|
+ border: 1px solid #ffcc00;
|
|
|
+ font-size: 18rpx;
|
|
|
+ color: #ffcc00;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 5rpx;
|
|
|
+}
|
|
|
+.date_num {
|
|
|
+ width: 14%;
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ margin-top: 20rpx;
|
|
|
+}
|
|
|
+.course_title {
|
|
|
+ color: #2f4379;
|
|
|
+ box-shadow: 0rpx 0rpx 9rpx 1rpx rgba(47, 67, 121, 0.1);
|
|
|
+ border-radius: 28rpx;
|
|
|
+ width: 100%;
|
|
|
+ height: 48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow:ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.arr-icon {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+}
|
|
|
+.date_num_color0 {
|
|
|
+ color: #32467b;
|
|
|
+}
|
|
|
+.date_num_color1 {
|
|
|
+ color: #34c759;
|
|
|
+}
|
|
|
+.date_num_color2 {
|
|
|
+ color: #ff3b30;
|
|
|
+}
|
|
|
+.date_num_color3 {
|
|
|
+ color: #ffffff;
|
|
|
+ background-color: #ffcc00;
|
|
|
+ border-radius: 50%;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.card_date {
|
|
|
+ width: 14%;
|
|
|
+ text-align: center;
|
|
|
+ color: #7f8caf;
|
|
|
+}
|
|
|
+page {
|
|
|
+ background: #ffffff;
|
|
|
+ font-size: 28rpx;
|
|
|
+}
|
|
|
+.calendar_card {
|
|
|
+ width: 100%;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(47, 67, 121, 0.1);
|
|
|
+ border-radius: 22rpx;
|
|
|
+ margin-top: 25rpx;
|
|
|
+ padding-bottom: 15rpx;
|
|
|
+}
|
|
|
+.calendar_card .card_box {
|
|
|
+ height: 60rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ margin-left: 40rpx;
|
|
|
+}
|
|
|
+.calendar_card .t1 {
|
|
|
+ color: #7f8caf;
|
|
|
+ font-size: 24rpx;
|
|
|
+}
|
|
|
+.calendar_card .t2 {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #32467b;
|
|
|
+ margin: 0 10rpx;
|
|
|
+}
|
|
|
+.calendar_card .t3 {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #32467b;
|
|
|
+ text-shadow: 0rpx 3rpx 3rpx rgba(0, 0, 0, 0.2);
|
|
|
+ margin: 0 10rpx;
|
|
|
+}
|
|
|
+.img_more {
|
|
|
+ width: 26rpx;
|
|
|
+ height: 26rpx;
|
|
|
+}
|
|
|
+.flex-d {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.contentZ {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+ padding-left: 35rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+}
|
|
|
+.contentZ::-webkit-scrollbar {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+.fots {
|
|
|
+ height: 100rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ border-top: 1rpx solid #eee;
|
|
|
+}
|
|
|
+.leftBtns {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #32467b;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+.right_Btns {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #fff;
|
|
|
+ background-color: #32467b;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0rpx 23rpx;
|
|
|
+ box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
|
|
|
+}
|
|
|
+.lzs {
|
|
|
+ width: 31%;
|
|
|
+ margin: 0rpx 1%;
|
|
|
+ max-width: 31%;
|
|
|
+}
|
|
|
+.tylsz{
|
|
|
+ margin-top: 23rpx;
|
|
|
+ color: #666;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+}
|
|
|
+.tylsz:first-child{
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.activeStys{
|
|
|
+ font-weight: bold;
|
|
|
+ color: #32467B;
|
|
|
+}
|
|
|
</style>
|
