driver-manage/pages/teacher/index.vue

<template>

	<view class="content">
		<!-- 		@click="show = true" -->
		<view class="top-box">
			<view style="display: flex; align-items: center;" @click="gosetUp()">
				<view class="touxiang">
					<!-- <image :src="imageUrl+schoolInfo.photo" mode=""></image> -->
					<image :src="imageUrl+dataInfo.avatar" mode=""></image>
				</view>
				<view class="">{{userInfo.nickName}}</view>
			</view>

			<view @click="viewCode">点击二维码</view>

		</view>
		<view class="three-box" v-if="sjshow ">
			<view class="s-box">
				<view class="b-size">{{dataInfo.idRecordNumber || 0}}</view>
				<view class="s-size">预约人数</view>
			</view>
			<view class="s-box">
				<view class="b-size">{{dataInfo.stuNumber || 0}}</view>
				<view class="s-size">学员人数</view>
			</view>
			<view class="s-box">
				<view class="b-size">{{dataInfo.isPayNumber || 0}}</view>
				<view class="s-size">账单数</view>
			</view>
			<view class="s-box">
				<view class="b-size">{{deduct || 0}}</view>
				<view class="s-size">已结算</view>
			</view>
			<view class="s-box">
				<view class="b-size">{{deducts|| 0}}</view>
				<view class="s-size">未结算</view>
			</view>
		</view>
		<!-- 		<view class="jg-box">
			<view class="title-t">订单数据</view>
			<view class="three-box" style="padding: 10px 0px;">
				<view class="s-box">
					<view class="b-size" style="color: #000;">{{dataInfo.idRecordNumber}}</view>
					<view class="s-size" style="color: #999999;">已报名</view>
				</view>
				<view class="s-box">
					<view class="b-size" style="color: #000;">{{dataInfo.isPayNumber}}</view>
					<view class="s-size" style="color: #999999;">已付款</view>
				</view>
				<view class="s-box">
					<view class="b-size" style="color: #000;">{{dataInfo.isSignNumber}}</view>
					<view class="s-size" style="color: #999999;">已面签</view>
				</view>
			</view>
		</view> -->
		<view class="jg-box">
			<view class="title-t">功能板块</view>
			<view class="three-box" style="padding: 10px 0px;">
				<view class="si-box" @click="golist(1)">
					<image src="../../static/imgs/jg1.png" mode=""></image>
					<view class="">预约记录</view>
				</view>
				<view class="si-box" @click="gocadetManage()">
					<image src="../../static/imgs/jg2.png" mode=""></image>
					<view class="">学员管理</view>
				</view>
				<view class="si-box" @click="goOrder()">
					<image src="../../static/imgs/jg3.png" mode=""></image>
					<view class="">收益管理</view>
				</view>
				<!-- <view class="si-box" @click="">
					<image src="../../static/imgs/jg4.png" mode=""></image>
					<view class="">个人信息</view>
				</view> -->
				<view class="si-box" @click="getshow()">
					<image src="../../static/imgs/jg4.png" mode=""></image>
					<view class="">数据统计</view>
				</view>
			</view>
		</view>
		<view class="jg-box" style="display: flex;align-items: center; justify-content: space-between; "
			@click="goactive()">
			<view class="title-t">工作日志</view>
			<view class="">
				去填写
			</view>
		</view>
		<view class="jg-box" style="display: flex;align-items: center; justify-content: space-between; "
			@click="gollsit()">
			<view class="title-t">公告通知</view>
			<view class="">
				去查看
			</view>
		</view>
		<view class="box-bo-lv" @click="golist(2)">
			<view class="">预约记录</view>
			<view class="d-s">
				<view class="">更多</view>
				<u-icon name="arrow-right" color="#999999" size="12"></u-icon>
			</view>
		</view>
		<view class="con">
			<u-empty mode="list" v-if="courseList.length == 0">
			</u-empty>
			<view class="f-box" v-for="(item,index) in courseList" :key="index">
				<view class="f-top">{{item.createTime}}</view>
				<view class="f_title">
					<!-- {{item.driveSchoolPay.driveSchoolCourse.automatic}} -->
				</view>
				<view class="wrap-box">
					<!-- <view class="icon-lv">{{item.driveSchoolPay.driveSchoolCourse.license}}</view>
					<view class="icon-huang">{{item.driveSchoolPay.driveSchoolCourse.name}}</view> -->
				</view>
				<view class="f-ds">
					<view class="hui-">预约人：</view>
					<view class="hei-">{{item.userName}}</view>
				</view>
				<view class="f-ds">
					<view class="hui-">所属教练：</view>
					<view class="hei-">{{item.coachName}}</view>
				</view>
				<view class="f-ds">
					<view class="hui-">手机号：</view>
					<view class="hei-">{{item.phone}}</view>
				</view>
			</view>
		</view>

		<u-popup :show="show" :round="10" mode="bottom" @close="close" @open="open">
			<view class="popup-bottom">
				<view class="popup-top">
					<view class="p-l">取消</view>
					<view class="p-t">经营状态</view>
					<view class="p-r">保存</view>
				</view>
				<view class="p-hang">
					<view class="">经营状态</view>
					<view class="p-ds">
						<view class=""> 08:00</view>
						<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
					</view>
				</view>
				<view class="p-hang" @click="showtime1 = true">
					<view class="">营业时间</view>
					<view class="p-ds">
						<view class=""> 08:00</view>
						<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
					</view>
				</view>
				<view class="p-hang">
					<view class="">结束时间</view>
					<view class="p-ds">
						<view class=""> 08:00</view>
						<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
					</view>
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import request from '../../utils/request'

	export default {
		data() {
			return {
				imageUrl: this.$imagesUrl,
				value1: ',',
				showtime1: false,
				showtime: false,
				show: false,
				schoolInfo: {},
				dataInfo: {},
				courseList: [],
				userInfo: {},
				deduct: null,
				deducts: null,
				sjshow: false
			}
		},

		onPullDownRefresh() {
			console.log("刷新");
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			// this.show = true
			setTimeout(() => {
				console.log("加载执行");
			}, 2000)
		},
		onLoad() {
			this.getUserInfo()
			this.getDataInfo()
			this.findCourseList()
			this.getBalanceByCoachId()
		},
		methods: {
			getshow() {
				this.sjshow = !this.sjshow
			},
			async getBalanceByCoachId() {
				let res = await request({
					url: '/drivingSchool/system/pass/getBalanceByCoachId',
					method: 'get'
				})
				this.deduct = res.data.deduct
				this.deducts = res.data.deducts
			},
			viewCode() {
				uni.navigateTo({
					url: '/pages/viewCode/viewCode?type=2&id=' + this.schoolInfo.id + '&jlId=' + this.schoolInfo
						.jlId
				})
			},
			async findCourseList() {
				let res = await request({
					url: `/drivingSchool/system/reservationCourse/applet/getAppReservationCourseListByUserId`,

					method: 'get'
				})
				this.courseList = res.data
			},
			getUserInfo() {
				request({
					url: '/getJxInfo',
					method: 'get'
				}).then((res) => {
					if (res.code == 200) {
						this.schoolInfo = res.schoolInfo
						this.userInfo = res.user
						uni.setStorageSync("roles", res.roles)
						uni.setStorageSync("deptId", res.schoolInfo.deptId)
					}
				})
			},
			getDataInfo() {
				request({
					url: '/drivingSchool/system/reservationCourse/applet/getIndexData',
					method: 'get'
				}).then((res) => {
					if (res.code == 200) {
						this.dataInfo = res.user
					}
				})
			},
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			},
			golist(num) {
				uni.navigateTo({
					url: '/pages/teacher/ManageList?id=' + num
				})
			},
			goactive() {
				uni.navigateTo({
					url: '/pages/teacher/Addrc'
				})
				// uni.navigateTo({
				// 	url: '/pages/teacher/ActiveList'
				// })
			},
			gollsit() {
				uni.navigateTo({
					url: '/pages/teacher/jglist'
				})
			},
			goOrder() {
				uni.navigateTo({
					url: '/pages/teacher/orderManage'
				})

			},
			gocadetManage() {
				console.log('1');
				uni.navigateTo({
					url: '/pages/teacher/StudentManagement'
				})
			},
			gojl() {
				uni.navigateTo({
					url: '/pages/index/CoachManage'
				})
			},
			gokc() {
				uni.navigateTo({
					url: '/pages/index/courseManage'
				})
			},
			gosetUp() {
				uni.navigateTo({
					url: '/pages/teacher/setUp'
				})
			}

		}





	}
</script>

<style scoped lang="scss">
	.d-s {
		display: flex;
		align-items: center;
		font-size: 12px;
		color: #999999;
	}

	.p-ds {
		display: flex;
		align-items: center;
	}

	.con {
		background: #f7f7f7;
		box-sizing: border-box;
		padding-bottom: 15px;
	}

	.content {
		width: 100%;
		background: linear-gradient(180deg, #4AA76F 0%, #4AA76F 20%, #f7f7f7 38%, #f7f7f7 100%);
		height: 100vh;
	}

	.top-box {
		width: 100%;
		box-sizing: border-box;
		padding: 15px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		color: white;
	}

	.s-box {
		width: 20%;
		text-align: center;

	}

	.three-box {
		width: 100%;
		box-sizing: border-box;
		padding: 15px;
		display: flex;
		color: white;
		justify-content: space-between;
		align-items: center;
	}

	.touxiang {
		width: 56px;
		height: 56px;
		border-radius: 0px 0px 0px 0px;
		border: 1px solid #FFFFFF;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 15px;

		image {
			width: 100%;
			height: 100%;
		}

	}

	.b-size {
		font-weight: 600;
		font-size: 24px;
		color: #FFFFFF;
	}

	.s-size {
		font-weight: 400;
		font-size: 12px;
		color: #FFFFFF;
	}

	.jg-box {
		width: 95%;
		background: #fff;
		margin: 10px auto;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 10px;
	}

	.title-t {
		font-weight: bold;
		font-size: 16px;
		color: #333333;
	}

	.si-box {
		width: 25%;
		text-align: center;
		font-size: 12px;
		color: #333333;

		image {
			width: 35px;
			height: 35px;
		}
	}

	.box-bo-lv {
		width: 95%;
		margin: 10px auto;
		box-sizing: border-box;
		padding: 15px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: #D2EFDE;
		border-radius: 6px;
	}

	.f-box {
		width: 95%;
		margin: 10px auto;
		box-sizing: border-box;
		padding: 10px;
		background: #fff;
		border-radius: 10px;
	}

	.f-top {
		width: 100%;
		box-sizing: border-box;
		padding-bottom: 10px;
		border-bottom: 1px solid #EEEEEE;
		font-weight: bold;
		font-size: 14px;
		color: #FF9A1A;
	}

	.f_title {
		font-weight: 800;
		font-size: 14px;
		color: #333333;
		margin: 10px 0px;
	}

	.wrap-box {
		width: 100%;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}

	.icon-lv {
		background: #E6F5F0;
		border-radius: 2px 2px 2px 2px;

		box-sizing: border-box;
		padding: 5px;
		font-weight: 400;
		font-size: 10px;
		font-size: 10px;
		color: #4AA76F;
		margin-right: 10px;
	}

	.icon-huang {
		background: #FFEDD4;
		border-radius: 2px 2px 2px 2px;

		box-sizing: border-box;
		padding: 5px;
		font-weight: 400;
		font-size: 10px;
		font-size: 10px;
		color: #EDA23A;
	}

	.f-ds {
		display: flex;
		align-items: center;
		margin: 10px 0px;
	}

	.hui- {
		font-weight: 400;
		font-size: 12px;
		color: #737C90;
		margin-right: 10px;
	}

	.hei- {
		font-weight: 400;
		font-size: 12px;
		color: #333333;
	}

	.popup-bottom {
		width: 100%;
		box-sizing: border-box;
		padding: 15px;
		background: #fff;
		border-radius: 8px 8px 0px 0px;
	}

	.popup-top {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.p-l {
		font-weight: 400;
		font-size: 16px;
		color: rgba(0, 0, 0, 0.6);
	}

	.p-t {
		font-weight: 600;
		font-size: 18px;
		color: rgba(0, 0, 0, 0.9);
	}

	.p-r {
		text-align: right;
		font-weight: 400;
		font-size: 16px;
		color: #4AA76F;
	}

	.p-hang {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1px solid #DDDDDD;
		box-sizing: border-box;
		padding: 15px 0px;
	}
</style>