cm-admin 1.3.0 → 1.3.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f7e6efbcc18df89a3b37963b143cb81564c1ba2aa07df3972d452f7d79a5615e
-  data.tar.gz: d779de03dae22b2c81c568205a29e3a785c62e4d14bb4a2633c7ee4e9a3c4944
+  metadata.gz: 653bbd73e1bb64cbc7a6a56624ffa50d55942e4b1fe42d3be44af91d7e31d14b
+  data.tar.gz: 71ebf18e94bca9bce2453688683aad2f35373ab346d7815b992d009aaeb4cfbb
 SHA512:
-  metadata.gz: b878ed9eb649bb0838b2901d89f1dee2eab61c03bda22a05dd07d27929e0bfbf0c08aad3c0d6c02ebb652ce989330177d168bf4200707a65983ac1de9724a141
-  data.tar.gz: 406bf4e9fe8311d52af3e0f733faf8136c19ef3e3f3bc0547e399afaf13d4cf591d555d031120c3fab1f6f0b7e93c7e6aac1e955eab6d22182c0b49356964874
+  metadata.gz: b0b8346923b752798b96faf677ef08fd71f6ed343a4baaa8333a49a1feb93b737e6d77f228851e7b63adf66f490ebf6c452cd9b13c8e75677497e2ff8247a89f
+  data.tar.gz: 90a247fd04d1b7fdf647c3ace27ba7e9b176e1af000fc5718551ab76dcd87198bdcb2c54cfed2aa3571f2fde0e32520142bca75c8f49a51f57f6400648838d8c

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    cm-admin (1.3.0)
+    cm-admin (1.3.2)
       caxlsx_rails
       cocoon (~> 1.2.15)
       csv-importer (~> 0.8.2)

data/app/assets/stylesheets/cm_admin/base/cardView.scss

@@ -0,0 +1,43 @@
+@import "../helpers/index.scss";
+@import "../dependency/bootstrap/scss/bootstrap";
+
+.card-list-container {
+  overflow: hidden;
+  padding-right: 24px;
+  .card-grid {
+    @extend .row, .row-cols-4, .g-3;
+  }
+  .item-card {
+    @extend .card, .position-relative;
+    border-radius: 4px;
+    .card-menu {
+      @extend .dropdown, .position-absolute;
+      top: 8px;
+      right: 8px;
+    }
+    .card-img-top {
+      height: 185px;
+      object-fit: cover;
+      border-top-left-radius: 4px;
+      border-top-right-radius: 4px;
+    }
+    .card-subtitle {
+      @extend .d-flex, .justify-content-between, .text-secondary, .fw-medium;
+      font-size: $t4-text;
+      .item-id {
+        margin: 0;
+        span {
+          border-left: 1px solid;
+          padding-left: 4px;
+        }
+      }
+    }
+    .card-footer {
+      @extend .d-flex, .justify-content-between, .bg-white;
+      .item-price {
+        font-size: $t4-text;
+        margin: 0;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/cm_admin/base/form.scss

@@ -72,22 +72,3 @@
     visibility: hidden;
   }
 }
-
-//Nested form table styles
-.nested-form-table-wrapper {
-  overflow-y: scroll;
-  .nested-form-table {
-    @extend .table, .table-light, .table-hover, .table-bordered, .m-0;
-    width: max-content;
-    .item-delete-cell {
-      vertical-align: middle;
-      text-align: center;
-    }
-  }
-}
-
-.nested-table-footer {
-  padding: 8px;
-  border: 1px solid var(--bs-border-color);
-  border-top: 0;
-}

data/app/assets/stylesheets/cm_admin/base/scaffold.scss

@@ -102,7 +102,7 @@ a {
 }
 
 .nested-fields .select2 {
-  width: 320px !important;
+  width: 100% !important;
 }
 
 .datetime-wrapper {

data/app/assets/stylesheets/cm_admin/base/table.scss

@@ -37,143 +37,97 @@
     }
   }
 
-  //Table UI styles
-  .new-admin-table {
+  // Table UI v2
+  .table-wrapper {
     min-width: 720px;
     max-width: fit-content;
-    // max-height: calc(100vh - 240px); Height is dynamic
+    max-height: calc(100vh - 240px);
     overflow: auto;
-    .cm-table {
-      table-layout: fixed;
+    .index-table {
+      @extend .table, .table-hover;
+      border: 1px solid $grey-lighter-clr;
       position: relative;
       min-width: 720px;
-      border-collapse: collapse;
-      border: 1px solid $grey-lighter-clr;
-      border-top-width: 0;
-      border-radius: $radius-8;
-      &__header {
-        .header-row {
-          display: block;
-          width: 100%;
-          position: relative;
-          box-shadow: inset 0px -1px 0px rgba(148, 151, 155, 0.15);
-          border-top: 1px solid $grey-lighter-clr;
-          th {
-            @include font($size: $t6-text, $color: $ink-lighter-clr, $weight: bold);
-            text-transform: uppercase;
-            min-width: 200px;
-            max-width: 200px;
-            padding: 12px 16px 12px 16px;
-          }
-          th:nth-child(1) {
-            position: sticky;
-            left: 0;
-            z-index: 2;
-            background-color: $white;
-            border-bottom: 1.21px solid rgb(240, 239, 239);
-          }
-          .check-box-space {
-            position: sticky;
-            left: 0;
-            min-width: fit-content;
-            max-width: fit-content;
-            padding: 12px 8px 12px 16px;
-            z-index: 2;
-            background-color: $white;
-            border-bottom: 1.21px solid rgb(240, 239, 239);
-            span {
-              vertical-align: text-top;
-            }
-          }
+      margin: 0;
+      thead {
+        position: sticky;
+        top: 0;
+        z-index: 4;
+        background-color: $white;
+        th {
+          font-size: 12px;
+          min-width: 120px;
+          max-width: 240px;
+        }
+        th:nth-child(1) {
+          position: sticky;
+          left: 0;
+          z-index: 2;
+          background-color: $white;
+        }
+        th:nth-child(2) {
+          position: sticky;
+          left: 32px;
+          z-index: 2;
+          background-color: $white;
         }
       }
-      &__body {
-        display: block;
-        position: relative;
-        width: 100%;
-        background-color: $white;
-        .body-row {
-          display: flex;
-          border-bottom: 1.21px solid rgb(240, 239, 239);
-          td:nth-child(1) {
-            position: sticky;
-            left: 0;
-            z-index: 2;
-            background-color: $white;
-          }
-          &:nth-last-child(1) {
-            box-shadow: none;
-          }
+
+      tbody {
+        tr {
+          border-bottom: 1px solid var(--bs-border-color);
           &:hover {
-            background-color: $grey-lighter-clr;
-            td:nth-child(1) {
-              background-color: $grey-lighter-clr;
-            }
             .row-action-cell {
-              display: inline-block;
-            }
-          }
-          .check-box-space {
-            position: sticky;
-            left: 0;
-            min-width: fit-content;
-            max-width: fit-content;
-            padding: 16px 8px 16px 16px;
-            z-index: 2;
-            background-color: $white;
-            span {
-              vertical-align: text-top;
+              visibility: visible;
             }
           }
-          td {
-            @include font($size: $t4-text, $color: $primary-text-clr);
-            min-width: 200px;
-            max-width: 200px;
-            padding: 16px;
-          }
-          .row-action-cell {
-            position: sticky;
-            right: 0;
-            width: 88px;
-            max-width: inherit;
-            min-width: inherit;
-            height: 53px;
-            padding: 0;
-            background: $gradient-one;
-            display: none;
-            transition: all 0.1s linear;
-            z-index: 3;
-            .row-action-tool {
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              height: 100%;
-              .popup-card {
-                .popup-option {
-                  a {
-                    @include font($size: $t4-text, $color: $ink-regular-clr, $weight: 500);
-                    line-height: 22px;
-                  }
-                }
-                button {
-                  background: none;
-                  border: none;
-                  width: 100%;
-                  text-align: left;
-                  padding: 0px;
-                }
+        }
+        td {
+          font-size: $t4-text;
+          min-width: 120px;
+          max-width: 240px;
+        }
+        td:nth-child(1) {
+          position: sticky;
+          left: 0;
+          z-index: 2;
+          background-color: $white;
+        }
+        td:nth-child(2) {
+          position: sticky;
+          left: 32px;
+          z-index: 2;
+          background-color: $white;
+        }
+      }
+
+      .check-box-space {
+        min-width: 32px;
+        max-width: 32px;
+        font-size: $t4-text;
+      }
+
+      .row-action-cell {
+        position: sticky;
+        right: 0;
+        max-width: inherit;
+        min-width: inherit;
+        padding: 4px;
+        background: $gradient-one;
+        visibility: hidden;
+        z-index: 3;
+        .row-action-tool {
+          .popup-card {
+            .popup-option {
+              a {
+                @include font($size: $t4-text, $color: $ink-regular-clr, $weight: 500);
+                line-height: 22px;
               }
             }
           }
         }
       }
     }
-    .cm-table > thead {
-      position: sticky;
-      top: 0;
-      background-color: $white;
-      z-index: 4;
-    }
   }
 
   // table-column-modal
@@ -266,7 +220,7 @@
     bottom: 0;
     left: 0;
     border: 1px solid $grey-lighter-clr;
-    box-shadow: inset 0px 1px 0px rgba(148, 151, 155, 0.3);
+    box-shadow: 0px 1px 0px 0px rgba(148, 151, 155, 0.3) inset;
     z-index: 2;
     .count-text {
       @include font($size: $t4-text, $color: var(--bs-body-color));
@@ -281,11 +235,52 @@
   }
 }
 
-//Nested table styles
+[data-field-type="money"] {
+  text-align: right;
+}
+
+//Nested show table styles
 .nested-table-wrapper {
   overflow-y: scroll;
   .nested-table {
     @extend .table, .table-light, .table-hover, .table-bordered;
     width: max-content;
   }
+  th,
+  td {
+    min-width: 120px;
+    max-width: 240px;
+  }
+}
+
+//Nested form table styles
+.nested-form-table-wrapper {
+  overflow-y: scroll;
+  .nested-form-table {
+    @extend .table, .table-light, .table-hover, .table-bordered, .m-0;
+    width: max-content;
+    .item-delete-cell {
+      vertical-align: middle;
+      text-align: center;
+    }
+  }
+  th:nth-child(1) {
+    min-width: 47px;
+    max-width: 47px;
+  }
+  td:nth-child(1) {
+    min-width: 47px;
+    max-width: 47px;
+  }
+  th,
+  td {
+    min-width: 120px;
+    max-width: 240px;
+  }
+}
+
+.nested-table-footer {
+  padding: 8px;
+  border: 1px solid var(--bs-border-color);
+  border-top: 0;
 }

data/app/assets/stylesheets/cm_admin/cm_admin.css.scss

@@ -22,6 +22,7 @@
  *= require 'cm_admin/base/auth'
  *= require 'cm_admin/base/filters'
  *= require 'cm_admin/base/common'
+ *= require 'cm_admin/base/cardView'
  *= require 'cm_admin/components/index'
  *= require 'cm_admin/dependency/bootstrap.min'
  *= require 'cm_admin/dependency/flatpickr.min'
@@ -29,4 +30,4 @@
  *= require 'cm_admin/dependency/jquery-jgrowl.min'
  *= require 'cm_admin/scaffold'
  *= require_self
- */
+ */

data/app/controllers/cm_admin/resource_controller.rb

@@ -172,7 +172,7 @@ module CmAdmin
 
     def resource_identifier
       @ar_object, @associated_model, @associated_ar_object = custom_controller_action(action_name, params.permit!) if !@ar_object.present? && params[:id].present?
-      authorize controller_name.classify.constantize, policy_class: "CmAdmin::#{controller_name.classify}Policy".constantize if defined? "CmAdmin::#{controller_name.classify}Policy".constantize
+      authorize @ar_object, policy_class: "CmAdmin::#{controller_name.classify}Policy".constantize if defined? "CmAdmin::#{controller_name.classify}Policy".constantize
       aar_model = request.url.split('/')[-2].classify.constantize  if params[:aar_id]
       @associated_ar_object = aar_model.find(params[:aar_id]) if params[:aar_id]
       nested_fields = get_nested_table_fields(@model.available_fields[:new])

data/app/helpers/cm_admin/application_helper.rb

@@ -6,9 +6,11 @@ module CmAdmin
     end
 
     # Allow if policy is not defined.
-    def has_valid_policy(model_name, action_name)
-      return true unless policy([:cm_admin, model_name.classify.constantize]).methods.include?(:"#{action_name}?")
-      policy([:cm_admin, model_name.classify.constantize]).send(:"#{action_name}?")
+    def has_valid_policy(ar_object, action_name)
+      policy_object = ar_object.instance_of?(OpenStruct) ? @model.name.classify.constantize : ar_object
+      return true unless policy([:cm_admin, policy_object]).methods.include?(:"#{action_name}?")
+      
+      policy([:cm_admin, policy_object]).send(:"#{action_name}?")
     end
 
     def action(action_name)
@@ -63,14 +65,14 @@ module CmAdmin
       end
     end
 
-    def is_show_action_available(model)
+    def is_show_action_available(model, ar_object)
       model &&
       model.available_actions.map(&:name).include?('show') &&
-      has_valid_policy(model.name, 'show')
+      has_valid_policy(ar_object, 'show')
     end
 
-    def actions_filter(model, action_type)
-      model.available_actions.select { |action| action.action_type == action_type && has_valid_policy(model.name, action.name) }
+    def actions_filter(model, ar_object, action_type)
+      model.available_actions.select { |action| action.action_type == action_type && has_valid_policy(ar_object, action.name) }
     end
   end
 end

data/app/javascript/packs/cm_admin/scaffolds.js

@@ -20,5 +20,5 @@ $(document).on('turbolinks:load', function () {
   }
   var headerElemHeight = $('.page-top-bar').height() + 64
   var calculatedHeight = "calc(100vh - " + headerElemHeight+"px"+")"
-  $('.new-admin-table').css("maxHeight", calculatedHeight);
+  $('.table-wrapper').css("maxHeight", calculatedHeight);
 });

data/app/views/cm_admin/main/_actions_dropdown.html.slim

@@ -1,6 +1,6 @@
-- edit_action = available_actions(cm_model, 'edit')
-- destroy_action = available_actions(cm_model, 'destroy')
-- custom_actions = available_actions(cm_model, 'custom_actions')
+- edit_action = available_actions(cm_model, ar_object, 'edit')
+- destroy_action = available_actions(cm_model, ar_object, 'destroy')
+- custom_actions = available_actions(cm_model, ar_object, 'custom_actions')
 - current_model = @associated_model || @model
 - if custom_actions.any? || edit_action.present? || destroy_action.present?
   td.row-action-cell

data/app/views/cm_admin/main/_associated_table.html.slim

@@ -4,7 +4,7 @@
       == render partial: 'cm_admin/main/filters', locals: { filters: @associated_model.filters }
   p.table-top__total-count = "#{humanized_ar_collection_count(@associated_ar_object.pagy.count, @action.child_records.to_s)}"
   .table-top__column-action
-    - if @associated_model && @associated_model.available_actions.map(&:name).include?('new') && has_valid_policy(@associated_model.name, 'new')
+    - if @associated_model && @associated_model.available_actions.map(&:name).include?('new') && has_valid_policy(@associated_ar_object, 'new')
       - association = @ar_object.class.reflect_on_all_associations.select{|x| x.name == @associated_model.name.tableize.to_sym }.first
       - polymorphic_name = (association && association.inverse_of && association.inverse_of.options[:polymorphic]) ? association.inverse_of.name : ''
       a href="#{CmAdmin::Engine.mount_path}/#{@associated_model.name.tableize}/new?associated_id=#{@ar_object.id}&associated_class=#{@ar_object.class.name.underscore}&polymorphic_name=#{polymorphic_name}&referrer=#{request.path}"
@@ -20,13 +20,13 @@
 - elsif flash[:notice].present?
   .alert.alert-success
     = flash[:notice].html_safe
-- bulk_actions = actions_filter(@associated_model, :bulk_action)
+- bulk_actions = actions_filter(@associated_model, @associated_ar_object, :bulk_action)
 - if bulk_actions.present?
   .table-top.hidden data-section="bulk-action"
     - bulk_actions.each do |action|
       = custom_action_items(action, 'index')
-.new-admin-table.scrollable
-  table.cm-table
+.table-wrapper
+  table.index-table
     thead.cm-table__header
       tr.header-row
         - if bulk_actions.present?
@@ -47,7 +47,7 @@
             - if column.display_if.call(Current.user) && column.viewable
               td class="text-ellipsis"
                 span class="#{column.field_type.to_s} #{column.cm_css_class} "
-                  - if index == 0 && is_show_action_available(@associated_model)
+                  - if index == 0 && is_show_action_available(@associated_model, ar_object)
                     a href="#{CmAdmin::Engine.mount_path}/#{@associated_model.name.tableize}/#{ar_object.id}" = show_field_value(ar_object, column)
                   - else
                     = show_field_value(ar_object, column)
@@ -57,9 +57,7 @@
           - if @associated_model
             == render partial: 'cm_admin/main/actions_dropdown', locals: { cm_model: @associated_model, ar_object: ar_object }
 
-  .cm-pagination
-    .cm-pagination__lhs Showing #{@associated_ar_object.pagy.from} to #{@associated_ar_object.pagy.to} out of #{@associated_ar_object.pagy.count}
-    .cm-pagination__rhs
-      == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @associated_ar_object.pagy }
-
+  .pagination-bar
+    p.count-text.m-0 Showing #{@associated_ar_object.pagy.from} to #{@associated_ar_object.pagy.to} out of #{@associated_ar_object.pagy.count}
+    == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @associated_ar_object.pagy }
 = render partial: 'cm_admin/main/member_custom_action_modal', locals: { cm_model: @associated_model, ar_collection: @associated_ar_object }

data/app/views/cm_admin/main/_card.html.slim

@@ -0,0 +1,71 @@
+// Card view right now is application specific, so card partial will be overwritten in the application
+
+.table-top
+  p.table-top__total-count = "#{humanized_ar_collection_count(@ar_object.pagy.count, @model.ar_model.table_name)}"
+  .table-top__column-action
+    .btn-group[role="group" aria-label="Basic example"]
+      a.btn.btn-ghost href="#{cm_admin.send("#{@model.name.underscore}_index_path")}?page=#{params[:page] || 1}"
+        i.fa.fa-table
+      a.btn.btn-ghost href="#{cm_admin.send("#{@model.name.underscore}_index_path")}?page=#{params[:page] || 1}&list_type=card"
+        i.fa.fa-table-cells
+  /  button.secondary-btn.column-btn data-bs-target="#columnActionModal" data-bs-toggle="modal"
+  /    span
+  /      i.fa.fa-columns.bolder
+  /    span
+  /      i.fa.fa-angle-down
+- if flash[:alert].present?
+  .alert.alert-danger role="alert"
+    = flash[:alert].html_safe
+- elsif flash[:notice].present?
+  .alert.alert-success
+    = flash[:notice].html_safe
+
+- bulk_actions = actions_filter(@model, @ar_object, :bulk_action)
+- if bulk_actions.present?
+  .table-top.hidden data-section="bulk-action"
+    - bulk_actions.each do |action|
+      = custom_action_items(action, 'index')
+.card-list-container
+  .card-grid
+    - @ar_object.data.each_slice(3) do |chunk|
+      - chunk.each do |ar_object|
+        .col
+          .item-card
+            .card-menu
+              .row-action-cell
+                == render partial: 'cm_admin/main/actions_dropdown', locals: { cm_model: @model, ar_object: ar_object }
+            img.card-img-top[src="https://images.unsplash.com/photo-1658211312038-4293c7bdd37e?auto=format&fit=crop&q=80&w=3280&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="..."]
+            .card-body
+              - @model.available_fields[:index].each_with_index do |column, index|
+                - if column.display_if.call(Current.user) && column.viewable
+                  - if index == 0 && is_show_action_available(@model, ar_object) && !([:link, :custom, :attachment, :drawer, :image].include?(column.field_type))
+                    h6.card-title
+                      | Coffee table
+                    .card-subtitle
+                      p.item-id
+                        | TB-6910 
+                        span 
+                          | Table
+                      p.m-0
+                        | Nadim
+                    / h6.card-title
+                    /   = link_to ar_object.send(column.field_name), cm_admin.send("#{ar_object.model_name.singular}_show_path", ar_object.id)
+                  - else
+                    p.card-text
+                      = show_field_value(ar_object, column)
+                      - if column.field_type == :drawer
+                        = render partial: column.drawer_partial, locals: { ar_object: ar_object }
+            .card-footer 
+              p.item-price
+                | L.E 100,000
+              .item-status  
+                span.status-tag.danger
+                  | Out of stock
+                span.status-tag.active.ms-1
+                  | Active
+                
+  .pagination-bar
+    p.count-text.m-0 Showing #{@ar_object.pagy.from} to #{@ar_object.pagy.to} out of #{@ar_object.pagy.count}
+    == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @ar_object.pagy }
+
+/ = render partial: 'cm_admin/main/member_custom_action_modal', locals: { cm_model: @model, ar_collection: @ar_object }

data/app/views/cm_admin/main/_member_custom_action_modal.html.slim

@@ -1,4 +1,4 @@
-- custom_actions = available_actions(cm_model, 'custom_actions')
+- custom_actions = available_actions(cm_model, ar_object, 'custom_actions')
 - custom_actions_modals = custom_actions.select{ |act| act if act.display_type.eql?(:modal) }
 - ar_collection.data.each do |ar_object|
   - if custom_actions_modals.any?
@@ -10,4 +10,7 @@
               h5.modal-title id="#{custom_action.name.classify}ModalLabel" = custom_action_title(custom_action)
               button.btn-close aria-label='Close' data-bs-dismiss='modal'
             .modal-body
-              = render partial: custom_action.partial, locals: { ar_object: ar_object }
+              - if custom_action.partial
+                = render partial: custom_action.partial
+              - else
+                = render partial: 'cm_admin/main/custom_action_modal_form', locals: { custom_action: custom_action, ar_object: ar_object }

data/app/views/cm_admin/main/_nested_fields.html.slim

@@ -3,7 +3,7 @@
     td.item-delete-cell
       = link_to_remove_association "", f, class: 'fa-regular fa-trash-can btn-ghost'
     - nested_table_field.fields.each do |field|
-      td 
+      td data-field-type="#{field.input_type}"
         = input_field_for_column(f, field)
 - else
   .form-card.nested-fields

data/app/views/cm_admin/main/_nested_table_form.html.slim

@@ -11,7 +11,7 @@
             th
               | 
             - nested_table_field.fields.each do |field|
-              th
+              th data-field-type="#{field.input_type}"
                 = field.field_name.to_s.titleize 
         tbody class="insert-cocoon-position-#{uniq_no}"
           = f.fields_for table_name do |record|

data/app/views/cm_admin/main/_nested_table_section.html.slim

@@ -3,22 +3,22 @@
   div class="#{nested_field.label ? 'card-info' : ''}"
     - if nested_field.label
       p.card-info__label = nested_field.label.to_s.titleize
-    .card-info__description.nested-table-wrapper
+    .card-info__description.nested-table-wrapper data-table-name="#{nested_field.field_name}"
       table.nested-table
         thead
           tr
             - nested_field.fields.each do |field|
-              th scope="col"
+              th scope="col" data-field-type="#{field.field_type}"
                 = field.label || field.field_name.to_s.titleize
         tbody
           - associated_records.each do |record|
             tr
               - nested_field.fields.each do |field|
-                td
+                td data-field-type="#{field.field_type}"
                   = record.send(field.field_name)
 - else
   - associated_records.each do |record|
-    .card.mb-3
+    .card.mb-3  data-table-name="#{nested_field.field_name}"
       .card-body
         .card-info
           .card-info__title = nested_section_title(record, nested_field)

data/app/views/cm_admin/main/_table.html.slim

@@ -1,6 +1,12 @@
 .table-top
   p.table-top__total-count = "#{humanized_ar_collection_count(@ar_object.pagy.count, @model.ar_model.table_name)}"
-  / .table-top__column-action
+  .table-top__column-action
+    - if @current_action.card_layout
+      .btn-group[role="group" aria-label="Card Toggle"]
+        a.btn.btn-ghost href="#{cm_admin.send("#{@model.name.underscore}_index_path")}?page=#{params[:page] || 1}"
+          i.fa.fa-table
+        a.btn.btn-ghost href="#{cm_admin.send("#{@model.name.underscore}_index_path")}?page=#{params[:page] || 1}&list_type=card"
+          i.fa.fa-table-cells
   /  button.secondary-btn.column-btn data-bs-target="#columnActionModal" data-bs-toggle="modal"
   /    span
   /      i.fa.fa-columns.bolder
@@ -13,42 +19,39 @@
   .alert.alert-success
     = flash[:notice].html_safe
 
-- bulk_actions = actions_filter(@model, :bulk_action)
+- bulk_actions = actions_filter(@model, @ar_object, :bulk_action)
 - if bulk_actions.present?
   .table-top.hidden data-section="bulk-action"
     - bulk_actions.each do |action|
       = custom_action_items(action, 'index')
-.new-admin-table
-  table.cm-table
-    thead.cm-table__header
-      tr.header-row
+.table-wrapper
+  table.index-table
+    thead
+      tr
         - if bulk_actions.present?
           th.check-box-space
-            span
-              input.cm-checkbox type="checkbox" data-behaviour="bulk-action-select-all"
+            input.form-check-input type="checkbox" data-behaviour="bulk-action-select-all"
         - @model.available_fields[:index].each do |column|
           - if column.display_if.call(Current.user) && column.viewable
-            th = column.header
-    tbody.cm-table__body
+            th data-field-type="#{column.field_type}" = column.header
+        th
+    tbody
       - @ar_object.data.each do |ar_object|
         tr.body-row
           - if bulk_actions.present?
             td.check-box-space
-              span
-                input.cm-checkbox type="checkbox"  data-behaviour="bulk-action-checkbox" data-ar-object-id="#{ar_object.id}"
+              input.form-check-input type="checkbox" data-behaviour="bulk-action-checkbox" data-ar-object-id="#{ar_object.id}"
           - @model.available_fields[:index].each_with_index do |column, index|
             - if column.display_if.call(Current.user) && column.viewable
-              td.text-ellipsis
-                span class="#{column.field_type.to_s} #{column.cm_css_class} "
-                  - if index == 0 && is_show_action_available(@model) && !([:link, :custom, :attachment, :drawer, :image].include?(column.field_type))
-                    = link_to ar_object.send(column.field_name), cm_admin.send("#{ar_object.model_name.singular}_show_path", ar_object.id)
-                  - else
-                    = show_field_value(ar_object, column)
-                    - if column.field_type == :drawer
-                      = render partial: column.drawer_partial, locals: { ar_object: ar_object }
+              td.text-ellipsis data-field-type="#{column.field_type || 'string'}"
+                - if index == 0 && is_show_action_available(@model, ar_object) && !([:link, :custom, :attachment, :drawer, :image].include?(column.field_type))
+                  = link_to ar_object.send(column.field_name), cm_admin.send("#{ar_object.model_name.singular}_show_path", ar_object.id)
+                - else
+                  = show_field_value(ar_object, column)
+                  - if column.field_type == :drawer
+                    = render partial: column.drawer_partial, locals: { ar_object: ar_object }
           - if @model
             == render partial: 'cm_admin/main/actions_dropdown', locals: { cm_model: @model, ar_object: ar_object }
-
   .pagination-bar
     p.count-text.m-0 Showing #{@ar_object.pagy.from} to #{@ar_object.pagy.to} out of #{@ar_object.pagy.count}
     == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @ar_object.pagy }

data/app/views/cm_admin/main/_top_navbar.html.slim

@@ -8,7 +8,7 @@
       p.mb-0.text-body-secondary = @model.current_action.page_description
   .entity-header__actions
     - if @model.current_action.name == 'index'
-      - if has_valid_policy(@model.name, :exportable)
+      - if has_valid_policy(@ar_object, :exportable)
         .export-container
           .dropdown
             button.btn-secondary.dropdown-toggle data-bs-toggle='dropdown'
@@ -18,10 +18,10 @@
               li
                 .popup-option.pointer data-bs-toggle='modal' data-bs-target='#exportmodal'
                   span Export
-      - if @model.importer && has_valid_policy(@model.name, :importable)
+      - if @model.importer && has_valid_policy(@ar_object, :importable)
         = link_to 'Import', cm_admin.send(:"#{@model.name.underscore}_import_path"), class: 'btn-primary ms-2'
       - new_action = @model.available_actions.select{|act| act if act.action_type.eql?(:default) && act.name.eql?('new')}
-      - if new_action.any? && policy([:cm_admin, @model.name.classify.constantize]).new?
+      - if new_action.any? && has_valid_policy(@ar_object, 'new')
         = link_to 'Add', cm_admin.send(:"#{@model.name.underscore}_new_path"), class: 'btn-primary ms-2'
       - @model.available_actions.select{|act| act if act.route_type == 'collection'}.each do |custom_action|
         = custom_action_items(custom_action, 'index')
@@ -30,8 +30,8 @@
         = custom_action_items(custom_action, 'show')
 
       - edit_action = @model.available_actions.select{|act| act if act.action_type.eql?(:default) && act.name.eql?('edit')}
-      - destroy_action = available_actions(@model, 'destroy')
-      - if edit_action.any? && policy([:cm_admin, @model.name.classify.constantize]).edit?
+      - destroy_action = available_actions(@model, @ar_object, 'destroy')
+      - if edit_action.any? && has_valid_policy(@ar_object, 'edit')
         = link_to cm_admin.send(:"#{@model.name.underscore}_edit_path", @ar_object), class: 'btn-primary ms-2' do
           span
             i.fa.fa-edit

data/app/views/cm_admin/main/index.html.slim

@@ -8,6 +8,8 @@
   .cm-index-page__table-container
     - if @action.partial
       == render @action.partial
+    - elsif params[:list_type] == 'card'
+      == render 'cm_admin/main/card'
     - else
       == render 'cm_admin/main/table'
   = column_pop_up(@model)

data/app/views/cm_admin/main/new.html.slim

@@ -10,7 +10,7 @@
             | Attention
         .alert-body
           p.body-title 
-            | Error saving #{@ar_object.class}
+            | Error: unable to save #{@ar_object.class.downcase}
           p.body-info
             ul
               - @ar_object.errors.full_messages.each do |error_message|

data/app/views/layouts/_custom_action_modals.html.slim

@@ -1,6 +1,6 @@
 - custom_action_with_modals = @model.available_actions.select{ |act| act if act.display_type == :modal && act.action_type == :custom }
 - bulk_action_with_modals = @model.available_actions.select{ |act| act if act.display_type == :modal && act.action_type == :bulk_action }
-- destroy_action = available_actions(@model, 'destroy')
+- destroy_action = available_actions(@model, @ar_object, 'destroy')
 - if @associated_model
   - custom_action_with_modals += @associated_model.available_actions.select{ |act| act if act.display_type == :modal }
 - if @current_action&.name == 'index'

data/lib/cm_admin/models/action.rb

@@ -6,7 +6,7 @@ module CmAdmin
       include Actions::Blocks
       attr_accessor :name, :display_name, :verb, :layout_type, :layout, :partial, :path, :page_title, :page_description,
         :child_records, :is_nested_field, :nested_table_name, :parent, :display_if, :route_type, :code_block,
-        :display_type, :action_type, :redirection_url, :sort_direction, :sort_column, :icon_name, :scopes
+        :display_type, :action_type, :redirection_url, :sort_direction, :sort_column, :icon_name, :scopes, :card_layout
 
       VALID_SORT_DIRECTION = Set[:asc, :desc].freeze
 
@@ -39,13 +39,14 @@ module CmAdmin
         self.verb = :get
         self.route_type = nil
         self.display_type = nil
-
+        self.card_layout = false
       end
 
-      def set_values(page_title, page_description, partial)
+      def set_values(page_title, page_description, partial, card_layout=false)
         self.page_title = page_title
         self.page_description = page_description
         self.partial = partial
+        self.card_layout = card_layout
       end
 
       def controller_action_name

data/lib/cm_admin/models/column.rb

@@ -43,6 +43,7 @@ module CmAdmin
         self.lockable = false
         self.viewable = true
         self.tag_class = {}
+        self.field_type = :string
       end
 
       class << self

data/lib/cm_admin/models/dsl_method.rb

@@ -3,9 +3,9 @@ module CmAdmin
     module DslMethod
       extend ActiveSupport::Concern
 
-      def cm_index(page_title: nil, page_description: nil, partial: nil, &block)
+      def cm_index(page_title: nil, page_description: nil, partial: nil, card_layout: false, &block)
         @current_action = CmAdmin::Models::Action.find_by(self, name: 'index')
-        @current_action.set_values(page_title, page_description, partial)
+        @current_action.set_values(page_title, page_description, partial, card_layout)
         yield
       end
 

data/lib/cm_admin/models/field.rb

@@ -25,6 +25,7 @@ module CmAdmin
       def set_default_values
         self.tag_class = {}
         self.col_size = nil
+        self.field_type = :string
       end
     end
   end

data/lib/cm_admin/version.rb

@@ -1,3 +1,3 @@
 module CmAdmin
-  VERSION = '1.3.0'
+  VERSION = '1.3.2'
 end

data/lib/cm_admin/view_helpers/action_dropdown_helper.rb

@@ -1,19 +1,19 @@
 module CmAdmin
   module ViewHelpers
     module ActionDropdownHelper
-      def available_actions(cm_model, action_type)
+      def available_actions(cm_model, ar_object, action_type)
         if action_type.eql?('custom_actions')
           cm_model.available_actions.select {
             |act| act if act.route_type.eql?('member') &&
                          [:button, :modal].include?(act.display_type) &&
                          act.name.present? &&
-                         has_valid_policy(cm_model.name, act.name)
+                         has_valid_policy(ar_object, act.name)
           }
         else
           cm_model.available_actions.select {
             |act| act if act.action_type.eql?(:default) &&
                          act.name.eql?(action_type)
-          } if has_valid_policy(cm_model.name, action_type)
+          } if has_valid_policy(ar_object, action_type)
         end
       end
     end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: cm-admin
 version: !ruby/object:Gem::Version
-  version: 1.3.0
+  version: 1.3.2
 platform: ruby
 authors:
 - sajinmp
@@ -10,7 +10,7 @@ authors:
 autorequire:
 bindir: exe
 cert_chain: []
-date: 2023-10-20 00:00:00.000000000 Z
+date: 2023-11-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -201,6 +201,7 @@ files:
 - app/assets/javascripts/cm_admin/scaffolds.js
 - app/assets/javascripts/cm_admin/shared_scaffolds.js
 - app/assets/stylesheets/cm_admin/base/auth.scss
+- app/assets/stylesheets/cm_admin/base/cardView.scss
 - app/assets/stylesheets/cm_admin/base/common.scss
 - app/assets/stylesheets/cm_admin/base/filters.scss
 - app/assets/stylesheets/cm_admin/base/form.scss
@@ -348,6 +349,7 @@ files:
 - app/policies/cm_admin/file_import_policy.rb
 - app/views/cm_admin/main/_actions_dropdown.html.slim
 - app/views/cm_admin/main/_associated_table.html.slim
+- app/views/cm_admin/main/_card.html.slim
 - app/views/cm_admin/main/_cm_pagy_nav.html.slim
 - app/views/cm_admin/main/_custom_action_modal_form.html.slim
 - app/views/cm_admin/main/_drawer.html.slim