{#if processedData().data.length > 1} {@const { data, categories, maxValue } = processedData()}
每日支出趋势
{descriptionText()}
{timeRangeOptions.find(o => o.value === timeRange)?.label}
{#each timeRangeOptions as option}
{option.label}
{/each}
{#each categories as category, i} {@const isHidden = hiddenCategories.has(category)}
toggleCategory(category)} title={isHidden ? '点击显示' : '点击隐藏'} >
{category}
{/each}
handleMouseMove(e, data, maxValue)} onmouseleave={handleMouseLeave} onclick={(e) => handleClick(e, data, maxValue)} >
{#each getYTicks(maxValue) as tick}
{tick.label}
{/each}
{#each getXTicks(data) as tick}
{tick.label}
{/each} {#each [...categories].reverse() as category, i} {@const colorIdx = categories.length - 1 - i}
{/each} {#if tooltipData}
{#each categories as category, i} {#if tooltipData[category] > 0}
{/if} {/each} {/if}
{#if tooltipData} {@const tooltipLeftPercent = (tooltipX / chartWidth) * 100} {@const adjustedLeft = tooltipLeftPercent > 75 ? tooltipLeftPercent - 25 : tooltipLeftPercent + 2}
{tooltipData.date.toLocaleDateString('zh-CN')}
{#each categories as category, i} {#if tooltipData[category] > 0}
{category}
¥{tooltipData[category].toFixed(2)}
{/if} {/each}
合计
¥{tooltipData.total.toFixed(2)}
{/if}
{#if trendInfo()} {@const info = trendInfo()} {#if info!.change >= 0}
+{Math.abs(info!.changePercent).toFixed(1)}%
{:else}
-{Math.abs(info!.changePercent).toFixed(1)}%
{/if}
较前一天
{/if}
点击图表查看当日详情
{/if}
{#if selectedDate} {selectedDate.toLocaleDateString('zh-CN', { year: 'numeric', month: 'long', day: 'numeric', weekday: 'long' })} {/if}
{#if selectedDateStats} {@const stats = selectedDateStats} 共 {stats!.count} 笔支出，合计 ¥{stats!.total.toFixed(2)} {/if}
{#if selectedDateStats} {@const stats = selectedDateStats}
分类汇总
{#each stats!.categories as cat, i}
{cat.category}
({cat.count}笔)
¥{cat.amount.toFixed(2)}
{/each}
详细记录（点击表头排序）
toggleSort('time')} > 时间 {#if sortField === 'time'} {#if sortOrder === 'asc'}
{:else}
{/if} {:else}
{/if}
toggleSort('category')} > 分类 {#if sortField === 'category'} {#if sortOrder === 'asc'}
{:else}
{/if} {:else}
{/if}
toggleSort('merchant')} > 商家 {#if sortField === 'merchant'} {#if sortOrder === 'asc'}
{:else}
{/if} {:else}
{/if}
toggleSort('amount')} > 金额 {#if sortField === 'amount'} {#if sortOrder === 'asc'}
{:else}
{/if} {:else}
{/if}
{#each paginatedRecords as record}
{record.time.split(' ')[1] || '--:--'}
{record.category}
{record.merchant}
¥{record.amount}
{/each}
{#if totalPages > 1}
显示 {(currentPage - 1) * pageSize + 1}-{Math.min(currentPage * pageSize, sortedDateRecords.length)} 条，共 {sortedDateRecords.length} 条
goToPage(currentPage - 1)} >
{#each Array.from({ length: totalPages }, (_, i) => i + 1) as page} {#if page === 1 || page === totalPages || (page >= currentPage - 1 && page <= currentPage + 1)}
goToPage(page)} > {page}
{:else if page === currentPage - 2 || page === currentPage + 2}
...
{/if} {/each}
goToPage(currentPage + 1)} >
{/if}
{:else}
暂无数据
{/if}