feat(calendar-v2): add delete functionality to transaction list
添加左滑删除功能: - 启用 show-delete prop - 实现 onTransactionDelete 事件处理器 - 删除后更新本地列表数据
This commit is contained in:
@@ -36,9 +36,10 @@
|
|||||||
:transactions="transactions"
|
:transactions="transactions"
|
||||||
:loading="transactionsLoading"
|
:loading="transactionsLoading"
|
||||||
:finished="true"
|
:finished="true"
|
||||||
:show-delete="false"
|
:show-delete="true"
|
||||||
:enable-filter="false"
|
:enable-filter="false"
|
||||||
@click="onTransactionClick"
|
@click="onTransactionClick"
|
||||||
|
@delete="onTransactionDelete"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -103,6 +104,13 @@ const onTransactionClick = (txn) => {
|
|||||||
emit('transactionClick', txn)
|
emit('transactionClick', txn)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 删除交易后的处理
|
||||||
|
const onTransactionDelete = (deletedId) => {
|
||||||
|
// BillListComponent 已经完成删除 API 调用
|
||||||
|
// 这里只需要从本地列表中移除该项
|
||||||
|
transactions.value = transactions.value.filter((t) => t.id !== deletedId)
|
||||||
|
}
|
||||||
|
|
||||||
// 点击 Smart 按钮
|
// 点击 Smart 按钮
|
||||||
const onSmartClick = () => {
|
const onSmartClick = () => {
|
||||||
emit('smartClick')
|
emit('smartClick')
|
||||||
@@ -117,7 +125,7 @@ const onSmartClick = () => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: var(--spacing-lg);
|
gap: var(--spacing-lg);
|
||||||
padding: var(--spacing-3xl);
|
padding: var(--spacing-xl, 16px);
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user