franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Simplify spot button & input parameters

Browse Source
This commit is contained in:
Franzz
2024-01-11 22:16:17 +01:00
parent c2956ac373
commit 683670f77a
4 changed files with 37 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/components/admin.vue
View File

@@ -7,17 +7,36 @@ export default {
SpotButton, SpotButton,
AdminInput AdminInput
}, },
inject: ['spot'],
data() { data() {
return { return {
elems: {}, elems: {},
feedbacks: [] feedbacks: []
}; };
}, },
inject: ['spot'], mounted() {
this.setEvents();
this.setProjects();
},
methods: { methods: {
l(id) { l(id) {
return this.spot.lang(id); return this.spot.lang(id);
}, },
setEvents() {
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});
}
});
},
async setProjects() { async setProjects() {
let aoElemTypes = await this.spot.get2('admin_get'); let aoElemTypes = await this.spot.get2('admin_get');
@@ -94,22 +113,6 @@ export default {
.then((asData, sMsg) => {this.spot.onFeedback('success', sMsg, {'update':'project'});}) .then((asData, sMsg) => {this.spot.onFeedback('success', sMsg, {'update':'project'});})
.catch((sMsg) => {this.spot.onFeedback('error', 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> </script>
@@ -138,11 +141,11 @@ export default {
<td><AdminInput :type="'text'" :name="'codename'" :elem="project" /></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_from'" :elem="project" /></td>
<td><AdminInput :type="'date'" :name="'active_to'" :elem="project" /></td> <td><AdminInput :type="'date'" :name="'active_to'" :elem="project" /></td>
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(project)" /></td> <td><SpotButton :icon="'close fa-lg'" @click="deleteElem(project)" /></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<SpotButton :buttonClass="'new'" :buttonText="l('new_project')" :iconClass="'new'" @click="createElem('project')" /> <SpotButton :classes="'new'" :text="l('new_project')" :icon="'new'" @click="createElem('project')" />
</div> </div>
<h1>{{ l('feeds') }}</h1> <h1>{{ l('feeds') }}</h1>
<div id="feed_section"> <div id="feed_section">
@@ -168,11 +171,11 @@ export default {
<td>{{ feed.name }}</td> <td>{{ feed.name }}</td>
<td>{{ feed.status }}</td> <td>{{ feed.status }}</td>
<td>{{ feed.last_update }}</td> <td>{{ feed.last_update }}</td>
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(feed)" /></td> <td><SpotButton :icon="'close fa-lg'" @click="deleteElem(feed)" /></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<SpotButton :buttonClass="'new'" :buttonText="l('new_feed')" :iconClass="'new'" @click="createElem('feed')" /> <SpotButton :classes="'new'" :text="l('new_feed')" :icon="'new'" @click="createElem('feed')" />
</div> </div>
<h1>Spots</h1> <h1>Spots</h1>
<div id="spot_section"> <div id="spot_section">
@@ -215,14 +218,14 @@ export default {
<td>{{ user.language }}</td> <td>{{ user.language }}</td>
<td>{{ user.timezone }}</td> <td>{{ user.timezone }}</td>
<td><AdminInput :type="'number'" :name="'clearance'" :elem="user" /></td> <td><AdminInput :type="'number'" :name="'clearance'" :elem="user" /></td>
<td><SpotButton :iconClass="'close fa-lg'" @click="deleteElem(user)" /></td> <td><SpotButton :icon="'close fa-lg'" @click="deleteElem(user)" /></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
<h1>{{ l('toolbox') }}</h1> <h1>{{ l('toolbox') }}</h1>
<div id="toolbox"> <div id="toolbox">
<SpotButton :buttonClass="'refresh'" :buttonText="l('update_project')" :iconClass="'refresh'" @click="updateProject" /> <SpotButton :classes="'refresh'" :text="l('update_project')" :icon="'refresh'" @click="updateProject" />
</div> </div>
<div id="feedback" class="feedback"> <div id="feedback" class="feedback">
<p v-for="feedback in feedbacks" :class="feedback.type">{{ feedback.msg }}</p> <p v-for="feedback in feedbacks" :class="feedback.type">{{ feedback.msg }}</p>

1
src/components/adminInput.vue
View File

@@ -12,6 +12,7 @@
} }
} }
</script> </script>
<template> <template>
<input :type="type" :name="name" :value="value" @change="$parent.updateElem(elem, $event)" @keyup="$parent.queue(elem, $event)" /> <input :type="type" :name="name" :value="value" @change="$parent.updateElem(elem, $event)" @keyup="$parent.queue(elem, $event)" />
</template> </template>

13
src/components/spotButton.vue
View File

@@ -6,17 +6,12 @@ export default {
SpotIcon SpotIcon
}, },
props: { props: {
buttonClass: String, classes: String,
buttonText: String, text: String,
iconClass: String icon: String
},
data() {
return {
margin: !!this.buttonText
}
} }
} }
</script> </script>
<template> <template>
<button :class="buttonClass"><SpotIcon :iconClass="iconClass" :margin="margin" />{{ buttonText }}</button> <button :class="classes"><SpotIcon :icon="icon" :text="text" /></button>
</template> </template>

10
src/components/spotIcon.vue
View File

@@ -1,17 +1,19 @@
<script> <script>
export default { export default {
props: { props: {
iconClass: String, icon: String,
text: String,
margin: Boolean, margin: Boolean,
otherClasses: String classes: String
}, },
data() { data() {
return { return {
classNames: 'fa fa-'+this.iconClass+(this.margin?' push':'')+(this.otherClasses?' '+this.otherClasses:'') classNames: 'fa fa-'+this.icon+((this.margin || this.text && this.text!='')?' push':'')+(this.classes?' '+this.classes:'')
} }
} }
} }
</script> </script>
<template> <template>
<i :class="classNames"></i> <i :class="classNames"></i>{{ text }}
</template> </template>