From ce9fce5d4401fdac3db20828c1f07b1490b4737c Mon Sep 17 00:00:00 2001
From: hyeonggil <>
Date: Sun, 8 Mar 2026 21:25:40 +0900
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor:=20=EC=A4=91?=
 =?UTF-8?q?=EA=B3=A0=20=ED=8C=90=EB=A7=A4=20=EB=AA=A9=EB=A1=9D=20=ED=85=8C?=
 =?UTF-8?q?=EC=9D=B4=EB=B8=94=20=ED=83=80=EC=9E=85=20=EB=B0=8F=20=EB=8D=B0?=
 =?UTF-8?q?=EC=9D=B4=ED=84=B0=20=EB=A1=9C=EB=94=A9=20=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- await fetchSales() → onMounted로 변경해 Suspense 의존성 제거
- columns를 TableColumn<UsedSale>[] 타입으로 명시 (accessorKey 방식)
- filtered computed를 명시적 타입 선언으로 개선
---
 app/pages/used-sales/index.vue | 26 ++++++++++++++------------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/app/pages/used-sales/index.vue b/app/pages/used-sales/index.vue
index a606b98..7242022 100644
--- a/app/pages/used-sales/index.vue
+++ b/app/pages/used-sales/index.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { TableColumn } from '@nuxt/ui'
 import { STATUS_LABELS, PLATFORM_LABELS, STATUS_OPTIONS } from '~/types/used-sale'
 import type { UsedSale, UsedSaleInsert, SaleStatus, SalePlatform } from '~/types/used-sale'
 
@@ -6,7 +7,7 @@ definePageMeta({ middleware: 'auth' })
 
 const { sales, totalRevenue, byStatus, loading, error, fetchSales, createSale, updateSale, deleteSale } = useUsedSales()
 
-await fetchSales()
+onMounted(() => fetchSales())
 
 const showModal = ref(false)
 const editingSale = ref<UsedSale | undefined>(undefined)
@@ -20,19 +21,20 @@ const tabOptions = [
   { value: 'cancelled', label: `취소 (${byStatus.value.cancelled.length})` }
 ]
 
-const filtered = computed(() => {
-  if (activeTab.value === 'all') return sales.value
-  return sales.value.filter(s => s.status === activeTab.value)
+const filtered = computed<UsedSale[]>(() => {
+  const all = [...sales.value]
+  if (activeTab.value === 'all') return all
+  return all.filter(s => s.status === activeTab.value)
 })
 
-const columns = [
-  { key: 'item_name', label: '장비명' },
-  { key: 'platform', label: '플랫폼' },
-  { key: 'sale_price', label: '희망가' },
-  { key: 'final_price', label: '최종가' },
-  { key: 'status', label: '상태' },
-  { key: 'listed_at', label: '등록일' },
-  { key: 'actions', label: '' }
+const columns: TableColumn<UsedSale>[] = [
+  { accessorKey: 'item_name', header: '장비명' },
+  { accessorKey: 'platform', header: '플랫폼' },
+  { accessorKey: 'sale_price', header: '희망가' },
+  { accessorKey: 'final_price', header: '최종가' },
+  { accessorKey: 'status', header: '상태' },
+  { accessorKey: 'listed_at', header: '등록일' },
+  { id: 'actions', header: '' }
 ]
 
 function openCreate() {