From 69ceff1253862d6a13d049a44b48653884e6a4fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=B5=9C=EC=A4=80=ED=9D=A0?= <choi.jh@prime-idc.jp>
Date: Mon, 5 Sep 2022 09:56:42 +0900
Subject: [PATCH] =?UTF-8?q?=EC=88=98=EC=A0=952...?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/todo/ListComponent.vue | 45 +++++++++++----------------
 1 file changed, 18 insertions(+), 27 deletions(-)

diff --git a/src/components/todo/ListComponent.vue b/src/components/todo/ListComponent.vue
index dcc5ff3..b236c36 100644
--- a/src/components/todo/ListComponent.vue
+++ b/src/components/todo/ListComponent.vue
@@ -86,27 +86,17 @@
       :head-variant="commonTableAttributes.headVariant"
     >
       <!-- Column별 Filter용 -->
-      <template #thead-top>
-        <b-tr>
-          <b-th colspan="4"> </b-th>
-          <b-th
-            ><b-form-select
-              v-model="filterIsDone"
-              :options="filterIsDoneFieldOptions"
-              @change="isDoneClick"
-            ></b-form-select
-          ></b-th>
-          <b-th></b-th>
-        </b-tr>
+      <template #head(is_done)="data">
+        <b-form-select
+          v-model="filterIsDone"
+          :options="data.field.Options"
+          @change="isDoneClick"
+        ></b-form-select>
       </template>
       <!-- 비/선택 Row를 토글용 -->
       <template #cell(rowSelect)="{ rowSelected }">
-        <template v-if="rowSelected">
-          <span aria-hidden="true">✓</span>
-        </template>
-        <template v-else>
-          <span aria-hidden="true">&nbsp;</span>
-        </template>
+        <template v-if="rowSelected"> ✓ </template>
+        <template v-else> &nbsp; </template>
       </template>
       <!-- Row의 Index를 이용한 번호 출력 -->
       <template #cell(id)="row">
@@ -132,6 +122,10 @@
           <b-button size="sm" @click="row.toggleDetails">숨기기</b-button>
         </b-card>
       </template>
+      <!-- 사용여부 출력용 -->
+      <template #cell(is_done)="row">
+        {{ row.value }}
+      </template>
       <!-- 데이터 로딩중 출력용 -->
       <template #table-busy>
         <div class="text-center text-danger my-2">
@@ -202,11 +196,13 @@ export default {
           label: '사용여부',
           thStyle: { width: '105px' },
           formatter: (value) => {
-            const data = this.filterIsDoneFieldOptions.find(
-              (data) => data.value === value
-            )
-            return data ? data.text : value
+            return value == true ? 'YES' : 'NO'
           },
+          Options: [
+            { text: '사용여부 선택', value: '' },
+            { text: 'YES', value: true },
+            { text: 'NO', value: false }
+          ],
           sortable: true,
           sortByFormatted: true //fomatter결과에따른 Sort가 필요시 true
         },
@@ -265,11 +261,6 @@ export default {
         { text: '등록일', value: 'createdAt' }
       ],
       filterIsDone: '',
-      filterIsDoneFieldOptions: [
-        { text: '선택', value: '' },
-        { text: 'YES', value: true },
-        { text: 'NO', value: false }
-      ],
       selectedRows: [],
       selectedRowAllToggle: false,
       selectedRowMode: 'multi',