mteacher/src/views/rules/index.vue

<template>
    <div class="rules">
        <table border="1" v-if="type == 'onLine' || !type">
            <tr>
                <th colspan="3">乐团&VIP&网管线上课</th>
                <th>以课程12:00:00-13:00:00为例</th>
                <th>扣费规则</th>
            </tr>
            <tr>
                <td rowspan="5">签到</td>
                <td>可签到时间范围</td>
                <td>课程<span class="r">开始前</span>20分钟至课程<span class="r">结束前</span>进入教室</td>
                <td>11:40:00-12:59:59</td>
                <td></td>
            </tr>
            <tr>
                <td>正常签到</td>
                <td>课程<span class="r">开始前</span>分钟至课程<span class="r">开始前</span>1分钟进入教室</td>
                <td>11:40:00-11:58:59</td>
                <td></td>
            </tr>
            <tr>
                <td>迟到</td>
                <td>课程<span class="r">开始前</span>1分钟至课程<span class="r">开始后</span>3分钟进入教室</td>
                <td>11:58:59-12:02:59</td>
                <td>-50%</td>
            </tr>
            <tr>
                <td>旷课</td>
                <td>课程开始后3分钟至课程<span class="r">结束前</span>进入教室</td>
                <td>12:03:00-12:59:59</td>
                <td>-100%</td>
            </tr>
            <tr>
                <td>未签到</td>
                <td>未进入网络教室</td>
                <td></td>
                <td>-100%</td>
            </tr>

            <tr>
                <td rowspan="5">签退</td>
                <td>可签退时间范围</td>
                <td>课程<span class="r">开始前</span>分钟至课程<span class="r">结束后</span>15分钟（课程结束后15分钟网络教室自动关闭）</td>
                <td>11:40:00-13:15:00</td>
                <td></td>
            </tr>
            <tr>
                <td>正常签退</td>
                <td>课程<span class="r">结束后</span>退出教室</td>
                <td>13:00:00-13:15:00</td>
                <td></td>
            </tr>
            <tr>
                <td>早退</td>
                <td>课程<span class="r">开始前</span>分钟至课程<span class="r">结束前</span>3分钟退出教室</td>
                <td>11:40:00-12:56:59</td>
                <td>-100%</td>
            </tr>
            <tr>
                <td>异常签退</td>
                <td>课程<span class="r">结束前</span>3分钟至课程<span class="r">结束前</span>退出教室</td>
                <td>12:57:00-12:59:59</td>
                <td>-50%</td>
            </tr>
        </table>

        <table border="1" v-if="type == 'offLine' || !type">
            <tr>
                <th colspan="3">乐团线下课</th>
                <th>以课程12:00:00-13:00:00为例</th>
                <th>扣费规则</th>
            </tr>
            <tr>
                <td rowspan="7">签到</td>
                <td>可签到时间范围</td>
                <td>课程<span class="r">开始前</span>1小时至课程<span class="r">结束前</span></td>
                <td>11:00:00-13:00:00</td>
                <td></td>
            </tr>
            <tr>
                <td>正常签到</td>
                <td>课程<span class="r">开始前</span>1小时至课程<span class="r">开始前</span>20分钟签到，GPS定位点在教学点1000米<span class="r">内</span></td>
                <td>10:00:00-11:39:59</td>
                <td></td>
            </tr>
            <tr>
                <td rowspan="2">异常签到</td>
                <td>课程<span class="r">开始前</span>1小时至课程<span class="r">开始前</span>20分钟签到，GPS定位点在教学点1000米<span class="r">外</span></td>
                <td></td>
                <td>-50</td>
            </tr>
            <tr>
                <td>课程<span class="r">开始前</span>20分钟后至课程<span class="r">开始前</span>签到</td>
                <td>11:40:00-11:59:59</td>
                <td>-50</td>
            </tr>
            <tr>
                <td>迟到</td>
                <td>课程<span class="r">开始后</span>30分钟内签到</td>
                <td>12:00:00-12:29:59</td>
                <td>-50%</td>
            </tr>
            <tr>
                <td>旷课</td>
                <td>课程<span class="r">开始后</span>30分钟至课程<span class="r">结束前</span>签到</td>
                <td>12:30:00-12:59:59</td>
                <td>-100%</td>
            </tr>
            <tr>
                <td>未签到</td>
                <td>未进行【签到】操作</td>
                <td>12:30:00-12:59:59</td>
                <td>-100%</td>
            </tr>
            <!--  -->
            <tr>
                <td rowspan="3">点名</td>
                <td>可点名时间范围</td>
                <td>课程<span class="r">开始前</span>1小时至课程<span class="r">结束后</span>6小时(当天24点前)（需先进行【签到】操作）</td>
                <td>11:00:00-18:59:59</td>
                <td></td>
            </tr>
            <tr>
                <td>正常点名</td>
                <td>进行了【点名】操作</td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td>未点名</td>
                <td>未进行【点名】操作</td>
                <td></td>
                <td></td>
            </tr>

            <!--  -->
            <tr>
                <td rowspan="6">签退</td>
                <td>可签退时间范围</td>
                <td>课程<span class="r">结束后</span>到课程当天24点前</td>
                <td>13:00:00-23:59:59</td>
                <td></td>
            </tr>
            <tr>
                <td>正常签退</td>
                <td>课程<span class="r">结束后</span>至课程<span class="r">结束后</span>6小时，且GPS定位在教学点1000米<span class="r">外</span></td>
                <td>13:00:00-18:59:59</td>
                <td></td>
            </tr>
            <tr>
                <td>早退</td>
                <td>课程<span class="r">结束前</span>3分钟签退至课程<span class="r">结束前</span>签退</td>
                <td>12:56:59-12:59:59</td>
                <td>-100%</td>
            </tr>
            <tr>
                <td rowspan="2">异常签退</td>
                <td>课程<span class="r">结束6小时后</span>至课程<span class="r">当天</span>24点前</td>
                <td>19:00:00-23:59:59</td>
                <td rowspan="2">正常点名-50 <br />未点名-50%</td>
            </tr>
            <tr>
                <td>GPS定位点在教学点范围之外</td>
                <td></td>
            </tr>
            <tr>
                <td>未签退</td>
                <td>未进行【签退】操作</td>
                <td></td>
                <td>-100%</td>
            </tr>
            <tr>
                <td colspan="3"><span class="r">签到签退时间都在正常范围内，但同时GPS定位在教学点1000米外</span></td>
                <td></td>
                <td>-100%</td>
            </tr>
        </table>
        <table border="1" v-if="type == 'vipOffLine' || !type">
            <tr>
                <th colspan="3">VIP线下课</th>
                <th>以课程12:00:00-13:00:00为例</th>
                <th>扣费规则</th>
            </tr>
            <tr>
                <td rowspan="4">签到&签退</td>
                <td>可签到时间范围</td>
                <td>课程开始前20分钟至课程结束后20分钟</td>
                <td>11:40:00-13:19:59</td>
                <td></td>
            </tr>
            <tr>
                <td>正常签到签退</td>
                <td>操作了【点名】，GPS定位在教学点1000米<span class="r">内</span></td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td>异常签到签退</td>
                <td>操作了【点名】，GPS定位在教学点1000米<span class="r">外</span></td>
                <td></td>
                <td>-100%</td>
            </tr>
            <tr>
                <td>未签到签退</td>
                <td>未进行【点名】</td>
                <td></td>
                <td>-100%</td>
            </tr>
            <tr>
                <td colspan="3"><span class="r">签到签退时间都在正常范围内，但同时GPS定位在教学点1000米外</span></td>
                <td></td>
                <td>-100%</td>
            </tr>
        </table>
    </div>
</template>

<script>
import { sysConfigList } from './api'
import setLoading from '@/utils/loading'
export default {
    data() {
        let query = this.$route.query
        return {
            type: query.type || null,
            dataList: {}
        }
    },
    mounted() {
        this.__init()
    },
    methods: {
        async __init() {
            setLoading(true)
            await sysConfigList().then(res => {
                const result = res.data
                if(result.code == 200) {
                    const { data } = result
                    const dataList = this.dataList
                    data.forEach(item => {
                        switch(item.paramName) {
                            case 'advance_sign_in_minutes':
                                // 老师正常打卡时间，为课程当天，距离开课时间前{}分钟
                                dataList.advance_sign_in_minutes = item.paranValue
                                break;
                        }
                    });
                    console.log(this.dataList)
                }
            })
            setLoading(false)
        }
    }
}
</script>

<style lang="less" scoped>
.rules {
    background: #ffffff;
}
table {
    border: 0;
    font-size: 12px;
    border-color: #cccccc;
    th {
        text-align: center;
    }
    th, td {
        padding: 5px;
    }
    tr:nth-child(even) {
        background-color: #f1f1f1;
    }
}
table + table {
    margin-top: .15rem;
}
.r {
    color: red;
}
</style>