Activeadmin自定义页面+ ActiveAdmin插件-自定义页面上的交互式标签

时间:2018-06-25 15:58:56

标签: ruby-on-rails activeadmin

我正在使用activeadmin和activeadmin插件。

我在activeadmin中有一个自定义页面,在该页面中我呈现了另一种资源(票证)的某些表。这项工作正常,但是当我尝试添加:interactive true标记时,出现此错误:

    undefined method `admin_panel_reclamo_path' for #<Admin::PanelReclamosController:0x00007fbe64afe360>
Did you mean?  admin_panel_reclamos_path
               admin_panel_reclamos_url

我认为问题是因为插件的ajax试图更改自定义页面模型中的值,但它不存在,因为我想更改其他资源(票证)的值。

自定义页面的代码:

ActiveAdmin.register_page "Panel Reclamos" do

      content do
        panel 'Nuevos Reclamos' do
          table_for Ticket.tickets_nuevos do
            column 'Creado', :created_at
            state_column 'Estado Reclamo', :aasm_state
            column 'Cliente', :client
            column 'Resumen', :ticket_name, sortable: false
            tag_column 'Prioridad', :ticket_priority
            tag_column 'Ascensor', :ticket_status
            tag_column 'Seguimiento', :ticket_workflow
            column 'Actualizado', :updated_at
          end
        end
        panel 'Atendiendo Ahora' do
          table_for Ticket.tickets_ahora do
            column 'Creado', :created_at
            state_column 'Estado Reclamo', :aasm_state
            column 'Cliente', :client
            column 'Resumen', :ticket_name, sortable: false
            tag_column 'Prioridad', :ticket_priority, interactive: true
            tag_column 'Ascensor', :ticket_status
            tag_column 'Seguimiento', :ticket_workflow
            column 'Actualizado', :updated_at
          end
        end
        panel 'Requiere Accion' do
          table_for Ticket.tickets_requiere_accion do
            column 'Creado', :created_at
            state_column 'Estado Reclamo', :aasm_state
            column 'Cliente', :client
            column 'Resumen', :ticket_name, sortable: false
            tag_column 'Prioridad', :ticket_priority
            tag_column 'Ascensor', :ticket_status
            tag_column 'Seguimiento', :ticket_workflow
            column 'Actualizado', :updated_at
          end
        end
        panel 'En Espera' do
          table_for Ticket.tickets_espera do
            column 'Creado', :created_at
            state_column 'Estado Reclamo', :aasm_state
            column 'Cliente', :client
            column 'Resumen', :ticket_name, sortable: false
            tag_column 'Prioridad', :ticket_priority
            tag_column 'Ascensor', :ticket_status
            tag_column 'Seguimiento', :ticket_workflow
            column 'Actualizado', :updated_at
          end
        end
      end
    end 

ActiveAdmin插件交互式标签JS:

$(function() {
  configureInteractiveSelect(document);

  $(document).on('has_many_add:after', function(event, container) {
    configureInteractiveSelect(container);
  });

  function configureInteractiveSelect(container) {
    $('.interactive-tag-select select', container).each(function(i, el) {
      setupSelect2(el);
    });

    function setupSelect2(select) {
      var selectConfig = {
        placeholder: '',
        allowClear: false,
        width: '125px',
      };

      $(select).select2(selectConfig);

      // Related with https://github.com/select2/select2/issues/3320
      $(select).on('select2:unselecting', function() {
        $(this).data('unselecting', true);
      }).on('select2:open', function() {
        if ($(this).data('unselecting')) {
          $(this).select2('close').removeData('unselecting');
        }
      });
    }
  }

  $('.interactive-tag').click(function(e) {
    var tag = $(e.target).parent();
    var model = tag.data('model');
    var objectId = tag.data('object_id');
    var field = tag.data('field');
    var selectTag = $('.' + model + '-' + field + '-' + objectId + '-select');
    selectTag.removeClass('select-container-hidden');
    tag.addClass('interactive-tag-hidden');
    selectTag.find('select').select2('open');
  });

  $('.interactive-tag-select').on('select2:close', function(e) {
    var selectTag = $(e.target).parent();

    var model = selectTag.data('model');
    var objectId = selectTag.data('object_id');
    var field = selectTag.data('field');

    var tagContainer = $('.' + model + '-' + field + '-' + objectId + '-tag');
    var statusTag = tagContainer.find('.status_tag');

    var newValue = e.target.value;
    var newText = e.target.selectedOptions[0].text;
    var oldValue = selectTag.data('value');

    if (newValue === oldValue) {
      selectTag.addClass('select-container-hidden');
      tagContainer.removeClass('interactive-tag-hidden');
    } else {
      var url = tagContainer.data('url');
      var data = { id: objectId };
      data[model] = {};
      data[model][field] = newValue;

      $.ajax({
        url: url,
        data: data,
        dataType: 'json',
        error: function() {
          var errorMsg = 'Error: Update Unsuccessful';
          console.log(errorMsg);
        },
        success: function() {
          statusTag.text(newText);
          statusTag.removeClass(oldValue);
          statusTag.addClass(newValue);

          tagContainer.data('value', newValue);
          selectTag.data('value', newValue);
        },
        complete: function() {
          selectTag.addClass('select-container-hidden');
          tagContainer.removeClass('interactive-tag-hidden');
        },
        type: 'PATCH',
      });
    }
  });
});

如果您能帮助我,我将不胜感激。我不知道,我真的需要在自定义页面中实现该功能。

如果您要检查它,我还添加了一个Github问题: https://github.com/platanus/activeadmin_addons/issues/223

谢谢。

0 个答案:

没有答案