added label text for switch component
This commit is contained in:
parent
1333ecc2f2
commit
c4c92c9f32
@ -1,10 +1,14 @@
|
||||
<template>
|
||||
<div class="relative lg:absolute w-12 flex items-center lg:ltr:right-0 lg:rtl:left-0 xl:-top-12 cursor-pointer">
|
||||
<input type="radio" :name="name" v-show="selected == '0'" @click="enabled = 1" value="1" id="enabled-1" v-model="selected" class="w-full h-full absolute right-0 z-20 opacity-0 cursor-pointer">
|
||||
<input type="radio" :name="name" v-show="selected == '1'" @click="enabled = 0" value="0" id="enabled-0" v-model="selected" class="w-full h-full absolute left-0 z-20 opacity-0 cursor-pointer">
|
||||
<div class="lg:absolute w-12 lg:ltr:right-0 lg:rtl:left-0 xl:-top-12">
|
||||
<label class="lg:hidden">{{ label }}</label>
|
||||
|
||||
<div class="absolute left-1 top-1 bg-white w-5 h-5 rounded-full transition transform" :class="selected == '1' ? 'translate-x-full' : 'translate-x-0'"></div>
|
||||
<div class="block w-full h-7 rounded-full transition transition-color" :class="selected == '1' ? 'bg-green' : 'bg-green-200'"></div>
|
||||
<div class="relative full flex items-center cursor-pointer">
|
||||
<input type="radio" :name="name" v-show="selected == '0'" @click="enabled = 1" value="1" id="enabled-1" v-model="selected" class="w-full h-full absolute right-0 z-20 opacity-0 cursor-pointer">
|
||||
<input type="radio" :name="name" v-show="selected == '1'" @click="enabled = 0" value="0" id="enabled-0" v-model="selected" class="w-full h-full absolute left-0 z-20 opacity-0 cursor-pointer">
|
||||
|
||||
<div class="absolute left-1 top-1 bg-white w-5 h-5 rounded-full transition transform" :class="selected == '1' ? 'translate-x-full' : 'translate-x-0'"></div>
|
||||
<div class="block w-full h-7 rounded-full transition transition-color" :class="selected == '1' ? 'bg-green' : 'bg-green-200'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -21,6 +25,11 @@ export default {
|
||||
description: "Selectbox selected value"
|
||||
},
|
||||
|
||||
label: {
|
||||
type: String,
|
||||
description: "Selectbox selected label"
|
||||
},
|
||||
|
||||
model: {
|
||||
type: [String, Number, Array, Object, Boolean],
|
||||
default: '',
|
||||
|
@ -3,6 +3,7 @@
|
||||
<akaunting-switch
|
||||
name="{{ $name }}"
|
||||
value="{{ (int) $value }}"
|
||||
label="{{ trans('general.enabled') }}"
|
||||
|
||||
@if (! empty($attributes['model']))
|
||||
:model="{{ $attributes['model'] }}"
|
||||
|
Loading…
x
Reference in New Issue
Block a user