Add a disabled property to the datepicker
continuous-integration/drone/pr Build is passing
Details
continuous-integration/drone/pr Build is passing
Details
This commit is contained in:
parent
590edc4f82
commit
68c48b5792
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="datepicker">
|
||||
<a @click.stop="show = !show" class="show">
|
||||
<div class="datepicker" :class="{'disabled': disabled}">
|
||||
<a @click.stop="toggleDatePopup" class="show">
|
||||
<template v-if="date === null">
|
||||
{{ chooseDateLabel }}
|
||||
</template>
|
||||
|
@ -140,6 +140,10 @@ export default {
|
|||
type: String,
|
||||
default: 'Choose a date'
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.date = this.value
|
||||
|
@ -162,6 +166,13 @@ export default {
|
|||
this.$emit('input', this.date)
|
||||
this.$emit('change', this.date)
|
||||
},
|
||||
toggleDatePopup() {
|
||||
if(this.disabled) {
|
||||
return
|
||||
}
|
||||
|
||||
this.show = !this.show
|
||||
},
|
||||
hideDatePopup(e) {
|
||||
if (this.show) {
|
||||
|
||||
|
|
|
@ -3,6 +3,10 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
&.disabled a {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.datepicker-popup {
|
||||
position: absolute;
|
||||
z-index: 99;
|
||||
|
|
|
@ -73,6 +73,10 @@
|
|||
background: $white;
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled a.show:hover {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
|
|
Reference in New Issue