index.vue

<!--
 * @Author: 纪泽龙 jizelong@qq.com
 * @Date: 2022-09-20 11:19:55
 * @LastEditors: 纪泽龙 jizelong@qq.com
 * @LastEditTime: 2022-09-28 13:24:36
 * @FilePath: /danger-manage-web/src/views/myLessons/idnex.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="myLessons-wrapper flex">
    <div class="left">
      <Left @examination="examination" />
    </div>
    <div class="right">
      <Right :list="list" />
    </div>
    <AnswerLesson
      v-if="answerOpen"
      :courseId="courseId"
      :userCourseId="userCourseId"
      :courseName = "courseName"
      :visible.sync="answerOpen"
    />
  </div>
</template>

<script>
import { getUserLessons } from "@/api/educationPlanExam/lessonsProgram";

import Left from "./components/Left";
import Right from "./components/Right";
import AnswerLesson from "./components/AnswerLesson";
export default {
  name: "myLessons",
  components: {
    Left,
    Right,
    AnswerLesson,
  },
  data() {
    return {
      answerOpen: false,
      courseId: "",
      userCourseId: "",
      courseName:"",
      list: [],
    };
  },
  created() {
    this.getUserLessons();
  },
  methods: {
    getUserLessons() {
      getUserLessons().then((res) => {
        console.log(res.rows);
        this.list = res.rows.filter(item=>item.state>0);
      });
    },
    examination(e) {
      this.courseId = e.courseId;
      this.userCourseId = e.userCourseId;
      this.courseName = e.courseName;
      // this.answerOpen=true;
    },
  },
};
</script>
<style lang="scss" scoped>
.myLessons-wrapper {
  width: 100%;
  height: calc(100vh - 50px);

  padding: 38px 18px 42px;
  box-sizing: border-box;
  > div {
  }
  .left {
    width: 72%;
    height: 100%;
    max-height: 940px;
    margin-right: 25px;
    border: 1px solid#BBBBBB;
    border-radius: 5px;
  }
  .right {
    flex: 1;
    width: 100%;
    height: 100%;
  }
}
</style>