|
|
@@ -1,11 +1,25 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <el-form ref="search" :model="search" inline @submit.stop.native="submit" @reset.stop.native="reset">
|
|
|
- <el-form-item prop="keyword">
|
|
|
- <el-input v-model.trim="search.keyword" clearable placeholder="学生姓名(手机/编号)"/>
|
|
|
+ <el-form
|
|
|
+ ref="search"
|
|
|
+ :model="search"
|
|
|
+ inline
|
|
|
+ @submit.stop.native="submit"
|
|
|
+ @reset.stop.native="reset"
|
|
|
+ >
|
|
|
+ <el-form-item prop="search">
|
|
|
+ <el-input
|
|
|
+ v-model.trim="search.search"
|
|
|
+ clearable
|
|
|
+ placeholder="学生姓名(手机/编号)"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="hastimer">
|
|
|
- <el-select v-model.trim="search.hastimer" clearable placeholder="是否存在剩余时长">
|
|
|
+ <el-select
|
|
|
+ v-model.trim="search.hastimer"
|
|
|
+ clearable
|
|
|
+ placeholder="是否存在剩余时长"
|
|
|
+ >
|
|
|
<el-option label="是" value="1"></el-option>
|
|
|
<el-option label="否" value="0"></el-option>
|
|
|
</el-select>
|
|
|
@@ -30,9 +44,12 @@
|
|
|
<el-button type="danger" native-type="reset">重置</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
+ <div style="font-size: 14px; color: #f85043; padding-bottom: 10px">
|
|
|
+ 当前共有{{studentNumber}}名学生有剩余时长未排课
|
|
|
+ </div>
|
|
|
<el-table
|
|
|
- :data="filterlist"
|
|
|
- :header-cell-style="{background:'#EDEEF0',color:'#444'}"
|
|
|
+ :data="list"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
>
|
|
|
<!-- <el-table-column
|
|
|
prop="type"
|
|
|
@@ -50,7 +67,7 @@
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <copy-text>{{scope.row.userId}}</copy-text>
|
|
|
+ <copy-text>{{ scope.row.userId }}</copy-text>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
@@ -60,7 +77,7 @@
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <copy-text>{{scope.row.username}}</copy-text>
|
|
|
+ <copy-text>{{ scope.row.username }}</copy-text>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
@@ -70,20 +87,18 @@
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <copy-text>{{scope.row.phone}}</copy-text>
|
|
|
+ <copy-text>{{ scope.row.phone }}</copy-text>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- label="课程时长"
|
|
|
- >
|
|
|
+ <el-table-column label="课程时长">
|
|
|
<template slot-scope="scope">
|
|
|
<el-tag
|
|
|
- style="margin-right: 5px;margin-bottom: 5px;"
|
|
|
+ style="margin-right: 5px; margin-bottom: 5px"
|
|
|
v-for="item in scope.row.mapDtos"
|
|
|
:key="item.key"
|
|
|
type="info"
|
|
|
-
|
|
|
- >{{courseType[item.key]}}: {{item.value}}分钟</el-tag>
|
|
|
+ >{{ courseType[item.key] }}: {{ item.value }}分钟</el-tag
|
|
|
+ >
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<!-- <el-table-column
|
|
|
@@ -92,15 +107,24 @@
|
|
|
align="center"
|
|
|
/> -->
|
|
|
</el-table>
|
|
|
+ <pagination
|
|
|
+ sync
|
|
|
+ :total.sync="rules.total"
|
|
|
+ :page.sync="rules.page"
|
|
|
+ :limit.sync="rules.limit"
|
|
|
+ :page-sizes="rules.page_size"
|
|
|
+ @pagination="FetchDetail"
|
|
|
+ />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { queryStudentSubTotalCourseTimes } from '@/views/teamDetail/api'
|
|
|
+import { queryStudentSubTotalCourseTimes,countStudentSubTotalCourseTimes } from "@/views/teamDetail/api";
|
|
|
+import pagination from "@/components/Pagination/index";
|
|
|
import { getMusicGroupAllClass } from "@/api/buildTeam";
|
|
|
-import { courseType } from '@/constant'
|
|
|
+import { courseType } from "@/constant";
|
|
|
export default {
|
|
|
- props: ['detail'],
|
|
|
+ props: ["detail"],
|
|
|
data() {
|
|
|
return {
|
|
|
courseType,
|
|
|
@@ -108,75 +132,103 @@ export default {
|
|
|
filterlist: [],
|
|
|
extra: [],
|
|
|
search: {
|
|
|
- keyword: '',
|
|
|
- hastimer: '',
|
|
|
+ search: "",
|
|
|
+ hastimer: "",
|
|
|
classGroupId: null,
|
|
|
},
|
|
|
- classList: []
|
|
|
- }
|
|
|
+ classList: [],
|
|
|
+ studentNumber:0,
|
|
|
+ rules: {
|
|
|
+ // 分页规则
|
|
|
+ limit: 10, // 限制显示条数
|
|
|
+ page: 1, // 当前页
|
|
|
+ total: 0, // 总条数
|
|
|
+ page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ pagination,
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.FetchDetail()
|
|
|
- this.getMusicClass()
|
|
|
+ this.FetchDetail();
|
|
|
+ this.getMusicClass();
|
|
|
+ this.getTeamStudentNum()
|
|
|
+ //countStudentSubTotalCourseTimes
|
|
|
},
|
|
|
methods: {
|
|
|
+ async getTeamStudentNum(){
|
|
|
+ try {
|
|
|
+ const res = await countStudentSubTotalCourseTimes({
|
|
|
+ musicGroupId: this.$route.query.id,
|
|
|
+ hastimer:true,
|
|
|
+ });
|
|
|
+ this.studentNumber = res.data || 0;
|
|
|
+ // this.list = Object.keys(res.data).map(item => ({type: item, time: res.data[item]}))
|
|
|
+ } catch (error) {}
|
|
|
+ },
|
|
|
getMusicClass() {
|
|
|
- getMusicGroupAllClass({ musicGroupId: this.$route.query.id, }).then((res) => {
|
|
|
- if (res.code == 200) {
|
|
|
- this.classList = res.data;
|
|
|
+ getMusicGroupAllClass({ musicGroupId: this.$route.query.id }).then(
|
|
|
+ (res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.classList = res.data;
|
|
|
+ }
|
|
|
}
|
|
|
- });
|
|
|
+ );
|
|
|
},
|
|
|
array2object(list = []) {
|
|
|
- const data = {}
|
|
|
+ const data = {};
|
|
|
for (const item of list) {
|
|
|
- data[item.key] = item.value
|
|
|
+ data[item.key] = item.value;
|
|
|
}
|
|
|
- return data
|
|
|
+ return data;
|
|
|
},
|
|
|
filter() {
|
|
|
- const { keyword, hastimer, classGroupId } = this.search
|
|
|
- this.filterlist = this.list.filter(item => {
|
|
|
- const user = !keyword || (
|
|
|
- ('' + item.userId).indexOf(keyword) > -1 ||
|
|
|
- ('' + item.phone).indexOf(keyword) > -1 ||
|
|
|
- ('' + item.username).indexOf(keyword) > -1
|
|
|
- )
|
|
|
- const length = item.mapDtos.filter(dto => dto.value > 0).length
|
|
|
- const couse = !hastimer || (hastimer == '1' && length || hastimer == '0' && !length)
|
|
|
- const classGroup = !classGroupId || item.classGroupId.indexOf(classGroupId) >= 0
|
|
|
- return user && couse && classGroup
|
|
|
- })
|
|
|
+ const { keyword, hastimer, classGroupId } = this.search;
|
|
|
+ this.filterlist = this.list.filter((item) => {
|
|
|
+ const user =
|
|
|
+ !keyword ||
|
|
|
+ ("" + item.userId).indexOf(keyword) > -1 ||
|
|
|
+ ("" + item.phone).indexOf(keyword) > -1 ||
|
|
|
+ ("" + item.username).indexOf(keyword) > -1;
|
|
|
+ const length = item.mapDtos.filter((dto) => dto.value > 0).length;
|
|
|
+ const couse =
|
|
|
+ !hastimer ||
|
|
|
+ (hastimer == "1" && length) ||
|
|
|
+ (hastimer == "0" && !length);
|
|
|
+ const classGroup =
|
|
|
+ !classGroupId || item.classGroupId.indexOf(classGroupId) >= 0;
|
|
|
+ return user && couse && classGroup;
|
|
|
+ });
|
|
|
},
|
|
|
submit(evt) {
|
|
|
- evt.stopPropagation()
|
|
|
- evt.stopImmediatePropagation()
|
|
|
- evt.preventDefault()
|
|
|
- this.filter()
|
|
|
+ this.rules.page = 1;
|
|
|
+ this.FetchDetail();
|
|
|
},
|
|
|
reset(evt) {
|
|
|
- evt.stopPropagation()
|
|
|
- evt.stopImmediatePropagation()
|
|
|
- evt.preventDefault()
|
|
|
+ // evt.stopPropagation();
|
|
|
+ // evt.stopImmediatePropagation();
|
|
|
+ // evt.preventDefault();
|
|
|
this.search = {
|
|
|
- keyword: '',
|
|
|
- hastimer: ''
|
|
|
- }
|
|
|
- this.filter()
|
|
|
+ search: "",
|
|
|
+ hastimer: "",
|
|
|
+ classGroupId: null,
|
|
|
+ };
|
|
|
+ this.submit();
|
|
|
},
|
|
|
async FetchDetail() {
|
|
|
try {
|
|
|
const res = await queryStudentSubTotalCourseTimes({
|
|
|
musicGroupId: this.$route.query.id,
|
|
|
- })
|
|
|
- this.list = res.data
|
|
|
- this.filter()
|
|
|
- if (res.data[0]) {
|
|
|
- this.extra = res.data[0].mapDtos
|
|
|
- }
|
|
|
+ ...this.search,
|
|
|
+ page: this.rules.page,
|
|
|
+ rows: this.rules.limit,
|
|
|
+ });
|
|
|
+ this.list = res.data.rows;
|
|
|
+ this.rules.total = res.data.total;
|
|
|
// this.list = Object.keys(res.data).map(item => ({type: item, time: res.data[item]}))
|
|
|
} catch (error) {}
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
mo