From baa8b50374a97874773d58fa808aaa1adf1e13a4 Mon Sep 17 00:00:00 2001
From: Stefan Seifert <stefanseifert@users.noreply.github.com>
Date: Tue, 26 Nov 2024 19:38:05 +0100
Subject: [PATCH] Show difficulty level on End of Game page

---
 src/components/turn/EndOfGame.vue | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/turn/EndOfGame.vue b/src/components/turn/EndOfGame.vue
index d4e3dc6..e15a0f1 100644
--- a/src/components/turn/EndOfGame.vue
+++ b/src/components/turn/EndOfGame.vue
@@ -7,7 +7,11 @@
     <li v-html="t('endOfGame.researchScoring')"></li>
     <li v-html="t('endOfGame.resourceScoring')"></li>
   </ol>
-  <p>{{t('setup.difficultyLevel.title')}}: <b>{{t(`difficultyLevel.${state.setup.difficultyLevel}`)}}</b></p>
+  <p>
+    <i>{{t('setup.difficultyLevel.title')}}:</i>&nbsp;
+    <img src="@/assets/icons/difficulty-level.png" class="difficultyLevelIcon" v-for="level in difficultyLevel" :key="level" alt=""/>
+    &nbsp;<i>{{t(`difficultyLevel.${difficultyLevel}`)}}</i>
+  </p>
 </template>
 
 <script lang="ts">
@@ -15,6 +19,7 @@ import { useStateStore } from '@/store/state'
 import { defineComponent } from 'vue'
 import { useI18n } from 'vue-i18n'
 import ScoringFinalTile from '@/services/enum/ScoringFinalTile'
+import DifficultyLevel from '@/services/enum/DifficultyLevel'
 
 export default defineComponent({
   name: 'EndOfGame',
@@ -32,6 +37,9 @@ export default defineComponent({
   computed: {
     isScoringFinalTileFederationStructures() : boolean {
       return (this.state.setup.scoringFinalTiles ?? []).includes(ScoringFinalTile.FEDERATION_STRUCTURES)
+    },
+    difficultyLevel() : DifficultyLevel {
+      return this.state.setup.difficultyLevel
     }
   }
 })
@@ -41,4 +49,7 @@ export default defineComponent({
 ol > li {
   margin-top: 0.5rem;
 }
+.difficultyLevelIcon {
+  height: 1.5rem;
+}
 </style>