From ba6fc3d1957fac8d11f5d9107919dd7cf1bace6f Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期二, 04 六月 2024 17:26:28 +0800
Subject: [PATCH] feat:考试列表布局
---
src/views/exam-list/data-list/index.vue | 15 +++++++
components.d.ts | 4 ++
src/views/exam-list/index.vue | 43 ++++++++++++++++++++-
3 files changed, 60 insertions(+), 2 deletions(-)
diff --git a/components.d.ts b/components.d.ts
index de775f2..a3e034d 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -11,10 +11,14 @@
ElButton: typeof import('element-plus/es')['ElButton']
ElCard: typeof import('element-plus/es')['ElCard']
ElCol: typeof import('element-plus/es')['ElCol']
+ ElInput: typeof import('element-plus/es')['ElInput']
+ ElPagination: typeof import('element-plus/es')['ElPagination']
ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+ ElTabPane: typeof import('element-plus/es')['ElTabPane']
+ ElTabs: typeof import('element-plus/es')['ElTabs']
ExamInfoDialog: typeof import('./src/components/ExamInfoDialog/index.vue')['default']
Header: typeof import('./src/components/Header/index.vue')['default']
HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
diff --git a/src/views/exam-list/data-list/index.vue b/src/views/exam-list/data-list/index.vue
new file mode 100644
index 0000000..239f314
--- /dev/null
+++ b/src/views/exam-list/data-list/index.vue
@@ -0,0 +1,15 @@
+<template>
+ <div class="list-container w-full h-full">
+ <el-scrollbar>
+
+ </el-scrollbar>
+ </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss" scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/exam-list/index.vue b/src/views/exam-list/index.vue
index b065285..3efe17d 100644
--- a/src/views/exam-list/index.vue
+++ b/src/views/exam-list/index.vue
@@ -1,18 +1,57 @@
<template>
- <div class="exam-list-container w-screen h-screen bg-slate-50 flex flex-col">
+ <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 grow-1">
+ <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">
+ <div class="header-tab">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
+ <el-tab-pane label="鍏ㄩ儴" name="1"></el-tab-pane>
+ <el-tab-pane label="鏈紑濮�" name="2"></el-tab-pane>
+ <el-tab-pane label="杩涜涓�" name="3"></el-tab-pane>
+ <el-tab-pane label="宸茬粨鏉�" name="4"></el-tab-pane>
+ </el-tabs>
+ </div>
+ <div class="header-search flex items-center">
+ <el-input v-model="searchText" placeholder="璇疯緭鍏ヨ�冭瘯鍚嶇О" :prefix-icon="Search" />
+ <el-button type="primary" class="ml-4">鎼滅储</el-button>
+ </div>
+ </div>
+ <div class="card-main grow my-5">
+ <DataList></DataList>
+ </div>
+
+ <div class="card-footer flex justify-center mb-7">
+ <el-pagination background layout="prev, pager, next" :total="1000" />
+ </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 { Search } from '@element-plus/icons-vue';
+const activeName = ref('1');
+const searchText = ref('');
+const handleClick = (tab, event) => {
+};
</script>
<style lang="scss" scoped>
+:deep(.el-tabs__nav-wrap:after) {
+ display: none;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0