- datetime picker as vue component

- delete bounding box via leaflet button
This commit is contained in:
Arno Kaimbacher 2019-12-03 14:41:44 +01:00
parent 2cdfbdb004
commit bc1313fa61
14 changed files with 31 additions and 23 deletions

View file

@ -162,7 +162,7 @@ export default class LocationsMap extends Vue {
},
_buildButton: function(){
this._link = L.DomUtil.create('a','simplebutton-action',this._container);
this._link.href = "#";
// this._link.href = "#";
if(this.options.id) {
this._link.id = this.options.id;
}

View file

@ -36,6 +36,7 @@ import LocationsMap from './components/locations-map.vue';
import VueCountdown from './components/vue-countdown';
import PersonTable from './components/PersonTable.vue';
import modal from './components/ShowModal.vue';
import datetime from 'vuejs-datetimepicker';
// import datetime from 'vuejs-datetimepicker';
// import { Validator } from 'vee-validate';
import VueToast from 'vue-toast-notification';
@ -63,7 +64,7 @@ Vue.use(VeeValidate, {
const STATUS_INITIAL = 0, STATUS_SAVING = 1, STATUS_SUCCESS = 2, STATUS_FAILED = 3;
const app = new Vue({
el: '#app',
components: { MyAutocomplete, LocationsMap, VueCountdown, modal, PersonTable },
components: { MyAutocomplete, LocationsMap, VueCountdown, modal, PersonTable, datetime },
data() {
return {
list: [

View file

@ -450,22 +450,23 @@
<div v-show="time === 'absolut'" class="pure-u-1 pure-u-md-1">
{!! Form::label('time_absolut', 'time absolut: ') !!}
{!! Form::datetimelocal('time_absolut', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm:ss',
'v-model' => 'dataset.coverage.time_absolut', 'data-vv-scope' => 'step-2', 'step' => 1,
"v-validate" => "this.isTimeAbsolut ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' " ]) !!}
{{-- {!! Form::datetime('time_absolut', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm',
'v-model' => 'dataset.coverage.time_absolut', 'data-vv-scope' => 'step-2', 'format' => 'yyyy-MM-dd HH:mm',
"v-validate" => "this.isTimeAbsolut ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' " ]) !!} --}}
<datetime name="time_absolut" v-validate="this.isTimeAbsolut ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' " data-vv-scope="step-2" format="DD-MM-YYYY h:i:s" v-model='dataset.coverage.time_absolut' ></datetime>
{{-- <datetime name="time_absolut" format="MM-DD-YYYY H:i:s" width="300px" v-model="dataset.coverage.time_absolut"></datetime> --}}
</div>
<div v-show="time === 'range'" class="pure-u-1 pure-u-md-1">
{!! Form::label('time_min', 'time min: ') !!}
{!! Form::date('time_min', null, ['class' => 'pure-u-23-24',
'v-model' => 'dataset.coverage.time_min', 'data-vv-scope' => 'step-2',
"v-validate" => "this.isTimeRange ? 'required' : '' "]) !!}
{!! Form::datetimelocal('time_min', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm:ss',
'v-model' => 'dataset.coverage.time_min', 'data-vv-scope' => 'step-2', 'step' => 1,
"v-validate" => "this.isTimeRange ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' "]) !!}
</div>
<div v-show="time === 'range'" class="pure-u-1 pure-u-md-1">
{!! Form::label('timemax', 'time max: ') !!}
{!! Form::date('time_max', null, ['class' => 'pure-u-23-24',
'v-model' => 'dataset.coverage.time_max', 'data-vv-scope' => 'step-2',
"v-validate" => "this.isTimeRange ? 'required' : '' "]) !!}
{!! Form::datetimelocal('time_max', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm:ss',
'v-model' => 'dataset.coverage.time_max', 'data-vv-scope' => 'step-2', 'step' => 1,
"v-validate" => "this.isTimeRange ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' "]) !!}
</div>
</div>