|
|
@@ -1,209 +1,209 @@
|
|
|
-<template>
|
|
|
- <div id="name-list">
|
|
|
- <list-frame :title="mainTitle" @query="search" :total="total" :needFilter="false" :needAdd="false">
|
|
|
- <el-col :span="24" class="printingBtn">
|
|
|
- <!-- <el-button type="primary" size="mini" @click="toPrint()">打印名牌</el-button> -->
|
|
|
- <el-col :span="12">
|
|
|
- <el-input placeholder="请输入学生姓名" v-model="stuname" class="input-with-select">
|
|
|
- <el-button slot="append" icon="el-icon-search" @click="search()"></el-button>
|
|
|
- </el-input>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-button type="primary" size="mini" @click="addstu()">添加学生</el-button>
|
|
|
- <el-button type="primary" size="mini" @click="toComputIsFine()" :disabled="this.defaultOption.classid ? false : true">设置优秀学员</el-button>
|
|
|
- <el-button type="primary" size="mini" @click="toExportList()">导出学生名单</el-button>
|
|
|
- </el-col>
|
|
|
- </el-col>
|
|
|
- <data-table :fields="fields" :data="list" :opera="opera" @edit="toEdit" @delete="toDelete" @post="toPost"> </data-table>
|
|
|
- </list-frame>
|
|
|
- <el-drawer title="任职" :visible.sync="drawer" direction="rtl" @close="toClose">
|
|
|
- <data-form :data="form" :fields="formFields" :rules="rules" :isNew="false">
|
|
|
- <template #radios="{item}">
|
|
|
- <template v-if="item.model === 'job'">
|
|
|
- <el-radio label="1">班长</el-radio>
|
|
|
- <el-radio label="0">学委</el-radio>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- <template #custom="{ item, form }">
|
|
|
- <template v-if="item.model === 'gender'">
|
|
|
- {{ form[item.model] }}
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- </data-form>
|
|
|
- </el-drawer>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import _ from 'lodash';
|
|
|
-import listFrame from '@frame/layout/admin/list-frame';
|
|
|
-import dataTable from '@frame/components/data-table';
|
|
|
-import dataForm from '@frame/components/form';
|
|
|
-import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
-const { mapActions } = createNamespacedHelpers('student');
|
|
|
-const { mapActions: group } = createNamespacedHelpers('group');
|
|
|
-export default {
|
|
|
- metaInfo: { title: '班级名单' },
|
|
|
- name: 'name-list',
|
|
|
- props: {},
|
|
|
- components: {
|
|
|
- listFrame,
|
|
|
- dataTable,
|
|
|
- dataForm,
|
|
|
- },
|
|
|
- data: function() {
|
|
|
- var _this = this;
|
|
|
- return {
|
|
|
- opera: [
|
|
|
- {
|
|
|
- label: '编辑',
|
|
|
- icon: 'el-icon-edit',
|
|
|
- method: 'edit',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '删除',
|
|
|
- icon: 'el-icon-delete',
|
|
|
- method: 'delete',
|
|
|
- confirm: true,
|
|
|
- // display: i => {
|
|
|
- // // return !_this.groupList.find(stu => {
|
|
|
- // // return stu.stuid == i.id;
|
|
|
- // // });
|
|
|
- // return !_this.groupList.find(stu => stu.stuid == i.id);
|
|
|
- // },
|
|
|
- },
|
|
|
- // {
|
|
|
- // label: '管理任职',
|
|
|
- // icon: 'el-icon-check',
|
|
|
- // method: 'post',
|
|
|
- // },
|
|
|
- ],
|
|
|
- fields: [
|
|
|
- { label: '姓名', prop: 'name', filter: 'input' },
|
|
|
- { label: '性别', prop: 'gender' },
|
|
|
- { label: '民族', prop: 'nation' },
|
|
|
- { label: '学校', prop: 'school_name' },
|
|
|
- { label: '院系', prop: 'faculty' },
|
|
|
- { label: '专业', prop: 'major' },
|
|
|
- { label: '职务', prop: 'job' },
|
|
|
- { label: '手机号', prop: 'phone' },
|
|
|
- { label: '是否优秀', prop: 'is_fine', format: i => (i === '0' ? '否' : i === '1' ? '是' : '无资格') },
|
|
|
- ],
|
|
|
- list: [],
|
|
|
- total: 0,
|
|
|
- form: {},
|
|
|
- drawer: false,
|
|
|
- formFields: [
|
|
|
- { label: '姓名', model: 'name', type: 'text' },
|
|
|
- { label: '性别', model: 'gender', custom: true },
|
|
|
- { label: '手机号', model: 'phone', type: 'text' },
|
|
|
- { label: '职务', required: true, model: 'job', type: 'radio' },
|
|
|
- ],
|
|
|
- rules: {},
|
|
|
- // 组
|
|
|
- groupList: [],
|
|
|
- // 查询
|
|
|
- // 学生姓名
|
|
|
- stuname: '',
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.seachGroup();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- ...mapActions(['query', 'delete', 'computedIsFine', 'toExport']),
|
|
|
- ...group({ groupQuery: 'query' }),
|
|
|
- async seachGroup() {
|
|
|
- let classid = this.id;
|
|
|
- let res = await this.groupQuery({ classid });
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- let arr = res.data.map(item => item.students);
|
|
|
- arr = _.flattenDeep(arr);
|
|
|
- console.log(arr);
|
|
|
- this.$set(this, `groupList`, arr);
|
|
|
- }
|
|
|
- },
|
|
|
- async search({ skip = 0, limit = 10, ...info } = {}) {
|
|
|
- if (this.id) {
|
|
|
- if (this.stuname) info.name = this.stuname;
|
|
|
- const res = await this.query({ skip, limit, ...info, classid: this.id });
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- this.$set(this, `list`, res.data);
|
|
|
- this.$set(this, `total`, res.total);
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- // 添加
|
|
|
- addstu() {
|
|
|
- this.$router.push({ path: '/student/createStu' });
|
|
|
- },
|
|
|
- toEdit({ data }) {
|
|
|
- this.$router.push({ path: '/student/detail', query: { id: data.id } });
|
|
|
- },
|
|
|
- async toDelete({ data }) {
|
|
|
- const res = await this.delete(data.id);
|
|
|
- this.$checkRes(res, '删除成功', '删除失败');
|
|
|
- this.search();
|
|
|
- },
|
|
|
- toPost({ data }) {
|
|
|
- this.$set(this, `form`, JSON.parse(JSON.stringify(data)));
|
|
|
- this.drawer = true;
|
|
|
- },
|
|
|
- toClose() {
|
|
|
- this.drawer = false;
|
|
|
- this.form = {};
|
|
|
- },
|
|
|
- toreturn() {
|
|
|
- window.history.go(-1);
|
|
|
- },
|
|
|
- // 打印名牌
|
|
|
- toPrint() {
|
|
|
- this.$router.push({ path: '/classes/namCard', query: { id: this.id } });
|
|
|
- },
|
|
|
- // 计算优秀学员
|
|
|
- async toComputIsFine() {
|
|
|
- const res = await this.computedIsFine(this.defaultOption.classid);
|
|
|
- if (this.$checkRes(res, '优秀学员设置成功', res.errmsg || '优秀学员设置失败')) this.search();
|
|
|
- },
|
|
|
- // 导出学生名单
|
|
|
- async toExportList() {
|
|
|
- const msg = this.$message({ duration: 0, message: '正在导出,请稍后...' });
|
|
|
- const res = await this.toExport({ type: 'class', classid: this.id });
|
|
|
- msg.close();
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- const { data } = res;
|
|
|
- window.open(data);
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapState(['user', 'defaultOption']),
|
|
|
- id() {
|
|
|
- return this.defaultOption.classid;
|
|
|
- },
|
|
|
- mainTitle() {
|
|
|
- let meta = this.$route.meta;
|
|
|
- let main = meta.title || '';
|
|
|
- let sub = meta.sub || '';
|
|
|
- let title = main + sub;
|
|
|
- return title;
|
|
|
- },
|
|
|
- },
|
|
|
- watch: {
|
|
|
- id: {
|
|
|
- handler(val) {
|
|
|
- if (val) this.search();
|
|
|
- else this.$set(this, `list`, []);
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.printingBtn {
|
|
|
- text-align: right;
|
|
|
- padding: 10px 0;
|
|
|
-}
|
|
|
-</style>
|
|
|
+<template>
|
|
|
+ <div id="name-list">
|
|
|
+ <list-frame :title="mainTitle" @query="search" :total="total" :needFilter="false" :needAdd="false">
|
|
|
+ <el-col :span="24" class="printingBtn">
|
|
|
+ <!-- <el-button type="primary" size="mini" @click="toPrint()">打印名牌</el-button> -->
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-input placeholder="请输入学生姓名" v-model="stuname" class="input-with-select">
|
|
|
+ <el-button slot="append" icon="el-icon-search" @click="search()"></el-button>
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-button type="primary" size="mini" @click="addstu()">添加学生</el-button>
|
|
|
+ <el-button type="primary" size="mini" @click="toComputIsFine()" :disabled="this.defaultOption.classid ? false : true">设置优秀学员</el-button>
|
|
|
+ <el-button type="primary" size="mini" @click="toExportList()">导出学生名单</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <data-table :fields="fields" :data="list" :opera="opera" @edit="toEdit" @delete="toDelete" @post="toPost"> </data-table>
|
|
|
+ </list-frame>
|
|
|
+ <el-drawer title="任职" :visible.sync="drawer" direction="rtl" @close="toClose">
|
|
|
+ <data-form :data="form" :fields="formFields" :rules="rules" :isNew="false">
|
|
|
+ <template #radios="{item}">
|
|
|
+ <template v-if="item.model === 'job'">
|
|
|
+ <el-radio label="1">班长</el-radio>
|
|
|
+ <el-radio label="0">学委</el-radio>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template #custom="{ item, form }">
|
|
|
+ <template v-if="item.model === 'gender'">
|
|
|
+ {{ form[item.model] }}
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </data-form>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import _ from 'lodash';
|
|
|
+import listFrame from '@frame/layout/admin/list-frame';
|
|
|
+import dataTable from '@frame/components/data-table';
|
|
|
+import dataForm from '@frame/components/form';
|
|
|
+import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
+const { mapActions } = createNamespacedHelpers('student');
|
|
|
+const { mapActions: group } = createNamespacedHelpers('group');
|
|
|
+export default {
|
|
|
+ metaInfo: { title: '班级名单' },
|
|
|
+ name: 'name-list',
|
|
|
+ props: {},
|
|
|
+ components: {
|
|
|
+ listFrame,
|
|
|
+ dataTable,
|
|
|
+ dataForm,
|
|
|
+ },
|
|
|
+ data: function() {
|
|
|
+ var _this = this;
|
|
|
+ return {
|
|
|
+ opera: [
|
|
|
+ {
|
|
|
+ label: '编辑',
|
|
|
+ icon: 'el-icon-edit',
|
|
|
+ method: 'edit',
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // label: '删除',
|
|
|
+ // icon: 'el-icon-delete',
|
|
|
+ // method: 'delete',
|
|
|
+ // confirm: true,
|
|
|
+ // // display: i => {
|
|
|
+ // // // return !_this.groupList.find(stu => {
|
|
|
+ // // // return stu.stuid == i.id;
|
|
|
+ // // // });
|
|
|
+ // // return !_this.groupList.find(stu => stu.stuid == i.id);
|
|
|
+ // // },
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // label: '管理任职',
|
|
|
+ // icon: 'el-icon-check',
|
|
|
+ // method: 'post',
|
|
|
+ // },
|
|
|
+ ],
|
|
|
+ fields: [
|
|
|
+ { label: '姓名', prop: 'name', filter: 'input' },
|
|
|
+ { label: '性别', prop: 'gender' },
|
|
|
+ { label: '民族', prop: 'nation' },
|
|
|
+ { label: '学校', prop: 'school_name' },
|
|
|
+ { label: '院系', prop: 'faculty' },
|
|
|
+ { label: '专业', prop: 'major' },
|
|
|
+ { label: '职务', prop: 'job' },
|
|
|
+ { label: '手机号', prop: 'phone' },
|
|
|
+ { label: '是否优秀', prop: 'is_fine', format: i => (i === '0' ? '否' : i === '1' ? '是' : '无资格') },
|
|
|
+ ],
|
|
|
+ list: [],
|
|
|
+ total: 0,
|
|
|
+ form: {},
|
|
|
+ drawer: false,
|
|
|
+ formFields: [
|
|
|
+ { label: '姓名', model: 'name', type: 'text' },
|
|
|
+ { label: '性别', model: 'gender', custom: true },
|
|
|
+ { label: '手机号', model: 'phone', type: 'text' },
|
|
|
+ { label: '职务', required: true, model: 'job', type: 'radio' },
|
|
|
+ ],
|
|
|
+ rules: {},
|
|
|
+ // 组
|
|
|
+ groupList: [],
|
|
|
+ // 查询
|
|
|
+ // 学生姓名
|
|
|
+ stuname: '',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.seachGroup();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions(['query', 'delete', 'computedIsFine', 'toExport']),
|
|
|
+ ...group({ groupQuery: 'query' }),
|
|
|
+ async seachGroup() {
|
|
|
+ let classid = this.id;
|
|
|
+ let res = await this.groupQuery({ classid });
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ let arr = res.data.map(item => item.students);
|
|
|
+ arr = _.flattenDeep(arr);
|
|
|
+ console.log(arr);
|
|
|
+ this.$set(this, `groupList`, arr);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async search({ skip = 0, limit = 10, ...info } = {}) {
|
|
|
+ if (this.id) {
|
|
|
+ if (this.stuname) info.name = this.stuname;
|
|
|
+ const res = await this.query({ skip, limit, ...info, classid: this.id });
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$set(this, `list`, res.data);
|
|
|
+ this.$set(this, `total`, res.total);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 添加
|
|
|
+ addstu() {
|
|
|
+ this.$router.push({ path: '/student/createStu' });
|
|
|
+ },
|
|
|
+ toEdit({ data }) {
|
|
|
+ this.$router.push({ path: '/student/detail', query: { id: data.id } });
|
|
|
+ },
|
|
|
+ async toDelete({ data }) {
|
|
|
+ const res = await this.delete(data.id);
|
|
|
+ this.$checkRes(res, '删除成功', '删除失败');
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ toPost({ data }) {
|
|
|
+ this.$set(this, `form`, JSON.parse(JSON.stringify(data)));
|
|
|
+ this.drawer = true;
|
|
|
+ },
|
|
|
+ toClose() {
|
|
|
+ this.drawer = false;
|
|
|
+ this.form = {};
|
|
|
+ },
|
|
|
+ toreturn() {
|
|
|
+ window.history.go(-1);
|
|
|
+ },
|
|
|
+ // 打印名牌
|
|
|
+ toPrint() {
|
|
|
+ this.$router.push({ path: '/classes/namCard', query: { id: this.id } });
|
|
|
+ },
|
|
|
+ // 计算优秀学员
|
|
|
+ async toComputIsFine() {
|
|
|
+ const res = await this.computedIsFine(this.defaultOption.classid);
|
|
|
+ if (this.$checkRes(res, '优秀学员设置成功', res.errmsg || '优秀学员设置失败')) this.search();
|
|
|
+ },
|
|
|
+ // 导出学生名单
|
|
|
+ async toExportList() {
|
|
|
+ const msg = this.$message({ duration: 0, message: '正在导出,请稍后...' });
|
|
|
+ const res = await this.toExport({ type: 'class', classid: this.id });
|
|
|
+ msg.close();
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ const { data } = res;
|
|
|
+ window.open(data);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['user', 'defaultOption']),
|
|
|
+ id() {
|
|
|
+ return this.defaultOption.classid;
|
|
|
+ },
|
|
|
+ mainTitle() {
|
|
|
+ let meta = this.$route.meta;
|
|
|
+ let main = meta.title || '';
|
|
|
+ let sub = meta.sub || '';
|
|
|
+ let title = main + sub;
|
|
|
+ return title;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ id: {
|
|
|
+ handler(val) {
|
|
|
+ if (val) this.search();
|
|
|
+ else this.$set(this, `list`, []);
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+.printingBtn {
|
|
|
+ text-align: right;
|
|
|
+ padding: 10px 0;
|
|
|
+}
|
|
|
+</style>
|
