|
|
@@ -0,0 +1,358 @@
|
|
|
+<!-- -->
|
|
|
+<template>
|
|
|
+ <div class="m-container">
|
|
|
+ <h2>
|
|
|
+ <div class="squrt"></div>
|
|
|
+ 学生考勤列表
|
|
|
+ </h2>
|
|
|
+ <div class="m-core">
|
|
|
+ <!-- <el-form :inline="true"
|
|
|
+ ref='searchForm'
|
|
|
+ :model="searchForm">
|
|
|
+ <el-form-item>
|
|
|
+ <el-input v-model.trim="searchForm.search"
|
|
|
+ style="width:260px"
|
|
|
+ @keyup.enter.native="search"
|
|
|
+ placeholder='学生编号,姓名,课程编号,课程名'></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="organId">
|
|
|
+ <el-select class="multiple"
|
|
|
+ v-model.trim="searchForm.organId"
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ placeholder="请选择分部">
|
|
|
+ <el-option v-for="(item,index) in organList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-select v-model.trim="searchForm.courseScheduleType"
|
|
|
+ clearable
|
|
|
+ placeholder="请选择课程类型">
|
|
|
+ <el-option v-for='(item,index) in courseType'
|
|
|
+ :key="index"
|
|
|
+ :value="item.value"
|
|
|
+ :label="item.label"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-select v-model.trim="searchForm.signInStatus"
|
|
|
+ clearable
|
|
|
+ placeholder="签到状态">
|
|
|
+ <el-option :value="1"
|
|
|
+ label="正常签到"></el-option>
|
|
|
+ <el-option :value="0"
|
|
|
+ label="异常签到"></el-option>
|
|
|
+ <el-option :value="3"
|
|
|
+ label="未签到"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-select v-model.trim="searchForm.signOutStatus"
|
|
|
+ clearable
|
|
|
+ placeholder="签退状态">
|
|
|
+ <el-option :value="1"
|
|
|
+ label="正常签退"></el-option>
|
|
|
+ <el-option :value="0"
|
|
|
+ label="异常签退"></el-option>
|
|
|
+ <el-option :value="3"
|
|
|
+ label="未签退"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-date-picker v-model.trim="courseTime"
|
|
|
+ style="width:410px;"
|
|
|
+ type="daterange"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="考勤开始日期"
|
|
|
+ :picker-options="{
|
|
|
+ firstDayOfWeek: 1
|
|
|
+ }"
|
|
|
+ end-placeholder="考勤结束日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button @click="search"
|
|
|
+ type="danger">搜索</el-button>
|
|
|
+ <el-button @click="onReSet"
|
|
|
+ type="primary">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button @click="onExport"
|
|
|
+ type="primary"
|
|
|
+ v-permission="'export/queryTeacherAttendances'"
|
|
|
+ style="background-color: #14928a; border: 1px solid #14928a;">导出</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form> -->
|
|
|
+ <div class="tableWrap">
|
|
|
+ <el-table
|
|
|
+ style="width: 100%"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
+ :data="tableList"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="organName"
|
|
|
+ label="分部"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="teacherName"
|
|
|
+ label="学生姓名"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="teacherName"
|
|
|
+ label="老师姓名"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="courseScheduleId"
|
|
|
+ label="课程编号"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="courseScheduleName"
|
|
|
+ label="课程名称"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="classDate"
|
|
|
+ label="上课日期"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="startClassTime"
|
|
|
+ label="上课时间"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.startClassTime + "-" + scope.row.endClassTime }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="startClassTime"
|
|
|
+ label="课程类型"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.courseScheduleType | coursesType }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" label="签到时间">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.signInTime }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" label="签到状态">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.signInStatus | attendanceType }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="startClassTime"
|
|
|
+ label="签退时间"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.signOutTime }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" label="签退状态">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ scope.row.signOutStatus | attendanceOutType }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="remark"
|
|
|
+ label="备注"
|
|
|
+ ></el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination
|
|
|
+ sync
|
|
|
+ :total.sync="rules.total"
|
|
|
+ :page.sync="rules.page"
|
|
|
+ :limit.sync="rules.limit"
|
|
|
+ :page-sizes="rules.page_size"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import axios from "axios";
|
|
|
+import { getToken } from "@/utils/auth";
|
|
|
+import pagination from "@/components/Pagination/index";
|
|
|
+import load from "@/utils/loading";
|
|
|
+import qs from "qs";
|
|
|
+import { findStudentAttendance } from "@/api/buildTeam";
|
|
|
+// import { queryTeacherAttendances } from "@/api/recodeManager";
|
|
|
+import { courseType } from "@/utils/searchArray";
|
|
|
+let nowTime = new Date();
|
|
|
+nowTime =
|
|
|
+ nowTime.getFullYear() +
|
|
|
+ "-" +
|
|
|
+ (nowTime.getMonth() + 1) +
|
|
|
+ "-" +
|
|
|
+ nowTime.getDate();
|
|
|
+export default {
|
|
|
+ components: { pagination },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ searchForm: {
|
|
|
+ search: null,
|
|
|
+ organId: null,
|
|
|
+ signInStatus: null,
|
|
|
+ signOutStatus: null,
|
|
|
+ },
|
|
|
+ courseTime: [nowTime, nowTime],
|
|
|
+ courseType,
|
|
|
+ // teacherList: [],
|
|
|
+ tableList: [],
|
|
|
+ organList: [],
|
|
|
+ rules: {
|
|
|
+ // 分页规则
|
|
|
+ limit: 10, // 限制显示条数
|
|
|
+ page: 1, // 当前页
|
|
|
+ total: 0, // 总条数
|
|
|
+ page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ //生命周期 - 创建完成（可以访问当前this实例）
|
|
|
+ created() {},
|
|
|
+ //生命周期 - 挂载完成（可以访问DOM元素）
|
|
|
+ mounted() {
|
|
|
+ // getTeacher().then(res => {
|
|
|
+ // if (res.code == 200) {
|
|
|
+ // this.teacherList = res.data;
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // 获取分部
|
|
|
+ // getEmployeeOrgan().then((res) => {
|
|
|
+ // if (res.code == 200) {
|
|
|
+ // this.organList = res.data;
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ this.init();
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ let obj = { page: this.rules.page, rows: this.rules.limit };
|
|
|
+ // Object.assign(obj, this.searchForm);
|
|
|
+ // if (this.courseTime && this.courseTime.length > 0) {
|
|
|
+ // obj.courseStartDate = this.courseTime[0];
|
|
|
+ // obj.courseEndDate = this.courseTime[1];
|
|
|
+ // } else {
|
|
|
+ // this.$message.error("请选择搜索时间");
|
|
|
+ // return;
|
|
|
+ // }
|
|
|
+ findStudentAttendance(obj).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.tableList = res.data.rows;
|
|
|
+ this.rules.total = res.data.total;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ search() {
|
|
|
+ this.rules.page = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ onReSet() {
|
|
|
+ this.searchForm = {
|
|
|
+ search: null,
|
|
|
+ organIdList: null,
|
|
|
+ signInStatus: null,
|
|
|
+ signOutStatus: null,
|
|
|
+ };
|
|
|
+ this.courseTime = [nowTime, nowTime];
|
|
|
+ this.$refs["searchForm"].resetFields();
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ onExport() {
|
|
|
+ let obj = { page: this.rules.page, rows: this.rules.limit };
|
|
|
+ Object.assign(obj, this.searchForm);
|
|
|
+ if (this.courseTime && this.courseTime.length > 0) {
|
|
|
+ obj.courseStartDate = this.courseTime[0];
|
|
|
+ obj.courseEndDate = this.courseTime[1];
|
|
|
+ } else {
|
|
|
+ this.$message.error("请选择搜索时间");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let url = "/api-web/export/queryTeacherAttendances";
|
|
|
+ const options = {
|
|
|
+ method: "POST",
|
|
|
+ headers: {
|
|
|
+ Authorization: getToken(),
|
|
|
+ },
|
|
|
+ params: obj,
|
|
|
+ url,
|
|
|
+ responseType: "blob",
|
|
|
+ };
|
|
|
+ this.$confirm("您确定导出考勤列表", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ load.startLoading();
|
|
|
+ axios(options)
|
|
|
+ .then((res) => {
|
|
|
+ let blob = new Blob([res.data], {
|
|
|
+ // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
|
|
|
+ type: "application/vnd.ms-excel;charset=utf-8",
|
|
|
+ //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
|
|
|
+ });
|
|
|
+
|
|
|
+ let text = new Response(blob).text();
|
|
|
+ text.then((res) => {
|
|
|
+ // 判断是否报错
|
|
|
+ if (res.indexOf("code") != -1) {
|
|
|
+ let json = JSON.parse(res);
|
|
|
+ this.$message.error(json.msg);
|
|
|
+ } else {
|
|
|
+ let objectUrl = URL.createObjectURL(blob);
|
|
|
+ let link = document.createElement("a");
|
|
|
+ let fname = "考勤列表" + new Date().getTime(); //下载文件的名字
|
|
|
+ link.href = objectUrl;
|
|
|
+ link.setAttribute("download", fname);
|
|
|
+ document.body.appendChild(link);
|
|
|
+ link.click();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ load.endLoading();
|
|
|
+ })
|
|
|
+ .catch((error) => {
|
|
|
+ this.$message.error("导出数据失败，请联系管理员");
|
|
|
+ load.endLoading();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang='scss' scoped>
|
|
|
+</style>
|
mo