@dcrackel/hematournamentui 1.0.487 → 1.0.488

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dcrackel/hematournamentui",
   "private": false,
-  "version": "1.0.487",
+  "version": "1.0.488",
   "type": "module",
   "main": "dist/HemaTournamentUI-lib.umd.js",
   "module": "dist/HemaTournamentUI-lib.es.js",

package/src/mocks/assignments.js

@@ -145,6 +145,30 @@ const assignmentsMock =
                     "StartTime": "12:00:00",
                     "Role": "Director",
                     "Status": "completed"
+                },
+                {
+                    "EventId": 35,
+                    "EventName": "Saber 2",
+                    "Date": "2024-11-17",
+                    "StartTime": "12:00:00",
+                    "Role": "Director",
+                    "Status": "planning"
+                },
+                {
+                    "EventId": 35,
+                    "EventName": "Saber 3",
+                    "Date": "2024-11-17",
+                    "StartTime": "12:00:00",
+                    "Role": "Director",
+                    "Status": "preparation"
+                },
+                {
+                    "EventId": 35,
+                    "EventName": "Saber 4",
+                    "Date": "2024-11-17",
+                    "StartTime": "12:00:00",
+                    "Role": "Director",
+                    "Status": "live"
                 }
             ]
         },
@@ -163,7 +187,7 @@ const assignmentsMock =
                     "Status": "completed"
                 }
             ]
-        }
+        },
     ];
 
 export default assignmentsMock;

package/src/stories/Templates/Assignment/Assignment.vue

@@ -3,7 +3,7 @@
     <div class="w-full flex justify-between">
       <BaseText text="Assignments" color="primary" size="xl" type="h1" weight="bold" class="pt-2"/>
       <div class="flex">
-        <BaseButton iconName="fa-arrow-rotate-right" :iconLeft="true" label="" size="sm" type="primary" @buttonClick="refreshAssignments" class="w-8 pl-4"/>
+        <BaseButton iconName="fa-arrow-rotate-right" :iconLeft="true" label="" size="sm" type="primary" @buttonClick="refreshAssignments" class="w-8 pl-4 md:w-12"/>
         <BaseButton label="Current" size="sm" :selected="showCurrent" type="primary" @buttonClick="showCurrent = true" />
         <BaseButton label="Past" size="sm" :selected="!showCurrent" type="primary" @buttonClick="showCurrent = false" class="w-16"/>
       </div>
@@ -38,10 +38,10 @@
           </span>
           </div>
           <div class="w-12 md:flex bg-poolSetup ml-2 px-4 py-2 rounded-lg">
-            <BaseIcon :iconName="getStatusIcon(event)" size="sm" color="quinary" />
+            <BaseIcon :iconName="getStatusIcon(event)" size="md" color="quinary" :class="getIconClass(event)" />
           </div>
           <div v-if="shouldShowButton(event) && showCurrent" class="w-12 ml-1">
-            <BaseButton v-if="shouldShowButton(event)" iconName="fa-right-from-line" :iconLeft="false" label="" size="md" type="primary" @buttonClick="forwardToEvent(event)" class="h-10"/>
+            <BaseButton v-if="shouldShowButton(event)" iconName="fa-right-from-line" :iconLeft="false" label="" size="md" type="primary" @buttonClick="forwardToEvent(event)" class="h-10 w-10 pr-4"/>
           </div>
           <span v-if="!shouldShowButton(event) && showCurrent" class="w-12 ml-1" />
         </section>
@@ -112,7 +112,7 @@ export default {
       }
     },
     shouldShowButton(event) {
-      return event.Status !== "completed";
+      return event.Status === "live" || event.Status === "results" || event.Status === "de";
     },
     formatTournamentDates(startDate, endDate) {
       const today = new Date();
@@ -146,21 +146,39 @@ export default {
     getStatusIcon(event) {
       switch (event.Status) {
         case "planning":
-          return "fa-clipboard";
+          return "fa-hourglass";
         case "preparation":
-          return "fa-clipboard-check";
+          return "fa-hourglass-start";
         case "live":
-          return "fa-swords";
+          return "fa-play";
         case "results":
-          return "fa-chart-bar";
+          return "fa-pause";
         case "de":
-          return "fa-sitemap";
+          return "fa-circle-play";
         case "completed":
           return "fa-trophy";
         default:
           return "fa-circle-question";
       }
     },
+    getIconClass(event) {
+      switch (event.Status) {
+        case "planning":
+          return "mt-1 pl-1";
+        case "preparation":
+          return "mt-1 pl-1";
+        case "live":
+          return "mt-1 pl-1";
+        case "results":
+          return "mt-1 pl-1";
+        case "de":
+          return "mt-1 pl-1";
+        case "completed":
+          return "mt-0.5";
+        default:
+          return "";
+      }
+    },
     forwardToEvent(event) {
       this.$emit('forwardToEvent', event);
     },