From 51dcf6f9a36ff6a1387ab6ba8e613692a930628b Mon Sep 17 00:00:00 2001
From: "raul.velazco" <raul310882@gmail.com>
Date: Mon, 6 Apr 2026 14:30:00 -0600
Subject: [PATCH] feat: add is_active field to risk factors and update UI
 components for status display

---
 .../risk-factors/RiskFactorModal.vue          | 42 ++++++++++++++++---
 .../components/risk-factors/RiskFactors.vue   | 24 +++++++----
 .../catalog/types/risk-factors.interfaces.ts  |  2 +
 3 files changed, 56 insertions(+), 12 deletions(-)

diff --git a/src/modules/catalog/components/risk-factors/RiskFactorModal.vue b/src/modules/catalog/components/risk-factors/RiskFactorModal.vue
index 8aa507c..72956d1 100644
--- a/src/modules/catalog/components/risk-factors/RiskFactorModal.vue
+++ b/src/modules/catalog/components/risk-factors/RiskFactorModal.vue
@@ -44,7 +44,7 @@
             <small v-if="errors.evaluation_context" class="p-error">{{ errors.evaluation_context[0] }}</small>
           </div>
 
-          <div class="flex flex-col gap-2 md:col-span-2">
+          <div class="flex flex-col gap-2 md:col-span-1">
             <label for="description" class="font-semibold">Descripción (Opcional)</label>
             <Textarea id="description" 
                       v-model="form.description" 
@@ -52,6 +52,16 @@
                       autoResize 
                       placeholder="Detalles sobre este factor de riesgo..." />
           </div>
+
+          <div class="flex flex-col gap-2 md:col-span-1 justify-center">
+            <div class="flex items-center gap-3 p-4 bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700">
+              <InputSwitch v-model="form.is_active" :binary="true" inputId="is_active" />
+              <div class="flex flex-col">
+                <label for="is_active" class="font-bold mb-0 leading-tight">Estado Activo</label>
+                <small class="text-surface-500">Determina si este factor estará disponible en nuevas evaluaciones</small>
+              </div>
+            </div>
+          </div>
         </div>
 
         <!-- Formulario Detalle (DataTable) -->
@@ -92,6 +102,16 @@
               </template>
             </Column>
 
+            <Column field="is_active" header="Estado" style="width: 10%" bodyStyle="text-align:center">
+              <template #editor="{ data, field }">
+                <InputSwitch v-model="data[field]" :binary="true" />
+              </template>
+              <template #body="{ data }">
+                <Tag :value="data.is_active !== false ? 'Activo' : 'Inactivo'" 
+                     :severity="data.is_active !== false ? 'success' : 'danger'" />
+              </template>
+            </Column>
+
             <Column :rowEditor="true" style="width: 10%; min-width: 8rem" bodyStyle="text-align:center"></Column>
             
             <Column style="width: 10%; min-width: 4rem" bodyStyle="text-align:center">
@@ -100,7 +120,8 @@
                         severity="danger" 
                         text 
                         rounded 
-                        @click="removeOption(index)" />
+                        @click="removeOption(index)" 
+                        title="Eliminar" />
               </template>
             </Column>
 
@@ -129,6 +150,7 @@ import Column from 'primevue/column';
 import Button from 'primevue/button';
 import InputNumber from 'primevue/inputnumber';
 import Tag from 'primevue/tag';
+import InputSwitch from 'primevue/inputswitch';
 import { riskFactorServices } from '../../services/risk-factors.services';
 import type { RiskFactor, RiskOption, RiskFactorFormErrors } from '../../types/risk-factors.interfaces';
 
@@ -150,7 +172,7 @@ const errors = ref<RiskFactorFormErrors>({});
 
 const contextOptions = [
   { label: 'Ruta', value: 1 },
-  { label: 'Programa', value: 2 }
+  { label: 'Viaje', value: 2 }
 ];
 
 const form = reactive<RiskFactor & { options: ExtendedRiskOption[] }>({
@@ -158,6 +180,7 @@ const form = reactive<RiskFactor & { options: ExtendedRiskOption[] }>({
   name: '',
   description: '',
   evaluation_context: 1,
+  is_active: true,
   options: []
 });
 
@@ -172,7 +195,8 @@ onMounted(() => {
 const addOption = () => {
     const newOption: ExtendedRiskOption = {
         name: '',
-        value: 1, // Valor por defecto solicitado
+        value: 1,
+        is_active: true,
         tempId: Date.now() + Math.random()
     };
     form.options.push(newOption);
@@ -219,6 +243,12 @@ const handleSave = async () => {
     loading.value = true;
     try {
         const payload = JSON.parse(JSON.stringify(form));
+      payload.options = payload.options.map((option: any) => ({
+        id: option.id,
+        name: option.name,
+        value: option.value,
+        is_active: option.is_active !== false,
+      }));
         let response;
 
         if (form.id && !isDuplicating.value) {
@@ -233,7 +263,9 @@ const handleSave = async () => {
         if (error.response?.data?.errors) {
             errors.value = error.response.data.errors;
         }
-        toast.add({ severity: 'error', summary: 'Error', detail: 'No se pudo guardar el factor de riesgo', life: 3000 });
+        
+        const detail = error.response?.data?.error || error.response?.data?.message || 'No se pudo guardar el factor de riesgo';
+        toast.add({ severity: 'error', summary: 'Error', detail, life: 5000 });
     } finally {
         loading.value = false;
     }
diff --git a/src/modules/catalog/components/risk-factors/RiskFactors.vue b/src/modules/catalog/components/risk-factors/RiskFactors.vue
index 59c7b4d..adaeee3 100644
--- a/src/modules/catalog/components/risk-factors/RiskFactors.vue
+++ b/src/modules/catalog/components/risk-factors/RiskFactors.vue
@@ -29,10 +29,17 @@
 
           <Column field="name" header="Nombre" sortable />
           
+          <Column field="is_active" header="Estado" sortable>
+            <template #body="{ data }">
+              <Tag :value="data.is_active !== false ? 'Activo' : 'Inactivo'" 
+                   :severity="data.is_active !== false ? 'success' : 'danger'" />
+            </template>
+          </Column>
+
           <Column field="evaluation_context" header="Contexto" sortable>
             <template #body="{ data }">
-              <Tag :value="data.evaluation_context === 1 ? 'Ruta' : 'Programa'" 
-                   :severity="data.evaluation_context === 1 ? 'info' : 'success'" />
+              <Tag :value="data.evaluation_context === 1 ? 'Ruta' : 'Viaje'" 
+                   :severity="data.evaluation_context === 1 ? 'info' : 'secondary'" />
             </template>
           </Column>
 
@@ -50,7 +57,7 @@
             </template>
           </Column>
 
-          <Column header="Acciones" headerStyle="min-width:10rem">
+          <Column header="Acciones" headerStyle="min-width:12rem">
             <template #body="{ data }">
               <div class="flex gap-2">
                 <Button icon="pi pi-pencil" 
@@ -58,7 +65,8 @@
                         text 
                         rounded 
                         @click="editFactor(data)" 
-                        v-if="hasPermission('risk-factors.update')" />
+                        v-if="hasPermission('risk-factors.update')" 
+                        title="Editar" />
                 
                 <Button icon="pi pi-copy" 
                         severity="secondary" 
@@ -73,7 +81,8 @@
                         text 
                         rounded 
                         @click="confirmDelete(data)" 
-                        v-if="hasPermission('risk-factors.destroy')" />
+                        v-if="hasPermission('risk-factors.destroy')" 
+                        title="Eliminar" />
               </div>
             </template>
           </Column>
@@ -193,8 +202,9 @@ const confirmDelete = (factor: RiskFactor) => {
                 await riskFactorServices.deleteRiskFactor(factor.id!);
                 toast.add({ severity: 'success', summary: 'Eliminado', detail: 'Factor eliminado correctamente', life: 3000 });
                 fetchFactors();
-            } catch (error) {
-                toast.add({ severity: 'error', summary: 'Error', detail: 'No se pudo eliminar el factor', life: 3000 });
+            } catch (error: any) {
+                const detail = error.response?.data?.error || error.response?.data?.message || 'No se pudo eliminar el factor';
+                toast.add({ severity: 'error', summary: 'Error de Eliminación', detail, life: 5000 });
             }
         }
     });
diff --git a/src/modules/catalog/types/risk-factors.interfaces.ts b/src/modules/catalog/types/risk-factors.interfaces.ts
index 56209c7..f12c290 100644
--- a/src/modules/catalog/types/risk-factors.interfaces.ts
+++ b/src/modules/catalog/types/risk-factors.interfaces.ts
@@ -7,6 +7,7 @@ export interface RiskOption {
     risk_factor_id?: number;
     name: string;
     value: number;
+    is_active?: boolean;
 }
 
 export interface RiskFactor {
@@ -15,6 +16,7 @@ export interface RiskFactor {
     description: string | null;
     evaluation_context: number;
     tenant_id?: number;
+    is_active?: boolean;
     options?: RiskOption[];
     created_at?: string;
     updated_at?: string;