Files
DiceCloud/app/imports/ui/properties/viewers/ContainerViewer.vue
Stefan Zermatten 1b5bb981e9 Updated viewers
Action, classlevel, constant, container, damage multiplier, damage, 
effect, feature, folder, item
2021-10-19 17:19:35 +02:00

121 lines
2.9 KiB
Vue

<template lang="html">
<div class="container-viewer">
<v-row dense>
<property-field
name="Value"
:cols="{cols: 12, md: 6}"
>
<div style="overflow: hidden;">
<v-layout
v-if="model.value !== undefined"
align-center
class="mb-2"
>
<v-icon
class="mr-2"
large
>
$vuetify.icons.two_coins
</v-icon>
<coin-value
class="text-subtitle-1 mr-2"
:value="model.value"
/>
</v-layout>
<v-layout
align-center
>
<v-icon
class="mr-2"
large
>
$vuetify.icons.cash
</v-icon>
<coin-value
class="text-subtitle-1 mr-2"
:value="model.contentsValue"
/>
<span class="text-subtitle-1">
contents
</span>
</v-layout>
</div>
</property-field>
<property-field
name="Weight"
:cols="{cols: 12, md: 6}"
>
<div style="overflow: hidden;">
<v-layout
v-if="model.weight !== undefined"
align-center
class="mb-2"
>
<v-icon
class="mr-2"
large
>
$vuetify.icons.weight
</v-icon>
<span class="text-subtitle-1 mr-2">
{{ model.weight }} lb
</span>
</v-layout>
<v-layout
align-center
:class="{'mb-2': model.contentsWeightless}"
>
<v-icon
class="mr-2"
large
>
$vuetify.icons.injustice
</v-icon>
<span class="text-subtitle-1 mr-2">
{{ model.contentsWeight }} lb
</span>
<span
class="text-subtitle-1"
>
contents
</span>
</v-layout>
</div>
</property-field>
<property-field
v-if="model.carried"
value="Carried"
/>
<property-field
v-if="model.contentsWeightless"
>
<v-icon
style="overflow: hidden;"
class="ma-1"
>
$vuetify.icons.weightless
</v-icon>
<span class="ml-1">Contents weightless</span>
</property-field>
<property-description
name="Description"
:model="model.description"
/>
</v-row>
</div>
</template>
<script lang="js">
import CoinValue from '/imports/ui/components/CoinValue.vue';
import propertyViewerMixin from '/imports/ui/properties/viewers/shared/propertyViewerMixin.js'
export default {
components: {
CoinValue,
},
mixins: [propertyViewerMixin],
}
</script>
<style lang="css" scoped>
</style>