|
|
@@ -0,0 +1,447 @@
|
|
|
+<template>
|
|
|
+ <view style="padding: 30rpx;" >
|
|
|
+ <view class="list_box">
|
|
|
+ <view class="item" v-for="(item,index) in list" :key="index" >
|
|
|
+ <image :src="item.coverUrl" ></image>
|
|
|
+ <text >{{item.courseName}}</text>
|
|
|
+ <view class="del_icon">
|
|
|
+ <u-icon name="minus-circle-fill" color="#EB4D3D" size="40" @click="delItem(index)"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="item" style="vertical-align: top;">
|
|
|
+ <view class="item_add" @click="openSel">
|
|
|
+ <u-icon name="plus-circle-fill" color="#32467B" size="32"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="list_box form">
|
|
|
+ <u-form :model="form" ref="uForm">
|
|
|
+ <u-form-item label="课程类型" :label-width="auto"><u-input v-model="form.category" :disabled="true"/></u-form-item>
|
|
|
+ <u-form-item label="考试日期" prop="birth" :label-width="auto">
|
|
|
+ <picker mode="date" :value="form.date" @change="bindDateChange">
|
|
|
+ <view class="picker">
|
|
|
+ {{form.date}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="学习提醒" prop="birth" :label-width="auto">
|
|
|
+ <picker mode="time" :value="form.time" @change="bindTimeChange">
|
|
|
+ <view class="picker">
|
|
|
+ {{form.time}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="学习频率" :label-width="auto">
|
|
|
+ <view class="picker" @click="openWeek" >
|
|
|
+ {{form.week}}
|
|
|
+ </view>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="复习天数" :label-width="auto">
|
|
|
+ <picker @change="bindPickerChangeReview" :value="index_review" :range="array_review">
|
|
|
+ <view class="picker">
|
|
|
+ {{array_review[index_review]}}
|
|
|
+ </view>
|
|
|
+ </picker>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="起止日期" :label-width="auto">
|
|
|
+ <view class="picker" @click="openCalendar">
|
|
|
+ {{form.startDate}}~{{form.endDate}}
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ <u-calendar v-model="calendar_show" :mode="calendar" @change="change" :max-date="maxDate">
|
|
|
+ </u-calendar>
|
|
|
+ <!-- 弹框-->
|
|
|
+ <u-popup v-model="week_show" mode="bottom">
|
|
|
+ <view style="height: 400rpx;text-align: center">
|
|
|
+ <view style="padding-top: 100rpx;padding-left: 40rpx;text-align: center;">
|
|
|
+ <u-checkbox-group @change="checkboxGroupChange">
|
|
|
+ <u-checkbox
|
|
|
+ v-model="item.checked"
|
|
|
+ v-for="(item, index) in list3" :key="index"
|
|
|
+ :name="item.name"
|
|
|
+ >{{item.name}}</u-checkbox>
|
|
|
+ </u-checkbox-group>
|
|
|
+ <view class="title_l" @click="week_submit" style="margin: 50rpx auto;">确认</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ <u-popup v-model="show" mode="bottom">
|
|
|
+ <view class="popup_box" >
|
|
|
+ <view class="popup_title">
|
|
|
+ <u-row >
|
|
|
+ <u-col span="6">
|
|
|
+ <view class="title_r">我的课程</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="3" offset="3">
|
|
|
+ <view class="title_l" @click="submit">确认</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <view class="popup_list">
|
|
|
+ <view class="popup_item" v-for="(item,index) in list2" :key="index">
|
|
|
+ <view style="line-height:182rpx ;">
|
|
|
+ <u-checkbox :disabled="item.disabled"
|
|
|
+ @change="checkboxChange" shape="circle" active-color="#32467B"
|
|
|
+ v-model="item.checked" :key="index" :name="item.courseId"></u-checkbox>
|
|
|
+ </view>
|
|
|
+ <view >
|
|
|
+ <image :src="item.coverUrl" style="width: 278rpx;height: 134rpx;"></image>
|
|
|
+ </view>
|
|
|
+ <view style="margin: 30rpx;">
|
|
|
+ {{item.courseName}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ <button @click="resultForm" class="submit_btn">提交</button>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ week_show:false,
|
|
|
+ form:{
|
|
|
+ category:'二级建造师',
|
|
|
+ date:'2021-01-01',
|
|
|
+ time:'20:30',
|
|
|
+ startDate:'2021-05-07',
|
|
|
+ endDate:'2021-05-31',
|
|
|
+ week:'一'
|
|
|
+ },
|
|
|
+ calendar: 'range',
|
|
|
+ list:[
|
|
|
+ ],
|
|
|
+ list2:[
|
|
|
+ {url:'/static/banner.png',id:33,disabled:false,
|
|
|
+ checked:false},
|
|
|
+ {url:'/static/banner.png',id:34,disabled:false,checked:false},
|
|
|
+ {url:'/static/banner.png',id:35,disabled:false,checked:false}],
|
|
|
+ show:false,
|
|
|
+ calendar_show:false,
|
|
|
+ maxDate:'2023-01-01',
|
|
|
+ list3:[{
|
|
|
+ name: '一',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:1
|
|
|
+ },{
|
|
|
+ name: '二',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:2
|
|
|
+ },{
|
|
|
+ name: '三',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:3
|
|
|
+ },{
|
|
|
+ name: '四',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:4
|
|
|
+ },{
|
|
|
+ name: '五',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:5
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '六',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:6
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '日',
|
|
|
+ checked: false,
|
|
|
+ disabled: false,
|
|
|
+ id:0
|
|
|
+ }],
|
|
|
+ selWeek:'',
|
|
|
+ index_review: 4,
|
|
|
+ array_review: [1, 2, 3, 4, 5, 6, 7],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ this.form.startDate = this.$method.timestampToTime((new Date()).getTime()/1000)
|
|
|
+ this.form.endDate = this.$method.timestampToTime((new Date()).getTime()/1000 + 24*3600*10)
|
|
|
+ this.getMyCourse()
|
|
|
+ },
|
|
|
+ onShow(){
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ resultForm(){
|
|
|
+ if(this.list.length==0){
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '请选择课程',
|
|
|
+ showCancel: false
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let courseId = [];
|
|
|
+ for(let i=0;i<this.list.length;i++){
|
|
|
+ courseId.push(this.list[i].courseId)
|
|
|
+ }
|
|
|
+ let ss = this.form.week.split("、");
|
|
|
+ let weekArray = []
|
|
|
+ for(let i=0;i<ss.length;i++){
|
|
|
+ if(ss[i]=='日'){
|
|
|
+ weekArray.push(0)
|
|
|
+ }
|
|
|
+ if(ss[i]=='一'){
|
|
|
+ weekArray.push(1)
|
|
|
+ }
|
|
|
+ if(ss[i]=='二'){
|
|
|
+ weekArray.push(2)
|
|
|
+ }
|
|
|
+ if(ss[i]=='三'){
|
|
|
+ weekArray.push(3)
|
|
|
+ }
|
|
|
+ if(ss[i]=='四'){
|
|
|
+ weekArray.push(4)
|
|
|
+ }
|
|
|
+ if(ss[i]=='五'){
|
|
|
+ weekArray.push(5)
|
|
|
+ }
|
|
|
+ if(ss[i]=='六'){
|
|
|
+ weekArray.push(6)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let data = {
|
|
|
+ courseId:courseId.join(","),
|
|
|
+ reminderTime:this.form.time,
|
|
|
+ examDate:this.$method.TimeTotimestamp(this.form.date),
|
|
|
+ startTime:this.$method.TimeTotimestamp(this.form.startDate),
|
|
|
+ endTime:this.$method.TimeTotimestamp(this.form.endDate),
|
|
|
+ endTime:this.$method.TimeTotimestamp(this.form.endDate),
|
|
|
+ studyCount:weekArray.join(","),
|
|
|
+ studyDay:this.array_review[this.index_review],
|
|
|
+ status:1
|
|
|
+ }
|
|
|
+ console.log(data)
|
|
|
+ this.$api.planGenerate(data).then(result => {
|
|
|
+ if(result.data.code==200){
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '提交成功',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ console.log(result)
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ selItem(item){
|
|
|
+ console.log(34)
|
|
|
+ item.checked = !item.checked
|
|
|
+ },
|
|
|
+ getMyCourse(){
|
|
|
+ let data = {
|
|
|
+ typeId:0
|
|
|
+ }
|
|
|
+ let self = this
|
|
|
+ this.$api.getUserBuy(data).then(result => {
|
|
|
+ if(result.data.data.courseVoList.length>0){
|
|
|
+ for(let i=0;i<result.data.data.courseVoList.length;i++){
|
|
|
+ let item = result.data.data.courseVoList[i]
|
|
|
+ item.checked = false
|
|
|
+ item.disabled = false
|
|
|
+ item.coverUrl = self.$method.splitImgHost(item.coverUrl)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ self.list2 = result.data.data.courseVoList
|
|
|
+ console.log(self.list2)
|
|
|
+ });
|
|
|
+ },
|
|
|
+ bindPickerChangeReview(e){
|
|
|
+ this.index_review= e.detail.value
|
|
|
+ },
|
|
|
+ week_submit(){
|
|
|
+ if(this.selWeek==''){
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '至少选择一个',
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.form.week = this.selWeek
|
|
|
+ this.week_show = false
|
|
|
+ },
|
|
|
+ openWeek(){
|
|
|
+ this.week_show = true
|
|
|
+ this.selWeek = this.form.week
|
|
|
+ let that = this
|
|
|
+ this.list3.map(val => {
|
|
|
+ val.checked = false
|
|
|
+ if(that.form.week.indexOf(val.name) != -1){
|
|
|
+ val.checked = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ checkboxGroupChange(e){
|
|
|
+ this.selWeek = e.join("、")
|
|
|
+ },
|
|
|
+ openCalendar(){
|
|
|
+ this.calendar_show = true
|
|
|
+ },
|
|
|
+ change(e) {
|
|
|
+ console.log(e);
|
|
|
+ this.form.startDate = e.startDate
|
|
|
+ this.form.endDate = e.endDate
|
|
|
+ },
|
|
|
+ bindTimeChange(e){
|
|
|
+ this.form.time=e.detail.value
|
|
|
+ },
|
|
|
+ bindDateChange(e){
|
|
|
+ this.form.date=e.detail.value
|
|
|
+
|
|
|
+ },
|
|
|
+ submit(){
|
|
|
+ let that = this
|
|
|
+ this.list2.map(val => {
|
|
|
+ if(val.checked){
|
|
|
+ that.list.push(val);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.checkSameItem()
|
|
|
+ this.show = false
|
|
|
+ },
|
|
|
+ checkboxChange(e){
|
|
|
+ },
|
|
|
+ checkSameItem(){
|
|
|
+ this.list2.map(val => {
|
|
|
+ val.disabled = false
|
|
|
+ this.list.map(val1 => {
|
|
|
+ if(val.courseId == val1.courseId){
|
|
|
+ val.disabled = true
|
|
|
+ }
|
|
|
+ val.checked= false
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ delItem(index){
|
|
|
+ this.list.splice(index,1)
|
|
|
+ },
|
|
|
+ openSel(){
|
|
|
+ this.show = true
|
|
|
+ this.checkSameItem()
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ ::-webkit-scrollbar{
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ color: transparent;
|
|
|
+ }
|
|
|
+ .u-drawer-content-visible{
|
|
|
+ border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style scope>
|
|
|
+ .submit_btn{
|
|
|
+ background-color: #32467B !important;
|
|
|
+ border-color: #32467B !important;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size: 30rpx;
|
|
|
+ padding: 5rpx;
|
|
|
+ margin-top: 50rpx;
|
|
|
+ }
|
|
|
+ .picker{
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .form{
|
|
|
+ padding:0 16rpx !important;
|
|
|
+ margin-top: 30rpx;
|
|
|
+ }
|
|
|
+ input{
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .popup_item{
|
|
|
+ width: 100%;
|
|
|
+ height: 182rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
|
|
|
+ border-radius: 32rpx;
|
|
|
+ margin: 20rpx 0;
|
|
|
+ padding: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .popup_list{
|
|
|
+ height: 500rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ }
|
|
|
+ .title_l{
|
|
|
+ width: 88rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ background: #32467B;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 48rpx;
|
|
|
+ }
|
|
|
+ .title_r{
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2F4379;
|
|
|
+ }
|
|
|
+ .popup_title{
|
|
|
+ width: 100%;
|
|
|
+ margin: 40rpx;
|
|
|
+ }
|
|
|
+ .popup_box{
|
|
|
+ height: 600rpx;
|
|
|
+ }
|
|
|
+ .del_icon{
|
|
|
+ position: absolute;
|
|
|
+ right: -15rpx;
|
|
|
+ top: -15rpx;
|
|
|
+ }
|
|
|
+ .item_add{
|
|
|
+ background: #F9F9F9;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ width: 100%;
|
|
|
+ height:150rpx ;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 150rpx;
|
|
|
+ }
|
|
|
+ .item text{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #0C141F;
|
|
|
+ }
|
|
|
+ .item image{
|
|
|
+ border-radius: 32rpx;
|
|
|
+ width: 100%;
|
|
|
+ height:150rpx ;
|
|
|
+ }
|
|
|
+ .item{
|
|
|
+ width: 46%;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 1% 2%;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .list_box{
|
|
|
+ width: 100%;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0rpx 0rpx 1rpx 4rpx rgba(145, 156, 178, 0.1);
|
|
|
+ border-radius: 32rpx;
|
|
|
+ padding: 20rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+page {
|
|
|
+ background: #FFFFFF;
|
|
|
+ }
|
|
|
+</style>
|