Action and attack components show up correctly on character sheet

This commit is contained in:
Thaum Rystra
2020-04-24 15:10:58 +02:00
parent 7bf0e959d7
commit b1328e4cf5
6 changed files with 114 additions and 19 deletions

View File

@@ -8,28 +8,28 @@ let ResultsSchema = new SimpleSchema({
// Adjustments applied when taking this action
// Ideally, if these adjustments can't be made, the action should be unusable
adjustments: {
type: Array,
defaultValue: [],
type: Array,
defaultValue: [],
},
'adjustments.$': {
type: AdjustmentSchema,
type: AdjustmentSchema,
},
// Damage is done to hitpoints or hitpoint-like stats
// has a damage type, can be mitigated by resistances, etc.
damages: {
type: Array,
defaultValue: [],
type: Array,
defaultValue: [],
},
'damages.$': {
type: DamageSchema,
type: DamageSchema,
},
// Buffs applied when taking this action
buffs: {
type: Array,
defaultValue: [],
type: Array,
defaultValue: [],
},
'buffs.$': {
type: StoredBuffWithIdSchema,
type: StoredBuffWithIdSchema,
},
});

View File

@@ -153,7 +153,10 @@
class="actions"
>
<v-card>
<v-list>
<v-list
two-line
subheader
>
<v-subheader>Actions</v-subheader>
<action-list-tile
v-for="action in actions"

View File

@@ -4,17 +4,22 @@
v-on="hasClickListener ? {click} : {}"
>
<v-list-tile-content>
{{ model.name }}
<v-list-tile-title>
{{ model.name }}
</v-list-tile-title>
<v-list-tile-sub-title>
<results :model="model.results" />
</v-list-tile-sub-title>
</v-list-tile-content>
</v-list-tile>
</template>
<script>
import ComputedForCreature from '/imports/ui/components/computation/ComputedForCreature.vue';
import Results from '/imports/ui/properties/components/results/Results.vue';
export default {
components: {
Computed: ComputedForCreature,
Results,
},
props: {
model: {

View File

@@ -1,20 +1,34 @@
<template lang="html">
<v-list-tile
class="ability-list-tile"
avatar
v-on="hasClickListener ? {click} : {}"
>
<v-list-tile-avatar color="grey darken-1">
<computed
signed
:value="model.rollBonus"
class="white--text headline"
/>
</v-list-tile-avatar>
<v-list-tile-content>
<computed signed :value="model.rollBonus"/>
{{ model.name }}
<v-list-tile-title>
{{ model.name }}
</v-list-tile-title>
<v-list-tile-sub-title>
<results :model="model.results" />
</v-list-tile-sub-title>
</v-list-tile-content>
</v-list-tile>
</template>
<script>
import Results from '/imports/ui/properties/components/results/Results.vue';
import ComputedForCreature from '/imports/ui/components/computation/ComputedForCreature.vue';
export default {
components: {
Results,
Computed: ComputedForCreature,
},
props: {

View File

@@ -0,0 +1,73 @@
<template lang="html">
<div class="results inline">
<span
v-if="model.damages && model.damages.length"
class="damages"
>
<span
v-for="damage in model.damages"
:key="damage._id"
class="damage"
>
<computed
:value="damage.damage"
:expect-number="false"
class="inline"
/>
{{ damage.damageType }} damage
</span>
</span>
<span
v-if="model.adjustments && model.adjustments.length"
class="adjustments"
>
<span
v-for="adjustment in model.adjustments"
:key="adjustment._id"
class="adjustment"
>
<computed
:value="adjustment.adjustment"
signed
:expect-number="false"
class="inline"
/>
{{ adjustment.stat }}
</span>
</span>
<span
v-if="model.buffs && model.buffs.length"
class="buffs"
>
<span
v-for="buff in model.buffs"
:key="buff._id"
class="buff"
>
{{ buff.name }}
</span>
</span>
</div>
</template>
<script>
import ComputedForCreature from '/imports/ui/components/computation/ComputedForCreature.vue';
export default {
components: {
Computed: ComputedForCreature,
},
props: {
model: {
type: Object,
required: true,
},
},
}
</script>
<style lang="css" scoped>
.inline {
display: inline;
}
</style>

View File

@@ -11,13 +11,13 @@
@change="(value, ack) => $emit('change', {path: ['stat'], value, ack})"
/>
<text-field
label="Damage"
label="Adjustment"
hint="The amount of damage to apply to the selected stat, can be a calculation or roll"
style="flex-basis: 300px;"
:value="model.damage"
:error-messages="errors.damage"
:value="model.adjustment"
:error-messages="errors.adjustment"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['damage'], value, ack})"
@change="(value, ack) => $emit('change', {path: ['adjustment'], value, ack})"
/>
</div>
<smart-select