123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362 |
- <!-- -->
- <template>
- <div class="m-container">
- <h2>
- <div class="squrt"></div>
- 学生考勤列表
- </h2>
- <div class="m-core">
- <save-form
- :inline="true"
- ref="searchForm"
- :model="searchForm"
- @submit="search"
- @reset="onReSet"
- >
- <el-form-item prop="studentID">
- <el-input
- v-model.trim="searchForm.studentID"
- clearable
- @keyup.enter.native="search"
- placeholder="学生编号"
- ></el-input>
- </el-form-item>
- <el-form-item prop="teacherId">
- <remote-search :commit='"setTeachers"' v-model='searchForm.teacherId' />
- </el-form-item>
- <el-form-item prop="organId">
- <el-select
- class="multiple"
- filterable
- style="width: 180px !important"
- v-model.trim="searchForm.organId"
- clearable
- placeholder="请选择分部"
- >
- <el-option
- v-for="(item, index) in selects.branchs"
- :key="index"
- :label="item.name"
- :value="item.id"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item prop="musicGroupId">
- <el-input
- v-model.trim="searchForm.musicGroupId"
- clearable
- @keyup.enter.native="search"
- placeholder="乐团编号"
- ></el-input>
- </el-form-item>
- <el-form-item prop="courseScheduleId">
- <el-input
- v-model.trim="searchForm.courseScheduleId"
- clearable
- @keyup.enter.native="search"
- placeholder="课程编号"
- ></el-input>
- </el-form-item>
- <el-form-item prop="groupType">
- <el-select
- v-model.trim="searchForm.groupType"
- placeholder="请选择课程组类型"
- >
- <el-option
- v-for="(item, index) in courseListType"
- :key="index"
- :value="item.value"
- :label="item.label"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item prop="courseScheduleType">
- <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 prop="status">
- <el-select
- v-model.trim="searchForm.status"
- placeholder="请选择考勤状态"
- clearable
- >
- <el-option
- v-for="(item, index) in attendanceStatus"
- :key="index"
- :value="item.value"
- :label="item.label"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item prop="dates" >
- <el-date-picker
- v-model="dates"
- type="daterange"
- style="width: 405px;"
- range-separator="至"
- start-placeholder="课程开始日期"
- end-placeholder="课程结束日期">
- </el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button native-type="submit" type="danger">搜索</el-button>
- <el-button native-type="reset" type="primary">重置</el-button>
- </el-form-item>
- </save-form>
- <div class="tableWrap">
- <el-table
- style="width: 100%"
- :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
- :data="tableList"
- >
- <el-table-column
- align="center"
- prop="courseSchedule.organization.name"
- label="分部"
- ></el-table-column>
- <el-table-column align="center" prop="username" label="学生姓名">
- <template slot-scope="scope">
- <div>
- {{ scope.row.username }}
- <p style="color: #f56c6c">
- (<copy-text>{{ scope.row.userId }}</copy-text
- >)
- </p>
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="courseSchedule.teacherName"
- label="老师姓名"
- >
- <template slot-scope="scope">
- {{ scope.row.courseSchedule.teacherName }}
- <p style="color: #f56c6c" v-if="scope.row.teacherId">
- (<copy-text>{{ scope.row.teacherId }}</copy-text
- >)
- </p>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="musicGroupId"
- label="乐团编号"
- >
- <template slot-scope="scope">
- <div>
- <copy-text>{{ scope.row.musicGroupId }}</copy-text>
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="courseScheduleId"
- label="课程编号"
- >
- <template slot-scope="scope">
- <div>
- <copy-text>{{ scope.row.courseScheduleId }}</copy-text>
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="courseSchedule.name"
- label="课程名称"
- ></el-table-column>
- <el-table-column
- align="center"
- prop="courseSchedule.classDate"
- label="上课日期"
- >
- <template slot-scope="scope">
- <div>
- {{ scope.row.courseSchedule.classDate | dayjsFormat }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="startClassTime"
- label="上课时间"
- >
- <template slot-scope="scope">
- <div>
- {{
- scope.row.courseSchedule.startClassTime | dayjsFormatMinute
- }}-{{
- scope.row.courseSchedule.endClassTime | dayjsFormatMinute
- }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="startClassTime"
- label="课程组类型"
- >
- <template slot-scope="scope">
- <div>
- {{ scope.row.groupType | coursesType }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="startClassTime"
- label="课程类型"
- >
- <template slot-scope="scope">
- <div>
- {{ scope.row.courseSchedule.type | coursesType }}
- </div>
- </template>
- </el-table-column>
- <el-table-column align="center" label="签到时间" width="180px">
- <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.courseSchedule.newCourseId > 0 ? '是' : '否' }}
- </div>
- </template>
- </el-table-column>
- <el-table-column
- align="center"
- prop="startClassTime"
- width="180px"
- 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.status | clockingIn }}
- </div>
- </template>
- </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 { getTimes } from "@/utils";
- import qs from "qs";
- import { findStudentAttendance } from "@/api/buildTeam";
- // import { queryTeacherAttendances } from "@/api/recodeManager";
- import {
- courseType,
- courseListType,
- stuAttendance,
- } from "@/utils/searchArray";
- export default {
- components: { pagination },
- data() {
- return {
- searchForm: {
- studentID: "",
- groupType: "MUSIC",
- musicGroupId: "",
- courseScheduleId: "",
- status: "",
- teacherId:'',
- courseScheduleType:'',
- organId:''
- },
- dates:[],
- courseType,
- courseListType,
- attendanceStatus:stuAttendance,
- // teacherList: [],
- tableList: [],
- organList: [],
- rules: {
- // 分页规则
- limit: 10, // 限制显示条数
- page: 1, // 当前页
- total: 0, // 总条数
- page_size: [10, 20, 40, 50], // 选择限制显示条数
- },
- };
- },
- //生命周期 - 创建完成(可以访问当前this实例)
- created() {},
- //生命周期 - 挂载完成(可以访问DOM元素)
- mounted() {
- this.init();
- },
- methods: {
- async init() {
- await this.$store.dispatch('setBranchs')
- this.getList();
- },
- getList() {
- let obj = {
- page: this.rules.page,
- rows: this.rules.limit,
- ...this.searchForm,
- ...getTimes(this.dates, ["startDateOfCourse", "endDateOfCourse"],'YYYY-MM-DD'),
- };
- 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.$refs["searchForm"].resetFields();
- this.search();
- },
- },
- };
- </script>
- <style lang='scss' scoped>
- </style>
|