- Add NewAppointmentsTable for displaying today's appointments with status chips and formatted time. - Implement TauriCharts for bar and line charts representing patient counts and revenue. - Create TauriDashboardView to combine stat cards, charts, and new appointments list. - Introduce TauriStatCards for displaying key statistics with icons. - Add dashboardIcons for SVG icons used in stat cards. - Implement tests for DashboardPage to ensure correct rendering and API calls. - Create DashboardTodayAppointmentsTest to validate extended fields in today's appointments API response.
78 lines
5.6 KiB
TypeScript
78 lines
5.6 KiB
TypeScript
/**
|
|
* Dashboard card icons — ported 1:1 (exact SVG paths) from clinic-pro-tauri
|
|
* (`src/assets/icon/{UserAddCD,CardCD,CardTickCD,CalendarCD,ArrowDownBlueP}.jsx`)
|
|
* to keep the ported dashboard pixel-identical. Plain SVG, no icon library.
|
|
*/
|
|
import React from 'react';
|
|
|
|
const S = {
|
|
className: 'w-full h-full',
|
|
xmlns: 'http://www.w3.org/2000/svg',
|
|
fill: 'none',
|
|
} as const;
|
|
|
|
/** مراجعین — total patients card */
|
|
export function UserAddIcon() {
|
|
return (
|
|
<svg {...S} width="24" height="24" viewBox="0 0 24 24">
|
|
<path d="M12 12C14.7614 12 17 9.76142 17 7C17 4.23858 14.7614 2 12 2C9.23858 2 7 4.23858 7 7C7 9.76142 9.23858 12 12 12Z" stroke="white" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M3.40991 22C3.40991 18.13 7.25991 15 11.9999 15C12.9599 15 13.8899 15.13 14.7599 15.37" stroke="white" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M22 18C22 18.32 21.96 18.63 21.88 18.93C21.79 19.33 21.63 19.72 21.42 20.06C20.73 21.22 19.46 22 18 22C16.97 22 16.04 21.61 15.34 20.97C15.04 20.71 14.78 20.4 14.58 20.06C14.21 19.46 14 18.75 14 18C14 16.92 14.43 15.93 15.13 15.21C15.86 14.46 16.88 14 18 14C19.18 14 20.25 14.51 20.97 15.33C21.61 16.04 22 16.98 22 18Z" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M19.4897 17.98H16.5098" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M18 16.52V19.51" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
/** کل پرداختیها — total payments card */
|
|
export function CardIcon() {
|
|
return (
|
|
<svg {...S} width="25" height="24" viewBox="0 0 25 24">
|
|
<path d="M2.5 8.50488H22.5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M6.5 16.5049H8.5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M11 16.5049H15" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M6.94 3.50488H18.05C21.61 3.50488 22.5 4.38488 22.5 7.89488V16.1049C22.5 19.6149 21.61 20.4949 18.06 20.4949H6.94C3.39 20.5049 2.5 19.6249 2.5 16.1149V7.89488C2.5 4.38488 3.39 3.50488 6.94 3.50488Z" stroke="white" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
/** پرداختیهای امروز — today payments card */
|
|
export function CardTickIcon() {
|
|
return (
|
|
<svg {...S} width="25" height="24" viewBox="0 0 25 24">
|
|
<path d="M2.5 8.5H14" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M6.5 16.5H8.5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M11 16.5H15" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M22.5 11.03V16.11C22.5 19.62 21.61 20.5 18.06 20.5H6.94C3.39 20.5 2.5 19.62 2.5 16.11V7.89C2.5 4.38 3.39 3.5 6.94 3.5H14" stroke="white" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M17 6L18.5 7.5L22.5 3.5" stroke="white" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
/** تعداد نوبتهای امروز — today appointments card */
|
|
export function CalendarIcon() {
|
|
return (
|
|
<svg {...S} width="24" height="24" viewBox="0 0 24 24">
|
|
<path d="M8 2V5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M16 2V5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M3.5 9.08984H20.5" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M18 23C20.2091 23 22 21.2091 22 19C22 16.7909 20.2091 15 18 15C15.7909 15 14 16.7909 14 19C14 21.2091 15.7909 23 18 23Z" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M19.49 19.0498H16.51" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M18 17.5898V20.5798" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M21 8.5V16.36C20.27 15.53 19.2 15 18 15C15.79 15 14 16.79 14 19C14 19.75 14.21 20.46 14.58 21.06C14.79 21.42 15.06 21.74 15.37 22H8C4.5 22 3 20 3 17V8.5C3 5.5 4.5 3.5 8 3.5H16C19.5 3.5 21 5.5 21 8.5Z" stroke="white" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M11.9955 13.7002H12.0045" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M8.29431 13.7002H8.30329" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
|
<path d="M8.29431 16.7002H8.30329" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
/** فلش رو به پایین — status chip chevron (source: ArrowDownBlueP) */
|
|
export function ChevronDownIcon({ color = '#5559CE' }: { color?: string }) {
|
|
return (
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
|
|
<path d="M16.6004 7.4585L11.1671 12.8918C10.5254 13.5335 9.47539 13.5335 8.83372 12.8918L3.40039 7.4585" stroke={color} strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|