panel/baseui
1
0
Fork 0
Code Issues 8 Pull Requests Releases Wiki Activity

allow use of custom form components, add textarea component, add checkbox input, use more absolute imports

Browse Source
This commit is contained in:
Anton Schubert
2017-09-06 17:14:04 +02:00
parent 9eda1b1260
commit 8aa903d8e4
14 changed files with 189 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/my-input.vue
View File

@@ -5,44 +5,54 @@
<div class="input_description" v-if="description">{{ description }}</div>
</div>
<input type="text" v-if="type == 'text'"
<!-- -->
<input type="text" v-if="props && props.type == 'text'"
v-model="currentValue"
:name="name"
:placeholder="placeholder"
@blur="validate()"
@change="() => $emit('change', currentValue)"
:class="{invalid}"
:id="name"
:name="name"
:placeholder="props.placeholder"
@blur="validate"
@change="handleChange"
>
<input type="password" v-else-if="type == 'password'"
<input type="password" v-else-if="props && props.type == 'password'"
v-model="currentValue"
:name="name"
:placeholder="placeholder"
@blur="validate()"
@change="() => $emit('change', currentValue)"
:class="{invalid}"
:id="name"
:name="name"
:placeholder="props.placeholder"
@blur="validate"
@change="handleChange"
>
<div class="checkbox_holder" v-else-if="props && props.type == 'checkbox'">
<label :for="name"></label>
<input type="checkbox"
v-model="currentValue"
:id="name"
:name="name"
@change="handleChange"
>
<div class="check_checkbox"></div>
</div>
<div v-if="invalid && validatorMessage">{{ validatorMessage }}</div>
</div>
</template>
<style scoped>
.invalid {
background-color: #fcc;
}
</style>
<script>
export default {
name: "MyInput",
name: "BasicInput",
props: [
'description',
'label',
'name',
'placeholder',
'type',
'props',
'value',
'invalid',
'validatorMessage'
@@ -55,6 +65,9 @@ export default {
methods: {
validate() {
this.$emit('validate', this.currentValue);
},
handleChange() {
this.$emit('change', this.currentValue);
}
},
watch: {