Change Icon, Add missing var

badge-list.md

@@ -1,123 +0,0 @@
-/api/badge/:id/status
-```
-    label,
-    upLabel = "Up",
-    downLabel = "Down",
-    pendingLabel = "Pending",
-    maintenanceLabel = "Maintenance",
-    upColor = badgeConstants.defaultUpColor,
-    downColor = badgeConstants.defaultDownColor,
-    pendingColor = badgeConstants.defaultPendingColor,
-    maintenanceColor = badgeConstants.defaultMaintenanceColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-/api/badge/:id/uptime/:duration?
-    label,
-    labelPrefix,
-    labelSuffix = badgeConstants.defaultUptimeLabelSuffix,
-    prefix,
-    suffix = badgeConstants.defaultUptimeValueSuffix,
-    color,
-    labelColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-/api/badge/:id/ping/:duration?
-    label,
-    labelPrefix,
-    labelSuffix = badgeConstants.defaultPingLabelSuffix,
-    prefix,
-    suffix = badgeConstants.defaultPingValueSuffix,
-    color = badgeConstants.defaultPingColor,
-    labelColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-/api/badge/:id/avg-response/:duration?
-    label,
-    labelPrefix,
-    labelSuffix,
-    prefix,
-    suffix = badgeConstants.defaultPingValueSuffix,
-    color = badgeConstants.defaultPingColor,
-    labelColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-/api/badge/:id/cert-exp
-    label,
-    labelPrefix,
-    labelSuffix,
-    prefix,
-    suffix = date ? "" : badgeConstants.defaultCertExpValueSuffix,
-    upColor = badgeConstants.defaultUpColor,
-    warnColor = badgeConstants.defaultWarnColor,
-    downColor = badgeConstants.defaultDownColor,
-    warnDays = badgeConstants.defaultCertExpireWarnDays,
-    downDays = badgeConstants.defaultCertExpireDownDays,
-    labelColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-/api/badge/:id/response
-    label,
-    labelPrefix,
-    labelSuffix,
-    prefix,
-    suffix = badgeConstants.defaultPingValueSuffix,
-    color = badgeConstants.defaultPingColor,
-    labelColor,
-    style = badgeConstants.defaultStyle,
-    value, // for demo purpose only
-```
-
-```
-Use in all routes
-    label
-    prefix
-    suffix,
-    labelColor
-    style = badgeConstants.defaultStyle,
-    value // for demo purpose only
-```
-
-```
-Use in all routes except status and cert-exp
-    color
-```
-
-```
-Use in all routes except status
-    labelPrefix
-    labelSuffix
-```
-
-```
-Use in routes status and cert-exp
-    upColor = badgeConstants.defaultUpColor,
-    downColor = badgeConstants.defaultDownColor,
-```
-
-```
-Use in status route only
-    pendingColor = badgeConstants.defaultPendingColor,
-    maintenanceColor = badgeConstants.defaultMaintenanceColor,
-```
-
-```
-Use in cert-exp route only
-    warnColor = badgeConstants.defaultWarnColor,
-    warnDays = badgeConstants.defaultCertExpireWarnDays,
-    downDays = badgeConstants.defaultCertExpireDownDays,
-```

src/components/BadgeGeneratorDialog.vue

@@ -1,5 +1,4 @@
 <template>
-    <form @submit.prevent="submit">
     <div ref="BadgeGeneratorModal" class="modal fade" tabindex="-1" data-bs-backdrop="static">
         <div class="modal-dialog">
             <div class="modal-content">
@@ -34,12 +33,12 @@
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('prefix') " class="mb-3">
                         <label for="prefix" class="form-label">{{ $t("Badge Prefix") }}</label>
-                            <input id="prefix" v-model="badge.label" type="text" class="form-control" required>
+                        <input id="prefix" v-model="badge.prefix" type="text" class="form-control" required>
                     </div>
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('suffix') " class="mb-3">
                         <label for="suffix" class="form-label">{{ $t("Badge Suffix") }}</label>
-                            <input id="suffix" v-model="badge.label" type="text" class="form-control" required>
+                        <input id="suffix" v-model="badge.suffix" type="text" class="form-control" required>
                     </div>
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('labelColor') " class="mb-3">
@@ -49,7 +48,7 @@
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('color') " class="mb-3">
                         <label for="color" class="form-label">{{ $t("Badge Color") }}</label>
-                            <input id="color" v-model="badge.labelColor" type="text" class="form-control" required>
+                        <input id="color" v-model="badge.color" type="text" class="form-control" required>
                     </div>
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('labelPrefix') " class="mb-3">
@@ -94,7 +93,7 @@
 
                     <div v-if=" (parameters[badge.type || 'null'] || [] ).includes('downDays') " class="mb-3">
                         <label for="downDays" class="form-label">{{ $t("Badge Down Days") }}</label>
-                            <input id="downDays" v-model="badge.labelColor" type="number" min="0" class="form-control" required>
+                        <input id="downDays" v-model="badge.downDays" type="number" min="0" class="form-control" required>
                     </div>
 
                     <div class="mb-3">
@@ -127,7 +126,6 @@
             </div>
         </div>
     </div>
-    </form>
 </template>
 
 <script lang="ts">
@@ -155,8 +153,17 @@ export default {
                 prefix: null,
                 suffix: null,
                 labelColor: null,
-
+                color: null,
-                style: "plastic",
+                labelPrefix: null,
+                labelSuffix: null,
+                upColor: null,
+                downColor: null,
+                pendingColor: null,
+                maintenanceColor: null,
+                warnColor: null,
+                warnDays: null,
+                downDays: null,
+                style: "flat",
                 value: null,
             },
             parameters: {
@@ -205,6 +212,7 @@ export default {
                     "upColor",
                     "warnColor",
                     "downColor",
+                    "warnDays",
                     "downDays",
                     "labelColor",
                 ],
@@ -223,7 +231,7 @@ export default {
     computed: {
         badgeURL() {
             if (!this.monitor.id || !this.badge.type) {
-                return null;
+                return;
             }
             let badgeURL = this.$root.baseURL + "/api/badge/" + this.monitor.id + "/" + this.badge.type;
 
@@ -243,6 +251,10 @@ export default {
             }
 
             for (let parameter of [ "label", "style", "value" ]) {
+                if (parameter === "style" && this.badge.style === "flat") {
+                    continue;
+                }
+
                 if (this.badge[parameter]) {
                     // eslint-disable-next-line camelcase
                     parameter_list[parameter] = this.badge[parameter];

src/components/PublicGroupList.vue

@@ -65,8 +65,9 @@
                                                 title="Badge Generator"
                                             >
                                                 <font-awesome-icon
+                                                    v-if="editMode"
                                                     :class="{'link-active': true, 'btn-link': true}"
-                                                    icon="eye" class="action me-3"
+                                                    icon="certificate" class="action me-3"
                                                     @click="$refs.badgeGeneratorDialog.show(monitor.element.id, monitor.element.name)"
                                                 />
                                             </span>

src/icon.js

@@ -49,6 +49,7 @@ import {
     faFilter,
     faInfoCircle,
     faClone,
+    faCertificate,
 } from "@fortawesome/free-solid-svg-icons";
 
 library.add(
@@ -95,6 +96,7 @@ library.add(
     faFilter,
     faInfoCircle,
     faClone,
+    faCertificate,
 );
 
 export { FontAwesomeIcon };