feat: enhance Tauri charts with smooth curves and forecasting

- Implemented a smooth curve rendering for the TauriLineChart using a cubic Bezier path.
- Added a forecasting feature to project trends based on recent data points.
- Updated TauriDashboardView to pass the current month for accurate forecasting.
- Refactored TauriLineChart to handle actual and forecasted data points distinctly.
- Introduced gradient strokes and glow effects to align with ApexCharts styling.
- Enhanced user interaction with hover markers and tooltips for forecasted data.
- Added a new test suite for ClinicDetailPage to ensure proper rendering and functionality.
This commit is contained in:
hamed
2026-07-19 11:25:45 +03:30
parent 15366788d5
commit e7de7aa88b
6 changed files with 492 additions and 234 deletions
@@ -88,6 +88,8 @@ export interface TauriDashboardViewProps {
onRevenueYearChange: (y: number) => void;
/** سال شمسی جاری — مبنای گزینه‌های سلکتور سال */
currentJalaliYear: number;
/** ماه شمسی جاری (۱..۱۲) — مرز دادهٔ واقعی و پیش‌بینی در نمودار درآمد */
currentJalaliMonth: number;
}
export function TauriDashboardView({
@@ -103,8 +105,12 @@ export function TauriDashboardView({
revenueYear,
onRevenueYearChange,
currentJalaliYear,
currentJalaliMonth,
}: TauriDashboardViewProps) {
const yearOpts = React.useMemo(() => yearOptions(currentJalaliYear), [currentJalaliYear]);
// در سالِ جاری فقط تا ماه جاری داده‌ی واقعی وجود دارد؛ بقیه پیش‌بینی می‌شود.
// سال‌های گذشته کامل‌اند و پیش‌بینی ندارند.
const incomeActualCount = revenueYear === currentJalaliYear ? currentJalaliMonth : undefined;
return (
<div className="flex flex-col items-stretch gap-y-[24px] w-full">
{/* Cards */}
@@ -127,7 +133,7 @@ export function TauriDashboardView({
selectorValue={revenueYear}
onSelectorChange={onRevenueYearChange}
>
<TauriLineChart data={incomeLine} />
<TauriLineChart data={incomeLine} actualCount={incomeActualCount} />
</ChartCard>
</div>