bebe/bamort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

filled components

Browse Source
This commit is contained in:
Frank
2025-01-11 23:10:48 +01:00
parent 212a3fa1a2
commit bfb141cabe
9 changed files with 441 additions and 496 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/DatasheetView.vue
+59 -68
View File
@@ -1,74 +1,17 @@
<template>
<div class="datasheet-view">
<div class="datasheet-view" v-if="character">
<!-- Character Overview -->
<div class="character-overview">
<div class="character-image">
<img :src="imageSrc" alt="Character Image" v-if="this.character.image"/>
</div>
<div class="character-stats">
<div class="stat">
<span>{{ $t('stats.strength') }}</span>
<strong>{{ character.eigenschaften[6].value }}</strong>
</div>
<div class="stat">
<span>Gs</span>
<strong>{{ character.eigenschaften[1].value }}</strong>
</div>
<div class="stat">
<span>Gw</span>
<strong>{{ character.eigenschaften[2].value }}</strong>
</div>
<div class="stat">
<span>Ko</span>
<strong>{{ character.eigenschaften[4].value }}</strong>
</div>
<div class="stat">
<span>In</span>
<strong>{{ character.eigenschaften[3].value }}</strong>
</div>
<div class="stat">
<span>Zt</span>
<strong>{{ character.eigenschaften[8].value }}</strong>
</div>
<div class="stat">
<span>Au</span>
<strong>{{ character.eigenschaften[0].value }}</strong>
</div>
<div class="stat">
<span>pA</span>
<strong>{{ character.eigenschaften[5].value }}</strong>
</div>
<div class="stat">
<span>Wk</span>
<strong>{{ character.eigenschaften[7].value }}</strong>
</div>
<div class="stat">
<span>GiT</span>
<strong>64</strong>
</div>
<div class="stat">
<span>B</span>
<strong>{{ character.b.max }}</strong>
</div>
<div class="stat">
<span>LP</span>
<strong>{{ character.lp.max }}</strong>
</div>
<div class="stat">
<span>AP</span>
<strong>{{ character.ap.max }}</strong>
</div>
<div class="stat">
<span>GG</span>
<strong>{{ character.bennies.gg }}</strong>
</div>
<div class="stat">
<span>SG</span>
<strong>{{ character.bennies.sg }}</strong>
<div class="stat" v-for="(stat, index) in characterStats" :key="index">
<span>{{ $t(stat.label) }}</span>
<strong>{{ getStat(stat.path) }}</strong>
</div>
</div>
</div>
<!-- Character Information -->
<div class="character-info">
<p>
@@ -76,21 +19,33 @@
<strong>Aktuelle Kampagne:</strong> Melzindar
</p>
<p>
{{ character.typ }} (xmännlich), Grad: {{ character.grad }}, Rasse: {{ character.rasse }}, Heimat: xAlba, Stand:
xMittelschicht.
{{ character.typ || 'x' }} ({{ character.geschlecht || 'x' }}nännlich),
Grad: {{ character.grad || 'x' }},
Rasse: {{ character.rasse || 'x' }},
Heimat: {{ character.heimat || 'x' }}Alba,
Stand: {{ character.heimat || 'x' }}Mittelschicht.
</p>
<p>
Hort für Grad 3: 125 GS, für nächsten Grad: 250 GS.
</p>
<p>
<strong>Spezialisierung:</strong> {{ character.spezialisierung }}.
<strong>Spezialisierung:</strong> {{ character.spezialisierung || '-'}}.
</p>
<p>
Alter: {{ character.alter }},<strong v-if="character.hand='rechts'"> Rechtshänder</strong><strong v-else-if="character.hand='links'"> Linkshänder</strong><strong v-else> Beidhändig</strong >, Größe: {{ character.groesse }}cm, Gewicht: {{ character.gewicht }}kg, Gestalt: {{ character.merkmale.groesse }},
und {{ character.merkmale.breite }}, Augen: {{ character.merkmale.augenfarbe }}, Haare: {{ character.merkmale.haarfarbe }}, Glaube: {{ character.glaube }}.
Alter: {{ character.alter || 'xx' }},
<strong v-if="character.hand='rechts'"> Rechtshänder</strong>
<strong v-else-if="character.hand='links'"> Linkshänder</strong>
<strong v-else> Beidhändig</strong>,
Größe: {{ character.groesse }}cm,
Gewicht: {{ character.gewicht }}kg,
Gestalt: {{ character.merkmale?.groesse || '-'}}
und {{ character.merkmale?.breite || '-'}},
Augen: {{ character.merkmale?.augenfarbe || '-' }},
Haare: {{ character.merkmale?.haarfarbe || '-' }},
Glaube: {{ character.glaube }}.
</p>
<p>
<strong>Merkmale:</strong> {{ character.merkmale.sonstige }}
<strong>Merkmale:</strong> {{ character.merkmale?.sonstige || '-' }}
</p>
<p>
<em>Persönlicher Bonus für</em> Ausdauer 12, Schaden 5, Angriff 2,
@@ -98,7 +53,7 @@
</p>
</div>
</div> <!--- end character -datasheet-->
<div v-else>Loading character data...</div>
</template>
<style>
@@ -116,6 +71,42 @@ export default {
type: Object,
required: true
}
},
computed: {
imageSrc() {
return this.character.image
? `${this.character.image}`
: "";
},
},
data() {
return {
characterStats: [
{ label: 'stats.strength', path: 'eigenschaften.6.value' },
{ label: 'stats.dexterity', path: 'eigenschaften.1.value' },
{ label: 'stats.agility', path: 'eigenschaften.2.value' },
{ label: 'stats.constitution', path: 'eigenschaften.4.value' },
{ label: 'stats.intelligence', path: 'eigenschaften.3.value' },
{ label: 'stats.spelltalent', path: 'eigenschaften.8.value' },
{ label: 'stats.beauty', path: 'eigenschaften.0.value' },
{ label: 'stats.charisma', path: 'eigenschaften.5.value' },
{ label: 'stats.willpower', path: 'eigenschaften.7.value' },
{ label: 'stats.poisontolerance', path: 'git' },
{ label: 'stats.movement', path: 'b.max' },
{ label: 'stats.lifepoints', path: 'lp.max'},
{ label: 'stats.staminapoints', path: 'ap.max'},
{ label: 'stats.divinegrace', path: 'bennies.gg'},
{ label: 'stats.fatesfavor', path: 'bennies.sg' }
]
}
},
methods: {
getStat(path) {
if (path === 'git' ){
return '64!'
}
return path.split('.').reduce((obj, key) => obj?.[key], this.character) ?? '-'
}
}
};
</script>