plac-micro-common 1.3.106 → 1.3.108

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9,934 +9,603 @@ exports.SIO_FORM_EN_TEMPLATE = `
9
9
  <meta charset="UTF-8" />
10
10
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
11
11
  <title>SIO Insurance Application Form</title>
12
- <link rel="preconnect" href="https://fonts.googleapis.com">
13
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
14
- <link href="https://fonts.googleapis.com/css2?family=Hanuman:wght@100..900&family=Moul&display=swap" rel="stylesheet">
15
- <style>
16
- body {
17
- font-family: Arial, Helvetica, system-ui, sans-serif;
18
- font-size: 12px;
19
- line-height: 1.4;
20
- margin: 1rem;
21
- /* Reduced from 2rem */
22
- background: #fff;
23
- color: #000;
24
- }
25
-
26
- .font-kh {
27
- font-family: 'Hanuman', sans-serif !important;
28
- }
29
-
30
- .space {
31
- width: 8px;
32
- }
33
-
34
- /* margin */
35
- .ml-4 {
36
- margin-left: 1rem;
37
- }
38
-
39
- .ml-8 {
40
- margin-left: 2rem;
41
- }
42
-
43
- .mr-4 {
44
- margin-right: 1rem;
45
- }
46
-
47
- .mr-8 {
48
- margin-right: 2rem;
49
- }
50
-
51
- .mt-4 {
52
- margin-top: 1rem;
53
- }
54
-
55
- .mt-8 {
56
- margin-top: 2rem;
57
- }
58
-
59
- .mb-4 {
60
- margin-bottom: 1rem;
61
- }
62
-
63
- .mb-8 {
64
- margin-bottom: 2rem;
65
- }
66
-
67
- /* alignment */
68
- .align-left {
69
- justify-content: flex-start !important;
70
- text-align: left;
71
- padding-left: 16px;
72
- }
73
-
74
- .align-right {
75
- justify-content: flex-end !important;
76
- text-align: right;
77
- padding-right: 16px;
78
- }
79
-
80
- .align-center {
81
- justify-content: center !important;
82
- text-align: center;
83
- }
84
-
85
- .space-height {
86
- height: 60px;
87
- align-items: center;
88
- }
89
-
90
- .signature-space {
91
- height: 100px;
92
- margin-top: 10px;
93
- }
94
-
95
- /* === Page header === */
96
- .page-header {
97
- margin-bottom: 0.5rem;
98
- page-break-inside: avoid;
99
- }
100
-
101
- .header-container {
102
- display: flex;
103
- flex-direction: column;
104
- align-items: center;
105
- }
106
-
107
- .title-logo {
108
- width: 125px;
109
- height: auto;
110
- }
111
-
112
- .title {
113
- font-weight: 700;
114
- font-size: 14px;
115
- line-height: 1;
116
- }
117
-
118
- .title-container {
119
- text-align: center;
120
- font-weight: 700;
121
- font-size: 14px;
122
- line-height: 1.4;
123
- margin: 0;
124
- }
125
-
126
- /* === Card Header === */
127
- .card-header {
128
- background-color: #0d6efd;
129
- color: white;
130
- text-align: center;
131
- padding: 0.1rem 0;
132
- border-radius: 6px 6px 0 0;
133
- font-size: 13px;
134
- font-weight: bold;
135
- margin-bottom: 0.5rem;
136
- /* Reduced */
137
- -webkit-print-color-adjust: exact;
138
- print-color-adjust: exact;
139
- }
140
-
141
- /* === Form Text === */
142
- .form-container {
143
- display: flex;
144
- flex-wrap: wrap;
145
- margin: 0;
146
- padding: 0;
147
- gap: 0.5rem;
148
- }
149
-
150
- .form-item {
151
- display: flex;
152
- align-items: flex-start;
153
- flex-wrap: wrap;
154
- width: 100%;
155
- }
156
-
157
- .label,
158
- .question-label {
159
- word-wrap: break-word;
160
- white-space: normal;
161
- font-weight: 500;
162
- color: #444;
163
- }
164
-
165
- /* Underline for blanks */
166
- .underline {
167
- border-bottom: 1px dashed #000;
168
- flex: 1;
169
- min-width: 60px;
170
- min-height: 1em;
171
- display: inline-flex;
172
- align-items: center;
173
- justify-content: center;
174
- text-align: center;
175
- word-break: break-word;
176
- white-space: normal;
177
- -webkit-box-decoration-break: clone;
178
- box-decoration-break: clone;
179
- align-self: flex-end;
180
- color: #000;
181
- }
182
-
183
- /* size variants */
184
- .underline.xs {
185
- flex: none;
186
- width: 30px;
187
- min-width: unset;
188
- }
189
-
190
- .underline.sm {
191
- flex: none;
192
- width: 80px;
193
- min-width: unset;
194
- }
195
-
196
- .underline.md {
197
- flex: none;
198
- width: 180px;
199
- min-width: unset;
200
- }
201
-
202
- .underline.lg {
203
- flex: 2;
204
- }
205
-
206
- .underline.with-unit {
207
- flex: 1;
208
- min-width: 0;
209
- display: block;
210
- word-break: break-word;
211
- white-space: normal;
212
- border-bottom: none;
213
- line-height: 1.6em;
214
- text-align: left;
215
- padding-left: 4px;
216
- }
217
-
218
- .with-unit .value {
219
- display: inline;
220
- text-decoration: underline;
221
- text-decoration-style: dashed;
222
- text-decoration-color: #000;
223
- text-underline-offset: 3px;
224
- -webkit-box-decoration-break: clone;
225
- box-decoration-break: clone;
226
- vertical-align: baseline;
227
- }
228
-
229
- .unit {
230
- display: inline;
231
- white-space: nowrap;
232
- margin-left: 4px;
233
- text-decoration: none;
234
- }
235
-
236
- /* Checkbox labels */
237
- .checkbox-label {
238
- display: inline-flex;
239
- align-items: center;
240
- gap: 0.5rem;
241
- position: relative;
242
- cursor: pointer;
243
- padding-left: 0.2rem;
244
- user-select: none;
245
- margin-right: 0.5rem;
246
- }
247
-
248
- .checkbox-label::before {
249
- content: "";
250
- display: inline-flex;
251
- align-items: center;
252
- justify-content: center;
253
- width: 20px;
254
- height: 20px;
255
- border: 2px solid #555;
256
- border-radius: 3px;
257
- background-color: #fff;
258
- box-sizing: border-box;
259
- flex-shrink: 0;
260
- }
261
-
262
- .checkbox-label.checked::after {
263
- content: "";
264
- position: absolute;
265
- top: 45%;
266
- left: calc(0.2rem + 7px);
267
- width: 6px;
268
- height: 12px;
269
- border: solid #0d6efd;
270
- border-width: 0 2px 2px 0;
271
- box-sizing: border-box;
272
- transform: translateY(-50%) rotate(45deg);
273
- pointer-events: none;
274
- }
275
-
276
- .page-break {
277
- page-break-before: always;
278
- }
279
-
280
- /* === Table data === */
281
- .table-container {
282
- margin: auto;
283
- margin-bottom: 4px;
284
- }
285
-
286
- table {
287
- width: 100%;
288
- border-collapse: collapse;
289
- }
290
-
291
- th,
292
- td {
293
- border: 1px solid #ccc;
294
- padding: 0;
295
- }
296
-
297
- .cell {
298
- min-height: 10px;
299
- padding: 4px 8px;
300
- display: flex;
301
- justify-content: center;
302
- text-align: center;
303
- }
304
-
305
- th {
306
- font-weight: 600;
307
- }
308
-
309
- /* === Print-specific: Footer with Page Numbers on the RIGHT === */
310
- @media print {
311
- body {
312
- margin: 0;
313
- padding-top: 10mm;
314
- }
315
-
316
- /* Make room for footer on the right side */
317
- @page {
318
- size: A4 portrait;
319
- margin: 15mm 15mm 20mm 10mm;
320
- /* increased right margin slightly for better spacing */
321
-
322
- /* @bottom-right {
323
- content: "Page " counter(page) " of " counter(pages);
324
- font-size: 11px;
325
- color: #555;
326
- } */
327
- }
328
-
329
- /* Increment page counter */
330
- body {
331
- counter-increment: page;
332
- }
333
-
334
- .page-header,
335
- .title-container,
336
- table {
337
- page-break-inside: avoid;
338
- }
339
-
340
- .card-header {
341
- -webkit-print-color-adjust: exact;
342
- print-color-adjust: exact;
343
- }
344
- }
345
- </style>
12
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
13
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
14
+ <link
15
+ href="https://fonts.googleapis.com/css2?family=Hanuman:wght@100..900&family=Roboto:wght@100..900&family=Moul&display=swap"
16
+ rel="stylesheet" />
17
+ <% const currentLang=typeof lang !=='undefined' ? lang : 'en' ; %>
18
+ <% const bodyFont=currentLang==='kh' ? 'Hanuman' : 'Roboto' ; %>
19
+
20
+ <style>
21
+ @page {
22
+ size: A4 portrait;
23
+ margin-top: 10mm;
24
+ }
25
+
26
+ * {
27
+ box-sizing: border-box;
28
+ }
29
+
30
+ body {
31
+ font-family: '<%= bodyFont %>', Arial, Helvetica, system-ui, sans-serif;
32
+ font-size: 12px;
33
+ line-height: 1.45;
34
+ color: #000;
35
+ background: #fff;
36
+ max-width: 210mm;
37
+ margin: 0 auto;
38
+ padding: 0mm 12mm 14mm;
39
+ }
40
+
41
+ @media print {
42
+ body {
43
+ margin: 0;
44
+ }
45
+ }
46
+
47
+ .header {
48
+ margin-bottom: 10px;
49
+ }
50
+
51
+ .title-logo {
52
+ width: 150px;
53
+ }
54
+
55
+ .section-title {
56
+ background: #002060;
57
+ color: #fff;
58
+ text-align: center;
59
+ padding: 3px 0;
60
+ font-size: 13px;
61
+ font-weight: 700;
62
+ margin: 10px 0 8px;
63
+ print-color-adjust: exact;
64
+ -webkit-print-color-adjust: exact;
65
+ }
66
+
67
+ .row {
68
+ display: flex;
69
+ align-items: center;
70
+ flex-wrap: nowrap;
71
+ white-space: nowrap;
72
+ margin-bottom: 4px;
73
+ }
74
+
75
+ .row.top {
76
+ align-items: flex-start;
77
+ }
78
+
79
+ .label {
80
+ margin-right: 8px;
81
+ }
82
+
83
+ .field {
84
+ flex: 1 1 60px;
85
+ min-width: 60px;
86
+ min-height: 1.4em;
87
+ border-bottom: 1px solid #000;
88
+ display: inline-flex;
89
+ align-items: center;
90
+ justify-content: center;
91
+ text-align: center;
92
+ }
93
+
94
+ .field.left {
95
+ justify-content: flex-start;
96
+ text-align: left;
97
+ padding-left: 12px;
98
+ }
99
+
100
+ .field.w-30 {
101
+ flex: none;
102
+ width: 30px;
103
+ }
104
+
105
+ .field.w-80 {
106
+ flex: none;
107
+ width: 80px;
108
+ }
109
+
110
+ .underline-text {
111
+ flex: 1 1 auto;
112
+ min-width: 0;
113
+ padding-left: 4px;
114
+ text-align: left;
115
+ }
116
+
117
+ .underline-text span {
118
+ border-bottom: 1px solid #000;
119
+ }
120
+
121
+ .checkbox {
122
+ position: relative;
123
+ display: inline-flex;
124
+ align-items: center;
125
+ gap: 6px;
126
+ cursor: pointer;
127
+ user-select: none;
128
+ margin-right: 10px;
129
+ line-height: 1;
130
+ flex-shrink: 0;
131
+ }
132
+
133
+ .checkbox::before {
134
+ content: "";
135
+ display: inline-block;
136
+ width: 14px;
137
+ height: 14px;
138
+ border: 1px solid black;
139
+ border-radius: 3px;
140
+ background: #fff;
141
+ flex-shrink: 0;
142
+ box-sizing: border-box;
143
+ transform: translateY(-2px);
144
+ }
145
+
146
+ .checkbox.checked::after {
147
+ content: "";
148
+ position: absolute;
149
+ left: 4px;
150
+ top: 8px;
151
+ width: 4px;
152
+ height: 8px;
153
+ border: solid #002060;
154
+ border-width: 0 2px 2px 0;
155
+ transform: translateY(-90%) rotate(45deg);
156
+ pointer-events: none;
157
+ }
158
+
159
+ table {
160
+ width: 100%;
161
+ border-collapse: collapse;
162
+ margin-bottom: 8px;
163
+ page-break-inside: avoid;
164
+ }
165
+
166
+ th,
167
+ td {
168
+ border: 1px solid #ccc;
169
+ padding: 5px 8px;
170
+ text-align: center;
171
+ }
172
+
173
+ th {
174
+ font-weight: 600;
175
+ }
176
+
177
+ td.left {
178
+ text-align: left;
179
+ padding-left: 12px;
180
+ }
181
+
182
+ .sig-box {
183
+ height: 100px;
184
+ }
185
+
186
+ .page-break {
187
+ break-before: page;
188
+ }
189
+ </style>
346
190
  </head>
347
191
 
348
192
  <body>
349
- <div class="page-header mb-8">
193
+ <div class="header">
350
194
  <img src="data:image/png;base64,<%= logo_base64 %>" alt="Logo" class="title-logo" />
351
- <div class="title-container">
352
- <h1 class="title">LIFE ASSURANCE APPLICATION FORM</h1>
353
- <h1 class="title">
354
- SIMPLIFY FORM FOR CHOKCHEY FINANCE PLC (SIO)
355
- </h1>
195
+ <div style="text-align: center;">
196
+ <h2 style="font-weight:700; font-size: 18px; margin: 0;">LIFE ASSURANCE APPLICATION FORM</h2>
197
+ <h3 style="font-weight:700; font-size: 15px; margin: 2px 0 0;">SIMPLIFY FORM FOR CHOKCHEY FINANCE PLC (SIO)</h3>
356
198
  </div>
357
- </div>
358
-
359
- <div class="form-container">
360
- <div class="form-item">
199
+ </div>
200
+
201
+ <div class="row">
361
202
  <span class="label">Branch Name and Code:</span>
362
- <span class="underline">
203
+ <span class="field">
363
204
  <%= branch_staff_app_info.branch_name %> / <%= branch_staff_app_info.branch_code %>
364
205
  </span>
365
206
  <span class="label">Advisor's Name and Code:</span>
366
- <span class="underline">
207
+ <span class="field">
367
208
  <%= branch_staff_app_info.advisor_name %> / <%= branch_staff_app_info.advisor_code %>
368
209
  </span>
369
210
  </div>
370
- <div class="form-item">
211
+ <div class="row">
371
212
  <span class="label">Bank staff's name and code:</span>
372
- <span class="underline">
213
+ <span class="field">
373
214
  <%= branch_staff_app_info.bank_staff_name %> / <%= branch_staff_app_info.bank_staff_code %>
374
215
  </span>
375
216
  <span class="label">Application Number:</span>
376
- <span class="underline">
217
+ <span class="field">
377
218
  <%= branch_staff_app_info.application_no %>
378
219
  </span>
379
220
  </div>
380
- </div>
381
-
382
- <!-- Section 1 -->
383
- <div class="card-header mt-4">INFORMATION ABOUT THE APPLICANT</div>
384
-
385
- <div class="form-container">
386
- <div class="form-item">
221
+
222
+ <div class="section-title">INFORMATION ABOUT THE APPLICANT</div>
223
+
224
+ <div class="row">
387
225
  <span class="label">Full Name as shown in identity documents: in KH Language:</span>
388
- <span class="underline font-kh">
226
+ <span class="field" style="font-family: 'Hanuman', sans-serif;">
389
227
  <%= applicant_info.full_name_kh %>
390
228
  </span>
391
229
  <span class="label">EN Language:</span>
392
- <span class="underline">
230
+ <span class="field">
393
231
  <%= applicant_info.full_name %>
394
232
  </span>
395
233
  </div>
396
-
397
- <div class="form-item">
234
+
235
+ <div class="row">
398
236
  <span class="label">Gender:</span>
399
- <label class="checkbox-label <%= applicant_info.gender === 'M' ? 'checked' : '' %>">M</label>
400
- <label class="checkbox-label <%= applicant_info.gender === 'F' ? 'checked' : '' %>">F</label>
401
-
402
- <div class="ml-8"></div>
403
-
404
- <div>
405
- <span class="label">Marital Status:</span>
406
- <label class="checkbox-label <%= applicant_info.marital_status === 'single' ? 'checked' : '' %>">
407
- Single
408
- </label>
409
- <label class="checkbox-label <%= applicant_info.marital_status === 'married' ? 'checked' : '' %>">
410
- Married
411
- </label>
412
- <label class="checkbox-label <%= applicant_info.marital_status === 'divorced' ? 'checked' : '' %>">
413
- Divorced
414
- </label>
415
- <label class="checkbox-label <%= applicant_info.marital_status === 'widowed' ? 'checked' : '' %>">
416
- Widowed
417
- </label>
418
- </div>
237
+ <label class="checkbox <%= applicant_info.gender === 'M' ? 'checked' : '' %>">M</label>
238
+ <label class="checkbox <%= applicant_info.gender === 'F' ? 'checked' : '' %>">F</label>
239
+
240
+ <span class="label" style="margin-left:16px;">Marital Status:</span>
241
+ <label class="checkbox <%= applicant_info.marital_status === 'single' ? 'checked' : '' %>">Single</label>
242
+ <label class="checkbox <%= applicant_info.marital_status === 'married' ? 'checked' : '' %>">Married</label>
243
+ <label class="checkbox <%= applicant_info.marital_status === 'divorced' ? 'checked' : '' %>">Divorced</label>
244
+ <label class="checkbox <%= applicant_info.marital_status === 'widowed' ? 'checked' : '' %>">Widowed</label>
419
245
  </div>
420
-
421
- <div class="form-item">
246
+
247
+ <div class="row">
422
248
  <span class="label">Job Title and Nature of Work:</span>
423
- <span class="underline align-left">
249
+ <span class="field left">
424
250
  <%= applicant_info.occupation %>
425
251
  </span>
426
252
  </div>
427
-
428
- <div class="form-item">
253
+
254
+ <div class="row">
429
255
  <span class="label">Identity documents:</span>
430
- <label class="checkbox-label <%= applicant_info.identity_type === 'nid' ? 'checked' : '' %>">
431
- National ID Card
432
- </label>
433
- <label class="checkbox-label <%= applicant_info.identity_type === 'passport' ? 'checked' : '' %>">
434
- Passport
435
- </label>
436
- <label class="checkbox-label <%= applicant_info.identity_type === 'birth' ? 'checked' : '' %>">
437
- Birth Certificate
438
- </label>
439
- <label class="checkbox-label <%= applicant_info.identity_type === 'other' ? 'checked' : '' %>">
440
- Others :
441
- </label>
442
-
443
-
444
- <!-- other field stays separate since it has extra input -->
445
- <label class="underline">
256
+ <label class="checkbox <%= applicant_info.identity_type === 'nid' ? 'checked' : '' %>">National ID Card</label>
257
+ <label class="checkbox <%= applicant_info.identity_type === 'passport' ? 'checked' : '' %>">Passport</label>
258
+ <label class="checkbox <%= applicant_info.identity_type === 'birth' ? 'checked' : '' %>">Birth Certificate</label>
259
+ <label class="checkbox <%= applicant_info.identity_type === 'other' ? 'checked' : '' %>">Others :</label>
260
+ <span class="field">
446
261
  <%= applicant_info.identity_other_description %>
447
- </label>
262
+ </span>
448
263
  </div>
449
-
450
- <div class="form-item">
264
+
265
+ <div class="row">
451
266
  <span class="label">Identity #</span>
452
- <span class="underline">
267
+ <span class="field">
453
268
  <%= applicant_info.identity_no %>
454
269
  </span>
455
270
  <span class="label">DOB:</span>
456
- <span class="underline">
271
+ <span class="field">
457
272
  <%= applicant_info.date_of_birth %>
458
273
  </span>
459
274
  <span class="label">Age:</span>
460
- <span class="underline xs">
275
+ <span class="field w-30">
461
276
  <%= applicant_info.age %>
462
277
  </span>
463
278
  <span class="label">Nationality:</span>
464
- <span class="underline">
279
+ <span class="field">
465
280
  <%= applicant_info.nationality %>
466
281
  </span>
467
282
  <span class="label">Phone #:</span>
468
- <span class="underline">
283
+ <span class="field">
469
284
  <%= applicant_info.phone_number %>
470
285
  </span>
471
286
  </div>
472
-
473
- <div class="form-item">
287
+
288
+ <div class="row">
474
289
  <span class="label">Current Address:</span>
475
- <span class="underline align-left">
290
+ <span class="field left">
476
291
  <%= applicant_info.current_address %>
477
292
  </span>
478
293
  </div>
479
-
480
-
481
- </div>
482
-
483
-
484
-
485
- <div class="form-container">
486
- <div class="form-item mt-4">
487
- <span class="label">Declaration on FATCA implementation:</span>
294
+
295
+ <div class="row" style="margin-top: 10px;">
296
+ <span class="label" style="font-weight:700;">Declaration on FATCA implementation:</span>
488
297
  </div>
489
- <div class="form-item">
490
- <span class="label">
491
- Are you a USA citizen / USA resident for tax purpose or holding Green Card?
492
- </span>
298
+ <div class=" row">
299
+ <span class="label">Are you a USA citizen / USA resident for tax purpose or holding Green Card?</span>
493
300
  </div>
494
- <div class="form-item">
495
- <label class="checkbox-label <%= fatca_info.is_fatca === false ? 'checked' : '' %>">No</label>
496
- <label class="checkbox-label <%= fatca_info.is_fatca === true ? 'checked' : '' %>">Yes</label>
301
+ <div class="row">
302
+ <label class="checkbox <%= fatca_info.is_fatca === false ? 'checked' : '' %>">No</label>
303
+ <label class="checkbox <%= fatca_info.is_fatca === true ? 'checked' : '' %>">Yes</label>
497
304
  <span class="label">US TIN #:</span>
498
- <span class="underline">
305
+ <span class="field">
499
306
  <%= fatca_info.us_tin_no %>
500
307
  </span>
501
308
  <span class="label">FATCA Exemption Code (If have):</span>
502
- <span class="underline">
309
+ <span class="field">
503
310
  <%= fatca_info.fatca_exempt_code %>
504
311
  </span>
505
312
  </div>
506
- <div class="form-item">
507
- <span class="label">
508
- If any of the certifications I have provided are incorrect, I will submit a new document within 30 days, and I
509
- certify that I am not subject to U.S. withholding tax.
313
+ <div class="row">
314
+ <span class="label" style="white-space: normal;">
315
+ If any of the certifications I have provided are incorrect, I will submit a new document within 30 days,
316
+ and I certify that I am not subject to U.S. withholding tax.
510
317
  </span>
511
318
  </div>
512
- </div>
513
-
514
-
515
-
516
- <!-- Section 2 -->
517
- <div class="card-header mt-4">INFORMATION ABOUT THE PRODUCT
518
- </div>
519
- <div class="table-container">
319
+
320
+ <!-- Section 2 -->
321
+ <div class="section-title">INFORMATION ABOUT THE PRODUCT</div>
322
+
520
323
  <table>
521
324
  <thead>
522
325
  <tr>
523
- <th>
524
- <div class="cell">NAME OF PRODUCT AND TERMS</div>
525
- </th>
526
- <th>
527
- <div class="cell">SUM ASSURED (USD)</div>
528
- </th>
529
- <th>
530
- <div class="cell">MODE OF PAYMENT</div>
531
- </th>
532
- <th>
533
- <div class="cell">PREMIUM (USD)</div>
534
- </th>
326
+ <th>NAME OF PRODUCT AND TERMS</th>
327
+ <th>SUM ASSURED (USD)</th>
328
+ <th>MODE OF PAYMENT</th>
329
+ <th>PREMIUM (USD)</th>
535
330
  </tr>
536
331
  </thead>
537
332
  <tbody>
538
333
  <% product_payment_info?.products?.forEach(function(product) { %>
539
334
  <tr>
540
335
  <td>
541
- <div class="cell">
542
- <%= product.name %>
543
- <%= product.term %>
544
- </div>
336
+ <%= product.name %>
337
+ <%= product.term %>
545
338
  </td>
546
339
  <td>
547
- <div class="cell">
548
- <%= product.sum_assured %>
549
- </div>
340
+ <%= product.sum_assured %>
550
341
  </td>
551
342
  <td>
552
- <div class="cell">
553
- <%= product.payment_mode %>
554
- </div>
343
+ <%= product.payment_mode %>
555
344
  </td>
556
345
  <td>
557
- <div class="cell">
558
- <%= product.premium %>
559
- </div>
346
+ <%= product.premium %>
560
347
  </td>
561
348
  </tr>
562
349
  <% }) %>
563
350
  </tbody>
564
351
  </table>
565
- </div>
566
- <div class="form-container">
567
- <div class="form-item">
568
- <span class="question-label">Method of payment:</span>
569
- <label class="checkbox-label <%= product_payment_info.payment_method === 'transfer_to_plac' ? 'checked' : '' %>">
352
+
353
+ <div class="row">
354
+ <span class="label">Method of payment:</span>
355
+ <label class="checkbox <%= product_payment_info.payment_method === 'transfer_to_plac' ? 'checked' : '' %>">
570
356
  Transfer to Phillip Life Account
571
357
  </label>
572
- <label class="checkbox-label <%= product_payment_info.payment_method === 'other' ? 'checked' : '' %>">
358
+ <label class="checkbox <%= product_payment_info.payment_method === 'other' ? 'checked' : '' %>">
573
359
  Through Phillip Life's partner
574
360
  </label>
575
361
  </div>
576
- </div>
577
-
578
- <% if (loan_info) { %>
579
- <div class="card-header mt-4">LOAN INFORMATION</div>
580
- <div class="table-container">
362
+
363
+ <% if (loan_info) { %>
364
+ <div class="section-title">LOAN INFORMATION</div>
581
365
  <table>
582
366
  <thead>
583
367
  <tr>
584
- <th>
585
- <div class="cell">LOAN AMOUNT</div>
586
- </th>
587
- <th>
588
- <div class="cell">LOAN TERM</div>
589
- </th>
590
- <th>
591
- <div class="cell">LOAN TYPE</div>
592
- </th>
368
+ <th>LOAN AMOUNT</th>
369
+ <th>LOAN TERM</th>
370
+ <th>LOAN TYPE</th>
593
371
  </tr>
594
372
  </thead>
595
373
  <tbody>
596
374
  <tr>
597
375
  <td>
598
- <div class="cell">
599
- <%= loan_info.loan_amount %>
600
- </div>
376
+ <%= loan_info.loan_amount %>
601
377
  </td>
602
378
  <td>
603
- <div class="cell">
604
- <%= loan_info.loan_duration %>
605
- </div>
379
+ <%= loan_info.loan_duration %>
606
380
  </td>
607
381
  <td>
608
- <div class="cell">
609
- <%= loan_info.loan_type %>
610
- </div>
382
+ <%= loan_info.loan_type %>
611
383
  </td>
612
384
  </tr>
613
385
  </tbody>
614
386
  </table>
615
- </div>
616
-
617
- <% } %>
618
-
619
- <!-- Section 3 -->
620
- <div class="card-header mt-4">INFORMATION ABOUT THE BENEFICIARY(IES)</div>
621
- <div class="table-container">
622
- <table>
623
- <thead>
624
- <tr>
625
- <th>
626
- <div class="cell">FULL NAME OF BENEFICIARY</div>
627
- </th>
628
- <th>
629
- <div class="cell">AGE</div>
630
- </th>
631
- <th>
632
- <div class="cell">RELATIONSHIP</div>
633
- </th>
634
- <th>
635
- <div class="cell">IDENTITY NUMBER</div>
636
- </th>
637
- <th>
638
- <div class="cell">SHARE</div>
639
- </th>
640
- </tr>
641
- </thead>
642
- <tbody>
643
- <% beneficiary_info?.forEach(function(beneficiary) { %>
644
- <tr>
645
- <td>
646
- <div class="align-left">
647
- <%= beneficiary.full_name %>
648
- </div>
649
- </td>
650
- <td>
651
- <div class="cell">
652
- <%= beneficiary.age %>
653
- </div>
654
- </td>
655
- <td>
656
- <div class="cell">
657
- <%= beneficiary.relationship %>
658
- </div>
659
- </td>
660
- <td>
661
- <div class="cell">
662
- <%= beneficiary.id_number %>
663
- </div>
664
- </td>
665
- <td>
666
- <div class="cell">
667
- <%= beneficiary.percentage %>
668
- </div>
669
- </td>
670
- </tr>
671
- <% }) %>
387
+ <% } %>
388
+
389
+ <!-- Section 3 -->
390
+ <div class="section-title">INFORMATION ABOUT THE BENEFICIARY(IES)</div>
391
+ <table>
392
+ <thead>
672
393
  <tr>
673
- <td colspan="5">
674
- <div class="cell align-left"
675
- style="text-align: start !important; padding-top: 5px; padding-bottom: 5px;">
676
- The company will pay benefits to the primary beneficiary first before paying any remaining benefits to
677
- the secondary beneficiary designated by the applicant or to the heirs of the insured if no beneficiary
678
- is appointed.
679
- </div>
680
- </td>
394
+ <th>FULL NAME OF BENEFICIARY</th>
395
+ <th>AGE</th>
396
+ <th>RELATIONSHIP</th>
397
+ <th>IDENTITY NUMBER</th>
398
+ <th>SHARE</th>
681
399
  </tr>
682
- </tbody>
683
- </table>
684
- </div>
685
-
686
- <!-- Section 4 -->
687
- <div class="page-break"></div>
688
- <div class="card-header">
689
- HEALTH RELATED QUESTIONS
690
- </div>
691
-
692
- <!-- Question 1 -->
693
- <div class="form-container">
694
- <!-- Row 1: Height + Weight -->
695
- <div class="form-item">
696
- <span class="label">1) Height:</span>
697
- <span class="underline sm">
698
- <%= health_info.height %>
699
- </span>
700
- <span class="label">cm</span>
701
- <div class="space"></div>
702
- <span class="label">Weight:</span>
703
- <span class="underline sm">
704
- <%= health_info.weight %>
705
- </span>
706
- <span class="label">Kg</span>
707
- </div>
708
-
709
- <!-- Row 2: Smoking question + checkboxes + how many -->
710
- <div class="form-item mb-4" style="display: flex; align-items: center; flex-wrap: nowrap; width: 100%;">
711
- <span class="question-label">A) Do you smoke?</span>
712
- <label class="checkbox-label <%= health_info.is_smoke === false ? 'checked' : '' %>">
713
- No
714
- </label>
715
- <label class="checkbox-label <%= health_info.is_smoke === true ? 'checked' : '' %>">
716
- Yes
717
- </label>
718
- <div class="space"></div>
719
- <span class="label">How many</span>
720
- <% if (health_info.smoke_detail) { %>
721
- <span class="underline with-unit">
722
- <span class="value">
723
- <%= health_info.smoke_detail %>
724
- </span>
725
- <span class="unit">per day</span>
726
- </span>
727
- <% } else { %>
728
- <span class="underline with-unit">
729
- <span class="value">
730
- <%= health_info.smoke_detail %>
731
- </span>
732
- <span class="underline"></span>
733
- <span class="unit">per day</span>
734
- </span>
735
- <% } %>
400
+ </thead>
401
+ <tbody>
402
+ <% beneficiary_info?.forEach(function(beneficiary) { %>
403
+ <tr>
404
+ <td class="left">
405
+ <%= beneficiary.full_name %>
406
+ </td>
407
+ <td>
408
+ <%= beneficiary.age %>
409
+ </td>
410
+ <td>
411
+ <%= beneficiary.relationship %>
412
+ </td>
413
+ <td>
414
+ <%= beneficiary.id_number %>
415
+ </td>
416
+ <td>
417
+ <%= beneficiary.percentage %>
418
+ </td>
419
+ </tr>
420
+ <% }) %>
421
+ <tr>
422
+ <td colspan="5" class="left">
423
+ The company will pay benefits to the primary beneficiary first before paying any remaining benefits
424
+ to the secondary beneficiary designated by the applicant or to the heirs of the insured if no
425
+ beneficiary is appointed.
426
+ </td>
427
+ </tr>
428
+ </tbody>
429
+ </table>
430
+
431
+ <!-- Section 4 -->
432
+ <!-- <div class="page-break"></div> -->
433
+ <div class="section-title">HEALTH RELATED QUESTIONS</div>
434
+
435
+ <!-- Question 1 -->
436
+ <div class="row">
437
+ <span class="label">1) Height:</span>
438
+ <span class="field w-80">
439
+ <%= health_info.height %>
440
+ </span>
441
+ <span class="label">cm</span>
442
+ <span class="label" style="margin-left:8px;">Weight:</span>
443
+ <span class="field w-80">
444
+ <%= health_info.weight %>
445
+ </span>
446
+ <span class="label">Kg</span>
736
447
  </div>
448
+
449
+ <div class="row" style="margin-bottom: 10px;">
450
+ <span class="label">A) Do you smoke?</span>
451
+ <label class="checkbox <%= health_info.is_smoke === false ? 'checked' : '' %>">No</label>
452
+ <label class="checkbox <%= health_info.is_smoke === true ? 'checked' : '' %>">Yes</label>
453
+ <span class="label" style="margin-left:8px;">How many</span>
454
+ <% if (health_info.smoke_detail) { %>
455
+ <span class="underline-text"><span>
456
+ <%= health_info.smoke_detail %>
457
+ </span> per day</span>
458
+ <% } else { %>
459
+ <span class="field"></span>
460
+ <% } %>
737
461
  </div>
738
-
739
- <!-- Question 2 -->
740
- <div class="form-container">
741
- <div class="form-item">
742
- <span class="question-label">2) Do you drink alcohol?</span>
743
- <label class="checkbox-label <%= health_info.is_drink_alcohol === false ? 'checked' : '' %>">
744
- No
745
- </label>
746
- <label class="checkbox-label <%= health_info.is_drink_alcohol === true ? 'checked' : '' %>">
747
- Yes
748
- </label>
749
- </div>
750
- <div class="form-item mb-4">
751
- <span class="label">How Often? Please specify amount of drink per week</span>
752
- <% if (health_info.drink_alcohol_detail) { %>
753
- <span class="underline with-unit">
754
- <span class="value">
755
- <%= health_info.drink_alcohol_detail %>
756
- </span>
757
- </span>
758
- <% } else { %>
759
- <span class="underline"></span>
760
- <% } %>
761
- </div>
762
- </div>
763
-
764
- <!-- Question 3 -->
765
- <div class="form-container">
766
- <span class="question-label">
767
- 3) In the past 2 years, have you ever been hospitalized, undergone any surgical operation, or had abnormal results
768
- such as: Blood test, Urine test, X-ray, ECG, Ultrasound, Scan, Biopsy or any other test results.
769
- </span>
770
- <div class="form-item">
771
- <label class="checkbox-label <%= health_info.is_hospitalized === false ? 'checked' : '' %>">
772
- No
773
- </label>
774
- <label class="checkbox-label <%= health_info.is_hospitalized === true ? 'checked' : '' %>">
775
- Yes
776
- </label>
777
- </div>
778
-
779
- <div class="form-item mb-4">
780
- <span class="label">provided more details:</span>
781
- <% if (health_info.hospitalized_detail) { %>
782
- <span class="underline with-unit">
783
- <span class="value">
784
- <%= health_info.hospitalized_detail %>
462
+
463
+ <!-- Question 2 -->
464
+ <div class="row">
465
+ <span class="label">2) Do you drink alcohol?</span>
466
+ <label class="checkbox <%= health_info.is_drink_alcohol === false ? 'checked' : '' %>">No</label>
467
+ <label class="checkbox <%= health_info.is_drink_alcohol === true ? 'checked' : '' %>">Yes</label>
468
+ </div>
469
+ <div class="row" style="margin-bottom: 10px;">
470
+ <span class="label">How Often? Please specify amount of drink per week</span>
471
+ <% if (health_info.drink_alcohol_detail) { %>
472
+ <span class="underline-text"><span>
473
+ <%= health_info.drink_alcohol_detail %>
474
+ </span></span>
475
+ <% } else { %>
476
+ <span class="field"></span>
477
+ <% } %>
478
+ </div>
479
+
480
+ <!-- Question 3 -->
481
+ <div class="row top">
482
+ <span class="label" style="white-space: normal;">
483
+ 3) In the past 2 years, have you ever been hospitalized, undergone any surgical operation, or had
484
+ abnormal results such as: Blood test, Urine test, X-ray, ECG, Ultrasound, Scan, Biopsy or any other
485
+ test results.
785
486
  </span>
786
- </span>
787
- <% } else { %>
788
- <span class="underline"></span>
789
- <% } %>
790
- </div>
791
- </div>
792
-
793
- <!-- Question 4 -->
794
- <div class="form-container">
795
- <span class="question-label">
796
- 4) Have you ever been diagnosed with, consulted a medical practitioner or been given treatment for any of the
797
- following conditions: Hypertension, Diabetes, Heart diseases, Chest pain, Lung diseases, Liver disease, Renal
798
- diseases, Cancer, Stroke, AIDS, Mental illness, Disability or Deformity, Drug or Alcohol Abuse or Any other
799
- diseases are not mentioned above.
800
- </span>
801
- <div class="form-item">
802
- <label class="checkbox-label <%= health_info.is_diagnosed === false ? 'checked' : '' %>">
803
- No
804
- </label>
805
- <label class="checkbox-label <%= health_info.is_diagnosed === true ? 'checked' : '' %>">
806
- Yes
807
- </label>
808
-
809
- </div>
810
- <div class="form-item mb-4">
811
- <span class="label">if yes, please provided more details:</span>
812
- <% if (health_info.diagnosed_detail) { %>
813
- <span class="underline with-unit">
814
- <span class="value">
815
- <%= health_info.diagnosed_detail %>
487
+ </div>
488
+ <div class="row">
489
+ <label class="checkbox <%= health_info.is_hospitalized === false ? 'checked' : '' %>">No</label>
490
+ <label class="checkbox <%= health_info.is_hospitalized === true ? 'checked' : '' %>">Yes</label>
491
+ <span class="label">provided more details:</span>
492
+ <% if (health_info.hospitalized_detail) { %>
493
+ <span class="underline-text"><span>
494
+ <%= health_info.hospitalized_detail %>
495
+ </span></span>
496
+ <% } else { %>
497
+ <span class="field"></span>
498
+ <% } %>
499
+ </div>
500
+
501
+ <div class="page-break"></div>
502
+
503
+
504
+ <!-- Question 4 -->
505
+ <div class="row top">
506
+ <span class="label" style="white-space: normal;">
507
+ 4) Have you ever been diagnosed with, consulted a medical practitioner or been given treatment for any
508
+ of the following conditions: Hypertension, Diabetes, Heart diseases, Chest pain, Lung diseases, Liver
509
+ disease, Renal diseases, Cancer, Stroke, AIDS, Mental illness, Disability or Deformity, Drug or Alcohol
510
+ Abuse or Any other diseases are not mentioned above.
816
511
  </span>
817
- </span>
818
- <% } else { %>
819
- <span class="underline"></span>
820
- <% } %>
821
- </div>
822
- </div>
823
-
824
- <!-- Section 5 -->
825
- <div class="card-header mt-4">DECLARATION BY THE APPLICANT</div>
826
- <div class="form-container" style="margin: 15px 0px 15px 0px;">
827
- <div class="form-item">
828
- <ol style="padding-left: 1.2rem; margin: 0;">
829
- <li class="label" style="margin-bottom: 5px;">
830
- I authorize and consent the Company to use all of my information provided in my application form for legal
831
- purposes such as marketing, market survey and customer service by company, affiliate, or business partner
832
- without my prior consent or notification. The Company shall not allow to disclose any information of any other
833
- purpose not related to the above-mentioned purpose without prior consent in writing.
834
- </li>
835
- <li class="label">
836
- I hereby confirm that I have read and understood all the information in this document. I declare that all the
837
- information provided in this application form is complete, accurate, and true.
838
- </li>
839
- </ol>
840
- </div>
841
- </div>
842
-
843
-
844
- <div class="table-container mt-4">
845
- <table>
846
- <thead>
847
- <tr>
848
- <th style="width: 50%">
849
- <div class="cell">
850
- Signature or Thumb print of the Applicant
851
- </div>
852
- <div class="signature-space"></div>
853
- </th>
854
- <th style="width: 50%">
855
- <div class="cell">Signature or Thumb print of the witness</div>
856
- <div class="signature-space"></div>
857
- </th>
858
- </tr>
859
- </thead>
860
- <tbody>
861
- <tr>
862
- <td>
863
- <div class="form-container space-height">
864
- <div class="form-item">
865
- <div class="space"></div>
866
- <span class="label">Name</span>
867
- <% if (signature_info.applicant_name) { %>
868
- <span class="underline with-unit">
869
- <span class="value">
870
- <%= signature_info.applicant_name %>
871
- </span>
872
- </span>
873
- <% } else { %>
874
- <span class="underline"></span>
875
- <% } %>
876
- <div class="space"></div>
877
- </div>
878
- </div>
879
- </td>
880
- <td>
881
- <div class="form-container space-height">
882
- <div class="form-item">
883
- <div class="space"></div>
884
- <span class="label">Name</span>
885
- <% if (signature_info.witness_name) { %>
886
- <span class="underline with-unit">
887
- <span class="value">
888
- <%= signature_info.witness_name %>
889
- </span>
890
- </span>
891
- <% } else { %>
892
- <span class="underline"></span>
893
- <% } %>
894
- <div class="space"></div>
895
- </div>
896
- </div>
897
- </td>
898
- </tr>
899
- <tr>
900
- <td>
901
- <div class="form-container space-height">
902
- <div class="form-item">
903
- <div class="space"></div>
904
- <span class="label">Date</span>
905
- <% if (signature_info.applicant_signature_date) { %>
906
- <span class="underline with-unit">
907
- <span class="value">
908
- <%= signature_info.applicant_signature_date %>
909
- </span>
910
- </span>
911
- <% } else { %>
912
- <span class="underline"></span>
913
- <% } %>
914
- <div class="space"></div>
915
- </div>
916
- </div>
917
- </td>
918
- <td>
919
- <div class="form-container space-height">
920
- <div class="form-item">
921
- <div class="space"></div>
922
- <span class="label">Date</span>
923
- <% if (signature_info.witness_signature_date) { %>
924
- <span class="underline with-unit">
925
- <span class="value">
926
- <%= signature_info.witness_signature_date %>
927
- </span>
928
- </span>
929
- <% } else { %>
930
- <span class="underline"></span>
931
- <% } %>
932
- <div class="space"></div>
933
- </div>
934
- </div>
935
- </td>
512
+ </div>
513
+ <div class="row">
514
+ <label class="checkbox <%= health_info.is_diagnosed === false ? 'checked' : '' %>">No</label>
515
+ <label class="checkbox <%= health_info.is_diagnosed === true ? 'checked' : '' %>">Yes</label>
516
+ <span class="label">if yes, please provided more details:</span>
517
+ <% if (health_info.diagnosed_detail) { %>
518
+ <span class="underline-text"><span>
519
+ <%= health_info.diagnosed_detail %>
520
+ </span></span>
521
+ <% } else { %>
522
+ <span class="field"></span>
523
+ <% } %>
524
+ </div>
525
+
526
+ <!-- Section 5 -->
527
+ <div class="section-title">DECLARATION BY THE APPLICANT</div>
528
+ <ol style="padding-left: 20px; margin: 15px 0;">
529
+ <li class="label" style="white-space: normal; margin-bottom: 6px;">
530
+ I authorize and consent the Company to use all of my information provided in my application form for
531
+ legal purposes such as marketing, market survey and customer service by company, affiliate, or business
532
+ partner without my prior consent or notification. The Company shall not allow to disclose any
533
+ information of any other purpose not related to the above-mentioned purpose without prior consent in
534
+ writing.
535
+ </li>
536
+ <li class="label" style="white-space: normal;">
537
+ I hereby confirm that I have read and understood all the information in this document. I declare that
538
+ all the information provided in this application form is complete, accurate, and true.
539
+ </li>
540
+ </ol>
541
+
542
+ <table style="margin-top: 10px;">
543
+ <thead>
544
+ <tr>
545
+ <th style="width:50%;">Signature or Thumb print of the Applicant</th>
546
+ <th style="width:50%;">Signature or Thumb print of the witness</th>
547
+ </tr>
548
+ </thead>
549
+ <tbody>
550
+ <tr>
551
+ <td class="sig-box"></td>
552
+ <td class="sig-box"></td>
553
+ </tr>
554
+ <tr>
555
+ <td>
556
+ <div class="row" style="margin: 0; justify-content: center;">
557
+ <span class="label">Name</span>
558
+ <% if (signature_info.applicant_name) { %>
559
+ <span class="underline-text"><span>
560
+ <%= signature_info.applicant_name %>
561
+ </span></span>
562
+ <% } else { %>
563
+ <span class="field"></span>
564
+ <% } %>
565
+ </div>
566
+ </td>
567
+ <td>
568
+ <div class="row" style="margin: 0; justify-content: center;">
569
+ <span class="label">Name</span>
570
+ <% if (signature_info.witness_name) { %>
571
+ <span class="underline-text"><span>
572
+ <%= signature_info.witness_name %>
573
+ </span></span>
574
+ <% } else { %>
575
+ <span class="field"></span>
576
+ <% } %>
577
+ </div>
578
+ </td>
579
+ </tr>
580
+ <tr>
581
+ <td>
582
+ <div class="row" style="margin: 0; justify-content: center;">
583
+ <span class="label">Date</span>
584
+ <% if (signature_info.applicant_signature_date) { %>
585
+ <span class="underline-text"><span>
586
+ <%= signature_info.applicant_signature_date %>
587
+ </span></span>
588
+ <% } else { %>
589
+ <span class="field"></span>
590
+ <% } %>
591
+ </div>
592
+ </td>
593
+ <td>
594
+ <div class="row" style="margin: 0; justify-content: center;">
595
+ <span class="label">Date</span>
596
+ <% if (signature_info.witness_signature_date) { %>
597
+ <span class="underline-text"><span>
598
+ <%= signature_info.witness_signature_date %>
599
+ </span></span>
600
+ <% } else { %>
601
+ <span class="field"></span>
602
+ <% } %>
603
+ </div>
604
+ </td>
936
605
  </tr>
937
- </tbody>
938
- </table>
939
- </div>
606
+ </tbody>
607
+ </table>
608
+
940
609
  </body>
941
610
 
942
611
  </html>