feat(ui): 공통 ChipSelect + 계좌 선택을 칩(2열)으로
Deploy / deploy (push) Failing after 15m12s

select 대체 ChipSelect 컴포넌트(cols 지원) 신설. 계좌 선택 드롭다운을 칩(한 줄 2개)으로 교체:
- AccountView 출금·입금·상환대상 계좌
- RecurringView 출금·입금 계좌
계좌 종류 뱃지로 이미 걸러지고 무료 한도(종류별 2개)라 칩 수도 적당.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
sb
2026-07-06 23:06:17 +09:00
parent e2d9b8ea37
commit 810a5d9380
3 changed files with 148 additions and 32 deletions
+23 -12
View File
@@ -5,6 +5,7 @@ import { useDialog } from '@/composables/dialog'
import IconBtn from '@/components/ui/IconBtn.vue'
import AppModal from '@/components/ui/AppModal.vue'
import CategoryPicker from '@/components/ui/CategoryPicker.vue'
import ChipSelect from '@/components/ui/ChipSelect.vue'
const dialog = useDialog()
@@ -60,6 +61,12 @@ const WALLET_KINDS = [
]
const walletsOfKind = computed(() => wallets.value.filter((w) => w.type === form.walletKind))
const toWalletsOfKind = computed(() => wallets.value.filter((w) => w.type === form.toWalletKind))
// 계좌 선택 칩 옵션
function walletOpts(list) {
return list.map((w) => ({ value: w.id, label: `${w.name}${w.issuer ? ` (${w.issuer})` : ''}` }))
}
const fromWalletOptions = computed(() => walletOpts(walletsOfKind.value))
const toWalletOptions = computed(() => walletOpts(toWalletsOfKind.value))
function walletKindOf(id) {
const w = wallets.value.find((x) => x.id === id)
return w ? w.type : ''
@@ -294,12 +301,14 @@ onMounted(load)
@click="form.walletKind = k.value; onWalletKindChange()"
>{{ k.label }}</button>
</div>
<select v-if="form.walletKind" v-model="form.walletId" :disabled="submitting">
<option value="">(선택)</option>
<option v-for="w in walletsOfKind" :key="w.id" :value="w.id">
{{ w.name }}{{ w.issuer ? ` (${w.issuer})` : '' }}
</option>
</select>
<ChipSelect
v-if="form.walletKind"
v-model="form.walletId"
:options="fromWalletOptions"
:cols="2"
:disabled="submitting"
empty-text="등록된 계좌가 없습니다"
/>
</div>
<!-- 입금 계좌 종류 배지 (이체일 때만) -->
@@ -313,12 +322,14 @@ onMounted(load)
@click="form.toWalletKind = k.value; onToWalletKindChange()"
>{{ k.label }}</button>
</div>
<select v-if="form.toWalletKind" v-model="form.toWalletId" :disabled="submitting">
<option value="">(선택)</option>
<option v-for="w in toWalletsOfKind" :key="w.id" :value="w.id">
{{ w.name }}{{ w.issuer ? ` (${w.issuer})` : '' }}
</option>
</select>
<ChipSelect
v-if="form.toWalletKind"
v-model="form.toWalletId"
:options="toWalletOptions"
:cols="2"
:disabled="submitting"
empty-text="등록된 계좌가 없습니다"
/>
</div>
<!-- 분류 CategoryPicker (이체 제외) -->