9.30

pages/record/myClssList.vue

@@ -1,7 +1,33 @@
 <template>
 	<view class="box u-skeleton tdk-page">
 		<u-skeleton :loading="loading" :animation="true"></u-skeleton>
-		<view class="table-list" v-if="list.length>0">
+		<view style="display: flex;flex-direction: column;position: fixed;top: 0;left: 0;width: 100%;">
+			<view class="tabbar">
+				<!-- <u-dropdown>
+					<u-dropdown-item v-model="tabIndex"
+						:title="tabbar[tabIndex].label=='全部' ?'教学周' : tabbar[tabIndex].label" :options="tabbar"
+						@change="tabClick"></u-dropdown-item>
+				</u-dropdown> -->
+				<view class="prop-label" @click="show = true">
+					{{tabIndex==null ?'教学周' : zhouLists[tabIndex]}}
+				</view>
+				<u-icon name="close-circle-fill" size="30" @click="closeZhou" color="#ccc"
+					v-if="tabIndex!=null"></u-icon>
+				<u-picker  @confirm="confirms" mode="selector" v-model="show" :default-selector="[tabIndex==null ? 0 : tabIndex]"
+					:range="zhouLists"></u-picker>
+				<view class="top">
+					<view>
+						<text>日期：</text>
+						<u-picker v-model="startshow" mode="time" safe-area-inset-bottom="true" :show-time-tag="false"
+							@confirm="start_confirm"></u-picker>
+						<text style="margin-right: 5px;" @click="startshow = true">{{starttime}}</text>
+						<u-icon name="close-circle-fill" size="30" @click="closeTime" color="#ccc"
+							v-if="starttime!='请选择'"></u-icon>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="table-list" v-if="list.length>0" style="padding-top: 46px;">
 			<view class="table-item complete box-mead" v-for="(item,index) in list" :key="index" @click="details(item.id)">
 				<!-- <view class="item-border">
 				</view> -->
@@ -27,219 +53,6 @@
 				</view>
 			</view>
 			<u-loadmore :status="statuss " :load-text="loadText" icon="true" />
-			<!-- 停调可弹框 -->
-			<u-popup v-model="showFalse" mode="center" border-radius="24" width="90%" z-index="10076" :mask-close-able="false">
-				<view class="prop-content">
-					<!-- <image src="../../static/image/index/icon_6.png" mode="" class="prop-image"></image> -->
-					<view class="prop-title">
-						{{ detail.lesson ? detail.lesson.name : "--" }}
-					</view>
-					<view style="width: 100%">
-						<!-- <scroll-view scroll-y="true" style="height: 200px;"> -->
-						<view class="content-item">
-							<view class="prop-label"> 停调课类型： </view>
-							<view class="prop-text">
-								<u-radio-group v-model="type" @change="radioGroupChange">
-									<u-radio @change="radioChange" v-for="(item, index) in list_sel" :key="index"
-										:name="item.id">
-										{{ item.name }}
-									</u-radio>
-								</u-radio-group>
-							</view>
-						</view>
-			
-						<view class="content-item" v-if="type == 2">
-							<view class="prop-label"> 调课时间： </view>
-							<view class="prop-text">
-								<view class="change-time" @click="chaneTime"> 选择时间 </view>
-							</view>
-						</view>
-						<view class="content-item" v-if="migrate_data.length > 0 && type == 2">
-							<view class="prop-text">
-								<view class="table-title">
-									<view class="title-item"> 实验室 </view>
-									<view class="title-item"> 日期 </view>
-									<view class="title-item"> 节次 </view>
-								</view>
-								<view class="table-title" v-for="(item, index) in migrate_data" :key="index">
-									<view class="title-item">
-										{{ item.room_name }}
-									</view>
-									<view class="title-item">
-										{{ item.day }} · 第{{ item.week }}周 · 星期{{
-			                $transformWeek(item.week_index)
-			              }}
-									</view>
-									<view class="title-item">
-										{{ getTime(item.time_id) }}
-									</view>
-								</view>
-							</view>
-						</view>
-						<view class="content-item">
-							<view class="prop-label"> 停调课原因： </view>
-						</view>
-						<view class="content-item">
-							<view class="prop-text">
-								<textarea v-model="body" rows="2" placeholder="请输入停调课原因"></textarea>
-								<!-- <u-input v-model="body" type="textarea" border height="150" auto-height /> -->
-							</view>
-						</view>
-					</view>
-					<!-- </scroll-view> -->
-					<view class="pop-btn">
-						<view @click="cancelHandle" style="
-			          opacity: 1;
-			          background: #f5f5f5;
-			          color: #333333;
-			          margin-right: 10px;
-			        ">
-							<text>取消</text>
-						</view>
-						<view style="background: #3665ff; color: #fff" @click="sureHandle">
-							<text>确定</text>
-						</view>
-					</view>
-				</view>
-			</u-popup>
-			<!-- 选择时间弹框 -->
-			<view class="change-time-prop" v-if="simpleShow" @touchmove.stop.prevent="disabledScroll">
-					<view style="font-size: #333333; font-weight: 550; font-size: 17px;padding-left: 10px;">
-						第{{ simple_week }}周
-					</view>
-				<view class="table_1">
-					<u-tabs :list="roomList" :current="simple_currentRoom" @change="simpleChangeRoom"></u-tabs>
-					<view class="table-border">
-						<view class="jie">
-							<view class="jie-item" style="height: 55px; line-height: 20px">
-							</view>
-							<view class="jie-item" v-for="(item, index) in simple_left" :key="index">
-								{{ item.name }}
-							</view>
-						</view>
-						<view class="day">
-							<view v-for="(item, index) in simple_weekList" :key="index" class="day-item"
-								:class="[checkOld(item.day) ? 'day-item-1' : '']">
-								<view class="time" :class="checkToday(item.day) ? 'today' : ''"
-									style="height: 55px; line-height: 20px">
-									<view style="padding-top: 8px">{{ item.week }}</view>
-									<view>{{ item.day }}</view>
-								</view>
-			
-								<view v-for="(course, index1) in simple_calendar[index].lists" :key="index1"
-									class="jie-item">
-									<!-- 时间段已过期 -->
-									<view v-if="checkOld(item.day)"></view>
-									<view v-else class="course" @click="selectTime(simple_calendar[index], index1)">
-										<view v-if="!course.is_lesson" class="course kong" :class="
-			                  checkIselect(
-			                    simple_calendar[index].week_index,
-			                    simple_jieList[index1].id
-			                  )
-			                    ? 'xuan'
-			                    : ''
-			                ">
-											<view>{{
-			                  checkIselect(
-			                    simple_calendar[index].week_index,
-			                    simple_jieList[index1].id
-			                  )
-			                    ? "已选"
-			                    : "可选"
-			                }}</view>
-										</view>
-										<view v-if="
-			                  current_course.week == simple_week &&
-			                  current_course.room_id == simple_room_id &&
-			                  simple_calendar[index].week_index ==
-			                    current_course.week_index &&
-			                  current_course.time_id == simple_jieList[index1].id
-			                " class="course current-course">
-											当前课程
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-					</view>
-					<view class="simple-week">
-						<view :class="simple_week == 1 ? 'disable-buttom' : 'change-buttom'" @click="simpleLastWeek">
-							上一周
-						</view>
-			
-						<view :class="simple_week == maxWeek ? 'disable-buttom' : 'change-buttom'" @click="simpleNextWeek">
-							下一周
-						</view>
-					</view>
-					<view class="sure-buttom">
-						<view class="cancel" @click="cancelSelectTime"> 取消 </view>
-						<view class="sure" @click="sureSelectTime"> 确定 </view>
-					</view>
-				</view>
-			</view>
-			<!-- 补课弹框 -->
-			<u-popup v-model="makeLesson" mode="center" border-radius="24" width="90%" z-index="10076" :mask-close-able="false">
-				<view class="prop-content">
-					<!-- <image src="../../static/image/index/icon_6.png" mode="" class="prop-image"></image> -->
-					<view class="prop-title">
-						{{ detail.lesson ? detail.lesson.name : "--" }}
-					</view>
-					<view style="width: 100%">
-						<!-- <scroll-view scroll-y="true" style="height: 200px;"> -->
-						<view class="content-item" style="align-items: center;">
-							<view class="prop-label"> 补课时间： </view>
-							<view class="prop-text">
-								<view class="change-time" @click="chaneTime"> 选择时间 </view>
-							</view>
-						</view>
-						<view class="content-item" v-if="migrate_data.length > 0">
-							<view class="prop-text">
-								<view class="table-title">
-									<view class="title-item"> 实验室 </view>
-									<view class="title-item"> 日期 </view>
-									<view class="title-item"> 节次 </view>
-								</view>
-								<view class="table-title" v-for="(item, index) in migrate_data" :key="index">
-									<view class="title-item">
-										{{ item.room_name }}
-									</view>
-									<view class="title-item">
-										{{ item.day }} · 第{{ item.week }}周 · 星期{{
-			                $transformWeek(item.week_index)
-			              }}
-									</view>
-									<view class="title-item">
-										{{ getTime(item.time_id) }}
-									</view>
-								</view>
-							</view>
-						</view>
-						<view class="content-item">
-							<view class="prop-label"> 停调课原因： </view>
-						</view>
-						<view class="content-item">
-							<view class="prop-text">
-								<textarea v-model="body" rows="2" placeholder="请输入停调课原因"></textarea>
-								<!-- <u-input v-model="body" type="textarea" border height="150" auto-height /> -->
-							</view>
-						</view>
-					</view>
-					<!-- </scroll-view> -->
-					<view class="pop-btn">
-						<view @click="makeLesson = false , totalCourse = []" style="
-			          opacity: 1;
-			          background: #f5f5f5;
-			          color: #333333;
-			          margin-right: 10px;
-			        ">
-							<text>取消</text>
-						</view>
-						<view style="background: #3665ff; color: #fff" @click="make_les">
-							<text>确定</text>
-						</view>
-					</view>
-				</view>
-			</u-popup>
 		</view>
 		<view class="empty" v-if="list.length==0" style="padding-top: 110px;">
 			<u-empty text="暂无记录~" mode="favor"></u-empty>
@@ -289,7 +102,12 @@
 				simple_left:[],
 				makeLesson:false,
 				body:'',
-				maxWeek:0
+				maxWeek:0,
+				zhouLists:[],
+				tabIndex: null,
+				startshow: false,
+				starttime: '请选择',
+				show:false
 			}
 		},
 		onLoad() {
@@ -297,11 +115,18 @@
 			// 	console.log(res)
 			// 	this.list = res.data.list;
 			// 	this.loading = false;
-			// })
+			// }) 
 			this.lists();
 			this.maxWeek = Number(this.vuex_term_weeks);
-			this.getRoomList();
 			console.log(this.roomList, "---");
+			console.log(this.maxWeek)
+			var arr = []
+			for(var i=0;i<this.maxWeek;i++){
+				var text = '第'+Number(i+1)+'周'
+				arr = arr.concat(text)
+			}
+			this.zhouLists = arr;
+			console.log(arr)
 			this.user_id = this.vuex_user.id;
 		},
 		onPullDownRefresh() {
@@ -330,17 +155,32 @@
 				// 	url:'/pages/record/tutorialDetail?id='+id
 				// })
 			},
-			//获取实验室列表
-			async getRoomList() {
-				await this.$u
-					.get("/school/room-select-options", {
-						status: 1,
-					})
-					.then((res) => {
-						this.roomList = res.data;
-						this.room_id = res.data[this.currentRoom].id;
-						this.simple_room_id = res.data[this.currentRoom].id;
-					});
+			tabClick(index) {
+				this.tabIndex = index;
+				this.show = false;
+				this.lists()
+			},
+			//原因选择确定
+			
+			start_confirm(e) {
+				//开始时间确认事件
+				console.log(e, 'chufale')
+				this.starttime = e.year + '-' + e.month + '-' + e.day
+				this.lists()
+			},
+			closeZhou(){
+				//关闭选择周
+				this.tabIndex = null
+				this.lists()
+			},
+			closeTime() {
+				this.starttime = '请选择'
+				this.lists()
+			},
+			confirms(e) {
+				console.log(e) 
+				this.tabIndex = Number(e[0]);
+				this.lists()
 			},
 			//获取时间选择列表
 			getChangeTime() {
@@ -459,7 +299,11 @@
 			},
 			lists() {
 				//数据列表 请求方法
-				this.$u.get('/school/schedule').then(res => {
+				var data = {
+					week:this.tabIndex!=null ? Number(this.tabIndex+1) : '',
+					day:this.starttime!='请选择' ? this.starttime : ''
+				}
+				this.$u.get('/school/schedule',data).then(res => {
 					console.log(res)
 					this.meta = res.data.meta.pagination;
 					if (res.data.list.length < 10) {
@@ -645,10 +489,31 @@
 <style lang="scss">
 	page{
 		background: #F9F9F9;
-	}
+	}
 	.tdk-page{
 		.box{
 			background: #F9F9F9;
+		}
+		.tabbar {
+			width: 100%;
+			height: 46px;
+			background: #FFFFFF;
+			display: flex;
+			align-items: center;
+			position: relative;
+			.prop-label{
+				margin-left: 10px;
+				margin-right: 5px;
+			}
+		}
+		.top {
+			box-sizing: border-box;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			position: absolute;
+			right: 10px;
+			z-index: 11;
 		}
 		.table-item {
 			padding: 15px 12px;
@@ -719,297 +584,6 @@
 				}
 			}
 		}
-		.prop-content {
-			padding: 15px;
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-		
-			.prop-title {
-				text-align: center;
-				font-size: 18px;
-				margin-bottom: 5px;
-				font-weight: bold;
-				color: #333333;
-				margin-top: 30px;
-			}
-		
-			.content-item {
-				display: flex;
-				color: #333333;
-				margin-top: 8px;
-				width: 100%;
-		
-				.prop-label {
-					flex: 0 0 90px;
-					font-size: 15px;
-					font-weight: 550;
-				}
-		
-				.prop-text {
-					flex: 1;
-		
-					.change-time {
-						display: inline-block;
-						padding: 0 8px;
-						line-height: 30px;
-						height: 30px;
-						font-size: 12px;
-						color: #ffffff;
-						background-color: #3665ff;
-						border-radius: 5px;
-					}
-		
-					.table-title {
-						display: flex;
-						border-left: solid 1px#b3b3b3;
-		
-						.title-item {
-							flex: 1;
-							padding: 5px 0;
-							text-align: center;
-							border-right: solid 1px #b3b3b3;
-							border-bottom: solid 1px#b3b3b3;
-						}
-					}
-		
-					.table-title:first-child {
-						background-color: #e3e3e3;
-						border-top: solid 1px #b3b3b3;
-					}
-		
-					textarea {
-						border: solid 1px #b3b3b3;
-						width: auto;
-						border-radius: 8px;
-						padding: 8px;
-						height: 100px;
-					}
-				}
-		
-				.prop-content {
-					font-size: 15px;
-				}
-			}
-		
-			.prop-srue {
-				width: 279px;
-				height: 44px;
-				background: #3665ff;
-				text-align: center;
-				margin-top: 30px;
-				line-height: 44px;
-				color: #ffffff;
-				border-radius: 22px 22px 22px 22px;
-				font-size: 16px;
-				margin-bottom: 5px;
-			}
-		
-			.pop-btn {
-				margin-top: 40px;
-				width: 84%;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-		
-				view {
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					width: 130px;
-					height: 44px;
-					font-size: 16px;
-					font-weight: bold;
-					border-radius: 22px 22px 22px 22px;
-					opacity: 1;
-				}
-			}
-		}
-		//时间选择弹框
-		.change-time-prop {
-			// height: 100%;
-			height: 100vh;
-			width: 100%;
-			background-color: #fff;
-			position: fixed;
-			top: 0;
-			left: 0;
-			z-index: 99999999999;
-			overflow-y: auto;
-		
-			.table_1 {
-				.simple-week {
-					text-align: right;
-					padding: 10px;
-					background-color: #fff;
-					border-bottom: solid 1px #dddcdc;
-		
-					.change-buttom,
-					.disable-buttom {
-						display: inline-block;
-						padding: 8px 30px;
-						background-color: #3665ff;
-						color: #ffffff;
-						// margin-left: 10px;
-						border-radius: 18px;
-					}
-		
-					.week-text {
-						display: inline-block;
-						font-size: 15px;
-						margin: 0 10px;
-						font-weight: bold;
-					}
-		
-					.disable-buttom {
-						background-color: #dddcdc;
-						color: #7c7b7b;
-					}
-				}
-		
-				.sure-buttom {
-					text-align: center;
-					margin-top: 20px;
-		
-					.cancel {
-						display: inline-block;
-		
-						width: 150px;
-						height: 45px;
-						line-height: 45px;
-						border: solid 1px #3665ff;
-						color: #3665ff;
-						border-radius: 22px;
-					}
-		
-					.sure {
-						display: inline-block;
-						width: 150px;
-						height: 45px;
-						line-height: 45px;
-						background-color: #3665ff;
-						color: #ffffff;
-						margin-left: 10px;
-						border-radius: 22px;
-					}
-				}
-		
-				.table-border {
-					display: flex;
-		
-					.week {
-						display: flex;
-						padding: 8px;
-						color: #333333;
-						font-size: 12px;
-						border-bottom: solid 1px #f2f2f2;
-						border-top: solid 1px #f2f2f2;
-						background-color: #fbfcff;
-		
-						.week-item {
-							flex: 1;
-							text-align: center;
-		
-							.week-day {
-								margin-top: 3px;
-							}
-						}
-					}
-		
-					.jie {
-						text-align: center;
-						background-color: #fbfcff;
-					}
-		
-					.jie-item:first-child {
-						background-color: #fbfcff;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-					}
-		
-					.jie-item {
-						flex: 1;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						border: 1px dashed #f2f2f2;
-						border-right: none;
-						border-top: none;
-						height: 50px;
-						border-left: none;
-						text-align: center;
-					}
-		
-					.kong {
-						text-align: center;
-						// background-color: #0077ff;
-						color: #0077ff;
-						cursor: pointer;
-						// border-bottom: solid 1px #fff;
-					}
-		
-					.course {
-						flex: 1;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-						height: 50px;
-						border-left: none;
-						text-align: center;
-						width: 100%;
-					}
-		
-					.current-course {
-						text-align: center;
-						background-color: #0077ff;
-						color: #fff;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-					}
-		
-					.xuan {
-						text-align: center;
-						background-color: #00b315;
-						color: #fff;
-						display: flex;
-						align-items: center;
-						justify-content: center;
-					}
-		
-					.jie-item:last-child {
-						border-bottom: none;
-					}
-		
-					.day {
-						flex: 1;
-						display: flex;
-						text-align: center;
-		
-						.day-item {
-							flex: 1;
-		
-							.time {
-								border-bottom: 1px dashed #f2f2f2;
-								background-color: #fbfcff;
-							}
-		
-							.today {
-								color: #df4d76;
-							}
-		
-							background-color: #fff;
-							border: 1px dashed #f2f2f2;
-						}
-		
-						.day-item-1 {
-							background-color: #cdced0;
-						}
-					}
-				}
-			}
-		}
 	}
 	
 </style>