115 lines
3.3 KiB
Vue
Executable File
115 lines
3.3 KiB
Vue
Executable File
<template>
|
|
<div v-if="small">
|
|
<q-chip
|
|
dense
|
|
class="cltexth4 chipbooked shadow-5 q-pa-sm2"
|
|
size="md"
|
|
:color="modelValue > 0 ? `green` : modelValue === 0 ? `gray` : `red`"
|
|
text-color="white"
|
|
icon="fas fa-coins"
|
|
>
|
|
{{ tools.roundDec2(modelValue) }}
|
|
<span class="text-currency"
|
|
> <em
|
|
class="q-pa-xxs text-white rounded-borders shadow-2"
|
|
:style="`background-color: ` + (color ? color : '#ff5500')"
|
|
>{{ symbol }}</em
|
|
></span
|
|
>
|
|
</q-chip>
|
|
</div>
|
|
<div v-else>
|
|
<div
|
|
v-if="modelValue !== null"
|
|
:class="
|
|
`text-h5 ` +
|
|
(small ? `bordo_stondato_small` : `bordo_stondato_stretto`) +
|
|
` full-width`
|
|
"
|
|
:style="
|
|
(!$q.screen.lt.sm && !small
|
|
? `min-width: 250px; `
|
|
: small
|
|
? ` max-width: 120px;`
|
|
: ``) +
|
|
(color_border ? `border-color: ` + color_border + `!important;` : '')
|
|
"
|
|
>
|
|
<div
|
|
:class="
|
|
`text-center text-h7-dense text-italic ` +
|
|
($q.dark.isActive ? `text-grey-6` : `text-grey-14`)
|
|
"
|
|
>
|
|
<span v-if="small">
|
|
<em
|
|
class="q-px-xs text-white rounded-borders"
|
|
:style="`background-color: ` + (color ? color : '#ff5500')"
|
|
>{{ symbol }}</em
|
|
>
|
|
</span>
|
|
<span v-else>{{ label }}</span>
|
|
</div>
|
|
<div>
|
|
<q-field
|
|
dense
|
|
borderless
|
|
:readonly="readonly"
|
|
type="number"
|
|
rounded
|
|
:class="!small ? `q-px-sm text-h5` : `q-px-xs text-h7`"
|
|
:color="modelValue > 0 ? `green` : `red`"
|
|
>
|
|
<template v-slot:prepend>
|
|
<!--<img src="https://cdn.quasar.dev/logo-v2/svg/logo.svg">-->
|
|
<q-btn
|
|
v-if="tips && !small"
|
|
icon="fas fa-info"
|
|
color="primary"
|
|
text-color="white"
|
|
round
|
|
size="sm"
|
|
@click="showingtooltip = !showingtooltip"
|
|
>
|
|
</q-btn>
|
|
<q-icon v-else name="fas fa-coins" :size="small ? `xs` : `sm`" />
|
|
</template>
|
|
<template v-slot:control>
|
|
<div :class="`align_elem_right ` + (small ? `text-h7` : ``)">
|
|
{{ valueextra }}{{ tools.roundDec2(modelValue) }}
|
|
<q-tooltip :offset="[10, 10]" v-model="showingtooltip">{{
|
|
tips
|
|
}}</q-tooltip>
|
|
</div>
|
|
</template>
|
|
<template v-slot:append>
|
|
<div v-if="!small" :class="small ? `text-h7-dense` : `text-h7`">
|
|
<em
|
|
class="q-px-sm text-white rounded-borders"
|
|
:style="`background-color: ` + (color ? color : '#ff5500')"
|
|
>{{ symbol }}</em
|
|
>
|
|
</div>
|
|
<div v-if="paramTypeAccount && admin">
|
|
<q-btn
|
|
flat
|
|
round
|
|
icon="fas fa-pencil-alt"
|
|
size="sm"
|
|
@click="$emit('changedParamValue', true)"
|
|
></q-btn>
|
|
</div>
|
|
</template>
|
|
</q-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" src="./CCurrencyValue.ts">
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './CCurrencyValue.scss';
|
|
</style>
|