231 lines
7.0 KiB
Vue
231 lines
7.0 KiB
Vue
<script>
|
|
import SpotButton from './spotButton.vue';
|
|
import AdminInput from './adminInput.vue';
|
|
|
|
export default {
|
|
components: {
|
|
SpotButton,
|
|
AdminInput
|
|
},
|
|
data() {
|
|
return {
|
|
elems: {},
|
|
feedbacks: []
|
|
};
|
|
},
|
|
inject: ['spot'],
|
|
methods: {
|
|
l(id) {
|
|
return this.spot.lang(id);
|
|
},
|
|
async setProjects() {
|
|
let aoElemTypes = await this.spot.get2('admin_get');
|
|
|
|
for(const [sType, aoElems] of Object.entries(aoElemTypes)) {
|
|
this.elems[sType] = {};
|
|
for(const [iKey, oElem] of Object.entries(aoElems)) {
|
|
oElem.type = sType;
|
|
this.elems[sType][oElem.id] = oElem;
|
|
}
|
|
}
|
|
},
|
|
createElem(sType) {
|
|
this.spot.get2('admin_create', {type: sType})
|
|
.then((aoNewElemTypes) => {
|
|
console.log(aoNewElemTypes);
|
|
for(const [sType, aoNewElems] of Object.entries(aoNewElemTypes)) {
|
|
for(const [iKey, oNewElem] of Object.entries(aoNewElems)) {
|
|
oNewElem.type = sType;
|
|
this.elems[sType][oNewElem.id] = oNewElem;
|
|
this.spot.onFeedback('success', this.spot.lang('admin_create_success'), {'create':sType});
|
|
}
|
|
}
|
|
})
|
|
.catch((sMsg) => {console.log(sMsg);this.spot.onFeedback('error', sMsg, {'create':sType});});
|
|
},
|
|
deleteElem(oElem) {
|
|
const asInputs = {
|
|
type: oElem.type,
|
|
id: oElem.id
|
|
};
|
|
|
|
this.spot.get(
|
|
'admin_delete',
|
|
(asData) => {
|
|
delete this.elems[asInputs.type][asInputs.id];
|
|
this.spot.onFeedback('success', this.spot.lang('admin_delete_success'), asInputs);
|
|
},
|
|
asInputs,
|
|
(sError) => {
|
|
this.spot.onFeedback('error', sError, asInputs);
|
|
}
|
|
);
|
|
},
|
|
updateElem(oElem, oEvent) {
|
|
if(typeof this.spot.tmp('wait') != 'undefined') clearTimeout(this.spot.tmp('wait'));
|
|
|
|
let sOldVal = this.elems[oElem.type][oElem.id][oEvent.target.name];
|
|
let sNewVal = oEvent.target.value;
|
|
if(sOldVal != sNewVal) {
|
|
let asInputs = {
|
|
type: oElem.type,
|
|
id: oElem.id,
|
|
field: oEvent.target.name,
|
|
value: sNewVal
|
|
};
|
|
|
|
this.spot.get2('admin_set', asInputs)
|
|
.then((asData) => {
|
|
this.elems[oElem.type][oElem.id][oEvent.target.name] = sNewVal;
|
|
this.spot.onFeedback('success', this.spot.lang('admin_save_success'), asInputs);
|
|
})
|
|
.catch((sError) => {
|
|
oEvent.target.value = sOldVal;
|
|
this.spot.onFeedback('error', sError, asInputs);
|
|
});
|
|
}
|
|
},
|
|
queue(oElem, oEvent) {
|
|
if(typeof this.spot.tmp('wait') != 'undefined') clearTimeout(this.spot.tmp('wait'));
|
|
this.spot.tmp('wait', setTimeout(() => {this.updateElem(oElem, oEvent);}, 2000));
|
|
},
|
|
updateProject() {
|
|
this.spot.get2('update_project')
|
|
.then((asData, sMsg) => {this.spot.onFeedback('success', sMsg, {'update':'project'});})
|
|
.catch((sMsg) => {this.spot.onFeedback('error', sMsg, {'update':'project'});});
|
|
}
|
|
},
|
|
mounted() {
|
|
this.spot.addPage('admin', {
|
|
onFeedback: (sType, sMsg, asContext) => {
|
|
delete asContext.a;
|
|
delete asContext.t;
|
|
sMsg += ' (';
|
|
for(const [sKey, sElem] of Object.entries(asContext)) {
|
|
sMsg += sKey+'='+sElem+' / ' ;
|
|
}
|
|
sMsg = sMsg.slice(0, -3)+')';
|
|
|
|
this.feedbacks.push({type:sType, msg:sMsg});
|
|
}
|
|
});
|
|
this.setProjects();
|
|
}
|
|
}
|
|
</script>
|
|
<template>
|
|
<div id="admin">
|
|
<a name="back" class="button" href="#project"><i class="fa fa-back push"></i>{{ l('nav_back') }}</a>
|
|
<h1>{{ l('projects') }}</h1>
|
|
<div id="project_section">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>{{ l('id_project') }}</th>
|
|
<th>{{ l('project') }}</th>
|
|
<th>{{ l('mode') }}</th>
|
|
<th>{{ l('code_name') }}</th>
|
|
<th>{{ l('start') }}</th>
|
|
<th>{{ l('end') }}</th>
|
|
<th>{{ l('delete') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="project in elems.project">
|
|
<td>{{ project.id }}</td>
|
|
<td><AdminInput :type="'text'" :name="'name'" :elem="project" /></td>
|
|
<td>{{ project.mode }}</td>
|
|
<td><AdminInput :type="'text'" :name="'codename'" :elem="project" /></td>
|
|
<td><AdminInput :type="'date'" :name="'active_from'" :elem="project" /></td>
|
|
<td><AdminInput :type="'date'" :name="'active_to'" :elem="project" /></td>
|
|
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(project)" /></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<SpotButton :buttonClass="'new'" :buttonText="l('new_project')" :iconClass="'new'" @click="createElem('project')" />
|
|
</div>
|
|
<h1>{{ l('feeds') }}</h1>
|
|
<div id="feed_section">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>{{ l('id_feed') }}</th>
|
|
<th>{{ l('ref_feed_id') }}</th>
|
|
<th>{{ l('id_spot') }}</th>
|
|
<th>{{ l('id_project') }}</th>
|
|
<th>{{ l('name') }}</th>
|
|
<th>{{ l('status') }}</th>
|
|
<th>{{ l('last_update') }}</th>
|
|
<th>{{ l('delete') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="feed in elems.feed">
|
|
<td>{{ feed.id }}</td>
|
|
<td><AdminInput :type="'text'" :name="'ref_feed_id'" :elem="feed" /></td>
|
|
<td><AdminInput :type="'number'" :name="'id_spot'" :elem="feed" /></td>
|
|
<td><AdminInput :type="'number'" :name="'id_project'" :elem="feed" /></td>
|
|
<td>{{ feed.name }}</td>
|
|
<td>{{ feed.status }}</td>
|
|
<td>{{ feed.last_update }}</td>
|
|
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(feed)" /></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<SpotButton :buttonClass="'new'" :buttonText="l('new_feed')" :iconClass="'new'" @click="createElem('feed')" />
|
|
</div>
|
|
<h1>Spots</h1>
|
|
<div id="spot_section">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>{{ l('id_spot') }}</th>
|
|
<th>{{ l('ref_spot_id') }}</th>
|
|
<th>{{ l('name') }}</th>
|
|
<th>{{ l('model') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="spot in elems.spot">
|
|
<td>{{ spot.id }}</td>
|
|
<td>{{ spot.ref_spot_id }}</td>
|
|
<td>{{ spot.name }}</td>
|
|
<td>{{ spot.model }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<h1>{{ l('active_users') }}</h1>
|
|
<div id="user_section">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>{{ l('id_user') }}</th>
|
|
<th>{{ l('user_name') }}</th>
|
|
<th>{{ l('language') }}</th>
|
|
<th>{{ l('time_zone') }}</th>
|
|
<th>{{ l('clearance') }}</th>
|
|
<th>{{ l('delete') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="user in elems.user">
|
|
<td>{{ user.id }}</td>
|
|
<td>{{ user.name }}</td>
|
|
<td>{{ user.language }}</td>
|
|
<td>{{ user.timezone }}</td>
|
|
<td><AdminInput :type="'number'" :name="'clearance'" :elem="user" /></td>
|
|
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(user)" /></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<h1>{{ l('toolbox') }}</h1>
|
|
<div id="toolbox">
|
|
<SpotButton :buttonClass="'refresh'" :buttonText="l('update_project')" :iconClass="'refresh'" @click="updateProject" />
|
|
</div>
|
|
<div id="feedback" class="feedback">
|
|
<p v-for="feedback in feedbacks" :class="feedback.type">{{ feedback.msg }}</p>
|
|
</div>
|
|
</div>
|
|
</template> |