Migracja na Vite

src/components/SceneryView/SceneryInfo/SceneryInfoStats.vue

@@ -1,24 +1,24 @@
 <template>
   <section class="info-stats" :class="!station.onlineInfo ? 'no-stats' : ''">
     <span class="likes">
-      <img :src="icons.like" alt="icon-like" />
+      <img :src="getIcon('like')" alt="icon-like" />
       <span>{{ station.onlineInfo?.dispatcherRate || '0' }}</span>
     </span>
 
     <span class="users">
-      <img :src="icons.user" alt="icon-user" />
+      <img :src="getIcon('user')" alt="icon-user" />
       <span>{{ station.onlineInfo?.currentUsers || '0' }}</span>
       /
       <span>{{ station.onlineInfo?.maxUsers || '0' }}</span>
     </span>
 
     <span class="spawns">
-      <img :src="icons.spawn" alt="icon-spawn" />
+      <img :src="getIcon('spawn')" alt="icon-spawn" />
       <span>{{ station.onlineInfo?.spawns.length || '0' }}</span>
     </span>
 
     <span class="schedules">
-      <img :src="icons.timetable" alt="icon-timetable" />
+      <img :src="getIcon('timetable')" alt="icon-timetable" />
       <span>
         <span style="color: #eee">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
         /
@@ -32,25 +32,17 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-
-import Station from '@/scripts/interfaces/Station';
+import imageMixin from '../../../mixins/imageMixin';
+import Station from '../../../scripts/interfaces/Station';
 
 export default defineComponent({
+  mixins: [imageMixin],
   props: {
     station: {
       type: Object as () => Station,
       default: {},
     },
   },
-
-  data: () => ({
-    icons: {
-      like: require('@/assets/icon-like.svg'),
-      timetable: require('@/assets/icon-timetable.svg'),
-      user: require('@/assets/icon-user.svg'),
-      spawn: require('@/assets/icon-spawn.svg'),
-    },
-  }),
 });
 </script>
 
@@ -83,7 +75,7 @@ export default defineComponent({
   }
 
   span > img {
-    width: 1.2em; 
+    width: 1.2em;
     margin-right: 0.5em;
   }
 }