55 lines
1.4 KiB
Vue
55 lines
1.4 KiB
Vue
<template lang="html">
|
|
<div class="proficiency-viewer">
|
|
<v-row dense>
|
|
<property-field
|
|
v-if="model.value !== undefined"
|
|
name="Proficiency"
|
|
>
|
|
<proficiency-icon
|
|
:value="model.value"
|
|
style="height: 12px"
|
|
class="ml-1 mr-2"
|
|
/>
|
|
<div>
|
|
{{ proficiencyText }}
|
|
</div>
|
|
</property-field>
|
|
<property-target-tags
|
|
v-if="model.targetByTags"
|
|
:model="model"
|
|
/>
|
|
<property-field
|
|
v-else
|
|
name="Stats"
|
|
:value="model.stats && model.stats.join(', ')"
|
|
mono
|
|
/>
|
|
</v-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="js">
|
|
import propertyViewerMixin from '/imports/client/ui/properties/viewers/shared/propertyViewerMixin.js';
|
|
import ProficiencyIcon from '/imports/client/ui/properties/shared/ProficiencyIcon.vue';
|
|
import PropertyTargetTags from '/imports/client/ui/properties/viewers/shared/PropertyTargetTags.vue';
|
|
|
|
export default {
|
|
components: {
|
|
ProficiencyIcon,
|
|
PropertyTargetTags,
|
|
},
|
|
mixins: [propertyViewerMixin],
|
|
computed: {
|
|
proficiencyText(){
|
|
switch (this.model.value){
|
|
case 0.49: return 'Half proficiency bonus rounded down';
|
|
case 0.5: return 'Half proficiency bonus';
|
|
case 1: return 'Proficient';
|
|
case 2: return 'Double proficiency bonus';
|
|
default: return '';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|