verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 59 Releases Wiki Activity

Merge branch '5989-redirectSalix' of https://gitea.verdnatura.es/verdnatura/salix-front into 5989-redirectSalix
gitea/salix-front/pipeline/head This commit looks good Details

This commit is contained in:
Carlos Satorres 2023-08-09 12:06:37 +02:00
parent a034d135c2 890a9fb9ee
commit f6d35b80ad
1 changed files with 28 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/components/ui/VnLv.vue
View File

@ -1,36 +1,37 @@
<script setup> <script setup>
import { computed } from 'vue'; import { computed } from 'vue';
const $props = defineProps({ const $props = defineProps({
label: { type: String, default: null }, label: { type: String, default: null },
value: { value: {
type: [String, Boolean], type: [String, Boolean],
default: null, default: null,
}, },
info: { type: String, default: null }, info: { type: String, default: null },
}); });
const isBooleanValue = computed(() => typeof $props.value === 'boolean'); const isBooleanValue = computed(() => typeof $props.value === 'boolean');
</script> </script>
<template> <template>
<div class="vn-label-value"> <div class="vn-label-value">
<div v-if="$props.label || $slots.label" class="label"> <div v-if="$props.label || $slots.label" class="label">
<div v-if="!$slots.label">{{ $props.label }}</div> <slot name="label"> {{ $props.label }}</slot>
<slot name="label"></slot> </div>
<div v-if="$props.value || $slots.value" class="value">
<span v-if="isBooleanValue">
<QIcon
:name="$props.value ? `check` : `close`"
:color="$props.value ? `positive` : `negative`"
/>
</span>
<span v-else>
<slot name="value">{{ $props.value }}</slot>
</span>
</div>
<div class="info" v-if="$props.info">
<QIcon name="info">
<QTooltip class="bg-dark text-white shadow-4" :offset="[10, 10]">
{{ $props.info }}
</QTooltip>
</QIcon>
</div>
</div> </div>
<div v-if="$props.value || $slots.value" class="value">
<span v-if="isBooleanValue">
<QIcon :name="$props.value ? `check` : `close`" :color="$props.value ? `positive` : `negative`" />
</span>
<span v-else>
<slot name="value"></slot>
</span>
</div>
<div class="info" v-if="$props.info">
<QIcon name="info">
<QTooltip class="bg-dark text-white shadow-4" :offset="[10, 10]">
{{ $props.info }}
</QTooltip>
</QIcon>
</div>
</div>
</template> </template>