mirror of https://github.com/statping/statping
vue updates
Hunter Long
parent
afd7fa5db1
commit
332ac82428
|
|
@ -22,31 +22,32 @@
|
|||
app: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.app = await this.$store.dispatch('loadRequired')
|
||||
|
||||
this.app = {...this.$store.state}
|
||||
|
||||
if (this.$store.getters.core.logged_in) {
|
||||
if (this.core.logged_in) {
|
||||
await this.$store.dispatch('loadAdmin')
|
||||
}
|
||||
this.loaded = true
|
||||
if (!this.$store.getters.core.setup) {
|
||||
if (!this.core.setup) {
|
||||
this.$router.push('/setup')
|
||||
}
|
||||
window.console.log('finished loadRequired')
|
||||
},
|
||||
async mounted() {
|
||||
if (this.$route.path !== '/setup') {
|
||||
const tk = localStorage.getItem("statping_user")
|
||||
if (this.$store.getters.core.logged_in) {
|
||||
if (this.core.logged_in) {
|
||||
this.logged_in = true
|
||||
await this.$store.dispatch('loadAdmin')
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div v-for="(service, index) in $store.getters.services" class="service_block" v-bind:key="index">
|
||||
<div v-for="(service, index) in services" class="service_block" v-bind:key="index">
|
||||
<ServiceInfo :service=service />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -30,10 +30,15 @@
|
|||
components: {
|
||||
ServiceInfo
|
||||
},
|
||||
computed: {
|
||||
services() {
|
||||
return this.$store.getters.services
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
failuresLast24Hours() {
|
||||
let total = 0;
|
||||
this.$store.getters.services.map((s) => {
|
||||
this.services.map((s) => {
|
||||
total += s.failures_24_hours
|
||||
})
|
||||
return total
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
</thead>
|
||||
|
||||
<draggable tag="tbody" v-model="groupsList" class="sortable_groups" handle=".drag_icon">
|
||||
<tr v-for="(group, index) in $store.getters.groupsCleanInOrder" v-bind:key="group.id">
|
||||
<tr v-for="(group, index) in groupsList" v-bind:key="group.id">
|
||||
<td><span class="drag_icon d-none d-md-inline">
|
||||
<font-awesome-icon icon="bars" class="mr-3" /></span> {{group.name}}
|
||||
</td>
|
||||
|
|
@ -49,7 +49,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<FormGroup v-if="$store.state.admin" :edit="editChange" :in_group="group"/>
|
||||
|
||||
</div>
|
||||
|
|
@ -92,9 +91,6 @@
|
|||
this.$store.commit('setGroups', groups)
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeMount() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
editChange(v) {
|
||||
|
|
@ -105,13 +101,6 @@
|
|||
this.group = g
|
||||
this.edit = !mode
|
||||
},
|
||||
reordered_services() {
|
||||
|
||||
},
|
||||
saveUpdatedOrder: function (e) {
|
||||
window.console.log("saving...");
|
||||
window.console.log(this.myViews.array()); // this.myViews.array is not a function
|
||||
},
|
||||
async deleteGroup(g) {
|
||||
let c = confirm(`Are you sure you want to delete '${g.name}'?`)
|
||||
if (c) {
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</thead>
|
||||
<tbody id="users_table">
|
||||
|
||||
<tr v-for="(user, index) in $store.getters.users" v-bind:key="index" >
|
||||
<tr v-for="(user, index) in users" v-bind:key="index" >
|
||||
<td>{{user.username}}</td>
|
||||
<td v-if="user.admin"><span class="badge badge-danger">ADMIN</span></td>
|
||||
<td v-if="!user.admin"><span class="badge badge-primary">USER</span></td>
|
||||
|
|
@ -49,6 +49,11 @@
|
|||
user: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
users() {
|
||||
return this.$store.getters.users
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
editChange(v) {
|
||||
this.user = {}
|
||||
|
|
|
|||
|
|
@ -64,28 +64,20 @@ export default {
|
|||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async updateOrder(value) {
|
||||
let data = [];
|
||||
value.forEach((s, k) => {
|
||||
data.push({ service: s.id, order: k + 1 })
|
||||
});
|
||||
const reorder = await Api.services_reorder(data)
|
||||
window.console.log('reorder', reorder)
|
||||
const services = await Api.services()
|
||||
this.$store.commit('setServices', services)
|
||||
await Api.services_reorder(data)
|
||||
await this.update()
|
||||
},
|
||||
async deleteService(s) {
|
||||
let c = confirm(`Are you sure you want to delete '${s.name}'?`)
|
||||
if (c) {
|
||||
await Api.service_delete(s.id)
|
||||
const services = await Api.services()
|
||||
this.$store.commit('setServices', services)
|
||||
await this.update()
|
||||
}
|
||||
},
|
||||
serviceGroup(s) {
|
||||
|
|
@ -95,6 +87,10 @@ export default {
|
|||
}
|
||||
return ""
|
||||
},
|
||||
async update() {
|
||||
const services = await Api.services()
|
||||
this.$store.commit('setServices', services)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -59,10 +59,9 @@
|
|||
components: {
|
||||
codemirror
|
||||
},
|
||||
props: {
|
||||
core: {
|
||||
type: Object,
|
||||
required: true
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
@ -86,11 +85,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
codemirror () {
|
||||
|
||||
}
|
||||
},
|
||||
async mounted () {
|
||||
await this.fetchTheme()
|
||||
this.changeTab('vars')
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
this.$store.commit('setHasAllData', false)
|
||||
this.$store.commit('setToken', null)
|
||||
this.$store.commit('setAdmin', false)
|
||||
await this.$router.push('/')
|
||||
await this.$router.push('/logout')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<footer>
|
||||
<div v-if="!$store.getters.core.footer" class="footer text-center mb-4 p-2">
|
||||
<div v-if="!core.footer" class="footer text-center mb-4 p-2">
|
||||
<a href="https://github.com/statping/statping" target="_blank">
|
||||
Statping {{$store.getters.core.version}} made with <font-awesome-icon style="color: #d40d0d" icon="heart"/>
|
||||
Statping {{core.version}} made with <font-awesome-icon icon="heart"/>
|
||||
</a> |
|
||||
<router-link :to="$store.getters.core.logged_in ? '/dashboard' : '/login'">Dashboard</router-link>
|
||||
<router-link :to="core.logged_in ? '/dashboard' : '/login'">Dashboard</router-link>
|
||||
</div>
|
||||
<div v-else class="footer text-center mb-4 p-2" v-html="$store.getters.core.footer"></div>
|
||||
<div v-else class="footer text-center mb-4 p-2" v-html="core.footer"></div>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
|
|
@ -22,11 +22,11 @@
|
|||
version: String,
|
||||
logged_in: Boolean
|
||||
},
|
||||
watch: {
|
||||
logged_in() {
|
||||
|
||||
}
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,7 +26,6 @@ export default {
|
|||
components: {
|
||||
IncidentsBlock,
|
||||
GroupServiceFailures
|
||||
|
||||
},
|
||||
props: {
|
||||
group: Object
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
async lastDaysFailures() {
|
||||
const start = this.nowSubtract(86400 * 30)
|
||||
const start = this.nowSubtract(86400 * 30)
|
||||
this.failureData = await Api.service_failures_data(this.service.id, this.toUnix(start), this.toUnix(this.now()), "24h")
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,18 @@
|
|||
<template>
|
||||
<div>
|
||||
<h1 id="title" class="col-12 text-center pt-4 mt-4 mb-3 header-title font-6">{{$store.getters.core.name}}</h1>
|
||||
<h5 id="description" class="col-12 text-center mb-5 header-desc font-3">{{$store.getters.core.description}}</h5>
|
||||
<h1 id="title" class="col-12 text-center pt-4 mt-4 mb-3 header-title font-6">{{core.name}}</h1>
|
||||
<h5 id="description" class="col-12 text-center mb-5 header-desc font-3">{{core.description}}</h5>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Header',
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -35,10 +35,12 @@
|
|||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.value = this.func.value;
|
||||
this.title = this.func.title;
|
||||
this.subtitle = this.func.subtitle;
|
||||
this.chart = this.convertToChartData(this.func.chart);
|
||||
if (this.func) {
|
||||
this.value = this.func.value;
|
||||
this.title = this.func.title;
|
||||
this.subtitle = this.func.subtitle;
|
||||
this.chart = this.convertToChartData(this.func.chart);
|
||||
}
|
||||
},
|
||||
async latencyYesterday() {
|
||||
const todayTime = await Api.service_hits(this.service.id, this.toUnix(this.nowSubtract(86400)), this.toUnix(new Date()), this.group, false)
|
||||
|
|
|
|||
|
|
@ -41,24 +41,17 @@
|
|||
|
||||
export default {
|
||||
name: 'CoreSettings',
|
||||
props: {
|
||||
in_core: {
|
||||
type: Object,
|
||||
required: true,
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
core: this.in_core
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async saveSettings() {
|
||||
const c = this.core
|
||||
await Api.core_save(c)
|
||||
const core = await Api.core()
|
||||
this.$store.commit('setCore', core)
|
||||
this.core = core
|
||||
},
|
||||
selectAll() {
|
||||
this.$refs.input.select();
|
||||
|
|
|
|||
|
|
@ -1,80 +0,0 @@
|
|||
<template>
|
||||
<form @submit="updateCore">
|
||||
<div class="form-group row">
|
||||
<label class="col-sm-4 col-form-label">Github Client ID</label>
|
||||
<div class="col-sm-8">
|
||||
<input v-model="clientId" type="text" class="form-control" placeholder="" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label class="col-sm-4 col-form-label">Github Client Secret</label>
|
||||
<div class="col-sm-8">
|
||||
<input v-model="clientSecret" type="text" class="form-control" placeholder="" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label for="switch-group-public" class="col-sm-4 col-form-label">Enabled</label>
|
||||
<div class="col-md-8 col-xs-12 mt-1">
|
||||
<span @click="enabled = !!enabled" class="switch float-left">
|
||||
<input v-model="enabled" type="checkbox" class="switch" id="switch-group-public" :checked="enabled">
|
||||
<label for="switch-group-public">Enabled Github Auth</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-sm-12">
|
||||
<button @click="updateCore" type="submit" :disabled="loading || group.name === ''" class="btn btn-block" :class="{'btn-primary': !group.id, 'btn-secondary': group.id}">
|
||||
{{loading ? "Loading..." : group.id ? "Update Group" : "Create Group"}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alert alert-danger d-none" id="alerter" role="alert"></div>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Api from "../API";
|
||||
|
||||
export default {
|
||||
name: 'FormGroup',
|
||||
props: {
|
||||
in_group: {
|
||||
type: Object
|
||||
},
|
||||
edit: {
|
||||
type: Function
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
clientId: "",
|
||||
clientSecret: "",
|
||||
enabled: true,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
in_group() {
|
||||
this.group = this.in_group
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
removeEdit() {
|
||||
this.group = {}
|
||||
this.edit(false)
|
||||
},
|
||||
async updateCore() {
|
||||
const g = this.group
|
||||
const data = {id: g.id, name: g.name, public: g.public}
|
||||
await Api.core_save(data)
|
||||
const groups = await Api.groups()
|
||||
this.$store.commit('setGroups', groups)
|
||||
this.edit(false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
</style>
|
||||
|
|
@ -80,17 +80,19 @@
|
|||
const g = this.group
|
||||
const data = {name: g.name, public: g.public}
|
||||
await Api.group_create(data)
|
||||
const groups = await Api.groups()
|
||||
this.$store.commit('setGroups', groups)
|
||||
await this.update()
|
||||
this.group = {}
|
||||
},
|
||||
async updateGroup() {
|
||||
const g = this.group
|
||||
const data = {id: g.id, name: g.name, public: g.public}
|
||||
await Api.group_update(data)
|
||||
await this.update()
|
||||
this.edit(false)
|
||||
},
|
||||
async update() {
|
||||
const groups = await Api.groups()
|
||||
this.$store.commit('setGroups', groups)
|
||||
this.edit(false)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -93,9 +93,9 @@
|
|||
await Api.incident_update_delete(update)
|
||||
this.incidents = await Api.incidents_service(this.service)
|
||||
},
|
||||
async loadIncidents() {
|
||||
this.incidents = await Api.incidents_service(this.service)
|
||||
},
|
||||
async loadIncidents() {
|
||||
this.incidents = await Api.incidents_service(this.service)
|
||||
},
|
||||
async createIncident() {
|
||||
await Api.incident_create(this.service, this.incident)
|
||||
await this.loadIncidents()
|
||||
|
|
@ -105,13 +105,13 @@
|
|||
service: this.service.id,
|
||||
}
|
||||
},
|
||||
async deleteIncident(incident) {
|
||||
let c = confirm(`Are you sure you want to delete '${incident.title}'?`)
|
||||
if (c) {
|
||||
await Api.incident_delete(incident)
|
||||
await this.loadIncidents()
|
||||
}
|
||||
async deleteIncident(incident) {
|
||||
let c = confirm(`Are you sure you want to delete '${incident.title}'?`)
|
||||
if (c) {
|
||||
await Api.incident_delete(incident)
|
||||
await this.loadIncidents()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -35,11 +35,11 @@
|
|||
|
||||
export default {
|
||||
name: 'FormLogin',
|
||||
props: {
|
||||
oauth: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
oauth() {
|
||||
return this.$store.getters.core.oauth
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
username: "",
|
||||
|
|
|
|||
|
|
@ -20,13 +20,9 @@
|
|||
}
|
||||
},
|
||||
async mounted() {
|
||||
const core = await Api.core()
|
||||
const core = await Api.core()
|
||||
this.$store.commit('setAdmin', core.admin)
|
||||
this.$store.commit('setCore', core)
|
||||
},
|
||||
async created() {
|
||||
const core = await Api.core()
|
||||
this.$store.commit('setCore', core)
|
||||
this.$store.commit('setCore', core)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
<Header/>
|
||||
|
||||
<div v-for="(service, i) in $store.getters.servicesNoGroup" class="col-12 full-col-12">
|
||||
<div v-for="(service, i) in services_no_group" class="col-12 full-col-12">
|
||||
<div class="list-group online_list mb-4">
|
||||
<a class="service_li list-group-item list-group-item-action">
|
||||
<router-link class="no-decoration font-3" :to="serviceLink(service)">{{service.name}}</router-link>
|
||||
|
|
@ -16,16 +16,16 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div v-for="(group, index) in $store.getters.groupsInOrder" v-bind:key="index">
|
||||
<div v-for="(group, index) in groups" v-bind:key="index">
|
||||
<Group :group=group />
|
||||
</div>
|
||||
|
||||
<div v-for="(message, index) in $store.getters.messages" v-bind:key="index" v-if="inRange(message) && message.service === 0">
|
||||
<div v-for="(message, index) in messages" v-bind:key="index" v-if="inRange(message) && message.service === 0">
|
||||
<MessageBlock :message="message"/>
|
||||
</div>
|
||||
|
||||
<div class="col-12 full-col-12">
|
||||
<div v-for="(service, index) in $store.getters.servicesInOrder" :ref="service.id" v-bind:key="index">
|
||||
<div v-for="(service, index) in services" :ref="service.id" v-bind:key="index">
|
||||
<ServiceBlock :service=service />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -58,6 +58,20 @@ export default {
|
|||
logged_in: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
messages() {
|
||||
return this.$store.getters.messages
|
||||
},
|
||||
groups() {
|
||||
return this.$store.getters.groupsInOrder
|
||||
},
|
||||
services() {
|
||||
return this.$store.getters.servicesInOrder
|
||||
},
|
||||
services_no_group() {
|
||||
return this.$store.getters.servicesNoGroup
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.logged_in = this.loggedIn()
|
||||
},
|
||||
|
|
@ -69,11 +83,6 @@ export default {
|
|||
const start = this.isBetween(new Date(), message.start_on)
|
||||
const end = this.isBetween(message.end_on, new Date())
|
||||
return start && end
|
||||
},
|
||||
clickService(s) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.s.scrollTop = 0;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<img alt="Statping Login" class="col-12 mt-5 mt-md-0" style="max-width:680px" src="banner.png">
|
||||
</div>
|
||||
|
||||
<FormLogin :oauth="$store.getters.core.oauth"/>
|
||||
<FormLogin/>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@ import Api from "../API";
|
|||
|
||||
export default {
|
||||
name: 'Logs',
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
logs: [],
|
||||
|
|
|
|||
|
|
@ -60,11 +60,10 @@
|
|||
<div class="card text-black-50 bg-white">
|
||||
<div class="card-header">Statping Settings</div>
|
||||
<div class="card-body">
|
||||
<CoreSettings :in_core="core"/>
|
||||
<CoreSettings/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="card text-black-50 bg-white mt-3">
|
||||
<div class="card-header">API Settings</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -112,7 +111,7 @@
|
|||
<div class="card text-black-50 bg-white mb-5">
|
||||
<div class="card-header">Theme Editor</div>
|
||||
<div class="card-body">
|
||||
<ThemeEditor :core="core"/>
|
||||
<ThemeEditor/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -167,20 +166,21 @@
|
|||
tab: "v-pills-home-tab",
|
||||
qrcode: "",
|
||||
qrurl: "",
|
||||
core: this.$store.getters.core
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
core() {
|
||||
return this.$store.getters.core
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.cache = await Api.cache()
|
||||
},
|
||||
async created() {
|
||||
const c = this.$store.state.core
|
||||
const c = this.core
|
||||
this.qrurl = `statping://setup?domain=${c.domain}&api=${c.api_secret}`
|
||||
this.qrcode = "https://chart.googleapis.com/chart?chs=500x500&cht=qr&chl=" + encodeURI(this.qrurl)
|
||||
},
|
||||
async beforeMount() {
|
||||
this.core = await Api.core()
|
||||
},
|
||||
methods: {
|
||||
changeTab(e) {
|
||||
this.tab = e.target.id
|
||||
|
|
|
|||
|
|
@ -88,6 +88,8 @@ func (s Storage) List() map[string]Item {
|
|||
|
||||
//Get a cached content by key
|
||||
func (s Storage) Get(key string) []byte {
|
||||
s.mu.Lock()
|
||||
defer s.mu.Unlock()
|
||||
item := s.items[key]
|
||||
if item.Expired() {
|
||||
CacheStorage.Delete(key)
|
||||
|
|
|
|||
Loading…
Reference in New Issue