TyleoDvDelaware3217/Kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-05-24 15:52:33 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Fixed the issue that clicking the Settings button on the edit status page was invalid

Browse source
This commit is contained in:
Marshu 2025-04-13 23:41:43 +08:00
parent 436ac1b2ca
commit 853e84178e
2 changed files with 182 additions and 170 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/components/MonitorSettingDialog.vue
View file

@ -72,11 +72,17 @@ export default {
* @returns {void} * @returns {void}
*/ */
show(group, monitor) { show(group, monitor) {
// Check if monitor exists and has required properties
if (!monitor || !monitor.id) {
console.error("Invalid monitor object", monitor);
return;
}
this.monitor = { this.monitor = {
id: monitor.element.id, id: monitor.id,
name: monitor.element.name, name: monitor.name,
monitor_index: monitor.index, monitor_index: monitor.index || 0,
group_index: group.index, group_index: group.index || 0,
isClickAble: this.showLink(monitor), isClickAble: this.showLink(monitor),
}; };
@ -103,12 +109,18 @@ export default {
* @returns {boolean} Should the link be shown? * @returns {boolean} Should the link be shown?
*/ */
showLink(monitor, ignoreSendUrl = false) { showLink(monitor, ignoreSendUrl = false) {
if (!monitor || !monitor.id) {
return false;
}
// We must check if there are any elements in monitorList to // We must check if there are any elements in monitorList to
// prevent undefined errors if it hasn't been loaded yet // prevent undefined errors if it hasn't been loaded yet
if (this.$parent.editMode && ignoreSendUrl && Object.keys(this.$root.monitorList).length) { if (this.$parent.editMode && ignoreSendUrl && Object.keys(this.$root.monitorList).length) {
return this.$root.monitorList[monitor.element.id].type === "http" || this.$root.monitorList[monitor.element.id].type === "keyword" || this.$root.monitorList[monitor.element.id].type === "json-query"; return this.$root.monitorList[monitor.id].type === "http" ||
this.$root.monitorList[monitor.id].type === "keyword" ||
this.$root.monitorList[monitor.id].type === "json-query";
} }
return monitor.element.sendUrl && monitor.element.url && monitor.element.url !== "https://" && !this.editMode; return monitor.sendUrl && monitor.url && monitor.url !== "https://" && !this.editMode;
}, },
}, },
}; };

108
src/components/PublicGroupList.vue
View file

@ -86,15 +86,15 @@
<div class="shadow-box"> <div class="shadow-box">
<!-- Group Title and Search Bar --> <!-- Group Title and Search Bar -->
<div class="group-header"> <div class="group-header">
<h2 class="group-title"> <h2 class="group-title">
<font-awesome-icon v-if="editMode && showGroupDrag" icon="arrows-alt-v" class="action drag me-3" /> <font-awesome-icon v-if="editMode && showGroupDrag" icon="arrows-alt-v" class="action drag me-3" />
<font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeGroup(group.index)" /> <font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeGroup(group.index)" />
<Editable v-model="group.element.name" :contenteditable="editMode" tag="span" data-testid="group-name" /> <Editable v-model="group.element.name" :contenteditable="editMode" tag="span" data-testid="group-name" />
</h2> </h2>
<!-- Group Search Box --> <!-- Group Search Box -->
<div v-if="!editMode && group.element && group.element.monitorList && group.element.monitorList.length > 0" <div v-if="!editMode && group.element && group.element.monitorList && group.element.monitorList.length > 0"
class="search-container"> class="search-container">
<div class="search-input-wrapper"> <div class="search-input-wrapper">
<input <input
type="text" type="text"
@ -117,7 +117,7 @@
<!-- Group Sort Button Bar --> <!-- Group Sort Button Bar -->
<div v-if="!editMode && group.element && group.element.monitorList && group.element.monitorList.length > 0" <div v-if="!editMode && group.element && group.element.monitorList && group.element.monitorList.length > 0"
class="sort-bar"> class="sort-bar">
<div class="sort-controls"> <div class="sort-controls">
<span class="sort-label me-2"> <span class="sort-label me-2">
{{ $t("Sort By") }}: {{ $t("Sort By") }}:
@ -191,70 +191,70 @@
<!-- Monitor List --> <!-- Monitor List -->
<div class="monitor-list-container"> <div class="monitor-list-container">
<div v-if="!group.element || !group.element.monitorList || group.element.monitorList.length === 0" class="text-center no-monitor-msg"> <div v-if="!group.element || !group.element.monitorList || group.element.monitorList.length === 0" class="text-center no-monitor-msg">
{{ $t("No Monitors") }} {{ $t("No Monitors") }}
</div> </div>
<div v-else-if="getFilteredMonitorList(group.element).length === 0" class="text-center no-monitor-msg"> <div v-else-if="getFilteredMonitorList(group.element).length === 0" class="text-center no-monitor-msg">
{{ $t("No services found") }} {{ $t("No services found") }}
</div> </div>
<!-- Monitor List --> <!-- Monitor List -->
<Draggable <Draggable
v-if="group.element && group.element.monitorList && group.element.monitorList.length > 0" v-if="group.element && group.element.monitorList && group.element.monitorList.length > 0"
v-model="group.element.monitorList" v-model="group.element.monitorList"
class="monitor-list" class="monitor-list"
group="same-group" group="same-group"
:disabled="!editMode" :disabled="!editMode"
:animation="100" :animation="100"
item-key="id" item-key="id"
> >
<template #item="{ element: monitor, index: monitorIndex }"> <template #item="{ element: monitor, index: monitorIndex }">
<div v-if="shouldShowMonitor(monitor, group.element)" class="item" data-testid="monitor"> <div v-if="shouldShowMonitor(monitor, group.element)" class="item" data-testid="monitor">
<div class="row"> <div class="row">
<div class="col-9 col-md-8 small-padding"> <div class="col-9 col-md-8 small-padding">
<div class="info"> <div class="info">
<font-awesome-icon v-if="editMode" icon="arrows-alt-v" class="action drag me-3" /> <font-awesome-icon v-if="editMode" icon="arrows-alt-v" class="action drag me-3" />
<font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeMonitor(group.index, monitorIndex)" /> <font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeMonitor(group.index, monitorIndex)" />
<Uptime :monitor="monitor" type="24" :pill="true" /> <Uptime :monitor="monitor" type="24" :pill="true" />
<a <a
v-if="showLink(monitor)" v-if="showLink(monitor)"
:href="monitor.url" :href="monitor.url"
class="item-name" class="item-name"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
data-testid="monitor-name" data-testid="monitor-name"
> >
{{ monitor.name }} {{ monitor.name }}
</a> </a>
<p v-else class="item-name" data-testid="monitor-name"> {{ monitor.name }} </p> <p v-else class="item-name" data-testid="monitor-name"> {{ monitor.name }} </p>
<span <span
title="Setting" title="Setting"
> >
<font-awesome-icon <font-awesome-icon
v-if="editMode" v-if="editMode"
:class="{'link-active': true, 'btn-link': true}" :class="{'link-active': true, 'btn-link': true}"
icon="cog" class="action me-3" icon="cog" class="action me-3"
@click="$refs.monitorSettingDialog.show(group.element, monitor)" @click="$refs.monitorSettingDialog.show(group, monitor)"
/> />
</span> </span>
</div>
<div class="extra-info">
<div v-if="showCertificateExpiry && monitor.certExpiryDaysRemaining">
<Tag :item="{name: $t('Cert Exp.'), value: formattedCertExpiryMessage(monitor), color: certExpiryColor(monitor)}" :size="'sm'" />
</div> </div>
<div v-if="showTags"> <div class="extra-info">
<div v-if="showCertificateExpiry && monitor.certExpiryDaysRemaining">
<Tag :item="{name: $t('Cert Exp.'), value: formattedCertExpiryMessage(monitor), color: certExpiryColor(monitor)}" :size="'sm'" />
</div>
<div v-if="showTags">
<Tag v-for="tag in monitor.tags" :key="tag" :item="tag" :size="'sm'" data-testid="monitor-tag" /> <Tag v-for="tag in monitor.tags" :key="tag" :item="tag" :size="'sm'" data-testid="monitor-tag" />
</div> </div>
</div>
</div>
<div :key="$root.userHeartbeatBar" class="col-3 col-md-4">
<HeartbeatBar size="mid" :monitor-id="monitor.id" />
</div> </div>
</div> </div>
<div :key="$root.userHeartbeatBar" class="col-3 col-md-4">
<HeartbeatBar size="mid" :monitor-id="monitor.id" />
</div>
</div> </div>
</div> </template>
</template> </Draggable>
</Draggable>
</div> </div>
</div> </div>
</div> </div>
@ -326,12 +326,12 @@ export default {
}, },
hasPublicGroups() { hasPublicGroups() {
return this.$root && return this.$root &&
this.$root.publicGroupList && this.$root.publicGroupList &&
Array.isArray(this.$root.publicGroupList) && Array.isArray(this.$root.publicGroupList) &&
this.$root.publicGroupList.length > 0 && this.$root.publicGroupList.length > 0 &&
this.$root.publicGroupList.some(group => this.$root.publicGroupList.some(group =>
group && group.monitorList && group.monitorList.length > 0 group && group.monitorList && group.monitorList.length > 0
); );
}, },
filteredMonitorList() { filteredMonitorList() {
if (!this.searchText || !this.monitorList) { if (!this.searchText || !this.monitorList) {
@ -391,7 +391,7 @@ export default {
}, },
// Watch for changes in uptimeList to re-apply sort // Watch for changes in uptimeList to re-apply sort
'$root.uptimeList': { '$root.uptimeList': {
handler() { handler() {
if (this.$root && this.$root.publicGroupList) { if (this.$root && this.$root.publicGroupList) {
this.$root.publicGroupList.forEach(group => { this.$root.publicGroupList.forEach(group => {
if (group) { if (group) {
@ -546,8 +546,8 @@ export default {
// Search name, URL and description fields // Search name, URL and description fields
return (monitor.name && monitor.name.toLowerCase().includes(keyword)) || return (monitor.name && monitor.name.toLowerCase().includes(keyword)) ||
(monitor.url && monitor.url.toLowerCase().includes(keyword)) || (monitor.url && monitor.url.toLowerCase().includes(keyword)) ||
(monitor.description && monitor.description.toLowerCase().includes(keyword)); (monitor.description && monitor.description.toLowerCase().includes(keyword));
}, },
/** /**