train-director/src/views/classes/print.vue

<template>
  <div id="print">
    <listFrame :title="pageTitle" :needFilter="false" :needPag="false" :needAdd="false">
      <el-tabs v-model="active" type="border-card" stretch @tab-click="tabChange">
        <el-tab-pane label="打印名签" name="name" :lazy="true">
          <el-row type="flex" align="middle" justify="center" v-loading="loading">
            <el-col :span="18" style="padding-left:100px; min-height:500px">
              <name-card :list="studList"></name-card>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="打印证书" name="cert" :lazy="true">
          <cert-card :list="certstuList" :startdate="startdate" :enddate="enddate" :classname="classname" :term="term"></cert-card>
        </el-tab-pane>
        <el-tab-pane label="打印报到表" name="sign" :lazy="true">
          <sign-card v-loading="loading" :list="studList" :signclass="signclass"></sign-card>
        </el-tab-pane>
        <el-tab-pane label="打印班级课表" name="lesson" :lazy="true">
          <lesson-table v-loading="loading" :data="classInfo" :th="lth" :tr="ltr" :lessons="lessons"></lesson-table>
        </el-tab-pane>
      </el-tabs>
    </listFrame>
  </div>
</template>

<script>
import _ from 'lodash';
import axios from 'axios';
import listFrame from '@frame/layout/admin/list-frame';
import signCard from '@frame/parts/print/print-sign';
import nameCard from '@frame/parts/print/namCard.vue';
import certCard from '@frame/parts/print/certCard.vue';
import lessonTable from '@frame/parts/time-table.vue';
import { mapState, createNamespacedHelpers } from 'vuex';
const { mapActions: classes } = createNamespacedHelpers('classes');
const { mapActions: trainplan } = createNamespacedHelpers('trainplan');
const { mapActions: student } = createNamespacedHelpers('student');
const { mapActions: util } = createNamespacedHelpers('util');
const { mapActions: location } = createNamespacedHelpers('location'); //地点
const { mapActions: teacher } = createNamespacedHelpers('teacher'); //教师
const { mapActions: director } = createNamespacedHelpers('director'); //教师
const { mapActions: cerconfirm } = createNamespacedHelpers('cerconfirm');
export default {
  name: 'print',
  props: {},
  components: { listFrame, nameCard, signCard, lessonTable, certCard },
  data: function() {
    return {
      active: 'name',
      loading: false,
      studList: [],
      classInfo: {},
      lth: [], //table表头
      ltr: [], //table y轴
      lessons: [], //原始课表,取出来什么样就什么样
      startdate: '',
      enddate: '',
      classname: '',
      term: '',
      certstuList: [],
      signclass: {},
    };
  },
  created() {},
  methods: {
    ...trainplan({ planfetch: 'fetch' }),
    ...classes({ classesquery: 'query', getClass: 'fetch' }),
    ...student({ getStudentList: 'query' }),
    ...util({ modelFetch: 'fetch' }),
    ...location({ getLocation: 'fetch' }),
    ...teacher({ getTeacher: 'fetch' }),
    ...director({ getDirector: 'fetch' }),
    ...cerconfirm({ cerconfirmQuery: 'query' }),
    tabChange() {
      if (this.id) {
        if (this.active == 'name') this.nameList();
        if (this.active == 'cert') this.certList();
        if (this.active == 'sign') this.signList();
        if (this.active == 'lesson') this.classLesson();
      }
    },
    async nameList() {
      this.loading = true;
      let res = await this.getStudentList({ classid: this.id });
      if (this.$checkRes(res)) this.$set(this, `studList`, res.data);
      this.loading = false;
    },
    async signList() {
      this.loading = true;
      let res = await this.getStudentList({ classid: this.id });
      let classinfo = await this.getClass(this.id);
      if (this.$checkRes(res)) {
        this.$set(this, `studList`, res.data);
        this.$set(this, `signclass`, classinfo.data);
      }
      this.loading = false;
    },
    async classLesson() {
      this.loading = true;
      let classInfo = {};
      let cir = await this.getClass(this.id);
      if (!this.$checkRes(cir)) return;
      classInfo = cir.data;
      let res = await this.modelFetch({ model: 'lesson', classid: this.id });
      if (this.$checkRes(res)) {
        let { lessons } = res.data;
        let { x, y } = this.proLesson(lessons);
        this.$set(this, `lth`, x);
        this.$set(this, `ltr`, y);
        this.$set(this, `lessons`, lessons);
        classInfo = await this.getRemarkParts(classInfo);
        this.$set(this, `classInfo`, classInfo);
      }
      this.loading = false;
    },

    async certList() {
      this.loading = true;
      let classInfo = {};
      let cir = await this.getClass(this.id);
      if (!this.$checkRes(cir)) return;
      classInfo = cir.data;
      let { _id: classid, enddate, startdate, name: classname, term } = classInfo;
      let res = await this.cerconfirmQuery({ classid });
      if (this.$checkRes(res)) {
        this.$set(this, `certstuList`, res.data);
        this.$set(this, `startdate`, startdate);
        this.$set(this, `enddate`, enddate);
        this.$set(this, `classname`, classname);
        this.$set(this, `term`, term);
      }
      this.loading = false;
    },

    proLesson(data) {
      let duplicate = _.cloneDeep(data);
      let x = _.uniq(_.orderBy(duplicate, 'date', 'asc').map(i => i.date));
      let y = _.uniq(_.orderBy(duplicate, 'time', 'asc').map(i => i.time));
      return { x, y };
    },
    async getRemarkParts(data) {
      let { headteacherid, jslocationid, lyteacherid } = data;
      let aArr = [];
      aArr.push(this.getDirector(headteacherid));
      aArr.push(this.getLocation(jslocationid));
      axios.all(aArr).then(
        axios.spread((r1, r2) => {
          if (r1 && r1.errcode == 0) data.headteacher = r1.data.name;
          if (r2 && r2.errcode == 0) data.jslocation = r2.data.name;
        })
      );
      let check = data => {
        if (!data || data.errcode != 0) return false;
        let obj = _.get(data, `data`);
        if (!obj) return false;
        return obj.name;
      };
      //单独处理礼仪教师,因为数据可能从2个表来
      let res = await this.getDirector(lyteacherid);
      let name = check(res);
      if (name) data.lyteacher = name;
      else res = await this.getTeacher(lyteacherid);
      name = check(res);
      if (name) data.lyteacher = name;
      return data;
    },
  },
  computed: {
    ...mapState(['user', 'defaultOption']),
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
    id() {
      return this.defaultOption.classid;
    },
  },
  watch: {
    id: {
      handler(val) {
        if (val) {
          this.tabChange();
        } else {
          this.studList = [];
          this.classInfo = [];
          this.lth = [];
          this.ltr = [];
          this.lessons = [];
        }
      },
      immediate: true,
      deep: true,
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

<style lang="less" scoped></style>