zen_admin 0.9.2

data/app/views/zen_admin/ui/resources/_form.html.erb

@@ -0,0 +1,226 @@
+<%= turbo_frame_tag "modal" do %>
+  <div class="modal fade" tabindex="-1" data-controller="modal" data-action="turbo:submit-end->modal#submitEnd">
+    <div class="modal-dialog modal-lg modal-dialog-centered">
+      <div class="modal-content border-0 shadow-lg overflow-hidden" style="border-radius: 12px; display: flex; flex-direction: column; max-height: 90vh;">
+        <% # Modal Header - 固定在顶部 %>
+        <div class="modal-header bg-light py-3 border-bottom-0 flex-shrink-0">
+          <div class="d-flex align-items-center">
+            <div class="bg-primary text-white rounded-3 d-flex align-items-center justify-content-center me-3" style="width: 40px; height: 40px;">
+              <i class="fas <%= @record.persisted? ? 'fa-edit' : 'fas fa-plus' %>"></i>
+            </div>
+            <div>
+              <h4 class="modal-title fw-bold text-dark mb-0">
+                <%= @record.persisted? ? t('zen_admin.actions.edit') : t('zen_admin.actions.new', resource: @resource.label) %>
+              </h4>
+              <p class="text-muted small mb-0"><%= @resource.model_name %></p>
+            </div>
+          </div>
+          <button type="button" class="btn btn-sm btn-light border-0 rounded-circle shadow-none" data-action="modal#close" aria-label="Close" style="width: 32px; height: 32px; padding: 0;">
+            <i class="fas fa-times text-muted"></i>
+          </button>
+        </div>
+        
+        <%= form_with model: [@resource.name.to_sym, @record], 
+                      url: @record.persisted? ? ui_resource_path(@resource.name, @record) : ui_resource_index_path(@resource.name), 
+                      method: @record.persisted? ? :patch : :post,
+                      class: "d-flex flex-column overflow-hidden" do |form| %>
+          
+          <% # Modal Body - 开启滚动区域 %>
+          <div class="modal-body p-4 flex-grow-1" style="overflow-y: auto;">
+            <% # Error Messages %>
+            <% if @record.errors.any? %>
+              <div class="alert alert-danger border-0 shadow-sm mb-4" role="alert">
+                <div class="d-flex">
+                  <i class="fas fa-exclamation-circle fs-4 me-3 mt-1"></i>
+                  <div>
+                    <h6 class="fw-bold mb-1"><%= t('zen_admin.ui.errors') %></h6>
+                    <ul class="mb-0 small">
+                      <% @record.errors.each do |error| %>
+                        <li><%= error.full_message %></li>
+                      <% end %>
+                    </ul>
+                  </div>
+                </div>
+              </div>
+            <% end %>
+
+            <div class="row g-4">
+              <% @resource.form_fields.each do |field| %>
+                <div class="col-12">
+                  <label class="form-label fw-bold text-dark mb-2 d-flex align-items-center">
+                    <%= field.label %>
+                    <% if field.required %>
+                      <span class="text-danger ms-1">*</span>
+                    <% end %>
+                  </label>
+                  
+                  <div class="field-container">
+                    <% case field.type.to_sym %>
+                    <% when :password %>
+                      <%= form.password_field field.name, class: 'form-control form-control-lg fs-6', placeholder: "请输入 #{field.label}..." %>
+                    <% when :text %>
+                      <%= form.text_area field.name, class: 'form-control fs-6', rows: 4, placeholder: "请输入 #{field.label}内容..." %>
+                    <% when :select %>
+                      <% collection = field.options[:collection] %>
+                      <% collection = collection.call if collection.respond_to?(:call) %>
+                      <% selected_value = @record.send(field.name) || (collection.first[1] if !@record.persisted? && collection.any?) rescue nil %>
+                      <%= form.select field.name, collection, { selected: selected_value, include_blank: "请选择..." }, { class: 'form-select form-select-lg fs-6' } %>
+                    <% when :radio %>
+                      <div class="zen-radio-group d-flex flex-wrap gap-2 mt-1">
+                        <% collection = field.options[:collection] %>
+                        <% collection = collection.call if collection.respond_to?(:call) %>
+                        <% 
+                          current_val = @record.send(field.name)
+                          # 如果当前值为空，则标记第一个为默认选中
+                          should_default = current_val.nil? || (current_val.respond_to?(:empty?) && current_val.empty?)
+                        %>
+                        <% collection.each_with_index do |(label, value), idx| %>
+                          <% unique_id = "#{field.name}_#{value}_#{@record.object_id}" %>
+                          <% checked = should_default ? (idx == 0) : (current_val.to_s == value.to_s) %>
+                          <div class="zen-radio-item">
+                            <input type="radio" 
+                                   name="<%= form.object_name %>[<%= field.name %>]" 
+                                   value="<%= value %>" 
+                                   id="<%= unique_id %>" 
+                                   class="zen-radio-input"
+                                   <%= 'checked' if checked %>>
+                            <label for="<%= unique_id %>" class="zen-radio-label">
+                              <%= label %>
+                            </label>
+                          </div>
+                        <% end %>
+                      </div>
+                    <% when :multi_select %>
+                      <% collection = field.options[:collection] %>
+                      <% collection = collection.call if collection.respond_to?(:call) %>
+                      <% selected_values = @record.send(field.name).presence || ([] if @record.persisted?) rescue [] %>
+                      <div class="zen-ts-container">
+                        <%= form.select field.name, collection, { selected: selected_values }, { multiple: true, data: { controller: 'tom-select' } } %>
+                      </div>
+                    <% when :file %>
+                      <div class="image-upload-wrapper">
+                        <% attachment = @record.send(field.name) rescue nil %>
+                        <% has_image = attachment.respond_to?(:attached?) && attachment.attached? && attachment.representable? %>
+                        <div class="dropzone-area text-center p-4 border-2 border-dashed rounded-3 bg-light position-relative" style="cursor: pointer; transition: all 0.3s;">
+                          <label for="<%= "#{field.name}_input" %>" class="w-100 m-0 cursor-pointer">
+                            <% if has_image && @record.persisted? %>
+                              <div class="preview-container mb-3 text-center">
+                                <%= image_tag main_app.url_for(attachment), class: "img-fluid rounded shadow", style: "max-height: 180px;" %>
+                              </div>
+                              <div class="btn btn-sm btn-white border shadow-sm fw-bold">
+                                <i class="fas fa-sync-alt me-1 text-primary"></i> <%= t('zen_admin.ui.change_image') %>
+                              </div>
+                            <% else %>
+                              <div class="py-3 text-muted">
+                                <div class="icon-circle bg-white shadow-sm mx-auto mb-3 d-flex align-items-center justify-content-center rounded-circle" style="width: 64px; height: 64px;">
+                                  <i class="fas fa-cloud-upload-alt fa-lg text-primary"></i>
+                                </div>
+                                <h6 class="fw-bold text-dark mb-1"><%= t('zen_admin.ui.click_to_upload', field: field.label) %></h6>
+                                <p class="small mb-0">支持 JPG, PNG, GIF 等格式</p>
+                              </div>
+                            <% end %>
+                          </label>
+                          <%= form.file_field field.name, class: 'd-none', id: "#{field.name}_input", 
+                              onchange: "const label = this.closest('.dropzone-area').querySelector('label');
+                                         if (this.files && this.files[0]) {
+                                           const reader = new FileReader();
+                                           reader.onload = function(e) {
+                                             label.innerHTML = `<div class='preview-container mb-3'><img src='${e.target.result}' class='img-fluid rounded shadow' style='max-height: 180px;'></div><div class='text-success fw-bold'><i class='fas fa-check-circle me-1'></i>文件已就绪</div>`;
+                                           };
+                                           reader.readAsDataURL(this.files[0]);
+                                         }" %>
+                        </div>
+                      </div>
+                    <% when :rich_text %>
+                      <div class="rich-text-container shadow-sm rounded overflow-hidden border">
+                        <%= form.rich_text_area field.name %>
+                      </div>
+                    <% else %>
+                      <%= form.text_field field.name, class: 'form-control form-control-lg fs-6', placeholder: "请输入 #{field.label}..." %>
+                    <% end %>
+                  </div>
+
+                  <% if field.options[:help] %>
+                    <div class="form-text text-muted mt-2 ps-1 small"><%= field.options[:help].html_safe %></div>
+                  <% end %>
+                </div>
+              <% end %>
+            </div>
+
+            <% # Related Records Section %>
+            <% if @record.persisted? && @resource.model.reflect_on_all_associations(:has_many).any? %>
+              <div class="mt-5 pt-4 border-top">
+                <h6 class="fw-bold text-dark mb-4 d-flex align-items-center small">
+                  <i class="fas fa-link me-2 text-primary opacity-50"></i><%= t('zen_admin.ui.related_records') %>
+                </h6>
+                <div class="row g-3">
+                  <% @resource.model.reflect_on_all_associations(:has_many).each do |assoc| %>
+                    <% next if assoc.name.to_s.include?("rich_text") || assoc.name.to_s.include?("attachments") %>
+                    <div class="col-md-6">
+                      <div class="card border shadow-none h-100 bg-white">
+                        <div class="card-header py-2 bg-light border-bottom-0">
+                          <span class="small fw-bold text-secondary"><%= assoc.name.to_s.humanize %></span>
+                        </div>
+                        <div class="card-body p-3 pt-2">
+                          <div class="list-group list-group-flush">
+                            <% associated_records = @record.send(assoc.name).limit(5) %>
+                            <% associated_records.each do |item| %>
+                              <% associated_resource = ZenAdmin::Registry.instance[item.class] %>
+                              <% display_name = item.try(:title) || item.try(:name) || "##{item.id}" %>
+                              <% if associated_resource %>
+                                <%= link_to display_name, ui_resource_path(associated_resource.name, item), data: { turbo_frame: "modal" }, class: "list-group-item list-group-item-action border-0 px-0 py-1 text-primary small" %>
+                              <% else %>
+                                <span class="list-group-item border-0 px-0 py-1 small text-dark"><%= display_name %></span>
+                              <% end %>
+                            <% end %>
+                            <% if associated_records.empty? %>
+                              <div class="py-2 text-muted fst-italic small"><%= t('zen_admin.ui.no_related_records') %></div>
+                            <% end %>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  <% end %>
+                </div>
+              </div>
+            <% end %>
+          </div>
+
+          <% # Modal Footer - 固定在底部 %>
+          <div class="modal-footer bg-light p-4 border-top-0 flex-shrink-0">
+            <button type="button" class="btn btn-link text-secondary text-decoration-none fw-bold me-auto" data-action="modal#close"><%= t('zen_admin.ui.cancel') %></button>
+            <%= form.submit t('zen_admin.ui.save'), class: "btn btn-primary px-5 py-2 fw-bold shadow-sm rounded-pill" %>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  </div>
+  
+  <style>
+    .dropzone-area:hover { border-color: var(--primary-color) !important; background-color: #f0f7ff !important; }
+    .form-control:focus, .form-select:focus { border-color: var(--primary-color); box-shadow: 0 0 0 0.25rem rgba(22, 93, 255, 0.1); }
+    .btn-white { background: #fff; }
+    .btn-white:hover { background-color: #f8f9fa; }
+    .form-control-lg, .form-select-lg { border-radius: 0.6rem; }
+    .cursor-pointer { cursor: pointer; }
+
+    /* Modern Radio Group (Segmented Control) */
+    .zen-radio-group { background: #f2f3f5; padding: 4px; border-radius: 10px; display: inline-flex !important; border: 1px solid #e5e6eb; gap: 2px !important; }
+    .zen-radio-input { display: none; }
+    .zen-radio-label { display: block; padding: 8px 24px; cursor: pointer; border-radius: 8px; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); margin-bottom: 0; font-size: 0.9rem; font-weight: 600; color: #4e5969; user-select: none; }
+    .zen-radio-input:checked + .zen-radio-label { background: #ffffff; color: var(--primary-color); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }
+
+    /* Tom Select Ant Design Overhaul */
+    .ts-wrapper.zen-ts-wrapper { min-height: 44px; border-radius: 8px; }
+    .ts-wrapper.zen-ts-wrapper.form-control { padding: 4px 12px !important; }
+    .ts-wrapper.zen-ts-wrapper .ts-control { border: none !important; padding: 0 !important; display: flex !important; align-items: center; flex-wrap: wrap; gap: 4px; }
+    .ts-wrapper.zen-ts-wrapper.focus .ts-control { box-shadow: none !important; }
+    .ts-wrapper.zen-ts-wrapper.focus { border-color: var(--primary-color) !important; box-shadow: 0 0 0 2px rgba(22, 93, 255, 0.1) !important; }
+    
+    .ts-wrapper.multi .ts-control > div { background: #f5f5f5 !important; border: 1px solid #f0f0f0 !important; color: #262626 !important; border-radius: 4px !important; padding: 2px 8px !important; margin: 0 !important; font-size: 14px !important; font-weight: 400 !important; display: inline-flex !important; align-items: center; }
+    .ts-wrapper.multi .ts-control > div .remove { border-left: none !important; margin-left: 4px !important; opacity: 0.45 !important; color: inherit !important; }
+    .ts-wrapper.multi .ts-control > div .remove:hover { opacity: 1 !important; color: #f5222d !important; }
+    .ts-dropdown { border-radius: 8px !important; box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08) !important; border: 1px solid #f0f0f0 !important; margin-top: 4px !important; }
+    .ts-dropdown .option.active { background-color: #f5f5f5 !important; color: var(--primary-color) !important; }
+  </style>
+<% end %>

data/app/views/zen_admin/ui/resources/_row.html.erb

@@ -0,0 +1,170 @@
+<tr id="<%= dom_id(record) %>" class="align-middle">
+  <% if @resource.batch_actions.is_a?(Hash) && @resource.batch_actions.any? %>
+    <td style="width: 50px;" class="text-center py-2">
+      <% unless params[:scope] == 'trash' %>
+        <div class="d-inline-flex align-items-center justify-content-center" style="vertical-align: top;">
+          <input type="checkbox" name="ids[]" value="<%= record.id %>" class="form-check-input m-0" id="check_<%= dom_id(record) %>" data-bulk-actions-target="checkbox" data-action="change->bulk-actions#toggle">
+        </div>
+      <% end %>
+    </td>
+  <% end %>
+  
+  <% @resource.list_fields.each_with_index do |field, index| %>
+    <td class="py-2 text-center">
+      <div class="d-inline-flex align-items-center justify-content-center w-100" style="vertical-align: top; min-height: 24px;">
+        <% 
+          # 1. 获取原始值
+          value = if params[:scope] == 'trash' && record.is_a?(ZenAdmin::TrashItem)
+                    record.data[field.name.to_s]
+                  else
+                    record.send(field.name) rescue nil
+                  end
+          
+          # 2. 预处理显示文本 (Smart Mapping)
+          mapped_label = if field.options[:collection]
+            collection = field.options[:collection]
+            collection = collection.call if collection.respond_to?(:call)
+            mapping_item = collection.find { |l, v| v.to_s == value.to_s }
+            mapping_item ? mapping_item[0] : value
+          elsif (value.is_a?(ActiveRecord::Associations::CollectionProxy) || value.is_a?(Array)) && params[:scope] != 'trash'
+            # 正常模式下的多对多关联
+            value.first(5).map { |i| i.try(:name) || i.try(:title) || i.to_s }.join(", ")
+          elsif params[:scope] == 'trash' && value.is_a?(Array)
+            # 回收站模式下的 JSON 数组内容
+            value.first(5).map { |i| i.is_a?(Hash) ? (i["name"] || i["title"] || i["username"]) : i.to_s }.join(", ")
+          else
+            value
+          end
+        %>
+
+        <% # 3. 渲染引擎 %>
+        <% if field.options[:formatter] %>
+          <%= instance_exec(record, mapped_label, &field.options[:formatter]) %>
+        <% else %>
+          <% if value.is_a?(ActiveRecord::Associations::CollectionProxy) || (value.is_a?(Array) && !value.first.is_a?(Hash)) %>
+            <div class="d-flex flex-wrap gap-1" style="max-width: 300px;">
+              <% value.first(5).each do |item| %>
+                <span class="badge bg-info text-white" style="font-size: 0.7rem;"><%= item.try(:name) || item.try(:title) || item.to_s %></span>
+              <% end %>
+              <% if value.count > 5 %>
+                <span class="text-muted small">+<%= value.count - 5 %></span>
+              <% end %>
+            </div>
+            
+          <% elsif value.respond_to?(:attached?) %>
+            <% if value.attached? %>
+              <% if value.representable? %>
+                <div class="thumbnail shadow-xs border rounded bg-light cursor-pointer" 
+                     style="width: 32px; height: 32px; overflow: hidden;"
+                     data-action="click->layout#previewImage"
+                     data-preview-url="<%= main_app.url_for(value) %>">
+                  <%= image_tag main_app.rails_blob_path(value, only_path: true), style: "width: 100%; height: 100%; object-fit: cover;" %>
+                </div>
+              <% else %>
+                <% # 文件图标逻辑 %>
+                <div class="text-muted d-flex align-items-center">
+                  <i class="fas <%= case value.content_type
+                                   when /pdf/ then 'fa-file-pdf text-danger'
+                                   when /word|officedocument/ then 'fa-file-word text-primary'
+                                   when /excel|sheet/ then 'fa-file-excel text-success'
+                                   when /zip|compressed/ then 'fa-file-archive text-warning'
+                                   else 'fa-file-alt'
+                                   end %> fa-lg"></i>
+                  <span class="ms-2 small text-truncate d-inline-block" style="max-width: 80px;"><%= value.filename %></span>
+                </div>
+              <% end %>
+            <% else %>
+              <span class="text-muted small">-</span>
+            <% end %>
+
+          <% elsif value.is_a?(Time) || value.is_a?(DateTime) || value.is_a?(ActiveSupport::TimeWithZone) %>
+            <% 
+              tz = ZenAdmin.configuration.try(:time_zone) || Time.zone.name
+              display_time = value.in_time_zone(tz).strftime("%Y-%m-%d %H:%M")
+            %>
+            <span class="text-muted small"><%= display_time %></span>
+
+          <% else %>
+            <% if field.options[:truncate] && mapped_label.is_a?(String) %>
+              <span class="small text-secondary text-wrap" style="max-width: 250px; display: inline-block;">
+                <%= zen_highlight(truncate(mapped_label, length: field.options[:truncate]), params[:keyword]) %>
+              </span>
+            <% else %>
+              <span class="small">
+                <%= mapped_label.is_a?(String) ? zen_highlight(mapped_label, params[:keyword]) : mapped_label %>
+              </span>
+            <% end %>
+          <% end %>
+        <% end %>
+      </div>
+    </td>
+  <% end %>
+
+  <td class="text-center py-2 text-nowrap">
+    <div class="d-flex align-items-center justify-content-center w-100">
+      <div class="btn-group btn-group-sm shadow-xs">
+        <% 
+          is_super = current_admin_user.respond_to?(:super_admin?) && current_admin_user.super_admin? 
+        %>
+        <% if params[:scope] == 'trash' %>
+          <% if is_super || current_admin_user.can?("#{@resource.name}:index") %>
+            <%= link_to ui_resource_restore_path(@resource.name, record), class: 'btn btn-outline-success py-1 px-2', title: '还原', data: { turbo_method: :post, turbo_confirm: '确定要还原这条数据吗？' } do %>
+              <i class="fas fa-undo"></i>
+            <% end %>
+          <% end %>
+          <% if is_super || current_admin_user.can?("#{@resource.name}:destroy") %>
+            <%= link_to ui_resource_path(@resource.name, record, scope: 'trash'), class: 'btn btn-outline-danger py-1 px-2', title: '彻底删除', data: { turbo_method: :delete, turbo_confirm: '确定要彻底删除吗？此操作无法恢复。' } do %>
+              <i class="fas fa-times-circle"></i>
+            <% end %>
+          <% end %>
+        <% else %>
+          <% # 自定义单条操作按钮 (仅在正常列表显示) %>
+          <% ( @resource.try(:member_actions).is_a?(Hash) ? @resource.member_actions : {} ).each do |name, config| %>
+            <% # 权限判定 %>
+            <% next unless is_super || current_admin_user.can?("#{@resource.name}:#{name}") %>
+            
+            <% 
+              action_url = if config[:url].is_a?(Symbol)
+                params_to_add = { "ids[]" => record.id }
+                if respond_to?(config[:url])
+                  send(config[:url], params_to_add)
+                elsif main_app.respond_to?(config[:url])
+                  main_app.send(config[:url], params_to_add)
+                else
+                  config[:url].to_s
+                end
+              elsif config[:url].is_a?(Hash)
+                main_app.url_for(config[:url].merge(id: record.id, "ids[]" => record.id))
+              elsif config[:url].nil?
+                ui_resource_member_action_path(@resource.name, record, operation: name)
+              else
+                config[:url]
+              end
+            %>
+            <%= link_to action_url, class: "btn btn-outline-#{config[:type] == :default ? 'secondary' : (config[:type] == :success ? 'success' : config[:type])} py-1 px-2", title: config[:label], data: { turbo_method: :post, turbo_confirm: config[:confirm] } do %>
+              <% if config[:icon] %><i class="<%= config[:icon] %>"></i><% else %><%= config[:label] %><% end %>
+            <% end %>
+          <% end %>
+
+          <% if is_super || current_admin_user.can?("#{@resource.name}:show") %>
+            <%= link_to ui_resource_path(@resource.name, record), class: 'btn btn-outline-primary py-1 px-2', title: t('zen_admin.actions.view'), data: { turbo_frame: "modal" } do %>
+              <i class="fas fa-eye"></i>
+            <% end %>
+          <% end %>
+          
+          <% if (is_super || current_admin_user.can?("#{@resource.name}:update")) && (!record.respond_to?(:zen_admin_editable?) || record.zen_admin_editable?) %>
+            <%= link_to edit_ui_resource_path(@resource.name, record), class: 'btn btn-outline-info py-1 px-2', title: t('zen_admin.actions.edit'), data: { turbo_frame: "modal" } do %>
+              <i class="fas fa-pencil-alt"></i>
+            <% end %>
+          <% end %>
+          
+          <% if (is_super || current_admin_user.can?("#{@resource.name}:destroy")) && (!record.respond_to?(:zen_admin_deletable?) || record.zen_admin_deletable?) %>
+            <%= link_to ui_resource_path(@resource.name, record), data: { turbo_method: :delete, turbo_confirm: @resource.try(:soft_delete) ? '确定要移至回收站吗？' : t('zen_admin.ui.confirm_delete') }, class: 'btn btn-outline-danger py-1 px-2', title: t('zen_admin.actions.delete') do %>
+              <i class="fas fa-trash"></i>
+            <% end %>
+          <% end %>
+        <% end %>
+      </div>
+    </div>
+  </td>
+</tr>

data/app/views/zen_admin/ui/resources/create.turbo_stream.erb

@@ -0,0 +1,2 @@
+<%= turbo_stream.prepend "resources_table_body", partial: "row", locals: { record: @record } %>
+<%= turbo_stream.update "flash", partial: "layouts/zen_admin/flash" %>

data/app/views/zen_admin/ui/resources/destroy.turbo_stream.erb

@@ -0,0 +1,2 @@
+<%= turbo_stream.remove @record %>
+<%= turbo_stream.update "flash", partial: "layouts/zen_admin/flash" %>

data/app/views/zen_admin/ui/resources/edit.html.erb

@@ -0,0 +1,11 @@
+<% content_for :title, t('zen_admin.actions.edit', resource: @resource.label) %>
+<% content_for :breadcrumb do %>
+  <li class="breadcrumb-item"><a href="<%= ui_resource_index_path(@resource.name) %>"><%= @resource.model.name.pluralize %></a></li>
+  <li class="breadcrumb-item active">Edit</li>
+<% end %>
+
+<div class="row">
+  <div class="col-md-12">
+    <%= render 'form', record: @record %>
+  </div>
+</div>