feature fix: akceptowalna masa składu

src/components/tabs/StockGeneratorTab.vue

@@ -5,53 +5,61 @@
     </div>
 
     <div class="tab_content">
-      <h2>WŁAŚCIWOŚCI SKŁADU</h2>
+      <div>
+        <h2>WŁAŚCIWOŚCI SKŁADU</h2>
 
-      <div class="tab_attributes">
-        <label>
-          Maksymalna masa (t)
-          <input type="number" v-model="maxMass" step="100" max="4000" min="0" />
-        </label>
+        <b class="text--accent"> &lArr; Dodaj lokomotywę na pierwsze miejsce listy, aby uwzględnić ją przy losowaniu składu! </b>
 
-        <label>
-          Maks. długość (m)
-          <input type="number" v-model="maxLength" step="25" max="650" min="0" />
-        </label>
+        <div class="tab_attributes">
+          <label>
+            Maksymalna masa (t)
+            <input type="number" v-model="maxMass" step="100" max="4000" min="0" />
+          </label>
 
-        <label>
-          Maks. liczba wagonów
-          <input type="number" v-model="maxCarCount" step="1" max="60" min="1" />
-        </label>
+          <label>
+            Maks. długość (m)
+            <input type="number" v-model="maxLength" step="25" max="650" min="0" />
+          </label>
+
+          <label>
+            Maks. liczba wagonów
+            <input type="number" v-model="maxCarCount" step="1" max="60" min="1" />
+          </label>
+        </div>
       </div>
 
-      <h2>ŁADUNEK</h2>
-      <p>Wybierz ładunki, którymi chcesz wypełnić dostępne wagony:</p>
+      <div>
+        <h2>ŁADUNEK</h2>
+        <b>Wybierz ładunki, którymi chcesz wypełnić dostępne wagony:</b>
+      </div>
 
       <div class="generator_cargo">
         <button
           class="btn"
-          :data-chosen="chosenCargoTypes.includes(k as string)"
+          :data-chosen="chosenCargoTypes.includes(k.toString())"
           v-for="(v, k) in store.stockData?.generator.cargo"
-          @click="toggleCargoChosen(k as string, v)"
+          @click="toggleCargoChosen(k.toString(), v)"
         >
           {{ k }}
         </button>
       </div>
 
-      <h2>WAGONY Z WYBRANYMI ŁADUNKAMI</h2>
+      <div>
+        <h2>WAGONY Z WYBRANYMI ŁADUNKAMI</h2>
 
-      <div class="generator_warning">
-        <span v-if="computedChosenCarTypes.size == 0">
-          Wybierz co najmniej jeden ładunek, aby zobaczyć wagony, które go posiadają!
-        </span>
+        <div class="generator_warning">
+          <span v-if="computedChosenCarTypes.size == 0">
+            Wybierz co najmniej jeden ładunek, aby zobaczyć wagony, które go posiadają!
+          </span>
 
-        <span v-else>
-          Wagony posiadające wybrane ładunki. Najedź na nazwę, aby zobaczyć podgląd wagonu. Kliknij, aby wyłączyć z
-          losowania (tylko podświetlone nazwy będą uwzględnione).
-        </span>
+          <span v-else>
+            Wagony posiadające wybrane ładunki. Najedź na nazwę, aby zobaczyć podgląd wagonu. Kliknij, aby wyłączyć z
+            losowania (tylko podświetlone nazwy będą uwzględnione).
+          </span>
+        </div>
       </div>
 
-      <div class="generator_vehicles">
+      <div class="generator_vehicles" v-if="computedChosenCarTypes.size != 0">
         <button
           :data-chosen="true"
           :data-excluded="excludedCarTypes.includes(carType)"
@@ -90,11 +98,12 @@ import { useStore } from '../../store';
 
 import stockMixin from '../../mixins/stockMixin';
 import { ICargo, ICarWagon } from '../../types';
+import warningsMixin from '../../mixins/warningsMixin';
 
 export default defineComponent({
   name: 'stock-generator',
 
-  mixins: [stockMixin],
+  mixins: [stockMixin, warningsMixin],
 
   data() {
     return {
@@ -169,13 +178,16 @@ export default defineComponent({
         return acc;
       }, [] as { constructionType: string; carPool: { carWagon: ICarWagon; cargo?: ICargo }[] }[]);
 
-      this.store.stockList.length = this.store.stockList[0]?.isLoco ? 1 : 0;
+      const headingLoco = this.store.stockList[0]?.isLoco ? this.store.stockList[0] : undefined;
+
+      this.store.stockList.length = headingLoco ? 1 : 0;
+      const maxMass = this.store.acceptableMass || this.maxMass;
 
       new Array(this.maxCarCount).fill(0).forEach(() => {
         const randomStockType = generatedChosenStockList[~~(Math.random() * generatedChosenStockList.length)];
         const { carWagon, cargo } = randomStockType.carPool[~~(Math.random() * randomStockType.carPool.length)];
 
-        if (this.store.totalMass + (cargo?.totalMass || carWagon.mass) > this.maxMass) return;
+        if (this.store.totalMass + (cargo?.totalMass || carWagon.mass) > maxMass) return;
         if (this.store.totalLength + carWagon.length > this.maxLength) return;
 
         this.addCarWagon(carWagon, cargo);
@@ -226,10 +238,6 @@ export default defineComponent({
 @import '../../styles/global.scss';
 @import '../../styles/tab.scss';
 
-h2 {
-  margin: 1em 0;
-}
-
 .generator_cargo,
 .generator_vehicles {
   display: grid;
@@ -271,16 +279,17 @@ h2 {
   }
 }
 
-.generator_vehicles {
-  margin-top: 1em;
+.tab_content {
+  display: flex;
+  flex-direction: column;
+  gap: 1em;
 }
 
 hr {
   height: 3px;
   background-color: white;
   outline: none;
-
-  margin: 15px 0;
+  margin: 0;
 }
 
 .generator_warning {

src/components/tabs/StockListTab.vue

@@ -62,7 +62,8 @@
       <span>
         Masa: <span class="text--accent">{{ store.totalMass }}t</span> - Długość:
         <span class="text--accent">{{ store.totalLength }}m</span>
-        - Vmax pociągu: <span class="text--accent">{{ store.maxStockSpeed }} km/h</span>
+        - vMax: <span class="text--accent">{{ store.maxStockSpeed }} km/h</span> - tMax:
+        <span class="text--accent">{{ store.acceptableMass || '-' }}t</span>
       </span>
     </div>
 

src/mixins/warningsMixin.ts

@@ -18,32 +18,7 @@ export default defineComponent({
     },
 
     trainTooHeavy() {
-      const totalMass = this.store.totalMass;
-      const isTrainPassenger = this.store.isTrainPassenger;
-      const stockList = this.store.stockList;
-
-      if (stockList.length == 0 || !stockList[0].isLoco) return false;
-
-      const activeLocomotiveType = stockList[0].type;
-
-      // Spalinowy SM
-      if (/^SM/.test(activeLocomotiveType) && totalMass > 2400) return true;
-
-      // Elektryczne EU07 / EP07 / EP08 / ET41
-
-      // Pasażerski elektr.
-      if (isTrainPassenger) {
-        if (/^(EU|EP)/.test(activeLocomotiveType) && totalMass > 650) return true;
-        if (/^ET/.test(activeLocomotiveType) && totalMass > 700) return true;
-
-        return false;
-      }
-
-      // Towarowy / inny elektr.
-      if (/^EU/.test(activeLocomotiveType) && totalMass > 2000) return true;
-      if (/^ET/.test(activeLocomotiveType) && totalMass > 4000) return true;
-
-      return false;
+      return this.store.acceptableMass && this.store.totalMass > this.store.acceptableMass;
     },
 
     locoNotSuitable() {

src/store.ts

@@ -1,6 +1,7 @@
 import { IStore } from './types';
 import { defineStore } from 'pinia';
 import {
+  acceptableMass,
   carDataList,
   chosenRealStock,
   isTrainPassenger,
@@ -53,6 +54,7 @@ export const useStore = defineStore({
     maxStockSpeed: (state) => maxStockSpeed(state),
     isTrainPassenger: (state) => isTrainPassenger(state),
     chosenRealStock: (state) => chosenRealStock(state),
+    acceptableMass: (state) => acceptableMass(state),
   },
 });
 

src/utils/vehicleUtils.ts

@@ -111,6 +111,30 @@ export function maxStockSpeed(state: IStore) {
   return speedLimitByMass ? Math.min(stockSpeedLimit, speedLimitByMass) : stockSpeedLimit;
 }
 
+export function acceptableMass(state: IStore) {
+  if (state.stockList.length == 0 || !state.stockList[0].isLoco) return 0;
+  const activeLocomotiveType = state.stockList[0].type;
+
+  if (/^SM/.test(activeLocomotiveType)) return 2400;
+
+  // Elektryczne EU07 / EP07 / EP08 / ET41
+
+  // Pasażerski elektr.
+  if (isTrainPassenger(state)) {
+    if (/^(EU|EP)/.test(activeLocomotiveType)) return 650;
+    if (/^ET/.test(activeLocomotiveType)) return 700;
+
+    return 0;
+  }
+
+  // Towarowy / inny elektr.
+  if (/^EU/.test(activeLocomotiveType)) return 2000;
+  if (/^ET/.test(activeLocomotiveType)) return 4000;
+  if (/^EP/.test(activeLocomotiveType)) return 0;
+
+  return 0;
+}
+
 export function isTrainPassenger(state: IStore) {
   if (state.stockList.length == 0) return false;
   if (state.stockList.every((stock) => stock.isLoco)) return false;
@@ -139,124 +163,3 @@ export function chosenRealStock(state: IStore) {
   return realStockObj;
 }
 
-// export function maxAllowedSpeed(state: IStore) {
-//   const headLocoType = state.stockList[0]?.isLoco ? state.stockList[0].type : undefined;
-
-//   if (!headLocoType) return 0;
-
-//   const isPassenger = isTrainPassenger(state);
-//   const stockMass = totalMass(state);
-
-//   // const maxSpeed = maxAllowedSpeedTable[headLocoType];
-
-//   // if()
-// }
-
-// export function maxAllowedSpeed(state: IStore) {
-//   if (state.stockList.length < 1) return -1;
-//   if (!state.stockList[0].isLoco) return -1;
-
-//   const headingLoco = state.stockList[0];
-//   const isPassenger = isTrainPassenger(state);
-
-//   if (headingLoco.type.startsWith('EU07')) {
-//     if (isPassenger && totalMass.value <= 650) return 125;
-//     if (!isPassenger && totalMass.value <= 2000) return 70;
-
-//     return -1;
-//   }
-
-//   if (headingLoco.type.startsWith('EP07')) {
-//     if (isPassenger && totalMass.value <= 650) return 125;
-//     if (!isPassenger) return -1;
-
-//     return -1;
-//   }
-
-//   if (headingLoco.type.startsWith('EP08')) {
-//     if (isPassenger && totalMass.value <= 650) return 140;
-//     if (!isPassenger) return -1;
-
-//     return -1;
-//   }
-
-//   if (headingLoco.type.startsWith('ET41')) {
-//     if (isPassenger && totalMass.value <= 700) return 125;
-//     if (!isPassenger && totalMass.value <= 4000) return 70;
-
-//     return -1;
-//   }
-
-//   if (headingLoco.type.startsWith('SM42')) {
-//     if (totalMass.value <= 95) return 90;
-//     if (totalMass.value <= 200) return 80;
-//     if (totalMass.value <= 300) return 70;
-//     if (totalMass.value <= 450) return 60;
-//     if (totalMass.value <= 750) return 50;
-//     if (totalMass.value <= 1130) return 40;
-//     if (totalMass.value <= 1720) return 30;
-//     if (totalMass.value <= 2400) return 20;
-
-//     return -1;
-//   }
-
-//   return Store.stockList.reduce((acc, stock) => (stock.maxSpeed < acc || acc == 0 ? stock.maxSpeed : acc), 0);
-// });
-
-// export const warnings = {
-//   trainTooLong: computed(() => {
-//     if (isTrainPassenger.value && totalLength.value > 350) return true;
-//     if (!isTrainPassenger.value && totalLength.value > 650) return true;
-
-//     return false;
-//   }),
-
-//   locoNotSuitable: computed(() => {
-//     if (
-//       !isTrainPassenger.value &&
-//       Store.stockList.length > 1 &&
-//       !Store.stockList.every((stock) => stock.isLoco) &&
-//       Store.stockList.find((stock) => stock.isLoco && stock.type.startsWith('EP'))
-//     )
-//       return true;
-
-//     return false;
-//   }),
-
-//   trainTooHeavy: computed(() => {
-//     if (Store.stockList.length == 0 || !Store.stockList[0].isLoco) return false;
-
-//     const headingLoco = Store.stockList[0];
-
-//     if (
-//       isTrainPassenger.value &&
-//       (headingLoco.type.startsWith('EU') || headingLoco.type.startsWith('EP')) &&
-//       totalMass.value > 650
-//     )
-//       return true;
-//     if (isTrainPassenger.value && headingLoco.type.startsWith('ET') && totalMass.value > 700) return true;
-
-//     if (!isTrainPassenger.value && headingLoco.type.startsWith('EU') && totalMass.value > 2000) return true;
-//     if (!isTrainPassenger.value && headingLoco.type.startsWith('ET') && totalMass.value > 4000) return true;
-
-//     if (headingLoco.type.startsWith('SM') && totalMass.value > 2400) return true;
-
-//     return false;
-//   }),
-
-//   tooManyLocos: computed(() => {
-//     if (
-//       Store.stockList.reduce((acc, stock) => {
-//         if (!stock.isLoco) return acc;
-
-//         acc += stock.count;
-
-//         return acc;
-//       }, 0) > 2
-//     )
-//       return true;
-
-//     return false;
-//   }),
-// };
-