Skip to content

Commit 79fc138

Browse files
nxhawknxhawk
committed
feat: ui list exercise page
1 parent e4f376e commit 79fc138

File tree

8 files changed

+67
-16
lines changed

8 files changed

+67
-16
lines changed

‎src/components/Box.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<template lang="">
2+
<router-link to="/" >
3+
<div class="md:flex mb-6 gap-6 p-2 hover:bg-slate-100 rounded-md">
4+
<div class="md:w-4/12 h-fit">
5+
<img src="https://api.baitaptracnghiem.com/storage/images/vfOcrwr1mmEuj1HEE6jPFgQ4Hu2SdoFk7Z4bc09y.jpg" alt="exercise-background" class="w-fit rounded-lg object-contain"/>
6+
</div>
7+
<div class="flex flex-col justify-between">
8+
<h1 class="text-xl text-[#2b2d38] font-bold my-5 md:my-0">Bài tập trắc nghiệm về cực trị của hàm số</h1>
9+
<p class="text-[#8189a9] text-md hidden md:block">
10+
Bài tập trắc nghiệm cực trị của hàm số có đáp án chi tiết hay nhất được tổng hợp giúp các bạn ôn luyện lại các kiến thức đã học
11+
</p>
12+
<Category title="Web"/>
13+
</div>
14+
</div>
15+
</router-link>
16+
</template>
17+
18+
<script setup>
19+
import Category from "@/components/Button/Category.vue";
20+
</script>

‎src/components/Button/Category.vue

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<template lang="">
2+
<span class="border border-[#67c23a] text-[#67c23a] w-fit text-xs px-1 rounded">
3+
{{ title }}
4+
</span>
5+
</template>
6+
7+
<script setup>
8+
const props = defineProps({
9+
title: {
10+
type: String,
11+
required: true,
12+
}
13+
});
14+
</script>

‎src/components/ListBox.vue

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template lang="">
2+
<div>
3+
<Box v-for="n in 10" :key="n"/>
4+
</div>
5+
</template>
6+
7+
<script setup>
8+
import Box from "@/components/Box.vue";
9+
</script>

‎src/components/Navbar.vue

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,26 @@
11
<template lang="">
22
<div class="text-xs hidden md:flex uppercase font-semibold justify-between items-center flex-1">
33
<div class="flex gap-5">
4-
<div>Đề thi THPT</div>
5-
<div>Lớp 12</div>
6-
<div>Lớp 11</div>
7-
<div>Lớp 10</div>
8-
<div>Tiếng anh</div>
9-
<div>Đại học</div>
10-
<div>Trắc nghiệm tính cách MBTI</div>
4+
<div class="hover:text-gray-400 cursor-pointer">Đề thi THPT</div>
5+
<router-link :to="{ name: 'exercise', params: { classId: 'lop-12' } }" class="hover:text-gray-400">
6+
Lớp 12
7+
</router-link>
8+
<router-link :to="{ name: 'exercise', params: { classId: 'lop-11' } }" class="hover:text-gray-400">
9+
Lớp 11
10+
</router-link>
11+
<router-link :to="{ name: 'exercise', params: { classId: 'lop-10' } }" class="hover:text-gray-400">
12+
Lớp 10
13+
</router-link>
14+
<router-link :to="{ name: 'exercise', params: { classId: 'bai-tap-tieng-anh' } }" class="hover:text-gray-400">
15+
Tiếng anh
16+
</router-link>
17+
<router-link class="hover:text-gray-400">Đại học</router-link>
18+
<router-link class="hover:text-gray-400">Trắc nghiệm tính cách MBTI</router-link>
1119
</div>
1220
<Searchbar/>
1321
</div>
14-
<div class="flex md:hidden justify-end flex-1">
22+
23+
<div class="flex md:hidden justify-end flex-1 cursor-pointer">
1524
<Icon icon="pi-bars" className="text-xl"/>
1625
</div>
1726
</template>

‎src/layout/DefaultLayout.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template lang="">
22
<div>
33
<Header/>
4-
<div class="pt-12 min-h-screen">
4+
<div class="pt-12 min-h-screen px-5 md:px-20 mt-2">
55
<router-view/>
66
</div>
77
<Footer/>

‎src/router/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ const routes = [
1212
},
1313
{
1414
path: "/danh-sach-bai-tap/:classId",
15-
name: "course",
15+
name: "exercise",
1616
component: () => import("@/views/ExercisePage.vue"),
1717
},
1818
]

‎src/views/ExercisePage.vue

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
<template lang="">
22
<div>
3-
Exercise
3+
<ListBox/>
44
</div>
55
</template>
6-
<script setup lang="ts">
76

7+
<script setup lang="ts">
8+
import ListBox from "@/components/ListBox.vue";
89
</script>

‎src/views/HomePage.vue

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
<template lang="">
2-
<div class="px-5 md:px-20 mt-2">
3-
<ListCard title="Đề thi THPT" url="/"/>
4-
<ListCard title="Lớp 12" url="/"/>
5-
</div>
2+
<ListCard title="Đề thi THPT" url="/danh-sach-bai-tap/toan-de-thi-thpt"/>
3+
<ListCard title="Lớp 12" url="/danh-sach-bai-tap/lop-12"/>
64
</template>
75

86
<script setup>

0 commit comments

Comments
 (0)