train-student/src/views/class/newClass/daily.vue

<template>
  <div id="daily">
    <van-notice-bar color="#1989fa" background="#ecf9ff" left-icon="info-o" text="点击查看每天的评分" />
    <van-cell v-for="(stu, index) in data" :key="index" :title="stu.name" :value="getScore(stu.id)" @click="searchDailyList(stu)" />
    <van-dialog v-model="show" :show-confirm-button="user.job.includes(limitJob)" show-cancel-button @confirm="toSave">
      <template #title>
        <van-row style="padding:15px 0;" type="flex" justify="center">
          <van-col span="8">{{ form.name }}</van-col>
          <van-col span="2" v-if="user.job.includes(limitJob)">
            <el-button icon="el-icon-plus" type="primary" size="mini" circle @click="add"></el-button>
          </van-col>
        </van-row>
      </template>
      <van-notice-bar v-if="user.job.includes(limitJob)" color="#1989fa" background="#ecf9ff" left-icon="info-o" text="学委可以添加/修改平时分数" />
      <template v-if="user.job.includes(limitJob)">
        <van-field v-for="(i, index) in dailyList" :key="index" v-model="i.score" colon type="number" :label="i.date" placeholder="请输入平时分数" border />
      </template>
      <template v-else>
        <van-cell v-for="(i, index) in dailyList" :key="index" :title="i.date" :value="i.score" />
      </template>
    </van-dialog>
  </div>
</template>

<script>
const moment = require('moment');
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'daily',
  props: {
    data: { type: Array, default: () => [] },
    scoreList: { type: Array, default: () => [] },
    lesson: { type: Array, default: () => [] },
    classInfo: { type: Object, default: () => {} },
  },
  components: {},
  data: function() {
    return {
      show: false,
      limitJob: '学委',
      form: {},
      dailyList: [],
    };
  },
  created() {},
  methods: {
    getScore(stuid) {
      let list = this.scoreList.filter(f => f.studentid === stuid);
      const res = list.reduce((p, n) => p + (n['score'] * 1 || 0), 0);
      return res;
    },
    searchDailyList(stu) {
      this.$set(this, `form`, stu);
      let list = this.scoreList.filter(f => f.studentid === stu.id);
      this.show = true;
      list = _.orderBy(list, ['date'], ['asc']);
      this.$set(this, `dailyList`, list);
    },
    add() {
      const { startdate, enddate, id: classid } = this.classInfo;
      let obj = { classid, studentid: this.form.id, score: 0 };
      // 在分数列表中找到该学生的所有日常分数
      let list = _.cloneDeep(this.dailyList);
      if (list.length <= 0) {
        let lesson = this.findDate(startdate, startdate, enddate);
        if (lesson) (obj.date = lesson.date), (obj.subid = lesson.subid);
      } else {
        let last = _.last(list);
        let date = moment(last.date)
          .add(1, 'days')
          .format('YYYY-MM-DD');
        let lesson = this.findDate(date, startdate, enddate);
        if (lesson) (obj.date = lesson.date), (obj.subid = lesson.subid);
      }
      list.push(obj);
      if (obj.date) this.$set(this, `dailyList`, list);
      else this.$toast('无法添加,已添加本班所有上课的日期');
    },
    findDate(date, start, end) {
      let r = this.lesson.find(f => f.date == date);
      while (!r) {
        date = moment(date)
          .add(1, 'days')
          .format('YYYY-MM-DD');
        if (moment(date).isBetween(start, end, null, '[]')) {
          r = this.lesson.find(f => f.date == date);
        } else break;
      }
      return r;
    },
    toSave() {
      console.log(this.dailyList);
      this.$emit('save', _.cloneDeep(this.dailyList));
    },
  },
  computed: {
    ...mapState(['user']),
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

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