From 5abf73892ba4e5622cc9d4f98c4591850b99b93f Mon Sep 17 00:00:00 2001
From: khj0414 <khj0414@local-host.co.kr>
Date: Tue, 1 Apr 2025 10:27:03 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A9=94=EC=9D=B8=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/main/MainVote.vue     | 53 ++++++++++++++++++++++++++++
 src/components/main/MainWordDict.vue | 45 +++++++++++++++++++++++
 src/views/MainView.vue               | 14 +++++++-
 3 files changed, 111 insertions(+), 1 deletion(-)
 create mode 100644 src/components/main/MainVote.vue
 create mode 100644 src/components/main/MainWordDict.vue

diff --git a/src/components/main/MainVote.vue b/src/components/main/MainVote.vue
new file mode 100644
index 0000000..ddf77a5
--- /dev/null
+++ b/src/components/main/MainVote.vue
@@ -0,0 +1,53 @@
+<template>
+<div class="col-md-6 col-lg-4 col-xl-4 order-0 mb-6">
+    <div class="card h-100">
+        <div class="card-header d-flex justify-content-between">
+            <div class="card-title mb-0">
+                <h5 class="mb-1 me-2">투표진행</h5>
+            </div>
+        </div>
+    <div class="card-body">
+        <ul class="p-0 m-0">
+            <li class="d-flex align-items-center mb-5">
+                <div class="d-flex w-100 flex-wrap align-items-center justify-content-between gap-2">
+                    <div class="me-2">
+                        <div class="d-flex flex-wrap align-items-center">
+                        <div class="avatar avatar-sm me-2">
+                            <img src="../../assets/img/avatars/1.png" alt="Avatar" class="rounded-circle"
+                            @error="$event.target.src = '/img/icons/icon.png'">
+                        </div>
+                        <div>
+                            <p class="mb-0 fw-medium">12월 회식투표</p>
+                        </div>
+                        </div>
+                        <small>2025-01-02 11:20~2025-01-02 11:20</small>
+                    </div>
+                    <div class="d-flex w-100 flex-wrap align-items-center justify-content-between gap-2">
+                        <div class="me-2">
+                            <div class="d-flex flex-wrap align-items-center">
+                                <div class="avatar avatar-sm me-2">
+                                    <img src="../../assets/img/avatars/1.png" alt="Avatar" class="rounded-circle"
+                                    @error="$event.target.src = '/img/icons/icon.png'">
+                                </div>
+                                <div>
+                                    <p class="mb-0 fw-medium">커피타임 장소 투표해요</p>
+                                </div>
+                            </div>
+                            <small>2025-01-02 11:20~2025-01-02 11:20</small>
+                        </div>
+                    </div>
+                </div>
+            </li>
+        </ul>
+    </div>
+    </div>
+</div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/components/main/MainWordDict.vue b/src/components/main/MainWordDict.vue
new file mode 100644
index 0000000..5099379
--- /dev/null
+++ b/src/components/main/MainWordDict.vue
@@ -0,0 +1,45 @@
+<template>
+<div class="col-md-6 col-lg-4 col-xl-4 order-0 mb-6">
+    <div class="card h-100">
+        <div class="card-header d-flex justify-content-between">
+            <div class="card-title mb-0">
+                <h5 class="mb-1 me-2">용어집</h5>
+            </div>
+        </div>
+        <div class="card-body">
+            <ul class="p-0 m-0">
+                <li class="d-flex align-items-center mb-5">
+                    <div class="avatar flex-shrink-0 me-3">
+                        <span class="avatar-initial rounded bg-label-primary"><span class="avatar-initial rounded bg-label-primary"><span class="avatar-initial rounded bg-label-primary">it</span></span></span>
+                    </div>
+                    <div class="d-flex w-100 flex-wrap align-items-center justify-content-between gap-2">
+                        <div class="me-2">
+                            <h6 class="mb-0">css</h6>
+                            <small>class 주는방법은 ...</small>
+                        </div>
+                    </div>
+                </li>
+                <li class="d-flex align-items-center mb-5">
+                    <div class="avatar flex-shrink-0 me-3">
+                        <span class="avatar-initial rounded bg-label-primary"><span class="avatar-initial rounded bg-label-primary"><span class="avatar-initial rounded bg-label-primary">it</span></span></span>
+                    </div>
+                    <div class="d-flex w-100 flex-wrap align-items-center justify-content-between gap-2">
+                        <div class="me-2">
+                            <h6 class="mb-0">css</h6>
+                            <small>class 주는방법은 ...</small>
+                        </div>
+                    </div>
+                </li>
+            </ul>
+        </div>
+    </div>
+</div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 287a196..22388f7 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -1,13 +1,25 @@
 <template>
     <div class="container-xxl flex-grow-1 container-p-y pb-0">
-        <MainEventCalendar />
+        <MainEventCalendar  />
         <MemberManagement v-if="isAdmin" />
+        <div class="row mt-4">
+            <!-- 게시판 -->
+
+            <!-- 용어집 -->
+            <main-word-dict />
+            <!-- 투표 -->
+            <main-vote />
+
+
+        </div>
     </div>
 </template>
 
 <script setup>
     import MainEventCalendar from '@/components/main/MainEventCalendar.vue';
     import MemberManagement from '@/components/main/MemberManagement.vue';
+    import MainWordDict from '@c/main/MainWordDict.vue';
+    import MainVote from '@c/main/MainVote.vue';
     import { useUserInfoStore } from '@/stores/useUserInfoStore';
     import { inject, onMounted, ref } from 'vue';
     import $api from '@api';