From b740ef18cccf3c3a04d2b8769806fc9b3d897dc0 Mon Sep 17 00:00:00 2001
From: Huichan Bak <hc.bak@outlook.com>
Date: Tue, 17 Dec 2024 17:41:10 +0900
Subject: [PATCH 1/5] =?UTF-8?q?chore:=20axios=20baseURL,=20=ED=99=98?=
 =?UTF-8?q?=EA=B2=BD=EB=B3=80=EC=88=98=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                |  3 ++-
 SCM/frontend/src/axios.js | 15 +++++++++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 SCM/frontend/src/axios.js

diff --git a/.gitignore b/.gitignore
index 47470ca0..72574faa 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
 env.properties
-.idea
\ No newline at end of file
+.env
+.idea
diff --git a/SCM/frontend/src/axios.js b/SCM/frontend/src/axios.js
new file mode 100644
index 00000000..c3017359
--- /dev/null
+++ b/SCM/frontend/src/axios.js
@@ -0,0 +1,15 @@
+import axios from 'axios';
+
+const instance = axios.create({
+  baseURL: import.meta.env.VITE_API_URL,
+//   headers: {
+//     common: {
+//       'Authorization': 'AUTH_TOKEN'
+//     },
+//     post: {
+//       'Content-Type': 'application/x-www-form-urlencoded'
+//     }
+//   }
+});
+
+export default instance;

From b838a9c55b40dadaff4cc22718a792dbcc9b0e42 Mon Sep 17 00:00:00 2001
From: Huichan Bak <hc.bak@outlook.com>
Date: Tue, 17 Dec 2024 17:43:22 +0900
Subject: [PATCH 2/5] =?UTF-8?q?feat:=20=EA=B2=AC=EC=A0=81=EC=84=9C=20?=
 =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=ED=94=84=EB=A1=A0=ED=8A=B8=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/quotation/QuotationList.vue    | 119 +++++++++++++-----
 1 file changed, 86 insertions(+), 33 deletions(-)

diff --git a/SCM/frontend/src/components/quotation/QuotationList.vue b/SCM/frontend/src/components/quotation/QuotationList.vue
index a43d0375..0394bb4c 100644
--- a/SCM/frontend/src/components/quotation/QuotationList.vue
+++ b/SCM/frontend/src/components/quotation/QuotationList.vue
@@ -1,22 +1,42 @@
 <script setup>
-import { ref } from 'vue';
+import { ref, onMounted, watch } from 'vue';
+import axios from "@/axios"
 
-// 임시 데이터 셋
-const rows = ref(123);
-const perPage = ref(10);
+const quotationList = ref([]);
 const currentPage = ref(1);
-const items = ref([
-{ id: '2024/12/03 - 2', item: '김치볶음밥, 치즈볶음밥, 그냥볶음밥', client: '대한항공', quotation_date: '2024/1/1', status: '주문 전' },
-{ id: '2024/12/03 - 1', item: '김치볶음밥, 치즈볶음밥, 그냥볶음밥', client: '아시아나항공', quotation_date: '2024/1/1', status: '주문 후' },
-{ id: '2024/12/03 - 1', item: null, client: '아시아나항공', quotation_date: '2024/1/1', status: '주문 후' },
-{ id: '2024/12/03 - 1', item: null, client: '아시아나항공', quotation_date: '2024/1/1', status: '주문 후' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' },
-{ id: '위에', client: '거래처', quotation_date: '2024/1/1', status: '반려' }
-]);
+const totalPage = ref(1);
+const totalQuotation = ref(0);
+const searchPage = ref(1);
+const searchSize = ref(10);
+const searchStartDate = ref(null);
+const searchEndDate = ref(null);
+const searchClient = ref(null);
+const searchStatus = ref(null);
+
+const fetchQuotationList = async () => {
+    try {
+        const response = await axios.get(`quotation`, {
+            params: {
+                page: searchPage.value,
+                size: searchSize.value,
+                startDate: searchStartDate.value,
+                endDate: searchEndDate.value,
+                clientName: searchClient.value,
+                quotationStatus: searchStatus.value
+            }
+        });
+
+        quotationList.value = response.data.quotation;
+        currentPage.value = response.data.currentPage;
+        totalPage.value = response.data.totalPages;
+        totalQuotation.value = response.data.totalQuotation;
+
+        console.log(quotationList.value);
+
+    } catch (error) {
+        console.log(error);
+    }
+}
 
 // 선택한 Item 확장 | 축소
 function itemExtend(event) {
@@ -41,6 +61,29 @@ function addItemCard() {
 
 }
 
+onMounted(() => {
+    fetchQuotationList();
+});
+
+watch([searchStartDate, searchEndDate], () => {
+    search();
+});
+
+watch(searchPage, () => {
+    fetchQuotationList();
+});
+
+function check(status) {
+    searchStatus.value.has(status) ? searchStatus.value.delete(status)
+                                   : searchStatus.value.add(status);
+}
+
+function search() {
+    searchPage.value = 1;
+
+    fetchQuotationList();
+}
+
 </script>
 
 <template>
@@ -49,31 +92,31 @@ function addItemCard() {
             <div class="side-box card">
                 <div class="card-body">
                     <p class="card-title">견적일</p>
-                    <input type="date" style="max-width: 40%;"/> ~ <input type="date" style="max-width: 40%;"/>
+                    <input type="date" v-model="searchStartDate" style="max-width: 40%;"/> ~ <input type="date" v-model="searchEndDate" style="max-width: 40%;"/>
                 </div>
             </div>
             <div class="side-box card">
                 <div class="card-body">
                     <p class="card-title">거래처명</p>
                     <b-input-group class="mt-3">
-                        <b-form-input></b-form-input>
-                        <b-input-group-text><svg width="1em" id="Layer_1" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M344.5,298c15-23.6,23.8-51.6,23.8-81.7c0-84.1-68.1-152.3-152.1-152.3C132.1,64,64,132.2,64,216.3  c0,84.1,68.1,152.3,152.1,152.3c30.5,0,58.9-9,82.7-24.4l6.9-4.8L414.3,448l33.7-34.3L339.5,305.1L344.5,298z M301.4,131.2  c22.7,22.7,35.2,52.9,35.2,85c0,32.1-12.5,62.3-35.2,85c-22.7,22.7-52.9,35.2-85,35.2c-32.1,0-62.3-12.5-85-35.2  c-22.7-22.7-35.2-52.9-35.2-85c0-32.1,12.5-62.3,35.2-85c22.7-22.7,52.9-35.2,85-35.2C248.5,96,278.7,108.5,301.4,131.2z"/></svg></b-input-group-text>
+                        <b-form-input v-model="searchClient"></b-form-input>
+                        <b-button variant="light" class="button" @click="search()"><searchIcon class="icon"/></b-button>
                     </b-input-group>
                 </div>
             </div>
             <div class="side-box card">
                 <div class="card-body">
                     <p class="card-title">견적서 상태</p>
-                    <b-form-checkbox>주문 전</b-form-checkbox>
-                    <b-form-checkbox>주문 후</b-form-checkbox>
-                    <b-form-checkbox>반려</b-form-checkbox>
+                    <template v-for="quotationStatus in quotationStatusList">
+                        <b-form-checkbox @click="check(quotationStatus.key)">{{ quotationStatus.value }}</b-form-checkbox>
+                    </template>
                 </div>
             </div>
         </div>
         <div class="col-md-9">
             <div style="width: 90%;">
                 <div class="d-flex justify-content-between">
-                    <div>검색결과: {{ rows }}개</div>
+                    <div>검색결과: {{ totalQuotation }}개</div>
                     <b-button variant="light" size="sm" class="button">견적서 등록</b-button>
                 </div>
                 <div class="list-headline row">
@@ -82,22 +125,27 @@ function addItemCard() {
                     <div class="list-headvalue col-2">견적일</div>
                     <div class="list-headvalue col-2">상태</div>
                 </div>
+                <template v-if="quotationList.length > 0">
                 <div style="max-height: 600px; overflow-y: auto;">
-                    <div v-for="item in items" :key="item.id" class="list-line row" @click="itemExtend">
-                        <div class="col-6">{{ item.id }}<br>
-                            <div v-if="!item.item"><br></div>
-                            <div v-else>{{ item.item }}</div></div>
-                        <div class="list-value col-2">{{ item.client }}</div>
-                        <div class="list-value col-2">{{ item.quotation_date }}</div>
-                        <div class="list-value col-2">{{ item.status }}</div>
+                    <div v-for="quotation in quotationList" :key="quotation.quotationSeq" class="list-line row" @click="itemExtend">
+                        <div class="col-6">{{ quotation.quotationName }}<br>
+                            <div v-if="!quotation.itemName"><br></div>
+                            <div v-else>{{ quotation.itemName }}</div></div>
+                        <div class="list-value col-2">{{ quotation.clientName }}</div>
+                        <div class="list-value col-2">{{ quotation.quotationQuotationDate }}</div>
+                        <div class="list-value col-2">{{ quotation.quotationStatus }}</div>
                     </div>
                 </div>
+                </template>
+                <template v-else>
+                    <b-card-text class="no-list-text">해당 검색 조건에 부합하는 견적서가 존재하지 않습니다.</b-card-text>
+                </template>
             </div>
             <div class="pagenation">
                 <b-pagination
-                    v-model="currentPage"
-                    :total-rows="rows"
-                    :per-page="perPage">
+                    v-model="searchPage"
+                    :total-rows="totalQuotation"
+                    :per-page="searchSize">
                 </b-pagination>
             </div>
         </div>
@@ -154,4 +202,9 @@ div {
     margin-top: 20px;
 }
 
+.no-list-text {
+    text-align: center;
+    margin-top: 100px;
+}
+
 </style>

From 6091f6721e03dea89d9b2b961934ebcaad8fd848 Mon Sep 17 00:00:00 2001
From: Huichan Bak <hc.bak@outlook.com>
Date: Wed, 18 Dec 2024 09:47:42 +0900
Subject: [PATCH 3/5] =?UTF-8?q?refactor:=20=EA=B2=AC=EC=A0=81=EC=84=9C=20?=
 =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EC=A1=B0=ED=9A=8C=20=EC=83=81=ED=83=9C=20?=
 =?UTF-8?q?=EC=A1=B0=EA=B1=B4=20=EB=A6=AC=EC=8A=A4=ED=8A=B8=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../query/controller/QuotationQueryController.java          | 2 +-
 .../backend/quotation/query/mapper/QuotationMapper.java     | 4 ++--
 .../quotation/query/service/QuotationQueryService.java      | 2 +-
 .../main/resources/mappers/quotation/QuotationMapper.xml    | 6 ++++--
 .../quotation/query/service/QuotationQueryServiceTest.java  | 3 ++-
 5 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
index 49b92b6a..bfb51ade 100644
--- a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
+++ b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
@@ -30,7 +30,7 @@ public ResponseEntity<QuotationListResponse> readQuotationList(
             @RequestParam(required = false) @DateTimeFormat(iso = DateTimeFormat.ISO.DATE) LocalDate startDate,
             @RequestParam(required = false) @DateTimeFormat(iso = DateTimeFormat.ISO.DATE) LocalDate endDate,
             @RequestParam(required = false) String clientName,
-            @RequestParam(required = false) String quotationStatus) {
+            @RequestParam(required = false) List<String> quotationStatus) {
 
         return ResponseEntity.ok(quotationQueryService.readQuotationList(
                 page, size, startDate, endDate, clientName, quotationStatus));
diff --git a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/mapper/QuotationMapper.java b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/mapper/QuotationMapper.java
index 61627ae1..427fe398 100644
--- a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/mapper/QuotationMapper.java
+++ b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/mapper/QuotationMapper.java
@@ -16,14 +16,14 @@ List<QuotationListItemDTO> selectQuotationList(
             @Param("startDate") LocalDate startDate,
             @Param("endDate") LocalDate endDate,
             @Param("clientName") String clientName,
-            @Param("quotationStatus") String quotationStatus);
+            @Param("quotationStatus") List<String> quotationStatus);
 
     // 견적서 개수 목록 조회
     int countQuotationList(
             @Param("startDate") LocalDate startDate,
             @Param("endDate") LocalDate endDate,
             @Param("clientName") String clientName,
-            @Param("quotationStatus") String quotationStatus);
+            @Param("quotationStatus") List<String> quotationStatus);
 
     // 견적서 상세 조회
     QuotationDTO selectQuotation(
diff --git a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/service/QuotationQueryService.java b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/service/QuotationQueryService.java
index fed3fae5..8a8147d7 100644
--- a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/service/QuotationQueryService.java
+++ b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/service/QuotationQueryService.java
@@ -20,7 +20,7 @@ public class QuotationQueryService {
     public QuotationListResponse readQuotationList(
             Integer page, Integer size,
             LocalDate startDate, LocalDate endDate,
-            String clientName, String quotationStatus) {
+            String clientName, List<String> quotationStatus) {
 
         // 견적서 목록 조회
         List<QuotationListItemDTO> quotationList = quotationMapper.selectQuotationList(
diff --git a/SCM/backend/src/main/resources/mappers/quotation/QuotationMapper.xml b/SCM/backend/src/main/resources/mappers/quotation/QuotationMapper.xml
index c4b8f98d..59fcec14 100644
--- a/SCM/backend/src/main/resources/mappers/quotation/QuotationMapper.xml
+++ b/SCM/backend/src/main/resources/mappers/quotation/QuotationMapper.xml
@@ -30,7 +30,8 @@
             AND tb_client.client_name LIKE CONCAT('%', #{clientName}, '%')
         </if>
         <if test="quotationStatus != null">
-            AND tb_quotation.quotation_status LIKE #{quotationStatus}
+            AND tb_quotation.quotation_status IN 
+            <foreach collection="quotationStatus" item="item" open="(" separator="," close=")">#{item}</foreach>
         </if>
         LIMIT #{limit} OFFSET #{offset}
     </select>
@@ -52,7 +53,8 @@
             AND tb_client.client_name LIKE CONCAT('%', #{clientName}, '%')
         </if>
         <if test="quotationStatus != null">
-            AND tb_quotation.quotation_status LIKE #{quotationStatus}
+            AND tb_quotation.quotation_status IN
+            <foreach collection="quotationStatus" item="item" open="(" separator="," close=")">#{item}</foreach>
         </if>
     </select>
 
diff --git a/SCM/backend/src/test/java/error/pirate/backend/quotation/query/service/QuotationQueryServiceTest.java b/SCM/backend/src/test/java/error/pirate/backend/quotation/query/service/QuotationQueryServiceTest.java
index 179c22f0..6c01bcc0 100644
--- a/SCM/backend/src/test/java/error/pirate/backend/quotation/query/service/QuotationQueryServiceTest.java
+++ b/SCM/backend/src/test/java/error/pirate/backend/quotation/query/service/QuotationQueryServiceTest.java
@@ -9,6 +9,7 @@
 import org.springframework.boot.test.context.SpringBootTest;
 
 import java.time.LocalDate;
+import java.util.List;
 import java.util.stream.Stream;
 
 import static org.junit.jupiter.api.Assertions.*;
@@ -37,7 +38,7 @@ private static Stream<Arguments> readQuotationListParam() {
     @MethodSource("readQuotationListParam")
     void readQuotationList(Integer page, Integer size,
                           LocalDate startDate, LocalDate endDate,
-                          String clientName, String quotationStatus) {
+                          String clientName, List<String> quotationStatus) {
 
         assertDoesNotThrow(() -> quotationQueryService.readQuotationList(
                 page, size, startDate, endDate, clientName, quotationStatus));

From e3d881a7530ef6d17a15c91ffff345b7f141af43 Mon Sep 17 00:00:00 2001
From: Huichan Bak <hc.bak@outlook.com>
Date: Wed, 18 Dec 2024 11:43:00 +0900
Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=EA=B2=AC=EC=A0=81=EC=84=9C=20?=
 =?UTF-8?q?=EC=83=81=ED=83=9C=20=EB=B6=84=EB=A5=98=20=EC=A1=B0=ED=9A=8C=20?=
 =?UTF-8?q?API=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../aggregate/entity/QuotationStatus.java     | 33 ++++++++++++++++---
 .../controller/QuotationQueryController.java  |  8 +++++
 2 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/SCM/backend/src/main/java/error/pirate/backend/quotation/command/domain/aggregate/entity/QuotationStatus.java b/SCM/backend/src/main/java/error/pirate/backend/quotation/command/domain/aggregate/entity/QuotationStatus.java
index 362047e6..9cbe010a 100644
--- a/SCM/backend/src/main/java/error/pirate/backend/quotation/command/domain/aggregate/entity/QuotationStatus.java
+++ b/SCM/backend/src/main/java/error/pirate/backend/quotation/command/domain/aggregate/entity/QuotationStatus.java
@@ -1,9 +1,34 @@
 package error.pirate.backend.quotation.command.domain.aggregate.entity;
 
+import lombok.Getter;
+import lombok.RequiredArgsConstructor;
+
+import java.util.Arrays;
+import java.util.List;
+
+@Getter
+@RequiredArgsConstructor
 public enum QuotationStatus {
-    BEFORE, // 결재전
-    AFTER,  // 결재후
-    REFUSAL, // 반려
-    DELETE  // 삭제
+    BEFORE("결재 전"),
+    AFTER("결재 후"),
+    REFUSAL("반려"),
+    DELETE("삭제");
+
+    private final String value;
+
+    @Getter
+    public static class QuotationStatusResponse {
+        private final String key;
+        private final String value;
+
+        public QuotationStatusResponse(String key, QuotationStatus quotationStatus) {
+            this.key = key;
+            this.value = quotationStatus.getValue();
+        }
+    }
 
+    public static List<QuotationStatusResponse> readQuotationStatusList() {
+        return Arrays.stream(QuotationStatus.class.getEnumConstants()).map(key ->
+                new QuotationStatusResponse(key.toString(), QuotationStatus.valueOf(key.toString()))).toList();
+    }
 }
diff --git a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
index bfb51ade..e5f2efc4 100644
--- a/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
+++ b/SCM/backend/src/main/java/error/pirate/backend/quotation/query/controller/QuotationQueryController.java
@@ -1,5 +1,6 @@
 package error.pirate.backend.quotation.query.controller;
 
+import error.pirate.backend.quotation.command.domain.aggregate.entity.QuotationStatus;
 import error.pirate.backend.quotation.query.dto.QuotationListResponse;
 import error.pirate.backend.quotation.query.dto.QuotationResponse;
 import error.pirate.backend.quotation.query.dto.QuotationSituationResponse;
@@ -8,6 +9,7 @@
 import io.swagger.v3.oas.annotations.tags.Tag;
 import lombok.RequiredArgsConstructor;
 import org.springframework.format.annotation.DateTimeFormat;
+import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.*;
 
@@ -54,4 +56,10 @@ public ResponseEntity<QuotationSituationResponse> readQuotationSituation(
         return ResponseEntity.ok(quotationQueryService.readQuotationSituation(
                 startDate, endDate, clientName));
     }
+
+    @GetMapping("/status")
+    @Operation(summary = "견적서 상태 분류 조회")
+    public ResponseEntity<List<QuotationStatus.QuotationStatusResponse>> readQuotationStatus() {
+        return ResponseEntity.ok(QuotationStatus.readQuotationStatusList());
+    }
 }

From f5550d76c94e6dd7a885db8011b74ab2d777f219 Mon Sep 17 00:00:00 2001
From: Huichan Bak <hc.bak@outlook.com>
Date: Wed, 18 Dec 2024 11:51:30 +0900
Subject: [PATCH 5/5] =?UTF-8?q?refactor=20=EA=B2=AC=EC=A0=81=EC=84=9C=20?=
 =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EC=A1=B0=ED=9A=8C=20=EA=B8=B0=EB=B3=B8=20?=
 =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=99=84=EC=84=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 SCM/frontend/src/components/common/Header.vue |  4 ++-
 .../components/quotation/QuotationList.vue    | 34 ++++++++++++++-----
 SCM/frontend/src/router/index.js              |  1 +
 3 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/SCM/frontend/src/components/common/Header.vue b/SCM/frontend/src/components/common/Header.vue
index adb0d745..8c9fc45a 100644
--- a/SCM/frontend/src/components/common/Header.vue
+++ b/SCM/frontend/src/components/common/Header.vue
@@ -25,7 +25,9 @@ import statisticsIcon from '@/assets/statisticsIcon.svg'
         </b-nav-item-dropdown>
         <b-nav-item-dropdown>
           <template #button-content><salesIcon class="icon" />영업관리</template>
-          <b-dropdown-item href="/quotation">견적 관리</b-dropdown-item>
+          <RouterLink to="/quotation" style="text-decoration-line: none;">
+            <b-dropdown-item>견적 관리</b-dropdown-item>
+          </RouterLink>
           <b-dropdown-item href="#">주문서 관리</b-dropdown-item>
           <b-dropdown-item href="#">판매 관리</b-dropdown-item>
           <b-dropdown-item href="#"><RouterLink to="/shipping-instruction" active-class="active" replace>출하지시서 관리</RouterLink></b-dropdown-item>
diff --git a/SCM/frontend/src/components/quotation/QuotationList.vue b/SCM/frontend/src/components/quotation/QuotationList.vue
index 0394bb4c..57bc0467 100644
--- a/SCM/frontend/src/components/quotation/QuotationList.vue
+++ b/SCM/frontend/src/components/quotation/QuotationList.vue
@@ -1,8 +1,10 @@
 <script setup>
 import { ref, onMounted, watch } from 'vue';
+import searchIcon from "@/assets/searchIcon.svg"
 import axios from "@/axios"
 
 const quotationList = ref([]);
+const quotationStatusList = ref([]);
 const currentPage = ref(1);
 const totalPage = ref(1);
 const totalQuotation = ref(0);
@@ -11,8 +13,9 @@ const searchSize = ref(10);
 const searchStartDate = ref(null);
 const searchEndDate = ref(null);
 const searchClient = ref(null);
-const searchStatus = ref(null);
+const searchStatus = ref(new Set());
 
+// 견적서 목록 요청
 const fetchQuotationList = async () => {
     try {
         const response = await axios.get(`quotation`, {
@@ -22,7 +25,7 @@ const fetchQuotationList = async () => {
                 startDate: searchStartDate.value,
                 endDate: searchEndDate.value,
                 clientName: searchClient.value,
-                quotationStatus: searchStatus.value
+                quotationStatus: searchStatus.value.size === 0 ? null : Array.from(searchStatus.value).join(",")
             }
         });
 
@@ -30,11 +33,19 @@ const fetchQuotationList = async () => {
         currentPage.value = response.data.currentPage;
         totalPage.value = response.data.totalPages;
         totalQuotation.value = response.data.totalQuotation;
+    } catch (error) {
+        console.log(`견적서 목록 요청 실패`, error);
+    }
+}
 
-        console.log(quotationList.value);
-
+// 견적서 상태 분류 목록 요청
+const fetchQuotationStatus = async () => {
+    try { 
+        const response = await axios.get(`quotation/status`);
+        
+        quotationStatusList.value = response.data;
     } catch (error) {
-        console.log(error);
+        console.log(`견적서 상태 분류 목록 요청 실패`, error);
     }
 }
 
@@ -63,17 +74,19 @@ function addItemCard() {
 
 onMounted(() => {
     fetchQuotationList();
+    fetchQuotationStatus();
 });
 
-watch([searchStartDate, searchEndDate], () => {
+watch([searchStartDate, searchEndDate, searchStatus.value], () => {
     search();
 });
 
 watch(searchPage, () => {
+
     fetchQuotationList();
 });
 
-function check(status) {
+function statusCheck(status) {
     searchStatus.value.has(status) ? searchStatus.value.delete(status)
                                    : searchStatus.value.add(status);
 }
@@ -108,7 +121,7 @@ function search() {
                 <div class="card-body">
                     <p class="card-title">견적서 상태</p>
                     <template v-for="quotationStatus in quotationStatusList">
-                        <b-form-checkbox @click="check(quotationStatus.key)">{{ quotationStatus.value }}</b-form-checkbox>
+                        <b-form-checkbox @click="statusCheck(quotationStatus.key)">{{ quotationStatus.value }}</b-form-checkbox>
                     </template>
                 </div>
             </div>
@@ -207,4 +220,9 @@ div {
     margin-top: 100px;
 }
 
+.icon {
+  width: 20px;
+  height: 20px;
+}
+
 </style>
diff --git a/SCM/frontend/src/router/index.js b/SCM/frontend/src/router/index.js
index c28dfe60..6674665a 100644
--- a/SCM/frontend/src/router/index.js
+++ b/SCM/frontend/src/router/index.js
@@ -14,6 +14,7 @@ const routes = [
     },
     {
         path: "/quotation",
+        name: "Quotation",
         component: () => import("@/views/quotation/QuotationListView.vue")
     },
     {