60 lines
1.5 KiB
Vue
60 lines
1.5 KiB
Vue
<template>
|
|
<v-menu
|
|
ref="init_menu_date"
|
|
v-model="init_menu_date"
|
|
:close-on-content-click="false"
|
|
:nudge-right="40"
|
|
:return-value.sync="init_date"
|
|
lazy
|
|
transition="scale-transition"
|
|
offset-y
|
|
full-width
|
|
min-width="290px"
|
|
>
|
|
<v-text-field
|
|
slot="activator"
|
|
placeholder="-"
|
|
label="Sampling Date"
|
|
hide-details
|
|
v-model="formatted_date"
|
|
></v-text-field>
|
|
|
|
<v-date-picker v-model="init_date" no-title scrollable>
|
|
<v-spacer></v-spacer>
|
|
<v-btn flat color="primary" @click="init_menu_date = false">Cancel</v-btn>
|
|
<v-btn flat color="primary" @click="$refs.init_menu_date.save(init_date)">OK</v-btn>
|
|
</v-date-picker>
|
|
</v-menu>
|
|
</template>
|
|
|
|
<script>
|
|
module.exports = {
|
|
props : ['menu_date', 'date'],
|
|
|
|
data () {
|
|
return {
|
|
init_menu_date : this.menu_date,
|
|
init_date : this.date,
|
|
formatted_date : this.date
|
|
}
|
|
},
|
|
|
|
computed : {
|
|
},
|
|
|
|
watch : {
|
|
init_date (n, o) {
|
|
// this.formatted_date = this.formatDate(this.init_date);
|
|
}
|
|
}
|
|
|
|
methods : {
|
|
formatDate (date) {
|
|
if (!date) return null
|
|
|
|
const [year, month, day] = date.split('-')
|
|
return `${day}-${month}-${year}`
|
|
}
|
|
}
|
|
}
|
|
</script> |