github
/
statping
mirror of https://github.com/statping/statping
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #588 from kvpt/service 

Fix service handling in announcements page
pull/626/head
Hunter Long 2020-06-04 03:20:58 -07:00 committed by GitHub
parent 90eedb7ff7 5c15c20392
commit eddf378938
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 102 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
frontend/src/components/Dashboard/DashboardMessages.vue
View File

@ -1,40 +1,37 @@
<template>
<div class="col-12">
<div class="card contain-card text-black-50 bg-white mb-4">
<div class="card-header">Announcements</div>
<div class="card-body pt-0">
<div class="col-12">
<div class="card contain-card text-black-50 bg-white mb-4">
<div class="card-header">Announcements</div>
<div class="card-body pt-0">
<table class="table table-striped">
<thead>
<thead>
<tr>
<th scope="col">Title</th>
<th scope="col" class="d-none d-md-table-cell">Service</th>
<th scope="col" class="d-none d-md-table-cell">Begins</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr v-for="(message, index) in $store.getters.messages" v-bind:key="index">
<td>{{message.title}}</td>
<td class="d-none d-md-table-cell">
<router-link :to="serviceLink(message.service)">{{service(message.service)}}</router-link>
</td>
<td class="d-none d-md-table-cell">{{niceDate(message.start_on)}}</td>
<td class="text-right">
<div v-if="$store.state.admin" class="btn-group">
<a @click.prevent="editMessage(message, edit)" href="#" class="btn btn-outline-secondary"><i class="fas fa-exclamation-triangle"></i> Edit</a>
<a @click.prevent="deleteMessage(message)" href="#" class="btn btn-danger"><font-awesome-icon icon="times" /></a>
</div>
</td>
</thead>
<tbody>
<tr v-for="message in $store.getters.messages" v-bind:key="message.id">
<td>{{message.title}}</td>
<td class="d-none d-md-table-cell">
<router-link :to="serviceLink(service(message.service))">{{serviceName(service(message.service))}}</router-link>
</td>
<td class="d-none d-md-table-cell">{{niceDate(message.start_on)}}</td>
<td class="text-right">
<div v-if="$store.state.admin" class="btn-group">
<a @click.prevent="editMessage(message, edit)" href="#" class="btn btn-outline-secondary"><i class="fas fa-exclamation-triangle"></i> Edit</a>
<a @click.prevent="deleteMessage(message)" href="#" class="btn btn-danger"><font-awesome-icon icon="times" /></a>
</div>
</td>
</tr>
</tbody>
</tbody>
</table>
</div>
</div>
</div>
<FormMessage v-if="$store.state.admin" :edit="editChange" :in_message="message"/>
</div>
<FormMessage v-if="$store.state.admin" :edit="editChange" :in_message="message"/>
</div>
</template>
<script>
@ -60,8 +57,10 @@
this.edit = !mode
},
service (id) {
const s = this.$store.getters.serviceById(id) || {}
return s.name || "Global Message"
return this.$store.getters.serviceById(id) || {}
},
serviceName (service) {
return service.name || "Global Message"
},
async deleteMessage(m) {
let c = confirm(`Are you sure you want to delete message '${m.title}'?`)

143
frontend/src/forms/Message.vue
View File

@ -1,103 +1,102 @@
<template>
<div>
<div>
<div class="card contain-card text-black-50 bg-white mb-5">
<div class="card-header">{{message.id ? `Update ${message.title}` : "Create Announcement"}}
<transition name="slide-fade">
<button @click="removeEdit" v-if="message.id" class="btn btn-sm float-right btn-danger btn-sm">Close</button>
</transition>
</div>
<div class="card-body">
<form @submit="saveMessage">
<div class="form-group row">
<div class="card-header">{{message.id ? `Update ${message.title}` : "Create Announcement"}}
<transition name="slide-fade">
<button @click="removeEdit" v-if="message.id" class="btn btn-sm float-right btn-danger btn-sm">Close</button>
</transition>
</div>
<div class="card-body">
<form @submit="saveMessage">
<div class="form-group row">
<label class="col-sm-4 col-form-label">Title</label>
<div class="col-sm-8">
<input v-model="message.title" type="text" name="title" class="form-control" id="title" placeholder="Announcement Title" required>
<input v-model="message.title" type="text" name="title" class="form-control" id="title" placeholder="Announcement Title" required>
</div>
</div>
</div>
<div class="form-group row">
<div class="form-group row">
<label class="col-sm-4 col-form-label">Description</label>
<div class="col-sm-8">
<textarea v-model="message.description" rows="5" name="description" class="form-control" id="description" required></textarea>
<textarea v-model="message.description" rows="5" name="description" class="form-control" id="description" required></textarea>
</div>
</div>
</div>
<div class="form-group row">
<div class="form-group row">
<label class="col-sm-4 col-form-label">Service</label>
<div class="col-sm-8">
<select v-model="message.service_id" name="service_id" class="form-control">
<option :value="0">Global Announcement</option>
<option v-for="(service, i) in $store.getters.services" :value="service.id" >{{service.name}}</option>
</select>
<select v-model="message.service" name="service_id" class="form-control">
<option :value="0">Global Announcement</option>
<option v-for="service in $store.getters.services" :value="service.id" v-bind:key="service.id" >{{service.name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group row">
<div class="form-group row">
<label class="col-sm-4 col-form-label">Announcement Date Range</label>
<div class="col-sm-4">
<flatPickr v-model="message.start_on" @on-change="startChange" :config="config" type="text" name="start_on" class="form-control form-control-plaintext" id="start_on" value="0001-01-01T00:00:00Z" required />
<flatPickr v-model="message.start_on" @on-change="startChange" :config="config" type="text" name="start_on" class="form-control form-control-plaintext" id="start_on" value="0001-01-01T00:00:00Z" required />
</div>
<div class="col-sm-4">
<flatPickr v-model="message.end_on" @on-change="endChange" :config="config" type="text" name="end_on" class="form-control form-control-plaintext" id="end_on" value="0001-01-01T00:00:00Z" required />
<flatPickr v-model="message.end_on" @on-change="endChange" :config="config" type="text" name="end_on" class="form-control form-control-plaintext" id="end_on" value="0001-01-01T00:00:00Z" required />
</div>
</div>
</div>
<div v-show="this.service === null" class="form-group row">
<div v-show="this.service === null" class="form-group row">
<label for="service_id" class="col-sm-4 col-form-label">Service</label>
<div class="col-sm-8">
<select v-model="message.service_id" class="form-control" name="service" id="service_id">
<option :value="0">Global Message</option>
<option v-for="(service, index) in $store.getters.services" :value="service.id" v-bind:key="index" >{{service.name}}</option>
</select>
<select v-model="message.service" class="form-control" name="service" id="service_id">
<option :value="0">Global Message</option>
<option v-for="service in $store.getters.services" :value="service.id" v-bind:key="service.id">{{service.name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group row">
<div class="form-group row">
<label for="notify_method" class="col-sm-4 col-form-label">Notify Users</label>
<div class="col-sm-8">
<span @click="message.notify = !!message.notify" class="switch">
<input v-model="message.notify" type="checkbox" class="switch" id="switch-normal">
<label for="switch-normal">Notify Users Before Scheduled Time</label>
</span>
<span @click="message.notify = !!message.notify" class="switch">
<input v-model="message.notify" type="checkbox" class="switch" id="switch-normal">
<label for="switch-normal">Notify Users Before Scheduled Time</label>
</span>
</div>
</div>
</div>
<div v-if="message.notify" class="form-group row">
<div v-if="message.notify" class="form-group row">
<label for="notify_method" class="col-sm-4 col-form-label">Notification Method</label>
<div class="col-sm-8">
<input v-model="message.notify_method" type="text" name="notify_method" class="form-control" id="notify_method" value="" placeholder="email">
<input v-model="message.notify_method" type="text" name="notify_method" class="form-control" id="notify_method" value="" placeholder="email">
</div>
</div>
</div>
<div v-if="message.notify" class="form-group row">
<div v-if="message.notify" class="form-group row">
<label for="notify_before" class="col-sm-4 col-form-label">Notify Before</label>
<div class="col-sm-8">
<div class="form-inline">
<input v-model="message.notify_before" type="number" name="notify_before" class="col-4 form-control" id="notify_before">
<select v-model="message.notify_before_scale" class="ml-2 col-7 form-control" name="notify_before_scale" id="notify_before_scale">
<option value="minute">Minutes</option>
<option value="hour">Hours</option>
<option value="day">Days</option>
</select>
</div>
<div class="form-inline">
<input v-model="message.notify_before" type="number" name="notify_before" class="col-4 form-control" id="notify_before">
<select v-model="message.notify_before_scale" class="ml-2 col-7 form-control" name="notify_before_scale" id="notify_before_scale">
<option value="minute">Minutes</option>
<option value="hour">Hours</option>
<option value="day">Days</option>
</select>
</div>
</div>
</div>
</div>
<div class="form-group row">
<div class="form-group row">
<div class="col-sm-12">
<button @click="saveMessage"
:disabled="!message.title || !message.description"
type="submit" class="btn btn-block" :class="{'btn-primary': !message.id, 'btn-secondary': message.id}">
{{message.id ? "Edit Message" : "Create Message"}}
</button>
</div>
</div>
<div class="alert alert-danger d-none" id="alerter" role="alert"></div>
</form>
<button @click="saveMessage"
:disabled="!message.title || !message.description"
type="submit" class="btn btn-block" :class="{'btn-primary': !message.id, 'btn-secondary': message.id}">
{{message.id ? "Edit Message" : "Create Message"}}
</button>
</div>
</div>
<div class="alert alert-danger d-none" id="alerter" role="alert"></div>
</form>
</div>
</div>
</div>
</div>
</template>
<script>
@ -148,18 +147,18 @@
this.message = this.in_message
}
},
mounted () {
if (this.service) {
this.service_id = this.service.id
}
},
methods: {
startChange(e) {
mounted () {
if (this.service) {
this.service_id = this.service.id
}
},
methods: {
startChange(e) {
window.console.log(e)
},
endChange(e) {
window.console.log(e)
},
endChange(e) {
window.console.log(e)
},
},
removeEdit() {
this.message = {}
this.edit(false)

5
frontend/src/mixin.js
View File

@ -92,12 +92,15 @@ export default Vue.mixin({
if (service.permalink) {
service = this.$store.getters.serviceByPermalink(service.permalink)
}
if (service===undefined) {
if (service===undefined || this.isEmptyObject(service)) {
return `/service/0`
}
let link = service.permalink ? service.permalink : service.id
return `/service/${link}`
},
isEmptyObject(obj) {
return Object.keys(obj).length === 0 && obj.constructor === Object
},
isInt(n) {
return n % 1 === 0;
},