Merge branch 'dev' into slovenija

danesjenovdan · Jul 2, 2024 · 87b17f2 · 87b17f2
2 parents 930f421 + abbebe1
commit 87b17f2
Show file tree

Hide file tree

Showing 6 changed files with 405 additions and 210 deletions.
diff --git a/parlacards/cards/_i18n/en/defaults.yaml b/parlacards/cards/_i18n/en/defaults.yaml
@@ -187,6 +187,9 @@ full-speech: Whole speech
 session-processing: Session is being processed.
 organization: Organisation
 start: Beginning
+date: Date
+start-date: Start date
+end-date: End date
 legislation: Legislation
 laws: Laws
 acts: Acts

diff --git a/parlacards/cards/_i18n/hr/defaults.yaml b/parlacards/cards/_i18n/hr/defaults.yaml
@@ -187,6 +187,9 @@ full-speech: Cijeli govor
 session-processing: Sjednica je u tijeku.
 organization: Tijelo
 start: Početak
+date: Datum
+start-date: Datum početka
+end-date: Datum završetka
 legislation: Zakonodavstvo
 laws: Zakoni
 acts: Akti

diff --git a/parlacards/cards/misc/sessions/card.vue b/parlacards/cards/misc/sessions/card.vue
@@ -143,6 +143,21 @@ export default {
       };
     });
 
+    const showOrganizationColumn = (() => {
+      let value = String(cardState?.showOrganizationColumn);
+      if (value === 'true') value = 'always';
+      if (value === 'false') value = 'never';
+      if (['always', 'never', 'secondary-only'].includes(value)) return value;
+      return 'secondary-only';
+    })();
+
+    const showEndDate = (() => {
+      const value = String(cardState?.showEndDate);
+      if (value === 'true') return true;
+      if (value === 'false') return false;
+      return false;
+    })();
+
     return {
       tabs,
       // sessions: cardData?.data?.results,
@@ -155,10 +170,8 @@ export default {
         heading: cardData?.data?.mandate?.description,
         title: this.$t('card.title'),
       }),
-      showOrganizationColumn:
-        cardState?.showOrganizationColumn &&
-        cardState?.showOrganizationColumn !== 'false',
-
+      showOrganizationColumn,
+      showEndDate,
       // pagination
       pages,
       initialPage,
@@ -197,23 +210,41 @@ export default {
 
       return url.toString();
     },
-
+    isFirstTabActive() {
+      return this.currentFilter === this.tabs?.[0]?.id;
+    },
     columns() {
+      const showOrgCol =
+        this.showOrganizationColumn === 'always' ||
+        (this.showOrganizationColumn === 'secondary-only' &&
+          !this.isFirstTabActive);
+
       return [
         { id: 'image', label: '', additionalClass: 'image' },
-        { id: 'name', label: this.$t('title'), additionalClass: 'wider name' },
-        { id: 'start_time', label: this.$t('date') },
+        { id: 'name', label: this.$t('title'), additionalClass: 'name' },
+        {
+          id: 'start_time',
+          label: this.showEndDate ? this.$t('start-date') : this.$t('date'),
+          additionalClass: this.showEndDate ? 'date date--start' : 'date',
+        },
+        this.showEndDate
+          ? {
+              id: 'end_time',
+              label: this.$t('end-date'),
+              additionalClass: 'date date--end optional',
+            }
+          : null,
         // TODO this should be properly optional instead of commented out
         // {
         //   id: 'updated',
         //   label: this.$t('change'),
         //   additionalClass: 'optional',
         // },
-        this.showOrganizationColumn
+        showOrgCol
           ? {
               id: 'workingBody',
               label: this.$t('organization'),
-              additionalClass: 'wider optional',
+              additionalClass: 'organization optional',
             }
           : null,
       ].filter(Boolean);
@@ -238,6 +269,11 @@ export default {
     },
 
     mappedSessions() {
+      const showOrgCol =
+        this.showOrganizationColumn === 'always' ||
+        (this.showOrganizationColumn === 'secondary-only' &&
+          !this.isFirstTabActive);
+
       return this.currentPageSessions.map((session) =>
         [
           {
@@ -247,9 +283,14 @@ export default {
             }.svg`,
           },
           { link: this.getSessionLink(session), text: session.name },
-          session.start_time ? dateFormatter(session.start_time) : '',
-          // session.end_time ? formatDate(session.end_time) : '',
-          this.showOrganizationColumn
+          session.start_time ? dateFormatter(session.start_time) : ' ',
+          // eslint-disable-next-line no-nested-ternary
+          this.showEndDate
+            ? session.end_time
+              ? dateFormatter(session.end_time)
+              : ' '
+            : null,
+          showOrgCol
             ? {
                 contents: session.organizations.map((org) => ({
                   text: org.name,
@@ -344,6 +385,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import 'parlassets/scss/breakpoints';
+@import 'parlassets/scss/colors';
+
 .filters {
   margin-top: 14px;
 
@@ -352,4 +396,44 @@ export default {
     flex: 1.5;
   }
 }
+
+:deep(.session-list) {
+  .item,
+  .headers {
+    .column {
+      &.date {
+        margin: 0 16px;
+        flex-basis: 80px;
+        flex-shrink: 0;
+        flex-grow: 0;
+        text-align: left;
+
+        @include respond-to(desktop) {
+          flex-basis: 140px;
+        }
+      }
+
+      &.date--start,
+      &.date--end,
+      &.date:not(:last-child) {
+        @include respond-to(desktop) {
+          flex-basis: 110px;
+        }
+      }
+
+      &.organization {
+        text-align: left;
+      }
+    }
+  }
+
+  .headers {
+    .column {
+      &.date--start,
+      &.date--end {
+        white-space: normal;
+      }
+    }
+  }
+}
 </style>