<template>
	<view class="page">
		<scroll-view scroll-y class="list">
			<view class="item" v-for="a in accounts" :key="a.id" @click="select(a)">
				<view class="name">{{ a.name }}</view>
				<view class="meta">{{ typeLabel(a.type) }} · 余额：{{ a.balance?.toFixed ? a.balance.toFixed(2) : a.balance }}</view>
			</view>
		</scroll-view>
		<view class="fab" @click="create">＋</view>
	</view>
</template>

<script>
	import { get } from '../../common/http.js'
	const TYPE_MAP = { cash: '现金', bank: '银行', alipay: '支付宝', wechat: '微信', other: '其他' }
	export default {
		data() { return { accounts: [], mode: 'view' } },
		async onLoad(q) {
			this.mode = (q && q.mode) || 'view'
			try {
				const res = await get('/api/accounts')
				this.accounts = Array.isArray(res) ? res : (res?.list || [])
			} catch(e) { uni.showToast({ title: '加载失败', icon: 'none' }) }
		},
		methods: {
			select(a) {
				if (this.mode === 'pick') {
					const opener = getCurrentPages()[getCurrentPages().length-2]
					if (opener && opener.$vm) {
						opener.$vm.selectedAccountId = a.id
						opener.$vm.selectedAccountName = a.name
					}
					uni.navigateBack()
				} else {
					uni.navigateTo({ url: `/pages/account/ledger?id=${a.id}` })
				}
			},
			create() { uni.navigateTo({ url: '/pages/account/form' }) },
			typeLabel(t) { return TYPE_MAP[t] || t }
		}
	}
</script>

<style lang="scss">
	.page { display:flex; flex-direction: column; height: 100vh; }
	.list { flex:1; }
	.item { padding: 20rpx 24rpx; background:$uni-bg-color-grey; border-bottom: 1rpx solid $uni-border-color; }
	.name { color:$uni-text-color; margin-bottom: 6rpx; }
	.meta { color:$uni-text-color-grey; font-size: 24rpx; }
	.fab { position: fixed; right: 32rpx; bottom: 120rpx; width: 100rpx; height: 100rpx; border-radius: 50%; background:$uni-color-primary; color:#fff; display:flex; align-items:center; justify-content:center; font-size: 52rpx; box-shadow: 0 10rpx 20rpx rgba(0,0,0,0.18); }
</style>



