From 0e025c01be2ba8c5a0f92be2c7453c6ea6f1f37c Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期四, 20 六月 2024 15:19:10 +0800 Subject: [PATCH] feat:考试列表测试数据 --- src/views/exam-list/data-list/index.vue | 79 +++++++++++++++++++++++++++++++++++++++ 1 files changed, 78 insertions(+), 1 deletions(-) diff --git a/src/views/exam-list/data-list/index.vue b/src/views/exam-list/data-list/index.vue index 239f314..28a0d1d 100644 --- a/src/views/exam-list/data-list/index.vue +++ b/src/views/exam-list/data-list/index.vue @@ -1,15 +1,92 @@ <template> <div class="list-container w-full h-full"> <el-scrollbar> - + <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">{{ item.name }}</div> + <div class="tag"> + <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> + <div class="time"> + 鑰冭瘯鏃堕棿: {{ item.startTime }} ~ {{ item.endTime }} + </div> + </div> + <div class="bottom-container flex text-sm text-gray-400"> + <div class="bottom-item"> + 鎬诲垎: {{ item.examScore }} + </div> + <div class="bottom-item"> + 棰樻暟: {{ item.examTotal }} + </div> + <div class="bottom-item"> + 绛旈鏃堕棿: {{ item.examTime }}鍒嗛挓 + </div> + </div> + </div> + <div class="right-container"> + <div class="button-container"> + <el-button type="primary" size="large" @click="examClick" :disabled="stateList[item.status].disabled">寮�濮嬭�冭瘯</el-button> + </div> + </div> + </div> + </el-card> </el-scrollbar> </div> </template> <script setup> +import { ref } from 'vue'; +import { Timer } from '@element-plus/icons-vue'; +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'); +} </script> <style lang="scss" scoped> +.item { + width: 100%; + min-height: 120px; +} +.bottom-item { + margin-right: 30px; +} </style> \ No newline at end of file -- Gitblit v1.8.0