Add status badge to list view

itk-dev · Apr 23, 2024 · 3227a61 · 3227a61
1 parent ff14c87
commit 3227a61
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 15 deletions.
diff --git a/config/sync/core.entity_view_display.node.citizen_proposal.list_display.yml b/config/sync/core.entity_view_display.node.citizen_proposal.list_display.yml
@@ -23,6 +23,7 @@ dependencies:
     - node.type.citizen_proposal
   module:
     - datetime
+    - options
     - text
     - user
 id: node.citizen_proposal.list_display
@@ -35,29 +36,36 @@ content:
     label: above
     settings: {  }
     third_party_settings: {  }
-    weight: 103
+    weight: 6
     region: content
   field_author_name:
     type: string
     label: above
     settings:
       link_to_entity: false
     third_party_settings: {  }
-    weight: 104
+    weight: 7
+    region: content
+  field_content_state:
+    type: list_default
+    label: hidden
+    settings: {  }
+    third_party_settings: {  }
+    weight: 10
     region: content
   field_proposal:
     type: text_default
     label: above
     settings: {  }
     third_party_settings: {  }
-    weight: 105
+    weight: 8
     region: content
   field_remarks:
     type: text_default
     label: above
     settings: {  }
     third_party_settings: {  }
-    weight: 106
+    weight: 9
     region: content
   field_vote_end:
     type: datetime_default
@@ -66,7 +74,7 @@ content:
       timezone_override: ''
       format_type: medium
     third_party_settings: {  }
-    weight: 102
+    weight: 5
     region: content
   field_vote_start:
     type: datetime_default
@@ -75,7 +83,7 @@ content:
       timezone_override: ''
       format_type: medium
     third_party_settings: {  }
-    weight: 101
+    weight: 4
     region: content
   langcode:
     type: language
@@ -89,7 +97,7 @@ content:
   links:
     settings: {  }
     third_party_settings: {  }
-    weight: 100
+    weight: 3
     region: content
   published_at:
     type: timestamp
@@ -108,20 +116,19 @@ content:
         granularity: 2
         refresh: 60
     third_party_settings: {  }
-    weight: 0
+    weight: 1
     region: content
   sharing_buttons:
     settings: {  }
     third_party_settings: {  }
-    weight: 100
+    weight: 2
     region: content
 hidden:
   field_author_allow_email: true
   field_author_email_display: true
   field_author_phone: true
   field_author_uuid: true
   field_city_council_meeting_date: true
-  field_content_state: true
   field_getorganized_case_id: true
   field_more_info: true
   field_status_description: true

diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_status-messages.scss b/web/themes/custom/hoeringsportal/assets/css/module/_status-messages.scss
@@ -2,7 +2,8 @@
   background-color: transparent;
 }
 
-.alert {
+.alert,
+.badge {
   &.alert-warning {
     background-color: #FEFCE9;
     color: #563310;

diff --git a/web/themes/custom/hoeringsportal/assets/js/icons.js b/web/themes/custom/hoeringsportal/assets/js/icons.js
@@ -16,7 +16,8 @@ import {
   faCopy,
   faPrint,
   faTriangleExclamation,
-  faCircleCheck
+  faCircleCheck,
+  faCircleInfo
 } from '@fortawesome/free-solid-svg-icons'
 
 // Import icons from the free brands package
@@ -52,5 +53,6 @@ library.add(
   faCopy,
   faPrint,
   faTriangleExclamation,
-  faCircleCheck
+  faCircleCheck,
+  faCircleInfo
 )
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--citizen-proposal--teaser.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--citizen-proposal--teaser.html.twig
@@ -79,7 +79,21 @@
   <div{{ attributes.addClass('activity-teaser-content', 'activity-teaser-description', 'px-4', 'py-0') }}>
     <div class="d-flex my-3 justify-content-between">
       <h3 class="my-0">{{ label[0]['#context'].value|length > 40 ? label[0]['#context'].value|slice(0, 40) ~ '...' : label }}</h3>
-      <div><span>{{ 'End date'|t }}:</span><strong class="ms-1">{{ voteEnd|date('d M. Y') }}</strong></div>
+      {% if node.field_content_state.value == 'rejected' %}
+        <span class="badge alert-warning d-flex align-items-center gap-1">
+          <i class="fas fa-triangle-exclamation me-1"></i> {{ 'Rejected'|t }}
+        </span>
+      {% elseif node.field_content_state.value == 'approved' %}
+        <span class="badge alert-success d-flex align-items-center gap-1">
+          <i class="fas fa-circle-check me-1"></i> {{ 'Approved'|t }}
+        </span>
+      {% elseif node.field_content_state.value == 'processing' %}
+        <span class="badge alert-info d-flex align-items-center gap-1">
+          <i class="fas fa-circle-info me-1"></i> {{ 'Processing'|t }}
+        </span>
+      {% else %}
+        <div><span>{{ 'End date'|t }}:</span><strong class="ms-1">{{ voteEnd|date('d M. Y') }}</strong></div>
+      {% endif %}
     </div>
     <div class="activity-supporters">
       {% include 'citizen-proposal-support-counter.html.twig' with {data: {

diff --git a/...hemes/custom/hoeringsportal/templates/ds/ds-2col-stacked--node-citizen-proposal.html.twig b/...hemes/custom/hoeringsportal/templates/ds/ds-2col-stacked--node-citizen-proposal.html.twig
@@ -62,7 +62,7 @@
           {# Status message processing #}
           {% if node.field_content_state.value == 'processing' %}
             <div class="alert alert-info border-0 d-flex gap-3" role="alert">
-              <i class="fas fa-circle-check mt-1"></i>
+              <i class="fas fa-circle-info mt-1"></i>
               <div>
                 <h4 class="alert-heading mb-1 mt-0">{{ 'The proposal is beeing processed'|t }}</h4>
                 <p class="mb-0">{{ 'The proposal will be proccessed at the citycouncil meeting @meeting_date'|t({'@meeting_date': node.field_city_council_meeting_date.value}) }}</p>