Some checks failed
ci / ci (22, ubuntu-latest) (push) Failing after 25m52s
Made-with: Cursor
104 lines
3.6 KiB
Vue
104 lines
3.6 KiB
Vue
<script setup lang="ts">
|
|
import { CATEGORY_LABELS } from '~/types/purchase'
|
|
import type { Purchase, PurchaseInsert, EquipmentCategory } from '~/types/purchase'
|
|
|
|
definePageMeta({ middleware: 'auth' })
|
|
|
|
const route = useRoute()
|
|
const { getPurchase, updatePurchase, deletePurchase } = usePurchases()
|
|
|
|
const purchase = ref<Purchase | null>(null)
|
|
const showEdit = ref(false)
|
|
|
|
purchase.value = await getPurchase(route.params.id as string)
|
|
|
|
if (!purchase.value) {
|
|
await navigateTo('/purchases')
|
|
}
|
|
|
|
async function handleUpdate(data: PurchaseInsert) {
|
|
if (!purchase.value) return
|
|
const updated = await updatePurchase(purchase.value.id, data)
|
|
if (updated) {
|
|
purchase.value = updated
|
|
showEdit.value = false
|
|
}
|
|
}
|
|
|
|
async function handleDelete() {
|
|
if (!purchase.value || !confirm('이 장비를 삭제하시겠습니까?')) return
|
|
await deletePurchase(purchase.value.id)
|
|
await navigateTo('/purchases')
|
|
}
|
|
|
|
function formatPrice(price: number) {
|
|
return price.toLocaleString('ko-KR') + '원'
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="purchase" class="p-6 space-y-6 max-w-2xl">
|
|
<!-- Header -->
|
|
<div class="flex items-center gap-4">
|
|
<NuxtLink to="/purchases">
|
|
<UButton icon="i-lucide-arrow-left" color="neutral" variant="ghost" />
|
|
</NuxtLink>
|
|
<div class="flex-1">
|
|
<h1 class="text-2xl font-bold text-gray-900 dark:text-white">{{ purchase.name }}</h1>
|
|
<p class="text-gray-500 dark:text-gray-400">
|
|
{{ CATEGORY_LABELS[purchase.category as EquipmentCategory] }}
|
|
</p>
|
|
</div>
|
|
<div class="flex gap-2">
|
|
<UButton icon="i-lucide-pencil" label="수정" color="neutral" variant="outline" @click="showEdit = true" />
|
|
<UButton icon="i-lucide-trash-2" label="삭제" color="error" variant="outline" @click="handleDelete" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Details -->
|
|
<UCard>
|
|
<dl class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">브랜드</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white">{{ purchase.brand || '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">구매가격</dt>
|
|
<dd class="mt-1 font-bold text-xl text-primary-600">{{ formatPrice(purchase.price) }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">구매일</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white">{{ purchase.purchase_date }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">구매처</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white">{{ purchase.store || '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">보증기간 만료</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white">{{ purchase.warranty_until || '-' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">등록일</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white">
|
|
{{ new Date(purchase.created_at).toLocaleDateString('ko-KR') }}
|
|
</dd>
|
|
</div>
|
|
<div class="col-span-2">
|
|
<dt class="text-sm text-gray-500 dark:text-gray-400">메모</dt>
|
|
<dd class="mt-1 font-medium text-gray-900 dark:text-white whitespace-pre-wrap">
|
|
{{ purchase.notes || '-' }}
|
|
</dd>
|
|
</div>
|
|
</dl>
|
|
</UCard>
|
|
|
|
<!-- Edit Modal -->
|
|
<PurchasesPurchaseModal
|
|
v-model:open="showEdit"
|
|
:initial="purchase"
|
|
@submit="handleUpdate"
|
|
/>
|
|
</div>
|
|
</template>
|