- 분류 관리: 대분류 선택·소분류 들여쓰기(드래그 정렬 유지) - 입력/예산/고정지출 분류 드롭다운 대분류 optgroup 그룹핑(값은 소분류명) - 대시보드: 파이는 소분류 기준 + 대분류 합계 롤업 표시 - 릴리스 노트 33 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -41,6 +41,20 @@ const categoryOptions = computed(() => {
|
||||
if (form.category && !names.includes(form.category)) names.unshift(form.category)
|
||||
return names
|
||||
})
|
||||
// 대분류로 그룹핑 (소분류=optgroup 옵션 / 자식없는 대분류=단독 옵션)
|
||||
const categoryGroups = computed(() => {
|
||||
const list = categories.value.filter((c) => c.type === form.type)
|
||||
const groups = []
|
||||
if (form.category && !list.some((c) => c.name === form.category)) {
|
||||
groups.push({ key: '_cur', label: null, options: [form.category] })
|
||||
}
|
||||
for (const m of list.filter((c) => c.parentId == null)) {
|
||||
const children = list.filter((c) => c.parentId === m.id)
|
||||
if (children.length) groups.push({ key: 'g' + m.id, label: m.name, options: children.map((c) => c.name) })
|
||||
else groups.push({ key: 'i' + m.id, label: null, options: [m.name] })
|
||||
}
|
||||
return groups
|
||||
})
|
||||
// 계좌/카드 — 종류(계좌/카드)를 라디오로 고르고, 그 종류만 셀렉트로 노출
|
||||
const WALLET_KINDS = [
|
||||
{ value: 'BANK', label: '계좌' },
|
||||
@@ -326,7 +340,14 @@ onMounted(load)
|
||||
<label v-if="form.type !== 'TRANSFER'">분류
|
||||
<select v-model="form.category" :disabled="submitting">
|
||||
<option value="">(선택)</option>
|
||||
<option v-for="c in categoryOptions" :key="c" :value="c">{{ c }}</option>
|
||||
<template v-for="g in categoryGroups" :key="g.key">
|
||||
<optgroup v-if="g.label" :label="g.label">
|
||||
<option v-for="n in g.options" :key="n" :value="n">{{ n }}</option>
|
||||
</optgroup>
|
||||
<template v-else>
|
||||
<option v-for="n in g.options" :key="n" :value="n">{{ n }}</option>
|
||||
</template>
|
||||
</template>
|
||||
</select>
|
||||
</label>
|
||||
<label>메모<input v-model="form.memo" type="text" placeholder="(선택)" :disabled="submitting" /></label>
|
||||
|
||||
Reference in New Issue
Block a user