Infra-Mirrors/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-12-18 12:14:41 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2752 from titanventura/show-tags-in-status-page-monitor-select-list

Browse Source 
show tags in monitor select list under status page
This commit is contained in:
Louis Lam 2023-04-04 16:13:26 +08:00 committed by GitHub
commit be7d3f6142
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 22 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/pages/StatusPage.vue
View File

@ -280,9 +280,24 @@
<div class="mt-3"> <div class="mt-3">
<div v-if="allMonitorList.length > 0 && loadedData"> <div v-if="allMonitorList.length > 0 && loadedData">
<label>{{ $t("Add a monitor") }}:</label> <label>{{ $t("Add a monitor") }}:</label>
<select v-model="selectedMonitor" class="form-control"> <VueMultiselect
<option v-for="monitor in allMonitorList" :key="monitor.id" :value="monitor">{{ monitor.name }}</option> v-model="selectedMonitor"
</select> :options="allMonitorList"
:multiple="false"
:searchable="true"
:placeholder="$t('Add a monitor')"
label="name"
trackBy="name"
class="mt-3"
>
<template #option="{ option }">
<div
class="d-inline-flex"
>
<span>{{ option.name }} <Tag v-for="tag in option.tags" :key="tag" :item="tag" :size="'sm'" /></span>
</div>
</template>
</VueMultiselect>
</div> </div>
<div v-else class="text-center"> <div v-else class="text-center">
{{ $t("No monitors available.") }} <router-link to="/add">{{ $t("Add one") }}</router-link> {{ $t("No monitors available.") }} <router-link to="/add">{{ $t("Add one") }}</router-link>
@ -350,6 +365,8 @@ import MaintenanceTime from "../components/MaintenanceTime.vue";
import DateTime from "../components/Datetime.vue"; import DateTime from "../components/Datetime.vue";
import { getResBaseURL } from "../util-frontend"; import { getResBaseURL } from "../util-frontend";
import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_MAINTENANCE, STATUS_PAGE_PARTIAL_DOWN, UP, MAINTENANCE } from "../util.ts"; import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_MAINTENANCE, STATUS_PAGE_PARTIAL_DOWN, UP, MAINTENANCE } from "../util.ts";
import Tag from "../components/Tag.vue";
import VueMultiselect from "vue-multiselect";
const toast = useToast(); const toast = useToast();
dayjs.extend(duration); dayjs.extend(duration);
@ -372,6 +389,8 @@ export default {
PrismEditor, PrismEditor,
MaintenanceTime, MaintenanceTime,
DateTime, DateTime,
Tag,
VueMultiselect
}, },
// Leave Page for vue route change // Leave Page for vue route change