gitea_admin/krishna_sales
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: bar graph fixed

Browse Source
This commit is contained in:
suryac 2026-08-18 12:38:35 +05:30
parent 819b43bd77
commit 060ec00d8d
2 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/dv/StoreDetail.tsx
View File

@ -187,8 +187,8 @@ export function StoreDetail({ instanceId, onBack, onEdit, refreshKey }: StoreDet
<div className="bg-[var(--tiles-card-bg)] rounded-2xl border border-slate-200 shadow-sm overflow-hidden flex flex-col md:flex-row">
{/* Image Section */}
{imageUrl ? (
<div className="md:w-1/3 lg:w-1/4 h-48 md:h-auto relative bg-slate-100">
<img src={imageUrl} alt={String(businessName)} className="w-full h-full object-cover" />
<div className="md:w-1/3 lg:w-1/4 h-48 md:h-auto relative bg-slate-100 shrink-0">
<img src={imageUrl} alt={String(businessName)} className="absolute inset-0 w-full h-full object-cover" />
</div>
) : (
<div className="md:w-1/3 lg:w-1/4 h-48 md:h-auto flex items-center justify-center bg-slate-100 border-r border-slate-200">
@ -321,32 +321,32 @@ export function StoreDetail({ instanceId, onBack, onEdit, refreshKey }: StoreDet
{/* Order Potential Card */}
{Array.isArray(potential) && potential.length > 0 && (
<Card pad={false} className="overflow-hidden border-slate-200 shadow-sm">
<div className="flex items-center gap-2 p-4 border-b border-slate-100 bg-[var(--tiles-card-bg)]">
<FileText size={16} className="text-slate-400" />
<h3 className="text-xs font-bold text-slate-500 uppercase tracking-wider m-0">Order Potential</h3>
<Card pad={false} className="overflow-hidden border-emerald-200 shadow-sm">
<div className="flex items-center gap-2 p-4 border-b border-emerald-100 bg-emerald-50">
<FileText size={16} className="text-emerald-600" />
<h3 className="text-xs font-bold text-emerald-800 uppercase tracking-wider m-0">Order Potential</h3>
</div>
<div className="bg-[var(--tiles-card-bg)]">
<table className="w-full text-sm text-left">
<thead className="bg-slate-50 border-b border-slate-100">
<thead className="bg-emerald-50 border-b border-emerald-100">
<tr>
<th className="py-3 px-5 font-bold text-slate-500 text-xs uppercase tracking-wider">Product Category</th>
<th className="py-3 px-5 font-bold text-slate-500 text-xs uppercase tracking-wider text-right">Quantity</th>
<th className="py-3 px-5 font-bold text-emerald-800 text-xs uppercase tracking-wider">Product Category</th>
<th className="py-3 px-5 font-bold text-emerald-800 text-xs uppercase tracking-wider text-right">Quantity</th>
</tr>
</thead>
<tbody>
{potential.map((p: any, idx: number) => {
if (!p.product_category && !p.quantity) return null;
return (
<tr key={idx} className="border-b border-slate-100 last:border-0 hover:bg-slate-50/50">
<td className="py-3 px-5 font-semibold text-slate-900">{p.product_category ? String(p.product_category) : '-'}</td>
<td className="py-3 px-5 text-slate-700 text-right">{p.quantity ? String(p.quantity) : '0'}</td>
<tr key={idx} className="border-b border-emerald-50 last:border-0 hover:bg-emerald-50/50">
<td className="py-3 px-5 font-semibold text-emerald-900">{p.product_category ? String(p.product_category) : '-'}</td>
<td className="py-3 px-5 text-emerald-700 text-right">{p.quantity ? String(p.quantity) : '0'}</td>
</tr>
);
})}
<tr className="bg-slate-50 border-t border-slate-200 font-bold">
<td className="py-3 px-5 text-slate-900">Total</td>
<td className="py-3 px-5 text-slate-900 text-right">{totalPotential}</td>
<tr className="bg-emerald-50 border-t border-emerald-200 font-bold">
<td className="py-3 px-5 text-emerald-900">Total</td>
<td className="py-3 px-5 text-emerald-900 text-right">{totalPotential}</td>
</tr>
</tbody>
</table>

16
src/components/reusable/AnalyticsChart.tsx
View File

@ -126,20 +126,21 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
interval={0}
dy={10}
dx={-5}
height={70}
height={90}
/>
<YAxis
axisLine={false}
tickLine={false}
tick={{ fontSize: 12, fill: '#64748B' }}
allowDecimals={false}
width={80}
width={40}
/>
<Tooltip
cursor={{ fill: '#F8FAFC', stroke: '#E2E8F0', strokeWidth: 1, strokeDasharray: '3 3' }}
contentStyle={{ borderRadius: '8px', border: '1px solid #E2E8F0', boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1)', fontSize: '14px', fontFamily: 'inherit' }}
labelStyle={{ fontWeight: 'bold', color: '#0F172A', marginBottom: '4px' }}
wrapperStyle={{ zIndex: 1000 }}
allowEscapeViewBox={{ x: true, y: true }}
/>
{hasSeries && <Legend wrapperStyle={{ paddingTop: '20px' }} />}
{seriesKeys.map((key, i) => {
@ -189,7 +190,7 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
};
return (
<Card key={chart.chart_uid || idx} title={title} className={`shadow-sm border border-gray-100 !bg-[var(--tiles-card-bg)] ${isFullWidth ? fullSpanClass : ''}`}>
<Card key={chart.chart_uid || idx} title={title} className={`shadow-sm border border-gray-100 !bg-[var(--tiles-card-bg)] ${isFullWidth ? fullSpanClass : ''} !overflow-visible`}>
<div className={`h-[320px] w-full mt-4 ${minChartWidth > 100 ? 'overflow-x-auto scrollbar-slim' : ''}`}>
{chartType === 5 ? (
<div className="w-full h-full overflow-y-auto pr-2 scrollbar-slim">
@ -215,7 +216,7 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
</table>
</div>
) : (
<div style={{ minWidth: minChartWidth > 100 ? `${minChartWidth}px` : '100%', height: '100%' }}>
<div style={{ width: '100%', minWidth: minChartWidth > 100 ? `${minChartWidth}px` : '100%', height: '100%' }}>
<ResponsiveContainer width="100%" height="100%" className="focus:outline-none [&_.recharts-wrapper]:outline-none [&_.recharts-surface]:outline-none" style={{ outline: 'none' }}>
{chartType === 3 || chartType === 4 ? (
<PieChart margin={{ top: 10, right: 10, left: 10, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
@ -223,6 +224,7 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
contentStyle={{ borderRadius: '8px', border: '1px solid #E2E8F0', boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1)', fontSize: '14px', fontFamily: 'inherit' }}
itemStyle={{ color: '#0F172A', fontWeight: '500' }}
wrapperStyle={{ zIndex: 1000 }}
allowEscapeViewBox={{ x: true, y: true }}
/>
<Legend wrapperStyle={{ paddingTop: '20px' }} />
<Pie
@ -243,15 +245,15 @@ export function AnalyticsChart({ data, gridCols }: AnalyticsChartProps) {
</Pie>
</PieChart>
) : chartType === 1 ? (
<LineChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
<LineChart data={finalData} margin={{ top: 10, right: 30, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
{renderChartContent()}
</LineChart>
) : chartType === 2 ? (
<AreaChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
<AreaChart data={finalData} margin={{ top: 10, right: 30, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
{renderChartContent()}
</AreaChart>
) : (
<BarChart data={finalData} margin={{ top: 10, right: 10, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
<BarChart data={finalData} margin={{ top: 10, right: 30, left: 0, bottom: 10 }} className="focus:outline-none outline-none" style={{ outline: 'none' }}>
{renderChartContent()}
</BarChart>
)}