Add available services to meetings

CHANGELOG.md

@@ -10,6 +10,7 @@ controller or added a new module you need to rename `feature` to `component`.
 
 **Added**:
 
+- **decidim-meetings** Add services offered in the meeting. [\#3150](https://github.com/decidim/decidim/pull/3150)
 - **decidim-assemblies**: Adding news fields into assembly in terms of database [\#2942](https://github.com/decidim/decidim/pull/2942)
 - **decidim-proposals**: Add configuration for set the number of proposals to be highlighted [\#3175](https://github.com/decidim/decidim/pull/3175)
 - **decidim-meetings**: Add new fields to meetings registrations [\#3123](https://github.com/decidim/decidim/pull/3123)

decidim-core/app/assets/stylesheets/decidim/modules/_cards.scss

@@ -413,6 +413,10 @@ $datetime-bg: $primary;
   display: none;
   fill: $anchor-color;
 
+  &.alert{
+    fill: $alert;
+  }
+
   @include breakpoint(medium){
     margin-right: 1rem;
     display: block;
@@ -440,6 +444,10 @@ $datetime-bg: $primary;
   }
 }
 
+.card--list__text--top{
+  align-items: start;
+}
+
 .card--list__heading{
   margin-bottom: 0;
   display: block;

decidim-meetings/app/assets/config/admin/decidim_meetings_manifest.js

@@ -1 +1,2 @@
+//= link decidim/meetings/admin/meetings_form.js
 //= link decidim/meetings/admin/registrations_form.js

decidim-meetings/app/assets/javascripts/decidim/meetings/admin/meetings_form.js.es6

@@ -0,0 +1,78 @@
+((exports) => {
+  const { AutoLabelByPositionComponent, AutoButtonsByPositionComponent, createDynamicFields, createSortList } = exports.DecidimAdmin;
+
+  const wrapperSelector = ".meeting-services";
+  const fieldSelector = ".meeting-service";
+
+  const autoLabelByPosition = new AutoLabelByPositionComponent({
+    listSelector: ".meeting-service:not(.hidden)",
+    labelSelector: ".card-title span:first",
+    onPositionComputed: (el, idx) => {
+      $(el).find("input[name$=\\[position\\]]").val(idx);
+    }
+  });
+
+  const autoButtonsByPosition = new AutoButtonsByPositionComponent({
+    listSelector: ".meeting-service:not(.hidden)",
+    hideOnFirstSelector: ".move-up-service",
+    hideOnLastSelector: ".move-down-service"
+  });
+
+  const createSortableList = () => {
+    createSortList(".meeting-services-list:not(.published)", {
+      handle: ".service-divider",
+      placeholder: '<div style="border-style: dashed; border-color: #000"></div>',
+      forcePlaceholderSize: true,
+      onSortUpdate: () => { autoLabelByPosition.run() }
+    });
+  };
+
+  const hideDeletedService = ($target) => {
+    const inputDeleted = $target.find("input[name$=\\[deleted\\]]").val();
+
+    if (inputDeleted === "true") {
+      $target.addClass("hidden");
+      $target.hide();
+    }
+  };
+
+  createDynamicFields({
+    placeholderId: "meeting-service-id",
+    wrapperSelector: wrapperSelector,
+    containerSelector: ".meeting-services-list",
+    fieldSelector: fieldSelector,
+    addFieldButtonSelector: ".add-service",
+    removeFieldButtonSelector: ".remove-service",
+    moveUpFieldButtonSelector: ".move-up-service",
+    moveDownFieldButtonSelector: ".move-down-service",
+    onAddField: () => {
+      createSortableList();
+
+      autoLabelByPosition.run();
+      autoButtonsByPosition.run();
+    },
+    onRemoveField: () => {
+      autoLabelByPosition.run();
+      autoButtonsByPosition.run();
+    },
+    onMoveUpField: () => {
+      autoLabelByPosition.run();
+      autoButtonsByPosition.run();
+    },
+    onMoveDownField: () => {
+      autoLabelByPosition.run();
+      autoButtonsByPosition.run();
+    }
+  });
+
+  createSortableList();
+
+  $(fieldSelector).each((idx, el) => {
+    const $target = $(el);
+
+    hideDeletedService($target);
+  });
+
+  autoLabelByPosition.run();
+  autoButtonsByPosition.run();
+})(window);

decidim-meetings/app/commands/decidim/meetings/admin/copy_meeting.rb

@@ -52,6 +52,7 @@ def copy_meeting!
             longitude: @form.longitude,
             location: @form.location,
             location_hints: @form.location_hints,
+            services: @form.services_to_persist.map { |service| { "title" => service.title, "description" => service.description } },
             component: @meeting.component,
             registrations_enabled: @meeting.registrations_enabled,
             available_slots: @meeting.available_slots,

decidim-meetings/app/commands/decidim/meetings/admin/create_meeting.rb

@@ -35,6 +35,7 @@ def create_meeting!
             category: @form.category,
             title: @form.title,
             description: @form.description,
+            services: @form.services_to_persist.map { |service| { "title" => service.title, "description" => service.description } },
             end_time: @form.end_time,
             start_time: @form.start_time,
             address: @form.address,

decidim-meetings/app/commands/decidim/meetings/admin/update_meeting.rb

@@ -42,6 +42,7 @@ def update_meeting!
             category: form.category,
             title: form.title,
             description: form.description,
+            services: form.services_to_persist.map { |service| { "title" => service.title, "description" => service.description } },
             end_time: form.end_time,
             start_time: form.start_time,
             address: form.address,

decidim-meetings/app/controllers/decidim/meetings/admin/meeting_copies_controller.rb

@@ -6,7 +6,7 @@ module Admin
       # Controller that allows managing meetings.
       #
       class MeetingCopiesController < Admin::ApplicationController
-        helper_method :meeting
+        helper_method :meeting, :blank_service
 
         def new
           @form = form(MeetingCopyForm).from_model(meeting)
@@ -30,6 +30,10 @@ def create
 
         private
 
+        def blank_service
+          @blank_service ||= Admin::MeetingServiceForm.new
+        end
+
         def meeting
           @meeting ||= Meeting.where(component: current_component).find(params[:meeting_id])
         end

decidim-meetings/app/controllers/decidim/meetings/admin/meetings_controller.rb

@@ -5,6 +5,8 @@ module Meetings
     module Admin
       # This controller allows an admin to manage meetings from a Participatory Process
       class MeetingsController < Admin::ApplicationController
+        helper_method :blank_service
+
         def new
           @form = form(MeetingForm).instance
         end
@@ -54,6 +56,12 @@ def destroy
             end
           end
         end
+
+        private
+
+        def blank_service
+          @blank_service ||= Admin::MeetingServiceForm.new
+        end
       end
     end
   end

decidim-meetings/app/forms/decidim/meetings/admin/meeting_copy_form.rb

@@ -19,6 +19,7 @@ class MeetingCopyForm < Form
         attribute :longitude, Float
         attribute :start_time, Decidim::Attributes::TimeWithZone
         attribute :end_time, Decidim::Attributes::TimeWithZone
+        attribute :services, Array[MeetingServiceForm]
 
         mimic :meeting
 
@@ -32,6 +33,20 @@ class MeetingCopyForm < Form
         validates :start_time, presence: true, date: { before: :end_time }
         validates :end_time, presence: true, date: { after: :start_time }
 
+        def map_model(model)
+          self.services = model.services.map do |service|
+            MeetingServiceForm.new(service)
+          end
+        end
+
+        def services_to_persist
+          services.reject(&:deleted)
+        end
+
+        def number_of_services
+          services.size
+        end
+
         alias component current_component
       end
     end

decidim-meetings/app/forms/decidim/meetings/admin/meeting_form.rb

@@ -17,6 +17,7 @@ class MeetingForm < Decidim::Form
         attribute :longitude, Float
         attribute :start_time, Decidim::Attributes::TimeWithZone
         attribute :end_time, Decidim::Attributes::TimeWithZone
+        attribute :services, Array[MeetingServiceForm]
         attribute :decidim_scope_id, Integer
         attribute :decidim_category_id, Integer
 
@@ -37,9 +38,19 @@ class MeetingForm < Decidim::Form
         delegate :categories, to: :current_component
 
         def map_model(model)
-          return unless model.categorization
+          self.services = model.services.map do |service|
+            MeetingServiceForm.new(service)
+          end
 
-          self.decidim_category_id = model.categorization.decidim_category_id
+          self.decidim_category_id = model.categorization.decidim_category_id if model.categorization
+        end
+
+        def services_to_persist
+          services.reject(&:deleted)
+        end
+
+        def number_of_services
+          services.size
         end
 
         alias component current_component

decidim-meetings/app/forms/decidim/meetings/admin/meeting_service_form.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Meetings
+    module Admin
+      # This class holds a Form to update meeting services
+      class MeetingServiceForm < Decidim::Form
+        include TranslatableAttributes
+
+        attribute :deleted, Boolean, default: false
+
+        translatable_attribute :title, String
+        translatable_attribute :description, String
+
+        validates :title, translatable_presence: true, unless: :deleted
+
+        def to_param
+          id || "meeting-service-id"
+        end
+      end
+    end
+  end
+end

decidim-meetings/app/helpers/decidim/meetings/admin/application_helper.rb

@@ -7,6 +7,10 @@ module Admin
       #
       module ApplicationHelper
         include Decidim::MapHelper
+
+        def tabs_id_for_service(service)
+          "meeting_service_#{service.to_param}"
+        end
       end
     end
   end

decidim-meetings/app/views/decidim/meetings/admin/meeting_copies/_form.html.erb

@@ -36,3 +36,7 @@
   </div>
 
 </div>
+
+<%= render "decidim/meetings/admin/meetings/services", form: form %>
+
+<%= javascript_include_tag "decidim/meetings/admin/meetings_form" %>

decidim-meetings/app/views/decidim/meetings/admin/meetings/_form.html.erb

@@ -46,3 +46,7 @@
     </div>
   </div>
 </div>
+
+<%= render "services", form: form, id: tabs_id_for_service(blank_service) %>
+
+<%= javascript_include_tag "decidim/meetings/admin/meetings_form" %>

decidim-meetings/app/views/decidim/meetings/admin/meetings/_service.html.erb

@@ -0,0 +1,48 @@
+<% service = form.object %>
+
+<div class="card meeting-service" id="<%= id %>-field">
+  <div class="card-divider service-divider">
+    <h2 class="card-title">
+      <span><%= t(".service") %></span>
+
+      <button class="button small alert hollow move-up-service button--title">
+        <%== "#{icon("arrow-top")} #{t(".up")}" %>
+      </button>
+
+      <button class="button small alert hollow move-down-service button--title">
+        <%== "#{icon("arrow-bottom")} #{t(".down")}" %>
+      </button>
+
+      <button class="button small alert hollow remove-service button--title">
+        <%= t(".remove") %>
+      </button>
+    </h2>
+  </div>
+
+  <div class="card-section">
+    <div class="row column">
+      <%=
+        form.translated(
+          :text_field,
+          :title,
+          tabs_id: id,
+          label: t(".title")
+        )
+      %>
+    </div>
+
+    <div class="row column">
+      <%=
+        form.translated(
+          :text_area,
+          :description,
+          rows: 2,
+          tabs_id: id,
+          label: t(".description")
+        )
+      %>
+    </div>
+  </div>
+
+  <%= form.hidden_field :deleted, value: false %>
+</div>

decidim-meetings/app/views/decidim/meetings/admin/meetings/_services.html.erb

@@ -0,0 +1,25 @@
+<div class="card">
+  <div class="card-divider">
+    <h2 class="card-title"><%= t(".services") %></h2>
+  </div>
+
+  <div class="card-section">
+    <div class="meeting-services">
+      <template>
+        <%= fields_for "meeting[services][#{blank_service.to_param}]", blank_service do |service_form| %>
+          <%= render "decidim/meetings/admin/meetings/service", form: service_form, id: tabs_id_for_service(blank_service) %>
+        <% end %>
+      </template>
+
+      <div class="meeting-services-list">
+        <% form.object.services.each do |service| %>
+          <%= fields_for "meeting[services][]", service do |service_form| %>
+            <%= render "decidim/meetings/admin/meetings/service", form: service_form, id: tabs_id_for_service(service) %>
+          <% end %>
+        <% end %>
+      </div>
+
+      <button class="button add-service"><%= t(".add_service") %></button>
+    </div>
+  </div>
+</div>

decidim-meetings/app/views/decidim/meetings/meetings/show.html.erb

@@ -56,6 +56,23 @@
         </div>
       <% end %>
     </div>
+
+    <% if meeting.services.any? %>
+      <div class="card card--list">
+        <% meeting.services.each do |service| %>
+          <div class="card--list__item">
+            <div class="card--list__text card--list__text--top">
+              <%= icon "actions", class: "card--list__icon alert" %>
+              <div>
+                <h5 class="card--list__heading heading-small"><%= translated_attribute(service["title"]) %></h5>
+                <span class="text-medium"><%= translated_attribute(service["description"]) %></span>
+              </div>
+            </div>
+          </div>
+        <% end %>
+      </div>
+    <% end %>
+
     <%= resource_reference(meeting) %>
     <%= render partial: "decidim/shared/share_modal" %>
     <%= embed_modal_for meeting_meeting_widget_url(meeting, format: :js) %>