From 06419b10e17c72e07f1c740836e5abb79df619d0 Mon Sep 17 00:00:00 2001 From: luohairen <3399054449@qq.com> Date: 星期一, 04 十一月 2024 17:55:38 +0800 Subject: [PATCH] 搭建错题本页面 --- src/assets/icons/icon3.png | 0 src/views/wrong-list/index.vue | 81 ++++++++++++++++++++ src/api/modules/wrong.js | 5 + src/router/index.js | 7 + src/views/menu/index.vue | 5 + src/views/wrong-list/data-list/index.vue | 104 ++++++++++++++++++++++++++ 6 files changed, 201 insertions(+), 1 deletions(-) diff --git a/src/api/modules/wrong.js b/src/api/modules/wrong.js new file mode 100644 index 0000000..a6f9243 --- /dev/null +++ b/src/api/modules/wrong.js @@ -0,0 +1,5 @@ +import service from "@/api"; + +export const getWrongList = (postData = {examName: '', pageIndex: 1, pageSize: 10}) => { + return service.post('/api/student/wrong/pageList',postData); +} \ No newline at end of file diff --git a/src/assets/icons/icon3.png b/src/assets/icons/icon3.png new file mode 100644 index 0000000..c887b95 --- /dev/null +++ b/src/assets/icons/icon3.png Binary files differ diff --git a/src/router/index.js b/src/router/index.js index a327d8e..29bbfbf 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -70,7 +70,12 @@ { path: '/personal-center', component: () => import('@/views/personal-center/index.vue'), - } + }, + //閿欓鏈� + { + path: '/wrong-list', + component: () => import('@/views/wrong-list/index.vue'), + }, ]; const router = createRouter({ diff --git a/src/views/menu/index.vue b/src/views/menu/index.vue index 31b6be8..b6987e4 100644 --- a/src/views/menu/index.vue +++ b/src/views/menu/index.vue @@ -58,6 +58,11 @@ iconPath: new URL('@/assets/icons/icon1.png', import.meta.url).href, path: '/grade-list' }, + { + title: '鎴戠殑閿欓', + iconPath: new URL('@/assets/icons/icon3.png', import.meta.url).href, + path: '/wrong-list' + }, ] }, ]); diff --git a/src/views/wrong-list/data-list/index.vue b/src/views/wrong-list/data-list/index.vue new file mode 100644 index 0000000..92856ce --- /dev/null +++ b/src/views/wrong-list/data-list/index.vue @@ -0,0 +1,104 @@ +<template> + <div class="list-container w-full h-full"> + <el-scrollbar> + <el-table + v-loading="loading" + :data="tableData" + border + :row-style="{height:'42px'}" + :cell-style="{padding: '0'}" + > + <el-table-column + align="center" + label="棰樼洰" + prop="title" + width="500px" + ></el-table-column> + <el-table-column + label="棰樺瀷" + align="center" + width="100px" + prop="questionTypeName" + ></el-table-column> + <el-table-column + align="center" + width="100px" + label="鍒嗘暟" + prop="score" + ></el-table-column> + <el-table-column + align="center" + width="100px" + label="闅惧害" + prop="difficult" + ></el-table-column> + <el-table-column + align="center" + width="150px" + label="璇曞嵎鍚嶇О" + prop="examName" + ></el-table-column> + <el-table-column + label="鎿嶄綔" + align="center" + fixed="right" + > + <template slot-scope="scope"> + <el-button type="primary" size="large" @click="checkWrong(scope.row.id)">鏌ョ湅閿欓</el-button> + </template> + </el-table-column> + </el-table> + + <pagination v-show="total>0" :total="total" :page.sync="searchForm.currentPage" + :limit.sync="searchForm.pageSize" + @pagination="dataList"/> + </el-scrollbar> + </div> +</template> + +<script setup> +import { ref } from 'vue'; +import { Timer } from '@element-plus/icons-vue'; +import { useRouter } from 'vue-router'; +import { useExamStore } from '@/store/index.js'; +import { getExamInfo } from '@/api/modules/exam.js'; + +const loading = ref(false); +const tableData = ref([]); +const total = ref(0); +const searchForm = ref({ + currentPage: 1, + pageSize: 10 +}); + +// const router = useRouter(); + +const props = defineProps({ + dataList: { + type: Array, + default: () => [] + } +}); + + +const checkWrong = (id) => { + router.push({ + name: 'wrong-list', + params: { + examId: id + } + }); +}; + +</script> + +<style lang="scss" scoped> +.item { + width: 100%; + min-height: 120px; +} + +.bottom-item { + margin-right: 30px; +} +</style> diff --git a/src/views/wrong-list/index.vue b/src/views/wrong-list/index.vue new file mode 100644 index 0000000..e0c48d3 --- /dev/null +++ b/src/views/wrong-list/index.vue @@ -0,0 +1,81 @@ +<template> + <div class="exam-list-container w-screen h-screen bg-slate-50 flex flex-col items-center"> + <NormalHeader class="shrink-0"></NormalHeader> + + <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%' }"> + <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-search flex items-center"> + <el-input v-model="searchText" placeholder="璇疯緭鍏ヨ�冭瘯鍚嶇О" :prefix-icon="Search" maxlength="20" @input="searchData"/> + <el-button type="primary" class="ml-4" @click="searchData">鎼滅储</el-button> + </div> + </div> + + <div class="card-main flex-1 my-5 relative"> + <div class="main-content absolute top-0 bottom-0 left-0 right-0" v-loading="loading"> + <DataList :dataList="dataList"></DataList> + </div> + </div> + + <div class="card-footer flex justify-center mb-7 shrink-0"> + <el-pagination background layout="prev, pager, next" :total="dataList.length" + :default-page-size="20" + :currentPage="currentIndex" + :hide-on-single-page="true" + @current-change="handleCurrentChange"/> + </div> + </div> + </el-card> + </div> + </div> + </div> + </div> +</template> + +<script setup> +import { ref } from 'vue'; + +import NormalHeader from '@/components/NormalHeader/index.vue'; +import DataList from './data-list/index.vue'; +import { getWrongList } from '@/api/modules/wrong.js'; + + +const searchText = ref(''); +const currentIndex = ref(1); + +const dataList = ref([]); + +const loading = ref(false); + +const getData = () => { + loading.value = true; + getWrongList({ examName: searchText.value }).then(res => { + dataList.value = res.data; + loading.value = false; + }).catch(err => { + loading.value = false; + }); +}; + +getData(); + +const searchData = () => { + getData(); +}; + +const handleClick = (tab, event) => { +}; + +const handleCurrentChange = (val) => { + getData(); +} +</script> + +<style lang="scss" scoped> +:deep(.el-tabs__nav-wrap:after) { + display: none; +} +</style> \ No newline at end of file -- Gitblit v1.8.0