suncheng/EmailBill
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
SunCheng
2026-02-15 10:10:28 +08:00
parent e51a3edd50
commit a88556c784
92 changed files with 6751 additions and 776 deletions
Download Patch File Download Diff File Expand all files Collapse all files

210
Web/src/views/budgetV2/modules/SavingsBudgetContent.vue
View File

@@ -71,125 +71,112 @@
</div>
<!-- 计划存款明细弹窗 -->
<van-popup
v-model:show="showDetailPopup"
position="bottom"
round
:style="{ height: '80%' }"
<PopupContainer
v-model="showDetailPopup"
title="计划存款明细"
height="80%"
>
<div class="detail-popup-content">
<div class="popup-header">
<h3 class="popup-title">
计划存款明细
</h3>
<van-icon
name="cross"
size="20"
class="close-icon"
@click="showDetailPopup = false"
/>
</div>
<div class="popup-body">
<div
v-if="currentBudget"
class="detail-content"
>
<div class="detail-section income-section">
<div class="section-title">
<van-icon name="balance-o" />
收入预算
<div class="popup-body">
<div
v-if="currentBudget"
class="detail-content"
>
<div class="detail-section income-section">
<div class="section-title">
<van-icon name="balance-o" />
收入预算
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">预算限额</span>
<span class="detail-value income">¥{{ formatMoney(incomeLimit) }}</span>
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">预算限额</span>
<span class="detail-value income">¥{{ formatMoney(incomeLimit) }}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际收入</span>
<span class="detail-value">¥{{ formatMoney(incomeCurrent) }}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际收入</span>
<span class="detail-value">¥{{ formatMoney(incomeCurrent) }}</span>
</div>
</div>
</div>
<div class="detail-section expense-section">
<div class="section-title">
<van-icon name="bill-o" />
支出预算
<div class="detail-section expense-section">
<div class="section-title">
<van-icon name="bill-o" />
支出预算
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">预算限额</span>
<span class="detail-value expense">¥{{ formatMoney(expenseLimit) }}</span>
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">预算限额</span>
<span class="detail-value expense">¥{{ formatMoney(expenseLimit) }}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际支出</span>
<span class="detail-value">¥{{ formatMoney(expenseCurrent) }}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际支出</span>
<span class="detail-value">¥{{ formatMoney(expenseCurrent) }}</span>
</div>
</div>
</div>
<div class="detail-section formula-section">
<div class="section-title">
<van-icon name="calculator-o" />
计划存款公式
<div class="detail-section formula-section">
<div class="section-title">
<van-icon name="calculator-o" />
计划存款公式
</div>
<div class="formula-box">
<div class="formula-item">
<span class="formula-label">收入预算</span>
<span class="formula-value income">¥{{ formatMoney(incomeLimit) }}</span>
</div>
<div class="formula-box">
<div class="formula-item">
<span class="formula-label">收入预算</span>
<span class="formula-value income">¥{{ formatMoney(incomeLimit) }}</span>
</div>
<div class="formula-operator">
-
</div>
<div class="formula-item">
<span class="formula-label">支出预算</span>
<span class="formula-value expense">¥{{ formatMoney(expenseLimit) }}</span>
</div>
<div class="formula-operator">
=
</div>
<div class="formula-item">
<span class="formula-label">计划存款</span>
<span class="formula-value">¥{{ formatMoney(currentBudget.limit) }}</span>
</div>
<div class="formula-operator">
-
</div>
<div class="formula-item">
<span class="formula-label">支出预算</span>
<span class="formula-value expense">¥{{ formatMoney(expenseLimit) }}</span>
</div>
<div class="formula-operator">
=
</div>
<div class="formula-item">
<span class="formula-label">计划存款</span>
<span class="formula-value">¥{{ formatMoney(currentBudget.limit) }}</span>
</div>
</div>
</div>
<div class="detail-section result-section">
<div class="section-title">
<van-icon name="chart-trending-o" />
存款结果
<div class="detail-section result-section">
<div class="section-title">
<van-icon name="chart-trending-o" />
存款结果
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">计划存款</span>
<span class="detail-value">¥{{ formatMoney(currentBudget.limit) }}</span>
</div>
<div class="section-content">
<div class="detail-row">
<span class="detail-label">计划存款</span>
<span class="detail-value">¥{{ formatMoney(currentBudget.limit) }}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际存款</span>
<span
class="detail-value"
:class="{ income: currentBudget.current >= currentBudget.limit }"
>¥{{ formatMoney(currentBudget.current) }}</span>
</div>
<div class="detail-row highlight">
<span class="detail-label">还差</span>
<span class="detail-value expense">¥{{
formatMoney(Math.max(0, currentBudget.limit - currentBudget.current))
}}</span>
</div>
<div class="detail-row">
<span class="detail-label">实际存款</span>
<span
class="detail-value"
:class="{ income: currentBudget.current >= currentBudget.limit }"
>¥{{ formatMoney(currentBudget.current) }}</span>
</div>
<div class="detail-row highlight">
<span class="detail-label">还差</span>
<span class="detail-value expense">¥{{
formatMoney(Math.max(0, currentBudget.limit - currentBudget.current))
}}</span>
</div>
</div>
</div>
</div>
</div>
</van-popup>
</PopupContainer>
</template>
<script setup>
import { ref, computed } from 'vue'
import BudgetCard from '@/components/Budget/BudgetCard.vue'
import { BudgetPeriodType } from '@/constants/enums'
import PopupContainer from '@/components/PopupContainer.vue'
// Props
const props = defineProps({
@@ -349,41 +336,6 @@ const getProgressColor = (budget) => {
color: var(--van-success-color);
}
.detail-popup-content {
height: 100%;
display: flex;
flex-direction: column;
background-color: var(--van-background-2);
}
.popup-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px;
border-bottom: 1px solid var(--van-border-color);
background-color: var(--van-background-2);
}
.popup-title {
margin: 0;
font-size: 18px;
font-weight: 600;
color: var(--van-text-color);
}
.close-icon {
color: var(--van-text-color-2);
cursor: pointer;
padding: 8px;
}
.popup-body {
flex: 1;
overflow-y: auto;
padding: 16px;
}
.detail-content {
display: flex;
flex-direction: column;