a4:I[903690,["/chat-static/_next/static/immutable/chunks/3b50li4rc32m1.js","/chat-static/_next/static/immutable/chunks/0ur16xcze8_1h.js","/chat-static/_next/static/immutable/chunks/38-pttgm9fi6a.js","/chat-static/_next/static/immutable/chunks/1o0qivh9is0pn.js","/chat-static/_next/static/immutable/chunks/1oa3bat8-m8-8.js","/chat-static/_next/static/immutable/chunks/3hiq4825dpjxx.js","/chat-static/_next/static/immutable/chunks/2pdev18j4jp-g.js","/chat-static/_next/static/immutable/chunks/1isi9sgfxx5e1.js","/chat-static/_next/static/immutable/chunks/30wqhens5cioe.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/047caungpv2oe.js","/chat-static/_next/static/immutable/chunks/3kuhrc4zzsv6_.js","/chat-static/_next/static/immutable/chunks/35ur8vo8zoa35.js","/chat-static/_next/static/immutable/chunks/0f2nmau4qedmf.js","/chat-static/_next/static/immutable/chunks/1juzrssbfor2n.js","/chat-static/_next/static/immutable/chunks/3_zne-oxp3ex8.js","/chat-static/_next/static/immutable/chunks/2_wipy_-7xx7f.js","/chat-static/_next/static/immutable/chunks/3umwdcv2ex3_m.js","/chat-static/_next/static/immutable/chunks/3yr7c0o0wvf7h.js","/chat-static/_next/static/immutable/chunks/0r3s70ucno8tj.js","/chat-static/_next/static/immutable/chunks/19vnr8kphiz1y.js","/chat-static/_next/static/immutable/chunks/05u1rnm-uh271.js","/chat-static/_next/static/immutable/chunks/3q5sx9qs1vq3d.js","/chat-static/_next/static/immutable/chunks/0_cyux63atum2.js","/chat-static/_next/static/immutable/chunks/24htfcxml1z3z.js","/chat-static/_next/static/immutable/chunks/2dfjxmcoo1tp2.js","/chat-static/_next/static/immutable/chunks/2n7ikv8rvnb90.js","/chat-static/_next/static/immutable/chunks/33g364dont6bc.js","/chat-static/_next/static/immutable/chunks/1f4xdw6njddqb.js","/chat-static/_next/static/immutable/chunks/03lt6xbp-7tkr.js","/chat-static/_next/static/immutable/chunks/3y8kj6-zroniz.js","/chat-static/_next/static/immutable/chunks/0bprf4ybj2k71.js","/chat-static/_next/static/immutable/chunks/25y7xs6k20pc2.js","/chat-static/_next/static/immutable/chunks/1c-45kipwpj-v.js","/chat-static/_next/static/immutable/chunks/2kzkzaxya5zxf.js","/chat-static/_next/static/immutable/chunks/2s19e4wn20lnu.js","/chat-static/_next/static/immutable/chunks/2bhiks8fmy7ds.js","/chat-static/_next/static/immutable/chunks/14xmhcwc5tega.js","/chat-static/_next/static/immutable/chunks/42gvtmybgc4k2.js","/chat-static/_next/static/immutable/chunks/3s6ctjsnwy0hc.js","/chat-static/_next/static/immutable/chunks/31sxps6gu3qoi.js","/chat-static/_next/static/immutable/chunks/2dg0ujyo8x5vt.js","/chat-static/_next/static/immutable/chunks/0wa14r29vk-50.js","/chat-static/_next/static/immutable/chunks/24htm0r9ea3e6.js","/chat-static/_next/static/immutable/chunks/0u7ozsij7xh1l.js","/chat-static/_next/static/immutable/chunks/3j04uurjfus2k.js","/chat-static/_next/static/immutable/chunks/1-qp-er0quxcp.js","/chat-static/_next/static/immutable/chunks/014twhwh41dxg.js","/chat-static/_next/static/immutable/chunks/0ilzxtsq9fh87.js"],"ExplicitChatIdProvider"] a5:I[838238,["/chat-static/_next/static/immutable/chunks/3b50li4rc32m1.js","/chat-static/_next/static/immutable/chunks/0ur16xcze8_1h.js","/chat-static/_next/static/immutable/chunks/38-pttgm9fi6a.js","/chat-static/_next/static/immutable/chunks/1o0qivh9is0pn.js","/chat-static/_next/static/immutable/chunks/1oa3bat8-m8-8.js","/chat-static/_next/static/immutable/chunks/3hiq4825dpjxx.js","/chat-static/_next/static/immutable/chunks/2pdev18j4jp-g.js","/chat-static/_next/static/immutable/chunks/1isi9sgfxx5e1.js","/chat-static/_next/static/immutable/chunks/30wqhens5cioe.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/047caungpv2oe.js","/chat-static/_next/static/immutable/chunks/3kuhrc4zzsv6_.js","/chat-static/_next/static/immutable/chunks/35ur8vo8zoa35.js","/chat-static/_next/static/immutable/chunks/0f2nmau4qedmf.js","/chat-static/_next/static/immutable/chunks/1juzrssbfor2n.js","/chat-static/_next/static/immutable/chunks/3_zne-oxp3ex8.js","/chat-static/_next/static/immutable/chunks/2_wipy_-7xx7f.js","/chat-static/_next/static/immutable/chunks/3umwdcv2ex3_m.js","/chat-static/_next/static/immutable/chunks/3yr7c0o0wvf7h.js","/chat-static/_next/static/immutable/chunks/0r3s70ucno8tj.js","/chat-static/_next/static/immutable/chunks/19vnr8kphiz1y.js","/chat-static/_next/static/immutable/chunks/05u1rnm-uh271.js","/chat-static/_next/static/immutable/chunks/3q5sx9qs1vq3d.js","/chat-static/_next/static/immutable/chunks/0_cyux63atum2.js","/chat-static/_next/static/immutable/chunks/24htfcxml1z3z.js","/chat-static/_next/static/immutable/chunks/2dfjxmcoo1tp2.js","/chat-static/_next/static/immutable/chunks/2n7ikv8rvnb90.js","/chat-static/_next/static/immutable/chunks/33g364dont6bc.js","/chat-static/_next/static/immutable/chunks/1f4xdw6njddqb.js","/chat-static/_next/static/immutable/chunks/03lt6xbp-7tkr.js","/chat-static/_next/static/immutable/chunks/3y8kj6-zroniz.js","/chat-static/_next/static/immutable/chunks/0bprf4ybj2k71.js","/chat-static/_next/static/immutable/chunks/25y7xs6k20pc2.js","/chat-static/_next/static/immutable/chunks/1c-45kipwpj-v.js","/chat-static/_next/static/immutable/chunks/2kzkzaxya5zxf.js","/chat-static/_next/static/immutable/chunks/2s19e4wn20lnu.js","/chat-static/_next/static/immutable/chunks/2bhiks8fmy7ds.js","/chat-static/_next/static/immutable/chunks/14xmhcwc5tega.js","/chat-static/_next/static/immutable/chunks/42gvtmybgc4k2.js","/chat-static/_next/static/immutable/chunks/3s6ctjsnwy0hc.js","/chat-static/_next/static/immutable/chunks/31sxps6gu3qoi.js","/chat-static/_next/static/immutable/chunks/2dg0ujyo8x5vt.js","/chat-static/_next/static/immutable/chunks/0wa14r29vk-50.js","/chat-static/_next/static/immutable/chunks/24htm0r9ea3e6.js","/chat-static/_next/static/immutable/chunks/0u7ozsij7xh1l.js","/chat-static/_next/static/immutable/chunks/3j04uurjfus2k.js","/chat-static/_next/static/immutable/chunks/1-qp-er0quxcp.js","/chat-static/_next/static/immutable/chunks/014twhwh41dxg.js","/chat-static/_next/static/immutable/chunks/0ilzxtsq9fh87.js"],"SWRDataProvider"] a7:T9c5e4,System ERP – Gestión Empresarial

Gestión de Compras

Solicitudes Pendientes

+12.5%vs. mes anterior

Órdenes Activas

+8.3%vs. mes anterior

Gastos del Mes

Q142,580

-4.2%vs. mes anterior

Proveedores Activos

+2.4%vs. mes anterior

Solicitudes de Compra

No. Solicitud	Fecha	Solicitante	Departamento	Monto	Estado
SOL-2024-001	24 Oct 2023	Carlos Mendoza	Tecnología	Q12,450.00	Aprobada
SOL-2024-002	23 Oct 2023	Sofía Rodríguez	Operaciones	Q3,200.00	Pendiente
SOL-2024-003	22 Oct 2023	Alejandro Ruiz	Finanzas	Q45,000.00	En Revisión
SOL-2024-004	21 Oct 2023	Valeria Gómez	Marketing	Q1,850.00	Aprobada
SOL-2024-005	20 Oct 2023	Mariano Estévez	Recursos Humanos	Q820.00	Rechazada
SOL-2024-006	19 Oct 2023	Lucía Fernández	Legal	Q5,100.00	Pendiente

Mostrando 1-6 de 24 registros

a8:[] a9:[["b_NjdANJfZSVj",null],["b_wKslyFz6xe8",null],["b_ApsZo0N67sY",null],["b_xev77ul8CCE",null],["b_4YMd6UfjbY7",null],["b_MWnGNDJ6XlM",null],["b_Y3gQKVzBG8s",null],["b_lqXkrmW6zoI",null],["b_pkgbIz9HOqY",null],["b_qDzmJCRNchH",null],["b_bX67GV4Xngv",null],["b_6sbCit9WCGO",null],["b_HMHr4PcRkik",null],["b_kfibwnU3HZo",null],["b_8n49F5s4Zk8",null],["b_7bhh1l3n6Pp",null],["b_JKDXUGwazNt",null],["b_Osa8JHPeb3u",null],["b_OMSMach5UvK",null]] aa:[["b_NjdANJfZSVj",{"templateVersionId":null,"templateCanonId":null}],["b_wKslyFz6xe8",{"templateVersionId":null,"templateCanonId":null}],["b_ApsZo0N67sY",{"templateVersionId":null,"templateCanonId":null}],["b_xev77ul8CCE",{"templateVersionId":null,"templateCanonId":null}],["b_4YMd6UfjbY7",{"templateVersionId":null,"templateCanonId":null}],["b_MWnGNDJ6XlM",{"templateVersionId":null,"templateCanonId":null}],["b_Y3gQKVzBG8s",{"templateVersionId":null,"templateCanonId":null}],["b_lqXkrmW6zoI",{"templateVersionId":null,"templateCanonId":null}],["b_pkgbIz9HOqY",{"templateVersionId":null,"templateCanonId":null}],["b_qDzmJCRNchH",{"templateVersionId":null,"templateCanonId":null}],["b_bX67GV4Xngv",{"templateVersionId":null,"templateCanonId":null}],["b_6sbCit9WCGO",{"templateVersionId":null,"templateCanonId":null}],["b_HMHr4PcRkik",{"templateVersionId":null,"templateCanonId":null}],["b_kfibwnU3HZo",{"templateVersionId":null,"templateCanonId":null}],["b_8n49F5s4Zk8",{"templateVersionId":null,"templateCanonId":null}],["b_7bhh1l3n6Pp",{"templateVersionId":null,"templateCanonId":null}],["b_JKDXUGwazNt",{"templateVersionId":null,"templateCanonId":null}],["b_Osa8JHPeb3u",{"templateVersionId":null,"templateCanonId":null}],["b_OMSMach5UvK",{"templateVersionId":null,"templateCanonId":null}]] ab:[["Ez50lMvovfP","$D2026-08-05T01:45:19.042Z"],["b_gmqcQtdsgBj","$D2026-08-05T01:54:30.432Z"],["b_gYouFxUHI84","$D2026-08-05T01:54:44.772Z"],["b_sxFEAl3LjRl","$D2026-08-05T01:55:02.281Z"],["b_qlbGT1oWmNb","$D2026-08-05T01:55:17.206Z"],["b_frhrK0AIybJ","$D2026-08-05T01:55:28.785Z"],["b_VmKC4K5FBNY","$D2026-08-05T01:55:42.218Z"],["b_333ocEoebCO","$D2026-08-05T01:55:55.174Z"],["b_YKPS6BZLaOO","$D2026-08-05T01:56:08.169Z"],["b_QixCToM74yL","$D2026-08-05T01:56:50.651Z"],["b_eKM0JI50Dx5","$D2026-08-05T01:57:04.482Z"],["b_jRim33QwKcO","$D2026-08-05T01:57:17.566Z"],["b_5UAfbbkVVVF","$D2026-08-05T01:57:32.065Z"],["b_0INNTI3J6aK","$D2026-08-05T01:57:46.110Z"],["b_iroh0wMmq0X","$D2026-08-05T02:05:20.391Z"],["b_JsUbiEncXEs","$D2026-08-05T02:05:33.043Z"],["b_K28qCopZE5q","$D2026-08-05T02:05:45.932Z"],["b_sESjvDG97tV","$D2026-08-05T02:06:00.586Z"],["b_wAuOnXsRa04","$D2026-08-05T02:06:14.325Z"],["b_MyVWGcpkP1R","$D2026-08-05T02:06:28.773Z"],["b_kk1B0oiaTUe","$D2026-08-05T02:06:42.641Z"],["b_t76K0rWAt3V","$D2026-08-05T02:06:55.365Z"],["b_DEgabhdlIl8","$D2026-08-05T02:07:11.153Z"],["b_jxvRgcsRFDj","$D2026-08-05T02:07:24.788Z"],["b_uQzmrZcALFg","$D2026-08-05T02:07:38.427Z"],["b_vIYtj6poZDl","$D2026-08-05T02:07:53.057Z"],["b_IfzaiYwEkQl","$D2026-08-05T02:08:06.489Z"],["b_Sfr4RUyiDuy","$D2026-08-05T02:08:20.784Z"],["b_4pDSXgExnJD","$D2026-08-05T02:08:36.280Z"],["b_lCzKJLDBSRW","$D2026-08-05T02:13:21.857Z"],["b_EWSNCJCgaoP","$D2026-08-05T02:17:30.113Z"],["b_EWvLrh7KogC","$D2026-08-05T02:17:43.554Z"],["b_KhSiUm8zhs5","$D2026-08-05T02:17:57.004Z"],["b_lDSxB20Co8E","$D2026-08-05T02:18:09.906Z"],["b_0CHMTpnWvDf","$D2026-08-05T02:18:49.681Z"],["b_xG6htu4lHr0","$D2026-08-05T02:19:05.488Z"],["b_DLOxqlVqBfE","$D2026-08-05T02:19:19.697Z"],["b_DsfHUT7cRDD","$D2026-08-05T02:19:32.529Z"],["b_PYaljTFFJE3","$D2026-08-05T02:19:45.624Z"],["b_2gJVQjZnZn0","$D2026-08-05T02:19:58.870Z"],["b_xQ7mRQZNPki","$D2026-08-05T02:20:12.166Z"],["b_ymsU136QJ5d","$D2026-08-05T02:20:26.659Z"],["b_rSW0aPGbGB2","$D2026-08-05T02:20:40.651Z"],["b_ClD3d81F2SZ","$D2026-08-05T02:20:54.154Z"],["b_3pTjcXs2FEw","$D2026-08-05T02:21:08.668Z"],["b_oJtUJ8Wfs2z","$D2026-08-05T02:21:23.093Z"],["b_nUzjc3mMFDg","$D2026-08-05T02:21:39.131Z"],["b_iAZVAo390h2","$D2026-08-05T02:21:52.397Z"],["b_UY57ZcBcAWT","$D2026-08-05T02:22:05.558Z"],["b_A5dAAMWFxj8","$D2026-08-05T02:28:42.005Z"],["b_RnaHHptEx3O","$D2026-08-05T02:28:56.029Z"],["b_97CdKJsJeZD","$D2026-08-05T02:29:24.699Z"],["b_tSnluJiIsuo","$D2026-08-05T02:31:35.616Z"],["b_ETvc575bIBJ","$D2026-08-05T02:35:24.760Z"],["b_iADJzGN6zTt","$D2026-08-05T02:35:38.622Z"],["b_ffWNtykHGfj","$D2026-08-05T02:35:51.316Z"],["b_HxyPq5CyMEV","$D2026-08-05T02:36:05.858Z"],["b_9tTfYQ0X69x","$D2026-08-05T02:36:19.242Z"],["b_yuWnQQofby7","$D2026-08-05T02:36:33.026Z"],["b_Li1itMt9144","$D2026-08-05T02:36:48.559Z"],["b_QIA1ljmWLKD","$D2026-08-05T02:37:04.912Z"],["b_RX4PEJdJtox","$D2026-08-05T02:37:20.189Z"],["b_GNWXQoAMlhY","$D2026-08-05T02:37:32.941Z"],["b_qtT40oEfQ2z","$D2026-08-05T02:37:53.276Z"],["b_Q2Hj2VEz865","$D2026-08-05T02:38:07.785Z"],["b_NjdANJfZSVj","$D2026-08-05T02:45:59.272Z"],["b_wKslyFz6xe8","$D2026-08-05T02:46:12.730Z"],["b_ApsZo0N67sY","$D2026-08-05T02:46:26.166Z"],["b_xev77ul8CCE","$D2026-08-05T02:46:41.863Z"],["b_4YMd6UfjbY7","$D2026-08-05T02:46:58.897Z"],["b_MWnGNDJ6XlM","$D2026-08-05T02:47:12.372Z"],["b_Y3gQKVzBG8s","$D2026-08-05T02:47:25.812Z"],["b_lqXkrmW6zoI","$D2026-08-05T02:47:39.495Z"],["b_pkgbIz9HOqY","$D2026-08-05T02:47:59.488Z"],["b_qDzmJCRNchH","$D2026-08-05T02:48:13.374Z"],["b_bX67GV4Xngv","$D2026-08-05T02:48:26.293Z"],["b_6sbCit9WCGO","$D2026-08-05T02:50:21.344Z"],["b_HMHr4PcRkik","$D2026-08-05T03:03:34.003Z"],["b_kfibwnU3HZo","$D2026-08-05T03:03:45.774Z"],["b_8n49F5s4Zk8","$D2026-08-05T03:03:59.541Z"],["b_7bhh1l3n6Pp","$D2026-08-05T03:04:13.079Z"],["b_JKDXUGwazNt","$D2026-08-05T03:04:27.614Z"],["b_Osa8JHPeb3u","$D2026-08-05T03:04:43.953Z"],["b_OMSMach5UvK","$D2026-08-05T03:05:01.572Z"]] ac:[["b_NjdANJfZSVj",false],["b_wKslyFz6xe8",false],["b_ApsZo0N67sY",false],["b_xev77ul8CCE",false],["b_4YMd6UfjbY7",false],["b_MWnGNDJ6XlM",false],["b_Y3gQKVzBG8s",false],["b_lqXkrmW6zoI",false],["b_pkgbIz9HOqY",false],["b_qDzmJCRNchH",false],["b_bX67GV4Xngv",false],["b_6sbCit9WCGO",false],["b_HMHr4PcRkik",false],["b_kfibwnU3HZo",false],["b_8n49F5s4Zk8",false],["b_7bhh1l3n6Pp",false],["b_JKDXUGwazNt",false],["b_Osa8JHPeb3u",false],["b_OMSMach5UvK",false]] ad:[["b_NjdANJfZSVj",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_wKslyFz6xe8",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_ApsZo0N67sY",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_xev77ul8CCE",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_4YMd6UfjbY7",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_MWnGNDJ6XlM",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_Y3gQKVzBG8s",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_lqXkrmW6zoI",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_pkgbIz9HOqY",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_qDzmJCRNchH",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_bX67GV4Xngv",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_6sbCit9WCGO",{"git":{"ref":"main","sha":"c0c227387ece023a0fad36773d659dd171456a80","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add transfer execution and rejection features to payment view"}}],["b_HMHr4PcRkik",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_kfibwnU3HZo",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_8n49F5s4Zk8",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_7bhh1l3n6Pp",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_JKDXUGwazNt",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_Osa8JHPeb3u",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}],["b_OMSMach5UvK",{"git":{"ref":"main","sha":"36111b3d739a7e025854a36cd1232d88e41b1e52","type":"github","repoId":0,"repoName":"v0-1-team_gCiWboiTbY7HthoKK3ZJbUQL-HXG5raIR0U2","ownerName":"v0-git-s3-storage","commitMessage":"feat: add cheque management functionality and UI components"}}]] ae:[["b_NjdANJfZSVj",null],["b_wKslyFz6xe8",null],["b_ApsZo0N67sY",null],["b_xev77ul8CCE",null],["b_4YMd6UfjbY7",null],["b_MWnGNDJ6XlM",null],["b_Y3gQKVzBG8s",null],["b_lqXkrmW6zoI",null],["b_pkgbIz9HOqY",null],["b_qDzmJCRNchH",null],["b_bX67GV4Xngv",null],["b_6sbCit9WCGO",null],["b_HMHr4PcRkik",null],["b_kfibwnU3HZo",null],["b_8n49F5s4Zk8",null],["b_7bhh1l3n6Pp",null],["b_JKDXUGwazNt",null],["b_Osa8JHPeb3u",null],["b_OMSMach5UvK",null]] af:[["b_NjdANJfZSVj",true],["b_wKslyFz6xe8",true],["b_ApsZo0N67sY",true],["b_xev77ul8CCE",true],["b_4YMd6UfjbY7",true],["b_MWnGNDJ6XlM",true],["b_Y3gQKVzBG8s",true],["b_lqXkrmW6zoI",true],["b_pkgbIz9HOqY",true],["b_qDzmJCRNchH",true],["b_bX67GV4Xngv",true],["b_6sbCit9WCGO",true],["b_HMHr4PcRkik",true],["b_kfibwnU3HZo",true],["b_8n49F5s4Zk8",true],["b_7bhh1l3n6Pp",true],["b_JKDXUGwazNt",true],["b_Osa8JHPeb3u",true],["b_OMSMach5UvK",true]] b0:[["b_NjdANJfZSVj",true],["b_wKslyFz6xe8",true],["b_ApsZo0N67sY",true],["b_xev77ul8CCE",true],["b_4YMd6UfjbY7",true],["b_MWnGNDJ6XlM",true],["b_Y3gQKVzBG8s",true],["b_lqXkrmW6zoI",true],["b_pkgbIz9HOqY",true],["b_qDzmJCRNchH",true],["b_bX67GV4Xngv",true],["b_6sbCit9WCGO",true],["b_HMHr4PcRkik",true],["b_kfibwnU3HZo",true],["b_8n49F5s4Zk8",true],["b_7bhh1l3n6Pp",true],["b_JKDXUGwazNt",true],["b_Osa8JHPeb3u",true],["b_OMSMach5UvK",true]] b1:[] b2:T5aa,# Plan: procesos de cheque - Extender únicamente `components/erp/bancos/VistaPagos.tsx`, manteniendo intactos los procesos de preparación y transferencia. - Añadir una acción `Emitir cheque` para pagos cuya forma sugerida sea `Cheque`, con un modal de emisión que muestre orden, proveedor, factura(s), monto, moneda, cuenta, chequera, próximo número, beneficiario y monto en letras. - Permitir editar fecha, lugar, concepto, firmantes y observaciones; incluir una vista previa imprimible/visual del cheque y acciones Generar e Imprimir. - Modelar cheques ficticios en estado local con numeración consumida; al generar, reservar el número y cambiar el pago a `Cheque emitido`, sin reutilizar números anulados o incidenciados. - Agregar acciones Marcar entregado, Incidencia, Anular y Reponer. Entrega validará receptor, tipo de identificación, evidencia y observaciones; DPI aceptará exactamente 13 dígitos y pasaporte tendrá validación separada. - Añadir formulario de incidencia con tipo, fecha, motivo, evidencia, reporte al banco, gestión y reposición; registrar la incidencia sin devolver el número original y, si corresponde, asignar un nuevo número para reposición. - Mostrar Toasts y actualizar tabla/contadores solo localmente; no crear procesos de transferencia, cheque bancario real ni modificar otras vistas. - Ejecutar typecheck, build y verificar en navegador los flujos generar, entregar e incidencia/reposición.b3:Tb853,[V0_FILE]typescriptreact:file="/components/erp/bancos/VistaPagos.tsx" 'use client' import { useMemo, useState, type Dispatch, type ReactNode, type SetStateAction } from 'react' import { CheckCircle2, Clock3, Eye, FileCheck2, Filter, Search, ShieldCheck, WalletCards, PlayCircle, XCircle, Pencil, CalendarClock, ArrowRightLeft, Printer, PackageCheck, AlertTriangle, Ban, RefreshCw } from 'lucide-react' import { CUENTAS, PAGOS_AUTORIZADOS, formatoMoneda, type CuentaBancaria, type PagoAutorizado, type MovimientoBancario } from './data' import { Boton, EncabezadoVista, EstadoBadge, MonedaBadge, Panel } from './shared' import { DatoLectura, PanelLectura, Modal, Sheet } from './formularios' type Toast = (titulo: string, detalle?: string, tono?: 'exito' | 'aviso' | 'error') => void type PagoVisible = PagoAutorizado & { banco: string; saldo: number } type ChequeLocal = { numero: number; pagoId: string; estado: 'Generado' | 'Entregado' | 'Incidencia' | 'Anulado' | 'Repuesto'; fecha: string; lugar: string; concepto: string; firmantes: string; observaciones: string; receptor?: string } type FormularioCheque = { fecha: string; lugar: string; concepto: string; firmantes: string; observaciones: string } type FormularioEntrega = { fecha: string; receptor: string; tipoIdentificacion: 'DPI' | 'Pasaporte'; identificacion: string; evidencia: string; observaciones: string } type FormularioIncidencia = { tipo: string; fecha: string; motivo: string; evidencia: string; reporteBanco: boolean; gestion: string; reposicion: boolean } const numeroEnLetras = (valor: number, moneda: string) => `${valor.toLocaleString('es-GT', { maximumFractionDigits: 2 })} ${moneda === 'GTQ' ? 'quetzales' : 'dólares'} exactos` const NOTA_CXP = 'Información recibida de Cuentas por Pagar' const PAGOS: PagoVisible[] = PAGOS_AUTORIZADOS.map((pago) => ({ ...pago, banco: pago.cuentaBeneficiaria.startsWith('Banco Industrial') ? 'Banco Industrial' : pago.cuentaBeneficiaria.startsWith('BAM') ? 'BAM' : pago.cuentaBeneficiaria.startsWith('Banrural') ? 'Banrural' : 'Pendiente', saldo: pago.montoNeto, })) const ESTADOS = ['Autorizado', 'Preparado', 'Fondos liberados', 'Pagado', 'Ejecutado', 'Anulado'] const BANCOS = ['BAM', 'Banco Industrial', 'Banrural'] export default function VistaPagos({ onToast }: { onToast: Toast }) { const [pagos] = useState(PAGOS) const [busqueda, setBusqueda] = useState('') const [estado, setEstado] = useState('') const [moneda, setMoneda] = useState('') const [forma, setForma] = useState('') const [vencimiento, setVencimiento] = useState('') const [banco, setBanco] = useState('') const [detalle, setDetalle] = useState(null) const [preparando, setPreparando] = useState(null) const [pasoPreparacion, setPasoPreparacion] = useState(1) const [estadoLocal, setEstadoLocal] = useState>({}) const [cheques, setCheques] = useState([]) const [chequeAbierto, setChequeAbierto] = useState(null) const [modoCheque, setModoCheque] = useState<'emitir' | 'entregar' | 'incidencia'>('emitir') const [formularioCheque, setFormularioCheque] = useState({ fecha: '2025-11-07', lugar: 'Ciudad de Guatemala', concepto: '', firmantes: 'Firmante 1 · Firmante 2', observaciones: '' }) const [formularioEntrega, setFormularioEntrega] = useState({ fecha: '2025-11-07', receptor: '', tipoIdentificacion: 'DPI', identificacion: '', evidencia: '', observaciones: '' }) const [formularioIncidencia, setFormularioIncidencia] = useState({ tipo: 'Pérdida', fecha: '2025-11-07', motivo: '', evidencia: '', reporteBanco: false, gestion: '', reposicion: false }) const [formulario, setFormulario] = useState({ monto: '', distribucion: 'Pago único', prioridad: 'Alta', observaciones: '', cuentaId: '', fecha: '' }) const [transferencia, setTransferencia] = useState(null) const [rechazoAbierto, setRechazoAbierto] = useState(false) const [movimientos, setMovimientos] = useState([]) const [formularioTransferencia, setFormularioTransferencia] = useState({ fecha: '2025-11-07', referencia: '', concepto: '', comprobante: '', observaciones: '', confirmacion: false }) const [formularioRechazo, setFormularioRechazo] = useState({ fecha: '2025-11-07', codigo: '', motivo: '', evidencia: '', observaciones: '', generarNueva: false }) const resumen = useMemo(() => ({ preparar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Autorizado').length, autorizar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Preparado').length, ejecutar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Fondos liberados').length, pagados: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Pagado' || (estadoLocal[p.id] ?? p.estado) === 'Ejecutado').length, }), [estadoLocal, pagos]) const filtrados = useMemo(() => { const termino = busqueda.trim().toLowerCase() return pagos.filter((pago) => { const estadoPago = estadoLocal[pago.id] ?? pago.estado const coincideTexto = !termino || [pago.ordenPago, pago.proveedor, pago.nit, pago.factura, pago.ordenCompra].join(' ').toLowerCase().includes(termino) const coincideVencimiento = !vencimiento || (vencimiento === 'Próximos 7 días' ? ['05 Nov 2025', '06 Nov 2025', '07 Nov 2025', '09 Nov 2025'].includes(pago.vencimiento) : pago.vencimiento.includes('Nov 2025')) return coincideTexto && (!estado || estadoPago === estado) && (!moneda || pago.moneda === moneda) && (!forma || pago.metodoSugerido === forma) && coincideVencimiento && (!banco || pago.banco === banco) }) }, [banco, estado, estadoLocal, forma, moneda, pagos, vencimiento, busqueda]) const abrirPreparacion = (pago: PagoVisible) => { setPreparando(pago) setPasoPreparacion(1) setFormulario({ monto: String(pago.montoNeto), distribucion: 'Pago único', prioridad: pago.prioridad, observaciones: '', cuentaId: pago.banco === 'Pendiente' ? '' : (CUENTAS.find((cuenta) => cuenta.banco === pago.banco && cuenta.moneda === pago.moneda)?.id ?? ''), fecha: '' }) } const cerrarPreparacion = () => { setPreparando(null) setPasoPreparacion(1) } const cuentaOrigen = CUENTAS.find((cuenta) => cuenta.id === formulario.cuentaId) const montoPreparado = Number(formulario.monto) || 0 const comprometidoProyectado = cuentaOrigen ? cuentaOrigen.comprometido + montoPreparado : 0 const disponibleProyectado = cuentaOrigen ? cuentaOrigen.saldoDisponible - montoPreparado : 0 const fondosInsuficientes = Boolean(cuentaOrigen && montoPreparado > cuentaOrigen.saldoDisponible) const verificacionCuenta = cuentaOrigen?.banco === 'BAM' && cuentaOrigen.estado === 'Activa' ? 'Verificada' : 'No verificada' const formaSugerida = verificacionCuenta === 'Verificada' ? 'Transferencia BAM' : 'Cheque' const cambiarEstado = (pago: PagoVisible, nuevoEstado: PagoAutorizado['estado'], mensaje: string) => { setEstadoLocal((actual) => ({ ...actual, [pago.id]: nuevoEstado })) onToast(mensaje, `${pago.ordenPago} · actualización simulada`) } const guardarPreparacion = (enviar: boolean) => { if (!preparando || fondosInsuficientes) return setEstadoLocal((actual) => ({ ...actual, [preparando.id]: enviar ? 'Preparado' : 'Autorizado' })) onToast(enviar ? 'Pago enviado' : 'Borrador guardado', `${preparando.ordenPago} · ${formaSugerida}`) cerrarPreparacion() } const abrirTransferencia = (pago: PagoVisible) => { setTransferencia(pago) setRechazoAbierto(false) setFormularioTransferencia({ fecha: '2025-11-07', referencia: `TRF-${pago.ordenPago.replace('OP-', '')}`, concepto: `Pago ${pago.factura}`, comprobante: '', observaciones: '', confirmacion: false }) setFormularioRechazo({ fecha: '2025-11-07', codigo: '', motivo: '', evidencia: '', observaciones: '', generarNueva: false }) } const ejecutarTransferencia = () => { if (!transferencia || !formularioTransferencia.fecha || !formularioTransferencia.referencia || !formularioTransferencia.concepto || !formularioTransferencia.confirmacion) return const cuentaOrigen = CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda && cuenta.estado === 'Activa') const movimiento: MovimientoBancario = { id: `MOV-TRF-${movimientos.length + 5001}`, fecha: formularioTransferencia.fecha, cuentaId: cuentaOrigen?.id ?? 'CTA-001', tipo: 'Transferencia enviada', descripcion: formularioTransferencia.concepto, referencia: formularioTransferencia.referencia, moduloOrigen: 'Cuentas por Pagar', documentoOrigen: transferencia.ordenPago, debito: transferencia.montoNeto, credito: 0, saldo: (cuentaOrigen?.saldoDisponible ?? 0) - transferencia.montoNeto, estado: 'Aplicado', conciliacion: 'Pendiente' } setMovimientos((actuales) => [movimiento, ...actuales]) setEstadoLocal((actual) => ({ ...actual, [transferencia.id]: 'Pagado' })) onToast('Transferencia ejecutada', `${transferencia.ordenPago} · movimiento débito creado · conciliación pendiente`) setTransferencia(null) } const registrarRechazo = () => { if (!transferencia || !formularioRechazo.fecha || !formularioRechazo.codigo || !formularioRechazo.motivo) return setEstadoLocal((actual) => ({ ...actual, [transferencia.id]: 'Anulado' })) onToast('Transferencia rechazada', formularioRechazo.generarNueva ? `${transferencia.ordenPago} · nueva transferencia pendiente de preparación` : `${transferencia.ordenPago} · rechazo registrado`) setTransferencia(null) } const siguienteNumeroCheque = () => { const usados = cheques.map((cheque) => cheque.numero) return Math.max(4521, ...usados) + 1 } const abrirCheque = (pago: PagoVisible, modo: 'emitir' | 'entregar' | 'incidencia' = 'emitir') => { setChequeAbierto(pago) setModoCheque(modo) const cheque = cheques.find((item) => item.pagoId === pago.id) setFormularioCheque({ fecha: cheque?.fecha ?? '2025-11-07', lugar: cheque?.lugar ?? 'Ciudad de Guatemala', concepto: cheque?.concepto ?? `Pago ${pago.factura}`, firmantes: cheque?.firmantes ?? 'Firmante 1 · Firmante 2', observaciones: cheque?.observaciones ?? '' }) } const generarCheque = () => { if (!chequeAbierto || cheques.some((item) => item.pagoId === chequeAbierto.id)) return const nuevo: ChequeLocal = { numero: siguienteNumeroCheque(), pagoId: chequeAbierto.id, estado: 'Generado', ...formularioCheque } setCheques((actuales) => [...actuales, nuevo]) setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque emitido' })) onToast('Cheque generado', `${chequeAbierto.ordenPago} · CHQ-${String(nuevo.numero).padStart(6, '0')}`) setModoCheque('emitir') } const marcarEntregado = () => { if (!chequeAbierto) return const valido = formularioEntrega.receptor && formularioEntrega.evidencia && (formularioEntrega.tipoIdentificacion === 'DPI' ? /^\\d{13}$/.test(formularioEntrega.identificacion) : formularioEntrega.identificacion.trim().length >= 5) if (!valido) { onToast('Datos de entrega incompletos', 'El DPI debe contener exactamente 13 números', 'error'); return } setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: 'Entregado', receptor: formularioEntrega.receptor } : item)) setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque entregado' })) onToast('Cheque marcado como entregado', `${chequeAbierto.ordenPago} · ${formularioEntrega.receptor}`) setChequeAbierto(null) } const registrarIncidenciaCheque = () => { if (!chequeAbierto || !formularioIncidencia.fecha || !formularioIncidencia.motivo || !formularioIncidencia.gestion) return const actual = cheques.find((item) => item.pagoId === chequeAbierto.id) setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: formularioIncidencia.reposicion ? 'Repuesto' : 'Incidencia' } : item)) setEstadoLocal((estados) => ({ ...estados, [chequeAbierto.id]: formularioIncidencia.reposicion ? 'Cheque repuesto' : 'Incidencia de cheque' })) const nuevoNumero = formularioIncidencia.reposicion ? siguienteNumeroCheque() : null if (nuevoNumero && actual) setCheques((actuales) => [...actuales, { ...actual, numero: nuevoNumero, estado: 'Generado', observaciones: `Reposición del cheque ${actual.numero}` }]) onToast(formularioIncidencia.reposicion ? 'Cheque repuesto' : 'Incidencia registrada', formularioIncidencia.reposicion ? `Número original ${actual?.numero} consumido · nuevo CHQ-${nuevoNumero}` : `${chequeAbierto.ordenPago} · número original no disponible`) setChequeAbierto(null) } const anularCheque = () => { if (!chequeAbierto) return setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: 'Anulado' } : item)) setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque anulado' })) onToast('Cheque anulado', `${chequeAbierto.ordenPago} · el número queda consumido`) setChequeAbierto(null) } return (

{filtrados.length} de {pagos.length} obligaciones visibles onToast('Filtros aplicados', `${filtrados.length} obligaciones coinciden`)}>Aplicar filtros

{['Orden', 'Proveedor', 'NIT', 'Factura', 'Orden de compra', 'Vencimiento', 'Moneda', 'Monto', 'Saldo', 'Cuenta beneficiaria', 'Verificación', 'Forma sugerida', 'Estado', 'Acción'].map((columna) => )} {filtrados.map((pago) => )} {filtrados.length === 0 && }

{columna}
{pago.ordenPago}	{pago.proveedor}	{pago.nit}	{pago.factura}	{pago.ordenCompra}	{pago.vencimiento}		{formatoMoneda(pago.montoNeto, pago.moneda)}	{formatoMoneda(pago.saldo, pago.moneda)}	{pago.cuentaBeneficiaria}		{pago.metodoSugerido}		setDetalle(pago)} />{pago.metodoSugerido === 'Cheque' ? <>{!cheques.some((item) => item.pagoId === pago.id) && abrirCheque(pago)} />}{cheques.some((item) => item.pagoId === pago.id) && <> { setModoCheque('entregar'); setChequeAbierto(pago) }} /> { setModoCheque('incidencia'); setChequeAbierto(pago) }} /> abrirCheque(pago, 'emitir')} />} : <>{(estadoLocal[pago.id] ?? pago.estado) === 'Fondos liberados' && abrirTransferencia(pago)} />}{(estadoLocal[pago.id] ?? pago.estado) !== 'Fondos liberados' && (estadoLocal[pago.id] ?? pago.estado) !== 'Ejecutado' && abrirPreparacion(pago)} />}}
No hay obligaciones que coincidan con los filtros.

{preparando && ( setPasoPreparacion((paso) => paso - 1)}>{pasoPreparacion === 1 ? 'Cancelar' : 'Atrás'}

{pasoPreparacion === 3 ? <> guardarPreparacion(false)}>Guardar borrador guardarPreparacion(true)} disabled={fondosInsuficientes}>Enviar : setPasoPreparacion((paso) => paso + 1)} disabled={pasoPreparacion === 2 && (!cuentaOrigen || fondosInsuficientes || !formulario.fecha)}>Continuar}

}> {pasoPreparacion === 1 && } {pasoPreparacion === 2 && } {pasoPreparacion === 3 && } )} {transferencia && setTransferencia(null)} ancho="lg" titulo={rechazoAbierto ? `Registrar transferencia rechazada · ${transferencia.ordenPago}` : `Ejecutar transferencia · ${transferencia.ordenPago}`} descripcion={rechazoAbierto ? 'Registra el rechazo recibido del banco destino.' : 'Revisa la información y confirma la ejecución bancaria.'} pie={rechazoAbierto ?

setRechazoAbierto(false)}>AtrásGuardar rechazo

setRechazoAbierto(true)}>Transferencia rechazada

setTransferencia(null)}>CancelarEjecutar transferencia

}> {rechazoAbierto ?

setFormularioRechazo((actual) => ({ ...actual, fecha: e.target.value }))} /> setFormularioRechazo((actual) => ({ ...actual, codigo: e.target.value }))} placeholder="Ej. AC04" /> setFormularioRechazo((actual) => ({ ...actual, motivo: e.target.value }))} placeholder="Datos de beneficiario inválidos" /> setFormularioRechazo((actual) => ({ ...actual, evidencia: e.target.value }))} placeholder="Nombre o referencia del archivo" />Observaciones

setFormularioRechazo((actual) => ({ ...actual, observaciones: e.target.value }))} /></label><label className="flex items-center gap-2 rounded-lg border border-slate-200 p-3 text-sm text-slate-700 sm:col-span-2"><input type="checkbox" checked={formularioRechazo.generarNueva} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, generarNueva: e.target.checked }))} />Generar una nueva transferencia después de registrar el rechazo</label></div> : <div className="flex flex-col gap-5"><div className="grid grid-cols-2 gap-3 rounded-xl border border-slate-200 bg-slate-50 p-4 sm:grid-cols-3"><DatoLectura etiqueta="Orden" valor={transferencia.ordenPago} /><DatoLectura etiqueta="Proveedor" valor={transferencia.proveedor} /><DatoLectura etiqueta="Titular" valor={transferencia.proveedor} /><DatoLectura etiqueta="Cuenta beneficiaria" valor={transferencia.cuentaBeneficiaria} /><DatoLectura etiqueta="Banco destino" valor={transferencia.banco} /><DatoLectura etiqueta="Moneda" valor={transferencia.moneda} /><DatoLectura etiqueta="Monto" valor={formatoMoneda(transferencia.montoNeto, transferencia.moneda)} /><DatoLectura etiqueta="Facturas" valor={transferencia.factura} /><DatoLectura etiqueta="Cuenta BAM de origen" valor={`${CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda)?.alias ?? 'BAM Operativa'} · ${CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda)?.numeroEnmascarado ?? '****4821'}`} /></div><div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Fecha efectiva"><input className={inputPago} type="date" value={formularioTransferencia.fecha} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Referencia"><input className={inputPago} value={formularioTransferencia.referencia} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, referencia: e.target.value }))} /></CampoPago><CampoPago etiqueta="Concepto"><input className={inputPago} value={formularioTransferencia.concepto} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, concepto: e.target.value }))} /></CampoPago><CampoPago etiqueta="Comprobante"><input className={inputPago} value={formularioTransferencia.comprobante} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, comprobante: e.target.value }))} placeholder="Nombre o referencia del soporte" /></CampoPago><label className="flex flex-col gap-1.5 text-sm sm:col-span-2"><span className="font-medium text-slate-700">Observaciones</span><textarea className={`${inputPago} min-h-20`} value={formularioTransferencia.observaciones} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, observaciones: e.target.value }))} /></label><label className="flex items-start gap-2 rounded-lg border border-blue-100 bg-blue-50 p-3 text-sm text-blue-900 sm:col-span-2"><input className="mt-0.5" type="checkbox" checked={formularioTransferencia.confirmacion} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, confirmacion: e.target.checked }))} />Confirmo que los datos son correctos y autorizo registrar el débito ficticio de esta transferencia.</label></div></div>}
      </Modal>}

{chequeAbierto && (() => {
        const cheque = cheques.find((item) => item.pagoId === chequeAbierto.id)
        const cuentaCheque = CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === chequeAbierto.moneda && cuenta.estado === 'Activa')
        const numeroCheque = cheque?.numero ?? siguienteNumeroCheque()
        const tituloCheque = modoCheque === 'entregar' ? `Entregar cheque · CHQ-${String(numeroCheque).padStart(6, '0')}` : modoCheque === 'incidencia' ? `Incidencia de cheque · CHQ-${String(numeroCheque).padStart(6, '0')}` : `Emitir cheque · ${chequeAbierto.ordenPago}`
        return <Modal abierto onCerrar={() => setChequeAbierto(null)} ancho="xl" titulo={tituloCheque} descripcion={`${chequeAbierto.proveedor} · número original no se reutiliza`} pie={modoCheque === 'entregar' ? <div className="flex w-full justify-end gap-2"><Boton onClick={() => setModoCheque('emitir')}>Atrás</Boton><Boton variante="primario" onClick={marcarEntregado}>Marcar entregado</Boton></div> : modoCheque === 'incidencia' ? <div className="flex w-full justify-end gap-2"><Boton onClick={() => setModoCheque('emitir')}>Atrás</Boton><Boton variante="peligro" onClick={registrarIncidenciaCheque} disabled={!formularioIncidencia.motivo || !formularioIncidencia.gestion}>Registrar incidencia</Boton></div> : <div className="flex w-full flex-wrap justify-end gap-2"><Boton icono={Printer} onClick={() => onToast('Vista de impresión abierta', `CHQ-${String(numeroCheque).padStart(6, '0')} · vista previa`)}>Imprimir</Boton><Boton icono={PackageCheck} onClick={() => setModoCheque('entregar')}>Marcar entregado</Boton><Boton icono={AlertTriangle} onClick={() => setModoCheque('incidencia')}>Incidencia</Boton><Boton icono={Ban} variante="peligro" onClick={anularCheque}>Anular</Boton>{cheque ? <Boton icono={RefreshCw} onClick={() => { setModoCheque('incidencia'); setFormularioIncidencia((actual) => ({ ...actual, reposicion: true })) }}>Reponer</Boton> : <Boton variante="primario" onClick={generarCheque}>Generar</Boton>}</div>}>
          {modoCheque === 'entregar' ? <FormularioEntregaCheque formulario={formularioEntrega} setFormulario={setFormularioEntrega} /> : modoCheque === 'incidencia' ? <FormularioIncidenciaCheque formulario={formularioIncidencia} setFormulario={setFormularioIncidencia} /> : <div className="flex flex-col gap-5"><div className="grid grid-cols-2 gap-3 rounded-xl border border-slate-200 bg-slate-50 p-4 sm:grid-cols-4"><DatoLectura etiqueta="Orden" valor={chequeAbierto.ordenPago} /><DatoLectura etiqueta="Proveedor" valor={chequeAbierto.proveedor} /><DatoLectura etiqueta="Facturas" valor={chequeAbierto.factura} /><DatoLectura etiqueta="Monto" valor={formatoMoneda(chequeAbierto.montoNeto, chequeAbierto.moneda)} /><DatoLectura etiqueta="Moneda" valor={chequeAbierto.moneda} /><DatoLectura etiqueta="Cuenta" valor={cuentaCheque ? `${cuentaCheque.alias} · ${cuentaCheque.numeroEnmascarado}` : 'BAM Operativa'} /><DatoLectura etiqueta="Chequera" valor="BAM-CHQ-2025-01" /><DatoLectura etiqueta="Próximo número" valor={`CHQ-${String(numeroCheque).padStart(6, '0')}`} /><DatoLectura etiqueta="Beneficiario" valor={chequeAbierto.proveedor} /><DatoLectura etiqueta="Monto en letras" valor={numeroEnLetras(chequeAbierto.montoNeto, chequeAbierto.moneda)} /></div><div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Fecha"><input className={inputPago} type="date" value={formularioCheque.fecha} onChange={(e) => setFormularioCheque((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Lugar"><input className={inputPago} value={formularioCheque.lugar} onChange={(e) => setFormularioCheque((actual) => ({ ...actual, lugar: e.target.value }))} /></CampoPago><CampoPago etiqueta="Concepto"><input className={inputPago} value={formularioCheque.concepto} onChange={(e) => setFormularioCheque((actual) => ({ ...actual, concepto: e.target.value }))} /></CampoPago><CampoPago etiqueta="Firmantes"><input className={inputPago} value={formularioCheque.firmantes} onChange={(e) => setFormularioCheque((actual) => ({ ...actual, firmantes: e.target.value }))} /></CampoPago><CampoPago etiqueta="Observaciones"><textarea className={`${inputPago} min-h-20`} value={formularioCheque.observaciones} onChange={(e) => setFormularioCheque((actual) => ({ ...actual, observaciones: e.target.value }))} /></CampoPago></div><div className="rounded-xl border-2 border-dashed border-slate-300 bg-white p-5"><p className="text-xs font-semibold uppercase tracking-wide text-slate-400">Vista previa del cheque</p><div className="mt-4 flex flex-col gap-3 border border-slate-200 p-4"><div className="flex justify-between text-sm"><span>{formularioCheque.lugar} · {formularioCheque.fecha}</span><strong>CHQ-{String(numeroCheque).padStart(6, '0')}</strong></div><p className="text-base font-semibold">Páguese a: {chequeAbierto.proveedor}</p><p className="text-sm">La suma de {numeroEnLetras(chequeAbierto.montoNeto, chequeAbierto.moneda)}</p><p className="text-sm text-slate-500">Concepto: {formularioCheque.concepto}</p><p className="pt-4 text-right text-xs text-slate-500">{formularioCheque.firmantes}</p></div></div></div>}
        </Modal>
      })()}

{detalle && <Sheet abierto onCerrar={() => setDetalle(null)} titulo={`Detalle de pago · ${detalle.ordenPago}`} descripcion={`${detalle.proveedor} · ${NOTA_CXP}`} pie={<div className="flex flex-wrap justify-end gap-2"><Boton icono={XCircle} variante="peligro" onClick={() => { cambiarEstado(detalle, 'Anulado', 'Pago rechazado'); setDetalle(null) }}>Rechazar</Boton><Boton icono={Pencil} onClick={() => { setDetalle(null); abrirPreparacion(detalle) }}>Corregir</Boton><Boton icono={CalendarClock} onClick={() => { cambiarEstado(detalle, 'Autorizado', 'Pago reprogramado'); setDetalle(null) }}>Reprogramar</Boton><Boton icono={ShieldCheck} variante="primario" onClick={() => { cambiarEstado(detalle, 'Fondos liberados', 'Pago autorizado'); setDetalle(null) }}>Autorizar</Boton><Boton onClick={() => setDetalle(null)}>Cerrar</Boton></div>}>
        <div className="flex flex-col gap-4">
          <PanelLectura titulo="Factura y recepción" nota={NOTA_CXP}>
            <DatoLectura etiqueta="Factura" valor={detalle.factura} /><DatoLectura etiqueta="Proveedor" valor={detalle.proveedor} /><DatoLectura etiqueta="NIT" valor={detalle.nit} /><DatoLectura etiqueta="Orden de compra" valor={detalle.ordenCompra} /><DatoLectura etiqueta="Recepción" valor="Recepción REC-2025-1188 · validada" />
          </PanelLectura>
          <PanelLectura titulo="Montos y retenciones" nota={NOTA_CXP}>
            <DatoLectura etiqueta="Monto bruto" valor={formatoMoneda(detalle.montoNeto + detalle.retenciones + detalle.descuentos, detalle.moneda)} /><DatoLectura etiqueta="Retenciones" valor={formatoMoneda(detalle.retenciones, detalle.moneda)} /><DatoLectura etiqueta="Descuentos" valor={formatoMoneda(detalle.descuentos, detalle.moneda)} /><DatoLectura etiqueta="Saldo" valor={formatoMoneda(detalle.saldo, detalle.moneda)} />
          </PanelLectura>
          <PanelLectura titulo="Documentos y aprobaciones" nota={NOTA_CXP}>
            <DatoLectura etiqueta="Documentos" valor="Factura PDF · recepción · constancia fiscal" /><DatoLectura etiqueta="Aprobaciones" valor={`${detalle.aprobaciones} aprobaciones registradas`} /><DatoLectura etiqueta="Estado" valor={<EstadoBadge estado={detalle.estado} />} />
          </PanelLectura>
          <PanelLectura titulo="Cuenta e historial" nota={NOTA_CXP}>
            <DatoLectura etiqueta="Banco" valor={detalle.banco} /><DatoLectura etiqueta="Cuenta beneficiaria" valor={detalle.cuentaBeneficiaria} /><DatoLectura etiqueta="Historial" valor="Recibido de CxP · validación bancaria pendiente de ejecución" /><DatoLectura etiqueta="Forma sugerida" valor={detalle.metodoSugerido} />
          </PanelLectura>
        </div>
      </Sheet>}
    </div>
  )
}

type FormularioPreparacion = { monto: string; distribucion: string; prioridad: string; observaciones: string; cuentaId: string; fecha: string }

type CamposPasoProps = { pago: PagoVisible; formulario: FormularioPreparacion; setFormulario: Dispatch<SetStateAction<FormularioPreparacion>> }

function CampoPago({ etiqueta, children }: { etiqueta: string; children: ReactNode }) {
  return <label className="flex flex-col gap-1.5 text-sm"><span className="font-medium text-slate-700">{etiqueta}</span>{children}</label>
}

const inputPago = 'rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm text-slate-700 outline-none focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20'

function PasoDatosPago({ pago, formulario, setFormulario }: CamposPasoProps) {
  const bruto = pago.montoNeto + pago.retenciones + pago.descuentos
  return <div className="flex flex-col gap-5">
    <div className="grid grid-cols-2 gap-3 rounded-xl border border-slate-200 bg-slate-50 p-4 sm:grid-cols-4"><DatoLectura etiqueta="Orden" valor={pago.ordenPago} /><DatoLectura etiqueta="Proveedor" valor={pago.proveedor} /><DatoLectura etiqueta="Factura" valor={pago.factura} /><DatoLectura etiqueta="Compra" valor={pago.ordenCompra} /><DatoLectura etiqueta="Recepción" valor="REC-2025-1188 · validada" /><DatoLectura etiqueta="Moneda" valor={pago.moneda} /><DatoLectura etiqueta="Bruto" valor={formatoMoneda(bruto, pago.moneda)} /><DatoLectura etiqueta="Retenciones" valor={formatoMoneda(pago.retenciones, pago.moneda)} /><DatoLectura etiqueta="Descuentos" valor={formatoMoneda(pago.descuentos, pago.moneda)} /><DatoLectura etiqueta="Neto" valor={formatoMoneda(pago.montoNeto, pago.moneda)} /><DatoLectura etiqueta="Saldo" valor={formatoMoneda(pago.montoNeto, pago.moneda)} /></div>
    <div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Monto a pagar"><input className={inputPago} type="number" min="0" value={formulario.monto} onChange={(e) => setFormulario((actual) => ({ ...actual, monto: e.target.value }))} /></CampoPago><CampoPago etiqueta="Distribución"><select className={inputPago} value={formulario.distribucion} onChange={(e) => setFormulario((actual) => ({ ...actual, distribucion: e.target.value }))}><option>Pago único</option><option>Pago parcial</option><option>Varias cuentas</option></select></CampoPago><CampoPago etiqueta="Prioridad"><select className={inputPago} value={formulario.prioridad} onChange={(e) => setFormulario((actual) => ({ ...actual, prioridad: e.target.value }))}><option>Alta</option><option>Media</option><option>Baja</option></select></CampoPago><CampoPago etiqueta="Observaciones"><input className={inputPago} value={formulario.observaciones} onChange={(e) => setFormulario((actual) => ({ ...actual, observaciones: e.target.value }))} placeholder="Notas para autorización" /></CampoPago></div>
  </div>
}

function FormularioEntregaCheque({ formulario, setFormulario }: { formulario: FormularioEntrega; setFormulario: Dispatch<SetStateAction<FormularioEntrega>> }) {
  const invalido = formulario.tipoIdentificacion === 'DPI' && formulario.identificacion.length > 0 && !/^\\d{13}$/.test(formulario.identificacion)
  return <div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Fecha"><input className={inputPago} type="date" value={formulario.fecha} onChange={(e) => setFormulario((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Receptor"><input className={inputPago} value={formulario.receptor} onChange={(e) => setFormulario((actual) => ({ ...actual, receptor: e.target.value }))} /></CampoPago><CampoPago etiqueta="Tipo de identificación"><select className={inputPago} value={formulario.tipoIdentificacion} onChange={(e) => setFormulario((actual) => ({ ...actual, tipoIdentificacion: e.target.value as 'DPI' | 'Pasaporte', identificacion: '' }))}><option>DPI</option><option>Pasaporte</option></select></CampoPago><CampoPago etiqueta={formulario.tipoIdentificacion === 'DPI' ? 'DPI (13 números exactos)' : 'Pasaporte'}><input className={inputPago} inputMode="numeric" value={formulario.identificacion} maxLength={formulario.tipoIdentificacion === 'DPI' ? 13 : undefined} onChange={(e) => setFormulario((actual) => ({ ...actual, identificacion: formulario.tipoIdentificacion === 'DPI' ? e.target.value.replace(/\\D/g, '').slice(0, 13) : e.target.value }))} />{invalido && <span className="text-xs text-red-600">El DPI debe contener exactamente 13 números.</span>}</CampoPago><CampoPago etiqueta="Evidencia"><input className={inputPago} value={formulario.evidencia} onChange={(e) => setFormulario((actual) => ({ ...actual, evidencia: e.target.value }))} placeholder="Acta o constancia de entrega" /></CampoPago><CampoPago etiqueta="Observaciones"><textarea className={`${inputPago} min-h-20`} value={formulario.observaciones} onChange={(e) => setFormulario((actual) => ({ ...actual, observaciones: e.target.value }))} /></CampoPago></div>
}

function FormularioIncidenciaCheque({ formulario, setFormulario }: { formulario: FormularioIncidencia; setFormulario: Dispatch<SetStateAction<FormularioIncidencia>> }) {
  return <div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Tipo"><select className={inputPago} value={formulario.tipo} onChange={(e) => setFormulario((actual) => ({ ...actual, tipo: e.target.value }))}><option>Pérdida</option><option>Robo</option><option>Deterioro</option><option>Rechazo bancario</option></select></CampoPago><CampoPago etiqueta="Fecha"><input className={inputPago} type="date" value={formulario.fecha} onChange={(e) => setFormulario((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Motivo"><input className={inputPago} value={formulario.motivo} onChange={(e) => setFormulario((actual) => ({ ...actual, motivo: e.target.value }))} /></CampoPago><CampoPago etiqueta="Evidencia"><input className={inputPago} value={formulario.evidencia} onChange={(e) => setFormulario((actual) => ({ ...actual, evidencia: e.target.value }))} placeholder="Reporte o archivo" /></CampoPago><CampoPago etiqueta="Gestión"><input className={inputPago} value={formulario.gestion} onChange={(e) => setFormulario((actual) => ({ ...actual, gestion: e.target.value }))} placeholder="Bloqueo y seguimiento" /></CampoPago><label className="flex items-center gap-2 rounded-lg border border-slate-200 p-3 text-sm"><input type="checkbox" checked={formulario.reporteBanco} onChange={(e) => setFormulario((actual) => ({ ...actual, reporteBanco: e.target.checked }))} />Reportar al banco</label><label className="flex items-center gap-2 rounded-lg border border-amber-200 bg-amber-50 p-3 text-sm sm:col-span-2"><input type="checkbox" checked={formulario.reposicion} onChange={(e) => setFormulario((actual) => ({ ...actual, reposicion: e.target.checked }))} />Generar reposición con un nuevo número; el original queda consumido.</label></div>
}

import { useMemo, useState, type Dispatch, type ReactNode, type SetStateAction } from 'react'
import { CheckCircle2, Clock3, Eye, FileCheck2, Filter, Search, ShieldCheck, WalletCards, PlayCircle, XCircle, Pencil, CalendarClock, ArrowRightLeft, Printer, PackageCheck, AlertTriangle, Ban, RefreshCw } from 'lucide-react'
import { CUENTAS, PAGOS_AUTORIZADOS, formatoMoneda, type CuentaBancaria, type PagoAutorizado, type MovimientoBancario } from './data'
import { Boton, EncabezadoVista, EstadoBadge, MonedaBadge, Panel } from './shared'
import { DatoLectura, PanelLectura, Modal, Sheet } from './formularios'

type Toast = (titulo: string, detalle?: string, tono?: 'exito' | 'aviso' | 'error') => void
type PagoVisible = PagoAutorizado & { banco: string; saldo: number }
type ChequeLocal = { numero: number; pagoId: string; estado: 'Generado' | 'Entregado' | 'Incidencia' | 'Anulado' | 'Repuesto'; fecha: string; lugar: string; concepto: string; firmantes: string; observaciones: string; receptor?: string }
type FormularioCheque = { fecha: string; lugar: string; concepto: string; firmantes: string; observaciones: string }
type FormularioEntrega = { fecha: string; receptor: string; tipoIdentificacion: 'DPI' | 'Pasaporte'; identificacion: string; evidencia: string; observaciones: string }
type FormularioIncidencia = { tipo: string; fecha: string; motivo: string; evidencia: string; reporteBanco: boolean; gestion: string; reposicion: boolean }

const numeroEnLetras = (valor: number, moneda: string) => `${valor.toLocaleString('es-GT', { maximumFractionDigits: 2 })} ${moneda === 'GTQ' ? 'quetzales' : 'dólares'} exactos`

const NOTA_CXP = 'Información recibida de Cuentas por Pagar'
const PAGOS: PagoVisible[] = PAGOS_AUTORIZADOS.map((pago) => ({
  ...pago,
  banco: pago.cuentaBeneficiaria.startsWith('Banco Industrial') ? 'Banco Industrial' : pago.cuentaBeneficiaria.startsWith('BAM') ? 'BAM' : pago.cuentaBeneficiaria.startsWith('Banrural') ? 'Banrural' : 'Pendiente',
  saldo: pago.montoNeto,
}))

const ESTADOS = ['Autorizado', 'Preparado', 'Fondos liberados', 'Pagado', 'Ejecutado', 'Anulado']
const BANCOS = ['BAM', 'Banco Industrial', 'Banrural']

export default function VistaPagos({ onToast }: { onToast: Toast }) {
  const [pagos] = useState(PAGOS)
  const [busqueda, setBusqueda] = useState('')
  const [estado, setEstado] = useState('')
  const [moneda, setMoneda] = useState('')
  const [forma, setForma] = useState('')
  const [vencimiento, setVencimiento] = useState('')
  const [banco, setBanco] = useState('')
  const [detalle, setDetalle] = useState<PagoVisible | null>(null)
  const [preparando, setPreparando] = useState<PagoVisible | null>(null)
  const [pasoPreparacion, setPasoPreparacion] = useState(1)
  const [estadoLocal, setEstadoLocal] = useState<Record<string, string>>({})
  const [cheques, setCheques] = useState<ChequeLocal[]>([])
  const [chequeAbierto, setChequeAbierto] = useState<PagoVisible | null>(null)
  const [modoCheque, setModoCheque] = useState<'emitir' | 'entregar' | 'incidencia'>('emitir')
  const [formularioCheque, setFormularioCheque] = useState<FormularioCheque>({ fecha: '2025-11-07', lugar: 'Ciudad de Guatemala', concepto: '', firmantes: 'Firmante 1 · Firmante 2', observaciones: '' })
  const [formularioEntrega, setFormularioEntrega] = useState<FormularioEntrega>({ fecha: '2025-11-07', receptor: '', tipoIdentificacion: 'DPI', identificacion: '', evidencia: '', observaciones: '' })
  const [formularioIncidencia, setFormularioIncidencia] = useState<FormularioIncidencia>({ tipo: 'Pérdida', fecha: '2025-11-07', motivo: '', evidencia: '', reporteBanco: false, gestion: '', reposicion: false })
  const [formulario, setFormulario] = useState({ monto: '', distribucion: 'Pago único', prioridad: 'Alta', observaciones: '', cuentaId: '', fecha: '' })
  const [transferencia, setTransferencia] = useState<PagoVisible | null>(null)
  const [rechazoAbierto, setRechazoAbierto] = useState(false)
  const [movimientos, setMovimientos] = useState<MovimientoBancario[]>([])
  const [formularioTransferencia, setFormularioTransferencia] = useState({ fecha: '2025-11-07', referencia: '', concepto: '', comprobante: '', observaciones: '', confirmacion: false })
  const [formularioRechazo, setFormularioRechazo] = useState({ fecha: '2025-11-07', codigo: '', motivo: '', evidencia: '', observaciones: '', generarNueva: false })

const resumen = useMemo(() => ({
    preparar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Autorizado').length,
    autorizar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Preparado').length,
    ejecutar: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Fondos liberados').length,
    pagados: pagos.filter((p) => (estadoLocal[p.id] ?? p.estado) === 'Pagado' || (estadoLocal[p.id] ?? p.estado) === 'Ejecutado').length,
  }), [estadoLocal, pagos])

const filtrados = useMemo(() => {
    const termino = busqueda.trim().toLowerCase()
    return pagos.filter((pago) => {
      const estadoPago = estadoLocal[pago.id] ?? pago.estado
      const coincideTexto = !termino || [pago.ordenPago, pago.proveedor, pago.nit, pago.factura, pago.ordenCompra].join(' ').toLowerCase().includes(termino)
      const coincideVencimiento = !vencimiento || (vencimiento === 'Próximos 7 días' ? ['05 Nov 2025', '06 Nov 2025', '07 Nov 2025', '09 Nov 2025'].includes(pago.vencimiento) : pago.vencimiento.includes('Nov 2025'))
      return coincideTexto && (!estado || estadoPago === estado) && (!moneda || pago.moneda === moneda) && (!forma || pago.metodoSugerido === forma) && coincideVencimiento && (!banco || pago.banco === banco)
    })
  }, [banco, estado, estadoLocal, forma, moneda, pagos, vencimiento, busqueda])

const abrirPreparacion = (pago: PagoVisible) => {
    setPreparando(pago)
    setPasoPreparacion(1)
    setFormulario({ monto: String(pago.montoNeto), distribucion: 'Pago único', prioridad: pago.prioridad, observaciones: '', cuentaId: pago.banco === 'Pendiente' ? '' : (CUENTAS.find((cuenta) => cuenta.banco === pago.banco && cuenta.moneda === pago.moneda)?.id ?? ''), fecha: '' })
  }

const cerrarPreparacion = () => {
    setPreparando(null)
    setPasoPreparacion(1)
  }

const cuentaOrigen = CUENTAS.find((cuenta) => cuenta.id === formulario.cuentaId)
  const montoPreparado = Number(formulario.monto) || 0
  const comprometidoProyectado = cuentaOrigen ? cuentaOrigen.comprometido + montoPreparado : 0
  const disponibleProyectado = cuentaOrigen ? cuentaOrigen.saldoDisponible - montoPreparado : 0
  const fondosInsuficientes = Boolean(cuentaOrigen && montoPreparado > cuentaOrigen.saldoDisponible)
  const verificacionCuenta = cuentaOrigen?.banco === 'BAM' && cuentaOrigen.estado === 'Activa' ? 'Verificada' : 'No verificada'
  const formaSugerida = verificacionCuenta === 'Verificada' ? 'Transferencia BAM' : 'Cheque'

const cambiarEstado = (pago: PagoVisible, nuevoEstado: PagoAutorizado['estado'], mensaje: string) => {
    setEstadoLocal((actual) => ({ ...actual, [pago.id]: nuevoEstado }))
    onToast(mensaje, `${pago.ordenPago} · actualización simulada`)
  }

const guardarPreparacion = (enviar: boolean) => {
    if (!preparando || fondosInsuficientes) return
    setEstadoLocal((actual) => ({ ...actual, [preparando.id]: enviar ? 'Preparado' : 'Autorizado' }))
    onToast(enviar ? 'Pago enviado' : 'Borrador guardado', `${preparando.ordenPago} · ${formaSugerida}`)
    cerrarPreparacion()
  }

const abrirTransferencia = (pago: PagoVisible) => {
    setTransferencia(pago)
    setRechazoAbierto(false)
    setFormularioTransferencia({ fecha: '2025-11-07', referencia: `TRF-${pago.ordenPago.replace('OP-', '')}`, concepto: `Pago ${pago.factura}`, comprobante: '', observaciones: '', confirmacion: false })
    setFormularioRechazo({ fecha: '2025-11-07', codigo: '', motivo: '', evidencia: '', observaciones: '', generarNueva: false })
  }

const ejecutarTransferencia = () => {
    if (!transferencia || !formularioTransferencia.fecha || !formularioTransferencia.referencia || !formularioTransferencia.concepto || !formularioTransferencia.confirmacion) return
    const cuentaOrigen = CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda && cuenta.estado === 'Activa')
    const movimiento: MovimientoBancario = { id: `MOV-TRF-${movimientos.length + 5001}`, fecha: formularioTransferencia.fecha, cuentaId: cuentaOrigen?.id ?? 'CTA-001', tipo: 'Transferencia enviada', descripcion: formularioTransferencia.concepto, referencia: formularioTransferencia.referencia, moduloOrigen: 'Cuentas por Pagar', documentoOrigen: transferencia.ordenPago, debito: transferencia.montoNeto, credito: 0, saldo: (cuentaOrigen?.saldoDisponible ?? 0) - transferencia.montoNeto, estado: 'Aplicado', conciliacion: 'Pendiente' }
    setMovimientos((actuales) => [movimiento, ...actuales])
    setEstadoLocal((actual) => ({ ...actual, [transferencia.id]: 'Pagado' }))
    onToast('Transferencia ejecutada', `${transferencia.ordenPago} · movimiento débito creado · conciliación pendiente`)
    setTransferencia(null)
  }

const registrarRechazo = () => {
    if (!transferencia || !formularioRechazo.fecha || !formularioRechazo.codigo || !formularioRechazo.motivo) return
    setEstadoLocal((actual) => ({ ...actual, [transferencia.id]: 'Anulado' }))
    onToast('Transferencia rechazada', formularioRechazo.generarNueva ? `${transferencia.ordenPago} · nueva transferencia pendiente de preparación` : `${transferencia.ordenPago} · rechazo registrado`)
    setTransferencia(null)
  }

const siguienteNumeroCheque = () => {
    const usados = cheques.map((cheque) => cheque.numero)
    return Math.max(4521, ...usados) + 1
  }

const abrirCheque = (pago: PagoVisible, modo: 'emitir' | 'entregar' | 'incidencia' = 'emitir') => {
    setChequeAbierto(pago)
    setModoCheque(modo)
    const cheque = cheques.find((item) => item.pagoId === pago.id)
    setFormularioCheque({ fecha: cheque?.fecha ?? '2025-11-07', lugar: cheque?.lugar ?? 'Ciudad de Guatemala', concepto: cheque?.concepto ?? `Pago ${pago.factura}`, firmantes: cheque?.firmantes ?? 'Firmante 1 · Firmante 2', observaciones: cheque?.observaciones ?? '' })
  }

const generarCheque = () => {
    if (!chequeAbierto || cheques.some((item) => item.pagoId === chequeAbierto.id)) return
    const nuevo: ChequeLocal = { numero: siguienteNumeroCheque(), pagoId: chequeAbierto.id, estado: 'Generado', ...formularioCheque }
    setCheques((actuales) => [...actuales, nuevo])
    setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque emitido' }))
    onToast('Cheque generado', `${chequeAbierto.ordenPago} · CHQ-${String(nuevo.numero).padStart(6, '0')}`)
    setModoCheque('emitir')
  }

const marcarEntregado = () => {
    if (!chequeAbierto) return
    const valido = formularioEntrega.receptor && formularioEntrega.evidencia && (formularioEntrega.tipoIdentificacion === 'DPI' ? /^\\d{13}$/.test(formularioEntrega.identificacion) : formularioEntrega.identificacion.trim().length >= 5)
    if (!valido) { onToast('Datos de entrega incompletos', 'El DPI debe contener exactamente 13 números', 'error'); return }
    setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: 'Entregado', receptor: formularioEntrega.receptor } : item))
    setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque entregado' }))
    onToast('Cheque marcado como entregado', `${chequeAbierto.ordenPago} · ${formularioEntrega.receptor}`)
    setChequeAbierto(null)
  }

const registrarIncidenciaCheque = () => {
    if (!chequeAbierto || !formularioIncidencia.fecha || !formularioIncidencia.motivo || !formularioIncidencia.gestion) return
    const actual = cheques.find((item) => item.pagoId === chequeAbierto.id)
    setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: formularioIncidencia.reposicion ? 'Repuesto' : 'Incidencia' } : item))
    setEstadoLocal((estados) => ({ ...estados, [chequeAbierto.id]: formularioIncidencia.reposicion ? 'Cheque repuesto' : 'Incidencia de cheque' }))
    const nuevoNumero = formularioIncidencia.reposicion ? siguienteNumeroCheque() : null
    if (nuevoNumero && actual) setCheques((actuales) => [...actuales, { ...actual, numero: nuevoNumero, estado: 'Generado', observaciones: `Reposición del cheque ${actual.numero}` }])
    onToast(formularioIncidencia.reposicion ? 'Cheque repuesto' : 'Incidencia registrada', formularioIncidencia.reposicion ? `Número original ${actual?.numero} consumido · nuevo CHQ-${nuevoNumero}` : `${chequeAbierto.ordenPago} · número original no disponible`)
    setChequeAbierto(null)
  }

const anularCheque = () => {
    if (!chequeAbierto) return
    setCheques((actuales) => actuales.map((item) => item.pagoId === chequeAbierto.id ? { ...item, estado: 'Anulado' } : item))
    setEstadoLocal((actual) => ({ ...actual, [chequeAbierto.id]: 'Cheque anulado' }))
    onToast('Cheque anulado', `${chequeAbierto.ordenPago} · el número queda consumido`)
    setChequeAbierto(null)
  }

return (
    <div className="flex flex-1 flex-col">
      <EncabezadoVista titulo="Pagos autorizados" subtitulo="Consulta obligaciones aprobadas por Cuentas por Pagar y su preparación bancaria." breadcrumb={['Sistema', 'Bancos', 'Pagos autorizados']} />
      <main className="flex flex-1 flex-col gap-5 p-4 sm:p-8">
        <div className="flex items-center gap-2 rounded-lg border border-blue-100 bg-blue-50 px-4 py-3 text-sm text-blue-800">
          <FileCheck2 className="h-4 w-4 flex-shrink-0" aria-hidden="true" />
          <span>{NOTA_CXP}</span>
        </div>

<section className="flex flex-col gap-3 rounded-xl border border-slate-200 bg-white p-4">
          <div className="relative">
            <Search className="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" aria-hidden="true" />
            <input aria-label="Buscar pagos" value={busqueda} onChange={(e) => setBusqueda(e.target.value)} placeholder="Buscar orden, proveedor, NIT, factura u orden de compra…" className="w-full rounded-lg border border-slate-200 py-2.5 pl-9 pr-3 text-sm outline-none focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20" />
          </div>
          <div className="grid grid-cols-2 gap-2 md:grid-cols-5">
            <Filtro ariaLabel="Filtrar por estado" valor={estado} onCambio={setEstado} placeholder="Estado" opciones={ESTADOS} />
            <Filtro ariaLabel="Filtrar por moneda" valor={moneda} onCambio={setMoneda} placeholder="Moneda" opciones={['GTQ', 'USD']} />
            <Filtro ariaLabel="Filtrar por forma" valor={forma} onCambio={setForma} placeholder="Forma" opciones={['Transferencia', 'Cheque']} />
            <Filtro ariaLabel="Filtrar por vencimiento" valor={vencimiento} onCambio={setVencimiento} placeholder="Vencimiento" opciones={['Próximos 7 días', 'Este mes']} />
            <Filtro ariaLabel="Filtrar por banco" valor={banco} onCambio={setBanco} placeholder="Banco" opciones={BANCOS} />
          </div>
          <div className="flex items-center justify-between text-xs text-slate-500">
            <span>{filtrados.length} de {pagos.length} obligaciones visibles</span>
            <Boton icono={Filter} className="!px-2.5 !py-1.5 text-xs" onClick={() => onToast('Filtros aplicados', `${filtrados.length} obligaciones coinciden`)}>Aplicar filtros</Boton>
          </div>
        </section>

<Panel titulo="Obligaciones autorizadas" descripcion="Detalle operativo recibido del módulo de Cuentas por Pagar.">
          <div className="overflow-x-auto">
            <table className="w-full min-w-[1500px] text-sm">
              <thead><tr className="border-b border-slate-100 text-left text-xs font-medium text-slate-500">
                {['Orden', 'Proveedor', 'NIT', 'Factura', 'Orden de compra', 'Vencimiento', 'Moneda', 'Monto', 'Saldo', 'Cuenta beneficiaria', 'Verificación', 'Forma sugerida', 'Estado', 'Acción'].map((columna) => <th key={columna} className="px-4 py-3">{columna}</th>)}
              </tr></thead>
              <tbody>
                {filtrados.map((pago) => <tr key={pago.id} className="border-b border-slate-50 hover:bg-slate-50/60">
                  <td className="whitespace-nowrap px-4 py-3 font-medium text-slate-800">{pago.ordenPago}</td>
                  <td className="max-w-[180px] truncate px-4 py-3 text-slate-700">{pago.proveedor}</td>
                  <td className="whitespace-nowrap px-4 py-3 font-mono text-xs text-slate-500">{pago.nit}</td>
                  <td className="whitespace-nowrap px-4 py-3 font-mono text-xs text-slate-500">{pago.factura}</td>
                  <td className="whitespace-nowrap px-4 py-3 text-slate-500">{pago.ordenCompra}</td>
                  <td className="whitespace-nowrap px-4 py-3 text-slate-500">{pago.vencimiento}</td>
                  <td className="px-4 py-3"><MonedaBadge moneda={pago.moneda} /></td>
                  <td className="whitespace-nowrap px-4 py-3 font-semibold text-slate-800">{formatoMoneda(pago.montoNeto, pago.moneda)}</td>
                  <td className="whitespace-nowrap px-4 py-3 text-slate-700">{formatoMoneda(pago.saldo, pago.moneda)}</td>
                  <td className="whitespace-nowrap px-4 py-3 text-xs text-slate-500">{pago.cuentaBeneficiaria}</td>
                  <td className="px-4 py-3"><EstadoBadge estado={pago.verificacion} /></td>
                  <td className="whitespace-nowrap px-4 py-3 text-slate-600">{pago.metodoSugerido}</td>
                  <td className="px-4 py-3"><EstadoBadge estado={estadoLocal[pago.id] ?? pago.estado} /></td>
                  <td className="px-4 py-3"><div className="flex items-center gap-1"><Boton icono={Eye} title="Ver detalle" className="!px-2 !py-1.5" onClick={() => setDetalle(pago)} />{pago.metodoSugerido === 'Cheque' ? <>{!cheques.some((item) => item.pagoId === pago.id) && <Boton icono={FileCheck2} title="Emitir cheque" className="!px-2 !py-1.5" onClick={() => abrirCheque(pago)} />}{cheques.some((item) => item.pagoId === pago.id) && <><Boton icono={PackageCheck} title="Marcar entregado" className="!px-2 !py-1.5" onClick={() => { setModoCheque('entregar'); setChequeAbierto(pago) }} /><Boton icono={AlertTriangle} title="Incidencia" className="!px-2 !py-1.5" onClick={() => { setModoCheque('incidencia'); setChequeAbierto(pago) }} /><Boton icono={Ban} title="Anular" className="!px-2 !py-1.5" onClick={() => abrirCheque(pago, 'emitir')} /></>}</> : <>{(estadoLocal[pago.id] ?? pago.estado) === 'Fondos liberados' && <Boton icono={ArrowRightLeft} title="Ejecutar transferencia" className="!px-2 !py-1.5" onClick={() => abrirTransferencia(pago)} />}{(estadoLocal[pago.id] ?? pago.estado) !== 'Fondos liberados' && (estadoLocal[pago.id] ?? pago.estado) !== 'Ejecutado' && <Boton icono={PlayCircle} title="Preparar pago" className="!px-2 !py-1.5" onClick={() => abrirPreparacion(pago)} />}</>}</div></td>
                </tr>)}
                {filtrados.length === 0 && <tr><td colSpan={14} className="px-4 py-10 text-center text-sm text-slate-400">No hay obligaciones que coincidan con los filtros.</td></tr>}
              </tbody>
            </table>
          </div>
        </Panel>
      </main>

{preparando && (
        <Modal abierto onCerrar={cerrarPreparacion} ancho="xl" titulo={`Preparar pago · ${preparando.ordenPago}`} descripcion={`${preparando.proveedor} · Paso ${pasoPreparacion} de 3`} pie={
          <div className="flex w-full items-center justify-between gap-2">
            <Boton onClick={pasoPreparacion === 1 ? cerrarPreparacion : () => setPasoPreparacion((paso) => paso - 1)}>{pasoPreparacion === 1 ? 'Cancelar' : 'Atrás'}</Boton>
            <div className="flex gap-2">{pasoPreparacion === 3 ? <><Boton onClick={() => guardarPreparacion(false)}>Guardar borrador</Boton><Boton variante="primario" onClick={() => guardarPreparacion(true)} disabled={fondosInsuficientes}>Enviar</Boton></> : <Boton variante="primario" onClick={() => setPasoPreparacion((paso) => paso + 1)} disabled={pasoPreparacion === 2 && (!cuentaOrigen || fondosInsuficientes || !formulario.fecha)}>Continuar</Boton>}</div>
          </div>
        }>
          {pasoPreparacion === 1 && <PasoDatosPago pago={preparando} formulario={formulario} setFormulario={setFormulario} />}
          {pasoPreparacion === 2 && <PasoCuentaPago pago={preparando} formulario={formulario} setFormulario={setFormulario} cuentaOrigen={cuentaOrigen} verificacionCuenta={verificacionCuenta} formaSugerida={formaSugerida} comprometidoProyectado={comprometidoProyectado} disponibleProyectado={disponibleProyectado} fondosInsuficientes={fondosInsuficientes} />}
          {pasoPreparacion === 3 && <PasoResumenPago pago={preparando} formulario={formulario} cuentaOrigen={cuentaOrigen} formaSugerida={formaSugerida} fondosInsuficientes={fondosInsuficientes} />}
        </Modal>
      )}

{transferencia && <Modal abierto onCerrar={() => setTransferencia(null)} ancho="lg" titulo={rechazoAbierto ? `Registrar transferencia rechazada · ${transferencia.ordenPago}` : `Ejecutar transferencia · ${transferencia.ordenPago}`} descripcion={rechazoAbierto ? 'Registra el rechazo recibido del banco destino.' : 'Revisa la información y confirma la ejecución bancaria.'} pie={rechazoAbierto ? <div className="flex w-full items-center justify-between gap-2"><Boton onClick={() => setRechazoAbierto(false)}>Atrás</Boton><Boton variante="peligro" onClick={registrarRechazo} disabled={!formularioRechazo.fecha || !formularioRechazo.codigo || !formularioRechazo.motivo}>Guardar rechazo</Boton></div> : <div className="flex w-full items-center justify-between gap-2"><Boton variante="peligro" onClick={() => setRechazoAbierto(true)}>Transferencia rechazada</Boton><div className="flex gap-2"><Boton onClick={() => setTransferencia(null)}>Cancelar</Boton><Boton variante="primario" onClick={ejecutarTransferencia} disabled={!formularioTransferencia.fecha || !formularioTransferencia.referencia || !formularioTransferencia.concepto || !formularioTransferencia.confirmacion}>Ejecutar transferencia</Boton></div></div>}>
        {rechazoAbierto ? <div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Fecha del rechazo"><input className={inputPago} type="date" value={formularioRechazo.fecha} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Código de rechazo"><input className={inputPago} value={formularioRechazo.codigo} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, codigo: e.target.value }))} placeholder="Ej. AC04" /></CampoPago><CampoPago etiqueta="Motivo"><input className={inputPago} value={formularioRechazo.motivo} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, motivo: e.target.value }))} placeholder="Datos de beneficiario inválidos" /></CampoPago><CampoPago etiqueta="Evidencia"><input className={inputPago} value={formularioRechazo.evidencia} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, evidencia: e.target.value }))} placeholder="Nombre o referencia del archivo" /></CampoPago><label className="flex flex-col gap-1.5 text-sm sm:col-span-2"><span className="font-medium text-slate-700">Observaciones</span><textarea className={`${inputPago} min-h-20`} value={formularioRechazo.observaciones} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, observaciones: e.target.value }))} /></label><label className="flex items-center gap-2 rounded-lg border border-slate-200 p-3 text-sm text-slate-700 sm:col-span-2"><input type="checkbox" checked={formularioRechazo.generarNueva} onChange={(e) => setFormularioRechazo((actual) => ({ ...actual, generarNueva: e.target.checked }))} />Generar una nueva transferencia después de registrar el rechazo</label></div> : <div className="flex flex-col gap-5"><div className="grid grid-cols-2 gap-3 rounded-xl border border-slate-200 bg-slate-50 p-4 sm:grid-cols-3"><DatoLectura etiqueta="Orden" valor={transferencia.ordenPago} /><DatoLectura etiqueta="Proveedor" valor={transferencia.proveedor} /><DatoLectura etiqueta="Titular" valor={transferencia.proveedor} /><DatoLectura etiqueta="Cuenta beneficiaria" valor={transferencia.cuentaBeneficiaria} /><DatoLectura etiqueta="Banco destino" valor={transferencia.banco} /><DatoLectura etiqueta="Moneda" valor={transferencia.moneda} /><DatoLectura etiqueta="Monto" valor={formatoMoneda(transferencia.montoNeto, transferencia.moneda)} /><DatoLectura etiqueta="Facturas" valor={transferencia.factura} /><DatoLectura etiqueta="Cuenta BAM de origen" valor={`${CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda)?.alias ?? 'BAM Operativa'} · ${CUENTAS.find((cuenta) => cuenta.banco === 'BAM' && cuenta.moneda === transferencia.moneda)?.numeroEnmascarado ?? '****4821'}`} /></div><div className="grid grid-cols-1 gap-4 sm:grid-cols-2"><CampoPago etiqueta="Fecha efectiva"><input className={inputPago} type="date" value={formularioTransferencia.fecha} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, fecha: e.target.value }))} /></CampoPago><CampoPago etiqueta="Referencia"><input className={inputPago} value={formularioTransferencia.referencia} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, referencia: e.target.value }))} /></CampoPago><CampoPago etiqueta="Concepto"><input className={inputPago} value={formularioTransferencia.concepto} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, concepto: e.target.value }))} /></CampoPago><CampoPago etiqueta="Comprobante"><input className={inputPago} value={formularioTransferencia.comprobante} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, comprobante: e.target.value }))} placeholder="Nombre o referencia del soporte" /></CampoPago><label className="flex flex-col gap-1.5 text-sm sm:col-span-2"><span className="font-medium text-slate-700">Observaciones</span><textarea className={`${inputPago} min-h-20`} value={formularioTransferencia.observaciones} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, observaciones: e.target.value }))} /></label><label className="flex items-start gap-2 rounded-lg border border-blue-100 bg-blue-50 p-3 text-sm text-blue-900 sm:col-span-2"><input className="mt-0.5" type="checkbox" checked={formularioTransferencia.confirmacion} onChange={(e) => setFormularioTransferencia((actual) => ({ ...actual, confirmacion: e.target.checked }))} />Confirmo que los datos son correctos y autorizo registrar el débito ficticio de esta transferencia.</label></div></div>}
      </Modal>}

type FormularioPreparacion = { monto: string; distribucion: string; prioridad: string; observaciones: string; cuentaId: string; fecha: string }

type CamposPasoProps = { pago: PagoVisible; formulario: FormularioPreparacion; setFormulario: Dispatch<SetStateAction<FormularioPreparacion>> }

const inputPago = 'rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm text-slate-700 outline-none focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20'