mails.py 25 KB

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