Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 1045 | Rev 1047 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
977 geraldo 1
<?php
2
$acl = $this->viewModel()->getRoot()->getVariable('acl');
3
$currentUser = $this->currentUserHelper();
4
 
5
$roleName = $currentUser->getUserTypeId();
6
 
985 geraldo 7
$routeAdd = $this->url('performance-evaluation/forms/add');
8
$routeDatatable = $this->url('performance-evaluation/forms');
977 geraldo 9
$routeDashboard = $this->url('dashboard');
10
 
985 geraldo 11
$allowAdd = $acl->isAllowed($roleName, 'performance-evaluation/forms/add') ? 1 : 0;
12
$allowEdit = $acl->isAllowed($roleName, 'performance-evaluation/forms/edit') ? 1 : 0;
13
$allowDelete = $acl->isAllowed($roleName, 'performance-evaluation/forms/delete') ? 1 : 0;
977 geraldo 14
 
15
 
16
$this->inlineScript()->appendFile($this->basePath('plugins/ckeditor/ckeditor.js'));
17
 
18
 
19
$this->headLink()->appendStylesheet($this->basePath('plugins/nprogress/nprogress.css'));
20
$this->inlineScript()->appendFile($this->basePath('plugins/nprogress/nprogress.js'));
21
 
22
 
23
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/jquery.validate.js'));
24
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/additional-methods.js'));
25
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/localization/messages_es.js'));
26
 
27
$this->headLink()->appendStylesheet($this->basePath('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css'));
28
$this->headLink()->appendStylesheet($this->basePath('plugins/datatables-responsive/css/responsive.bootstrap4.min.css'));
29
 
30
$this->inlineScript()->appendFile($this->basePath('plugins/datatables/jquery.dataTables.min.js'));
31
$this->inlineScript()->appendFile($this->basePath('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js'));
32
$this->inlineScript()->appendFile($this->basePath('plugins/datatables-responsive/js/dataTables.responsive.min.js'));
33
$this->inlineScript()->appendFile($this->basePath('plugins/datatables-responsive/js/responsive.bootstrap4.min.js'));
34
 
35
 
36
$this->headLink()->appendStylesheet($this->basePath('plugins/select2/css/select2.min.css'));
37
$this->headLink()->appendStylesheet($this->basePath('plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css'));
38
 
39
$this->inlineScript()->appendFile($this->basePath('plugins/select2/js/select2.full.min.js'));
40
 
41
$this->inlineScript()->appendFile($this->basePath('plugins/moment/moment-with-locales.min.js'));
42
$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css'));
43
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js'));
44
 
45
 
46
$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap4-toggle/css/bootstrap4-toggle.min.css'));
47
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap4-toggle/js/bootstrap4-toggle.min.js'));
48
 
49
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-confirmation/dist/bootstrap-confirmation.js'));
50
$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap-checkbox/awesome-bootstrap-checkbox.css'));
51
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-input-number/input-number-format.jquery.js'));
52
 
53
// bootbox Alert //
54
$this->inlineScript()->appendFile($this->basePath('plugins/bootbox/bootbox.min.js'));
55
 
56
// JsRender //
57
$this->inlineScript()->appendFile($this->basePath('plugins/jsrender/jsrender.min.js'));
58
 
59
$this->inlineScript()->captureStart();
60
echo <<<JS
1006 geraldo 61
 
1027 geraldo 62
   jQuery(document).ready(function($) {
977 geraldo 63
    var allowEdit = $allowEdit;
64
    var allowDelete = $allowDelete;
1007 geraldo 65
    var sections = [];
977 geraldo 66
    /**
67
     * Get rows and set data table
68
     */
69
    var tableForm = $('#gridTable').dataTable({
70
        'processing': true,
71
        'serverSide': true,
72
        'searching': true,
73
        'order': [
74
            [0, 'asc']
75
        ],
76
        'ordering': true,
77
        'ordenable': true,
78
        'responsive': true,
79
        'select': false,
80
        'paging': true,
81
        'pagingType': 'simple_numbers',
82
        'ajax': {
83
            'url': '$routeDatatable',
84
            'type': 'get',
85
            'beforeSend': function(request) {
86
                NProgress.start();
87
            },
88
            'dataFilter': function(response) {
89
                var response = jQuery.parseJSON(response);
90
                var json = {};
91
                json.recordsTotal = 0;
92
                json.recordsFiltered = 0;
93
                json.data = [];
94
                if (response.success) {
95
                    json.recordsTotal = response.data.total;
96
                    json.recordsFiltered = response.data.total;
97
                    json.data = response.data.items;
98
                } else {
99
                    $.fn.showError(response.data)
100
                }
101
                return JSON.stringify(json);
102
            }
103
        },
104
        'language': {
105
            'sProcessing': 'LABEL_DATATABLE_SPROCESSING',
106
            'sLengthMenu': 'LABEL_DATATABLE_SLENGTHMENU',
107
            'sZeroRecords': 'LABEL_DATATABLE_SZERORECORDS',
108
            'sEmptyTable': 'LABEL_DATATABLE_SEMPTYTABLE',
109
            'sInfo': 'LABEL_DATATABLE_SINFO',
110
            'sInfoEmpty': 'LABEL_DATATABLE_SINFOEMPTY',
111
            'sInfoFiltered': 'LABEL_DATATABLE_SINFOFILTERED',
112
            'sInfoPostFix': '',
113
            'sSearch': 'LABEL_DATATABLE_SSEARCH',
114
            'sUrl': '',
115
            'sInfoThousands': ',',
116
            'sLoadingRecords': 'LABEL_DATATABLE_SLOADINGRECORDS',
117
            'oPaginate': {
118
                'sFirst': 'LABEL_DATATABLE_SFIRST',
119
                'sLast': 'LABEL_DATATABLE_SLAST',
120
                'sNext': 'LABEL_DATATABLE_SNEXT',
121
                'sPrevious': 'LABEL_DATATABLE_SPREVIOUS'
122
            },
123
            'oAria': {
124
                'sSortAscending': ': LABEL_DATATABLE_SSORTASCENDING',
125
                'sSortDescending': ':LABEL_DATATABLE_SSORTDESCENDING'
126
            },
127
        },
128
        'drawCallback': function(settings) {
129
            NProgress.done();
130
            $('button.btn-delete').confirmation({
131
                rootSelector: 'button.btn-delete',
132
                title: 'LABEL_ARE_YOU_SURE',
133
                singleton: true,
134
                btnOkLabel: 'LABEL_YES',
135
                btnCancelLabel: 'LABEL_NO',
136
                onConfirm: function(value) {
137
                    action = $(this).data('href');
138
                    NProgress.start();
139
                    $.ajax({
140
                        'dataType': 'json',
141
                        'accept': 'application/json',
142
                        'method': 'post',
143
                        'url': action,
144
                    }).done(function(response) {
145
                        if (response['success']) {
146
                            $.fn.showSuccess(response['data']);
147
                            tableForm.fnDraw();
148
                        } else {
149
                            $.fn.showError(response['data']);
150
                        }
151
                    }).fail(function(jqXHR, textStatus, errorThrown) {
152
                        $.fn.showError(textStatus);
153
                    }).always(function() {
154
                        NProgress.done();
155
                    });
156
                },
157
            });
158
        },
159
        'aoColumns': [{
160
                'mDataProp': 'name'
161
            },
162
            {
163
                'mDataProp': 'language'
164
            },
165
            {
166
                'mDataProp': 'status'
167
            },
168
            {
169
                'mDataProp': 'actions'
170
            },
171
        ],
172
        'columnDefs': [{
173
                'targets': 0,
174
                'className': 'text-vertical-middle',
175
            },
176
            {
177
                'targets': 1,
178
                'className': 'text-vertical-middle',
179
            },
180
            {
181
                'targets': -2,
182
                'orderable': false,
183
                'className': 'text-center',
184
                'render': function(data, type, row) {
185
                    checked = data == 'a' ? ' checked="checked" ' : '';
186
                    return '<div class="checkbox checkbox-success">' +
187
                        '<input class="styled" type="checkbox" ' + checked + ' disabled="disabled">' +
188
                        '<label ></label></div>';
189
                }
190
            },
191
            {
192
                'targets': -1,
193
                'orderable': false,
194
                'render': function(data, type, row) {
195
                    s = '';
196
                    if (allowEdit) {
197
                        s = s + '<button class="btn btn-primary btn-edit-form" data-href="' + data['link_edit'] + '" data-toggle="tooltip" title="LABEL_EDIT"><i class="fa fa-pencil"></i> LABEL_EDIT </button>&nbsp;';
198
                    }
199
                    if (allowDelete) {
200
                        s = s + '<button class="btn btn-danger btn-delete" data-href="' + data['link_delete'] + '" data-toggle="tooltip" title="LABEL_DELETE"><i class="fa fa-trash"></i> LABEL_DELETE </button>&nbsp;';
201
                    }
202
                    return s;
203
                }
204
            }
205
        ],
206
    });
207
    /**
208
     * Clicked on edit form
209
     */
210
    $('body').on('click', 'button.btn-edit-form', function(e) {
211
        e.preventDefault();
212
        form_id = $(this).data('id')
213
        var action = $(this).data('href');
214
        $.ajax({
215
            'dataType': 'json',
216
            'accept': 'application/json',
217
            'method': 'get',
218
            'url': action,
219
        }).done(function(response) {
220
            if (response['success']) {
221
                $('#form-main').attr('action', action);
222
                $('#form-main #form-id').val(response['data']['id']),
1027 geraldo 223
                    $('#form-main #form-continue').val('0');
977 geraldo 224
                $('#form-main #form-name').val(response['data']['name']),
1027 geraldo 225
                    /*----------Set Ckeditor ------------*/
226
                    CKEDITOR.instances['form-description'].setData(response['data']['description']);
977 geraldo 227
                CKEDITOR.instances['form-text'].setData(response['data']['text']);
228
                $('#form-main #form-language').val(response['data']['language']),
1027 geraldo 229
                    $('#form-main #form-status').val(response['data']['status']);
977 geraldo 230
                /*-------------Render Sections -------*/
1006 geraldo 231
                renderSectionData();
1005 geraldo 232
                $('#row-lists').hide();
233
                $('#row-form').show();
977 geraldo 234
                $('#form-main #form-name').focus();
235
            } else {
236
                $.fn.showError(response['message'] || 'ERROR_UNKNOWN');
237
            }
238
        }).fail(function(jqXHR, textStatus, errorThrown) {
239
            $.fn.showError(textStatus);
240
        });
241
    });
242
    /**
997 geraldo 243
     * Clicked add new section
977 geraldo 244
     */
1004 geraldo 245
    $('#btn-add-section').click(function(e) {
1027 geraldo 246
        $('#form-section #id-section').val('');
1016 geraldo 247
        $('#form-section #title-section').val('');
1012 geraldo 248
        $('#form-section #text-section').val('');
249
        $('#form-section #type-section').val($('#form-section #type-section option:first').val());
1005 geraldo 250
        $('#modal-section h4[class="modal-title"]').html('LABEL_ADD LABEL_SECTION');
993 geraldo 251
        $('#modal-section').modal('show');
977 geraldo 252
    });
253
    /**
997 geraldo 254
     * Clicked edit section
977 geraldo 255
     */
256
    /**
1009 geraldo 257
     * Clicked save section
258
     */
259
    $('#btn-save-section').click(function(e) {
1027 geraldo 260
        if ($('#title-section').val() == '') {
1010 geraldo 261
            $.fn.showError('Ingrese un nombre');
1009 geraldo 262
            return;
1027 geraldo 263
        } else {
264
            if ($('#id-section').val() == "") {
1009 geraldo 265
                addSection(
1016 geraldo 266
                    $('#title-section').val(),
1012 geraldo 267
                    $('#text-section').val(),
268
                    $('#type-section').val(),
1027 geraldo 269
                )
270
            } else {
1009 geraldo 271
                editSection(
1027 geraldo 272
                    $('#id-section').val(),
1016 geraldo 273
                    $('#title-section').val(),
1012 geraldo 274
                    $('#text-section').val(),
275
                    $('#type-section').val()
1027 geraldo 276
                )
1009 geraldo 277
            }
1011 geraldo 278
            $('#modal-section').modal('hide');
1010 geraldo 279
            return;
1009 geraldo 280
        }
281
    });
282
    /**
997 geraldo 283
     * Clicked remove section
977 geraldo 284
     */
1026 geraldo 285
    $('body').on('click', 'button.btn-delete-section', function(e) {
286
        e.preventDefault();
1027 geraldo 287
        var id_section = $(this).data('section');
977 geraldo 288
        bootbox.confirm({
993 geraldo 289
            title: "LABEL_DELETE LABEL_SECTION",
1031 geraldo 290
            message: "LABEL_QUESTION_DELETE",
977 geraldo 291
            buttons: {
292
                cancel: {
293
                    label: '<i class="fa fa-times"></i> LABEL_CANCEL'
294
                },
295
                confirm: {
296
                    label: '<i class="fa fa-check"></i> LABEL_ACCEPT'
297
                }
298
            },
299
            callback: function(result) {
300
                if (result) {
1027 geraldo 301
                    removeSection(id_section);
977 geraldo 302
                }
303
            }
304
        });
305
    });
1026 geraldo 306
    $('body').on('click', 'button.btn-edit-section', function(e) {
307
        e.preventDefault();
1027 geraldo 308
        var id = $(this).data('section');
1029 geraldo 309
        console.log(id);
1027 geraldo 310
        sections.map((item) => {
1030 geraldo 311
            if (item.id_section == id) {
312
                $('#form-section #id-section').val(item.id_section);
1027 geraldo 313
                $('#form-section #title-section').val(item.title);
314
                $('#form-section #text-text').val(item.text);
1032 geraldo 315
                $('#form-section #type-section').val(item.type);
1027 geraldo 316
                $('#modal-section').modal('show');
317
                return;
318
            }
319
        });
320
    });
1046 geraldo 321
     /**
322
     * Clicked remove option
323
     */
324
    $('body').on('click', 'button.btn-delete-option', function(e) {
325
        e.preventDefault();
326
        var id_section = $(this).data('section');
327
        var id_option = $(this).data('option');
328
        bootbox.confirm({
329
            title: "LABEL_DELETE LABEL_OPTION",
330
            message: "LABEL_QUESTION_DELETE",
331
            buttons: {
332
                cancel: {
333
                    label: '<i class="fa fa-times"></i> LABEL_CANCEL'
334
                },
335
                confirm: {
336
                    label: '<i class="fa fa-check"></i> LABEL_ACCEPT'
337
                }
338
            },
339
            callback: function(result) {
340
                if (result) {
341
                    removeOption(id_section, id_option);
342
                }
343
            }
344
        });
345
    });
977 geraldo 346
    /**
1027 geraldo 347
     * Clicked add new Option
348
     */
349
    $('body').on('click', 'button.btn-add-option', function(e) {
350
        e.preventDefault();
351
        var id = $(this).data('section');
352
        $('#section-option').val(id);
1034 geraldo 353
        $('#modal-option h4[class="modal-title"]').html('LABEL_EDIT LABEL_OPTION');
1027 geraldo 354
        $('#modal-option').modal('show');
355
        return;
356
    });
357
    /**
358
     * Clicked add new Option
359
     */
1037 geraldo 360
    $('#btn-save-option').click(function(e) {
361
        if ($('#title-option').val() == '') {
362
            $.fn.showError('Ingrese un texto');
363
            return;
364
        } else {
365
            if ($('#id-option').val() == "") {
1027 geraldo 366
            addOption(
367
                $('#section-option').val(),
368
                $('#title-option').val(),
369
            )
370
        } else {
371
            editOption(
372
                $('#section-option').val(),
373
                $('#id-option').val(),
374
                $('#title-option').val(),
375
            )
376
        }
1037 geraldo 377
            $('#modal-option').modal('hide');
378
            return;
379
        }
1027 geraldo 380
    });
381
    /**
382
     * Clicked edit Option
383
     */
384
    $('body').on('click', 'button.btn-edit-option', function(e) {
385
        e.preventDefault();
386
        var id_section = $(this).data('section');
387
        var id_option = $(this).data('option');
1041 geraldo 388
        console.log(id_section);
389
        console.log(id_option);
1040 geraldo 390
        console.log(sections);
1027 geraldo 391
        sections.map((item) => {
392
            if (item.id_section == id_section) {
393
                item.options.map((opt) => {
394
                    if (opt.id_option == id_option) {
395
                        $('#id-option').val(opt.id_option);
1042 geraldo 396
                        $('#section-option').val(opt.id_section);
1027 geraldo 397
                        $("#title-option").val(opt.title);
1034 geraldo 398
                        $('#modal-option h4[class="modal-title"]').html('LABEL_EDIT LABEL_OPTION');
1027 geraldo 399
                        $('#modal-option').modal('show');
400
                        return;
401
                    }
402
                });
403
            }
404
        });
405
    });
406
    /**
977 geraldo 407
     * Clicked new Form
408
     */
409
    $('button.btn-add-form').click(function(e) {
410
        $('#form-main').attr('action', '$routeAdd');
411
        $('#form-main #form-id').val('0');
412
        $('#form-main #form-continue').val('0');
413
        $('#form-main #form-name').val('');
1005 geraldo 414
        $('#row-lists').hide();
415
        $('#row-form').show();
977 geraldo 416
        $('#form-main #form-name').focus();
417
    });
418
    /**
419
     * Clicked cancel new/edit Form
420
     */
421
    $('button.btn-edit-cancel').click(function(e) {
422
        e.preventDefault();
1005 geraldo 423
        $('#row-form').hide();
424
        $('#row-lists').show();
977 geraldo 425
    });
426
    /**
427
     * Clicked save and close new/edit Form
428
     */
429
    $('button.btn-form-save-close').click(function(e) {
430
        e.preventDefault();
431
        $('#form-main #form-continue').val('0')
432
        $('#form-main').submit();
433
    });
434
    /**
435
     * Remove Html Tags
436
     */
1027 geraldo 437
    const removeTags = (str) => str.toString().replace(/(<([^>]+)>)/ig, '')
977 geraldo 438
    /**
439
     * Render Sections data
440
     */
1027 geraldo 441
    const renderData = (data) => {
1011 geraldo 442
        console.log(data);
1013 geraldo 443
        $("#rows").html($("#sectionTemplate").render(data));
1011 geraldo 444
    }
977 geraldo 445
    /**
1007 geraldo 446
     * Add Section to array
977 geraldo 447
     */
1014 geraldo 448
    const addSection = (title, text, type) => {
1007 geraldo 449
        sections.push({
1012 geraldo 450
            'id_section': new Date().getTime(),
1007 geraldo 451
            'title': title,
452
            'type': type,
1009 geraldo 453
            'text': text,
1007 geraldo 454
            'options': []
455
        });
456
        renderData(sections);
457
    }
977 geraldo 458
    /**
1007 geraldo 459
     * Edit item behavior
460
     */
1033 geraldo 461
    const editSection = (id, title, text, type) => {
1007 geraldo 462
        sections.map((item) => {
1012 geraldo 463
            if (item.id_section == id) {
1009 geraldo 464
                item.title = title;
465
                item.type = type;
466
                item.text = text;
1007 geraldo 467
            }
468
        });
469
        renderData(sections);
470
    }
471
    /**
472
     * Remove behavior
473
     */
474
    const removeSection = (id) => {
1012 geraldo 475
        sections = sections.filter((item) => item.id_section != id);
1007 geraldo 476
        renderData(sections);
477
    }
1027 geraldo 478
    /**
1012 geraldo 479
     * Add Option to array
480
     */
1038 geraldo 481
    const addOption = (id_section, title) => {
1012 geraldo 482
        sections.map((item) => {
1038 geraldo 483
            if (item.id_section == id_section) {
1012 geraldo 484
                item.options.push({
1042 geraldo 485
                     'id_section': id_section,
1012 geraldo 486
                    'id_option': new Date().getTime(),
487
                    'title': title,
488
                });
489
            }
490
        });
491
        renderData(sections);
492
    }
493
    /**
1027 geraldo 494
     * Edit item Option
495
     */
1043 geraldo 496
    const editOption = (id_section, id, title ) => {
1012 geraldo 497
        sections.map((item) => {
1038 geraldo 498
            if (item.id_section == id_section) {
1027 geraldo 499
                item.options.map((opt) => {
500
                    if (opt.id_option == id) {
1012 geraldo 501
                        opt.title = title
502
                    }
503
                });
504
            }
505
        });
506
        renderData(sections);
507
    }
508
    /**
509
     * Remove Option
510
     */
1038 geraldo 511
    const removeOption = (id_section, id) => {
1012 geraldo 512
        sections.map((item) => {
1038 geraldo 513
            if (item.id_section == id_section) {
1012 geraldo 514
                item.options = item.options.filter((opt) => opt.id_option != id) || []
515
            }
516
        });
517
        renderData(sections);
518
    }
1007 geraldo 519
    /**
977 geraldo 520
     * Clicked refresh button
521
     */
522
    $('button.btn-refresh').click(function(e) {
523
        tableForm.fnDraw();
524
    });
525
});
526
JS;
527
$this->inlineScript()->captureEnd();
528
?>
529
<!-- Content Header (Page header) -->
530
<section class="content-header">
1027 geraldo 531
   <div class="container-fluid">
532
      <div class="row mb-2">
533
         <div class="col-sm-12">
534
            <h1>LABEL_PERFORMANCE_EVALUATION</h1>
535
         </div>
536
      </div>
537
   </div>
538
   <!-- /.container-fluid -->
977 geraldo 539
</section>
540
<section class="content">
1027 geraldo 541
   <div class="container-fluid" id="row-lists">
542
      <div class="row">
543
         <div class="col-12">
544
            <div class="card">
545
               <div class="card-body">
546
                  <table id="gridTable" class="table   table-hover">
547
                     <thead>
548
                        <tr>
549
                           <th>LABEL_NAME</th>
550
                           <th>LABEL_LANGUAGE</th>
551
                           <th>LABEL_ACTIVE</th>
552
                           <th>LABEL_ACTIONS</th>
553
                        </tr>
554
                     </thead>
555
                     <tbody></tbody>
556
                  </table>
557
               </div>
558
               <div class="card-footer clearfix">
559
                  <div style="float:right;">
560
                     <button type="button" class="btn btn-info btn-refresh"><i class="fa fa-refresh"></i> LABEL_REFRESH </button>
561
                     <?php if ($allowAdd) : ?>
562
                     <button type="button" class="btn btn-primary btn-add-form"><i class="fa fa-plus"></i> LABEL_ADD </button>
563
                     <?php endif; ?>
564
                  </div>
565
               </div>
977 geraldo 566
            </div>
1027 geraldo 567
         </div>
568
      </div>
569
   </div>
570
   <!-- Create/Edit Form -->
571
   <div class="row" id="row-form" style="display: none">
572
      <div class="col-xs-12 col-md-12">
573
         <form action="#" name="form-main" id="form-main">
574
            <input type="hidden" name="form-id" id="form-id" value="0" />
575
            <input type="hidden" name="form-continue" id="form-continue" value="0" />
576
            <div class="form-group">
577
               <label for="form-name">LABEL_FIRST_NAME</label>
578
               <input type="text" name="form-name" id="form-name" class="form-control" maxlength="50" />
1012 geraldo 579
            </div>
1027 geraldo 580
            <div class="row">
581
               <div class="col-xs-12 col-md-12 text-right">
582
                  <button type="button" class="btn btn-primary" id="btn-add-section" data-toggle="tooltip" title="LABEL_ADD LABEL_SECTION"><i class="fa fa-plus" aria-hidden="true"></i> LABEL_ADD LABEL_SECTION</button>
583
               </div>
584
            </div>
585
            <br />
586
            <div class="row">
587
               <div class="col-xs-12 col-md-12">
588
                  <div class="panel-group" id="rows"></div>
589
               </div>
590
            </div>
591
            <div class="form-group">
592
               <button type="button" class="btn btn-primary btn-form-save-close">LABEL_SAVE & LABEL_CLOSE</button>
593
               <button type="button" class="btn btn-secondary btn-edit-cancel">LABEL_CANCEL</button>
594
            </div>
595
         </form>
596
      </div>
597
   </div>
598
   <!-- Create/Edit Form-->
599
   <!-- section Modal -->
600
   <div  id="modal-section" class="modal" tabindex="-1" role="dialog">
601
      <div class="modal-dialog modal-lg" role="document">
602
         <form action="#" name="form-section" id="form-section">
603
            <input type="hidden" name="id-section" id="id-section" />
604
            <div class="modal-content">
605
               <div class="modal-header">
606
                  <h4 class="modal-title">LABEL_ADD LABEL_SECTION</h4>
607
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
608
                  <span aria-hidden="true">&times;</span>
609
                  </button>
610
               </div>
611
               <div class="modal-body">
612
                  <div class="form-group">
613
                     <label for="title-section">LABEL_FIRST_NAME</label>
614
                     <input type="text" name="title-section" id="title-section" class="form-control" maxlength="50" value="" />
615
                  </div>
616
                  <div class="form-group">
617
                     <label for="text-section">LABEL_TEXT</label>
618
                     <textarea  name="text-section" id="text-section" rows="5" class="form-control"></textarea>
619
                  </div>
620
                  <div class="form-group">
621
                     <label for="type-section">LABEL_TYPE</label>
622
                     <select name="type-section" id="type-section" class="form-control">
623
                        <option value="simple">Simple</option>
624
                        <option value="multiple">Multiple</option>
625
                     </select>
626
                  </div>
627
               </div>
628
               <div class="modal-footer">
629
                  <button type="button" id="btn-save-section" class="btn btn-primary">LABEL_SAVE</button>
630
                  <button type="button" class="btn btn-secondary" data-dismiss="modal">LABEL_CLOSE</button>
631
               </div>
632
            </div>
633
         </form>
634
      </div>
635
   </div>
636
   <!-- End Modal section -->
637
   <!-- Modal Options -->
638
   <div  id="modal-option" class="modal" tabindex="-1" role="dialog">
639
      <div class="modal-dialog modal-lg" role="document">
640
         <form action="#" name="form-option" id="form-option">
641
            <input type="hidden" name="section-option" id="section-option" value="" />
642
            <input type="hidden" name="id-option" id="id-option" value="" />
643
            <div class="modal-content">
644
               <div class="modal-header">
645
                  <h4 class="modal-title">LABEL_OPTION</h4>
646
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
647
                  <span aria-hidden="true">&times;</span>
648
                  </button>
649
               </div>
650
               <div class="modal-body">
651
                  <div class="form-group">
652
                     <label for="title-option">LABEL_TEXT</label>
653
                     <!--  ckeditor -->
1035 geraldo 654
                     <textarea  name="title-option" id="title-option" rows="5" class="form-control"></textarea>
1027 geraldo 655
                  </div>
656
               </div>
657
               <div class="modal-footer">
658
                  <button type="button" class="btn btn-primary" id="btn-save-option">LABEL_SAVE</button>
659
                  <button type="button" class="btn btn-secondary" data-dismiss="modal">LABEL_CLOSE</button>
660
               </div>
661
            </div>
662
         </form>
663
      </div>
664
   </div>
665
   <!-- End Modal Options -->
666
   <!---Template Sections --->
667
   <script id="sectionTemplate" type="text/x-jsrender">
1045 geraldo 668
   <div class="panel panel-default" id="panel-{{:id_section}}">
669
   <div class="panel-heading">
670
      <h4 class="panel-title">
671
         <a class="accordion-toggle" data-toggle="collapse" aria-expanded="true" data-parent="#panel-{{:id_section}}" href="#collapse-{{:id_section}}">
672
         <span class="section-name{{:id_section}}">
673
         {{:name}}
674
         </span>
675
         </a>
676
      </h4>
677
   </div>
678
   <div id="collapse-{{:id_section}}" class="panel-collapse in collapse show">
679
      <div class="panel-body">
680
         <div class="table-responsive">
681
            <table class="table table-bordered">
682
               <thead>
683
                  <tr>
684
                     <th style="width: 10%;">LABEL_ELEMENT</th>
685
                     <th style="width: 30%;">LABEL_TEXT</th>
686
                     <th style="width: 10%;">LABEL_TYPE</th>
687
                     <th style="width: 50%;">LABEL_ACTIONS</th>
688
                  </tr>
689
               </thead>
690
               <tbody>
691
                  <tr class="tr-section">
692
                     <td class="text-left">LABEL_SECTION</td>
693
                     <td class="text-left">{{:title}}</td>
694
                     <td>
695
                        {{if type == 'simple'}} Simple {{/if}}
696
                        {{if type == 'multiple'}} Multiple {{/if}}
697
                     </td>
698
                     <td>
699
                        <button  class="btn btn-default btn-edit-section" data-section="{{:id_section}}" data-toggle="tooltip"  data-original-title="LABEL_EDIT LABEL_SECTION"><i class="fa fa-edit" aria-hidden="true"></i> LABEL_EDIT LABEL_SECTION </button>
700
                        <button  class="btn btn-default btn-delete-section" data-section="{{:id_section}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE LABEL_SECTION"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE LABEL_SECTION </button>
701
                        {{if type == 'multiple'}}
702
                        <button type="button" class="btn btn-default btn-add-option" data-section="{{:id_section}}" data-toggle="tooltip"  data-original-title="LABEL_ADD  LABEL_OPTION"><i class="fa fa-plus" aria-hidden="true"></i> LABEL_ADD  LABEL_OPTION </button>
703
                        {{/if}}
704
                     </td>
705
                  </tr>
706
                  {{for options}}
707
                  <tr >
708
                     <td class="text-left">--LABEL_OPTION</td>
709
                     <td class="text-left">
710
                        {{:title}}
711
                     </td>
712
                     <td></td>
713
                     <td>
714
                        <button class="btn btn-default btn-edit-option" data-section="{{:id_section}}" data-option="{{:id_option}}" data-toggle="tooltip"  data-original-title="LABEL_EDIT LABEL_OPTION"><i class="fa fa-edit" aria-hidden="true"></i> LABEL_EDIT LABEL_OPTION</button>
715
                        <button class="btn btn-default btn-delete-option" data-section="{{:id_section}}" data-option="{{:id_option}}" data-toggle="tooltip"  data-original-title="LABEL_DELETE LABEL_OPTION"><i class="fa fa-ban" aria-hidden="true"></i> LABEL_DELETE LABEL_OPTION</button>
716
                     </td>
717
                  </tr>
718
                  {{/for}}
719
               </tbody>
720
            </table>
721
         </div>
1027 geraldo 722
      </div>
1045 geraldo 723
   </div>
724
</div>
1027 geraldo 725
   </script>
726
   <!-- End Template Sections-->
977 geraldo 727
</section>