WIP: conceptos y multa
This commit is contained in:
Juan Felipe Zapata Moreno
parent
7f82f57588
commit
d9e71eaf55
@ -1,4 +1,4 @@
|
||||
VITE_APP_NAME=GOLSCONTROL
|
||||
VITE_APP_NAME=Ayuntamiento de Comalcalco
|
||||
VITE_APP_URL=http://frontend.golscontrol.test
|
||||
VITE_APP_LANG=es-MX
|
||||
VITE_APP_PORT=3000
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<html id="main-page" lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.png" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Holos</title>
|
||||
</head>
|
||||
|
||||
BIN
public/favicon.png
Normal file
BIN
public/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
@ -46,17 +46,17 @@ onMounted(async () => {
|
||||
/** Métodos */
|
||||
const handleSubmit = () => {
|
||||
const transformedData = {
|
||||
direction_id: typeof modelModal.value.direction === 'object' ? modelModal.value.direction.id : Number(modelModal.value.direction_id),
|
||||
unit_id: modelModal.value.unit ? (typeof modelModal.value.unit === 'object' ? modelModal.value.unit.id : Number(modelModal.value.unit)) : null,
|
||||
short_name: modelModal.value.short_name,
|
||||
name: modelModal.value.name,
|
||||
legal_instrument: modelModal.value.legal_instrument,
|
||||
article: modelModal.value.article,
|
||||
content: modelModal.value.content,
|
||||
min_amount_uma: modelModal.value.min_amount_uma ? Number(modelModal.value.min_amount_uma) : null,
|
||||
max_amount_uma: modelModal.value.max_amount_uma ? Number(modelModal.value.max_amount_uma) : null,
|
||||
min_amount_peso: modelModal.value.min_amount_peso ? Number(modelModal.value.min_amount_peso) : null,
|
||||
max_amount_peso: modelModal.value.max_amount_peso ? Number(modelModal.value.max_amount_peso) : null,
|
||||
direction_id: typeof form.direction === 'object' ? form.direction.id : Number(form.direction_id),
|
||||
unit_id: form.unit ? (typeof form.unit === 'object' ? form.unit.id : Number(form.unit)) : null,
|
||||
short_name: form.short_name,
|
||||
name: form.name,
|
||||
legal_instrument: form.legal_instrument,
|
||||
article: form.article,
|
||||
content: form.content,
|
||||
min_amount_uma: form.min_amount_uma ? Number(form.min_amount_uma) : null,
|
||||
max_amount_uma: form.max_amount_uma ? Number(form.max_amount_uma) : null,
|
||||
min_amount_peso: form.min_amount_peso ? Number(form.min_amount_peso) : null,
|
||||
max_amount_peso: form.max_amount_peso ? Number(form.max_amount_peso) : null,
|
||||
unit_cost_uma: form.unit_cost_uma ? Number(form.unit_cost_uma) : null,
|
||||
unit_cost_peso: form.unit_cost_peso ? Number(form.unit_cost_peso) : null,
|
||||
};
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import { useApi, apiURL } from "@/services/Api.js";
|
||||
|
||||
import Input from "@Holos/Form/Input.vue";
|
||||
import QRscan from "./QRscan.vue";
|
||||
@ -7,6 +8,8 @@ import QRscan from "./QRscan.vue";
|
||||
/** Eventos */
|
||||
const emit = defineEmits(["fine-searched"]);
|
||||
|
||||
const api = useApi();
|
||||
|
||||
/** Refs */
|
||||
const fineNumber = ref("");
|
||||
const fineData = ref({
|
||||
@ -21,35 +24,129 @@ const fineData = ref({
|
||||
});
|
||||
|
||||
/** Métodos */
|
||||
const handleSearch = () => {
|
||||
const handleSearch = async () => {
|
||||
if (!fineNumber.value.trim()) {
|
||||
alert("Por favor ingresa un número de multa");
|
||||
window.Notify.warning("Por favor ingresa o escanea una multa");
|
||||
return;
|
||||
}
|
||||
|
||||
// Simular datos encontrados (temporal)
|
||||
fineData.value = {
|
||||
fecha: "2025-11-11",
|
||||
placa: "ABC-123-DEF",
|
||||
vin: "1HGBH41JXMN109186",
|
||||
licencia: "LIC123456",
|
||||
tarjeta: "TC987654",
|
||||
rfc: "XAXX010101000",
|
||||
nombre: "Juan Pérez García",
|
||||
monto: "$1,500.00",
|
||||
};
|
||||
await api.get(apiURL(`fines/search`), {
|
||||
params: {
|
||||
id: fineNumber.value.trim(),
|
||||
},
|
||||
onSuccess: (data) => {
|
||||
const model = data.model;
|
||||
|
||||
emit("fine-searched", fineData.value);
|
||||
if (model.payments && model.payments.length > 0) {
|
||||
const payment = model.payments[0];
|
||||
|
||||
if (payment.status === "paid") {
|
||||
window.Notify.info("La multa ya ha sido pagada previamente");
|
||||
|
||||
fineData.value = {
|
||||
id: model.id,
|
||||
fecha: new Date(model.created_at).toLocaleDateString("es-MX"),
|
||||
placa: model.plate || "",
|
||||
vin: model.vin || "",
|
||||
licencia: model.license || "",
|
||||
tarjeta: model.circulation || "",
|
||||
rfc: model.rfc || "",
|
||||
nombre: model.name || "",
|
||||
monto: `$${data.total_to_pay.toFixed(2)}`,
|
||||
isPaid: true,
|
||||
};
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
fineData.value = {
|
||||
id: model.id,
|
||||
fecha: new Date(model.created_at).toLocaleDateString("es-MX"),
|
||||
placa: model.plate || "",
|
||||
vin: model.vin || "",
|
||||
licencia: model.license || "",
|
||||
tarjeta: model.circulation || "",
|
||||
rfc: model.rfc || "",
|
||||
nombre: model.name || "",
|
||||
monto: `$${data.total_to_pay.toFixed(2)}`,
|
||||
isPaid: false,
|
||||
};
|
||||
|
||||
emit("fine-searched", {
|
||||
...fineData.value,
|
||||
rawData: data,
|
||||
});
|
||||
},
|
||||
onFail: (error) => {
|
||||
window.Notify.error(error.message || "Error al buscar la multa");
|
||||
fineData.value = {
|
||||
fecha: "",
|
||||
placa: "",
|
||||
vin: "",
|
||||
licencia: "",
|
||||
tarjeta: "",
|
||||
rfc: "",
|
||||
nombre: "",
|
||||
monto: "",
|
||||
};
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Error al buscar multa:", error);
|
||||
window.Notify.error("Ocurrió un error al buscar la multa");
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handlePayment = () => {
|
||||
const handlePayment = async () => {
|
||||
if (!fineData.value.monto) {
|
||||
alert("No hay multa cargada para cobrar");
|
||||
window.Notify.warning("No hay multa cargada para cobrar");
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("Procesando pago de:", fineData.value.monto);
|
||||
emit("payment-processed", fineData.value);
|
||||
await api.post(apiURL(`fines/${fineData.value.id}/mark-as-paid`), {
|
||||
onSuccess: (data) => {
|
||||
window.Notify.success("Multa cobrada exitosamente");
|
||||
|
||||
emit("payment-processed", { ...fineData.value, paymentData: data });
|
||||
|
||||
fineData.value = {
|
||||
id: null,
|
||||
fecha: "",
|
||||
placa: "",
|
||||
vin: "",
|
||||
licencia: "",
|
||||
tarjeta: "",
|
||||
rfc: "",
|
||||
nombre: "",
|
||||
monto: "",
|
||||
};
|
||||
fineNumber.value = "";
|
||||
},
|
||||
onFail: (error) => {
|
||||
window.Notify.error(
|
||||
error.message || "Error al procesar el pago de la multa"
|
||||
);
|
||||
},
|
||||
onError: (error) => {
|
||||
window.Notify.error("Ocurrió un error al procesar el pago de la multa");
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const clearForm = () => {
|
||||
fineData.value = {
|
||||
id: null,
|
||||
fecha: "",
|
||||
placa: "",
|
||||
vin: "",
|
||||
licencia: "",
|
||||
tarjeta: "",
|
||||
rfc: "",
|
||||
nombre: "",
|
||||
monto: "",
|
||||
};
|
||||
fineNumber.value = "";
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
@ -62,10 +159,13 @@ const handlePayment = () => {
|
||||
Escanear Código QR
|
||||
</label>
|
||||
<div
|
||||
class="w-full h-1/2 bg-gray-800 rounded-lg flex flex-col items-center justify-center"
|
||||
class="w-full h-80 bg-gray-800 rounded-lg flex flex-col items-center justify-center"
|
||||
>
|
||||
<!-- QR -->
|
||||
<QRscan v-model:fineNumber="fineNumber" @fine-searched="handleSearch" />
|
||||
<QRscan
|
||||
v-model:fineNumber="fineNumber"
|
||||
@fine-searched="handleSearch"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -87,7 +187,7 @@ const handlePayment = () => {
|
||||
Buscar
|
||||
</button>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-6 shadow-lg">
|
||||
<div class="bg-white rounded-xl p-6 shadow-lg">
|
||||
<h3 class="text-xl font-semibold mb-4 text-gray-800">
|
||||
Detalles de la Multa
|
||||
</h3>
|
||||
@ -101,22 +201,12 @@ const handlePayment = () => {
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input
|
||||
v-model="fineData.placa"
|
||||
id="Placa"
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input v-model="fineData.placa" id="Placa" type="text" disabled />
|
||||
</div>
|
||||
|
||||
<!-- VIN y Licencia -->
|
||||
<div class="grid grid-cols-2 gap-4 mb-5">
|
||||
<Input
|
||||
v-model="fineData.vin"
|
||||
id="VIN"
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input v-model="fineData.vin" id="VIN" type="text" disabled />
|
||||
<Input
|
||||
v-model="fineData.licencia"
|
||||
id="Licencia"
|
||||
@ -133,22 +223,12 @@ const handlePayment = () => {
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input
|
||||
v-model="fineData.rfc"
|
||||
id="RFC"
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input v-model="fineData.rfc" id="RFC" type="text" disabled />
|
||||
</div>
|
||||
|
||||
<!-- Nombre -->
|
||||
<div class="mb-5">
|
||||
<Input
|
||||
v-model="fineData.nombre"
|
||||
id="Nombre"
|
||||
type="text"
|
||||
disabled
|
||||
/>
|
||||
<Input v-model="fineData.nombre" id="Nombre" type="text" disabled />
|
||||
</div>
|
||||
|
||||
<!-- Línea separadora -->
|
||||
@ -164,14 +244,33 @@ const handlePayment = () => {
|
||||
class="text-lg font-semibold"
|
||||
/>
|
||||
</div>
|
||||
<div class="space-y-6">
|
||||
<div v-if="fineData.isPaid">
|
||||
<button
|
||||
type="button"
|
||||
@click="clearForm"
|
||||
class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-3.5 rounded-lg transition-colors flex items-center justify-center gap-2"
|
||||
>
|
||||
Limpiar y buscar otra multa
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Botón Cobrar -->
|
||||
<button
|
||||
type="submit"
|
||||
class="w-full bg-green-700 hover:bg-green-600 text-white font-medium py-3.5 rounded-lg transition-colors"
|
||||
>
|
||||
Cobrar
|
||||
</button>
|
||||
<!-- Botón Cobrar -->
|
||||
<div>
|
||||
<button
|
||||
type="submit"
|
||||
:disabled="fineData.isPaid"
|
||||
:class="[
|
||||
'w-full font-medium py-3.5 rounded-lg transition-colors',
|
||||
fineData.isPaid
|
||||
? 'bg-gray-400 cursor-not-allowed'
|
||||
: 'bg-green-700 hover:bg-green-600 text-white',
|
||||
]"
|
||||
>
|
||||
Cobrar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user