train-notice/src/views/worker/lesson-table.vue

<template>
  <div id="lesson-table" style="padding:10px 0">
    <van-row type="flex" gutter="5">
      <van-col span="6">
        <van-sidebar v-model="active">
          <van-sidebar-item v-for="(i, index) in dayList" :key="`${index}`" :title="dateTOPoint(i)"> </van-sidebar-item>
        </van-sidebar>
      </van-col>
      <van-col span="18">
        <van-cell v-for="(item, itemIndex) in getData(active)" :key="`${itemIndex}`">
          <template #title> <i class="el-icon-timer" style="padding-right:3px"></i>{{ item.time }} </template>
          <template>
            <i class="el-icon-notebook-2" style="padding-right:3px"></i><span style="color:#323233;">{{ item.subname }}</span>
          </template>
          <template v-if="item.teaid" #label>
            <i class="el-icon-user" style="padding-right:3px"></i><span style="color:#323233;">{{ item.teaname }}</span>
          </template>
        </van-cell>
      </van-col>
    </van-row>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'lesson-table',
  props: {
    dayList: { type: Array, default: () => [] },
    lessonList: { type: Object, default: () => {} },
  },
  components: {},
  data: function() {
    return {
      active: 0,
    };
  },
  created() {},
  methods: {
    getData(index) {
      return this.lessonList[this.dayList[index]];
    },
    getContent(date) {
      return date;
    },
    dateTOPoint(date) {
      let arr = date.split('-');
      if (arr.length > 0) return `${arr[1]}-${arr[2]}`;
      else return date;
    },
  },
  computed: {
    ...mapState(['user']),
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

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