voyager-admin/voyager

View on GitHub
resources/assets/components/Formfields/Toggle/Builder.vue

Summary

Maintainability
Test Coverage
<template>
    <div v-if="action == 'list-options'">
        <div class="input-group mt-2">
            <label class="label">{{ __('voyager::formfields.toggle.enabled_label') }}</label>
            <LanguageInput
                class="input w-full"
                type="text" :placeholder="__('voyager::formfields.toggle.enabled_label')"
                v-model="options.enabled_label" />
        </div>
        <div class="input-group mt-2">
            <label class="label">{{ __('voyager::formfields.toggle.disabled_label') }}</label>
            <LanguageInput
                class="input w-full"
                type="text" :placeholder="__('voyager::formfields.toggle.disabled_label')"
                v-model="options.disabled_label" />
        </div>
    </div>
    <div v-else-if="action == 'view-options'">
        <div class="input-group mt-2">
            <label class="label">{{ __('voyager::generic.color') }}</label>
            <ColorPicker v-model="options.color" />
        </div>
    </div>
    <div v-else-if="action == 'view'" class="w-full">
        <Toggle :color="options.color" v-model="dummy" />
    </div>
</template>

<script>
import formfieldBuilder from '@mixins/formfield-builder';

export default {
    mixins: [formfieldBuilder],
    computed: {
        defaultViewOptions() {
            return {
                color: 'accent',
            };
        },
        defaultListOptions() {
            return {
                enabled_label: this.__('voyager::generic.yes'),
                disabled_label: this.__('voyager::generic.no'),
            };
        },
    },
    data() {
        return {
            dummy: false,
        }
    }
}
</script>