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() {