set default value for dns resolve type and code refactor

This commit is contained in:
LouisLam 2021-08-28 11:46:26 +08:00
parent d4dd650bfe
commit 91e82bd12c

View file

@ -47,22 +47,21 @@
</div> </div>
</div> </div>
<div v-if="monitor.type === 'port' || monitor.type === 'ping' " class="my-3"> <!-- TCP Port / Ping / DNS only -->
<div v-if="monitor.type === 'port' || monitor.type === 'ping' || monitor.type === 'dns' " class="my-3">
<label for="hostname" class="form-label">{{ $t("Hostname") }}</label> <label for="hostname" class="form-label">{{ $t("Hostname") }}</label>
<input id="hostname" v-model="monitor.hostname" type="text" class="form-control" required> <input id="hostname" v-model="monitor.hostname" type="text" class="form-control" required>
</div> </div>
<!-- For TCP Port Type -->
<div v-if="monitor.type === 'port' " class="my-3"> <div v-if="monitor.type === 'port' " class="my-3">
<label for="port" class="form-label">{{ $t("Port") }}</label> <label for="port" class="form-label">{{ $t("Port") }}</label>
<input id="port" v-model="monitor.port" type="number" class="form-control" required min="0" max="65535" step="1"> <input id="port" v-model="monitor.port" type="number" class="form-control" required min="0" max="65535" step="1">
</div> </div>
<div v-if="monitor.type === 'dns'" class="my-3"> <!-- For DNS Type -->
<label for="hostname" class="form-label">Hostname</label> <template v-if="monitor.type === 'dns'">
<input id="hostname" v-model="monitor.hostname" type="text" class="form-control" required> <div class="my-3">
</div>
<div v-if="monitor.type === 'dns'" class="my-3">
<label for="dns_resolve_server" class="form-label">{{ $t("Resolver Server") }}</label> <label for="dns_resolve_server" class="form-label">{{ $t("Resolver Server") }}</label>
<input id="dns_resolve_server" v-model="monitor.dns_resolve_server" type="text" class="form-control" :pattern="ipRegex" required> <input id="dns_resolve_server" v-model="monitor.dns_resolve_server" type="text" class="form-control" :pattern="ipRegex" required>
<div class="form-text"> <div class="form-text">
@ -70,9 +69,10 @@
</div> </div>
</div> </div>
<div v-if="monitor.type === 'dns'" class="my-3"> <div class="my-3">
<label for="dns_resolve_type" class="form-label">{{ $t("Resource Record Type") }}</label> <label for="dns_resolve_type" class="form-label">{{ $t("Resource Record Type") }}</label>
<!-- :allow-empty="false" is not working, set a default value instead https://github.com/shentao/vue-multiselect/issues/336 -->
<VueMultiselect <VueMultiselect
id="dns_resolve_type" id="dns_resolve_type"
v-model="monitor.dns_resolve_type" v-model="monitor.dns_resolve_type"
@ -91,6 +91,7 @@
{{ $t("rrtypeDescription") }} {{ $t("rrtypeDescription") }}
</div> </div>
</div> </div>
</template>
<div class="my-3"> <div class="my-3">
<label for="interval" class="form-label">{{ $t("Heartbeat Interval") }} ({{ $t("checkEverySecond", [ monitor.interval ]) }})</label> <label for="interval" class="form-label">{{ $t("Heartbeat Interval") }} ({{ $t("checkEverySecond", [ monitor.interval ]) }})</label>
@ -124,7 +125,9 @@
</div> </div>
</div> </div>
<div v-if="monitor.type === 'http' || monitor.type === 'keyword' " class="my-3"> <!-- HTTP / Keyword only -->
<template v-if="monitor.type === 'http' || monitor.type === 'keyword' ">
<div class="my-3">
<label for="maxRedirects" class="form-label">{{ $t("Max. Redirects") }}</label> <label for="maxRedirects" class="form-label">{{ $t("Max. Redirects") }}</label>
<input id="maxRedirects" v-model="monitor.maxredirects" type="number" class="form-control" required min="0" step="1"> <input id="maxRedirects" v-model="monitor.maxredirects" type="number" class="form-control" required min="0" step="1">
<div class="form-text"> <div class="form-text">
@ -132,7 +135,7 @@
</div> </div>
</div> </div>
<div v-if="monitor.type === 'http' || monitor.type === 'keyword' " class="my-3"> <div class="my-3">
<label for="acceptedStatusCodes" class="form-label">{{ $t("Accepted Status Codes") }}</label> <label for="acceptedStatusCodes" class="form-label">{{ $t("Accepted Status Codes") }}</label>
<VueMultiselect <VueMultiselect
@ -153,6 +156,7 @@
{{ $t("acceptedStatusCodesDescription") }} {{ $t("acceptedStatusCodesDescription") }}
</div> </div>
</div> </div>
</template>
<div class="mt-5 mb-1"> <div class="mt-5 mb-1">
<button class="btn btn-primary" type="submit" :disabled="processing">{{ $t("Save") }}</button> <button class="btn btn-primary" type="submit" :disabled="processing">{{ $t("Save") }}</button>
@ -207,6 +211,7 @@ export default {
processing: false, processing: false,
monitor: { monitor: {
notificationIDList: {}, notificationIDList: {},
// Do not add default value here, please check init() method
}, },
acceptedStatusCodeOptions: [], acceptedStatusCodeOptions: [],
dnsresolvetypeOptions: [], dnsresolvetypeOptions: [],
@ -288,6 +293,7 @@ export default {
upsideDown: false, upsideDown: false,
maxredirects: 10, maxredirects: 10,
accepted_statuscodes: ["200-299"], accepted_statuscodes: ["200-299"],
dns_resolve_type: "A",
dns_resolve_server: "1.1.1.1", dns_resolve_server: "1.1.1.1",
} }
} else if (this.isEdit) { } else if (this.isEdit) {