Dodano changelog; poprawki reaktywności

src/views/ManagerView.vue

@@ -4,6 +4,7 @@
 
     <hr color="white" />
     <TableActions />
+
     <hr color="white" />
 
     <div class="table_container">
@@ -18,8 +19,13 @@
           <tr v-for="(station, row) in sortedStationList" tabindex="0">
             <td v-for="(value, propName) in headerNameList" @click="changeProperty(station, row, propName as string)">
               <span v-if="propName === 'url'" :style="station.url ? 'color: gold' : 'color: gray;'">URL</span>
+
               <span v-else-if="propName === 'checkpoints'">{{ station[propName] ? 'POKAŻ' : 'DODAJ' }}</span>
-              <span v-else-if="propName === 'routes'" v-html="getRouteNames(station)"></span>
+
+              <span v-else-if="propName === 'routes'" v-html="getRouteNames(station.routes)"></span>
+
+              <span v-else-if="propName === 'signalType'"> {{ station[propName] }}</span>
+
               <span v-else-if="typeof (station as any)[propName] === 'boolean'">
                 {{ (station as any)[propName] ? '✅' : '❌' }}
               </span>
@@ -57,10 +63,11 @@ import { useStore } from '../store';
 import { SceneryRowItem, Availability } from '../types/types';
 import RoutesModal from '../components/RoutesModal.vue';
 import TableActions from '../components/TableActions.vue';
+import routesMixin from '../mixins/routesMixin';
 
 export default defineComponent({
   components: { RoutesModal, TableActions },
-  mixins: [dataMixin, changeMixin],
+  mixins: [dataMixin, changeMixin, routesMixin],
 
   data: () => ({
     headerNameList: {
@@ -103,23 +110,6 @@ export default defineComponent({
   },
 
   methods: {
-    getRouteNames(station: SceneryRowItem) {
-      if (!station.routes) return '';
-      return station.routes
-        .split(';')
-        .map((route) => {
-          // !Oc_2EPB
-          const props1 = route.split('_')[0];
-          const props2 = route.split('_')[1];
-          const isInternal = props1.startsWith('!');
-          const name = isInternal ? props1.replace('!', '') : props1;
-          return `${isInternal ? '<u>' + name + '</u>' : name} <span style='color: #aaa'>(${props2[0]}/${props2[1]}/${
-            props2[2]
-          }${props2[3] ? '/B' : ''})</span>`;
-        })
-        .join(', ');
-    },
-
     changeProperty(station: SceneryRowItem, row: number, propertyName: string) {
       this.store.selectedStationName = station.name;
 
@@ -174,6 +164,10 @@ export default defineComponent({
     },
 
     removeStation(scenery: SceneryRowItem) {
+      const confirmRemove = confirm('Czy na pewno chcesz zaznaczyć tę scenerię do usunięcia?');
+
+      if (!confirmRemove) return;
+
       this.store.stationList = this.store.stationList.filter(({ id }) => id != scenery.id);
       this.addRemovalChange(scenery);
     },
@@ -245,4 +239,10 @@ td img {
   height: 1.45em;
   vertical-align: middle;
 }
+
+@media screen and (max-width: 550px) {
+  table {
+    font-size: 0.85em;
+  }
+}
 </style>