Began working on bringing forms and UI in line with data structure overhaul

This commit is contained in:
Thaum Rystra
2020-05-17 00:06:19 +02:00
parent ca5ded7ded
commit ad3bec3521
26 changed files with 115 additions and 788 deletions

View File

@@ -32,15 +32,21 @@ export default function getActiveProperties({
'ancestors.id': ancestorId,
}, {
fields: {_id: 1},
}).forEach(prop => {
disabledAncestorIds.push(prop._id);
}).forEach(subCreature => {
disabledAncestorIds.push(subCreature._id);
});
// Get all the properties that aren't from the excluded decendents
// Get all the properties that are decendents of the ancestor of interest but
// aren't from the excluded decendents
filter['ancestors.id'] = {
$eq: ancestorId,
$nin: disabledAncestorIds,
};
// Get properties that aren't removed
filter.removed = {$ne: true};
// Don't include the disabled ancestors themselves either
filter._id = {
$nin: disabledAncestorIds,
}
return CreatureProperties.find(filter, options).fetch();
}

View File

@@ -1,15 +0,0 @@
import SimpleSchema from 'simpl-schema';
const ResultSchema = new SimpleSchema({
name: {
type: String,
optional: true,
},
// Expression of whether or not to apply the children
comparison: {
type: String,
optional: true,
},
});
export { ResultSchema };

View File

@@ -3,33 +3,32 @@ import { ActionSchema } from '/imports/api/properties/Actions.js';
import { AdjustmentSchema } from '/imports/api/properties/Adjustments.js';
import { AttackSchema } from '/imports/api/properties/Attacks.js';
import { ComputedAttributeSchema } from '/imports/api/properties/Attributes.js';
import { AppliedBuffSchema } from '/imports/api/properties/Buffs.js';
import { BuffSchema } from '/imports/api/properties/Buffs.js';
import { ClassLevelSchema } from '/imports/api/properties/ClassLevels.js';
import { ContainerSchema } from '/imports/api/properties/Containers.js';
import { DamageSchema } from '/imports/api/properties/Damages.js';
import { DamageMultiplierSchema } from '/imports/api/properties/DamageMultipliers.js';
import { ComputedEffectSchema } from '/imports/api/properties/Effects.js';
import { ExperienceSchema } from '/imports/api/properties/Experiences.js';
import { FeatureSchema } from '/imports/api/properties/Features.js';
import { FolderSchema } from '/imports/api/properties/Folders.js';
import { ItemSchema } from '/imports/api/properties/Items.js';
import { NoteSchema } from '/imports/api/properties/Notes.js';
import { ProficiencySchema } from '/imports/api/properties/Proficiencies.js';
import { ResultSchema } from '/imports/api/properties/Results.js';
import { RollSchema } from '/imports/api/properties/Rolls.js';
import { SavingThrowSchema } from '/imports/api/properties/SavingThrows.js';
import { ComputedSkillSchema } from '/imports/api/properties/Skills.js';
import { SlotSchema } from '/imports/api/properties/Slots.js';
import { SpellListSchema } from '/imports/api/properties/SpellLists.js';
import { SpellSchema } from '/imports/api/properties/Spells.js';
import { SpellListSchema } from '/imports/api/properties/SpellLists.js';
import { ToggleSchema } from '/imports/api/properties/Toggles.js';
import { ContainerSchema } from '/imports/api/properties/Containers.js';
import { ItemSchema } from '/imports/api/properties/Items.js';
const propertySchemasIndex = {
action: ActionSchema,
adjustment: AdjustmentSchema,
attack: AttackSchema,
attribute: ComputedAttributeSchema,
buff: AppliedBuffSchema,
buff: BuffSchema,
classLevel: ClassLevelSchema,
damage: DamageSchema,
damageMultiplier: DamageMultiplierSchema,
@@ -39,7 +38,6 @@ const propertySchemasIndex = {
folder: FolderSchema,
note: NoteSchema,
proficiency: ProficiencySchema,
result: ResultSchema,
roll: RollSchema,
savingThrow: SavingThrowSchema,
skill: ComputedSkillSchema,

View File

@@ -3,7 +3,7 @@ import { ActionSchema } from '/imports/api/properties/Actions.js';
import { AdjustmentSchema } from '/imports/api/properties/Adjustments.js';
import { AttackSchema } from '/imports/api/properties/Attacks.js';
import { AttributeSchema } from '/imports/api/properties/Attributes.js';
import { StoredBuffSchema } from '/imports/api/properties/Buffs.js';
import { BuffSchema } from '/imports/api/properties/Buffs.js';
import { ClassLevelSchema } from '/imports/api/properties/ClassLevels.js';
import { DamageSchema } from '/imports/api/properties/Damages.js';
import { DamageMultiplierSchema } from '/imports/api/properties/DamageMultipliers.js';
@@ -13,7 +13,6 @@ import { FeatureSchema } from '/imports/api/properties/Features.js';
import { FolderSchema } from '/imports/api/properties/Folders.js';
import { NoteSchema } from '/imports/api/properties/Notes.js';
import { ProficiencySchema } from '/imports/api/properties/Proficiencies.js';
import { ResultSchema } from '/imports/api/properties/Results.js';
import { RollSchema } from '/imports/api/properties/Rolls.js';
import { SavingThrowSchema } from '/imports/api/properties/SavingThrows.js';
import { SkillSchema } from '/imports/api/properties/Skills.js';
@@ -29,7 +28,7 @@ const propertySchemasIndex = {
adjustment: AdjustmentSchema,
attack: AttackSchema,
attribute: AttributeSchema,
buff: StoredBuffSchema,
buff: BuffSchema,
classLevel: ClassLevelSchema,
damage: DamageSchema,
damageMultiplier: DamageMultiplierSchema,
@@ -39,7 +38,6 @@ const propertySchemasIndex = {
folder: FolderSchema,
note: NoteSchema,
proficiency: ProficiencySchema,
result: ResultSchema,
roll: RollSchema,
savingThrow: SavingThrowSchema,
skill: SkillSchema,

View File

@@ -3,6 +3,10 @@ const PROPERTIES = Object.freeze({
icon: 'offline_bolt',
name: 'Action'
},
adjustment: {
icon: 'warning',
name: 'Adjustment'
},
attack: {
icon: 'bolt',
name: 'Attack'
@@ -19,6 +23,10 @@ const PROPERTIES = Object.freeze({
icon: 'school',
name: 'Class level'
},
damage: {
icon: 'report',
name: 'Damage'
},
damageMultiplier: {
icon: 'layers',
name: 'Damage multiplier'

View File

@@ -5,7 +5,7 @@
:type="model.type"
class="mr-2"
/>
<v-toolbar-title class="title">
<v-toolbar-title>
{{ model.name || getPropertyName(model.type) }}
</v-toolbar-title>
<v-spacer />

View File

@@ -5,7 +5,7 @@
:type="model.type"
class="mr-2"
/>
<v-toolbar-title class="title">
<v-toolbar-title>
{{ getPropertyName(model.type) }}
</v-toolbar-title>
<v-spacer />

View File

@@ -7,20 +7,12 @@
<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';
export default {
components: {
Results,
},
props: {
model: {
type: Object,

View File

@@ -15,20 +15,15 @@
<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

@@ -1,73 +0,0 @@
<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

@@ -33,15 +33,6 @@
@change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
/>
<form-sections>
<form-section name="Results">
<results-form
:model="model.results"
:parent-target="model.target"
@change="({path, value, ack}) => $emit('change', {path: ['results', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['results', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['results', ...path], ack})"
/>
</form-section>
<form-section name="Resources">
<resources-form
:model="model.resources"
@@ -51,15 +42,6 @@
/>
</form-section>
<form-section name="Advanced">
<text-field
v-if="attackForm"
label="Ammunition"
hint="The variable name of the item used as ammunition"
:value="model.ammunition"
:error-messages="errors.ammunition"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['ammunition'], value, ack})"
/>
<v-combobox
label="Tags"
multiple
@@ -118,14 +100,12 @@
<script>
import FormSection, {FormSections} from '/imports/ui/properties/forms/shared/FormSection.vue';
import ResultsForm from '/imports/ui/properties/forms/ResultsForm.vue';
import ResourcesForm from '/imports/ui/properties/forms/ResourcesForm.vue';
export default {
components: {
FormSection,
FormSections,
ResultsForm,
ResourcesForm,
},
props: {

View File

@@ -1,5 +1,5 @@
<template lang="html">
<div>
<div class="adjustment-form">
<div class="layout row">
<smart-combobox
label="Attribute"

View File

@@ -1,58 +0,0 @@
<template lang="html">
<div>
<v-slide-x-transition group>
<div
v-for="(adjustment, i) in model"
:key="adjustment._id || i"
>
<v-divider v-if="i !== 0" />
<div class="layout row align-center">
<div style="flex-grow: 1;">
<adjustment-form
class="mt-4"
:model="adjustment"
:parent-target="parentTarget"
@change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
/>
</div>
<v-btn
outline
icon
large
class="ma-3"
@click="$emit('pull', {path: [i]})"
>
<v-icon>delete</v-icon>
</v-btn>
</div>
</div>
</v-slide-x-transition>
</div>
</template>
<script>
import AdjustmentForm from '/imports/ui/properties/forms/AdjustmentForm.vue';
export default {
components: {
AdjustmentForm,
},
props: {
model: {
type: Array,
default: () => ([]),
},
parentTarget: {
type: String,
default: undefined,
},
debounceTime: {
type: Number,
default: undefined,
},
},
}
</script>
<style lang="css" scoped>
</style>

View File

@@ -22,34 +22,11 @@
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['duration'], value, ack})"
/>
<div v-if="stored">
<smart-select
v-if="parentTarget !== 'self'"
label="Target"
:hint="targetOptionHint"
:items="targetOptions"
:value="model.target"
:error-messages="errors.target"
:menu-props="{auto: true, lazy: true}"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['target'], value, ack})"
/>
<effect-list-form
:model="model.effects"
@change="({path, value, ack}) => $emit('change', {path: ['effects', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['effects', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['effects', ...path], ack})"
/>
</div>
</div>
</template>
<script>
import EffectListForm from '/imports/ui/properties/forms/EffectListForm.vue';
export default {
components: {
EffectListForm,
},
props: {
stored: Boolean,
model: {

View File

@@ -1,62 +0,0 @@
<template lang="html">
<div>
<v-slide-x-transition group>
<div
v-for="(buff, i) in model"
:key="buff._id || i"
>
<v-divider v-if="i !== 0" />
<div class="layout row align-center">
<div style="flex-grow: 1;">
<buff-form
class="mt-4"
:model="buff"
:parent-target="parentTarget"
:stored="true"
@change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: [i, ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: [i, ...path], ack})"
/>
</div>
<v-btn
outline
icon
large
class="ma-3"
@click="$emit('pull', {path: [i]})"
>
<v-icon>delete</v-icon>
</v-btn>
</div>
</div>
</v-slide-x-transition>
</div>
</template>
<script>
import BuffForm from '/imports/ui/properties/forms/BuffForm.vue';
import { StoredBuffWithIdSchema } from '/imports/api/properties/Buffs.js';
export default {
components: {
BuffForm,
},
props: {
model: {
type: Array,
default: () => ([]),
},
parentTarget: {
type: String,
default: undefined,
},
debounceTime: {
type: Number,
default: undefined,
},
},
}
</script>
<style lang="css" scoped>
</style>

View File

@@ -1,55 +0,0 @@
<template lang="html">
<div>
<v-slide-x-transition group>
<div
v-for="(damage, i) in model"
:key="damage._id || i"
>
<v-divider v-if="i !== 0" />
<div class="layout row align-center">
<div style="flex-grow: 1;">
<damage-form
class="mt-4"
:model="damage"
:parent-target="parentTarget"
@change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
/>
</div>
<v-btn
outline
icon
large
class="ma-3"
@click="$emit('pull', {path: [i]})"
>
<v-icon>delete</v-icon>
</v-btn>
</div>
</div>
</v-slide-x-transition>
</div>
</template>
<script>
import DamageForm from '/imports/ui/properties/forms/DamageForm.vue';
export default {
components: {
DamageForm,
},
props: {
model: {
type: Array,
default: () => ([]),
},
parentTarget: {
type: String,
default: undefined,
},
debounceTime: {
type: Number,
default: undefined,
},
},
}
</script>

View File

@@ -1,89 +0,0 @@
<template lang="html">
<div>
<v-slide-x-transition group>
<div
v-for="(effect, i) in model"
:key="effect._id || i"
>
<v-divider v-if="i !== 0" />
<div class="layout row align-center">
<div style="flex-grow: 1;">
<effect-form
class="mt-4"
:model="effect"
:parent-target="parentTarget"
:stored="stored"
@change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
@pull="(ack) => $emit('pull', {path: [i], ack})"
/>
</div>
<v-btn
outline
icon
large
class="ma-3"
@click="$emit('pull', {path: [i]})"
>
<v-icon>delete</v-icon>
</v-btn>
</div>
</div>
</v-slide-x-transition>
<div class="layout row justify-end">
<v-btn
:loading="addEffectLoading"
:disabled="addEffectLoading"
outline
@click="addEffect"
>
<v-icon>add</v-icon>
Add Effect
</v-btn>
</div>
</div>
</template>
<script>
import EffectForm from '/imports/ui/properties/forms/EffectForm.vue';
import { EffectSchema } from '/imports/api/properties/Effects.js';
export default {
components: {
EffectForm,
},
props: {
stored: Boolean,
model: {
type: Array,
default: () => ([]),
},
parentTarget: {
type: String,
default: undefined,
},
debounceTime: {
type: Number,
default: undefined,
},
},
data(){return {
addEffectLoading: false,
}},
methods: {
acknowledgeAddEffect(){
this.addEffectLoading = false;
},
addEffect(){
this.addEffectLoading = true;
this.$emit('push', {
path: [],
value: EffectSchema.clean({}),
ack: this.acknowledgeAddEffect,
});
},
},
}
</script>
<style lang="css" scoped>
</style>

View File

@@ -1,16 +1,5 @@
<template lang="html">
<div class="class-form">
<div class="layout column align-center">
<text-field
label="XP"
type="number"
class="base-value-field text-xs-center large-format no-flex"
:value="model.value"
:error-messages="errors.value"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
/>
</div>
<div class="layout row wrap">
<text-field
label="Title"
@@ -46,6 +35,18 @@
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
/>
<div class="layout column align-end">
<text-field
label="XP gained"
type="number"
class="base-value-field text-xs-center large-format no-flex"
hint="The number of experience points gained from this entry"
:value="model.value"
:error-messages="errors.value"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
/>
</div>
</div>
</template>

View File

@@ -1,146 +0,0 @@
<template lang="html">
<div class="results-form">
<div
v-if="model.damages.length"
class="subheading"
>
Damage
</div>
<damage-list-form
:model="model.damages"
:parent-target="parentTarget"
@change="({path, value, ack}) => $emit('change', {path: ['damages', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['damages', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['damages', ...path], ack})"
/>
<div
v-if="model.adjustments.length"
class="subheading"
>
Adjustments
</div>
<adjustment-list-form
:model="model.adjustments"
:parent-target="parentTarget"
@change="({path, value, ack}) => $emit('change', {path: ['adjustments', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['adjustments', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['adjustments', ...path], ack})"
/>
<div
v-if="model.buffs.length"
class="subheading"
>
Buffs
</div>
<buff-list-form
:model="model.buffs"
:parent-target="parentTarget"
:stored="buffsStored"
@change="({path, value, ack}) => $emit('change', {path: ['buffs', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['buffs', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['buffs', ...path], ack})"
/>
<div class="layout row justify-center">
<v-menu
origin="center center"
transition="scale-transition"
nudge-top="50%"
nudge-left="50%"
>
<template #activator="{ on }">
<v-btn
:loading="addResultLoading"
:disabled="addResultLoading"
icon
large
outline
v-on="on"
>
<v-icon>add</v-icon>
</v-btn>
</template>
<v-list>
<v-list-tile@click="addDamage">
<v-list-tile-title>Add Damage</v-list-tile-title>
</v-list-tile>
<v-list-tile@click="addAdjustment">
<v-list-tile-title>Add Adjustment</v-list-tile-title>
</v-list-tile>
<v-list-tile@click="addBuff">
<v-list-tile-title>Add Buff</v-list-tile-title>
</v-list-tile>
</v-list-tile@click="addbuff">
</v-list-tile@click="addadjustment">
</v-list-tile@click="adddamage">
</v-list>
</v-menu>
</div>
</div>
</template>
<script>
import AdjustmentListForm from '/imports/ui/properties/forms/AdjustmentListForm.vue';
import DamageListForm from '/imports/ui/properties/forms/DamageListForm.vue';
import BuffListForm from '/imports/ui/properties/forms/BuffListForm.vue';
import { StoredBuffWithIdSchema } from '/imports/api/properties/Buffs.js';
export default {
components: {
AdjustmentListForm,
DamageListForm,
BuffListForm,
},
props: {
model: {
type: Object,
default: () => ({}),
},
parentTarget: {
type: String,
default: undefined,
},
buffsStored: {
type: Boolean,
},
debounceTime: {
type: Number,
default: undefined,
},
},
data(){return {
addResultLoading: false,
}},
methods: {
acknowledgeAddResult(){
this.addResultLoading = false;
},
addDamage(){
this.addResultLoading = true;
this.$emit('push', {
path: ['damages'],
value: DamageSchema.clean({}),
ack: this.acknowledgeAddResult,
});
},
addAdjustment(){
this.addResultLoading = true;
this.$emit('push', {
path: ['adjustments'],
value: AdjustmentSchema.clean({}),
ack: this.acknowledgeAddResult,
});
},
addBuff(){
this.addResultLoading = true;
this.$emit('push', {
path: ['buffs'],
value: StoredBuffWithIdSchema.clean({}),
ack: this.acknowledgeAddResult
});
},
},
}
</script>
<style lang="css" scoped>
</style>

View File

@@ -8,47 +8,6 @@
@change="(value, ack) => $emit('change', {path: ['roll'], value, ack})"
/>
<form-sections>
<form-section name="Results">
<v-slide-x-transition group>
<div
v-for="(rollResult, index) in model.rollResults"
:key="rollResult._id || index"
>
<div class="layout row align-center">
<text-field
label="Comparison"
style="flex-grow: 1;"
hint="If the comparison is true, the results below will be applied"
:value="rollResult.comparison"
:error-messages="errors.rollResults && errors.rollResults[index] && errors.rollResults[index].comparison"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['rollResults', index, 'comparison'], value, ack})"
/>
<v-btn
outline
icon
large
class="ma-3"
@click="$emit('pull', {path: ['rollResults', index]})"
>
<v-icon>delete</v-icon>
</v-btn>
</div>
<v-divider class="my-4" />
</div>
</v-slide-x-transition>
<div class="layout row justify-center">
<v-btn
:loading="addResultLoading"
:disabled="addResultLoading"
outline
@click="addResult"
>
<v-icon>add</v-icon>
Add Result
</v-btn>
</div>
</form-section>
<form-section name="Advanced">
<v-combobox
label="Tags"

View File

@@ -15,37 +15,11 @@
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['ability'], value, ack})"
/>
<form-sections>
<form-section name="Results on successful save">
<results-form
:model="model.passResults"
@change="({path, value, ack}) => $emit('change', {path: ['passResults', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['passResults', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['passResults', ...path], ack})"
/>
</form-section>
<form-section name="Results on failed save">
<results-form
:model="model.failResults"
@change="({path, value, ack}) => $emit('change', {path: ['failResults', ...path], value, ack})"
@push="({path, value, ack}) => $emit('push', {path: ['failResults', ...path], value, ack})"
@pull="({path, ack}) => $emit('pull', {path: ['failResults', ...path], ack})"
/>
</form-section>
</form-sections>
</div>
</template>
<script>
import FormSection, {FormSections} from '/imports/ui/properties/forms/shared/FormSection.vue';
import ResultsForm from '/imports/ui/properties/forms/ResultsForm.vue';
export default {
components: {
FormSection,
FormSections,
ResultsForm,
},
props: {
model: {
type: Object,

View File

@@ -7,13 +7,38 @@
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
/>
<text-field
label="Condition"
:value="model.condition"
:error-messages="errors.condition"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['condition'], value, ack})"
/>
<v-layout
column
align-center
>
<v-radio-group
:value="radioSelection"
@change="radioChange"
>
<v-radio
value="enabled"
label="Enabled"
/>
<v-radio
value="disabled"
label="Disabled"
/>
<v-radio
value="calculated"
label="Calculated"
/>
</v-radio-group>
</v-layout>
<v-fade-transition>
<text-field
v-show="radioSelection === 'calculated'"
label="Condition"
:value="model.condition"
:error-messages="errors.condition"
:debounce-time="debounceTime"
@change="(value, ack) => $emit('change', {path: ['condition'], value, ack})"
/>
</v-fade-transition>
</div>
</template>
@@ -33,6 +58,31 @@
default: undefined,
},
},
computed: {
radioSelection(){
if (this.model.disabled){
return 'disabled';
} else if (this.model.enabled){
return 'enabled'
} else {
return 'calculated';
}
}
},
methods: {
radioChange(value){
if (value === 'enabled'){
this.$emit('change', {path: ['enabled'], value: true});
this.$emit('change', {path: ['disabled'], value: false});
} else if (value === 'disabled'){
this.$emit('change', {path: ['disabled'], value: true});
this.$emit('change', {path: ['enabled'], value: false});
} else if (value === 'calculated'){
this.$emit('change', {path: ['disabled'], value: false});
this.$emit('change', {path: ['enabled'], value: false});
}
}
}
};
</script>

View File

@@ -1,9 +1,11 @@
import ActionForm from '/imports/ui/properties/forms/ActionForm.vue';
import AdjustmentForm from '/imports/ui/properties/forms/AdjustmentForm.vue';
import AttackForm from '/imports/ui/properties/forms/AttackForm.vue';
import AttributeForm from '/imports/ui/properties/forms/AttributeForm.vue';
import BuffForm from '/imports/ui/properties/forms/BuffForm.vue';
import ContainerForm from '/imports/ui/properties/forms/ContainerForm.vue';
import ClassLevelForm from '/imports/ui/properties/forms/ClassLevelForm.vue';
import ContainerForm from '/imports/ui/properties/forms/ContainerForm.vue';
import DamageForm from '/imports/ui/properties/forms/DamageForm.vue';
import DamageMultiplierForm from '/imports/ui/properties/forms/DamageMultiplierForm.vue';
import EffectForm from '/imports/ui/properties/forms/EffectForm.vue';
import ExperienceForm from '/imports/ui/properties/forms/ExperienceForm.vue';
@@ -21,11 +23,13 @@ import ToggleForm from '/imports/ui/properties/forms/ToggleForm.vue';
export default {
action: ActionForm,
adjustment: AdjustmentForm,
attack: AttackForm,
attribute: AttributeForm,
buff: BuffForm,
container: ContainerForm,
classLevel: ClassLevelForm,
damage: DamageForm,
damageMultiplier: DamageMultiplierForm,
experience:ExperienceForm,
effect: EffectForm,

View File

@@ -26,18 +26,13 @@
:value="reset"
/>
<property-description :value="model.description" />
<results-viewer :model="model.results" />
</div>
</template>
<script>
import propertyViewerMixin from '/imports/ui/properties/viewers/shared/propertyViewerMixin.js';
import ResultsViewer from '/imports/ui/properties/viewers/ResultsViewer.vue';
export default {
components: {
ResultsViewer
},
mixins: [propertyViewerMixin],
computed: {
reset(){

View File

@@ -1,49 +1,20 @@
<template lang="html">
<div class="attribute-viewer">
<div v-if="model.value !== undefined">
<div class="display-3" v-if="model.damage !== undefined">
{{model.value - model.damage}} / {{model.value}}
</div>
<div v-else>
{{model.value}}
</div>
</div>
<property-name :value="model.name"/>
<property-field name="Duration" :value="model.duration"/>
<div>
<div class="subheading">
Effects
</div>
<div
class="layout row center mb-2 ml-2"
v-for="effect in model.effects"
>
<property-icon type="effect" class="mr-2"/>
<effect-viewer
operation="base"
:model="effect"
/>
</div>
</div>
<property-description :value="model.description"/>
</div>
<div class="buff-viewer">
<property-name :value="model.name" />
<property-field
name="Duration"
:value="model.duration"
/>
<property-description :value="model.description" />
</div>
</template>
<script>
import propertyViewerMixin from '/imports/ui/properties/viewers/shared/propertyViewerMixin.js'
import numberToSignedString from '/imports/ui/utility/numberToSignedString.js';
import EffectViewer from '/imports/ui/properties/viewers/EffectViewer.vue';
import PropertyIcon from '/imports/ui/properties/shared/PropertyIcon.vue';
export default {
mixins: [propertyViewerMixin],
components: {
EffectViewer,
PropertyIcon,
},
methods: {
numberToSignedString,
},
computed: {
reset(){
let reset = this.model.reset
@@ -55,8 +26,13 @@
return `Reset${
this.model.resetMultiplier && ' x' + this.model.resetMultiplier
} on a long rest`;
}
} else {
return undefined;
}
}
},
methods: {
numberToSignedString,
}
}
</script>

View File

@@ -1,88 +0,0 @@
<template lang="html">
<div class="results">
<div
v-if="model.damages.length"
class="damages"
>
<div class="caption">
Damage
</div>
<div class="mb-3">
<div
v-for="damage in model.damages"
:key="damage._id"
class="damage ml-2 subheading"
>
<computed
:value="damage.damage"
:expect-number="false"
class="d-inline"
/> {{ damage.damageType }} damage
</div>
</div>
</div>
<div
v-if="model.adjustments.length"
class="adjustments"
>
<div class="caption">
Attribute Damage
</div>
<p
v-for="adjustment in model.adjustments"
:key="adjustment._id"
class="adjustment ml-2 subheading"
>
<computed
:value="adjustment.adjustment"
class="d-inline"
signed
/> to {{ adjustment.stat }}
</p>
</div>
<div
v-if="model.buffs.length"
class="buffs"
>
<div class="caption">
Buffs
</div>
<div
v-for="buff in model.buffs"
:key="buff._id"
class="buff mb-3"
>
<div class="subheading">
{{ buff.name }}
</div>
<property-field
name="Duration"
:value="buff.duration"
/>
<property-description :value="buff.description" />
<effect-viewer
v-for="effect in buff.effects"
:key="effect._id"
:model="effect"
/>
</div>
</div>
</div>
</template>
<script>
import propertyViewerMixin from '/imports/ui/properties/viewers/shared/propertyViewerMixin.js';
import EffectViewer from '/imports/ui/properties/viewers/EffectViewer.vue';
import ComputedForCreature from '/imports/ui/components/computation/ComputedForCreature.vue';
export default {
components: {
EffectViewer,
Computed: ComputedForCreature,
},
mixins: [propertyViewerMixin],
}
</script>
<style lang="css" scoped>
</style>