co/reinforcement_learning_simulation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

verbessertes responsives Layout
All checks were successful
ci/woodpecker/push/default Pipeline was successful
Details

Browse source
This commit is contained in:
Christian Opitz 2023-11-12 19:51:48 +01:00
parent 6fb7b5e683
commit 2e35ebd953
1 changed files with 63 additions and 59 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

122
src/App.vue
View file

@ -15,12 +15,12 @@
<div style="display: flex; justify-content: center; align-items: center;">
<div class="grid-container-spalten-2" style="max-width: 800px;">
<div class="grid-item-spalte" style="border: 0px; padding-left: 20px; padding-right: 20px;" v-bind:class="[
{ aktiv: this.wer_ist_dran_mensch },
{
inaktiv:
!this.wer_ist_dran_mensch || this.aktueller_muenzen_stand <= 0,
},
]">
{ aktiv: this.wer_ist_dran_mensch },
{
inaktiv:
!this.wer_ist_dran_mensch || this.aktueller_muenzen_stand <= 0,
},
]">
<h3>Mensch</h3>
</div>
<div class="grid-item-spalte" style="border: 0px;" v-bind:class="[
@ -137,72 +137,76 @@
<br />
<DIV style="white-space: pre-wrap;">
{{ this.ausgabe }}
</DIV>
<br />
{{ this.ausgabe }}
</DIV>
<br />
<button class="btn btn-primary" @click="neuer_spieldurchgang">
neues Spiel (Münzstand zurücksetzen)
</button>
<br />
<br />
<br />
<div style="width: 800px; margin: auto">
<button class="btn btn-primary collapsible" style="background: grey">
Vertiefung: weitere Einstellungsmöglichkeiten
<button class="btn btn-primary" @click="neuer_spieldurchgang">
neues Spiel (Münzstand zurücksetzen)
</button>
<div class="content" id="content0" style="text-align: center">
<br />
<button class="btn btn-primary" style="background-color: red" @click="initialisiere_spiel">
Alle gelernten KI-Züge löschen.
<br />
<br />
<br />
<div style="display: flex; justify-content: center; align-items: center;">
<div style="max-width: 800px; margin: auto">
<button class="btn btn-primary collapsible" style="background: grey">
Vertiefung: weitere Einstellungsmöglichkeiten
</button>
<br />
<div class="content" id="content0" style="text-align: center">
<br />
<br />
<hr />
<br />
Durch jede Änderung werden die gelernten KI-Züge werden gelöscht.
<div class="row">
<div class="column" style="text-align: center">
<h3>Münzenanzahl</h3>
<button class="btn btn-primary" style="background-color: red" @click="initialisiere_spiel">
Alle gelernten KI-Züge löschen.
</button>
<br />
<button class="btn btn-primary" @click="update_anzahl_muenzen(--this.zustaende)">
-
</button>
&nbsp;
<b style="font-size: xx-large">{{ this.zustaende }}</b>&nbsp;
<button class="btn btn-primary" @click="update_anzahl_muenzen(++this.zustaende)">
+
</button>
<br />
<hr />
<br />
Durch jede Änderung werden die gelernten KI-Züge werden gelöscht.
<div class="row">
<div class="column" style="text-align: center">
<h3>Münzenanzahl</h3>
<br />
<br />
</div>
<button class="btn btn-primary" @click="update_anzahl_muenzen(--this.zustaende)">
-
</button>
&nbsp;
<b style="font-size: xx-large">{{ this.zustaende }}</b>&nbsp;
<button class="btn btn-primary" @click="update_anzahl_muenzen(++this.zustaende)">
+
</button>
<div class="column" style="text-align: center">
<h3>max. Münzen pro Zug</h3>
<br />
<br />
</div>
<button class="btn btn-primary" @click="update_max_muenzen_pro_zug(--this.max_muenzen_pro_zug)">
-
</button>
&nbsp;
<b style="font-size: xx-large">{{ this.max_muenzen_pro_zug }}</b>
&nbsp;
<button class="btn btn-primary" @click="update_max_muenzen_pro_zug(++this.max_muenzen_pro_zug)">
+
</button>
<br />
<br />
<div class="column" style="text-align: center">
<h3>max. Münzen pro Zug</h3>
<button class="btn btn-primary" @click="update_max_muenzen_pro_zug(--this.max_muenzen_pro_zug)">
-
</button>
&nbsp;
<b style="font-size: xx-large">{{ this.max_muenzen_pro_zug }}</b>
&nbsp;
<button class="btn btn-primary" @click="update_max_muenzen_pro_zug(++this.max_muenzen_pro_zug)">
+
</button>
<br />
<br />
</div>
</div>
</div>
</div>
</div>
<br />
<br />
<br />
<br />
</DIV>
</template>
<script>