refactor: 统一账单列表组件,封装 BillListComponent
- 创建 BillListComponent 组件(基于 v2 风格,紧凑布局) - 支持筛选(类型、分类、日期范围)和排序(金额、时间) - 支持分页加载、左滑删除、点击详情、多选模式 - 支持 API 自动加载和 Custom 自定义数据两种模式 - 迁移 6 个页面/组件到新组件: - TransactionsRecord.vue - EmailRecord.vue - ClassificationNLP.vue - UnconfirmedClassification.vue - BudgetCard.vue - ReasonGroupList.vue - 删除旧版 TransactionList 组件 - 保留 CalendarV2 的特殊版本(有专用功能) - 添加完整的使用文档和 JSDoc 注释
This commit is contained in:
@@ -74,11 +74,13 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<TransactionList
|
||||
:transactions="classifyNode.children.map(c => c.transaction)"
|
||||
<BillListComponent
|
||||
data-source="custom"
|
||||
:transactions="classifyNode.children.map((c) => c.transaction)"
|
||||
:show-delete="false"
|
||||
:show-checkbox="true"
|
||||
:selected-ids="selectedIds"
|
||||
:enable-filter="false"
|
||||
@click="handleTransactionClick"
|
||||
@update:selected-ids="handleUpdateSelectedIds"
|
||||
/>
|
||||
@@ -103,7 +105,7 @@ import { useRouter } from 'vue-router'
|
||||
import { showToast, showConfirmDialog } from 'vant'
|
||||
import { getUnconfirmedTransactionList, confirmAllUnconfirmed } from '@/api/transactionRecord'
|
||||
import TransactionDetail from '@/components/TransactionDetail.vue'
|
||||
import TransactionList from '@/components/TransactionList.vue'
|
||||
import BillListComponent from '@/components/Bill/BillListComponent.vue'
|
||||
|
||||
const router = useRouter()
|
||||
const loading = ref(false)
|
||||
@@ -154,9 +156,13 @@ const handleConfirmSelected = async () => {
|
||||
}
|
||||
|
||||
const formatAmount = (amount) => {
|
||||
if (amount === null || amount === undefined) {return ''}
|
||||
if (amount === null || amount === undefined) {
|
||||
return ''
|
||||
}
|
||||
const num = parseFloat(amount)
|
||||
if (isNaN(num)) {return ''}
|
||||
if (isNaN(num)) {
|
||||
return ''
|
||||
}
|
||||
return num.toFixed(2)
|
||||
}
|
||||
|
||||
@@ -321,7 +327,7 @@ onMounted(() => {
|
||||
|
||||
.classify-collapse :deep(.van-cell-group--inset) {
|
||||
margin-left: -24px;
|
||||
width: calc(100vw - 48px)
|
||||
width: calc(100vw - 48px);
|
||||
}
|
||||
|
||||
:deep(.van-nav-bar) {
|
||||
|
||||
Reference in New Issue
Block a user