|
@@ -0,0 +1,272 @@
|
|
|
+<template>
|
|
|
+ <div class="schedule">
|
|
|
+ <m-header :backUrl="backUrl" background />
|
|
|
+ <div class="detailHeader">
|
|
|
+ <van-cell-group class="detailCard">
|
|
|
+ <van-cell style="padding: .18rpx; height: .12rpx;">
|
|
|
+ <template #title>
|
|
|
+ <div class="detailTitle">
|
|
|
+ <span class="teachMode">{{ teachMode == 'ONLINE' ? '线上' : null }}{{ teachMode == 'OFFLINE' ? '线下' : null }}</span>
|
|
|
+ <span :class="['courseType', type]">{{ type | coursesType }}</span>
|
|
|
+ <span style="line-height: 1.2;vertical-align: bottom;">{{ className }}</span>
|
|
|
+ </div>
|
|
|
+ <p class="detailTime van-hairline--bottom">{{ startTimeFormat }} {{ startClassTime | formatDate }} - {{ endClassTime | formatDate }}</p>
|
|
|
+ </template>
|
|
|
+ <template #label>
|
|
|
+ <div class="detailLabel">
|
|
|
+ 主讲老师:{{ teacherName }}<br />
|
|
|
+ <!-- <p >最后提交时间:{{ lastDate }}</p> -->
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ </div>
|
|
|
+ <!-- <van-cell-group>
|
|
|
+ <van-cell :center="true" style="padding: .1rem .16rem;">
|
|
|
+ <template slot="title">
|
|
|
+ <span style="padding-right: 0.1rem;">到课:{{ studentNum }}/{{ totalStudentNum }}</span>
|
|
|
+ <span style="padding-right: 0.1rem;">请假:{{ leaveStudentNum }}</span>
|
|
|
+ <span>欠费:{{ paymentNum }}</span>
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group> -->
|
|
|
+ <div class="recordDetail" v-if="dataShow">
|
|
|
+ 考勤异常学员名单
|
|
|
+ <!-- <span style="padding-right: 0.1rem;">到课:{{ studentNum }}/{{ totalStudentNum }}</span>
|
|
|
+ <span style="padding-right: 0.1rem;">请假:{{ leaveStudentNum }}</span>
|
|
|
+ <span>欠费:{{ paymentNum }}</span> -->
|
|
|
+ </div>
|
|
|
+ <van-list v-model="loading" v-if="dataShow" key="data"
|
|
|
+ :finished="finished"
|
|
|
+ finished-text=" "
|
|
|
+ :immediate-check="false"
|
|
|
+ @load="getFindStudentAttendance">
|
|
|
+ <van-cell-group v-for="(item, index) in dataList" :key="index" style="margin-top: 0">
|
|
|
+ <van-cell style="align-items: center;padding: .15rem .12rem;">
|
|
|
+ <template #icon>
|
|
|
+ <van-image :src="item.avatar ? item.avatar : avatar" style="width: .32rem; height: .32rem; border-radius: 50%; overflow: hidden;">
|
|
|
+ <template v-slot:loading>
|
|
|
+ <van-loading type="spinner" size="20" />
|
|
|
+ </template>
|
|
|
+ </van-image>
|
|
|
+ </template>
|
|
|
+ <template #title>
|
|
|
+ <span style="padding-left: 0.05rem" :class="[item.paymentStatus == 'NON_PAYMENT' ? 'red' : null]">{{ item.username }}</span>
|
|
|
+ </template>
|
|
|
+ <template #default>
|
|
|
+ <!-- <p v-if="item.courseSchedule && item.courseSchedule.status != 'NOT_START'" style="font-weight: 500;">
|
|
|
+ <span v-if="!item.status">
|
|
|
+ 未签到
|
|
|
+ </span>
|
|
|
+ <span v-else-if="item.status == 'NORMAL'" style="color: #FF802C">
|
|
|
+ {{ item.status | clockingIn }}
|
|
|
+ </span>
|
|
|
+ <span v-else-if="item.status == 'LEAVE'" style="color: #FF802C">
|
|
|
+ {{ item.status | clockingIn }}
|
|
|
+ </span>
|
|
|
+ <span v-else-if="item.status == 'TRUANT'" style="color: #FF4444">
|
|
|
+ {{ item.status | clockingIn }}
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ {{ item.status | clockingIn }}
|
|
|
+ </span>
|
|
|
+ </p> -->
|
|
|
+ <p>
|
|
|
+ <span class="backVisit" @click="gotoVisit(item)">回访</span>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ </van-list>
|
|
|
+ <m-empty class="empty" v-else key="data" msg="暂无数据" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import MHeader from '@/components/MHeader'
|
|
|
+import dayjs from 'dayjs'
|
|
|
+import MEmpty from '@/components/MEmpty'
|
|
|
+import { utilDate } from '@/common/util'
|
|
|
+// import setLoading from '@/common/loading'
|
|
|
+import { getAttendanceErrorStudent } from './api'
|
|
|
+export default {
|
|
|
+ name: 'schedule',
|
|
|
+ components: { MHeader, MEmpty },
|
|
|
+ data() {
|
|
|
+ const query = this.$route.query
|
|
|
+ return {
|
|
|
+ id: query.id,
|
|
|
+ studentNum: query.studentNum,
|
|
|
+ teacherName: query.teacherName,
|
|
|
+ totalStudentNum: query.totalStudentNum,
|
|
|
+ leaveStudentNum: query.leaveStudentNum,
|
|
|
+ startClassTime: query.startClassTime,
|
|
|
+ teachMode: query.teachMode,
|
|
|
+ type: query.type,
|
|
|
+ paymentNum: 0,
|
|
|
+ startTimeFormat: dayjs(query.startClassTime).format('MM月DD日'),
|
|
|
+ endClassTime: query.endClassTime,
|
|
|
+ lastDate: null,
|
|
|
+ className: query.name,
|
|
|
+ loading: false,
|
|
|
+ finished: false,
|
|
|
+ params: {
|
|
|
+ date: utilDate(new Date()),
|
|
|
+ page: 1,
|
|
|
+ rows: 10
|
|
|
+ },
|
|
|
+ dataShow: true, // 是否有数据
|
|
|
+ dataList: [],
|
|
|
+ backUrl: {
|
|
|
+ status: true,
|
|
|
+ path: '/schedule'
|
|
|
+ },
|
|
|
+ avatar: require('../../assets/images/icon_student.png'),
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getFindStudentAttendance()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getFindStudentAttendance() {
|
|
|
+ let params = this.params
|
|
|
+ await getAttendanceErrorStudent({ courseScheduleId: this.id, page: 1, rows: 9999 }).then(res => {
|
|
|
+ let result = res.data
|
|
|
+ this.loading = false
|
|
|
+ if(result.code == 200) {
|
|
|
+ // 重点这句,判断是不是重复请求了
|
|
|
+ if (this.dataList.length > 0 && result.data.pageNo == 1) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ params.page = result.data.pageNo
|
|
|
+ this.dataList = this.dataList.concat(result.data.rows)
|
|
|
+ this.dataList.forEach(item => {
|
|
|
+ if(item.paymentStatus == 'NON_PAYMENT') {
|
|
|
+ this.paymentNum += 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(params.page >= result.data.totalPage) {
|
|
|
+ this.finished = true
|
|
|
+ }
|
|
|
+ this.params.page++
|
|
|
+ } else {
|
|
|
+ this.finished = true
|
|
|
+ }
|
|
|
+ // 判断是否有数据
|
|
|
+ if(this.dataList.length <= 0) {
|
|
|
+ this.dataShow = false
|
|
|
+ }
|
|
|
+
|
|
|
+ this.lastDate = this.dataList[0] && this.dataList[0].updateTime ? dayjs(this.dataList[0].updateTime).format('MM-DD hh:mm') : null
|
|
|
+ })
|
|
|
+ },
|
|
|
+ gotoVisit(row){
|
|
|
+ this.$router.push({ path: "/addVisit",query:{name:'考勤回访',isAttError:true,info:{userId:row.userId,username:row.username,type:'常规回访',purpose:'考勤申诉'}},})
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang='less' scoped>
|
|
|
+@import url("../../assets/commonLess/variable.less");
|
|
|
+.link { color: @whiteColor; }
|
|
|
+.schedule {
|
|
|
+ min-height: 100vh;
|
|
|
+}
|
|
|
+/deep/.empty {
|
|
|
+ .icon {
|
|
|
+ margin-top: .2rem;
|
|
|
+ }
|
|
|
+}
|
|
|
+.recordDetail {
|
|
|
+ margin-top: .06rem;
|
|
|
+ padding: .15rem .1rem .1rem;
|
|
|
+ font-size: .14rem;
|
|
|
+ color: #808080;
|
|
|
+}
|
|
|
+.backVisit {
|
|
|
+ color: #01C1B5;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+/deep/.van-cell__title {
|
|
|
+ font-size: .16rem;
|
|
|
+ color: @mFontColor;
|
|
|
+}
|
|
|
+/deep/.van-cell-group {
|
|
|
+ margin-top: .05rem;
|
|
|
+}
|
|
|
+.title-content {
|
|
|
+ font-weight: bold;
|
|
|
+ flex: 1 auto;
|
|
|
+ max-width: 82%;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ .van-cell__label {
|
|
|
+ font-weight: 400;
|
|
|
+ margin-top: .06rem;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .van-icon-location, .van-icon-video-o {
|
|
|
+ margin-right: .05rem;
|
|
|
+ }
|
|
|
+ .groupName {
|
|
|
+ display: block;
|
|
|
+ font-size: .14rem;
|
|
|
+ font-weight: 400;
|
|
|
+ padding-bottom: 0.04rem;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+}
|
|
|
+/deep/.van-cell__value, /deep/.van-cell__label {
|
|
|
+ color: @tFontColor;
|
|
|
+ span {
|
|
|
+ padding-right: .1rem;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.red {
|
|
|
+ color: red;
|
|
|
+}
|
|
|
+
|
|
|
+.detailHeader {
|
|
|
+ background-color: #01C1B5;
|
|
|
+ height: 1rem;
|
|
|
+ padding-top: .1rem;
|
|
|
+ position: relative;
|
|
|
+ .detailCard {
|
|
|
+ position: absolute;
|
|
|
+ top: .1rem;
|
|
|
+ left: 0;
|
|
|
+ width: calc(100% - .24rem);
|
|
|
+ margin: 0 .12rem;
|
|
|
+ border-radius: .1rem;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ .detailTitle {
|
|
|
+ font-size: .18rem;
|
|
|
+ line-height: 1.5;
|
|
|
+ font-weight: 500;
|
|
|
+ padding-bottom: .05rem;
|
|
|
+ color: #333;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .detailTime {
|
|
|
+ color: #333;
|
|
|
+ padding: .06rem 0;
|
|
|
+ font-size: .16rem;
|
|
|
+ }
|
|
|
+ .detailLabel {
|
|
|
+ color: #666;
|
|
|
+ font-size: .13rem;
|
|
|
+ line-height: 1.7;
|
|
|
+ padding: .08rem 0 .02rem;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|