From fe05cf2603fae0ce26f20d15fbbc3edcd5d761f8 Mon Sep 17 00:00:00 2001 From: f Date: Fri, 22 Jun 2018 20:28:01 -0300 Subject: [PATCH] multiplicar los campos tablas #51 --- app/assets/javascripts/table_field.js | 38 ++++++++++++++++++++++ app/assets/stylesheets/application.scss | 19 +++++++++++ app/views/posts/template_field/_table.haml | 13 +++++--- 3 files changed, 65 insertions(+), 5 deletions(-) create mode 100644 app/assets/javascripts/table_field.js diff --git a/app/assets/javascripts/table_field.js b/app/assets/javascripts/table_field.js new file mode 100644 index 0000000..b22a7b5 --- /dev/null +++ b/app/assets/javascripts/table_field.js @@ -0,0 +1,38 @@ +$(document).on('turbolinks:load', function() { + $('.add-group').click(function(e) { + e.preventDefault(); + + var _this = $(this); + var _groups = _this.parents('.field-groups'); + var _extra = _groups.children('.extra-groups'); + var _group_orig = _groups + .children('.field-group') + .first(); + + _group_orig.find('select.select2').select2('destroy'); + var _group = _group_orig + .clone() + .appendTo(_extra); + + // Encontrar todos los elementos con '[0]' en el nombre. + var _date = (new Date).getTime(); + _group.find('[name*="[0]"]').each(function(i, input) { + var _input = $(input); + var _name = _input.attr('name'); + _input.attr('name', _name.replace(/\[0\]/, `[${_date}]`)); + _input.val(''); + }); + + _group.find('.remove-group').click(function(e) { + e.preventDefault(); + + var _this = $(this); + var _group = _this.parents('.field-group').remove(); + }); + + var _select2 = _group.find('.select2'); + var _select2_opts = { theme: 'bootstrap', width: '' } + _select2.select2(_select2_opts); + _group_orig.find('.select2').select2(_select2_opts); + }); +}); diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 1787f5c..8947c22 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -140,3 +140,22 @@ textarea.post-content { } } } + +.field-groups { + .field-group { + .remove-group { + display: none + } + } + + .extra-groups { + .field-group { + border-top: 1px solid lightgray; + padding-top: 1rem; + + .remove-group { + display: inline-block; + } + } + } +} diff --git a/app/views/posts/template_field/_table.haml b/app/views/posts/template_field/_table.haml index 5937d86..e2e3203 100644 --- a/app/views/posts/template_field/_table.haml +++ b/app/views/posts/template_field/_table.haml @@ -1,12 +1,10 @@ -.field-items{class: template.key} +.field-groups{class: template.key} - if template.array? %small.text-muted= t('posts.table') - .clearfix - %button.btn.btn-success= t('posts.row.add') - .field-item{class: template.key} + .field-group{class: template.key} - if template.array? .clearfix - %small.pull-right + %button.btn.btn-warning.btn-sm.pull-right.remove-group = fa_icon 'close', title: t('posts.row.del') = t('posts.row.del') -# Separar los campos en dos columnas @@ -23,8 +21,13 @@ - if @post.new? - value = nf.values - else + - binding.pry if nf.key.ends_with? '_publico' - value = @post.get_front_matter(template.key).try(:[], nf.key) = render 'posts/template_field/nested', template: nf, value: value, name: name + .extra-groups + - if template.array? + .clearfix + %button.btn.btn-success.btn-block.add-group= t('posts.row.add')