mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
kill base-input from prject
This commit is contained in:
parent
ee853c63b8
commit
750cfb5f00
@ -1,187 +0,0 @@
|
||||
<template>
|
||||
<validation-provider
|
||||
:rules="rules"
|
||||
:name="name"
|
||||
v-bind="$attrs"
|
||||
v-slot="{ errors, valid, invalid, validated }"
|
||||
>
|
||||
<b-form-group>
|
||||
<slot name="label">
|
||||
<label v-if="label" :class="labelClasses">
|
||||
{{ label }}
|
||||
</label>
|
||||
</slot>
|
||||
<div
|
||||
:class="[
|
||||
{ 'input-group': hasIcon },
|
||||
{ focused: focused },
|
||||
{ 'input-group-alternative': alternative },
|
||||
{ 'has-label': label || $slots.label },
|
||||
inputGroupClasses,
|
||||
]"
|
||||
>
|
||||
<div v-if="prependIcon || $slots.prepend" class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<slot name="prepend">
|
||||
<i :class="prependIcon"></i>
|
||||
</slot>
|
||||
</span>
|
||||
</div>
|
||||
<slot v-bind="slotData">
|
||||
<input
|
||||
:value="value"
|
||||
:type="type"
|
||||
v-on="listeners"
|
||||
v-bind="$attrs"
|
||||
:valid="valid"
|
||||
:required="required"
|
||||
class="form-control"
|
||||
:class="[
|
||||
{ 'is-valid': valid && validated && successMessage },
|
||||
{ 'is-invalid': invalid && validated },
|
||||
inputClasses,
|
||||
]"
|
||||
/>
|
||||
</slot>
|
||||
<div v-if="appendIcon || $slots.append" class="input-group-append">
|
||||
<span class="input-group-text">
|
||||
<slot name="append">
|
||||
<i :class="appendIcon"></i>
|
||||
</slot>
|
||||
</span>
|
||||
</div>
|
||||
<slot name="infoBlock"></slot>
|
||||
</div>
|
||||
<slot name="success">
|
||||
<div class="valid-feedback" v-if="valid && validated && successMessage">
|
||||
{{ successMessage }}
|
||||
</div>
|
||||
</slot>
|
||||
<slot name="error">
|
||||
<div v-if="errors[0]" class="invalid-feedback" style="display: block">
|
||||
{{ errors[0] }}
|
||||
</div>
|
||||
</slot>
|
||||
</b-form-group>
|
||||
</validation-provider>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
inheritAttrs: false,
|
||||
name: 'base-input',
|
||||
props: {
|
||||
required: {
|
||||
type: Boolean,
|
||||
description: 'Whether input is required (adds an asterix *)',
|
||||
},
|
||||
group: {
|
||||
type: Boolean,
|
||||
description: 'Whether input is an input group (manual override in special cases)',
|
||||
},
|
||||
alternative: {
|
||||
type: Boolean,
|
||||
description: 'Whether input is of alternative layout',
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
description: 'Input label (text before input)',
|
||||
},
|
||||
error: {
|
||||
type: String,
|
||||
description: 'Input error (below input)',
|
||||
},
|
||||
successMessage: {
|
||||
type: String,
|
||||
description: 'Input success message',
|
||||
default: '',
|
||||
},
|
||||
labelClasses: {
|
||||
type: String,
|
||||
description: 'Input label css classes',
|
||||
default: 'form-control-label',
|
||||
},
|
||||
inputClasses: {
|
||||
type: String,
|
||||
description: 'Input css classes',
|
||||
},
|
||||
inputGroupClasses: {
|
||||
type: String,
|
||||
description: 'Input group css classes',
|
||||
},
|
||||
value: {
|
||||
type: [String, Number],
|
||||
description: 'Input value',
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
description: 'Input type',
|
||||
default: 'text',
|
||||
},
|
||||
appendIcon: {
|
||||
type: String,
|
||||
description: 'Append icon (right)',
|
||||
},
|
||||
prependIcon: {
|
||||
type: String,
|
||||
description: 'Prepend icon (left)',
|
||||
},
|
||||
rules: {
|
||||
type: [String, Array, Object],
|
||||
description: 'Vee validate validation rules',
|
||||
default: '',
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
description: 'Input name (used for validation)',
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
focused: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
listeners() {
|
||||
return {
|
||||
...this.$listeners,
|
||||
input: this.updateValue,
|
||||
focus: this.onFocus,
|
||||
blur: this.onBlur,
|
||||
}
|
||||
},
|
||||
slotData() {
|
||||
return {
|
||||
focused: this.focused,
|
||||
error: this.error,
|
||||
...this.listeners,
|
||||
}
|
||||
},
|
||||
hasIcon() {
|
||||
const { append, prepend } = this.$slots
|
||||
return (
|
||||
append !== undefined ||
|
||||
prepend !== undefined ||
|
||||
this.appendIcon !== undefined ||
|
||||
this.prependIcon !== undefined ||
|
||||
this.group
|
||||
)
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
updateValue(evt) {
|
||||
const value = evt.target.value
|
||||
this.$emit('input', value)
|
||||
},
|
||||
onFocus(evt) {
|
||||
this.focused = true
|
||||
this.$emit('focus', evt)
|
||||
},
|
||||
onBlur(evt) {
|
||||
this.focused = false
|
||||
this.$emit('blur', evt)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
@ -1,4 +1,3 @@
|
||||
import BaseInput from './Inputs/BaseInput.vue'
|
||||
import Badge from './Badge'
|
||||
|
||||
import BaseTable from './BaseTable.vue'
|
||||
@ -18,7 +17,6 @@ import SidebarPlugin from './SidebarPlugin'
|
||||
|
||||
export {
|
||||
Badge,
|
||||
BaseInput,
|
||||
Card,
|
||||
StatsCard,
|
||||
BaseTable,
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
import BaseInput from '@/components/Inputs/BaseInput.vue'
|
||||
import Card from '@/components/Cards/Card.vue'
|
||||
import StatsCard from '@/components/Cards/StatsCard.vue'
|
||||
import Badge from '@/components/Badge.vue'
|
||||
@ -8,7 +7,6 @@ import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
||||
const GlobalComponents = {
|
||||
install(Vue) {
|
||||
Vue.component(Badge.name, Badge)
|
||||
Vue.component(BaseInput.name, BaseInput)
|
||||
Vue.component(BaseNav.name, BaseNav)
|
||||
Vue.component(Card.name, Card)
|
||||
Vue.component(StatsCard.name, StatsCard)
|
||||
|
||||
@ -4,32 +4,32 @@
|
||||
<b-tab :title="names.thisMonth" active>
|
||||
<b-row>
|
||||
<b-col lg="3">
|
||||
<base-input :label="$t('communitys.form.hours')">
|
||||
<b-input :label="$t('communitys.form.hours')">
|
||||
<b-form-input
|
||||
type="number"
|
||||
size="lg"
|
||||
placeholder="23"
|
||||
style="font-size: xx-large; padding-left: 5px"
|
||||
/>
|
||||
</base-input>
|
||||
<base-input :label="$t('communitys.form.date_period')">
|
||||
</b-input>
|
||||
<b-input :label="$t('communitys.form.date_period')">
|
||||
<flat-pickr
|
||||
class="form-control"
|
||||
v-model="date"
|
||||
:config="config"
|
||||
style="font-size: 0.5em; padding-left: 5px"
|
||||
></flat-pickr>
|
||||
</base-input>
|
||||
</b-input>
|
||||
</b-col>
|
||||
<b-col lg="9">
|
||||
<base-input :label="$t('communitys.form.hours_report')">
|
||||
<b-input :label="$t('communitys.form.hours_report')">
|
||||
<textarea
|
||||
class="form-control"
|
||||
rows="5"
|
||||
@focus="textFocus"
|
||||
style="font-size: x-large; padding-left: 20px"
|
||||
></textarea>
|
||||
</base-input>
|
||||
</b-input>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
@ -147,32 +147,32 @@ export default {
|
||||
newWorkForm() {
|
||||
this.formular = `
|
||||
<b-col lg="3">
|
||||
<base-input label="Stunden">
|
||||
<b-input label="Stunden">
|
||||
<b-form-input
|
||||
type="number"
|
||||
size="lg"
|
||||
placeholder="0"
|
||||
style="font-size: xx-large; padding-left: 20px"
|
||||
/>
|
||||
</base-input>
|
||||
<base-input label="Datum / Zeitraum">
|
||||
</b-input>
|
||||
<b-input label="Datum / Zeitraum">
|
||||
<flat-pickr
|
||||
class="form-control"
|
||||
v-model="date"
|
||||
:config="config"
|
||||
style="font-size: xx-large; padding-left: 20px"
|
||||
></flat-pickr>
|
||||
</base-input>
|
||||
</b-input>
|
||||
</b-col>
|
||||
<b-col lg="9">
|
||||
<base-input label="Arbeitsreport">
|
||||
<b-input label="Arbeitsreport">
|
||||
<textarea
|
||||
class="form-control"
|
||||
rows="5"
|
||||
@focus="textFocus"
|
||||
style="font-size: x-large; padding-left: 20px"
|
||||
></textarea>
|
||||
</base-input>
|
||||
</b-input>
|
||||
</b-col>
|
||||
`
|
||||
|
||||
|
||||
@ -5,7 +5,6 @@ import { ValidationProvider, ValidationObserver, extend } from 'vee-validate'
|
||||
import * as rules from 'vee-validate/dist/rules'
|
||||
|
||||
import { messages } from 'vee-validate/dist/locale/en.json'
|
||||
import BaseInput from '@/components/Inputs/BaseInput.vue'
|
||||
import RegeneratorRuntime from 'regenerator-runtime'
|
||||
import Notifications from '@/components/NotificationPlugin'
|
||||
import SideBar from '@/components/SidebarPlugin'
|
||||
@ -36,7 +35,6 @@ global.localVue.use(SideBar)
|
||||
global.localVue.use(VueRouter)
|
||||
global.localVue.use(VueQrcode)
|
||||
global.localVue.use(VueMoment)
|
||||
global.localVue.component(BaseInput.name, BaseInput)
|
||||
global.localVue.component('validation-provider', ValidationProvider)
|
||||
global.localVue.component('validation-observer', ValidationObserver)
|
||||
global.localVue.component(StatsCard.name, StatsCard)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user