feat: 添加存款分类设置功能,优化预算管理界面
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 26s
Docker Build & Deploy / Deploy to Production (push) Successful in 8s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s

This commit is contained in:
孙诚
2026-01-07 20:31:12 +08:00
parent a1bb7ad5e1
commit aa8fc7a8b3
4 changed files with 300 additions and 15 deletions

View File

@@ -2,7 +2,7 @@
<PopupContainer
v-model="visible"
:title="isEdit ? `编辑${getCategoryName(form.category)}预算` : `新增${getCategoryName(form.category)}预算`"
height="85%"
height="75%"
>
<div class="add-budget-form">
<van-form>
@@ -175,14 +175,6 @@ const fetchCategories = async () => {
}
}
watch(() => form.category, (newVal, oldVal) => {
// 只有在手动切换类型且不是初始化编辑数据时才清空
// 为简单起见,如果旧值存在(即不是第一次赋值),则清空已选分类
if (oldVal !== undefined) {
form.selectedCategories = []
}
})
const onSubmit = async () => {
try {
const data = {

View File

@@ -0,0 +1,181 @@
<template>
<PopupContainer
v-model="visible"
title="设置存款分类"
height="60%"
>
<div class="savings-config-content">
<div class="config-header">
<p class="subtitle">这些分类的统计值将计入存款</p>
</div>
<div class="category-section">
<div class="section-title">可多选分类</div>
<div class="classify-buttons">
<van-button
v-if="incomeCategories.length > 0"
:type="isAllSelected ? 'primary' : 'default'"
size="small"
class="classify-btn all-btn"
@click="toggleAll"
>
{{ isAllSelected ? '取消全选' : '全选' }}
</van-button>
<van-button
v-for="item in incomeCategories"
:key="item.id"
:type="selectedCategories.includes(item.name) ? 'primary' : 'default'"
size="small"
class="classify-btn"
style="margin-bottom: 8px; margin-right: 8px;"
@click="toggleCategory(item.name)"
>
{{ item.name }}
</van-button>
<div v-if="incomeCategories.length === 0" class="no-data">暂无收入分类</div>
</div>
</div>
</div>
<template #footer>
<van-button block round type="primary" @click="onSubmit">保存配置</van-button>
</template>
</PopupContainer>
</template>
<script setup>
import { ref, computed, onMounted } from 'vue'
import { showToast, showLoadingToast, closeToast } from 'vant'
import { getCategoryList } from '@/api/transactionCategory'
import { getConfig, setConfig } from '@/api/config'
import PopupContainer from '@/components/PopupContainer.vue'
const emit = defineEmits(['success'])
const visible = ref(false)
const categories = ref([])
const selectedCategories = ref([])
const open = async () => {
visible.value = true
await fetchCategories()
await fetchConfig()
}
defineExpose({
open
})
const incomeCategories = computed(() => {
return categories.value.filter(c => c.type === 1) // Income = 1
})
const isAllSelected = computed(() => {
return incomeCategories.value.length > 0 &&
incomeCategories.value.every(c => selectedCategories.value.includes(c.name))
})
const toggleCategory = (name) => {
const index = selectedCategories.value.indexOf(name)
if (index > -1) {
selectedCategories.value.splice(index, 1)
} else {
selectedCategories.value.push(name)
}
}
const toggleAll = () => {
if (isAllSelected.value) {
selectedCategories.value = []
} else {
selectedCategories.value = incomeCategories.value.map(c => c.name)
}
}
const fetchCategories = async () => {
try {
const res = await getCategoryList()
if (res.success) {
categories.value = res.data || []
}
} catch (err) {
console.error('获取分类列表失败', err)
}
}
const fetchConfig = async () => {
try {
const res = await getConfig('SavingsCategories')
if (res.success && res.data) {
selectedCategories.value = res.data.split(',').filter(x => x)
} else {
selectedCategories.value = []
}
} catch (err) {
console.error('获取配置失败', err)
}
}
const onSubmit = async () => {
showLoadingToast({ message: '保存中...', forbidClick: true })
try {
const value = selectedCategories.value.join(',')
const res = await setConfig('SavingsCategories', value)
if (res.success) {
showToast('配置已保存')
visible.value = false
emit('success')
}
} catch (err) {
console.error('保存配置失败', err)
showToast('保存失败')
} finally {
closeToast()
}
}
</script>
<style scoped>
.savings-config-content {
padding: 16px;
}
.config-header {
margin-bottom: 20px;
}
.subtitle {
font-size: 14px;
color: #969799;
margin: 0;
}
.section-title {
font-size: 16px;
font-weight: 500;
margin-bottom: 12px;
}
.classify-buttons {
display: flex;
flex-wrap: wrap;
}
.classify-btn {
margin-bottom: 8px;
margin-right: 8px;
border-radius: 20px;
min-width: 60px;
}
.all-btn {
border-style: dashed;
}
.no-data {
text-align: center;
color: #969799;
width: 100%;
padding: 20px 0;
}
</style>

View File

@@ -2,7 +2,18 @@
<div class="page-container-flex">
<van-nav-bar title="预算管理" placeholder>
<template #right>
<van-icon name="plus" size="20" @click="budgetEditRef.open({ category: activeTab })" />
<van-icon
v-if="activeTab !== BudgetCategory.Savings"
name="plus"
size="20"
@click="budgetEditRef.open({ category: activeTab })"
/>
<van-icon
v-else
name="info-o"
size="20"
@click="savingsConfigRef.open()"
/>
</template>
</van-nav-bar>
@@ -123,12 +134,15 @@
status-tag-text="积累中"
@toggle-stop="handleToggleStop"
@switch-period="(dir) => handleSwitchPeriod(budget, dir)"
@click="budgetEditRef.open({
data: budget,
isEditFlag: true,
category: budget.category
})"
>
<template #tag>
<!-- 占位,避免显示停止/恢复按钮 -->
<span />
</template>
<template #actions>
<!-- 占位,避免显示停止/恢复按钮 -->
<span />
</template>
<template #amount-info>
<div class="info-item">
<div class="label">已存</div>
@@ -164,6 +178,10 @@
ref="budgetEditRef"
@success="fetchBudgetList"
/>
<SavingsConfigPopup
ref="savingsConfigRef"
@success="fetchBudgetList"
/>
</div>
</div>
</template>
@@ -176,9 +194,11 @@ import { BudgetPeriodType, BudgetCategory } from '@/constants/enums'
import BudgetCard from '@/components/Budget/BudgetCard.vue'
import BudgetSummary from '@/components/Budget/BudgetSummary.vue'
import BudgetEditPopup from '@/components/Budget/BudgetEditPopup.vue'
import SavingsConfigPopup from '@/components/Budget/SavingsConfigPopup.vue'
const activeTab = ref(BudgetCategory.Expense)
const budgetEditRef = ref(null)
const savingsConfigRef = ref(null)
const expenseBudgets = ref([])
const incomeBudgets = ref([])

View File

@@ -4,6 +4,7 @@
[Route("api/[controller]/[action]")]
public class BudgetController(
IBudgetService budgetService,
IConfigService configService,
ILogger<BudgetController> logger) : ControllerBase
{
/// <summary>
@@ -23,6 +24,10 @@ public class BudgetController(
dtos.Add(BudgetDto.FromEntity(budget, currentAmount, referenceDate));
}
// 创造虚拟的存款预算
dtos.Add(await GetVirtualSavingsDtoAsync(BudgetPeriodType.Month, referenceDate));
dtos.Add(await GetVirtualSavingsDtoAsync(BudgetPeriodType.Year, referenceDate));
return dtos.Ok();
}
catch (Exception ex)
@@ -40,6 +45,15 @@ public class BudgetController(
{
try
{
if (id == -1)
{
return (await GetVirtualSavingsDtoAsync(BudgetPeriodType.Year, referenceDate)).Ok();
}
if (id == -2)
{
return (await GetVirtualSavingsDtoAsync(BudgetPeriodType.Month, referenceDate)).Ok();
}
var budget = await budgetService.GetByIdAsync(id);
if (budget == null) return "预算不存在".Fail<BudgetDto>();
@@ -147,6 +161,84 @@ public class BudgetController(
}
}
private async Task<BudgetDto> GetVirtualSavingsDtoAsync(BudgetPeriodType periodType, DateTime? referenceDate = null)
{
var allBudgets = await budgetService.GetAllAsync();
var date = referenceDate ?? DateTime.Now;
decimal incomeLimitAtPeriod = 0;
decimal expenseLimitAtPeriod = 0;
var savingsCategories = await configService.GetConfigByKeyAsync<string>("SavingsCategories") ?? string.Empty;
var selectedCategoryList = savingsCategories.Split(',', StringSplitOptions.RemoveEmptyEntries);
foreach (var b in allBudgets)
{
if (b.IsStopped || b.Category == BudgetCategory.Savings) continue;
// 如果设置了存款分类,并且预算有指定分类,则只统计相关的预算
if (selectedCategoryList.Length > 0)
{
var budgetCategories = b.SelectedCategories.Split(',', StringSplitOptions.RemoveEmptyEntries);
if (budgetCategories.Length > 0 && !budgetCategories.Intersect(selectedCategoryList).Any())
{
continue;
}
}
// 折算系数:根据当前请求的 periodType (Year 或 Month),将预算 b 的 Limit 折算过来
decimal factor = 1.0m;
if (periodType == BudgetPeriodType.Year)
{
factor = b.Type switch
{
BudgetPeriodType.Month => 12,
BudgetPeriodType.Week => 52,
BudgetPeriodType.Year => 1,
_ => 0
};
}
else if (periodType == BudgetPeriodType.Month)
{
factor = b.Type switch
{
BudgetPeriodType.Month => 1,
BudgetPeriodType.Week => 52m / 12m,
BudgetPeriodType.Year => 1m / 12m,
_ => 0
};
}
else
{
factor = 0; // 其他周期暂不计算虚拟存款
}
if (b.Category == BudgetCategory.Income) incomeLimitAtPeriod += b.Limit * factor;
else if (b.Category == BudgetCategory.Expense) expenseLimitAtPeriod += b.Limit * factor;
}
var virtualBudget = new BudgetRecord
{
Id = periodType == BudgetPeriodType.Year ? -1 : -2,
Name = periodType == BudgetPeriodType.Year ? "年度存款" : "月度存款",
Category = BudgetCategory.Savings,
Type = periodType,
Limit = incomeLimitAtPeriod - expenseLimitAtPeriod,
StartDate = periodType == BudgetPeriodType.Year ? new DateTime(date.Year, 1, 1) : new DateTime(date.Year, date.Month, 1),
SelectedCategories = savingsCategories
};
// 计算实际发生的 收入 - 支出
var incomeHelper = new BudgetRecord { Category = BudgetCategory.Income, Type = periodType, StartDate = virtualBudget.StartDate, SelectedCategories = savingsCategories };
var expenseHelper = new BudgetRecord { Category = BudgetCategory.Expense, Type = periodType, StartDate = virtualBudget.StartDate, SelectedCategories = savingsCategories };
var actualIncome = await budgetService.CalculateCurrentAmountAsync(incomeHelper, date);
var actualExpense = await budgetService.CalculateCurrentAmountAsync(expenseHelper, date);
return BudgetDto.FromEntity(virtualBudget, actualIncome - actualExpense, date);
}
private async Task<string> ValidateBudgetSelectedCategoriesAsync(BudgetRecord record)
{
var allBudgets = await budgetService.GetAllAsync();