add page courses and tasks

assets/css/course-card.scss

@@ -4,6 +4,7 @@
   height: 280px;
   padding: 0;
   border-radius: 5px;
+  margin-bottom: 20px;
 
   &__picture{
     width: 320px;

assets/css/person.scss

@@ -108,4 +108,13 @@
     height: 400px;
     margin: 20px 20px;
   }
+
+  &__list{
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-end;
+    justify-content: space-between;
+    width: 100%;
+    padding: 20px 10px;
+  }
 }

layouts/person.vue

@@ -52,12 +52,12 @@
     },
     methods: {
       handleSelect(index){
-        const routes=['/person/info', '/person/identification', '/person/statistics', '/person/orders'];
+        const routes=['/person/info', '/person/identification', '/person/statistics', '/person/courses', '/person/tasks', '/person/orders'];
         this.$router.push(routes[index-1]);
       }
     },
     mounted(){
-      const routes=['/person/info', '/person/identification', '/person/statistics', '/person/orders'];
+      const routes=['/person/info', '/person/identification', '/person/statistics', '/person/courses', '/person/tasks', '/person/orders'];
       this.activeIndex = (1 + routes.indexOf(this.$router.app._route.path)) + "";
     }
   }

pages/admin/checkApplications.vue

@@ -6,7 +6,6 @@
     <el-table
       :data="applications"
       stripe
-      height="500"
       class="main-card__table"
     >
       <el-table-column

pages/admin/userAdmin.vue

@@ -6,7 +6,6 @@
     <el-table
       :data="users"
       stripe
-      height="500"
       class="main-card__table"
     >
       <el-table-column

pages/person/courses.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="main-card__body" v-loading="pageLoading">
+    <h1 class="main-card__title">
+      我的课程
+    </h1>
+    <div class="main-card__list">
+      <course-card
+        v-for="(item,index) in courses"
+        v-bind:key="index"
+        :picture="item.picture"
+        :title="item.title"
+        :description="item.description"
+        :url="item.url"
+        :origin="item.origin"
+      >
+      </course-card>
+    </div>
+  </div>
+</template>
+
+<script>
+  import CourseCard from '~/components/CourseCard'
+
+  export default {
+    name: "courses",
+    layout: 'person',
+    components: {
+      CourseCard,
+    },
+    data(){
+      return {
+        pageLoading: true,
+        courses: [
+          {
+            title: '基于Java的面向对象编程范式',
+            origin: '中国大学MOOC',
+            picture: '/image/java.png',
+            url: 'http://mooc.seecoder.cn',
+            description: '了解编程基本思想，养成编程基本习惯，理解面向对象思想'
+          },
+          {
+            title: '软件工程与计算I',
+            origin: '南京大学',
+            picture: '/image/SE1.png',
+            url: 'http://mooc.seecoder.cn',
+            description: '通过Scheme、Python和Java语言，让你分别体会函数式编程范式、结构化编程范式和面向对象编程范式'
+          },
+          {
+            title: '软件工程与计算II',
+            origin: '南京大学',
+            picture: '/image/SE2.png',
+            url: 'http://seec.seecoder.cn',
+            description: '基于DevOps培养团队开发中小规模软件系统的能力'
+          },
+        ],
+      }
+    },
+    mounted(){
+      //this.getCourses();
+      this.pageLoading = false;
+    },
+    methods:{
+      getCourses(){
+
+      }
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  @import '~/assets/css/person.scss';
+</style>
+

pages/person/tasks.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="main-card__body" v-loading="pageLoading">
+    <h1 class="main-card__title">
+      待办事项
+    </h1>
+    <el-table
+      :data="tasks"
+      stripe
+      class="main-card__table"
+    >
+      <el-table-column
+        type="index"
+        width="50">
+      </el-table-column>
+      <el-table-column
+        prop="title"
+        label="标题">
+      </el-table-column>
+      <el-table-column
+        prop="type"
+        label="类型"
+        width="60"
+      >
+      </el-table-column>
+      <el-table-column
+        prop="startTime"
+        label="起始时间"
+        width="100">
+      </el-table-column>
+      <el-table-column
+        prop="endTime"
+        label="结束时间"
+        width="100">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        label="操作"
+        width="60">
+        <template slot-scope="scope">
+          <el-button @click="deal(scope.row)" type="text" size="small">处理</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "tasks",
+    layout: 'person',
+    data(){
+      return{
+        tasks: [],
+        pageLoading: true
+      }
+    },
+    mounted(){
+      this.getTasks();
+      this.pageLoading = false;
+    },
+    methods: {
+      getTasks() {
+        this.tasks =
+          [
+            {title: 'Warmup-Java-01', type: '测验', startTime: '2020-04-14 00:00', endTime: '2020-05-31 00:00', url: 'http://mooc.seecoder.cn/exam/7087'},
+            {title: 'Lab10-TicTacToe', type: '测验', startTime: '2020-05-01 00:00', endTime: '2020-05-31 00:00', url: 'http://mooc.seecoder.cn/exam/7087'},
+            {title: 'Warmup-Java-02', type: '测验', startTime: '2020-04-30 00:00', endTime: '2020-06-14 00:00', url: 'http://mooc.seecoder.cn/exam/6962'},
+            {title: '大作业-01-CommandLineUtil', type: '测验', startTime: '2020-05-08 00:00', endTime: '2020-06-14 00:00', url: 'http://mooc.seecoder.cn/exam/7593'},
+            {title: 'JVVM-02-ClassFileReader', type: '测验', startTime: '2020-05-12 00:00', endTime: '2020-06-14 00:00', url: 'http://mooc.seecoder.cn/exam/7856'},
+            {title: 'JVVM-02-ClassFileParser', type: '测验', startTime: '2020-05-19 00:00', endTime: '2020-06-14 00:00', url: 'http://mooc.seecoder.cn/exam/8120'},
+            {title: '第三阶段代码作业', type: '作业', startTime: '2020-05-04 12:00', endTime: '2020-06-15 12:00', url: 'http://seec.seecoder.cn/course-student/2/code/504'},
+            {title: 'Homework Playground', type: '测验', startTime: '2020-05-01 00:00', endTime: '2020-06-28 00:00', url: 'http://mooc.seecoder.cn/exam/7088'},
+          ]
+        ;
+      },
+      deal(row){
+        window.location.href = row.url;
+      }
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  @import '~/assets/css/person.scss';
+</style>