topaLE
/
uptime-kuma
1
0
Fork 0
Code Issues 185 Pull Requests 26 Projects Releases 28 Wiki Activity
Browse Source

Merge remote-tracking branch 'origin/master'

pull/563/head
LouisLam 4 years ago
parent
d25603e629 911690bea8
commit
b5d987863d
4 changed files with 35 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/assets/app.scss
  2. 23
      src/components/HeartbeatBar.vue
  3. 24
      src/components/MonitorList.vue
  4. 16
      src/components/Uptime.vue

2
src/assets/app.scss
View File

@ -321,7 +321,7 @@ h2 {
.item { .item {
display: block; display: block;
text-decoration: none; text-decoration: none;
padding: 13px 15px 10px 15px; padding: 14px 15px;
border-radius: 10px; border-radius: 10px;
transition: all ease-in-out 0.15s; transition: all ease-in-out 0.15s;

23
src/components/HeartbeatBar.vue
View File

@ -38,7 +38,7 @@ export default {
beatMargin: 4, beatMargin: 4,
move: false, move: false,
maxBeat: -1, maxBeat: -1,
} };
}, },
computed: { computed: {
@ -69,12 +69,12 @@ export default {
if (start < 0) { if (start < 0) {
// Add empty placeholder // Add empty placeholder
for (let i = start; i < 0; i++) { for (let i = start; i < 0; i++) {
placeholders.push(0) placeholders.push(0);
} }
start = 0; start = 0;
} }
return placeholders.concat(this.beatList.slice(start)) return placeholders.concat(this.beatList.slice(start));
}, },
wrapStyle() { wrapStyle() {
@ -84,7 +84,7 @@ export default {
return { return {
padding: `${topBottom}px ${leftRight}px`, padding: `${topBottom}px ${leftRight}px`,
width: "100%", width: "100%",
} };
}, },
barStyle() { barStyle() {
@ -94,12 +94,12 @@ export default {
return { return {
transition: "all ease-in-out 0.25s", transition: "all ease-in-out 0.25s",
transform: `translateX(${width}px)`, transform: `translateX(${width}px)`,
} };
} }
return { return {
transform: "translateX(0)", transform: "translateX(0)",
} };
}, },
@ -109,7 +109,7 @@ export default {
height: this.beatHeight + "px", height: this.beatHeight + "px",
margin: this.beatMargin + "px", margin: this.beatMargin + "px",
"--hover-scale": this.hoverScale, "--hover-scale": this.hoverScale,
} };
}, },
}, },
@ -120,7 +120,7 @@ export default {
setTimeout(() => { setTimeout(() => {
this.move = false; this.move = false;
}, 300) }, 300);
}, },
deep: true, deep: true,
}, },
@ -162,7 +162,7 @@ export default {
methods: { methods: {
resize() { resize() {
if (this.$refs.wrap) { if (this.$refs.wrap) {
this.maxBeat = Math.floor(this.$refs.wrap.clientWidth / (this.beatWidth + this.beatMargin * 2)) this.maxBeat = Math.floor(this.$refs.wrap.clientWidth / (this.beatWidth + this.beatMargin * 2));
} }
}, },
@ -170,7 +170,7 @@ export default {
return `${this.$root.datetime(beat.time)} - ${beat.msg}`; return `${this.$root.datetime(beat.time)} - ${beat.msg}`;
} }
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -183,6 +183,9 @@ export default {
} }
.hp-bar-big { .hp-bar-big {
display: flex;
justify-content: flex-end;
.beat { .beat {
display: inline-block; display: inline-block;
background-color: $primary; background-color: $primary;

24
src/components/MonitorList.vue
View File

@ -3,10 +3,10 @@
<div class="list-header"> <div class="list-header">
<div class="placeholder"></div> <div class="placeholder"></div>
<div class="search-wrapper"> <div class="search-wrapper">
<a v-if="searchText == ''" class="search-icon"> <a v-if="!searchText" class="search-icon">
<font-awesome-icon icon="search" /> <font-awesome-icon icon="search" />
</a> </a>
<a v-if="searchText != ''" class="search-icon" @click="clearSearchText"> <a v-if="searchText" class="search-icon" @click="clearSearchText">
<font-awesome-icon icon="times" /> <font-awesome-icon icon="times" />
</a> </a>
<input v-model="searchText" class="form-control search-input" :placeholder="$t('Search...')" /> <input v-model="searchText" class="form-control search-input" :placeholder="$t('Search...')" />
@ -19,21 +19,21 @@
<router-link v-for="(item, index) in sortedMonitorList" :key="index" :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }"> <router-link v-for="(item, index) in sortedMonitorList" :key="index" :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }">
<div class="row"> <div class="row">
<div class="col-6 col-md-8 small-padding" :class="{ 'monitorItem': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none' }"> <div class="col-6 col-md-8 small-padding" :class="{ 'monitorItem': $root.userHeartbeatBar === 'bottom' || $root.userHeartbeatBar === 'none' }">
<div class="info"> <div class="info">
<Uptime :monitor="item" type="24" :pill="true" /> <Uptime :monitor="item" type="24" :pill="true" />
{{ item.name }} <span class="ms-1">{{ item.name }}</span>
</div> </div>
<div class="tags"> <div class="tags">
<Tag v-for="tag in item.tags" :key="tag" :item="tag" :size="'sm'" /> <Tag v-for="tag in item.tags" :key="tag" :item="tag" :size="'sm'" />
</div> </div>
</div> </div>
<div v-show="$root.userHeartbeatBar == 'normal'" :key="$root.userHeartbeatBar" class="col-6 col-md-4"> <div v-show="$root.userHeartbeatBar === 'normal'" :key="$root.userHeartbeatBar" class="col-6 col-md-4 small-padding">
<HeartbeatBar size="small" :monitor-id="item.id" /> <HeartbeatBar size="small" :monitor-id="item.id" />
</div> </div>
</div> </div>
<div v-if="$root.userHeartbeatBar == 'bottom'" class="row"> <div v-if="$root.userHeartbeatBar === 'bottom'" class="row">
<div class="col-12"> <div class="col-12">
<HeartbeatBar size="small" :monitor-id="item.id" /> <HeartbeatBar size="small" :monitor-id="item.id" />
</div> </div>
@ -62,7 +62,7 @@ export default {
data() { data() {
return { return {
searchText: "", searchText: "",
} };
}, },
computed: { computed: {
sortedMonitorList() { sortedMonitorList() {
@ -91,17 +91,17 @@ export default {
} }
return m1.name.localeCompare(m2.name); return m1.name.localeCompare(m2.name);
}) });
// Simple filter by search text // Simple filter by search text
// finds monitor name, tag name or tag value // finds monitor name, tag name or tag value
if (this.searchText != "") { if (this.searchText) {
const loweredSearchText = this.searchText.toLowerCase(); const loweredSearchText = this.searchText.toLowerCase();
result = result.filter(monitor => { result = result.filter(monitor => {
return monitor.name.toLowerCase().includes(loweredSearchText) return monitor.name.toLowerCase().includes(loweredSearchText)
|| monitor.tags.find(tag => tag.name.toLowerCase().includes(loweredSearchText) || monitor.tags.find(tag => tag.name.toLowerCase().includes(loweredSearchText)
|| tag.value?.toLowerCase().includes(loweredSearchText)) || tag.value?.toLowerCase().includes(loweredSearchText));
}) });
} }
return result; return result;
@ -115,7 +115,7 @@ export default {
this.searchText = ""; this.searchText = "";
} }
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

16
src/components/Uptime.vue
View File

@ -22,33 +22,33 @@ export default {
return Math.round(this.$root.uptimeList[key] * 10000) / 100 + "%"; return Math.round(this.$root.uptimeList[key] * 10000) / 100 + "%";
} }
return this.$t("notAvailableShort") return this.$t("notAvailableShort");
}, },
color() { color() {
if (this.lastHeartBeat.status === 0) { if (this.lastHeartBeat.status === 0) {
return "danger" return "danger";
} }
if (this.lastHeartBeat.status === 1) { if (this.lastHeartBeat.status === 1) {
return "primary" return "primary";
} }
if (this.lastHeartBeat.status === 2) { if (this.lastHeartBeat.status === 2) {
return "warning" return "warning";
} }
return "secondary" return "secondary";
}, },
lastHeartBeat() { lastHeartBeat() {
if (this.monitor.id in this.$root.lastHeartbeatList && this.$root.lastHeartbeatList[this.monitor.id]) { if (this.monitor.id in this.$root.lastHeartbeatList && this.$root.lastHeartbeatList[this.monitor.id]) {
return this.$root.lastHeartbeatList[this.monitor.id] return this.$root.lastHeartbeatList[this.monitor.id];
} }
return { return {
status: -1, status: -1,
} };
}, },
className() { className() {
@ -59,7 +59,7 @@ export default {
return ""; return "";
}, },
}, },
} };
</script> </script>
<style> <style>

Write Preview
Loading…
Cancel
Save