mails.py 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539
  1. REGISTER_MAIL = {
  2. "subject": "Bienvenido a Pedidos Express - Confirma tu registro",
  3. "body": """
  4. <html>
  5. <head>
  6. <meta charset="UTF-8">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <title>¡Bienvenido a {app_name}!</title>
  9. <style>
  10. body {{
  11. margin: 0;
  12. padding: 0;
  13. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  14. background-color: #f3f4f6;
  15. }}
  16. .email-container {{
  17. max-width: 600px;
  18. margin: 0 auto;
  19. background-color: #ffffff;
  20. border-radius: 12px;
  21. box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  22. overflow: hidden;
  23. }}
  24. .header {{
  25. background-color: #101419;
  26. color: white;
  27. padding: 32px;
  28. text-align: center;
  29. }}
  30. .header h1 {{
  31. margin: 0;
  32. font-size: 28px;
  33. font-weight: bold;
  34. }}
  35. .header p {{
  36. margin: 8px 0 0 0;
  37. font-size: 16px;
  38. opacity: 0.9;
  39. }}
  40. .content {{
  41. padding: 32px;
  42. }}
  43. .welcome-message {{
  44. text-align: center;
  45. margin-bottom: 32px;
  46. }}
  47. .welcome-message h2 {{
  48. color: #101419;
  49. font-size: 24px;
  50. margin: 0 0 12px 0;
  51. font-weight: bold;
  52. }}
  53. .welcome-message p {{
  54. color: #6b7280;
  55. font-size: 16px;
  56. line-height: 1.6;
  57. margin: 0;
  58. }}
  59. .benefits-section {{
  60. background-color: #f9fafb;
  61. border-radius: 8px;
  62. padding: 24px;
  63. margin: 24px 0;
  64. }}
  65. .benefits-title {{
  66. color: #101419;
  67. font-size: 18px;
  68. font-weight: 600;
  69. margin: 0 0 16px 0;
  70. text-align: center;
  71. }}
  72. .benefits-list {{
  73. list-style: none;
  74. padding: 0;
  75. margin: 0;
  76. }}
  77. .benefits-list li {{
  78. color: #374151;
  79. font-size: 14px;
  80. line-height: 1.5;
  81. margin-bottom: 8px;
  82. padding-left: 20px;
  83. position: relative;
  84. }}
  85. .benefits-list li:before {{
  86. content: "✓";
  87. color: #10b981;
  88. font-weight: bold;
  89. position: absolute;
  90. left: 0;
  91. }}
  92. .verification-section {{
  93. background: linear-gradient(135deg, #101419 0%, #37404a 100%);
  94. border-radius: 12px;
  95. padding: 32px;
  96. text-align: center;
  97. margin: 32px 0;
  98. color: white;
  99. }}
  100. .verification-icon {{
  101. font-size: 48px;
  102. margin: 16px 0;
  103. border: 3px solid white;
  104. border-radius: 50%;
  105. padding: 20px;
  106. display: inline-block;
  107. width: 80px;
  108. height: 80px;
  109. line-height: 80px;
  110. }}
  111. .verification-description {{
  112. font-size: 18px;
  113. margin: 16px 0;
  114. opacity: 0.95;
  115. }}
  116. .cta-button {{
  117. background-color: white;
  118. color: #101419;
  119. padding: 16px 32px;
  120. border-radius: 8px;
  121. text-decoration: none;
  122. font-weight: 600;
  123. font-size: 16px;
  124. display: inline-block;
  125. margin-top: 16px;
  126. transition: all 0.2s ease;
  127. }}
  128. .cta-button:hover {{
  129. background-color: #f3f4f6;
  130. transform: translateY(-1px);
  131. }}
  132. .security-note {{
  133. background-color: #fef3c7;
  134. border: 1px solid #f59e0b;
  135. border-radius: 8px;
  136. padding: 16px;
  137. margin: 24px 0;
  138. text-align: center;
  139. }}
  140. .security-note p {{
  141. color: #92400e;
  142. font-size: 14px;
  143. margin: 0;
  144. font-weight: 500;
  145. }}
  146. .website-section {{
  147. text-align: center;
  148. margin: 32px 0;
  149. padding: 24px;
  150. background-color: #f9fafb;
  151. border-radius: 8px;
  152. }}
  153. .website-url {{
  154. color: #101419;
  155. font-size: 20px;
  156. font-weight: 600;
  157. text-decoration: none;
  158. border-bottom: 2px solid #101419;
  159. padding-bottom: 4px;
  160. }}
  161. .footer {{
  162. background-color: #f9fafb;
  163. padding: 24px 32px;
  164. text-align: center;
  165. border-top: 1px solid #e5e7eb;
  166. }}
  167. .footer p {{
  168. color: #6b7280;
  169. font-size: 14px;
  170. margin: 0;
  171. line-height: 1.5;
  172. }}
  173. @media (max-width: 600px) {{
  174. .email-container {{
  175. margin: 0;
  176. border-radius: 0;
  177. }}
  178. .header, .content {{
  179. padding: 24px 16px;
  180. }}
  181. .verification-icon {{
  182. font-size: 36px;
  183. padding: 16px;
  184. width: 60px;
  185. height: 60px;
  186. line-height: 60px;
  187. }}
  188. }}
  189. </style>
  190. </head>
  191. <body>
  192. <div style="padding: 20px;">
  193. <div class="email-container">
  194. <!-- Header -->
  195. <div class="header">
  196. <h1>¡Hola {name}!</h1>
  197. <p>Bienvenido a {app_name}</p>
  198. </div>
  199. <!-- Content -->
  200. <div class="content">
  201. <!-- Welcome Message -->
  202. <div class="welcome-message">
  203. <h2>Te damos la bienvenida a {app_name}</h2>
  204. <p>Tu registro ha sido exitoso. <br>Estamos emocionados de tenerte con nosotros. Para completar tu registro, necesitas crear tu PIN de seguridad.</p>
  205. </div>
  206. <!-- Benefits Section -->
  207. <div class="benefits-section">
  208. <h3 class="benefits-title">¿Qué puedes hacer con {app_name}?</h3>
  209. <ul class="benefits-list">
  210. <li>Realizar pedidos de forma rápida y sencilla</li>
  211. <li>Acceder a promociones exclusivas</li>
  212. <li>Disfrutar de una experiencia personalizada</li>
  213. <li>Usar nuestra inteligencia artificial</li>
  214. </ul>
  215. </div>
  216. <!-- Verification Section -->
  217. <div class="verification-section">
  218. <div class="verification-description">¡Solo falta un paso más!</div>
  219. <div class="verification-icon">🔐</div>
  220. <div class="verification-description">Crea tu PIN de seguridad para comenzar</div>
  221. <div class="verification-description">Vence en <strong>1 hora</strong></div>
  222. <a href="http://10.10.10.2:6001/verify?q={verification_code}" class="cta-button">Crear mi PIN ahora</a>
  223. </div>
  224. <!-- Security Note -->
  225. <div class="security-note">
  226. <p>🔒 Tu PIN será tu clave personal para acceder de forma segura a {app_name}</p>
  227. </div>
  228. <!-- Website Section -->
  229. <div class="website-section">
  230. <p style="color: #6b7280; margin-bottom: 12px;">También puedes acceder desde:</p>
  231. <a href="https://www.expressklein.com" class="website-url">www.expressklein.com</a>
  232. </div>
  233. </div>
  234. <!-- Footer -->
  235. <div class="footer">
  236. <p>
  237. <strong>Express Klein</strong> - Tu aplicación de pedidos favorita<br>
  238. Si tienes alguna pregunta, no dudes en contactarnos.<br>
  239. © 2025 Express Klein. Todos los derechos reservados.
  240. </p>
  241. </div>
  242. </div>
  243. </div>
  244. </body>
  245. </html>
  246. """
  247. }
  248. PRINTER_DISCONNECTED_MAIL = {
  249. "subject": "Printer Disconnected",
  250. "body": """
  251. <!DOCTYPE html>
  252. <html>
  253. <head>
  254. <meta charset="UTF-8">
  255. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  256. <title>Alerta: Impresora Desconectada - KlowApp</title>
  257. </head>
  258. <body style="margin: 0; padding: 0; font-family: Arial, sans-serif; background-color: #f3f4f6;">
  259. <table width="100%" cellpadding="0" cellspacing="0" style="background-color: #f3f4f6; padding: 20px;">
  260. <tr>
  261. <td align="center">
  262. <table width="600" cellpadding="0" cellspacing="0" style="max-width: 600px; background-color: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);">
  263. <!-- Header -->
  264. <tr>
  265. <td style="background-color: #dc2626; color: white; padding: 32px; text-align: center;">
  266. <h1 style="margin: 0; font-size: 28px; font-weight: bold;">🚨 Alerta del Sistema</h1>
  267. <p style="margin: 8px 0 0 0; font-size: 16px; opacity: 0.9;">Notificación para Desarrolladores</p>
  268. </td>
  269. </tr>
  270. <!-- Content -->
  271. <tr>
  272. <td style="padding: 32px;">
  273. <!-- Alert Message -->
  274. <table width="100%" cellpadding="0" cellspacing="0">
  275. <tr>
  276. <td style="text-align: center; margin-bottom: 32px;">
  277. <h2 style="color: #dc2626; font-size: 24px; margin: 0 0 12px 0; font-weight: bold;">Impresora Desconectada</h2>
  278. <p style="color: #6b7280; font-size: 16px; line-height: 1.6; margin: 0;">Se ha detectado una desconexión en el sistema de impresión de {restaurant_name}.</p>
  279. </td>
  280. </tr>
  281. </table>
  282. <!-- Alert Details -->
  283. <table width="100%" cellpadding="0" cellspacing="0" style="margin: 24px 0;">
  284. <tr>
  285. <td style="background-color: #fef2f2; border-radius: 8px; padding: 24px; border-left: 4px solid #dc2626;">
  286. <h3 style="color: #dc2626; font-size: 18px; font-weight: 600; margin: 0 0 16px 0;">Detalles del Problema</h3>
  287. <ul style="list-style: none; padding: 0; margin: 0;">
  288. <li style="color: #374151; font-size: 14px; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; position: relative;">
  289. <span style="color: #dc2626; font-weight: bold; position: absolute; left: 0;">🖨️</span>
  290. <strong>Impresora:</strong> {printer_name}
  291. </li>
  292. <li style="color: #374151; font-size: 14px; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; position: relative;">
  293. <span style="color: #dc2626; font-weight: bold; position: absolute; left: 0;">⏰</span>
  294. <strong>Hora de desconexión:</strong> {timestamp}
  295. </li>
  296. </ul>
  297. </td>
  298. </tr>
  299. </table>
  300. <!-- Priority Section -->
  301. <table width="100%" cellpadding="0" cellspacing="0">
  302. <tr>
  303. <td style="background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); border-radius: 12px; padding: 32px; text-align: center; margin: 32px 0; color: white;">
  304. <p style="font-size: 18px; margin: 0 0 16px 0; opacity: 0.95;">Estado del Sistema</p>
  305. <div style="font-size: 32px; font-weight: bold; margin: 16px 0; border: 3px solid white; border-radius: 8px; padding: 16px; display: inline-block; min-width: 200px; background-color: rgba(255,255,255,0.1);">
  306. 🔴 CRÍTICO
  307. </div>
  308. <p style="font-size: 16px; margin: 16px 0 0 0; opacity: 0.9;">Requiere atención inmediata</p>
  309. </td>
  310. </tr>
  311. </table>
  312. <!-- Impact Assessment -->
  313. <table width="100%" cellpadding="0" cellspacing="0" style="margin: 32px 0;">
  314. <tr>
  315. <td style="background-color: #fff7ed; border-radius: 8px; padding: 24px; border-left: 4px solid #f59e0b;">
  316. <h3 style="color: #92400e; font-size: 16px; font-weight: 600; margin: 0 0 12px 0;">Impacto Potencial</h3>
  317. <p style="color: #374151; font-size: 14px; line-height: 1.5; margin: 0;">
  318. ⚠️ Los pedidos no se están imprimiendo automáticamente<br>
  319. ⚠️ El restaurante puede estar perdiendo órdenes<br>
  320. ⚠️ Se requiere intervención manual inmediata<br>
  321. ⚠️ Posible pérdida de ingresos y experiencia del cliente
  322. </p>
  323. </td>
  324. </tr>
  325. </table>
  326. <!-- Action Items -->
  327. <table width="100%" cellpadding="0" cellspacing="0" style="margin: 32px 0;">
  328. <tr>
  329. <td style="background-color: #f0f9ff; border-radius: 8px; padding: 24px; border-left: 4px solid #3b82f6;">
  330. <h3 style="color: #1e40af; font-size: 16px; font-weight: 600; margin: 0 0 12px 0;">Acciones Requeridas</h3>
  331. <p style="color: #374151; font-size: 14px; line-height: 1.5; margin: 0;">
  332. 1. <strong>Verificar</strong> la conexión de red de la impresora<br>
  333. 2. <strong>Contactar</strong> al restaurante para confirmar el estado<br>
  334. 3. <strong>Reiniciar</strong> el servicio de impresión si es necesario<br>
  335. 4. <strong>Monitorear</strong> la reconexión y funcionalidad<br>
  336. 5. <strong>Documentar</strong> la resolución en el sistema
  337. </p>
  338. </td>
  339. </tr>
  340. </table>
  341. </td>
  342. </tr>
  343. <!-- Footer -->
  344. <tr>
  345. <td style="background-color: #f9fafb; padding: 24px 32px; text-align: center; border-top: 1px solid #e5e7eb;">
  346. <p style="color: #6b7280; font-size: 14px; margin: 0; line-height: 1.5;">
  347. <strong>Express Klein - Sistema de Monitoreo</strong><br>
  348. Alerta automática generada el {timestamp}<br>
  349. Este es un email automático del sistema de monitoreo.<br>
  350. © 2025 Express Klein. Todos los derechos reservados.
  351. </p>
  352. </td>
  353. </tr>
  354. </table>
  355. </td>
  356. </tr>
  357. </table>
  358. </body>
  359. </html>
  360. """
  361. }
  362. PIN_RECOVERY_MAIL = {
  363. "subject": "Recuperación de PIN | Pedidos Express",
  364. "body": """
  365. <!DOCTYPE html>
  366. <html>
  367. <head>
  368. <meta charset="UTF-8">
  369. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  370. <title>Recupera tu PIN </title>
  371. </head>
  372. <body style="margin: 0; padding: 0; font-family: Arial, sans-serif; background-color: #f3f4f6;">
  373. <table width="100%" cellpadding="0" cellspacing="0" style="background-color: #f3f4f6; padding: 20px;">
  374. <tr>
  375. <td align="center">
  376. <table width="600" cellpadding="0" cellspacing="0" style="max-width: 600px; background-color: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);">
  377. <!-- Header -->
  378. <tr>
  379. <td style="background-color: #101419; color: white; padding: 32px; text-align: center;">
  380. <h1 style="margin: 0; font-size: 28px; font-weight: bold;">¡Hola {name}!</h1>
  381. <p style="margin: 8px 0 0 0; font-size: 16px; opacity: 0.9;">Recuperación de PIN</p>
  382. </td>
  383. </tr>
  384. <!-- Content -->
  385. <tr>
  386. <td style="padding: 32px;">
  387. <!-- Welcome Message -->
  388. <table width="100%" cellpadding="0" cellspacing="0">
  389. <tr>
  390. <td style="text-align: center; margin-bottom: 32px;">
  391. <h2 style="color: #101419; font-size: 24px; margin: 0 0 12px 0; font-weight: bold;">¿Olvidaste tu PIN?</h2>
  392. <p style="color: #6b7280; font-size: 16px; line-height: 1.6; margin: 0;">No te preocupes, puedes crear un nuevo PIN de acceso a {app_name}.</p>
  393. </td>
  394. </tr>
  395. </table>
  396. <!-- Security Info -->
  397. <table width="100%" cellpadding="0" cellspacing="0" style="margin: 24px 0;">
  398. <tr>
  399. <td style="background-color: #f9fafb; border-radius: 8px; padding: 24px;">
  400. <h3 style="color: #101419; font-size: 18px; font-weight: 600; margin: 0 0 16px 0; text-align: center;">Información Importante</h3>
  401. <ul style="list-style: none; padding: 0; margin: 0;">
  402. <li style="color: #374151; font-size: 14px; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; position: relative;">
  403. <span style="color: #10b981; font-weight: bold; position: absolute; left: 0;">✓</span>
  404. Este enlace es válido por 24 horas
  405. </li>
  406. <li style="color: #374151; font-size: 14px; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; position: relative;">
  407. <span style="color: #10b981; font-weight: bold; position: absolute; left: 0;">✓</span>
  408. Podrás elegir tu nuevo PIN
  409. </li>
  410. <li style="color: #374151; font-size: 14px; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; position: relative;">
  411. <span style="color: #10b981; font-weight: bold; position: absolute; left: 0;">✓</span>
  412. Si no solicitaste este cambio, ignora este correo
  413. </li>
  414. </ul>
  415. </td>
  416. </tr>
  417. </table>
  418. <!-- Reset PIN Section -->
  419. <table width="100%" cellpadding="0" cellspacing="0">
  420. <tr>
  421. <td style="background: linear-gradient(135deg, #101419 0%, #37404a 100%); border-radius: 12px; padding: 32px; text-align: center; margin: 32px 0; color: white;">
  422. <p style="font-size: 18px; margin: 0 0 16px 0; opacity: 0.95;">Haz clic en el botón para crear tu nuevo PIN</p>
  423. <div style="font-size: 24px; font-weight: bold; margin: 16px 0; border: 3px solid white; border-radius: 8px; padding: 16px; display: inline-block; min-width: 200px; background-color: rgba(255,255,255,0.1);">
  424. 🔐 Restablecer PIN
  425. </div>
  426. <p style="font-size: 16px; margin: 16px 0 0 0; opacity: 0.9;">Podrás elegir un nuevo PIN de tu preferencia</p>
  427. <table width="100%" cellpadding="0" cellspacing="0" style="margin-top: 20px;">
  428. <tr>
  429. <td align="center">
  430. <a href="{reset_pin_url}" style="background-color: white; color: #101419; padding: 16px 32px; border-radius: 8px; text-decoration: none; font-weight: 600; font-size: 16px; display: inline-block;">
  431. Crear Nuevo PIN
  432. </a>
  433. </td>
  434. </tr>
  435. </table>
  436. </td>
  437. </tr>
  438. </table>
  439. <!-- Next Steps -->
  440. <table width="100%" cellpadding="0" cellspacing="0" style="margin: 32px 0;">
  441. <tr>
  442. <td style="background-color: #f0f9ff; border-radius: 8px; padding: 24px; border-left: 4px solid #3b82f6;">
  443. <h3 style="color: #101419; font-size: 16px; font-weight: 600; margin: 0 0 12px 0;">¿Qué sigue?</h3>
  444. <p style="color: #374151; font-size: 14px; line-height: 1.5; margin: 0;">
  445. 1. Haz clic en "Crear Nuevo PIN"<br>
  446. 2. Elige un PIN fácil de recordar pero seguro<br>
  447. 3. Ingresa a {app_name} con tu nuevo PIN<br>
  448. 4. ¡Disfruta de todos nuestros beneficios!
  449. </p>
  450. </td>
  451. </tr>
  452. </table>
  453. <!-- Website Section -->
  454. <table width="100%" cellpadding="0" cellspacing="0">
  455. <tr>
  456. <td style="text-align: center; margin: 32px 0; padding: 24px; background-color: #f9fafb; border-radius: 8px;">
  457. <p style="color: #6b7280; margin: 0 0 12px 0;">Visita nuestra plataforma:</p>
  458. <a href="https://www.expressklein.com" style="color: #101419; font-size: 20px; font-weight: 600; text-decoration: none; border-bottom: 2px solid #101419; padding-bottom: 4px;">
  459. www.expressklein.com
  460. </a>
  461. </td>
  462. </tr>
  463. </table>
  464. </td>
  465. </tr>
  466. <!-- Footer -->
  467. <tr>
  468. <td style="background-color: #f9fafb; padding: 24px 32px; text-align: center; border-top: 1px solid #e5e7eb;">
  469. <p style="color: #6b7280; font-size: 14px; margin: 0; line-height: 1.5;">
  470. <strong>Express Klein</strong> - Tu aplicación de pedidos favorita<br>
  471. Este enlace de restablecimiento expira en 24 horas.<br>
  472. Si no solicitaste este cambio, puedes ignorar este correo.<br>
  473. © 2025 Express Klein. Todos los derechos reservados.
  474. </p>
  475. </td>
  476. </tr>
  477. </table>
  478. </td>
  479. </tr>
  480. </table>
  481. </body>
  482. </html>
  483. """
  484. }