121 lines
2.7 KiB
Vue
121 lines
2.7 KiB
Vue
<template lang="html">
|
|
<div class="container-viewer">
|
|
<property-tags :tags="model.tags" />
|
|
<div class="layout wrap justify-space-around">
|
|
<div
|
|
class="mr-3 my-3"
|
|
>
|
|
<v-layout
|
|
v-if="model.value !== undefined"
|
|
align-center
|
|
class="mb-2"
|
|
>
|
|
<v-icon
|
|
class="mr-2"
|
|
x-large
|
|
>
|
|
$vuetify.icons.two_coins
|
|
</v-icon>
|
|
<coin-value
|
|
class="text-h6 mr-2"
|
|
:value="model.value"
|
|
/>
|
|
</v-layout>
|
|
<v-layout
|
|
align-center
|
|
>
|
|
<v-icon
|
|
class="mr-2"
|
|
x-large
|
|
>
|
|
$vuetify.icons.cash
|
|
</v-icon>
|
|
<coin-value
|
|
class="text-h6 mr-2"
|
|
:value="model.contentsValue"
|
|
/>
|
|
<span class="text-h6">
|
|
contents
|
|
</span>
|
|
</v-layout>
|
|
</div>
|
|
<div
|
|
class="my-3"
|
|
>
|
|
<v-layout
|
|
v-if="model.weight !== undefined"
|
|
align-center
|
|
justify-end
|
|
class="mb-2"
|
|
>
|
|
<span class="text-h6 mr-2">
|
|
{{ model.weight }} lb
|
|
</span>
|
|
<v-icon
|
|
class="ml-2"
|
|
x-large
|
|
>
|
|
$vuetify.icons.weight
|
|
</v-icon>
|
|
</v-layout>
|
|
<v-layout
|
|
align-center
|
|
justify-end
|
|
:class="{'mb-2': model.contentsWeightless}"
|
|
>
|
|
<span class="text-h6 mr-2">
|
|
{{ model.contentsWeight }} lb
|
|
</span>
|
|
<span
|
|
class="text-h6"
|
|
>
|
|
contents
|
|
</span>
|
|
<v-icon
|
|
class="ml-2"
|
|
x-large
|
|
>
|
|
$vuetify.icons.injustice
|
|
</v-icon>
|
|
</v-layout>
|
|
<v-layout
|
|
v-if="model.contentsWeightless"
|
|
align-center
|
|
justify-end
|
|
>
|
|
<span
|
|
class="text-h6"
|
|
>
|
|
Contents weightless
|
|
</span>
|
|
<v-icon
|
|
class="ml-2"
|
|
x-large
|
|
>
|
|
$vuetify.icons.weightless
|
|
</v-icon>
|
|
</v-layout>
|
|
</div>
|
|
</div>
|
|
<property-description
|
|
:string="model.description"
|
|
:calculations="model.descriptionCalculations"
|
|
:inactive="model.inactive"
|
|
/>
|
|
</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>
|