Merge pull request #576 from statping/service-chart-update

Service Block dropdown timeframe/interval
pull/585/head
Hunter Long 2020-05-10 16:03:38 -07:00 committed by GitHub
commit 9161c5f99f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 186 additions and 92 deletions

View File

@ -156,14 +156,11 @@ build-linux:
export PWD=`pwd`
@for arch in $(ARCHS);\
do \
for os in $(OS);\
do \
echo "Building v$$VERSION for $$os-$$arch"; \
mkdir -p releases/statping-$$os-$$arch/; \
GO111MODULE="on" GOOS=$$os GOARCH=$$arch go build -a -ldflags "-X main.VERSION=${VERSION} -X main.COMMIT=$(TRAVIS_COMMIT)" -o releases/statping-$$os-$$arch/statping ${PWD}/cmd || true; \
chmod +x releases/statping-$$os-$$arch/statping || true; \
tar -czf releases/statping-$$os-$$arch.tar.gz -C releases/statping-$$os-$$arch statping || true; \
done \
echo "Building v${VERSION} for linux-$$arch"; \
mkdir -p releases/statping-$$os-$$arch/; \
GO111MODULE="on" GOOS=$$os GOARCH=$$arch go build -a -ldflags "-s -w -extldflags -static -X main.VERSION=${VERSION}" -o releases/statping-$$os-$$arch/statping ${PWD}/cmd || true; \
chmod +x releases/statping-$$os-$$arch/statping || true; \
tar -czf releases/statping-$$os-$$arch.tar.gz -C releases/statping-$$os-$$arch statping || true; \
done
find ./releases/ -name "*.tar.gz" -type f -size +1M -exec mv "{}" build/ \;
@ -172,9 +169,9 @@ build-mac:
export PWD=`pwd`
@for arch in $(ARCHS);\
do \
echo "Building v$$VERSION for darwin-$$arch"; \
echo "Building v${VERSION} for darwin-$$arch"; \
mkdir -p releases/statping-darwin-$$arch/; \
GO111MODULE="on" GOOS=darwin GOARCH=$$arch go build -a -ldflags "-X main.VERSION=${VERSION} -X main.COMMIT=$(TRAVIS_COMMIT)" -o releases/statping-darwin-$$arch/statping ${PWD}/cmd || true; \
GO111MODULE="on" GOOS=darwin GOARCH=$$arch go build -a -ldflags "-s -w -extldflags -static -X main.VERSION=${VERSION}" -o releases/statping-darwin-$$arch/statping ${PWD}/cmd || true; \
chmod +x releases/statping-darwin-$$arch/statping || true; \
tar -czf releases/statping-darwin-$$arch.tar.gz -C releases/statping-darwin-$$arch statping || true; \
done
@ -185,9 +182,9 @@ build-win:
export PWD=`pwd`
@for arch in $(ARCHS);\
do \
echo "Building v$$VERSION for windows-$$arch"; \
echo "Building v${VERSION} for windows-$$arch"; \
mkdir -p releases/statping-windows-$$arch/; \
GO111MODULE="on" GOOS=windows GOARCH=$$arch go build -a -ldflags "-X main.VERSION=${VERSION} -X main.COMMIT=$(TRAVIS_COMMIT)" -o releases/statping-windows-$$arch/statping.exe ${PWD}/cmd || true; \
GO111MODULE="on" GOOS=windows GOARCH=$$arch go build -a -ldflags "-s -w -extldflags -static -X main.VERSION=${VERSION}" -o releases/statping-windows-$$arch/statping.exe ${PWD}/cmd || true; \
chmod +x releases/statping-windows-$$arch/statping.exe || true; \
zip -j releases/statping-windows-$$arch.zip releases/statping-windows-$$arch/statping.exe || true; \
done

View File

@ -3,7 +3,7 @@
</p>
<p align="center">
<b>Statping - Web and App Status Monitoring for Any Type of Project</b><br>
<a href="https://github.com/statping/statping/wiki">View Wiki</a> | <a href="https://demo.statping.com">Demo</a> | <a href="https://itunes.apple.com/us/app/apple-store/id1445513219">iPhone</a> | <a href="https://play.google.com/store/apps/details?id=com.statping">Android</a> <br> <a href="https://github.com/statping/statping/wiki/API">API</a> | <a href="https://github.com/statping/statping/wiki/Docker">Docker</a> | <a href="https://github.com/statping/statping/wiki/AWS-EC2">EC2</a> | <a href="https://github.com/statping/statping/wiki/Mac">Mac</a> | <a href="https://github.com/statping/statping/wiki/Linux">Linux</a> | <a href="https://github.com/statping/statping/wiki/Windows">Windows</a>
<a href="https://github.com/statping/statping/wiki">View Wiki</a> | <a href="https://demo.statping.com">Demo</a> | <a href="https://itunes.apple.com/us/app/apple-store/id1445513219">iPhone</a> | <a href="https://play.google.com/store/apps/details?id=com.statping">Android</a> <br> <a href="http://docs.statping.com">API</a> | <a href="https://github.com/statping/statping/wiki/Docker">Docker</a> | <a href="https://github.com/statping/statping/wiki/AWS-EC2">EC2</a> | <a href="https://github.com/statping/statping/wiki/Mac">Mac</a> | <a href="https://github.com/statping/statping/wiki/Linux">Linux</a> | <a href="https://github.com/statping/statping/wiki/Windows">Windows</a>
</p>
# Statping - Status Page & Monitoring Server

View File

@ -46,7 +46,7 @@ func exportCli(args []string) error {
if err := source.Assets(); err != nil {
return err
}
config, err := configs.LoadConfigs()
config, err := configs.LoadConfigs(configFile)
if err != nil {
return err
}
@ -168,7 +168,7 @@ func importCli(args []string) error {
log.Printf("Messages: %d\n", len(exportData.Messages))
log.Printf("Users: %d\n", len(exportData.Users))
config, err := configs.LoadConfigs()
config, err := configs.LoadConfigs(configFile)
if err != nil {
return err
}
@ -258,7 +258,7 @@ func updateDisplay() error {
// runOnce will initialize the Statping application and check each service 1 time, will not run HTTP server
func runOnce() error {
config, err := configs.LoadConfigs()
config, err := configs.LoadConfigs(configFile)
if err != nil {
return errors.Wrap(err, "config.yml file not found")
}

View File

@ -3,6 +3,14 @@ package main
import (
"github.com/spf13/cobra"
"github.com/spf13/viper"
"github.com/statping/statping/utils"
)
var (
ipAddress string
configFile string
verboseMode int
port int
)
func parseFlags(cmd *cobra.Command) {
@ -14,4 +22,7 @@ func parseFlags(cmd *cobra.Command) {
cmd.PersistentFlags().IntVarP(&verboseMode, "verbose", "v", 2, "verbose logging")
viper.BindPFlag("verbose", cmd.PersistentFlags().Lookup("verbose"))
cmd.PersistentFlags().StringVarP(&configFile, "config", "c", utils.Directory+"/config.yml", "path to config.yml file")
viper.BindPFlag("config", cmd.PersistentFlags().Lookup("config"))
}

View File

@ -20,13 +20,9 @@ var (
// VERSION stores the current version of Statping
VERSION string
// COMMIT stores the git commit hash for this version of Statping
COMMIT string
ipAddress string
//grpcPort int
verboseMode int
port int
log = utils.Log.WithField("type", "cmd")
confgs *configs.DbConfig
COMMIT string
log = utils.Log.WithField("type", "cmd")
confgs *configs.DbConfig
)
func init() {
@ -83,7 +79,7 @@ func start() {
// log.Warnln(err)
//}
confgs, err = configs.LoadConfigs()
confgs, err = configs.LoadConfigs(configFile)
if err != nil {
log.Infoln("Starting in Setup Mode")
if err := SetupMode(); err != nil {

View File

@ -14,6 +14,18 @@ HTML,BODY {
transition: height 0.3s ease;
}
.service-tm-menu {
width: 210px;
height: 355px;
bottom: 15px;
left: -25px;
position: absolute;
background-color: #ffffffd4;
border: 0;
border-radius: 0;
box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.08);
}
.copy-btn {
position: absolute;
right: 0;

View File

@ -34,11 +34,12 @@ export default {
},
computed: {
service_txt() {
if (!this.service.online) {
if (!this.toUnix(this.service.last_success)) {
const s = this.service
if (!s.online) {
if (!this.toUnix(this.parseISO(s.last_success))) {
return `Always Offline`
}
return `Offline for ${this.ago(this.service.last_success)}`
return `Offline for ${this.ago(s.last_success)}`
}
return `${this.service.online_24_hours}% Uptime`
}

View File

@ -19,35 +19,45 @@
<Analytics title="Total Downtime" :func="stats.low_ping"/>
<div class="col-12">
<router-link :to="serviceLink(service)" class="btn btn-block btn-outline-success mt-4" :class="{'btn-outline-success': service.online, 'btn-outline-danger': !service.online}">
View More Details
</router-link>
<router-link :to="serviceLink(service)" class="btn btn-block btn-outline-success mt-4" :class="{'btn-outline-success': service.online, 'btn-outline-danger': !service.online}">
View More Details
</router-link>
</div>
</div>
</div>
</div>
<div v-show="!expanded" v-observe-visibility="visibleChart" class="chart-container">
<ServiceChart :service="service" :visible="visible"/>
<ServiceChart :service="service" :visible="visible" :chart_timeframe="chartTimeframe"/>
</div>
<div class="row lower_canvas full-col-12 text-white" :class="{'bg-success': service.online, 'bg-danger': !service.online}">
<div class="col-md-8 col-6">
<div class="dropup" :class="{show: dropDownMenu}">
<button style="font-size: 10pt;" @focusout="dropDownMenu = false" @click="dropDownMenu = !dropDownMenu" type="button" class="d-none col-4 float-left btn btn-sm float-right btn-block text-white dropdown-toggle service_scale" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
24 Hours
</button>
<div class="dropdown-menu" :class="{show: dropDownMenu}">
<a v-for="(timeframe, i) in timeframes" @click="timeframe.picked = true" class="dropdown-item" href="#">{{timeframe.text}}</a>
</div>
<span class="d-none float-left d-md-inline">
{{smallText(service)}}
</span>
<div class="dropup" :class="{show: dropDownMenu}">
<button style="font-size: 10pt;" @click.prevent="openMenu('timeframe')" type="button" class="col-4 float-left btn btn-sm float-right btn-block text-white dropdown-toggle service_scale pr-2">
{{timeframepick.text}}
</button>
<div class="service-tm-menu" :class="{'d-none': !dropDownMenu}">
<a v-for="(timeframe, i) in timeframes" @click.prevent="changeTimeframe(timeframe)" class="dropdown-item" href="#" :class="{'active': timeframepick === timeframe}">{{timeframe.text}}</a>
</div>
</div>
<div class="dropup" :class="{show: intervalMenu}">
<button style="font-size: 10pt;" @click.prevent="openMenu('interval')" type="button" class="col-4 float-left btn btn-sm float-right btn-block text-white dropdown-toggle service_scale pr-2">
{{intervalpick.text}}
</button>
<div class="service-tm-menu" :class="{'d-none': !intervalMenu}">
<a v-for="(interval, i) in intervals" @click.prevent="changeInterval(interval)" class="dropdown-item" href="#" :class="{'active': intervalpick === interval, 'disabled': disabled_interval(interval)}">{{interval.text}}</a>
</div>
<span class="d-none float-left d-md-inline">
{{smallText(service)}}
</span>
</div>
</div>
<div class="col-md-4 col-6 float-right">
<button v-if="!expanded" @click="setService" class="btn btn-sm float-right dyn-dark text-white" :class="{'bg-success': service.online, 'bg-danger': !service.online}">
View Service
@ -75,19 +85,55 @@ export default {
required: true
},
},
computed: {
service() {
return this.track_service
},
timeframepick() {
return this.timeframes.find(s => s.value === this.timeframe_val)
},
intervalpick() {
return this.intervals.find(s => s.value === this.interval_val)
},
chartTimeframe() {
return {start_time: this.timeframe_val, interval: this.interval_val}
}
},
data() {
return {
timer_func: null,
expanded: false,
visible: false,
dropDownMenu: false,
timeframes: [
{value: "72h", text: "3 Days", picked: true },
{value: "24h", text: "Since Yesterday" },
{value: "3", text: "3 Hours" },
{value: "1m", text: "1 Month" },
{value: "3", text: "Last 3 Months" },
],
intervalMenu: false,
interval_val: "60m",
timeframe_val: this.timeset(259200),
timeframes: [
{value: this.timeset(1800), text: "30 Minutes", set: 1},
{value: this.timeset(3600), text: "1 Hour", set: 2},
{value: this.timeset(21600), text: "6 Hours", set: 3},
{value: this.timeset(43200), text: "12 Hours", set: 4},
{value: this.timeset(86400), text: "1 Day", set: 5},
{value: this.timeset(259200), text: "3 Days", set: 6},
{value: this.timeset(604800), text: "7 Days", set: 7},
{value: this.timeset(1209600), text: "14 Days", set: 8},
{value: this.timeset(2592000), text: "1 Month", set: 9},
{value: this.timeset(7776000), text: "3 Months", set: 10},
{value: 0, text: "All Records"},
],
intervals: [
{value: "1m", text: "1/min", set: 1},
{value: "5m", text: "5/min", set: 2},
{value: "15m", text: "15/min", set: 3},
{value: "30m", text: "30/min", set: 4 },
{value: "60m", text: "1/hr", set: 5 },
{value: "180m", text: "3/hr", set: 6 },
{value: "360m", text: "6/hr", set: 7 },
{value: "720m", text: "12/hr", set: 8 },
{value: "1440m", text: "1/day", set: 9 },
{value: "4320m", text: "3/day", set: 10 },
{value: "10080m", text: "7/day", set: 11 },
],
stats: {
total_failures: {
title: "Total Failures",
@ -121,15 +167,36 @@ export default {
beforeDestroy() {
clearInterval(this.timer_func)
},
computed: {
service() {
return this.track_service
}
},
async created() {
this.track_service = this.in_service
},
methods: {
disabled_interval(interval) {
let min = this.timeframepick.set - interval.set - 1;
return min >= interval.set;
},
timeset (seconds) {
return this.toUnix(this.nowSubtract(seconds))
},
openMenu(tm) {
if (tm === "interval") {
this.intervalMenu = !this.intervalMenu
this.dropDownMenu = false
} else if (tm === "timeframe") {
this.dropDownMenu = !this.dropDownMenu
this.intervalMenu = false
}
},
changeInterval(tm) {
this.interval_val = tm.value
this.intervalMenu = false
this.dropDownMenu = false
},
changeTimeframe(tm) {
this.timeframe_val = tm.value
this.dropDownMenu = false
this.intervalMenu = false
},
async setService() {
await this.$store.commit('setService', this.service)
this.$router.push('/service/'+this.service.id, {props: {in_service: this.service}})
@ -159,16 +226,13 @@ export default {
smallText(s) {
const incidents = s.incidents
if (s.online) {
return `Checked ${this.ago(s.last_success)} ago and responded in ${this.humanTime(s.latency)}`
return `Checked ${this.ago(s.last_success)} ago`
} else {
const last = s.last_failure
if (last) {
return `Offline, last error: ${last} ${this.ago(last.created_at)}`
}
if (!this.toUnix(s.last_success)) {
return `Service has never been online`
}
return `Offline`
return `Service has been offline for ${this.ago(s.last_success)}`
}
},
visibleChart(isVisible, entry) {

View File

@ -37,7 +37,11 @@
visible: {
type: Boolean,
required: true
}
},
chart_timeframe: {
type: Object,
required: true
},
},
data() {
return {
@ -160,24 +164,25 @@
}
},
watch: {
visible: function(newVal, oldVal) {
if (newVal && !this.showing) {
this.showing = true
this.chartHits("1h")
}
visible: function(newVal, oldVal) {
if (newVal && !this.showing) {
this.showing = true
this.chartHits(this.chart_timeframe)
}
},
chart_timeframe: function(newVal, oldVal) {
if (newVal) {
this.chartHits(newVal)
}
}
},
methods: {
async chartHits(group) {
const start = this.toUnix(this.nowSubtract(84600 * 3))
async chartHits(val) {
const start = val.start_time
const end = this.toUnix(new Date())
if (end-start < 283800) {
group = "5m"
}
this.data = await Api.service_hits(this.service.id, start, end, group, false)
if (this.data === null && group !== "5m") {
await this.chartHits("10m")
this.data = await Api.service_hits(this.service.id, start, end, val.interval, false)
if (this.data === null && val.interval !== "5m") {
await this.chartHits({start_time: val.start_time, interval: "5m"})
}
this.series = [{
name: this.service.name,

View File

@ -137,7 +137,7 @@
return
}
}
if (!s.project || !s.description || !s.domain || !s.username || !s.password || !s.confirm_password) {
if (!s.project || !s.domain || !s.username || !s.password || !s.confirm_password) {
this.disabled = true
return
}

View File

@ -295,15 +295,23 @@
return this.$store.getters.notifiers
}
},
async mounted() {
this.cache = await Api.cache()
mounted() {
this.update()
},
async created() {
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)
created() {
this.update()
},
methods: {
async update() {
const c = await Api.core()
this.$store.commit('setCore', c)
const n = await Api.notifiers()
this.$store.commit('setNotifiers', n)
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)
this.cache = await Api.cache()
},
changeTab(e) {
this.tab = e.target.id
},

View File

@ -107,9 +107,9 @@ export default new Vuex.Store({
setToken (state, token) {
state.token = token
},
setService (state, service) {
state.service = service
},
setService (state, service) {
state.service = service
},
setServices (state, services) {
state.services = services
},

View File

@ -21,7 +21,7 @@ func ConnectConfigs(configs *DbConfig, retry bool) error {
return nil
}
func LoadConfigs() (*DbConfig, error) {
func LoadConfigs(cfgFile string) (*DbConfig, error) {
writeAble, err := utils.DirWritable(utils.Directory)
if err != nil {
return nil, err
@ -30,7 +30,7 @@ func LoadConfigs() (*DbConfig, error) {
return nil, errors.Errorf("Directory %s is not writable!", utils.Directory)
}
return LoadConfigFile(utils.Directory)
return LoadConfigFile(cfgFile)
}
func findDbFile(configs *DbConfig) (string, error) {

View File

@ -7,15 +7,15 @@ import (
"os"
)
func LoadConfigFile(directory string) (*DbConfig, error) {
func LoadConfigFile(configFile string) (*DbConfig, error) {
p := utils.Params
log.Infof("Attempting to read config file at: %s/config.yml ", directory)
p.SetConfigFile(directory + "/config.yml")
log.Infof("Attempting to read config file at: %s", configFile)
p.SetConfigFile(configFile)
p.SetConfigType("yaml")
p.ReadInConfig()
db := new(DbConfig)
content, err := utils.OpenFile(directory + "/config.yml")
content, err := utils.OpenFile(configFile)
if err == nil {
if err := yaml.Unmarshal([]byte(content), &db); err != nil {
return nil, err
@ -66,7 +66,7 @@ func LoadConfigFile(directory string) (*DbConfig, error) {
Location: utils.Directory,
SqlFile: p.GetString("SQL_FILE"),
}
log.WithFields(utils.ToFields(configs)).Debugln("read config file: " + directory + "/config.yml")
log.WithFields(utils.ToFields(configs)).Debugln("read config file: " + configFile)
if configs.DbConn == "" {
return configs, errors.New("Starting in setup mode")