Akhib.Shaik/Seera
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lastest dashboard changes

Browse Source
This commit is contained in:
Akhib.Shaik 2025-11-13 17:32:40 +05:30
parent 037c11f06a
commit de987a9fc5
2 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/pages/ModernDashboard.tsx
View File

@ -681,7 +681,7 @@ const CompletionRateCard: React.FC<{
: '0.00'; : '0.00';
return ( return (
<div className="bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-all p-5 border border-gray-200 dark:border-gray-700"> <div className="bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-all px-5 border border-gray-200 dark:border-gray-700">
<div className="mb-3"> <div className="mb-3">
<div className="text-2xl font-semibold text-gray-900 dark:text-white mb-2">{completionRate}%</div> <div className="text-2xl font-semibold text-gray-900 dark:text-white mb-2">{completionRate}%</div>
<div className="text-sm font-medium text-indigo-600 dark:text-indigo-400 mb-1">Completion Rate</div> <div className="text-sm font-medium text-indigo-600 dark:text-indigo-400 mb-1">Completion Rate</div>
@ -692,7 +692,7 @@ const CompletionRateCard: React.FC<{
</div> </div>
{/* Mini Stats */} {/* Mini Stats */}
<div className="grid grid-cols-3 gap-3 mt-4 pt-4 border-t border-gray-200 dark:border-gray-700"> <div className="grid grid-cols-3 gap-3 mt-2 pt-2 mb-2 pb-2 border-t border-gray-200 dark:border-gray-700">
<div className="text-center"> <div className="text-center">
<div className="text-lg font-semibold text-indigo-600 dark:text-indigo-400">{totalWorkOrders}</div> <div className="text-lg font-semibold text-indigo-600 dark:text-indigo-400">{totalWorkOrders}</div>
<div className="text-[9px] font-medium text-gray-500 dark:text-gray-400 uppercase">Total</div> <div className="text-[9px] font-medium text-gray-500 dark:text-gray-400 uppercase">Total</div>
@ -995,14 +995,17 @@ const BarChart: React.FC<{ data: any }> = ({ data }) => {
const allValues = datasets.flatMap((ds: any) => ds.values || []); const allValues = datasets.flatMap((ds: any) => ds.values || []);
const max = Math.max(...allValues, 1); const max = Math.max(...allValues, 1);
const chartHeight = 250; const chartHeight = 250;
const width = 800; // Increase width based on number of labels to prevent overlap
const minBarSpacing = 60; // Minimum spacing between bars
const calculatedWidth = Math.max(800, labels.length * minBarSpacing + 100);
const width = calculatedWidth;
// Generate smooth line data (Average line overlay) // Generate smooth line data (Average line overlay)
const lineData = datasets[0]?.values || []; const lineData = datasets[0]?.values || [];
return ( return (
<div className="relative w-full"> <div className="relative w-full overflow-x-auto">
<svg width="100%" height="280" viewBox={`0 0 ${width} ${chartHeight + 30}`} className="w-full"> <svg width="100%" height="320" viewBox={`0 0 ${width} ${chartHeight + 70}`} className="w-full" preserveAspectRatio="xMidYMid meet">
<defs> <defs>
<linearGradient id="barGradient" x1="0%" y1="0%" x2="0%" y2="100%"> <linearGradient id="barGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style={{ stopColor: '#8B5CF6', stopOpacity: 0.8 }} /> <stop offset="0%" style={{ stopColor: '#8B5CF6', stopOpacity: 0.8 }} />
@ -1095,16 +1098,20 @@ const BarChart: React.FC<{ data: any }> = ({ data }) => {
{/* X-axis labels */} {/* X-axis labels */}
{labels.map((label: string, i: number) => { {labels.map((label: string, i: number) => {
const x = 80 + (i * ((width - 100) / labels.length)) + 20; const barSpacing = (width - 100) / labels.length;
const x = 80 + (i * barSpacing) + (barSpacing / 2);
const truncatedLabel = label && label.length > 15 ? label.substring(0, 13) + '...' : label || 'null';
return ( return (
<text <text
key={i} key={i}
x={x} x={x}
y={chartHeight + 20} y={chartHeight + 50}
transform={`rotate(-45, ${x}, ${chartHeight + 50})`}
textAnchor="middle" textAnchor="middle"
className="text-xs fill-gray-600 dark:fill-gray-400" className="text-xs fill-gray-600 dark:fill-gray-400"
> >
{label} {truncatedLabel}
</text> </text>
); );
})} })}

3
vite.config.ts
View File

@ -6,6 +6,9 @@ export default defineConfig({
plugins: [react()], plugins: [react()],
server: { server: {
port: 3000, port: 3000,
allowedHosts: [
'monotriglyphic-uniformless-rema.ngrok-free.dev'
],
proxy: { proxy: {
// Proxy API requests to Frappe backend // Proxy API requests to Frappe backend
'/api': { '/api': {