Add event support and improve UI/UX
parent
e37382eedf
commit
9e620e4627
@ -0,0 +1,125 @@
|
||||
/*
|
||||
* Copyright 2020 Netsyms Technologies.
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
function openEventAddScreen(machineid) {
|
||||
app.dialog.preloader("Loading...");
|
||||
apirequest(
|
||||
"geteventtypes",
|
||||
{},
|
||||
function (resp) {
|
||||
app.dialog.close();
|
||||
|
||||
catoptions = [
|
||||
|
||||
];
|
||||
|
||||
for (const catlabel in resp) {
|
||||
var options = [];
|
||||
for (const optionval in resp[catlabel]) {
|
||||
options.push({
|
||||
value: optionval,
|
||||
label: resp[catlabel][optionval]
|
||||
});
|
||||
}
|
||||
catoptions.push({
|
||||
label: catlabel,
|
||||
options: options
|
||||
});
|
||||
}
|
||||
|
||||
console.log(catoptions);
|
||||
|
||||
router.navigate("/addevent", {
|
||||
context: {
|
||||
machineid: machineid,
|
||||
fields: [
|
||||
{
|
||||
name: "event",
|
||||
label: "Event",
|
||||
type: "select",
|
||||
catoptions: catoptions,
|
||||
value: "",
|
||||
tabindex: 0
|
||||
},
|
||||
{
|
||||
name: "date",
|
||||
label: "Date/Time",
|
||||
type: "datetime",
|
||||
value: "",
|
||||
tabindex: 1
|
||||
},
|
||||
{
|
||||
name: "privatenotes",
|
||||
label: "Private Notes",
|
||||
type: "textarea",
|
||||
value: "",
|
||||
tabindex: 2
|
||||
},
|
||||
{
|
||||
name: "publicnotes",
|
||||
label: "Public Notes",
|
||||
type: "textarea",
|
||||
value: "",
|
||||
tabindex: 3
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
},
|
||||
function (xhr) {
|
||||
app.dialog.close();
|
||||
var error = $.parseJSON(xhr.responseText);
|
||||
if (error && typeof error.msg != 'undefined') {
|
||||
app.dialog.alert(error.msg, "Error");
|
||||
} else {
|
||||
app.dialog.alert("A server or network error occurred.", "Error");
|
||||
}
|
||||
},
|
||||
getStorage("username"),
|
||||
getStorage("password")
|
||||
);
|
||||
}
|
||||
|
||||
function addEvent(machineid) {
|
||||
app.dialog.preloader("Adding event...");
|
||||
|
||||
var eventdata = {
|
||||
id: machineid
|
||||
};
|
||||
$("#eventform .eventfield").each(function (i, o) {
|
||||
if ($(this).parent().is(".smart-select")) {
|
||||
eventdata[$(this).attr("name")] = app.smartSelect.get('#smartselect-' + $(this).attr("name")).getValue();
|
||||
} else {
|
||||
eventdata[$(this).attr("name")] = $(this).val();
|
||||
}
|
||||
});
|
||||
|
||||
apirequest(
|
||||
"addevent",
|
||||
eventdata,
|
||||
function (resp) {
|
||||
app.dialog.close();
|
||||
if (resp.status == "ERROR") {
|
||||
app.dialog.alert(resp.msg, "Error");
|
||||
} else {
|
||||
app.toast.create({
|
||||
text: 'Event added!',
|
||||
closeTimeout: 2000,
|
||||
}).open();
|
||||
openMachineInfo(machineid);
|
||||
}
|
||||
},
|
||||
function (xhr) {
|
||||
app.dialog.close();
|
||||
var error = $.parseJSON(xhr.responseText);
|
||||
if (error && typeof error.msg != 'undefined') {
|
||||
app.dialog.alert(error.msg, "Error");
|
||||
} else {
|
||||
app.dialog.alert("A server or network error occurred.", "Error");
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -0,0 +1,92 @@
|
||||
<!--
|
||||
Copyright 2020 Netsyms Technologies.
|
||||
This Source Code Form is subject to the terms of the Mozilla Public
|
||||
License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
-->
|
||||
|
||||
<div class="page" data-name="addevent">
|
||||
|
||||
<div class="navbar">
|
||||
<div class="navbar-bg"></div>
|
||||
<div class="navbar-inner">
|
||||
<div class="left">
|
||||
<a href="#" class="link icon-only" onclick="router.navigate('/')">
|
||||
<i class="icon icon-back"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="title"><i class="{{icon}}"></i> Add Event for #{{machineid}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fab fab-extended fab-right-bottom color-green" id="save-fab">
|
||||
<a href="#" onclick="addEvent('{{machineid}}');">
|
||||
<!-- Icons For iOS Theme -->
|
||||
<i class="icon f7-icons if-not-md">floppy_disk</i>
|
||||
<!-- Icons For MD Theme -->
|
||||
<i class="icon material-icons md-only">save</i>
|
||||
<div class="fab-text">Save</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="page-content">
|
||||
<form id="eventform" style="margin-bottom: 5rem;">
|
||||
<div class="list no-hairlines no-margin-top">
|
||||
<ul>
|
||||
{{#each fields}}
|
||||
{{#js_if "this.type == 'select'"}}
|
||||
<li>
|
||||
<a class="item-link smart-select smart-select-init" id="smartselect-{{name}}" data-close-on-select="true" data-searchbar="true" data-searchbar-placeholder="Search">
|
||||
<select name="{{name}}" class="eventfield" tabindex="{{tabindex}}">
|
||||
{{#if catoptions}}
|
||||
<option value="">Choose</option>
|
||||
{{#each catoptions}}
|
||||
<optgroup label="{{label}}">
|
||||
{{#each options}}
|
||||
<option value="{{value}}" data-display-as="{{value}}">{{label}}</option>
|
||||
{{/each}}
|
||||
</optgroup>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
{{#if options}}
|
||||
{{#each options}}
|
||||
<option value="{{value}}">{{label}}</option>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
</select>
|
||||
<div class="item-content">
|
||||
<div class="item-inner">
|
||||
<div class="item-title">{{label}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
{{else}}
|
||||
<li class="item-content item-input">
|
||||
<div class="item-inner">
|
||||
<div class="item-title item-floating-label">{{label}}</div>
|
||||
<div class="item-input-wrap">
|
||||
{{#js_if "this.type == 'textarea'"}}
|
||||
<textarea class="eventfield" rows="4" name="{{name}}" placeholder="" tabindex="{{tabindex}}">{{value}}</textarea>
|
||||
{{else}}
|
||||
{{#js_if "this.type == 'datetime'"}}
|
||||
<input name="{{name}}" type="text" placeholder="Select date and time" readonly="readonly" tabindex="{{tabindex}}" class="eventfield datetime-textbox"/>
|
||||
{{else}}
|
||||
<input class="eventfield" type="{{type}}" name="{{name}}" placeholder="" value="{{value}}" tabindex="{{tabindex}}">
|
||||
<span class="input-clear-button machinefield-clear-button display-none"></span>
|
||||
{{/js_if}}
|
||||
{{/js_if}}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{{/js_if}}
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var machineid = "{{machineid}}";
|
||||
</script>
|
||||
</div>
|
||||
Loading…
Reference in New Issue