Added a custom entrypoint script and finished off the saving feature of the admin page.
This commit is contained in:
39
adm/index.js
39
adm/index.js
@@ -4,10 +4,10 @@ Vue.createApp({
|
||||
, 'frm': { 'e': null, 'modal': null }
|
||||
, 'faults': null
|
||||
, 'fields': { 'coordinates': { 'patterns': [ '^$', '^-?\\d{1,3}(?:\\.\\d+)?,-?\\d{1,3}(?:\\.\\d+)?$' ], 'default': '-27.38621539644283,153.0351689206467' }
|
||||
, 'start': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}$' ], 'default': '' }
|
||||
, 'end': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}$' ], 'default': '' }
|
||||
, 'title': { 'patterns': [ '^.{20,50}$' ], 'default': 'Event Title' }
|
||||
, 'description': { 'patterns': [ '^.{20,}$' ], 'default': 'Event Description' }
|
||||
, 'start': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:?\\d{0,2}$' ], 'default': '' }
|
||||
, 'end': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:?\\d{0,2}$' ], 'default': '' }
|
||||
, 'title': { 'patterns': [ '^.{10,50}$' ], 'default': 'Event Title' }
|
||||
, 'description': { 'patterns': [ '^.{16,}$' ], 'default': 'Event Description' }
|
||||
, 'location': { 'patterns': [ '^.{5,100}$' ], 'default': 'Event Location' }
|
||||
}
|
||||
}
|
||||
@@ -17,11 +17,14 @@ Vue.createApp({
|
||||
var m = moment(dt);
|
||||
var t = m.hour() * 3600 + m.minute() * 60 + m.second();
|
||||
if ( t > 0 ) {
|
||||
fmt = 'DD MMM YYYY, HH:mm:ss';
|
||||
fmt = ' ddd DD MMM YYYY, h:mm A';
|
||||
}
|
||||
var ret = moment(dt).format(fmt);
|
||||
return ret;
|
||||
},
|
||||
hoursDiff: function(d1, d2) {
|
||||
return moment(d2).diff(moment(d1), 'hours', true);
|
||||
},
|
||||
createEvent: function() {
|
||||
var event = {};
|
||||
for ( var k in this.fields ) {
|
||||
@@ -33,8 +36,8 @@ Vue.createApp({
|
||||
next7pm.add(1, 'day');
|
||||
}
|
||||
const twoHoursLater = moment(next7pm).add(2, 'hours');
|
||||
event.start = next7pm.format('YYYY-MM-DDTHH:mm:ss');
|
||||
event.end = twoHoursLater.format('YYYY-MM-DDTHH:mm:ss');
|
||||
event.start = next7pm.format('YYYY-MM-DDTHH:mm');
|
||||
event.end = twoHoursLater.format('YYYY-MM-DDTHH:mm');
|
||||
this.events.unshift(event);
|
||||
this.frm.e = 0;
|
||||
},
|
||||
@@ -47,6 +50,7 @@ Vue.createApp({
|
||||
}
|
||||
, function(data) {
|
||||
app.events = data;
|
||||
app.frm.e = null;
|
||||
app.validateEvents();
|
||||
}
|
||||
);
|
||||
@@ -73,9 +77,20 @@ Vue.createApp({
|
||||
fault.e = e;
|
||||
fault.k = k;
|
||||
fault.v = value;
|
||||
fault.msg = 'Bad format for ' + k + '.';
|
||||
faults.push(fault);
|
||||
}
|
||||
}
|
||||
var d1 = moment(this.events[e].start);
|
||||
var d2 = moment(this.events[e].end);
|
||||
if ( d2.isSameOrBefore(d1) ) {
|
||||
var fault = {};
|
||||
fault.e = e;
|
||||
fault.k = 'end';
|
||||
fault.v = this.formatDate(d2);
|
||||
fault.msg = 'Event ends before start.';
|
||||
faults.push(fault);
|
||||
}
|
||||
}
|
||||
this.faults = ( faults.length == 0 ? null : faults );
|
||||
},
|
||||
@@ -95,7 +110,15 @@ Vue.createApp({
|
||||
d.property = property;
|
||||
d.value = this.events[this.frm.e][property];
|
||||
this.frm.modal = d;
|
||||
}
|
||||
},
|
||||
modalUpdate: function() {
|
||||
this.events[this.frm.e][this.frm.modal.property] = this.frm.modal.value;
|
||||
this.frm.modal = null;
|
||||
this.validateEvents();
|
||||
},
|
||||
modalCancel: function() {
|
||||
frm.modal = null;
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.load();
|
||||
|
||||
@@ -21,8 +21,8 @@
|
||||
<input class="form-control" v-if="[ 'start', 'end' ].indexOf(frm.modal.property) != -1" type="datetime-local" v-model="frm.modal.value">
|
||||
<hr />
|
||||
<div class="btn-group" role="group" style="width: 100%;">
|
||||
<button type="button" class="btn btn-warning" v-on:click="frm.modal = null;">Cancel</button>
|
||||
<button type="button" class="btn btn-success" v-on:click="events[frm.e][frm.modal.property] = frm.modal.value; frm.modal = null;">Update</button>
|
||||
<button type="button" class="btn btn-warning" v-on:click="modalCancel">Cancel</button>
|
||||
<button type="button" class="btn btn-success" v-on:click="modalUpdate">Update</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -32,9 +32,11 @@
|
||||
<table class="table events mb-2">
|
||||
<tbody>
|
||||
<tr v-for="event, e in events" v-on:click="frm.e = e" :class="{ 'selection': frm.e == e }">
|
||||
<td><span class="badge text-bg-info">{{ e + 1 }}</span></td>
|
||||
<td style="padding-top: 9px;">
|
||||
<span class="badge text-bg-info" style="float: left;">{{ e + 1 }}</span>
|
||||
<span class="badge text-bg-success" style="float: right;">{{ hoursDiff( event.start, event.end) }} hrs</span>
|
||||
</td>
|
||||
<td class="dt">{{ formatDate(event.start) }}</td>
|
||||
<td class="dt">{{ formatDate(event.end) }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -42,11 +44,19 @@
|
||||
<button v-if="faults == null" class="btn btn-primary form-control" v-on:click="saveEvents">Save</button>
|
||||
<ul v-else>
|
||||
<li v-for="fault, f in faults">
|
||||
<span class="badge text-bg-info">{{ parseInt(fault.e) + 1 }}</span> <span class="tt">{{fault.k}}</span></span>
|
||||
<span class="badge text-bg-info">{{ parseInt(fault.e) + 1 }}</span> <span class="tt">{{fault.msg}}</span></span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-8" v-if="frm.e != null">
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Title</span>
|
||||
<input type="text" class="form-control" v-model="events[frm.e].title" v-on:keyup="validateEvents">
|
||||
</div>
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Description</span>
|
||||
<input type="text" class="form-control" v-model="events[frm.e].description" v-on:keyup="validateEvents">
|
||||
</div>
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Start</span>
|
||||
<input type="text" disabled class="form-control" :value="formatDate(events[frm.e].start)" v-on:keyup="validateEvents">
|
||||
@@ -57,14 +67,6 @@
|
||||
<input type="text" disabled class="form-control" :value="formatDate(events[frm.e].end)" v-on:keyup="validateEvents">
|
||||
<button class="btn btn-outline-secondary" type="button" v-on:click="modal('end')">...</button>
|
||||
</div>
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Title</span>
|
||||
<input type="text" class="form-control" v-model="events[frm.e].title" v-on:keyup="validateEvents">
|
||||
</div>
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Description</span>
|
||||
<input type="text" class="form-control" v-model="events[frm.e].description" v-on:keyup="validateEvents">
|
||||
</div>
|
||||
<div class="input-group mb-1">
|
||||
<span class="input-group-text">Location</span>
|
||||
<input type="text" class="form-control" v-model="events[frm.e].location" v-on:keyup="validateEvents">
|
||||
|
||||
Reference in New Issue
Block a user