estadisticas por estado, municipio y parroquia agregadas

apps/api/src/features/training/training.service.ts

@@ -4,7 +4,7 @@ import { and, eq, gte, ilike, lte, or, SQL, sql } from 'drizzle-orm';
 import { NodePgDatabase } from 'drizzle-orm/node-postgres';
 import { DRIZZLE_PROVIDER } from 'src/database/drizzle-provider';
 import * as schema from 'src/database/index';
-import { states, trainingSurveys } from 'src/database/index';
+import { municipalities, parishes, states, trainingSurveys } from 'src/database/index';
 
 import { PaginationDto } from '../../common/dto/pagination.dto';
 import { CreateTrainingDto } from './dto/create-training.dto';
@@ -120,6 +120,8 @@ export class TrainingService {
       isOpenSpaceDistribution,
       hasTransportDistribution,
       genderResult,
+      municipalityDistribution,
+      parishDistribution,
     ] = await Promise.all([
       // 1. Total OSPs
       this.drizzle
@@ -275,6 +277,31 @@ export class TrainingService {
         })
         .from(trainingSurveys)
         .where(whereCondition),
+
+      // 17. Distribución por Municipio
+      this.drizzle
+        .select({
+          name: sql<string>`COALESCE(${municipalities.name}, 'Sin Asignar')`,
+          value: sql<number>`count(${trainingSurveys.id})`,
+        })
+        .from(trainingSurveys)
+        .leftJoin(
+          municipalities,
+          eq(trainingSurveys.municipality, municipalities.id),
+        )
+        .where(whereCondition)
+        .groupBy(municipalities.name),
+
+      // 18. Distribución por Parroquia
+      this.drizzle
+        .select({
+          name: sql<string>`COALESCE(${parishes.name}, 'Sin Asignar')`,
+          value: sql<number>`count(${trainingSurveys.id})`,
+        })
+        .from(trainingSurveys)
+        .leftJoin(parishes, eq(trainingSurveys.parish, parishes.id))
+        .where(whereCondition)
+        .groupBy(parishes.name),
     ]);
 
     return {
@@ -334,6 +361,14 @@ export class TrainingService {
         { name: 'Mujeres', value: Number(genderResult[0]?.women || 0) },
         { name: 'Hombres', value: Number(genderResult[0]?.men || 0) },
       ],
+      municipalityDistribution: municipalityDistribution.map((item) => ({
+        ...item,
+        value: Number(item.value),
+      })),
+      parishDistribution: parishDistribution.map((item) => ({
+        ...item,
+        value: Number(item.value),
+      })),
     };
   }
 

apps/web/feactures/training/components/training-statistics.tsx

@@ -117,6 +117,8 @@ export function TrainingStatistics() {
     isOpenSpaceDistribution,
     hasTransportDistribution,
     genderDistribution,
+    municipalityDistribution,
+    parishDistribution,
   } = data;
 
   const COLORS = [
@@ -279,8 +281,8 @@ export function TrainingStatistics() {
           </CardContent>
         </Card>
 
-        {/* State Distribution */}
+        {/* Location Distribution (Dynamic) */}
-        {/* <Card className="col-span-full">
+        <Card className="col-span-full">
           <CardHeader>
             <CardTitle>Distribución por Estado</CardTitle>
             <CardDescription>OSP registradas por estado</CardDescription>
@@ -300,7 +302,69 @@ export function TrainingStatistics() {
               </BarChart>
             </ResponsiveContainer>
           </CardContent>
-                </Card> */}
+        </Card>
+
+        {stateId > 0 ? (
+          <Card className="col-span-full">
+            <CardHeader>
+              <CardTitle>Distribución por Municipio</CardTitle>
+              <CardDescription>OSP registradas en este estado</CardDescription>
+            </CardHeader>
+            <CardContent className="h-[400px]">
+              <ResponsiveContainer width="100%" height="100%">
+                <BarChart
+                  data={municipalityDistribution}
+                  margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
+                >
+                  <CartesianGrid strokeDasharray="3 3" />
+                  <XAxis dataKey="name" />
+                  <YAxis />
+                  <Tooltip wrapperStyle={{ color: '#000' }} />
+                  <Legend />
+                  <Bar dataKey="value" fill="#0088FE" name="Cantidad" />
+                </BarChart>
+              </ResponsiveContainer>
+            </CardContent>
+          </Card>
+        ) : (
+          <Card className="col-span-full">
+            <CardHeader>
+              <CardTitle>Distribución por Municipio</CardTitle>
+              <CardDescription>Seleccione un estado</CardDescription>
+            </CardHeader>
+          </Card>
+        )}
+
+        {municipalityId > 0 ? (
+          <Card className="col-span-full">
+            <CardHeader>
+              <CardTitle>Distribución por Parroquia</CardTitle>
+              <CardDescription>OSP registradas en este municipio</CardDescription>
+            </CardHeader>
+            <CardContent className="h-[400px]">
+              <ResponsiveContainer width="100%" height="100%">
+                <BarChart
+                  data={parishDistribution}
+                  margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
+                >
+                  <CartesianGrid strokeDasharray="3 3" />
+                  <XAxis dataKey="name" />
+                  <YAxis />
+                  <Tooltip wrapperStyle={{ color: '#000' }} />
+                  <Legend />
+                  <Bar dataKey="value" fill="#FFBB28" name="Cantidad" />
+                </BarChart>
+              </ResponsiveContainer>
+            </CardContent>
+          </Card>
+        ) : (
+          <Card className="col-span-full">
+            <CardHeader>
+              <CardTitle>Distribución por Parroquia</CardTitle>
+              <CardDescription>Seleccione un municipio</CardDescription>
+            </CardHeader>
+          </Card>
+        )}
 
         {/* Year Distribution */}
         <Card className="col-span-full lg:col-span-1">
@@ -483,7 +547,7 @@ export function TrainingStatistics() {
         </Card>
 
         {/* STRUCTURE TYPE DISTRIBUTION */}
-        <Card className="col-span-full lg:col-span-1">
+        <Card className="col-span-full lg:col-span-2">
           <CardHeader>
             <CardTitle>Tipo de Estructura</CardTitle>
             <CardDescription>Distribución física</CardDescription>

apps/web/feactures/training/schemas/statistics.ts

@@ -25,6 +25,8 @@ export const trainingStatisticsSchema = z.object({
   isOpenSpaceDistribution: z.array(statisticsItemSchema),
   hasTransportDistribution: z.array(statisticsItemSchema),
   genderDistribution: z.array(statisticsItemSchema),
+  municipalityDistribution: z.array(statisticsItemSchema),
+  parishDistribution: z.array(statisticsItemSchema),
 });
 
 export type TrainingStatisticsData = z.infer<typeof trainingStatisticsSchema>;