From 0e025c01be2ba8c5a0f92be2c7453c6ea6f1f37c Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期四, 20 六月 2024 15:19:10 +0800 Subject: [PATCH] feat:考试列表测试数据 --- .env.development | 2 /dev/null | 0 src/api/index.js | 3 src/mock/exam.js | 302 +++++++++++++++++++++++++++++++++++++++++++ src/views/exam-list/data-list/index.vue | 52 +++++- components.d.ts | 3 src/views/exam-list/index.vue | 31 +++ vite.config.js | 2 src/api/modules/exam.js | 6 9 files changed, 381 insertions(+), 20 deletions(-) diff --git a/.env.development b/.env.development index 33da7b4..f6b70c2 100644 --- a/.env.development +++ b/.env.development @@ -1 +1 @@ -VITE_BASE_API_URL = ''; \ No newline at end of file +VITE_BASE_API_URL = \ No newline at end of file diff --git a/components.d.ts b/components.d.ts index 29dd682..c0d2a04 100644 --- a/components.d.ts +++ b/components.d.ts @@ -38,4 +38,7 @@ RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] } + export interface ComponentCustomProperties { + vLoading: typeof import('element-plus/es')['ElLoadingDirective'] + } } diff --git a/src/api/index.js b/src/api/index.js index 9f72466..4e76d1a 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -5,6 +5,7 @@ axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8"; + const service = axios.create({ baseURL: import.meta.env.VITE_BASE_API_URL, timeout: 15000, @@ -63,7 +64,7 @@ // response鎷︽埅鍣� service.interceptors.response.use( - (res) => { + (response) => { if (response.status === 200 && response.data.code === 200) return Promise.resolve(response.data); else return Promise.reject(response.data); }, diff --git a/src/api/modules/exam.js b/src/api/modules/exam.js new file mode 100644 index 0000000..287e89a --- /dev/null +++ b/src/api/modules/exam.js @@ -0,0 +1,6 @@ +import service from "@/api"; + + +export const getExamList = () => { + return service.get('/api/v1/getExamList'); +} \ No newline at end of file diff --git a/src/mock/exam.js b/src/mock/exam.js new file mode 100644 index 0000000..d0cbc20 --- /dev/null +++ b/src/mock/exam.js @@ -0,0 +1,302 @@ +export default [ + // 鑾峰彇鑰冭瘯璇曞嵎 + { + url: '/api/v1/getExamInfo', + method: 'GET', + response: () => { + return { + code: 200, + msg: 'Success', + data: { + examInfo: { + id: 1, + name: '鑰冭瘯1', + startTime: '2019-01-01 00:00:00', + endTime: '2019-01-01 00:00:00', + examQuestionList: [ + { + questionType: 1, + questionList: [ + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�123", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "3", + "difficult": 5 + }, + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "3", + "difficult": 5 + } + ] + }, + { + questionType: 2, + questionList: [ + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "5", + "difficult": 5 + }, + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "5", + "difficult": 5 + }, + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "5", + "difficult": 5 + }, + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "1+1=锛�", + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "5", + "difficult": 5 + } + ] + }, + { + questionType: 3, + questionList: [ + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "娴嬭瘯闊抽1", + "audioFile": '/test.mp3', + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "3", + "difficult": 5 + }, + { + "id": null, + "questionType": 1, + "gradeLevel": null, + "subjectId": 2, + "title": "娴嬭瘯闊抽2", + "audioFile": '/test.mp3', + "items": [ + { + "prefix": "A", + "content": "1" + }, + { + "prefix": "B", + "content": "2" + }, + { + "prefix": "C", + "content": "3" + }, + { + "prefix": "D", + "content": "4" + } + ], + "analyze": "闂皬鏈嬪弸", + "correct": "", + "score": "3", + "difficult": 5 + } + ] + }, + ] + } + } + }; + } + }, + // 鑾峰彇鑰冭瘯鍒楄〃 + { + url: '/api/v1/getExamList', + method: 'GET', + response: () => { + return { + code: 200, + msg: 'Success', + 'data|2-8': [ + { + 'id|+1': 1, + name: '娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯', + startTime: '2024-01-01 09:00:00', + endTime: '2024-01-01 11:00:00', + // 1:鏈紑濮� + // 2:杩涜涓� + // 3:宸茬粨鏉� + 'status|1': [ + 1, + 2, + 3 + ], + 'examTotal|20-60': 20, + 'examTime|30-120': 120, + 'examScore|60-100': 100 + } + ] + } + } + } +]; \ No newline at end of file diff --git a/src/mock/index.js b/src/mock/index.js deleted file mode 100644 index e69de29..0000000 --- a/src/mock/index.js +++ /dev/null diff --git a/src/views/exam-list/data-list/index.vue b/src/views/exam-list/data-list/index.vue index 2d4d5d0..28a0d1d 100644 --- a/src/views/exam-list/data-list/index.vue +++ b/src/views/exam-list/data-list/index.vue @@ -1,38 +1,40 @@ <template> <div class="list-container w-full h-full"> <el-scrollbar> - <el-card shadow="hover" class="mb-3"> + <el-card shadow="hover" class="mb-3" v-for="item in props.dataList"> <div class="item flex justify-between items-center"> <div class="left-container flex flex-col justify-between"> <div class="top-container flex items-center"> - <div class="title mr-5 text-xl font-bold">娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯</div> + <div class="title mr-5 text-xl font-bold">{{ item.name }}</div> <div class="tag"> - <el-tag type="primary" effect="light" round> - 鏈紑濮� + <el-tag :type="stateList[item.status].type" effect="light" round> + {{ stateList[item.status].text }} </el-tag> </div> </div> <div class="mid-container flex items-center my-4 text-gray-700"> - <el-icon class="mr-1"><Timer /></el-icon> + <el-icon class="mr-1"> + <Timer /> + </el-icon> <div class="time"> - 鑰冭瘯鏃堕棿: 2024-6-5 08:00 ~ 2024-6-5 10:00 + 鑰冭瘯鏃堕棿: {{ item.startTime }} ~ {{ item.endTime }} </div> </div> <div class="bottom-container flex text-sm text-gray-400"> <div class="bottom-item"> - 鎬诲垎: 100 + 鎬诲垎: {{ item.examScore }} </div> <div class="bottom-item"> - 棰樻暟: 20 + 棰樻暟: {{ item.examTotal }} </div> <div class="bottom-item"> - 绛旈鏃堕棿: 20鍒嗛挓 + 绛旈鏃堕棿: {{ item.examTime }}鍒嗛挓 </div> </div> </div> <div class="right-container"> <div class="button-container"> - <el-button type="primary" size="large" @click="examClick">寮�濮嬭�冭瘯</el-button> + <el-button type="primary" size="large" @click="examClick" :disabled="stateList[item.status].disabled">寮�濮嬭�冭瘯</el-button> </div> </div> </div> @@ -42,10 +44,35 @@ </template> <script setup> -import {ref} from 'vue'; +import { ref } from 'vue'; import { Timer } from '@element-plus/icons-vue'; -import {useRouter} from 'vue-router'; +import { useRouter } from 'vue-router'; const router = useRouter(); + +const props = defineProps({ + dataList: { + type: Array, + default: () => [] + } +}); + +const stateList = { + 1: { + text: '鏈紑濮�', + type: 'primary', + disabled: true + }, + 2: { + text: '杩涜涓�', + type: 'success', + disabled: false + }, + 3: { + text: '宸茬粨鏉�', + type: 'info', + disabled: true + } +}; const examClick = () => { router.push('/exam'); @@ -58,6 +85,7 @@ width: 100%; min-height: 120px; } + .bottom-item { margin-right: 30px; } diff --git a/src/views/exam-list/index.vue b/src/views/exam-list/index.vue index 5bb8091..289ae0f 100644 --- a/src/views/exam-list/index.vue +++ b/src/views/exam-list/index.vue @@ -5,7 +5,7 @@ <div class="list-container container grow relative"> <div class="list-content absolute top-0 bottom-0 left-0 right-0 py-4"> <div class="list-wrapper w-full h-full"> - <el-card class="h-full" :body-style="{height: '100%'}"> + <el-card class="h-full" :body-style="{ height: '100%' }"> <div class="card-wrapper w-full h-full flex flex-col px-8 box-border"> <div class="card-header flex justify-between items-center shrink-0"> <div class="header-tab"> @@ -22,10 +22,10 @@ </div> </div> - + <div class="card-main flex-1 my-5 relative"> - <div class="main-content absolute top-0 bottom-0 left-0 right-0"> - <DataList></DataList> + <div class="main-content absolute top-0 bottom-0 left-0 right-0" v-loading="loading"> + <DataList :dataList="dataList"></DataList> </div> </div> @@ -42,11 +42,33 @@ <script setup> import { ref } from 'vue'; + import NormalHeader from '@/components/NormalHeader/index.vue'; import DataList from './data-list/index.vue'; + import { Search } from '@element-plus/icons-vue'; + +import { getExamList } from '@/api/modules/exam.js'; + + const activeName = ref('1'); const searchText = ref(''); + +const dataList = ref([]); + +const loading = ref(false); + +const getData = () => { + loading.value = true; + getExamList().then(res => { + dataList.value = res.data; + loading.value = false; + }).catch(err => { + loading.value = false; + }); +}; + +getData(); const handleClick = (tab, event) => { }; @@ -56,5 +78,4 @@ :deep(.el-tabs__nav-wrap:after) { display: none; } - </style> \ No newline at end of file diff --git a/vite.config.js b/vite.config.js index 059f547..1386e32 100644 --- a/vite.config.js +++ b/vite.config.js @@ -23,7 +23,7 @@ }), viteMockServe({ - mockPath: 'mock', // mock 鏁版嵁瀛樻斁鐨勭洰褰� + mockPath: './src/mock', // mock 鏁版嵁瀛樻斁鐨勭洰褰� localEnabled: true, // 寮�鍙戠幆澧冨惎鐢� mock prodEnabled: false, // 鐢熶骇鐜绂佺敤 mock }), -- Gitblit v1.8.0