Added data and UI for effects targeting calculations by tag

Still need to:
- update engine to compute calculations with effects.
- Add UI for effects applied to each calculation

app/imports/ui/properties/treeNodeViews/EffectTreeNode.vue

@@ -14,15 +14,21 @@
       <template v-if="model.name">
         {{ model.name }}
       </template>
+      <template v-else-if="model.targetByTags">
+        <span class="mr-1">
+          {{ displayedValue }}
+        </span>
+        <span
+          class="mr-1"
+        >{{ displayedTags }}</span>
+      </template>
       <template v-else>
         <span class="mr-1">
           {{ displayedValue }}
         </span>
         <span
-          v-for="stat in model.stats"
-          :key="stat"
           class="mr-1"
-        >{{ stat }}</span>
+        >{{ displayedStats }}</span>
       </template>
     </div>
   </div>
@@ -47,19 +53,32 @@ export default {
     displayedValue(){
       let value = this.resolvedValue;
       switch(this.model.operation) {
-        case 'base': return value;
-        case 'add': return isFinite(value) ? Math.abs(value) : value;
+        case 'base': return value || 0;
+        case 'add': return isFinite(value) ? Math.abs(value) : value || 0;
         case 'mul': return value;
         case 'min': return value;
         case 'max': return value;
         case 'advantage': return;
         case 'disadvantage': return;
-        case 'passiveAdd': return isFinite(value) ? Math.abs(value) : value;
+        case 'passiveAdd': return isFinite(value) ? Math.abs(value) : value || 0;
         case 'fail': return;
         case 'conditional': return;
         default: return undefined;
       }
     },
+    displayedStats(){
+      if (!this.model.stats) return 'Selected stats';
+      return this.model.stats.join(', ');
+    },
+    displayedTags(){
+      if (!this.model.targetTags) return 'Selected tags';
+      const tags = this.model.targetTags.join(', ');
+      if (!this.model.extraTags) return tags;
+      const extraTags = this.model.extraTags.map(ex => {
+        return ` ${ex.operation} ${ex.tags.join(', ')}`
+      }).join(' ');
+      return tags + extraTags;
+    }
   }
 }
 </script>