Added UI to prepare spells

app/imports/ui/properties/components/spells/SpellList.vue

@@ -27,6 +27,7 @@
           class="item"
           :data-id="`spell-list-tile-${spell._id}`"
           :model="spell"
+          :preparing-spells="preparingSpells"
           @click="clickProperty(spell._id)"
         />
       </template>
@@ -71,6 +72,7 @@ export default {
       type: Object,
       required: true,
     },
+    preparingSpells: Boolean,
   },
   data(){ return {
     dataSpells: [],

app/imports/ui/properties/components/spells/SpellListCard.vue

@@ -9,10 +9,48 @@
         {{ model.name }}
       </v-toolbar-title>
       <v-spacer />
+      <v-menu
+        bottom
+        left
+        transition="slide-y-transition"
+        style="margin-right: -12px;"
+      >
+        <template #activator="{ on }">
+          <v-btn
+            icon
+            v-on="on"
+            @click.stop
+          >
+            <v-icon>more_vert</v-icon>
+          </v-btn>
+        </template>
+        <v-list class="pa-2">
+          <v-switch
+            v-model="preparingSpells"
+            class="ma-2"
+            label="Change prepared spells"
+            hide-details
+          />
+        </v-list>
+      </v-menu>
     </template>
+    <v-expand-transition>
+      <v-card-text
+        v-if="preparedError || preparingSpells"
+        :class="{'error--text' : preparedError}"
+        class="pb-0"
+      >
+        {{ numPrepared }}/{{ model.maxPreparedResult }} spells prepared
+        <v-switch
+          v-model="preparingSpells"
+          label="Change prepared spells"
+        />
+      </v-card-text>
+    </v-expand-transition>
     <spell-list
       :spells="spells"
       :parent-ref="{id: model._id, collection: 'creatureProperties'}"
+      :preparing-spells="preparingSpells"
     />
   </toolbar-card>
 </template>
@@ -28,9 +66,15 @@ export default {
     SpellList,
 	},
 	props: {
-		model: Object,
+		model: {
+      type: Object,
+      required: true,
+    },
 		organize: Boolean,
 	},
+  data(){ return {
+    preparingSpells: false,
+  }},
   meteor: {
     spells(){
       return getActiveProperties({
@@ -46,6 +90,21 @@ export default {
         },
       });
     },
+    numPrepared(){
+      return getActiveProperties({
+        ancestorId: this.model._id,
+        filter: {
+          type: 'spell',
+          prepared: true,
+          alwaysPrepared: {$ne: true},
+        },
+      }).length;
+    },
+    preparedError(){
+      let numPrepared = this.numPrepared;
+      let maxPrepared = this.model.maxPreparedResult;
+      return numPrepared !== maxPrepared
+    },
   },
 	methods: {
 		clickSpellList(_id){

app/imports/ui/properties/components/spells/SpellListTile.vue

@@ -19,7 +19,15 @@
       </v-list-tile-sub-title>
     </v-list-tile-content>
     <v-list-tile-action>
+      <smart-checkbox
+        v-if="preparingSpells"
+        :value="model.prepared || model.alwaysPrepared"
+        :disabled="model.alwaysPrepared"
+        @click.native.stop="() => {}"
+        @change="setPrepared"
+      />
       <v-icon
+        v-else
         style="height: 100%; width: 40px; cursor: move;"
         class="handle"
       >
@@ -31,8 +39,13 @@
 
 <script>
 import treeNodeViewMixin from '/imports/ui/properties/treeNodeViews/treeNodeViewMixin.js';
+import {updateProperty} from '/imports/api/creature/CreatureProperties.js';
+
 export default {
   mixins: [treeNodeViewMixin],
+  props: {
+    preparingSpells: Boolean,
+  },
   computed: {
     hasClickListener(){
       return this.$listeners && !!this.$listeners.click;
@@ -51,6 +64,13 @@ export default {
     click(e){
 			this.$emit('click', e);
 		},
+    setPrepared(val, ack){
+      updateProperty.call({
+        _id: this.model._id,
+        path: ['prepared'],
+        value: val
+      }, ack);
+    }
   },
 }
 </script>

app/imports/ui/properties/forms/SpellForm.vue

@@ -1,14 +1,6 @@
 <template lang="html">
   <div class="spell-form">
     <div class="layout row wrap justify-space-between">
-      <smart-switch
-        label="Prepared"
-        style="width: 200px; flex-grow: 0;"
-        class="mx-2"
-        :value="model.prepared"
-        :error-messages="errors.prepared"
-        @change="change('prepared', ...arguments)"
-      />
       <smart-switch
         label="Always prepared"
         style="width: 200px; flex-grow: 0;"
@@ -17,6 +9,15 @@
         :error-messages="errors.alwaysPrepared"
         @change="change('alwaysPrepared', ...arguments)"
       />
+      <smart-switch
+        v-show="!model.alwaysPrepared"
+        label="Prepared"
+        style="width: 200px; flex-grow: 0;"
+        class="mx-2"
+        :value="model.prepared"
+        :error-messages="errors.prepared"
+        @change="change('prepared', ...arguments)"
+      />
     </div>
     <text-field
       ref="focusFirst"

app/imports/ui/properties/forms/SpellListForm.vue

@@ -30,13 +30,18 @@
       :error-messages="errors.maxPrepared"
       @change="change('maxPrepared', ...arguments)"
     />
+    <calculation-error-list :errors="model.maxPreparedErrors" />
   </div>
 </template>
 
 <script>
 import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+import CalculationErrorList from '/imports/ui/properties/forms/shared/CalculationErrorList.vue';
 
 export default {
+  components: {
+    CalculationErrorList,
+  },
   mixins: [propertyFormMixin],
 };
 </script>

app/imports/ui/properties/viewers/SpellListViewer.vue

@@ -4,7 +4,7 @@
     <property-variable-name :value="model.variableName" />
     <property-field
       name="Maximum prepared spells"
-      :value="model.maxPrepared"
+      :value="model.maxPreparedResult"
     />
     <property-description
       v-if="model.description"