Infra-Mirrors/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2025-08-09 15:02:33 -04:00
Code Issues Projects Releases Packages Wiki Activity

improve multiselect

Browse source
This commit is contained in:
LouisLam 2021-08-08 21:03:10 +08:00
parent 7b1000d995
commit 3265c3cbc3
5 changed files with 41 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/pages/EditMonitor.vue
View file

@ -96,9 +96,20 @@
<div class="my-3">
<label for="acceptedStatusCodes" class="form-label">Accepted Status Codes</label>
<VueMultiselect id="acceptedStatusCodes" v-model="monitor.accepted_statuscodes" :options="acceptedStatusCodeOptions" :multiple="true" :close-on-select="false" :clear-on-select="false" :preserve-search="true" placeholder="Pick Accepted Status Codes..." :preselect-first="false">
<template #selection="{ values, isOpen }"><span v-if="values.length && !isOpen" class="multiselect__single">{{ values.length }} options selected</span></template>
</VueMultiselect>
<VueMultiselect
id="acceptedStatusCodes"
v-model="monitor.accepted_statuscodes"
:options="acceptedStatusCodeOptions"
:multiple="true"
:close-on-select="false"
:clear-on-select="false"
:preserve-search="true"
placeholder="Pick Accepted Status Codes..."
:preselect-first="false"
:taggable="true"
></VueMultiselect>
<div class="form-text">
Select status codes which are considered as a successful response.
</div>
@ -248,7 +259,7 @@ export default {
@import "../assets/vars.scss";
.multiselect__tags {
border-radius: 2rem;
border-radius: 1.5rem;
border: 1px solid #ced4da;
}
@ -265,8 +276,15 @@ export default {
}
.multiselect__tag {
border-radius: 50rem;
background: $primary !important;
}
.dark {
.multiselect__tag {
color: $dark-font-color2;
}
}
</style>
<style scoped>