♻️ refactor: 중고 판매 목록 테이블 타입 및 데이터 로딩 개선

- await fetchSales() → onMounted로 변경해 Suspense 의존성 제거
- columns를 TableColumn<UsedSale>[] 타입으로 명시 (accessorKey 방식)
- filtered computed를 명시적 타입 선언으로 개선
This commit is contained in:
hyeonggil
2026-03-08 21:25:40 +09:00
parent 3f20022062
commit ce9fce5d44

View File

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