feat: 页面绘制

2022-01-16 20:57:31 +08:00 · 2022-01-16 20:57:31 +08:00 · 7c3530e498
parent 584b2135f5
commit 7c3530e498
5 changed files with 119 additions and 35 deletions
--- a/src/api/myexam/exam.js
+++ b/src/api/myexam/exam.js
@ -2,6 +2,9 @@ import request from '@/utils/request'

 const examApi = {
    examList: 'exam/list', // 我的考试-预约考试列表
+    attendList: 'exam/attend', // 我的考试-已参加考试
+    exam: 'exam/exam', // 我的考试进入考试
+    viewReport: 'exam/viewReport' // 查看报告
 }

 export function reqExamList (params) {
@ -11,3 +14,27 @@ export function reqExamList (params) {
        params: params
    })
 }
+
+export function reqExamAttendList (params) {
+    return request({
+        url: examApi.attendList,
+        method: 'get',
+        params: params
+    })
+}
+
+export function reqExamExam (params) {
+    return request({
+        url: examApi.exam,
+        method: 'get',
+        params: params
+    })
+}
+
+export function reqExamViewReport (params) {
+    return request({
+        url: examApi.viewReport,
+        method: 'get',
+        params: params
+    })
+}
--- a/src/views/myexam/index.vue
+++ b/src/views/myexam/index.vue
@ -24,9 +24,20 @@
          <span slot="index" slot-scope="text, record, index">
            {{ index + 1 }}
          </span>
-          <span slot="action" slot-scope="text, record, index">
-            <a v-if="index % 2 == 0" @click="handlerGoExam">进入考试</a>
-            <a v-if="index % 2 == 1" disabled>已预约</a>
+          <template slot="testType" slot-scope="text, record">
+            <a-tag v-if="record.testType == '1'" color="red">必修课</a-tag>
+            <a-tag v-if="record.testType == '2'" color="blue">选修课</a-tag>
+          </template>
+          <template slot="examTime" slot-scope="text, record">
+            {{ record.examTime }}分钟
+          </template>
+          <span slot="action" slot-scope="text, record">
+            <template v-if="record.subscribeStatus == 0">
+              <a disabled>预约考试</a>
+            </template>
+            <template v-else>
+              <a @click="handlerGoExam(record)">进入考试</a>
+            </template>
          </span>
        </s-table>
      </a-tab-pane>
@ -40,8 +51,15 @@
          <span slot="index" slot-scope="text, record, index">
            {{ index + 1 }}
          </span>
-          <span slot="action" slot-scope="text, record, index">
-            <a @click="handlerGoReport">查看详情</a>
+          <template slot="testType" slot-scope="text, record">
+            <a-tag v-if="record.testType == '1'" color="red">必修课</a-tag>
+            <a-tag v-if="record.testType == '2'" color="blue">选修课</a-tag>
+          </template>
+          <template slot="examTime" slot-scope="text, record">
+            {{ record.examTime }}分钟
+          </template>
+          <span slot="action" slot-scope="text, record">
+            <a @click="handlerGoReport(record)">查看详情</a>
          </span>
        </s-table>
      </a-tab-pane>
@ -51,7 +69,7 @@

 <script>
 import { STable, SearchCom } from '@/components'
-import { reqExamList } from '@/api/myexam/exam'
+import { reqExamList, reqExamAttendList } from '@/api/myexam/exam'

 export default {
  components: { STable, SearchCom },
@ -74,23 +92,25 @@ export default {
        },
        {
          title: '考试科目',
-          dataIndex: 'name'
+          dataIndex: 'projectName'
        },
        {
          title: '准考证号',
-          dataIndex: 'carId'
+          dataIndex: 'candidateNo'
        },
        {
          title: '考试形式',
-          dataIndex: 'type'
+          dataIndex: 'testType',
+          scopedSlots: { customRender: 'testType' }
        },
        {
          title: '考试时间',
-          dataIndex: 'date'
+          dataIndex: 'examSdate'
        },
        {
          title: '考试时长',
-          dataIndex: 'length'
+          dataIndex: 'examTime',
+          scopedSlots: { customRender: 'examTime' }
        },
        {
          title: '考试资格',
@ -112,27 +132,29 @@ export default {
        },
        {
          title: '考试科目',
-          dataIndex: 'name'
+          dataIndex: 'projectName'
        },
        {
          title: '准考证号',
-          dataIndex: 'carId'
+          dataIndex: 'candidateNo'
        },
        {
          title: '考试形式',
-          dataIndex: 'type'
+          dataIndex: 'testType',
+          scopedSlots: { customRender: 'testType' }
        },
        {
          title: '答卷时间',
-          dataIndex: 'date'
+          dataIndex: 'practiceSdate'
        },
        {
          title: '考试时长',
-          dataIndex: 'length'
+          dataIndex: 'examTime',
+          scopedSlots: { customRender: 'examTime' }
        },
        {
          title: '考试成绩',
-          dataIndex: 'zige'
+          dataIndex: 'score'
        },
        {
          title: '操作',
@ -147,14 +169,13 @@ export default {
        })
      },
      loadExamDoneData: parameter => {
-        return reqExamList(Object.assign(parameter, this.queryParam)).then(res => {
+        return reqExamAttendList(Object.assign(parameter, this.queryParam)).then(res => {
          return res
        })
      }
    }
  },
  mounted () {
-    this.getExamTypeList()
  },
  methods: {
    // 搜索
@ -166,15 +187,14 @@ export default {
        this.$refs.examDoneColumns.refresh()
      }
    },
-    handlerGoExam () {
-      this.$router.push({ path: '/myexamDetail', query: { type: 'exam' } })
+    handlerGoExam (row) {
+      // 考试前5分钟才能进入考试界面(待办...)
+      // const diff = new Date().getTime() - new Date(examSdate).getTime()
+      // if(diff > -1000*60*5){}
+      this.$router.push({ path: '/myexamDetail', query: { type: 'exam', projectId: row.id } })
    },
-    handlerGoReport () {
-      this.$router.push({ path: '/myreport', query: { type: 'exam' } })
-    },
-    // 获取考试分类列表
-    getExamTypeList () {
-
+    handlerGoReport (row) {
+      this.$router.push({ path: '/myreport', query: { type: 'exam', reportId: row.id } })
    }
  }
 }
--- a/src/views/myexamDetail/index.vue
+++ b/src/views/myexamDetail/index.vue
@ -7,6 +7,7 @@
 <script>
 import DbExam from '@/components/DbExam/index'
 import { practiceStartAnswer, practiceExecuteSubmit } from '@/api/practice/practice'
+import { reqExamExam } from '@/api/myexam/exam.js'
 import _ from 'lodash'
 export default {
    components: { DbExam },
@ -26,15 +27,22 @@ export default {
      initData () {
        const { type } = this.query
        if (type === 'practice') {
-          console.log('练习')
          this.getPracticeDetail()
        }
+        if (type === 'exam') {
+          this.getExamDetail()
+        }
      },
      // 获取练习详情
      getPracticeDetail () {
        const query = this.query
        practiceStartAnswer({ projectId: Number(query.projectId), courseId: Number(query.courseId), type: Number(query.practiceType || 1) }).then(res => {
-          console.log('res', res)
+          this.examData = res.data
+        })
+      },
+      // 获取考试详情
+      getExamDetail () {
+        reqExamExam({ projectId: this.query.projectId }).then((res) => {
          this.examData = res.data
        })
      },
--- a/src/views/mynotice/index.vue
+++ b/src/views/mynotice/index.vue
@ -0,0 +1,15 @@
+<template>
+  <a-card :bordered="false">
+    我的公告
+  </a-card>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>
--- a/src/views/myreport/index.vue
+++ b/src/views/myreport/index.vue
@ -4,8 +4,8 @@
      <a-tab-pane key="1" tab="答题报告">
        <a-card :bordered="false" :bodyStyle="{padding: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}">
          <template slot="title">
-            <h3>{{viewReport.courseName}}</h3>
-            <div class="sub-info"><span>交卷时间：{{viewReport.submitTime}}</span><span v-if="viewReport.totalScore">答题用时：{{viewReport.totalScore}}</span></div>
+            <h3>{{ viewReport.courseName }}</h3>
+            <div class="sub-info"><span>交卷时间：{{ viewReport.submitTime }}</span><span v-if="viewReport.totalScore">答题用时：{{ viewReport.totalScore }}</span></div>
            <DbReport :data="viewReport.reportItems"></DbReport>
          </template>
        </a-card>
@ -13,7 +13,7 @@
      <a-tab-pane key="2" tab="查看解析">
        <a-card :bordered="false" :bodyStyle="{padding: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}">
          <template slot="title">
-            <h4>{{viewReport.courseName}}</h4>
+            <h4>{{ viewReport.courseName }}</h4>
            <div class="sub-info"><span>选择题30/30</span><span>选择题30/30</span><span>选择题30/30</span></div>
          </template>
          <template v-for="(item, index) in viewResolution" >
@ -32,6 +32,7 @@
 import DbQuestionInfoItem from '@/components/DbQuestionInfoItem/index.vue'
 import DbReport from '@/components/DbReport/index.vue'
 import { answerViewReport, answerViewResolution } from '@/api/practice/report'
+import { reqExamViewReport } from '@/api/myexam/exam.js'

 export default {
  components: { DbQuestionInfoItem, DbReport },
@ -44,11 +45,24 @@ export default {
    }
  },
  mounted () {
-    this.query = this.$route.query
+    const query = this.$route.query
+    this.query = query
+    if (query.type === 'practice') {
      this.getAnswerViewReport()
      this.getAnswerViewResolution()
+    }
+    if (query.type === 'exam') {
+      this.getExamViewReport()
+    }
  },
  methods: {
+    // 考试 start
+    getExamViewReport () {
+      reqExamViewReport({ projectId: this.query.reportId }).then(res => {
+        this.viewReport = res.data
+      })
+    },
+    // 练习 start
    getAnswerViewReport () {
      answerViewReport({ reportId: Number(this.query.reportId) }).then(res => {
        this.viewReport = res.data