Began working on bringing forms and UI in line with data structure overhaul
This commit is contained in:
@@ -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();
|
||||
}
|
||||
|
||||
@@ -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 };
|
||||
@@ -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,
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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'
|
||||
|
||||
@@ -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 />
|
||||
|
||||
@@ -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 />
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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: {
|
||||
|
||||
@@ -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>
|
||||
@@ -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: {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template lang="html">
|
||||
<div>
|
||||
<div class="adjustment-form">
|
||||
<div class="layout row">
|
||||
<smart-combobox
|
||||
label="Attribute"
|
||||
|
||||
@@ -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>
|
||||
@@ -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: {
|
||||
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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>
|
||||
@@ -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"
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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(){
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
Reference in New Issue
Block a user