2020-06-20 09:40:01 +00:00
|
|
|
<template>
|
|
|
|
<div class="app-inputstyleswitch">
|
|
|
|
<h4>Input Style</h4>
|
|
|
|
<div class="p-formgroup-inline">
|
2020-07-16 10:51:38 +00:00
|
|
|
<div class="p-field-radiobutton">
|
2020-09-24 10:09:48 +00:00
|
|
|
<RadioButton id="input_outlined" name="inputstyle" value="outlined" :modelValue="value" @update:modelValue="onChange" />
|
2020-07-16 10:51:38 +00:00
|
|
|
<label for="input_outlined">Outlined</label>
|
|
|
|
</div>
|
|
|
|
<div class="p-field-radiobutton">
|
2020-09-24 10:09:48 +00:00
|
|
|
<RadioButton id="input_filled" name="inputstyle" value="filled" :modelValue="value" @update:modelValue="onChange" />
|
2020-07-16 10:51:38 +00:00
|
|
|
<label for="input_filled">Filled</label>
|
|
|
|
</div>
|
2020-06-20 09:40:01 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
methods: {
|
|
|
|
onChange(value) {
|
|
|
|
this.$appState.inputStyle = value;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
value() {
|
|
|
|
return this.$appState.inputStyle;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|