diff options
Diffstat (limited to 'src/components/notifications')
70 files changed, 2789 insertions, 0 deletions
diff --git a/src/components/notifications/46elks.vue b/src/components/notifications/46elks.vue new file mode 100644 index 0000000..d29655b --- /dev/null +++ b/src/components/notifications/46elks.vue @@ -0,0 +1,48 @@ +<template> + <div class="mb-3"> + <label for="ElksUsername" class="form-label">{{ $t("Username") }}</label> + <input id="ElksUsername" v-model="$parent.notification.elksUsername" type="text" class="form-control" required> + <label for="ElksPassword" class="form-label">{{ $t("Password") }}</label> + </div> + <div class="form-text"> + <HiddenInput id="ElksPassword" v-model="$parent.notification.elksAuthToken" :required="true" autocomplete="new-password"></HiddenInput> + <i18n-t tag="p" keypath="Can be found on:"> + <a href="https://46elks.com/account" target="_blank">https://46elks.com/account</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="Elks-from-number" class="form-label">{{ $t("From") }}</label> + <input id="Elks-from-number" v-model="$parent.notification.elksFromNumber" type="text" class="form-control" required> + <div class="form-text"> + {{ $t("Either a text sender ID or a phone number in E.164 format if you want to be able to receive replies.") }} + <i18n-t tag="p" keypath="More info on:"> + <a href="https://46elks.se/kb/text-sender-id" target="_blank">https://46elks.se/kb/text-sender-id</a> + </i18n-t> + </div> + </div> + + <div class="mb-3"> + <label for="Elks-to-number" class="form-label">{{ $t("To Number") }}</label> + <input id="Elks-to-number" v-model="$parent.notification.elksToNumber" type="text" class="form-control" required> + <div class="form-text"> + {{ $t("The phone number of the recipient in E.164 format.") }} + <i18n-t tag="p" keypath="More info on:"> + <a href="https://46elks.se/kb/e164" target="_blank">https://46elks.se/kb/e164</a> + </i18n-t> + </div> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://46elks.com/docs/send-sms" target="_blank">https://46elks.com/docs/send-sms</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/AlertNow.vue b/src/components/notifications/AlertNow.vue new file mode 100644 index 0000000..93acc95 --- /dev/null +++ b/src/components/notifications/AlertNow.vue @@ -0,0 +1,13 @@ +<template> + <div class="mb-3"> + <label for="alertnow-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="alertnow-webhook-url" v-model="$parent.notification.alertNowWebhookURL" type="text" class="form-control" required> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://service.opsnow.com/docs/alertnow/en/user-guide-alertnow-en.html#standard" target="_blank">{{ $t("here") }}</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Alerta.vue b/src/components/notifications/Alerta.vue new file mode 100644 index 0000000..962267f --- /dev/null +++ b/src/components/notifications/Alerta.vue @@ -0,0 +1,14 @@ +<template> + <div class="mb-3"> + <label for="alerta-api-endpoint" class="form-label">{{ $t("alertaApiEndpoint") }}</label> + <input id="alerta-api-endpoint" v-model="$parent.notification.alertaApiEndpoint" type="text" class="form-control" required> + <label for="alerta-environment" class="form-label">{{ $t("alertaEnvironment") }}</label> + <input id="alerta-environment" v-model="$parent.notification.alertaEnvironment" type="text" class="form-control" required> + <label for="alerta-api-key" class="form-label">{{ $t("alertaApiKey") }}</label> + <input id="alerta-api-key" v-model="$parent.notification.alertaApiKey" type="text" class="form-control" required> + <label for="alerta-alert-state" class="form-label">{{ $t("alertaAlertState") }}</label> + <input id="alerta-alert-state" v-model="$parent.notification.alertaAlertState" type="text" class="form-control" placeholder="critical" required> + <label for="alerta-recover-state" class="form-label">{{ $t("alertaRecoverState") }}</label> + <input id="alerta-recover-state" v-model="$parent.notification.alertaRecoverState" type="text" class="form-control" placeholder="cleared" required> + </div> +</template> diff --git a/src/components/notifications/AliyunSms.vue b/src/components/notifications/AliyunSms.vue new file mode 100644 index 0000000..422b700 --- /dev/null +++ b/src/components/notifications/AliyunSms.vue @@ -0,0 +1,25 @@ +<template> + <div class="mb-3"> + <label for="accessKeyId" class="form-label">{{ $t("AccessKeyId") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="accessKeyId" v-model="$parent.notification.accessKeyId" type="text" class="form-control" required> + + <label for="secretAccessKey" class="form-label">{{ $t("SecretAccessKey") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="secretAccessKey" v-model="$parent.notification.secretAccessKey" type="text" class="form-control" required> + + <label for="phonenumber" class="form-label">{{ $t("PhoneNumbers") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="phonenumber" v-model="$parent.notification.phonenumber" type="text" class="form-control" required> + + <label for="templateCode" class="form-label">{{ $t("TemplateCode") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="templateCode" v-model="$parent.notification.templateCode" type="text" class="form-control" required> + + <label for="signName" class="form-label">{{ $t("SignName") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="signName" v-model="$parent.notification.signName" type="text" class="form-control" required> + + <div class="form-text"> + <p>{{ $t("Sms template must contain parameters: ") }}<br> <code>${name} ${time} ${status} ${msg}</code></p> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://help.aliyun.com/document_detail/101414.html" target="_blank">https://help.aliyun.com/document_detail/101414.html</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Apprise.vue b/src/components/notifications/Apprise.vue new file mode 100644 index 0000000..7432554 --- /dev/null +++ b/src/components/notifications/Apprise.vue @@ -0,0 +1,38 @@ +<template> + <div class="mb-3"> + <label for="apprise-url" class="form-label">{{ $t("Apprise URL") }}</label> + <input id="apprise-url" v-model="$parent.notification.appriseURL" type="text" class="form-control" required> + <div class="form-text"> + <p>{{ $t("Example:", ["twilio://AccountSid:AuthToken@FromPhoneNo"]) }}</p> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://github.com/caronc/apprise/wiki#notification-services" target="_blank">https://github.com/caronc/apprise/wiki#notification-services</a> + </i18n-t> + </div> + + <label for="title" class="form-label">{{ $t("Title") }}</label> + <input id="title" v-model="$parent.notification.title" type="text" class="form-control"> + </div> + <div class="mb-3"> + <i18n-t tag="p" keypath="Status:"> + <span v-if="appriseInstalled" class="text-primary">{{ $t("appriseInstalled") }}</span> + <i18n-t v-else tag="span" keypath="appriseNotInstalled" class="text-danger"> + <a href="https://github.com/caronc/apprise" target="_blank">{{ $t("Read more") }}</a> + </i18n-t> + </i18n-t> + </div> +</template> + +<script> +export default { + data() { + return { + appriseInstalled: false + }; + }, + mounted() { + this.$root.getSocket().emit("checkApprise", (installed) => { + this.appriseInstalled = installed; + }); + }, +}; +</script> diff --git a/src/components/notifications/Bark.vue b/src/components/notifications/Bark.vue new file mode 100644 index 0000000..b38a7dc --- /dev/null +++ b/src/components/notifications/Bark.vue @@ -0,0 +1,60 @@ +<template> + <div class="mb-3"> + <label for="Bark API Version" class="form-label">{{ $t("Bark API Version") }}</label> + <select id="Bark API Version" v-model="$parent.notification.apiVersion" class="form-select" required> + <option value="v1">v1</option> + <option value="v2">v2</option> + </select> + </div> + <div class="mb-3"> + <label for="Bark Endpoint" class="form-label">{{ $t("Bark Endpoint") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="Bark Endpoint" v-model="$parent.notification.barkEndpoint" type="text" class="form-control" required> + <i18n-t tag="div" keypath="wayToGetTeamsURL" class="form-text"> + <a + href="https://github.com/Finb/Bark" + target="_blank" + >{{ $t("here") }}</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="Bark Group" class="form-label">{{ $t("Bark Group") }}</label> + <input id="Bark Group" v-model="$parent.notification.barkGroup" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="Bark Sound" class="form-label">{{ $t("Bark Sound") }}</label> + <select id="Bark Sound" v-model="$parent.notification.barkSound" class="form-select" required> + <option value="alarm">alarm</option> + <option value="anticipate">anticipate</option> + <option value="bell">bell</option> + <option value="birdsong">birdsong</option> + <option value="bloom">bloom</option> + <option value="calypso">calypso</option> + <option value="chime">chime</option> + <option value="choo">choo</option> + <option value="descent">descent</option> + <option value="electronic">electronic</option> + <option value="fanfare">fanfare</option> + <option value="glass">glass</option> + <option value="gotosleep">gotosleep</option> + <option value="healthnotification">healthnotification</option> + <option value="horn">horn</option> + <option value="ladder">ladder</option> + <option value="mailsent">mailsent</option> + <option value="minuet">minuet</option> + <option value="multiwayinvitation">multiwayinvitation</option> + <option value="newmail">newmail</option> + <option value="newsflash">newsflash</option> + <option value="noir">noir</option> + <option value="paymentsuccess">paymentsuccess</option> + <option value="shake">shake</option> + <option value="sherwoodforest">sherwoodforest</option> + <option value="silence">silence</option> + <option value="spell">spell</option> + <option value="suspense">suspense</option> + <option value="telegraph">telegraph</option> + <option value="tiptoes">tiptoes</option> + <option value="typewriters">typewriters</option> + <option value="update">update</option> + </select> + </div> +</template> diff --git a/src/components/notifications/Bitrix24.vue b/src/components/notifications/Bitrix24.vue new file mode 100644 index 0000000..ac3dc31 --- /dev/null +++ b/src/components/notifications/Bitrix24.vue @@ -0,0 +1,24 @@ +<template> + <div class="mb-3"> + <label for="bitrix24-webhook-url" class="form-label">{{ $t("Bitrix24 Webhook URL") }}</label> + <HiddenInput id="bitrix24-webhook-url" v-model="$parent.notification.bitrix24WebhookURL" :required="true" autocomplete="new-password"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetBitrix24Webhook" class="form-text"> + <a href="https://helpdesk.bitrix24.com/open/12357038/" target="_blank">https://helpdesk.bitrix24.com/open/12357038/</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="bitrix24-user-id" class="form-label">{{ $t("User ID") }}</label> + <input id="bitrix24-user-id" v-model="$parent.notification.bitrix24UserID" type="text" class="form-control" required> + <div class="form-text">{{ $t("bitrix24SupportUserID") }}</div> + </div> +</template> +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + } +}; +</script> diff --git a/src/components/notifications/CallMeBot.vue b/src/components/notifications/CallMeBot.vue new file mode 100644 index 0000000..74c69ea --- /dev/null +++ b/src/components/notifications/CallMeBot.vue @@ -0,0 +1,13 @@ +<template> + <div class="mb-3"> + <label for="callmebot-endpoint" class="form-label">{{ $t("Endpoint") }}</label> + <input id="callmebot-endpoint" v-model="$parent.notification.callMeBotEndpoint" type="text" class="form-control" required> + <i18n-t tag="div" keypath="callMeBotGet" class="form-text"> + <a href="https://www.callmebot.com/blog/free-api-facebook-messenger/" target="_blank">Facebook Messenger</a> + <a href="https://www.callmebot.com/blog/test-whatsapp-api/" target="_blank">WhatsApp</a> + <a href="https://www.callmebot.com/blog/telegram-phone-call-using-your-browser/" target="_blank">Telegram Call</a> + 1 message / 10 sec; 1 call / 65 sec + <!--There is no public documentation available. This data is based on testing!--> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/Cellsynt.vue b/src/components/notifications/Cellsynt.vue new file mode 100644 index 0000000..2e8a6de --- /dev/null +++ b/src/components/notifications/Cellsynt.vue @@ -0,0 +1,54 @@ +<template> + <div class="mb-3"> + <label for="cellsynt-login" class="form-label">{{ $t("Username") }}</label> + <input id="cellsynt-login" v-model="$parent.notification.cellsyntLogin" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="cellsynt-key" class="form-label">{{ $t("Password") }}</label> + <HiddenInput id="cellsynt-key" v-model="$parent.notification.cellsyntPassword" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <label for="cellsynt-Originatortype" class="form-label">{{ $t("Originator type") }}</label> + <select id="cellsynt-Originatortype" v-model="$parent.notification.cellsyntOriginatortype" :required="true" class="form-select"> + <option value="alpha">{{ $t("Alphanumeric (recommended)") }}</option> + <option value="numeric">{{ $t("Telephone number") }}</option> + </select> + <div class="form-text"> + <p><b>{{ $t("Alphanumeric (recommended)") }}:</b><br /> {{ $t("Alphanumeric string (max 11 alphanumeric characters). Recipients can not reply to the message.") }}</p> + <p><b>{{ $t("Telephone number") }}:</b><br /> {{ $t("Numeric value (max 15 digits) with telephone number on international format without leading 00 (example UK number 07920 110 000 should be set as 447920110000). Recipients can reply to the message.") }}</p> + </div> + </div> + <div class="mb-3"> + <label for="cellsynt-originator" class="form-label">{{ $t("Originator") }} <small>({{ $parent.notification.cellsyntOriginatortype === 'alpha' ? $t("max 11 alphanumeric characters") : $t("max 15 digits") }})</small></label> + <input v-if="$parent.notification.cellsyntOriginatortype === 'alpha'" id="cellsynt-originator" v-model="$parent.notification.cellsyntOriginator" type="text" class="form-control" pattern="[a-zA-Z0-9\s]+" maxlength="11" required> + <input v-else id="cellsynt-originator" v-model="$parent.notification.cellsyntOriginator" type="number" class="form-control" pattern="[0-9]+" maxlength="15" required> + <div class="form-text"><p>{{ $t("Visible on recipient's mobile phone as originator of the message. Allowed values and function depends on parameter originatortype.") }}</p></div> + </div> + <div class="mb-3"> + <label for="cellsynt-destination" class="form-label">{{ $t("Destination") }}</label> + <input id="cellsynt-destination" v-model="$parent.notification.cellsyntDestination" type="text" class="form-control" required> + <div class="form-text"><p>{{ $t("Recipient's telephone number using international format with leading 00 followed by country code, e.g. 00447920110000 for the UK number 07920 110 000 (max 17 digits in total). Max 25000 comma separated recipients per HTTP request.") }}</p></div> + </div> + <div class="form-check form-switch"> + <input id="cellsynt-allow-long" v-model="$parent.notification.cellsyntAllowLongSMS" type="checkbox" class="form-check-input"> + <label for="cellsynt-allow-long" class="form-label">{{ $t("Allow Long SMS") }}</label> + <div class="form-text">{{ $t("Split long messages into up to 6 parts. 153 x 6 = 918 characters.") }}</div> + </div> + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://www.cellsynt.com/en/" target="_blank">https://www.cellsynt.com/en/</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput + }, + mounted() { + this.$parent.notification.cellsyntOriginatortype ||= "alpha"; + this.$parent.notification.cellsyntOriginator ||= "uptimekuma"; + } +}; +</script> diff --git a/src/components/notifications/ClickSendSMS.vue b/src/components/notifications/ClickSendSMS.vue new file mode 100644 index 0000000..dbaca04 --- /dev/null +++ b/src/components/notifications/ClickSendSMS.vue @@ -0,0 +1,37 @@ +<template> + <div class="mb-3"> + <label for="clicksendsms-login" class="form-label">{{ $t("API Username") }}</label> + <i18n-t tag="div" class="form-text" keypath="wayToGetClickSendSMSToken"> + <a href="http://dashboard.clicksend.com/account/subaccounts" target="_blank">{{ $t("here") }}</a> + </i18n-t> + <input id="clicksendsms-login" v-model="$parent.notification.clicksendsmsLogin" type="text" class="form-control" required> + <label for="clicksendsms-key" class="form-label">{{ $t("API Key") }}</label> + <HiddenInput id="clicksendsms-key" v-model="$parent.notification.clicksendsmsPassword" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <div class="form-text"> + {{ $t("checkPrice", [$t("clicksendsms")]) }} + <a href="https://www.clicksend.com/us/pricing" target="_blank">https://clicksend.com/us/pricing</a> + </div> + </div> + <div class="mb-3"> + <label for="clicksendsms-to-number" class="form-label">{{ $t("Recipient Number") }}</label> + <input id="clicksendsms-to-number" v-model="$parent.notification.clicksendsmsToNumber" type="text" minlength="8" maxlength="14" class="form-control" required> + </div> + <div class="mb-3"> + <label for="clicksendsms-sender-name" class="form-label">{{ $t("From Name/Number") }} - + <a href="https://help.clicksend.com/article/4kgj7krx00-what-is-a-sender-id-or-sender-number" target="_blank">{{ $t("Read more") }}</a> + </label> + <input id="clicksendsms-sender-name" v-model="$parent.notification.clicksendsmsSenderName" type="text" minlength="3" maxlength="11" class="form-control"> + <div class="form-text">{{ $t("Leave blank to use a shared sender number.") }}</div> + </div> +</template> +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/DingDing.vue b/src/components/notifications/DingDing.vue new file mode 100644 index 0000000..710677f --- /dev/null +++ b/src/components/notifications/DingDing.vue @@ -0,0 +1,37 @@ +<template> + <div class="mb-3"> + <label for="WebHookUrl" class="form-label">{{ $t("WebHookUrl") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="WebHookUrl" v-model="$parent.notification.webHookUrl" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="secretKey" class="form-label">{{ $t("SecretKey") }}<span style="color: red;"><sup>*</sup></span></label> + <HiddenInput id="secretKey" v-model="$parent.notification.secretKey" :required="true" autocomplete="new-password"></HiddenInput> + + <div class="form-text"> + <p>{{ $t("For safety, must use secret key") }}</p> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://developers.dingtalk.com/document/robots/custom-robot-access" target="_blank">https://developers.dingtalk.com/document/robots/custom-robot-access</a> <a href="https://open.dingtalk.com/document/robots/customize-robot-security-settings#title-7fs-kgs-36x" target="_blank">https://open.dingtalk.com/document/robots/customize-robot-security-settings#title-7fs-kgs-36x</a> + </i18n-t> + </div> + </div> + <div class="mb-3"> + <label for="mentioning" class="form-label">{{ $t("Mentioning") }}<span style="color: red;"><sup>*</sup></span></label> + <select id="mentioning" v-model="$parent.notification.mentioning" class="form-select" required> + <option value="nobody">{{ $t("Don't mention people") }}</option> + <option value="everyone">{{ $t("Mention group", { group: "@everyone" }) }}</option> + </select> + </div> +</template> + +<script lang="ts"> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { HiddenInput }, + mounted() { + if (typeof this.$parent.notification.mentioning === "undefined") { + this.$parent.notification.mentioning = "nobody"; + } + } +}; +</script> diff --git a/src/components/notifications/Discord.vue b/src/components/notifications/Discord.vue new file mode 100644 index 0000000..5d8334f --- /dev/null +++ b/src/components/notifications/Discord.vue @@ -0,0 +1,65 @@ +<template> + <div class="mb-3"> + <label for="discord-webhook-url" class="form-label">{{ $t("Discord Webhook URL") }}</label> + <input id="discord-webhook-url" v-model="$parent.notification.discordWebhookUrl" type="text" class="form-control" required autocomplete="false"> + <div class="form-text"> + {{ $t("wayToGetDiscordURL") }} + </div> + </div> + + <div class="mb-3"> + <label for="discord-username" class="form-label">{{ $t("Bot Display Name") }}</label> + <input id="discord-username" v-model="$parent.notification.discordUsername" type="text" class="form-control" autocomplete="false" :placeholder="$root.appName"> + </div> + + <div class="mb-3"> + <label for="discord-prefix-message" class="form-label">{{ $t("Prefix Custom Message") }}</label> + <input id="discord-prefix-message" v-model="$parent.notification.discordPrefixMessage" type="text" class="form-control" autocomplete="false" :placeholder="$t('Hello @everyone is...')"> + </div> + + <div class="mb-3"> + <label for="discord-message-type" class="form-label">{{ $t("Select message type") }}</label> + <select id="discord-message-type" v-model="$parent.notification.discordChannelType" class="form-select"> + <option value="channel">{{ $t("Send to channel") }}</option> + <option value="createNewForumPost">{{ $t("Create new forum post") }}</option> + <option value="postToThread">{{ $t("postToExistingThread") }}</option> + </select> + </div> + + <div v-if="$parent.notification.discordChannelType === 'createNewForumPost'"> + <div class="mb-3"> + <label for="discord-target" class="form-label"> + {{ $t("forumPostName") }} + </label> + <input id="discord-target" v-model="$parent.notification.postName" type="text" class="form-control" autocomplete="false"> + <div class="form-text"> + {{ $t("whatHappensAtForumPost", { option: $t("postToExistingThread") }) }} + </div> + </div> + </div> + <div v-if="$parent.notification.discordChannelType === 'postToThread'"> + <div class="mb-3"> + <label for="discord-target" class="form-label"> + {{ $t("threadForumPostID") }} + </label> + <input id="discord-target" v-model="$parent.notification.threadId" type="text" class="form-control" autocomplete="false" :placeholder="$t('e.g. {discordThreadID}', { discordThreadID: 1177566663751782411 })"> + <div class="form-text"> + <i18n-t keypath="wayToGetDiscordThreadId"> + <a + href="https://support.discord.com/hc/en-us/articles/206346498-Where-can-I-find-my-User-Server-Message-ID-" + target="_blank" + >{{ $t("here") }}</a> + </i18n-t> + </div> + </div> + </div> +</template> +<script> +export default { + mounted() { + if (!this.$parent.notification.discordChannelType) { + this.$parent.notification.discordChannelType = "channel"; + } + } +}; +</script> diff --git a/src/components/notifications/Feishu.vue b/src/components/notifications/Feishu.vue new file mode 100644 index 0000000..6e00a31 --- /dev/null +++ b/src/components/notifications/Feishu.vue @@ -0,0 +1,15 @@ +<template> + <div class="mb-3"> + <label for="Feishu-WebHookUrl" class="form-label">{{ $t("Feishu WebHookUrl") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="Feishu-WebHookUrl" v-model="$parent.notification.feishuWebHookUrl" type="text" class="form-control" required> + <div class="form-text"> + <p><span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}</p> + </div> + <i18n-t tag="div" keypath="wayToGetTeamsURL" class="form-text"> + <a + href="https://www.feishu.cn/hc/zh-CN/articles/360024984973" + target="_blank" + >{{ $t("here") }}</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/FlashDuty.vue b/src/components/notifications/FlashDuty.vue new file mode 100644 index 0000000..a66ada0 --- /dev/null +++ b/src/components/notifications/FlashDuty.vue @@ -0,0 +1,29 @@ +<template> + <div class="mb-3"> + <label for="flashduty-integration-url" class="form-label">Integration Key</label> + <HiddenInput id="flashduty-integration-url" v-model="$parent.notification.flashdutyIntegrationKey" autocomplete="false"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetFlashDutyKey" class="form-text"> + <a href="https://flashcat.cloud/product/flashduty?from=kuma" target="_blank">{{ $t("here") }}</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="flashduty-severity" class="form-label">{{ $t("FlashDuty Severity") }}</label> + <select id="flashduty-severity" v-model="$parent.notification.flashdutySeverity" class="form-select" :required="true"> + <option value="Info" selected>Info</option> + <option value="Warning" selected>Warning</option> + <option value="Critical">Critical</option> + </select> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + } +}; +</script> diff --git a/src/components/notifications/FreeMobile.vue b/src/components/notifications/FreeMobile.vue new file mode 100644 index 0000000..852d9ae --- /dev/null +++ b/src/components/notifications/FreeMobile.vue @@ -0,0 +1,12 @@ +<template> + <div class="mb-3"> + <label for="freemobileUser" class="form-label">{{ $t("Free Mobile User Identifier") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="freemobileUser" v-model="$parent.notification.freemobileUser" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="freemobilePass" class="form-label">{{ $t("Free Mobile API Key") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="freemobilePass" v-model="$parent.notification.freemobilePass" type="text" class="form-control" required> + </div> +</template> + diff --git a/src/components/notifications/GoAlert.vue b/src/components/notifications/GoAlert.vue new file mode 100644 index 0000000..185aaf2 --- /dev/null +++ b/src/components/notifications/GoAlert.vue @@ -0,0 +1,28 @@ +<template> + <div class="mb-3"> + <label for="goalert-base-url" class="form-label">{{ $t("Base URL") }}</label> + <input id="goalert-base-url" v-model="$parent.notification.goAlertBaseURL" type="text" class="form-control" required> + <i18n-t tag="div" keypath="goAlertInfo" class="form-text"> + <a href="https://goalert.me" target="_blank">https://goalert.me</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="goalert-token" class="form-label">{{ $t("Token") }}</label> + <HiddenInput id="goalert-token" v-model="$parent.notification.goAlertToken" autocomplete="new-password" :required="true"></HiddenInput> + + <div class="form-text"> + {{ $t("goAlertIntegrationKeyInfo") }} + </div> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/GoogleChat.vue b/src/components/notifications/GoogleChat.vue new file mode 100644 index 0000000..c19cae0 --- /dev/null +++ b/src/components/notifications/GoogleChat.vue @@ -0,0 +1,13 @@ +<template> + <div class="mb-3"> + <label for="google-chat-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="google-chat-webhook-url" v-model="$parent.notification.googleChatWebhookURL" type="text" class="form-control" required> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://developers.google.com/chat/how-tos/webhooks" target="_blank">https://developers.google.com/chat/how-tos/webhooks</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Gorush.vue b/src/components/notifications/Gorush.vue new file mode 100644 index 0000000..1507bcd --- /dev/null +++ b/src/components/notifications/Gorush.vue @@ -0,0 +1,47 @@ +<template> + <div class="mb-3"> + <label for="gorush-device-token" class="form-label">{{ $t("Device Token") }}</label><span style="color: red;"><sup>*</sup></span> + <input id="gorush-device-token" v-model="$parent.notification.gorushDeviceToken" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="gorush-server-url" class="form-label">{{ $t("Server URL") }}</label><span style="color: red;"><sup>*</sup></span> + <input id="gorush-server-url" v-model="$parent.notification.gorushServerURL" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="gorush-platform" class="form-label">{{ $t("Platform") }}</label><span style="color: red;"><sup>*</sup></span> + <select id="gorush-platform" v-model="$parent.notification.gorushPlatform" class="form-select"> + <option value="ios">iOS</option> + <option value="android">Android</option> + <option value="huawei">{{ $t("Huawei") }}</option> + </select> + </div> + + <div class="mb-3"> + <label for="gorush-title" class="form-label">{{ $t("Title") }}</label> + <input id="gorush-title" v-model="$parent.notification.gorushTitle" type="text" class="form-control"> + </div> + + <div class="mb-3"> + <label for="gorush-priority" class="form-label">{{ $t("Priority") }}</label> + <select id="gorush-priority" v-model="$parent.notification.gorushPriority" class="form-select"> + <option value="normal">{{ $t("Normal") }}</option> + <option value="high">{{ $t("High") }}</option> + </select> + </div> + + <div class="mb-3"> + <label for="gorush-retry" class="form-label">{{ $t("Retry") }}</label> + <input id="gorush-retry" v-model="$parent.notification.gorushRetry" type="number" class="form-control"> + </div> + + <div class="mb-3"> + <label for="gorush-topic" class="form-label">{{ $t("Topic") }}</label> + <input id="gorush-topic" v-model="$parent.notification.gorushTopic" type="text" class="form-control"> + </div> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + </div> +</template> diff --git a/src/components/notifications/Gotify.vue b/src/components/notifications/Gotify.vue new file mode 100644 index 0000000..d992e96 --- /dev/null +++ b/src/components/notifications/Gotify.vue @@ -0,0 +1,30 @@ +<template> + <div class="mb-3"> + <label for="gotify-application-token" class="form-label">{{ $t("Application Token") }}</label> + <HiddenInput id="gotify-application-token" v-model="$parent.notification.gotifyapplicationToken" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <label for="gotify-server-url" class="form-label">{{ $t("Server URL") }}</label> + <input id="gotify-server-url" v-model="$parent.notification.gotifyserverurl" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="gotify-priority" class="form-label">{{ $t("Priority") }}</label> + <input id="gotify-priority" v-model="$parent.notification.gotifyPriority" type="number" class="form-control" required min="0" max="10" step="1"> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + if (typeof this.$parent.notification.gotifyPriority === "undefined") { + this.$parent.notification.gotifyPriority = 8; + } + }, +}; +</script> diff --git a/src/components/notifications/GrafanaOncall.vue b/src/components/notifications/GrafanaOncall.vue new file mode 100644 index 0000000..a8d3c2b --- /dev/null +++ b/src/components/notifications/GrafanaOncall.vue @@ -0,0 +1,7 @@ +<template> + <div class="mb-3"> + <label for="GrafanaOncallURL" class="form-label">{{ $t("GrafanaOncallURL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="GrafanaOncallURL" v-model="$parent.notification.GrafanaOncallURL" type="text" class="form-control" required> + </div> +</template> + diff --git a/src/components/notifications/GtxMessaging.vue b/src/components/notifications/GtxMessaging.vue new file mode 100644 index 0000000..24118fe --- /dev/null +++ b/src/components/notifications/GtxMessaging.vue @@ -0,0 +1,49 @@ +<template> + <div class="mb-3"> + <label for="gtxmessaging-api-key" class="form-label">{{ $t("API Key") }}</label> + <HiddenInput id="gtxmessaging-api-key" v-model="$parent.notification.gtxMessagingApiKey" :required="true"></HiddenInput> + <div class="form-text"> + {{ $t("gtxMessagingApiKeyHint") }} + </div> + </div> + <div class="mb-3"> + <label for="gtxmessaging-from" class="form-label">{{ $t("From Phone Number / Transmission Path Originating Address (TPOA)") }}</label> + <input id="gtxmessaging-from" v-model="$parent.notification.gtxMessagingFrom" type="text" class="form-control" required> + <i18n-t tag="div" keypath="gtxMessagingFromHint" class="form-text"> + <template #e164> + <a href="https://wikipedia.org/wiki/E.164">E.164</a> + </template> + <template #e212> + <a href="https://wikipedia.org/wiki/E.212">E.212</a> + </template> + <template #e214> + <a href="https://wikipedia.org/wiki/E.214">E.214</a> + </template> + </i18n-t> + </div> + <div class="mb-3"> + <label for="gtxmessaging-to" class="form-label">{{ $t("To Phone Number") }}</label> + <input id="gtxmessaging-to" v-model="$parent.notification.gtxMessagingTo" type="text" pattern="^\+\d+$" class="form-control" required> + <i18n-t tag="div" keypath="gtxMessagingToHint" class="form-text"> + <template #e164> + <a href="https://wikipedia.org/wiki/E.164">E.164</a> + </template> + <template #e212> + <a href="https://wikipedia.org/wiki/E.212">E.212</a> + </template> + <template #e214> + <a href="https://wikipedia.org/wiki/E.214">E.214</a> + </template> + </i18n-t> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput + } +}; +</script> diff --git a/src/components/notifications/HeiiOnCall.vue b/src/components/notifications/HeiiOnCall.vue new file mode 100644 index 0000000..a61c1c3 --- /dev/null +++ b/src/components/notifications/HeiiOnCall.vue @@ -0,0 +1,34 @@ +<template> + <div class="mb-3"> + <label for="heiioncall-apikey" class="form-label">{{ $t("API Key") }}<span + style="color: red;" + ><sup>*</sup></span></label> + <HiddenInput + id="heiioncall-apikey" v-model="$parent.notification.heiiOnCallApiKey" required="true" + autocomplete="false" + ></HiddenInput> + </div> + <div class="mb-3"> + <label for="heiioncall-trigger-id" class="form-label">Trigger ID<span + style="color: red;" + ><sup>*</sup></span></label> + <HiddenInput + id="heiioncall-trigger-id" v-model="$parent.notification.heiiOnCallTriggerId" required="true" + autocomplete="false" + ></HiddenInput> + </div> + <i18n-t tag="p" keypath="wayToGetHeiiOnCallDetails" class="form-text mt-3"> + <template #documentation> + <a href="https://heiioncall.com/docs" target="_blank">{{ $t("documentationOf", ["Heii On-Call"]) }}</a> + </template> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/HomeAssistant.vue b/src/components/notifications/HomeAssistant.vue new file mode 100644 index 0000000..de36809 --- /dev/null +++ b/src/components/notifications/HomeAssistant.vue @@ -0,0 +1,40 @@ +<template> + <div class="mb-3"> + <label for="homeAssistantUrl" class="form-label">{{ $t("Home Assistant URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="homeAssistantUrl" v-model="$parent.notification.homeAssistantUrl" type="url" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="longLivedAccessToken" class="form-label">{{ $t("Long-Lived Access Token") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="longLivedAccessToken" v-model="$parent.notification.longLivedAccessToken" type="text" class="form-control" required> + + <div class="form-text"> + <p>{{ $t("Long-Lived Access Token can be created by clicking on your profile name (bottom left) and scrolling to the bottom then click Create Token. ") }}</p> + </div> + </div> + + <div class="mb-3"> + <label for="notificationService" class="form-label">{{ $t("Notification Service") }}</label> + <input id="notificationService" v-model="$parent.notification.notificationService" type="text" :placeholder="$t('default: notify all devices')" class="form-control"> + + <div class="form-text"> + <p>{{ $t('A list of Notification Services can be found in Home Assistant under "Developer Tools > Services" search for "notification" to find your device/phone name.') }}</p> + <p>{{ $t("Automations can optionally be triggered in Home Assistant:") }}</p> + <p> + {{ $t("Trigger type:") }} <code>Event</code><br /> + {{ $t("Event type:") }} <code>call_service</code><br /> + {{ $t("Event data:") }} + </p> + <pre>domain: notify +service: mobile_app_my_phone # change to your device name +service_data: + title: Uptime Kuma + data: + status: 0 # 0=down 1=up + # name: Optional Uptime Kuma Monitor Name to filter by</pre> + <p> + {{ $t("Then choose an action, for example switch the scene to where an RGB light is red.") }} + </p> + </div> + </div> +</template> diff --git a/src/components/notifications/Keep.vue b/src/components/notifications/Keep.vue new file mode 100644 index 0000000..f0c856e --- /dev/null +++ b/src/components/notifications/Keep.vue @@ -0,0 +1,42 @@ +<template> + <div class="mb-3"> + <label for="webhook-url" class="form-label">{{ $t("Host URL") }}</label> + <input + id="webhook-url" + v-model="$parent.notification.webhookURL" + type="url" + pattern="https?://.+" + class="form-control" + required + /> + <div class="form-text"> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://docs.keephq.dev/providers/documentation/uptimekuma-provider" target="_blank">https://docs.keephq.dev/providers/documentation/uptimekuma-provider</a> + </i18n-t> + </div> + </div> + + <div class="mb-3"> + <label for="webhook-apikey" class="form-label">{{ + $t("API Key") + }}</label> + <HiddenInput + id="webhook-apikey" + v-model="$parent.notification.webhookAPIKey" + :required="true" + ></HiddenInput> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + this.$parent.notification.webhookURL ||= ""; + }, +}; +</script> diff --git a/src/components/notifications/Kook.vue b/src/components/notifications/Kook.vue new file mode 100644 index 0000000..704878b --- /dev/null +++ b/src/components/notifications/Kook.vue @@ -0,0 +1,33 @@ +<template> + <div class="mb-3"> + <label for="kook-bot-token" class="form-label">{{ $t("Bot Token") }}</label> + <HiddenInput id="kook-bot-token" v-model="$parent.notification.kookBotToken" :required="true" autocomplete="new-password"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetKookBotToken" class="form-text"> + <a href="https://developer.kookapp.cn/bot" target="_blank">https://developer.kookapp.cn/bot</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="kook-guild-id" class="form-label">{{ $t("Guild ID") }}</label> + <input id="kook-guild-id" v-model="$parent.notification.kookGuildID" type="text" class="form-control" required> + + <div class="form-text"> + <p style="margin-top: 8px;"> + {{ $t("wayToGetKookGuildID") }} + </p> + </div> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://developer.kookapp.cn" target="_blank">https://developer.kookapp.cn</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + } +}; +</script> diff --git a/src/components/notifications/Line.vue b/src/components/notifications/Line.vue new file mode 100644 index 0000000..8ab6a04 --- /dev/null +++ b/src/components/notifications/Line.vue @@ -0,0 +1,29 @@ +<template> + <div class="mb-3"> + <label for="line-channel-access-token" class="form-label">{{ $t("Channel access token (Long-lived)") }}</label> + <HiddenInput id="line-channel-access-token" v-model="$parent.notification.lineChannelAccessToken" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <i18n-t tag="div" keypath="lineDevConsoleTo" class="form-text"> + <b>{{ $t("Messaging API") }}</b> + </i18n-t> + <div class="mb-3" style="margin-top: 12px;"> + <label for="line-user-id" class="form-label">{{ $t("Your User ID") }}</label> + <input id="line-user-id" v-model="$parent.notification.lineUserID" type="text" class="form-control" required> + </div> + <i18n-t tag="div" keypath="lineDevConsoleTo" class="form-text"> + <b>{{ $t("Basic Settings") }}</b> + </i18n-t> + <i18n-t tag="div" keypath="wayToGetLineChannelToken" class="form-text" style="margin-top: 8px;"> + <a href="https://developers.line.biz/console/" target="_blank">{{ $t("Line Developers Console") }}</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/LineNotify.vue b/src/components/notifications/LineNotify.vue new file mode 100644 index 0000000..0f6897f --- /dev/null +++ b/src/components/notifications/LineNotify.vue @@ -0,0 +1,9 @@ +<template> + <div class="mb-3"> + <label for="line-notify-access-token" class="form-label">{{ $t("Access Token") }}</label> + <input id="line-notify-access-token" v-model="$parent.notification.lineNotifyAccessToken" type="text" class="form-control" :required="true"> + </div> + <i18n-t tag="div" keypath="wayToGetLineNotifyToken" class="form-text" style="margin-top: 8px;"> + <a href="https://notify-bot.line.me/" target="_blank">https://notify-bot.line.me/</a> + </i18n-t> +</template> diff --git a/src/components/notifications/LunaSea.vue b/src/components/notifications/LunaSea.vue new file mode 100644 index 0000000..4c55b3c --- /dev/null +++ b/src/components/notifications/LunaSea.vue @@ -0,0 +1,33 @@ +<template> + <div class="mb-3"> + <label for="lunasea-notification-target" class="form-label">{{ $t("lunaseaTarget") }}<span style="color: red;"><sup>*</sup></span></label> + <div class="form-text"> + <p> + <select id="lunasea-notification-target" v-model="$parent.notification.lunaseaTarget" class="form-select" required> + <option value="device">{{ $t("lunaseaDeviceID") }}</option> + <option value="user">{{ $t("lunaseaUserID") }}</option> + </select> + </p> + </div> + <div v-if="$parent.notification.lunaseaTarget === 'device'"> + <label for="lunasea-device" class="form-label">{{ $t("lunaseaDeviceID") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="lunasea-device" v-model="$parent.notification.lunaseaDevice" type="text" class="form-control"> + </div> + <div v-if="$parent.notification.lunaseaTarget === 'user'"> + <label for="lunasea-device" class="form-label">{{ $t("lunaseaUserID") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="lunasea-device" v-model="$parent.notification.lunaseaUserID" type="text" class="form-control"> + </div> + </div> +</template> + +<script lang="ts"> + +export default { + mounted() { + if (typeof this.$parent.notification.lunaseaTarget === "undefined") { + this.$parent.notification.lunaseaTarget = "device"; + } + } +}; + +</script> diff --git a/src/components/notifications/Matrix.vue b/src/components/notifications/Matrix.vue new file mode 100644 index 0000000..a9fd634 --- /dev/null +++ b/src/components/notifications/Matrix.vue @@ -0,0 +1,34 @@ +<template> + <div class="mb-3"> + <label for="homeserver-url" class="form-label">{{ $t("matrixHomeserverURL") }}</label><span style="color: red;"><sup>*</sup></span> + <input id="homeserver-url" v-model="$parent.notification.homeserverUrl" type="text" class="form-control" :required="true"> + </div> + <div class="mb-3"> + <label for="internal-room-id" class="form-label">{{ $t("Internal Room Id") }}</label><span style="color: red;"><sup>*</sup></span> + <input id="internal-room-id" v-model="$parent.notification.internalRoomId" type="text" class="form-control" required="true"> + </div> + <div class="mb-3"> + <label for="access-token" class="form-label">{{ $t("Access Token") }}</label><span style="color: red;"><sup>*</sup></span> + <HiddenInput id="access-token" v-model="$parent.notification.accessToken" :required="true" autocomplete="new-password" :maxlength="500"></HiddenInput> + </div> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <p style="margin-top: 8px;"> + {{ $t("matrixDesc1") }} + </p> + <i18n-t tag="p" keypath="matrixDesc2" style="margin-top: 8px;"> + <code>curl -XPOST -d '{"type": "m.login.password", "identifier": {"user": "botusername", "type": "m.id.user"}, "password": "passwordforuser"}' "https://home.server/_matrix/client/r0/login"</code>. + </i18n-t> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Mattermost.vue b/src/components/notifications/Mattermost.vue new file mode 100644 index 0000000..1fa094f --- /dev/null +++ b/src/components/notifications/Mattermost.vue @@ -0,0 +1,32 @@ +<template> + <div class="mb-3"> + <label for="mattermost-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="mattermost-webhook-url" v-model="$parent.notification.mattermostWebhookUrl" type="text" class="form-control" required> + <label for="mattermost-username" class="form-label">{{ $t("Username") }}</label> + <input id="mattermost-username" v-model="$parent.notification.mattermostusername" type="text" class="form-control"> + <label for="mattermost-iconurl" class="form-label">{{ $t("Icon URL") }}</label> + <input id="mattermost-iconurl" v-model="$parent.notification.mattermosticonurl" type="text" class="form-control"> + <label for="mattermost-iconemo" class="form-label">{{ $t("Icon Emoji") }}</label> + <input id="mattermost-iconemo" v-model="$parent.notification.mattermosticonemo" type="text" class="form-control"> + <label for="mattermost-channel" class="form-label">{{ $t("Channel Name") }}</label> + <input id="mattermost-channel-name" v-model="$parent.notification.mattermostchannel" type="text" class="form-control"> + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://developers.mattermost.com/integrate/webhooks/incoming/" target="_blank">https://developers.mattermost.com/integrate/webhooks/incoming/</a> + </i18n-t> + <p style="margin-top: 8px;"> + {{ $t("aboutMattermostChannelName") }} + </p> + <p style="margin-top: 8px;"> + {{ $t("aboutKumaURL") }} + </p> + <p style="margin-top: 8px;"> + {{ $t("aboutIconURL") }} + </p> + <i18n-t tag="p" keypath="emojiCheatSheet" style="margin-top: 8px;"> + <a href="https://www.webfx.com/tools/emoji-cheat-sheet/" target="_blank">https://www.webfx.com/tools/emoji-cheat-sheet/</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Nostr.vue b/src/components/notifications/Nostr.vue new file mode 100644 index 0000000..83f84b0 --- /dev/null +++ b/src/components/notifications/Nostr.vue @@ -0,0 +1,26 @@ +<template> + <div class="mb-3"> + <label for="nostr-relays" class="form-label">{{ $t("nostrRelays") }}<span style="color: red;"><sup>*</sup></span></label> + <textarea id="nostr-relays" v-model="$parent.notification.relays" class="form-control" :required="true" placeholder="wss://127.0.0.1:7777/"></textarea> + <small class="form-text text-muted">{{ $t("nostrRelaysHelp") }}</small> + </div> + <div class="mb-3"> + <label for="nostr-sender" class="form-label">{{ $t("nostrSender") }}<span style="color: red;"><sup>*</sup></span></label> + <HiddenInput id="nostr-sender" v-model="$parent.notification.sender" autocomplete="new-password" :required="true"></HiddenInput> + </div> + <div class="mb-3"> + <label for="nostr-recipients" class="form-label">{{ $t("nostrRecipients") }}<span style="color: red;"><sup>*</sup></span></label> + <textarea id="nostr-recipients" v-model="$parent.notification.recipients" class="form-control" :required="true" placeholder="npub123... npub789..."></textarea> + <small class="form-text text-muted">{{ $t("nostrRecipientsHelp") }}</small> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Ntfy.vue b/src/components/notifications/Ntfy.vue new file mode 100644 index 0000000..ba94451 --- /dev/null +++ b/src/components/notifications/Ntfy.vue @@ -0,0 +1,82 @@ +<template> + <div class="mb-3"> + <label for="ntfy-ntfytopic" class="form-label">{{ $t("ntfy Topic") }}</label> + <input id="ntfy-ntfytopic" v-model="$parent.notification.ntfytopic" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="ntfy-server-url" class="form-label">{{ $t("Server URL") }}</label> + <input id="ntfy-server-url" v-model="$parent.notification.ntfyserverurl" type="text" class="form-control" required> + <div class="form-text"> + {{ $t("Server URL should not contain the nfty topic") }} + </div> + </div> + <div class="mb-3"> + <label for="ntfy-priority" class="form-label">{{ $t("Priority") }}</label> + <input id="ntfy-priority" v-model="$parent.notification.ntfyPriority" type="number" class="form-control" required min="1" max="5" step="1"> + <div class="form-text"> + <p v-if="$parent.notification.ntfyPriority >= 5"> + {{ $t("ntfyPriorityHelptextAllEvents") }} + </p> + <i18n-t v-else tag="p" keypath="ntfyPriorityHelptextAllExceptDown"> + <code>DOWN</code> + <code>{{ $parent.notification.ntfyPriority + 1 }}</code> + </i18n-t> + </div> + </div> + <div class="mb-3"> + <label for="authentication-method" class="form-label">{{ $t("ntfyAuthenticationMethod") }}</label> + <select id="authentication-method" v-model="$parent.notification.ntfyAuthenticationMethod" class="form-select"> + <option v-for="(name, type) in authenticationMethods" :key="type" :value="type">{{ name }}</option> + </select> + </div> + <div v-if="$parent.notification.ntfyAuthenticationMethod === 'usernamePassword'" class="mb-3"> + <label for="ntfy-username" class="form-label">{{ $t("Username") }}</label> + <input id="ntfy-username" v-model="$parent.notification.ntfyusername" type="text" class="form-control"> + </div> + <div v-if="$parent.notification.ntfyAuthenticationMethod === 'usernamePassword'" class="mb-3"> + <label for="ntfy-password" class="form-label">{{ $t("Password") }}</label> + <HiddenInput id="ntfy-password" v-model="$parent.notification.ntfypassword" autocomplete="new-password"></HiddenInput> + </div> + <div v-if="$parent.notification.ntfyAuthenticationMethod === 'accessToken'" class="mb-3"> + <label for="ntfy-access-token" class="form-label">{{ $t("Access Token") }}</label> + <HiddenInput id="ntfy-access-token" v-model="$parent.notification.ntfyaccesstoken"></HiddenInput> + </div> + <div class="mb-3"> + <label for="ntfy-icon" class="form-label">{{ $t("IconUrl") }}</label> + <input id="ntfy-icon" v-model="$parent.notification.ntfyIcon" type="text" class="form-control"> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + computed: { + authenticationMethods() { + return { + none: this.$t("None"), + usernamePassword: this.$t("ntfyUsernameAndPassword"), + accessToken: this.$t("Access Token") + }; + } + }, + mounted() { + if (typeof this.$parent.notification.ntfyPriority === "undefined") { + this.$parent.notification.ntfyserverurl = "https://ntfy.sh"; + this.$parent.notification.ntfyPriority = 5; + } + + // Handling notifications that added before 1.22.0 + if (typeof this.$parent.notification.ntfyAuthenticationMethod === "undefined") { + if (!this.$parent.notification.ntfyusername) { + this.$parent.notification.ntfyAuthenticationMethod = "none"; + } else { + this.$parent.notification.ntfyAuthenticationMethod = "usernamePassword"; + } + } + }, +}; +</script> diff --git a/src/components/notifications/Octopush.vue b/src/components/notifications/Octopush.vue new file mode 100644 index 0000000..15cebe8 --- /dev/null +++ b/src/components/notifications/Octopush.vue @@ -0,0 +1,50 @@ +<template> + <div class="mb-3"> + <label for="octopush-version" class="form-label">{{ $t("Octopush API Version") }}</label> + <select id="octopush-version" v-model="$parent.notification.octopushVersion" class="form-select"> + <option value="2">{{ $t("octopush") }} ({{ $t("endpoint") }}: api.octopush.com)</option> + <option value="1">{{ $t("Legacy Octopush-DM") }} ({{ $t("endpoint") }}: www.octopush-dm.com)</option> + </select> + <div class="form-text"> + {{ $t("octopushLegacyHint") }} + </div> + </div> + <div class="mb-3"> + <label for="octopush-key" class="form-label">{{ $t("octopushAPIKey") }}</label> + <HiddenInput id="octopush-key" v-model="$parent.notification.octopushAPIKey" :required="true" autocomplete="new-password"></HiddenInput> + <label for="octopush-login" class="form-label">{{ $t("octopushLogin") }}</label> + <input id="octopush-login" v-model="$parent.notification.octopushLogin" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="octopush-type-sms" class="form-label">{{ $t("SMS Type") }}</label> + <select id="octopush-type-sms" v-model="$parent.notification.octopushSMSType" class="form-select"> + <option value="sms_premium">{{ $t("octopushTypePremium") }}</option> + <option value="sms_low_cost">{{ $t("octopushTypeLowCost") }}</option> + </select> + <i18n-t tag="div" keypath="Check octopush prices" class="form-text"> + <a href="https://octopush.com/tarifs-sms-international/" target="_blank">https://octopush.com/tarifs-sms-international/</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="octopush-phone-number" class="form-label">{{ $t("octopushPhoneNumber") }}</label> + <input id="octopush-phone-number" v-model="$parent.notification.octopushPhoneNumber" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="octopush-sender-name" class="form-label">{{ $t("octopushSMSSender") }}</label> + <input id="octopush-sender-name" v-model="$parent.notification.octopushSenderName" type="text" minlength="3" maxlength="11" class="form-control"> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://octopush.com/api-sms-documentation/envoi-de-sms/" target="_blank">https://octopush.com/api-sms-documentation/envoi-de-sms/</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/OneBot.vue b/src/components/notifications/OneBot.vue new file mode 100644 index 0000000..63604d6 --- /dev/null +++ b/src/components/notifications/OneBot.vue @@ -0,0 +1,34 @@ +<template> + <div class="mb-3"> + <div class="mb-3"> + <label for="onebot-http-addr" class="form-label">{{ $t("onebotHttpAddress") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="HttpUrl" v-model="$parent.notification.httpAddr" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="onebot-access-token" class="form-label">AccessToken<span style="color: red;"><sup>*</sup></span></label> + <input id="HttpUrl" v-model="$parent.notification.accessToken" type="text" class="form-control" required> + <div class="form-text"> + <p>{{ $t("onebotSafetyTips") }}</p> + </div> + </div> + + <div class="mb-3"> + <label for="onebot-msg-type" class="form-label">{{ $t("onebotMessageType") }}</label> + <select id="onebot-msg-type" v-model="$parent.notification.msgType" class="form-select"> + <option value="group">{{ $t("onebotGroupMessage") }}</option> + <option value="private">{{ $t("onebotPrivateMessage") }}</option> + </select> + </div> + + <div class="mb-3"> + <label for="onebot-reciever-id" class="form-label">{{ $t("onebotUserOrGroupId") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="secretKey" v-model="$parent.notification.recieverId" type="text" class="form-control" required> + </div> + + <div class="form-text"> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://github.com/botuniverse/onebot-11" target="_blank">https://github.com/botuniverse/onebot-11</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Onesender.vue b/src/components/notifications/Onesender.vue new file mode 100644 index 0000000..81dbe7f --- /dev/null +++ b/src/components/notifications/Onesender.vue @@ -0,0 +1,81 @@ +<template> + <div class="mb-3"> + <label for="host-onesender" class="form-label">{{ $t("Host Onesender") }}</label> + <input + id="host-onesender" + v-model="$parent.notification.onesenderURL" + type="url" + placeholder="https://xxxxxxxxxxx.com/api/v1/messages" + pattern="https?://.+" + class="form-control" + required + /> + </div> + + <div class="mb-3"> + <label for="receiver-onesender" class="form-label">{{ $t("Token Onesender") }}</label> + <HiddenInput id="receiver-onesender" v-model="$parent.notification.onesenderToken" :required="true" autocomplete="false"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetOnesenderUrlandToken" class="form-text"> + <a href="https://onesender.net/" target="_blank">{{ $t("here") }}</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="webhook-request-body" class="form-label">{{ $t("Recipient Type") }}</label> + <select + id="webhook-request-body" + v-model="$parent.notification.onesenderTypeReceiver" + class="form-select" + required + > + <option value="private">{{ $t("Private Number") }}</option> + <option value="group">{{ $t("Group ID") }}</option> + </select> + </div> + <div v-if="$parent.notification.onesenderTypeReceiver == 'private'" class="form-text">{{ $t("privateOnesenderDesc", ['"application/json"']) }}</div> + <div v-else class="form-text">{{ $t("groupOnesenderDesc") }}</div> + <div class="mb-3"> + <input + id="type-receiver-onesender" + v-model="$parent.notification.onesenderReceiver" + type="text" + placeholder="628123456789 or 628123456789-34534" + class="form-control" + required + /> + </div> + <div class="mb-3"> + <input + id="type-receiver-onesender" + v-model="computedReceiverResult" + type="text" + class="form-control" + disabled + /> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + data() { + return {}; + }, + computed: { + computedReceiverResult() { + let receiver = this.$parent.notification.onesenderReceiver; + return this.$parent.notification.onesenderTypeReceiver === "private" ? receiver + "@s.whatsapp.net" : receiver + "@g.us"; + }, + }, +}; +</script> + +<style lang="scss" scoped> +textarea { + min-height: 200px; +} +</style> diff --git a/src/components/notifications/Opsgenie.vue b/src/components/notifications/Opsgenie.vue new file mode 100644 index 0000000..3f07d05 --- /dev/null +++ b/src/components/notifications/Opsgenie.vue @@ -0,0 +1,36 @@ +<template> + <div class="mb-3"> + <label for="opsgenie-region" class="form-label">{{ $t("Region") }}<span style="color: red;"><sup>*</sup></span></label> + <select id="opsgenie-region" v-model="$parent.notification.opsgenieRegion" class="form-select" required> + <option value="us"> + US (Default) + </option> + <option value="eu"> + EU + </option> + </select> + </div> + <div class="mb-3"> + <label for="opsgenie-apikey" class="form-label">{{ $t("API Key") }}<span style="color: red;"><sup>*</sup></span></label> + <HiddenInput id="opsgenie-apikey" v-model="$parent.notification.opsgenieApiKey" required="true" autocomplete="false"></HiddenInput> + </div> + <div class="mb-3"> + <label for="opsgenie-priority" class="form-label">{{ $t("Priority") }}</label> + <input id="opsgenie-priority" v-model="$parent.notification.opsgeniePriority" type="number" class="form-control" min="1" max="5" step="1"> + </div> + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://docs.opsgenie.com/docs/alert-api" target="_blank">https://docs.opsgenie.com/docs/alert-api</a> + </i18n-t> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/PagerDuty.vue b/src/components/notifications/PagerDuty.vue new file mode 100644 index 0000000..059a9ae --- /dev/null +++ b/src/components/notifications/PagerDuty.vue @@ -0,0 +1,45 @@ +<template> + <div class="mb-3"> + <label for="pagerduty-integration-key" class="form-label">{{ $t("Integration Key") }}</label> + <HiddenInput id="pagerduty-integration-key" v-model="$parent.notification.pagerdutyIntegrationKey" :required="true" autocomplete="false"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetPagerDutyKey" class="form-text"> + <a href="https://support.pagerduty.com/docs/services-and-integrations" target="_blank">{{ $t("here") }}</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="pagerduty-integration-url" class="form-label">{{ $t("Integration URL") }}</label> + <input id="pagerduty-integration-url" v-model="$parent.notification.pagerdutyIntegrationUrl" type="text" class="form-control" autocomplete="false"> + </div> + <div class="mb-3"> + <label for="pagerduty-priority" class="form-label">{{ $t("Priority") }}</label> + <select id="pagerduty-priority" v-model="$parent.notification.pagerdutyPriority" class="form-select"> + <option value="info">{{ $t("info") }}</option> + <option value="warning" selected="selected">{{ $t("warning") }}</option> + <option value="error">{{ $t("error") }}</option> + <option value="critical">{{ $t("critical") }}</option> + </select> + </div> + <div class="mb-3"> + <label for="pagerduty-resolve" class="form-label">{{ $t("Auto resolve or acknowledged") }}</label> + <select id="pagerduty-resolve" v-model="$parent.notification.pagerdutyAutoResolve" class="form-select"> + <option value="0" selected="selected">{{ $t("do nothing") }}</option> + <option value="acknowledge">{{ $t("auto acknowledged") }}</option> + <option value="resolve">{{ $t("auto resolve") }}</option> + </select> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + if (typeof this.$parent.notification.pagerdutyIntegrationUrl === "undefined") { + this.$parent.notification.pagerdutyIntegrationUrl = "https://events.pagerduty.com/v2/enqueue"; + } + } +}; +</script> diff --git a/src/components/notifications/PagerTree.vue b/src/components/notifications/PagerTree.vue new file mode 100644 index 0000000..0121f65 --- /dev/null +++ b/src/components/notifications/PagerTree.vue @@ -0,0 +1,31 @@ +<template> + <div class="mb-3"> + <label for="pagertree-integration-url" class="form-label">{{ $t("pagertreeIntegrationUrl") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="pagertree-integration-url" v-model="$parent.notification.pagertreeIntegrationUrl" type="text" class="form-control" autocomplete="false"> + <i18n-t tag="div" keypath="wayToGetPagerTreeIntegrationURL" class="form-text"> + <a href="https://pagertree.com/docs/integration-guides/introduction#copy-the-endpoint-url" target="_blank">{{ $t("here") }}</a> + </i18n-t> + </div> + <div class="mb-3"> + <label for="pagertree-urgency" class="form-label">{{ $t("pagertreeUrgency") }}</label> + <select id="pagertree-urgency" v-model="$parent.notification.pagertreeUrgency" class="form-select"> + <option value="silent">{{ $t("pagertreeSilent") }}</option> + <option value="low">{{ $t("pagertreeLow") }}</option> + <option value="medium" selected="selected">{{ $t("pagertreeMedium") }}</option> + <option value="high">{{ $t("pagertreeHigh") }}</option> + <option value="critical">{{ $t("pagertreeCritical") }}</option> + </select> + </div> + <div class="mb-3"> + <label for="pagertree-resolve" class="form-label">{{ $t("pagertreeResolve") }}</label> + <select id="pagertree-resolve" v-model="$parent.notification.pagertreeAutoResolve" class="form-select"> + <option value="resolve" selected="selected">{{ $t("pagertreeResolve") }}</option> + <option value="0">{{ $t("pagertreeDoNothing") }}</option> + </select> + </div> +</template> + +<script> +export default { +}; +</script> diff --git a/src/components/notifications/PromoSMS.vue b/src/components/notifications/PromoSMS.vue new file mode 100644 index 0000000..15ed241 --- /dev/null +++ b/src/components/notifications/PromoSMS.vue @@ -0,0 +1,43 @@ +<template> + <div class="mb-3"> + <label for="promosms-login" class="form-label">{{ $t("promosmsLogin") }}</label> + <input id="promosms-login" v-model="$parent.notification.promosmsLogin" type="text" class="form-control" required> + <label for="promosms-key" class="form-label">{{ $t("promosmsPassword") }}</label> + <HiddenInput id="promosms-key" v-model="$parent.notification.promosmsPassword" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <label for="promosms-type-sms" class="form-label">{{ $t("SMS Type") }}</label> + <select id="promosms-type-sms" v-model="$parent.notification.promosmsSMSType" class="form-select"> + <option value="0">{{ $t("promosmsTypeFlash") }}</option> + <option value="1">{{ $t("promosmsTypeEco") }}</option> + <option value="3">{{ $t("promosmsTypeFull") }}</option> + <option value="4">{{ $t("promosmsTypeSpeed") }}</option> + </select> + <div class="form-text"> + {{ $t("checkPrice", [$t("promosms")]) }} + <a href="https://promosms.com/cennik/" target="_blank">https://promosms.com/cennik/</a> + </div> + </div> + <div class="mb-3"> + <label for="promosms-phone-number" class="form-label">{{ $t("promosmsPhoneNumber") }}</label> + <input id="promosms-phone-number" v-model="$parent.notification.promosmsPhoneNumber" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="promosms-sender-name" class="form-label">{{ $t("promosmsSMSSender") }}</label> + <input id="promosms-sender-name" v-model="$parent.notification.promosmsSenderName" type="text" minlength="3" maxlength="11" class="form-control"> + </div> + <div class="form-check form-switch"> + <input id="promosms-allow-long" v-model="$parent.notification.promosmsAllowLongSMS" type="checkbox" class="form-check-input"> + <label for="promosms-allow-long" class="form-label">{{ $t("promosmsAllowLongSMS") }}</label> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/PushDeer.vue b/src/components/notifications/PushDeer.vue new file mode 100644 index 0000000..4fff3be --- /dev/null +++ b/src/components/notifications/PushDeer.vue @@ -0,0 +1,24 @@ +<template> + <div class="mb-3"> + <label for="pushdeer-server" class="form-label">{{ $t("PushDeer Server URL") }}</label> + <input id="pushdeer-server" v-model="$parent.notification.pushdeerServer" type="text" class="form-control" placeholder="https://api2.pushdeer.com"> + <div class="form-text">{{ $t("pushDeerServerDescription") }}</div> + </div> + <div class="mb-3"> + <label for="pushdeer-key" class="form-label">{{ $t("PushDeer Key") }}</label> + <HiddenInput id="pushdeer-key" v-model="$parent.notification.pushdeerKey" :required="true" autocomplete="new-password" placeholder="PDUxxxx"></HiddenInput> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="http://www.pushdeer.com/" rel="noopener noreferrer" target="_blank">http://www.pushdeer.com/</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Pushbullet.vue b/src/components/notifications/Pushbullet.vue new file mode 100644 index 0000000..866576a --- /dev/null +++ b/src/components/notifications/Pushbullet.vue @@ -0,0 +1,20 @@ +<template> + <div class="mb-3"> + <label for="pushbullet-access-token" class="form-label">{{ $t("Access Token") }}</label> + <HiddenInput id="pushbullet-access-token" v-model="$parent.notification.pushbulletAccessToken" :required="true" autocomplete="new-password"></HiddenInput> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://docs.pushbullet.com" target="_blank">https://docs.pushbullet.com</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Pushover.vue b/src/components/notifications/Pushover.vue new file mode 100644 index 0000000..7ee0eaf --- /dev/null +++ b/src/components/notifications/Pushover.vue @@ -0,0 +1,70 @@ +<template> + <div class="mb-3"> + <label for="pushover-user" class="form-label">{{ $t("User Key") }}<span style="color: red;"><sup>*</sup></span></label> + <HiddenInput id="pushover-user" v-model="$parent.notification.pushoveruserkey" :required="true" autocomplete="new-password"></HiddenInput> + <label for="pushover-app-token" class="form-label">{{ $t("Application Token") }}<span style="color: red;"><sup>*</sup></span></label> + <HiddenInput id="pushover-app-token" v-model="$parent.notification.pushoverapptoken" :required="true" autocomplete="new-password"></HiddenInput> + <label for="pushover-device" class="form-label">{{ $t("Device") }}</label> + <input id="pushover-device" v-model="$parent.notification.pushoverdevice" type="text" class="form-control"> + <label for="pushover-device" class="form-label">{{ $t("Message Title") }}</label> + <input id="pushover-title" v-model="$parent.notification.pushovertitle" type="text" class="form-control"> + <label for="pushover-priority" class="form-label">{{ $t("Priority") }}</label> + <select id="pushover-priority" v-model="$parent.notification.pushoverpriority" class="form-select"> + <option>-2</option> + <option>-1</option> + <option>0</option> + <option>1</option> + <option>2</option> + </select> + <label for="pushover-sound" class="form-label">{{ $t("Notification Sound") }}</label> + <select id="pushover-sound" v-model="$parent.notification.pushoversounds" class="form-select"> + <option value="pushover">{{ $t("pushoversounds pushover") }}</option> + <option value="bike">{{ $t("pushoversounds bike") }}</option> + <option value="bugle">{{ $t("pushoversounds bugle") }}</option> + <option value="cashregister">{{ $t("pushoversounds cashregister") }}</option> + <option value="classical">{{ $t("pushoversounds classical") }}</option> + <option value="cosmic">{{ $t("pushoversounds cosmic") }}</option> + <option value="falling">{{ $t("pushoversounds falling") }}</option> + <option value="gamelan">{{ $t("pushoversounds gamelan") }}</option> + <option value="incoming">{{ $t("pushoversounds incoming") }}</option> + <option value="intermission">{{ $t("pushoversounds intermission") }}</option> + <option value="magic">{{ $t("pushoversounds magic") }}</option> + <option value="mechanical">{{ $t("pushoversounds mechanical") }}</option> + <option value="pianobar">{{ $t("pushoversounds pianobar") }}</option> + <option value="siren">{{ $t("pushoversounds siren") }}</option> + <option value="spacealarm">{{ $t("pushoversounds spacealarm") }}</option> + <option value="tugboat">{{ $t("pushoversounds tugboat") }}</option> + <option value="alien">{{ $t("pushoversounds alien") }}</option> + <option value="climb">{{ $t("pushoversounds climb") }}</option> + <option value="persistent">{{ $t("pushoversounds persistent") }}</option> + <option value="echo">{{ $t("pushoversounds echo") }}</option> + <option value="updown">{{ $t("pushoversounds updown") }}</option> + <option value="vibrate">{{ $t("pushoversounds vibrate") }}</option> + <option value="none">{{ $t("pushoversounds none") }}</option> + </select> + <label for="pushover-ttl" class="form-label">{{ $t("pushoverMessageTtl") }}</label> + <input id="pushover-ttl" v-model="$parent.notification.pushoverttl" type="number" min="0" step="1" class="form-control"> + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://pushover.net/api" target="_blank">https://pushover.net/api</a> + </i18n-t> + <p style="margin-top: 8px;"> + {{ $t("pushoverDesc1") }} + </p> + <p style="margin-top: 8px;"> + {{ $t("pushoverDesc2") }} + </p> + </div> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Pushy.vue b/src/components/notifications/Pushy.vue new file mode 100644 index 0000000..454f2e2 --- /dev/null +++ b/src/components/notifications/Pushy.vue @@ -0,0 +1,24 @@ +<template> + <div class="mb-3"> + <label for="pushy-app-token" class="form-label">{{ $t("pushyAPIKey") }}</label> + <HiddenInput id="pushy-app-token" v-model="$parent.notification.pushyAPIKey" :required="true" autocomplete="new-password"></HiddenInput> + </div> + + <div class="mb-3"> + <label for="pushy-user-key" class="form-label">{{ $t("pushyToken") }}</label> + <HiddenInput id="pushy-user-key" v-model="$parent.notification.pushyToken" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://pushy.me/docs/api/send-notifications" target="_blank">https://pushy.me/docs/api/send-notifications</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/RocketChat.vue b/src/components/notifications/RocketChat.vue new file mode 100644 index 0000000..7846606 --- /dev/null +++ b/src/components/notifications/RocketChat.vue @@ -0,0 +1,27 @@ +<template> + <div class="mb-3"> + <label for="rocket-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="rocket-webhook-url" v-model="$parent.notification.rocketwebhookURL" type="text" class="form-control" required> + <label for="rocket-username" class="form-label">{{ $t("Username") }}</label> + <input id="rocket-username" v-model="$parent.notification.rocketusername" type="text" class="form-control"> + <label for="rocket-iconemo" class="form-label">{{ $t("Icon Emoji") }}</label> + <input id="rocket-iconemo" v-model="$parent.notification.rocketiconemo" type="text" class="form-control"> + <label for="rocket-channel" class="form-label">{{ $t("Channel Name") }}</label> + <input id="rocket-channel-name" v-model="$parent.notification.rocketchannel" type="text" class="form-control"> + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://docs.rocket.chat/guides/administration/administration/integrations" target="_blank">https://docs.rocket.chat/guides/administration/administration/integrations</a> + </i18n-t> + <p style="margin-top: 8px;"> + {{ $t("aboutChannelName", [$t("rocket.chat")]) }} + </p> + <p style="margin-top: 8px;"> + {{ $t("aboutKumaURL") }} + </p> + <i18n-t tag="p" keypath="emojiCheatSheet" style="margin-top: 8px;"> + <a href="https://www.webfx.com/tools/emoji-cheat-sheet/" target="_blank">https://www.webfx.com/tools/emoji-cheat-sheet/</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/SIGNL4.vue b/src/components/notifications/SIGNL4.vue new file mode 100644 index 0000000..d557c2d --- /dev/null +++ b/src/components/notifications/SIGNL4.vue @@ -0,0 +1,16 @@ +<template> + <div class="mb-3"> + <label for="signl4-webhook-url" class="form-label">{{ $t("SIGNL4 Webhook URL") }}</label> + <input + id="signl4-webhook-url" + v-model="$parent.notification.webhookURL" + type="url" + pattern="https?://.+" + class="form-control" + required + /> + <i18n-t tag="div" keypath="signl4Docs" class="form-text"> + <a href="https://docs.signl4.com/integrations/uptime-kuma/uptime-kuma.html" target="_blank">SIGNL4 Docs</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/SMSC.vue b/src/components/notifications/SMSC.vue new file mode 100644 index 0000000..36a0a89 --- /dev/null +++ b/src/components/notifications/SMSC.vue @@ -0,0 +1,43 @@ +<template> + <div class="mb-3"> + <label for="smsc-login" class="form-label">{{ $t("API Username") }}</label> + <i18n-t tag="div" class="form-text" keypath="wayToGetClickSendSMSToken"> + <a href="https://smsc.kz/" target="_blank">{{ $t("here") }}</a> + </i18n-t> + <input id="smsc-login" v-model="$parent.notification.smscLogin" type="text" class="form-control" required> + <label for="smsc-key" class="form-label">{{ $t("API Key") }}</label> + <HiddenInput id="smsc-key" v-model="$parent.notification.smscPassword" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <div class="form-text"> + {{ $t("checkPrice", ['СМСЦ']) }} + <a href="https://smsc.kz/tariffs/" target="_blank">https://smsc.kz/tariffs/</a> + </div> + </div> + <div class="mb-3"> + <label for="smsc-to-number" class="form-label">{{ $t("Recipient Number") }}</label> + <input id="smsc-to-number" v-model="$parent.notification.smscToNumber" type="text" minlength="11" class="form-control" required> + </div> + <div class="mb-3"> + <label for="smsc-sender-name" class="form-label">{{ $t("From Name/Number") }}</label> + <input id="smsc-sender-name" v-model="$parent.notification.smscSenderName" type="text" minlength="1" maxlength="15" class="form-control"> + <div class="form-text">{{ $t("Leave blank to use a shared sender number.") }}</div> + </div> + <div class="mb-3"> + <label for="smsc-platform" class="form-label">{{ $t("smscTranslit") }}</label><span style="color: red;"><sup>*</sup></span> + <select id="smsc-platform" v-model="$parent.notification.smscTranslit" class="form-select"> + <option value="0">{{ $t("Default") }}</option> + <option value="1">Translit</option> + <option value="2">MpaHc/Ium</option> + </select> + </div> +</template> +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/SMSEagle.vue b/src/components/notifications/SMSEagle.vue new file mode 100644 index 0000000..ec78131 --- /dev/null +++ b/src/components/notifications/SMSEagle.vue @@ -0,0 +1,40 @@ +<template> + <div class="mb-3"> + <label for="smseagle-url" class="form-label">{{ $t("smseagleUrl") }}</label> + <input id="smseagle-url" v-model="$parent.notification.smseagleUrl" type="text" minlength="7" class="form-control" placeholder="http://127.0.0.1" required> + </div> + <div class="mb-3"> + <label for="smseagle-token" class="form-label">{{ $t("smseagleToken") }}</label> + <HiddenInput id="smseagle-token" v-model="$parent.notification.smseagleToken" :required="true"></HiddenInput> + </div> + <div class="mb-3"> + <label for="smseagle-recipient-type" class="form-label">{{ $t("smseagleRecipientType") }}</label> + <select id="smseagle-recipient-type" v-model="$parent.notification.smseagleRecipientType" class="form-select"> + <option value="smseagle-to" selected>{{ $t("smseagleTo") }}</option> + <option value="smseagle-group">{{ $t("smseagleGroup") }}</option> + <option value="smseagle-contact">{{ $t("smseagleContact") }}</option> + </select> + </div> + <div class="mb-3"> + <label for="smseagle-recipient" class="form-label">{{ $t("smseagleRecipient") }}</label> + <input id="smseagle-recipient" v-model="$parent.notification.smseagleRecipient" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="smseagle-priority" class="form-label">{{ $t("smseaglePriority") }}</label> + <input id="smseagle-priority" v-model="$parent.notification.smseaglePriority" type="number" class="form-control" min="0" max="9" step="1" placeholder="0"> + </div> + <div class="mb-3 form-check form-switch"> + <label for="smseagle-encoding" class="form-label">{{ $t("smseagleEncoding") }}</label> + <input id="smseagle-encoding" v-model="$parent.notification.smseagleEncoding" type="checkbox" class="form-check-input"> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/SMSManager.vue b/src/components/notifications/SMSManager.vue new file mode 100644 index 0000000..00be2fa --- /dev/null +++ b/src/components/notifications/SMSManager.vue @@ -0,0 +1,31 @@ +<template> + <div class="mb-3"> + <label for="smsmanager-key" class="form-label">{{ $t("API Key") }}</label> + <div class="form-text"> + {{ $t("SMSManager API Docs") }} + <a href="https://smsmanager.cz/api/http#send" target="_blank">{{ $t("here") }}</a> + </div> + <input id="smsmanager-key" v-model="$parent.notification.smsmanagerApiKey" type="text" class="form-control"> + </div> + <div class="mb-3"> + <label for="smsmanager-numbers" class="form-label"> {{ $t("Recipients") }}</label> + <div class="form-text"> + {{ $t("You can divide numbers with") }} <b>,</b> {{ $t("or") }} <b>;</b> + </div> + <input id="smsmanager-numbers" v-model="$parent.notification.numbers" type="text" class="form-control"> + </div> + <div class="mb-3"> + <label for="smsmanager-messageType" class="form-label">{{ $t("Gateway Type") }}</label> + <select id="smsmanager-messageType" v-model="$parent.notification.messageType" class="form-select"> + <option value="economy">{{ $t("Economy") }}</option> + <option value="lowcost">{{ $t("Lowcost") }}</option> + <option value="high" selected>{{ $t("High") }}</option> + </select> + </div> + <div class="mb-3"> + <div class="form-text"> + {{ $t("checkPrice", [$t("SMSManager")]) }} + <a href="https://smsmanager.cz/rozesilani-sms/ceny/ceska-republika/" target="_blank">{{ $t("here") }}</a> + </div> + </div> +</template> diff --git a/src/components/notifications/SMSPartner.vue b/src/components/notifications/SMSPartner.vue new file mode 100644 index 0000000..8de64a8 --- /dev/null +++ b/src/components/notifications/SMSPartner.vue @@ -0,0 +1,39 @@ +<template> + <div class="mb-3"> + <label for="smspartner-key" class="form-label">{{ $t("API Key") }}</label> + <HiddenInput id="smspartner-key" v-model="$parent.notification.smspartnerApikey" :required="true" autocomplete="new-password"></HiddenInput> + <div class="form-text"> + <i18n-t keypath="smspartnerApiurl" tag="div" class="form-text"> + <a href="https://my.smspartner.fr/dashboard/api" target="_blank">my.smspartner.fr/dashboard/api</a> + </i18n-t> + </div> + </div> + <div class="mb-3"> + <label for="smspartner-phone-number" class="form-label">{{ $t("smspartnerPhoneNumber") }}</label> + <input id="smspartner-phone-number" v-model="$parent.notification.smspartnerPhoneNumber" type="text" minlength="3" maxlength="20" pattern="^[\d+,]+$" class="form-control" required> + <div class="form-text"> + <i18n-t keypath="smspartnerPhoneNumberHelptext" tag="div" class="form-text"> + <code>+336xxxxxxxx</code> + <code>+496xxxxxxxx</code> + <code>,</code> + </i18n-t> + </div> + </div> + <div class="mb-3"> + <label for="smspartner-sender-name" class="form-label">{{ $t("smspartnerSenderName") }}</label> + <input id="smspartner-sender-name" v-model="$parent.notification.smspartnerSenderName" type="text" minlength="3" maxlength="11" pattern="^[a-zA-Z0-9]*$" class="form-control" required> + <div class="form-text"> + {{ $t("smspartnerSenderNameInfo") }} + </div> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/SMTP.vue b/src/components/notifications/SMTP.vue new file mode 100644 index 0000000..003f905 --- /dev/null +++ b/src/components/notifications/SMTP.vue @@ -0,0 +1,149 @@ +<template> + <div> + <div class="mb-3"> + <label for="hostname" class="form-label">{{ $t("Hostname") }}</label> + <input id="hostname" v-model="$parent.notification.smtpHost" type="text" class="form-control" required> + </div> + + <i18n-t tag="div" keypath="Either enter the hostname of the server you want to connect to or localhost if you intend to use a locally configured mail transfer agent" class="form-text"> + <template #localhost> + <code>localhost</code> + </template> + <template #local_mta> + <a href="https://wikipedia.org/wiki/Mail_Transfer_Agent" target="_blank">{{ $t("locally configured mail transfer agent") }}</a> + </template> + </i18n-t> + <div class="mb-3"> + <label for="port" class="form-label">{{ $t("Port") }}</label> + <input id="port" v-model="$parent.notification.smtpPort" type="number" class="form-control" required min="0" max="65535" step="1"> + </div> + + <div class="mb-3"> + <label for="secure" class="form-label">{{ $t("Security") }}</label> + <select id="secure" v-model="$parent.notification.smtpSecure" class="form-select"> + <option :value="false">{{ $t("secureOptionNone") }}</option> + <option :value="true">{{ $t("secureOptionTLS") }}</option> + </select> + </div> + + <div class="mb-3"> + <div class="form-check"> + <input id="ignore-tls-error" v-model="$parent.notification.smtpIgnoreTLSError" class="form-check-input" type="checkbox" value=""> + <label class="form-check-label" for="ignore-tls-error"> + {{ $t("Ignore TLS Error") }} + </label> + </div> + </div> + + <div class="mb-3"> + <label for="username" class="form-label">{{ $t("Username") }}</label> + <input id="username" v-model="$parent.notification.smtpUsername" type="text" class="form-control" autocomplete="false"> + </div> + + <div class="mb-3"> + <label for="password" class="form-label">{{ $t("Password") }}</label> + <HiddenInput id="password" v-model="$parent.notification.smtpPassword" :required="false" autocomplete="new-password"></HiddenInput> + </div> + + <div class="mb-3"> + <label for="from-email" class="form-label">{{ $t("From Email") }}</label> + <input id="from-email" v-model="$parent.notification.smtpFrom" type="text" class="form-control" required autocomplete="false" placeholder=""Uptime Kuma" <example@kuma.pet>"> + <div class="form-text"> + </div> + </div> + + <div class="mb-3"> + <label for="to-email" class="form-label">{{ $t("To Email") }}</label> + <input id="to-email" v-model="$parent.notification.smtpTo" type="text" class="form-control" autocomplete="false" placeholder="example2@kuma.pet, example3@kuma.pet" :required="!hasRecipient"> + </div> + + <div class="mb-3"> + <label for="to-cc" class="form-label">{{ $t("smtpCC") }}</label> + <input id="to-cc" v-model="$parent.notification.smtpCC" type="text" class="form-control" autocomplete="false" :required="!hasRecipient"> + </div> + + <div class="mb-3"> + <label for="to-bcc" class="form-label">{{ $t("smtpBCC") }}</label> + <input id="to-bcc" v-model="$parent.notification.smtpBCC" type="text" class="form-control" autocomplete="false" :required="!hasRecipient"> + </div> + + <p class="form-text"> + <i18n-t tag="div" keypath="smtpLiquidIntroduction" class="form-text mb-3"> + <a href="https://liquidjs.com/" target="_blank">{{ $t("documentation") }}</a> + </i18n-t> + <code v-pre>{{name}}</code>: {{ $t("emailTemplateServiceName") }}<br /> + <code v-pre>{{msg}}</code>: {{ $t("emailTemplateMsg") }}<br /> + <code v-pre>{{status}}</code>: {{ $t("emailTemplateStatus") }}<br /> + <code v-pre>{{heartbeatJSON}}</code>: {{ $t("emailTemplateHeartbeatJSON") }}<b>{{ $t("emailTemplateLimitedToUpDownNotification") }}</b><br /> + <code v-pre>{{monitorJSON}}</code>: {{ $t("emailTemplateMonitorJSON") }} <b>{{ $t("emailTemplateLimitedToUpDownNotification") }}</b><br /> + <code v-pre>{{hostnameOrURL}}</code>: {{ $t("emailTemplateHostnameOrURL") }}<br /> + </p> + <div class="mb-3"> + <label for="subject-email" class="form-label">{{ $t("emailCustomSubject") }}</label> + <input id="subject-email" v-model="$parent.notification.customSubject" type="text" class="form-control" autocomplete="false" placeholder=""> + <div class="form-text">{{ $t("leave blank for default subject") }}</div> + </div> + <div class="mb-3"> + <label for="body-email" class="form-label">{{ $t("emailCustomBody") }}</label> + <textarea id="body-email" v-model="$parent.notification.customBody" type="text" class="form-control" autocomplete="false" placeholder=""></textarea> + <div class="form-text">{{ $t("leave blank for default body") }}</div> + </div> + + <ToggleSection :heading="$t('smtpDkimSettings')"> + <i18n-t tag="div" keypath="smtpDkimDesc" class="form-text mb-3"> + <a href="https://nodemailer.com/dkim/" target="_blank">{{ $t("documentation") }}</a> + </i18n-t> + + <div class="mb-3"> + <label for="dkim-domain" class="form-label">{{ $t("smtpDkimDomain") }}</label> + <input id="dkim-domain" v-model="$parent.notification.smtpDkimDomain" type="text" class="form-control" autocomplete="false" placeholder="example.com"> + </div> + <div class="mb-3"> + <label for="dkim-key-selector" class="form-label">{{ $t("smtpDkimKeySelector") }}</label> + <input id="dkim-key-selector" v-model="$parent.notification.smtpDkimKeySelector" type="text" class="form-control" autocomplete="false" placeholder="2017"> + </div> + <div class="mb-3"> + <label for="dkim-private-key" class="form-label">{{ $t("smtpDkimPrivateKey") }}</label> + <textarea id="dkim-private-key" v-model="$parent.notification.smtpDkimPrivateKey" rows="5" type="text" class="form-control" autocomplete="false" placeholder="-----BEGIN PRIVATE KEY-----"></textarea> + </div> + <div class="mb-3"> + <label for="dkim-hash-algo" class="form-label">{{ $t("smtpDkimHashAlgo") }}</label> + <input id="dkim-hash-algo" v-model="$parent.notification.smtpDkimHashAlgo" type="text" class="form-control" autocomplete="false" placeholder="sha256"> + </div> + <div class="mb-3"> + <label for="dkim-header-fields" class="form-label">{{ $t("smtpDkimheaderFieldNames") }}</label> + <input id="dkim-header-fields" v-model="$parent.notification.smtpDkimheaderFieldNames" type="text" class="form-control" autocomplete="false" placeholder="message-id:date:from:to"> + </div> + <div class="mb-3"> + <label for="dkim-skip-fields" class="form-label">{{ $t("smtpDkimskipFields") }}</label> + <input id="dkim-skip-fields" v-model="$parent.notification.smtpDkimskipFields" type="text" class="form-control" autocomplete="false" placeholder="message-id:date"> + </div> + </ToggleSection> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +import ToggleSection from "../ToggleSection.vue"; + +export default { + components: { + HiddenInput, + ToggleSection, + }, + computed: { + hasRecipient() { + if (this.$parent.notification.smtpTo || this.$parent.notification.smtpCC || this.$parent.notification.smtpBCC) { + return true; + } else { + return false; + } + } + }, + mounted() { + if (typeof this.$parent.notification.smtpSecure === "undefined") { + this.$parent.notification.smtpSecure = false; + } + } +}; +</script> diff --git a/src/components/notifications/SendGrid.vue b/src/components/notifications/SendGrid.vue new file mode 100644 index 0000000..18118f4 --- /dev/null +++ b/src/components/notifications/SendGrid.vue @@ -0,0 +1,47 @@ +<template> + <div class="mb-3"> + <label for="sendgrid-api-key" class="form-label">{{ $t("SendGrid API Key") }}</label> + <HiddenInput id="push-api-key" v-model="$parent.notification.sendgridApiKey" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <label for="sendgrid-from-email" class="form-label">{{ $t("From Email") }}</label> + <input id="sendgrid-from-email" v-model="$parent.notification.sendgridFromEmail" type="email" class="form-control" required> + </div> + <div class="mb-3"> + <label for="sendgrid-to-email" class="form-label">{{ $t("To Email") }}</label> + <input id="sendgrid-to-email" v-model="$parent.notification.sendgridToEmail" type="email" class="form-control" required> + </div> + <div class="mb-3"> + <label for="sendgrid-cc-email" class="form-label">{{ $t("smtpCC") }}</label> + <input id="sendgrid-cc-email" v-model="$parent.notification.sendgridCcEmail" type="email" class="form-control"> + <div class="form-text">{{ $t("Separate multiple email addresses with commas") }}</div> + </div> + <div class="mb-3"> + <label for="sendgrid-bcc-email" class="form-label">{{ $t("smtpBCC") }}</label> + <input id="sendgrid-bcc-email" v-model="$parent.notification.sendgridBccEmail" type="email" class="form-control"> + <small class="form-text text-muted">{{ $t("Separate multiple email addresses with commas") }}</small> + </div> + <div class="mb-3"> + <label for="sendgrid-subject" class="form-label">{{ $t("Subject:") }}</label> + <input id="sendgrid-subject" v-model="$parent.notification.sendgridSubject" type="text" class="form-control"> + <small class="form-text text-muted">{{ $t("leave blank for default subject") }}</small> + </div> + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://docs.sendgrid.com/api-reference/mail-send/mail-send" target="_blank">https://docs.sendgrid.com/api-reference/mail-send/mail-send</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + if (typeof this.$parent.notification.sendgridSubject === "undefined") { + this.$parent.notification.sendgridSubject = "Notification from Your Uptime Kuma"; + } + }, +}; +</script> diff --git a/src/components/notifications/ServerChan.vue b/src/components/notifications/ServerChan.vue new file mode 100644 index 0000000..c7476c2 --- /dev/null +++ b/src/components/notifications/ServerChan.vue @@ -0,0 +1,16 @@ +<template> + <div class="mb-3"> + <label for="serverchan-sendkey" class="form-label">{{ $t("SendKey") }}</label> + <HiddenInput id="serverchan-sendkey" v-model="$parent.notification.serverChanSendKey" :required="true" autocomplete="new-password"></HiddenInput> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/SerwerSMS.vue b/src/components/notifications/SerwerSMS.vue new file mode 100644 index 0000000..32a0ff7 --- /dev/null +++ b/src/components/notifications/SerwerSMS.vue @@ -0,0 +1,28 @@ +<template> + <div class="mb-3"> + <label for="serwersms-username" class="form-label">{{ $t('serwersmsAPIUser') }}</label> + <input id="serwersms-username" v-model="$parent.notification.serwersmsUsername" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="serwersms-key" class="form-label">{{ $t('serwersmsAPIPassword') }}</label> + <HiddenInput id="serwersms-key" v-model="$parent.notification.serwersmsPassword" :required="true" autocomplete="new-password"></HiddenInput> + </div> + <div class="mb-3"> + <label for="serwersms-phone-number" class="form-label">{{ $t("serwersmsPhoneNumber") }}</label> + <input id="serwersms-phone-number" v-model="$parent.notification.serwersmsPhoneNumber" type="text" class="form-control" required> + </div> + <div class="mb-3"> + <label for="serwersms-sender-name" class="form-label">{{ $t("serwersmsSenderName") }}</label> + <input id="serwersms-sender-name" v-model="$parent.notification.serwersmsSenderName" type="text" minlength="3" maxlength="11" class="form-control"> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/SevenIO.vue b/src/components/notifications/SevenIO.vue new file mode 100644 index 0000000..fcf746e --- /dev/null +++ b/src/components/notifications/SevenIO.vue @@ -0,0 +1,31 @@ +<template> + <div class="mb-3"> + <label for="sevenio-api-key" class="form-label">{{ $t("apiKeySevenIO") }}</label> + <HiddenInput id="sevenio-api-key" v-model="$parent.notification.sevenioApiKey" :required="true" autocomplete="new-password"></HiddenInput> + <div class="form-text"> + {{ $t("wayToGetSevenIOApiKey") }} + </div> + </div> + + <div class="mb-3"> + <label for="sevenio-sender" class="form-label">{{ $t("senderSevenIO") }}</label> + <input id="sevenio-sender" v-model="$parent.notification.sevenioSender" type="text" class="form-control" autocomplete="false" placeholder="Uptime Kuma"> + </div> + + <div class="mb-3"> + <label for="sevenio-receiver" class="form-label">{{ $t("receiverSevenIO") }}</label> + <input id="sevenio-receiver" v-model="$parent.notification.sevenioReceiver" type="number" class="form-control" required autocomplete="false" placeholder="0123456789"> + <div class="form-text"> + {{ $t("receiverInfoSevenIO") }} + </div> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Signal.vue b/src/components/notifications/Signal.vue new file mode 100644 index 0000000..e3c9e7a --- /dev/null +++ b/src/components/notifications/Signal.vue @@ -0,0 +1,34 @@ +<template> + <div class="mb-3"> + <label for="signal-url" class="form-label">{{ $t("Post URL") }}</label> + <input id="signal-url" v-model="$parent.notification.signalURL" type="url" pattern="https?://.+" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="signal-number" class="form-label">{{ $t("Number") }}</label> + <input id="signal-number" v-model="$parent.notification.signalNumber" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="signal-recipients" class="form-label">{{ $t("Recipients") }}</label> + <input id="signal-recipients" v-model="$parent.notification.signalRecipients" type="text" class="form-control" required> + + <div class="form-text"> + <p style="margin-top: 8px;"> + {{ $t("needSignalAPI") }} + </p> + + <p style="margin-top: 8px;"> + {{ $t("wayToCheckSignalURL") }} + </p> + + <p style="margin-top: 8px;"> + <a href="https://github.com/bbernhard/signal-cli-rest-api" target="_blank">https://github.com/bbernhard/signal-cli-rest-api</a> + </p> + + <p style="margin-top: 8px;"> + {{ $t("signalImportant") }} + </p> + </div> + </div> +</template> diff --git a/src/components/notifications/Slack.vue b/src/components/notifications/Slack.vue new file mode 100644 index 0000000..9fa9f34 --- /dev/null +++ b/src/components/notifications/Slack.vue @@ -0,0 +1,45 @@ +<template> + <div class="mb-3"> + <label for="slack-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="slack-webhook-url" v-model="$parent.notification.slackwebhookURL" type="text" class="form-control" required> + <label for="slack-username" class="form-label">{{ $t("Username") }}</label> + <input id="slack-username" v-model="$parent.notification.slackusername" type="text" class="form-control"> + <div class="form-text"> + {{ $t("aboutSlackUsername") }} + </div> + <label for="slack-iconemo" class="form-label">{{ $t("Icon Emoji") }}</label> + <input id="slack-iconemo" v-model="$parent.notification.slackiconemo" type="text" class="form-control"> + <label for="slack-channel" class="form-label">{{ $t("Channel Name") }}</label> + <input id="slack-channel-name" v-model="$parent.notification.slackchannel" type="text" class="form-control"> + + <label class="form-label">{{ $t("Message format") }}</label> + <div class="form-check form-switch"> + <input id="slack-text-message" v-model="$parent.notification.slackrichmessage" type="checkbox" class="form-check-input"> + <label for="slack-text-message" class="form-label">{{ $t("Send rich messages") }}</label> + </div> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://api.slack.com/messaging/webhooks" target="_blank">https://api.slack.com/messaging/webhooks</a> + </i18n-t> + <p style="margin-top: 8px;"> + {{ $t("aboutChannelName", [$t("slack")]) }} + </p> + <p style="margin-top: 8px;"> + {{ $t("aboutKumaURL") }} + </p> + <i18n-t tag="p" keypath="emojiCheatSheet" style="margin-top: 8px;"> + <a href="https://www.webfx.com/tools/emoji-cheat-sheet/" target="_blank">https://www.webfx.com/tools/emoji-cheat-sheet/</a> + </i18n-t> + </div> + + <div class="form-check form-switch"> + <input id="slack-channel-notify" v-model="$parent.notification.slackchannelnotify" type="checkbox" class="form-check-input"> + <label for="slack-channel-notify" class="form-label">{{ $t("Notify Channel") }}</label> + </div> + <div class="form-text"> + {{ $t("aboutNotifyChannel") }} + </div> + </div> +</template> diff --git a/src/components/notifications/Splunk.vue b/src/components/notifications/Splunk.vue new file mode 100644 index 0000000..8644851 --- /dev/null +++ b/src/components/notifications/Splunk.vue @@ -0,0 +1,32 @@ +<template> + <div class="mb-3"> + <label for="splunk-rest-url" class="form-label">{{ $t("Splunk Rest URL") }}</label> + <HiddenInput id="splunk-rest-url" v-model="$parent.notification.splunkRestURL" :required="true" autocomplete="false"></HiddenInput> + </div> + <div class="mb-3"> + <label for="splunk-severity" class="form-label">{{ $t("Severity") }}</label> + <select id="splunk-severity" v-model="$parent.notification.splunkSeverity" class="form-select"> + <option value="INFO">{{ $t("info") }}</option> + <option value="WARNING">{{ $t("warning") }}</option> + <option value="CRITICAL" selected="selected">{{ $t("critical") }}</option> + </select> + </div> + <div class="mb-3"> + <label for="splunk-resolve" class="form-label">{{ $t("Auto resolve or acknowledged") }}</label> + <select id="splunk-resolve" v-model="$parent.notification.splunkAutoResolve" class="form-select"> + <option value="0" selected="selected">{{ $t("do nothing") }}</option> + <option value="ACKNOWLEDGEMENT">{{ $t("auto acknowledged") }}</option> + <option value="RECOVERY">{{ $t("auto resolve") }}</option> + </select> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/Squadcast.vue b/src/components/notifications/Squadcast.vue new file mode 100644 index 0000000..6650c44 --- /dev/null +++ b/src/components/notifications/Squadcast.vue @@ -0,0 +1,6 @@ +<template> + <div class="mb-3"> + <label for="webhook-url" class="form-label">{{ $t("Post URL") }}</label> + <input id="webhook-url" v-model="$parent.notification.squadcastWebhookURL" type="url" pattern="https?://.+" class="form-control" required> + </div> +</template> diff --git a/src/components/notifications/Stackfield.vue b/src/components/notifications/Stackfield.vue new file mode 100644 index 0000000..c8dfb72 --- /dev/null +++ b/src/components/notifications/Stackfield.vue @@ -0,0 +1,13 @@ +<template> + <div class="mb-3"> + <label for="stackfield-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="stackfield-webhook-url" v-model="$parent.notification.stackfieldwebhookURL" type="text" class="form-control" required> + + <div class="form-text"> + <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }} + <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;"> + <a href="https://www.stackfield.com/developer-api#AnchorAPI2" target="_blank">https://www.stackfield.com/developer-api#AnchorAPI2</a> + </i18n-t> + </div> + </div> +</template> diff --git a/src/components/notifications/Teams.vue b/src/components/notifications/Teams.vue new file mode 100644 index 0000000..2bc7648 --- /dev/null +++ b/src/components/notifications/Teams.vue @@ -0,0 +1,18 @@ +<template> + <div class="mb-3"> + <label for="teams-webhookurl" class="form-label">{{ $t("Webhook URL") }}</label> + <input + id="teams-webhookurl" + v-model="$parent.notification.webhookUrl" + type="text" + class="form-control" + required + /> + <i18n-t tag="div" keypath="wayToGetTeamsURL" class="form-text"> + <a + href="https://docs.microsoft.com/en-us/microsoftteams/platform/webhooks-and-connectors/how-to/add-incoming-webhook" + target="_blank" + >{{ $t("here") }}</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/TechulusPush.vue b/src/components/notifications/TechulusPush.vue new file mode 100644 index 0000000..bb2c27a --- /dev/null +++ b/src/components/notifications/TechulusPush.vue @@ -0,0 +1,81 @@ +<template> + <div class="mb-3"> + <label for="push-api-key" class="form-label">{{ $t("API Key") }}</label> + <HiddenInput id="push-api-key" v-model="$parent.notification.pushAPIKey" :required="true" autocomplete="new-password"></HiddenInput> + </div> + + <div class="mb-3"> + <label for="push-api-title" class="form-label">{{ $t("Title") }}</label> + <input id="push-api-title" v-model="$parent.notification.pushTitle" type="text" class="form-control"> + </div> + + <div class="mb-3"> + <label for="push-api-channel" class="form-label">{{ $t("Notification Channel") }}</label> + <input id="push-api-channel" v-model="$parent.notification.pushChannel" type="text" class="form-control" patttern="[A-Za-z0-9-]+"> + <div class="form-text"> + {{ $t("Alphanumerical string and hyphens only") }} + </div> + </div> + + <div class="mb-3"> + <label for="push-api-sound" class="form-label">{{ $t("Sound") }}</label> + <select id="push-api-sound" v-model="$parent.notification.pushSound" class="form-select"> + <option value="default">{{ $t("Default") }}</option> + <option value="arcade">{{ $t("Arcade") }}</option> + <option value="correct">{{ $t("Correct") }}</option> + <option value="fail">{{ $t("Fail") }}</option> + <option value="harp">{{ $t("Harp") }}</option> + <option value="reveal">{{ $t("Reveal") }}</option> + <option value="bubble">{{ $t("Bubble") }}</option> + <option value="doorbell">{{ $t("Doorbell") }}</option> + <option value="flute">{{ $t("Flute") }}</option> + <option value="money">{{ $t("Money") }}</option> + <option value="scifi">{{ $t("Scifi") }}</option> + <option value="clear">{{ $t("Clear") }}</option> + <option value="elevator">{{ $t("Elevator") }}</option> + <option value="guitar">{{ $t("Guitar") }}</option> + <option value="pop">{{ $t("Pop") }}</option> + </select> + <div class="form-text"> + {{ $t("Custom sound to override default notification sound") }} + </div> + </div> + + <div class="mb-3"> + <div class="form-check form-switch"> + <input v-model="$parent.notification.pushTimeSensitive" class="form-check-input" type="checkbox"> + <label class="form-check-label">{{ $t("Time Sensitive (iOS Only)") }}</label> + </div> + <div class="form-text"> + {{ $t("Time sensitive notifications will be delivered immediately, even if the device is in do not disturb mode.") }} + </div> + </div> + + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://docs.push.techulus.com" target="_blank">https://docs.push.techulus.com</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + }, + mounted() { + if (typeof this.$parent.notification.pushTitle === "undefined") { + this.$parent.notification.pushTitle = "Uptime-Kuma"; + } + if (typeof this.$parent.notification.pushChannel === "undefined") { + this.$parent.notification.pushChannel = "uptime-kuma"; + } + if (typeof this.$parent.notification.pushSound === "undefined") { + this.$parent.notification.pushSound = "default"; + } + if (typeof this.$parent.notification.pushTimeSensitive === "undefined") { + this.$parent.notification.pushTimeSensitive = true; + } + }, +}; +</script> diff --git a/src/components/notifications/Telegram.vue b/src/components/notifications/Telegram.vue new file mode 100644 index 0000000..a072c3e --- /dev/null +++ b/src/components/notifications/Telegram.vue @@ -0,0 +1,117 @@ +<template> + <div class="mb-3"> + <label for="telegram-bot-token" class="form-label">{{ $t("Bot Token") }}</label> + <HiddenInput id="telegram-bot-token" v-model="$parent.notification.telegramBotToken" :required="true" autocomplete="new-password"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetTelegramToken" class="form-text"> + <a href="https://t.me/BotFather" target="_blank">https://t.me/BotFather</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="telegram-chat-id" class="form-label">{{ $t("Chat ID") }}</label> + + <div class="input-group mb-3"> + <input id="telegram-chat-id" v-model="$parent.notification.telegramChatID" type="text" class="form-control" required> + <button v-if="$parent.notification.telegramBotToken" class="btn btn-outline-secondary" type="button" @click="autoGetTelegramChatID"> + {{ $t("Auto Get") }} + </button> + </div> + + <div class="form-text"> + {{ $t("supportTelegramChatID") }} + + <p style="margin-top: 8px;"> + {{ $t("wayToGetTelegramChatID") }} + </p> + + <p style="margin-top: 8px;"> + <a :href="telegramGetUpdatesURL('withToken')" target="_blank" style="word-break: break-word;">{{ telegramGetUpdatesURL("masked") }}</a> + </p> + </div> + + <label for="message_thread_id" class="form-label">{{ $t("telegramMessageThreadID") }}</label> + <input id="message_thread_id" v-model="$parent.notification.telegramMessageThreadID" type="text" class="form-control"> + <p class="form-text">{{ $t("telegramMessageThreadIDDescription") }}</p> + + <div class="form-check form-switch"> + <input v-model="$parent.notification.telegramSendSilently" class="form-check-input" type="checkbox"> + <label class="form-check-label">{{ $t("telegramSendSilently") }}</label> + </div> + + <div class="form-text"> + {{ $t("telegramSendSilentlyDescription") }} + </div> + </div> + + <div class="mb-3"> + <div class="form-check form-switch"> + <input v-model="$parent.notification.telegramProtectContent" class="form-check-input" type="checkbox"> + <label class="form-check-label">{{ $t("telegramProtectContent") }}</label> + </div> + + <div class="form-text"> + {{ $t("telegramProtectContentDescription") }} + </div> + </div> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +import axios from "axios"; + +export default { + components: { + HiddenInput, + }, + methods: { + /** + * Get the URL for telegram updates + * @param {string} mode Should the token be masked? + * @returns {string} formatted URL + */ + telegramGetUpdatesURL(mode = "masked") { + let token = `<${this.$t("YOUR BOT TOKEN HERE")}>`; + + if (this.$parent.notification.telegramBotToken) { + if (mode === "withToken") { + token = this.$parent.notification.telegramBotToken; + } else if (mode === "masked") { + token = "*".repeat(this.$parent.notification.telegramBotToken.length); + } + } + + return `https://api.telegram.org/bot${token}/getUpdates`; + }, + + /** + * Get the telegram chat ID + * @returns {Promise<void>} + * @throws The chat ID could not be found + */ + async autoGetTelegramChatID() { + try { + let res = await axios.get(this.telegramGetUpdatesURL("withToken")); + + if (res.data.result.length >= 1) { + let update = res.data.result[res.data.result.length - 1]; + + if (update.channel_post) { + this.$parent.notification.telegramChatID = update.channel_post.chat.id; + } else if (update.message) { + this.$parent.notification.telegramChatID = update.message.chat.id; + } else { + throw new Error(this.$t("chatIDNotFound")); + } + + } else { + throw new Error(this.$t("chatIDNotFound")); + } + + } catch (error) { + this.$root.toastError(error.message); + } + + }, + } +}; +</script> diff --git a/src/components/notifications/Threema.vue b/src/components/notifications/Threema.vue new file mode 100644 index 0000000..9e46459 --- /dev/null +++ b/src/components/notifications/Threema.vue @@ -0,0 +1,87 @@ +<template> + <div class="mb-3"> + <label class="form-label" for="threema-recipient">{{ $t("threemaRecipientType") }}</label> + <select + id="threema-recipient" v-model="$parent.notification.threemaRecipientType" required + class="form-select" + > + <option value="identity">{{ $t("threemaRecipientTypeIdentity") }}</option> + <option value="phone">{{ $t("threemaRecipientTypePhone") }}</option> + <option value="email">{{ $t("threemaRecipientTypeEmail") }}</option> + </select> + </div> + <div v-if="$parent.notification.threemaRecipientType === 'identity'" class="mb-3"> + <label class="form-label" for="threema-recipient">{{ $t("threemaRecipient") }} {{ $t("threemaRecipientTypeIdentity") }}</label> + <input + id="threema-recipient" + v-model="$parent.notification.threemaRecipient" + class="form-control" + minlength="8" + maxlength="8" + pattern="[A-Z0-9]{8}" + required + type="text" + > + <div class="form-text"> + <p>{{ $t("threemaRecipientTypeIdentityFormat") }}</p> + </div> + </div> + <div v-else-if="$parent.notification.threemaRecipientType === 'phone'" class="mb-3"> + <label class="form-label" for="threema-recipient">{{ $t("threemaRecipient") }} {{ $t("threemaRecipientTypePhone") }}</label> + <input + id="threema-recipient" + v-model="$parent.notification.threemaRecipient" + class="form-control" + maxlength="15" + pattern="\d{1,15}" + required + type="text" + > + <div class="form-text"> + <p>{{ $t("threemaRecipientTypePhoneFormat") }}</p> + </div> + </div> + <div v-else-if="$parent.notification.threemaRecipientType === 'email'" class="mb-3"> + <label class="form-label" for="threema-recipient">{{ $t("threemaRecipient") }} {{ $t("threemaRecipientTypeEmail") }}</label> + <input + id="threema-recipient" + v-model="$parent.notification.threemaRecipient" + class="form-control" + maxlength="254" + required + type="email" + > + </div> + <div class="mb-3"> + <label class="form-label" for="threema-sender">{{ $t("threemaSenderIdentity") }}</label> + <input + id="threema-sender" + v-model="$parent.notification.threemaSenderIdentity" + class="form-control" + minlength="8" + maxlength="8" + pattern="^\*[A-Z0-9]{7}$" + required + type="text" + > + <div class="form-text"> + <p>{{ $t("threemaSenderIdentityFormat") }}</p> + </div> + </div> + <div class="mb-3"> + <label class="form-label" for="threema-secret">{{ $t("threemaApiAuthenticationSecret") }}</label> + <HiddenInput + id="threema-secret" v-model="$parent.notification.threemaSecret" required + autocomplete="false" + ></HiddenInput> + </div> + <i18n-t class="form-text" keypath="wayToGetThreemaGateway" tag="div"> + <a href="https://threema.ch/en/gateway" target="_blank">{{ $t("here") }}</a> + </i18n-t> + <i18n-t class="form-text" keypath="threemaBasicModeInfo" tag="div"> + <a href="https://gateway.threema.ch/en/developer/api" target="_blank">{{ $t("here") }}</a> + </i18n-t> +</template> +<script lang="ts" setup> +import HiddenInput from "../HiddenInput.vue"; +</script> diff --git a/src/components/notifications/Twilio.vue b/src/components/notifications/Twilio.vue new file mode 100644 index 0000000..d923866 --- /dev/null +++ b/src/components/notifications/Twilio.vue @@ -0,0 +1,38 @@ +<template> + <div class="mb-3"> + <label for="twilio-account-sid" class="form-label">{{ $t("Account SID") }}</label> + <input id="twilio-account-sid" v-model="$parent.notification.twilioAccountSID" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="twilio-apikey-token" class="form-label">{{ $t("Api Key (optional)") }}</label> + <input id="twilio-apikey-token" v-model="$parent.notification.twilioApiKey" type="text" class="form-control"> + <div class="form-text"> + <p> + The API key is optional but recommended. You can provide either Account SID and AuthToken + from the may TwilioConsole page or Account SID and the pair of Api Key and Api Key secret + </p> + </div> + </div> + + <div class="mb-3"> + <label for="twilio-auth-token" class="form-label">{{ $t("Auth Token / Api Key Secret") }}</label> + <input id="twilio-auth-token" v-model="$parent.notification.twilioAuthToken" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="twilio-from-number" class="form-label">{{ $t("From Number") }}</label> + <input id="twilio-from-number" v-model="$parent.notification.twilioFromNumber" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <label for="twilio-to-number" class="form-label">{{ $t("To Number") }}</label> + <input id="twilio-to-number" v-model="$parent.notification.twilioToNumber" type="text" class="form-control" required> + </div> + + <div class="mb-3"> + <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;"> + <a href="https://www.twilio.com/docs/sms" target="_blank">https://www.twilio.com/docs/sms</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/WPush.vue b/src/components/notifications/WPush.vue new file mode 100644 index 0000000..58499c4 --- /dev/null +++ b/src/components/notifications/WPush.vue @@ -0,0 +1,31 @@ +<template> + <div class="mb-3"> + <label for="wpush-apikey" class="form-label">WPush {{ $t("API Key") }}</label> + <HiddenInput id="wpush-apikey" v-model="$parent.notification.wpushAPIkey" :required="true" autocomplete="new-password" placeholder="WPushxxxxx"></HiddenInput> + </div> + + <div class="mb-3"> + <label for="wpush-channel" class="form-label">发送通道</label> + <select id="wpush-channel" v-model="$parent.notification.wpushChannel" class="form-select" required> + <option value="wechat">微信</option> + <option value="sms">短信</option> + <option value="mail">邮件</option> + <option value="feishu">飞书</option> + <option value="dingtalk">钉钉</option> + <option value="wechat_work">企业微信</option> + </select> + </div> + + <i18n-t tag="p" keypath="More info on:"> + <a href="https://wpush.cn/" rel="noopener noreferrer" target="_blank">https://wpush.cn/</a> + </i18n-t> +</template> + +<script> +import HiddenInput from "../HiddenInput.vue"; +export default { + components: { + HiddenInput, + }, +}; +</script> diff --git a/src/components/notifications/WeCom.vue b/src/components/notifications/WeCom.vue new file mode 100644 index 0000000..cef3708 --- /dev/null +++ b/src/components/notifications/WeCom.vue @@ -0,0 +1,12 @@ +<template> + <div class="mb-3"> + <label for="WeCom Bot Key" class="form-label">{{ $t("WeCom Bot Key") }}<span style="color: red;"><sup>*</sup></span></label> + <input id="WeCom Bot Key" v-model="$parent.notification.weComBotKey" type="text" class="form-control" required> + <div class="form-text"> + <p><span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}</p> + </div> + <i18n-t tag="p" keypath="Read more:"> + <a href="https://work.weixin.qq.com/api/doc/90000/90136/91770" target="_blank">https://work.weixin.qq.com/api/doc/90000/90136/91770</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/Webhook.vue b/src/components/notifications/Webhook.vue new file mode 100644 index 0000000..8c67a27 --- /dev/null +++ b/src/components/notifications/Webhook.vue @@ -0,0 +1,100 @@ +<template> + <div class="mb-3"> + <label for="webhook-url" class="form-label">{{ $t("Post URL") }}</label> + <input + id="webhook-url" + v-model="$parent.notification.webhookURL" + type="url" + pattern="https?://.+" + class="form-control" + required + /> + </div> + + <div class="mb-3"> + <label for="webhook-request-body" class="form-label">{{ $t("Request Body") }}</label> + <select + id="webhook-request-body" + v-model="$parent.notification.webhookContentType" + class="form-select" + required + > + <option value="json">{{ $t("webhookBodyPresetOption", ["application/json"]) }}</option> + <option value="form-data">{{ $t("webhookBodyPresetOption", ["multipart/form-data"]) }}</option> + <option value="custom">{{ $t("webhookBodyCustomOption") }}</option> + </select> + + <div v-if="$parent.notification.webhookContentType == 'json'" class="form-text">{{ $t("webhookJsonDesc", ['"application/json"']) }}</div> + <i18n-t v-else-if="$parent.notification.webhookContentType == 'form-data'" tag="div" keypath="webhookFormDataDesc" class="form-text"> + <template #multipart>multipart/form-data"</template> + <template #decodeFunction> + <strong>json_decode($_POST['data'])</strong> + </template> + </i18n-t> + <template v-else-if="$parent.notification.webhookContentType == 'custom'"> + <i18n-t tag="div" keypath="liquidIntroduction" class="form-text"> + <a href="https://liquidjs.com/" target="_blank">{{ $t("documentation") }}</a> + </i18n-t> + <code v-pre>{{msg}}</code>: {{ $t("templateMsg") }}<br /> + <code v-pre>{{heartbeatJSON}}</code>: {{ $t("templateHeartbeatJSON") }} <b>({{ $t("templateLimitedToUpDownNotifications") }})</b><br /> + <code v-pre>{{monitorJSON}}</code>: {{ $t("templateMonitorJSON") }} <b>({{ $t("templateLimitedToUpDownCertNotifications") }})</b><br /> + + <textarea + id="customBody" + v-model="$parent.notification.webhookCustomBody" + class="form-control" + :placeholder="customBodyPlaceholder" + required + ></textarea> + </template> + </div> + + <div class="mb-3"> + <div class="form-check form-switch"> + <input v-model="showAdditionalHeadersField" class="form-check-input" type="checkbox"> + <label class="form-check-label">{{ $t("webhookAdditionalHeadersTitle") }}</label> + </div> + <div class="form-text">{{ $t("webhookAdditionalHeadersDesc") }}</div> + <textarea + v-if="showAdditionalHeadersField" + id="additionalHeaders" + v-model="$parent.notification.webhookAdditionalHeaders" + class="form-control" + :placeholder="headersPlaceholder" + :required="showAdditionalHeadersField" + ></textarea> + </div> +</template> + +<script> +export default { + data() { + return { + showAdditionalHeadersField: this.$parent.notification.webhookAdditionalHeaders != null, + }; + }, + computed: { + headersPlaceholder() { + return this.$t("Example:", [ +`{ + "Authorization": "Authorization Token" +}`, + ]); + }, + customBodyPlaceholder() { + return this.$t("Example:", [ +`{ + "Title": "Uptime Kuma Alert{% if monitorJSON %} - {{ monitorJSON['name'] }}{% endif %}", + "Body": "{{ msg }}" +}` + ]); + } + }, +}; +</script> + +<style lang="scss" scoped> +textarea { + min-height: 200px; +} +</style> diff --git a/src/components/notifications/Whapi.vue b/src/components/notifications/Whapi.vue new file mode 100644 index 0000000..4c92ad2 --- /dev/null +++ b/src/components/notifications/Whapi.vue @@ -0,0 +1,33 @@ +<template> + <div class="mb-3"> + <label for="whapi-api-url" class="form-label">{{ $t("API URL") }}</label> + <input id="whapi-api-url" v-model="$parent.notification.whapiApiUrl" placeholder="https://gate.whapi.cloud/" type="text" class="form-control"> + </div> + + <div class="mb-3"> + <label for="whapi-auth-token" class="form-label">{{ $t("Token") }}</label> + <HiddenInput id="whapi-auth-token" v-model="$parent.notification.whapiAuthToken" :required="true" autocomplete="new-password"></HiddenInput> + <i18n-t tag="div" keypath="wayToGetWhapiUrlAndToken" class="form-text"> + <a href="https://panel.whapi.cloud/dashboard" target="_blank">https://panel.whapi.cloud/dashboard</a> + </i18n-t> + </div> + + <div class="mb-3"> + <label for="whapi-recipient" class="form-label">{{ $t("whapiRecipient") }}</label> + <input id="whapi-recipient" v-model="$parent.notification.whapiRecipient" type="text" pattern="^[\d-]{10,31}(@[\w\.]{1,})?$" class="form-control" required> + <div class="form-text">{{ $t("wayToWriteWhapiRecipient", ["00117612345678", "00117612345678@s.whatsapp.net", "123456789012345678@g.us"]) }}</div> + </div> + + <i18n-t tag="div" keypath="More info on:" class="mb-3 form-text"> + <a href="https://whapi.cloud/" target="_blank">https://whapi.cloud/</a> + </i18n-t> +</template> +<script> +import HiddenInput from "../HiddenInput.vue"; + +export default { + components: { + HiddenInput, + } +}; +</script> diff --git a/src/components/notifications/ZohoCliq.vue b/src/components/notifications/ZohoCliq.vue new file mode 100644 index 0000000..9a9cd73 --- /dev/null +++ b/src/components/notifications/ZohoCliq.vue @@ -0,0 +1,18 @@ +<template> + <div class="mb-3"> + <label for="zcliq-webhookurl" class="form-label">{{ $t("Webhook URL") }}</label> + <input + id="zcliq-webhookurl" + v-model="$parent.notification.webhookUrl" + type="text" + class="form-control" + required + /> + <i18n-t tag="div" keypath="wayToGetZohoCliqURL" class="form-text"> + <a + href="https://www.zoho.com/cliq/help/platform/webhook-tokens.html" + target="_blank" + >{{ $t("here") }}</a> + </i18n-t> + </div> +</template> diff --git a/src/components/notifications/index.js b/src/components/notifications/index.js new file mode 100644 index 0000000..efa2af5 --- /dev/null +++ b/src/components/notifications/index.js @@ -0,0 +1,147 @@ +import Alerta from "./Alerta.vue"; +import AlertNow from "./AlertNow.vue"; +import AliyunSMS from "./AliyunSms.vue"; +import Apprise from "./Apprise.vue"; +import Bark from "./Bark.vue"; +import Bitrix24 from "./Bitrix24.vue"; +import ClickSendSMS from "./ClickSendSMS.vue"; +import CallMeBot from "./CallMeBot.vue"; +import SMSC from "./SMSC.vue"; +import DingDing from "./DingDing.vue"; +import Discord from "./Discord.vue"; +import Elks from "./46elks.vue"; +import Feishu from "./Feishu.vue"; +import FreeMobile from "./FreeMobile.vue"; +import GoogleChat from "./GoogleChat.vue"; +import Gorush from "./Gorush.vue"; +import Gotify from "./Gotify.vue"; +import GrafanaOncall from "./GrafanaOncall.vue"; +import GtxMessaging from "./GtxMessaging.vue"; +import HomeAssistant from "./HomeAssistant.vue"; +import HeiiOnCall from "./HeiiOnCall.vue"; +import Keep from "./Keep.vue"; +import Kook from "./Kook.vue"; +import Line from "./Line.vue"; +import LineNotify from "./LineNotify.vue"; +import LunaSea from "./LunaSea.vue"; +import Matrix from "./Matrix.vue"; +import Mattermost from "./Mattermost.vue"; +import Nostr from "./Nostr.vue"; +import Ntfy from "./Ntfy.vue"; +import Octopush from "./Octopush.vue"; +import OneBot from "./OneBot.vue"; +import Onesender from "./Onesender.vue"; +import Opsgenie from "./Opsgenie.vue"; +import PagerDuty from "./PagerDuty.vue"; +import FlashDuty from "./FlashDuty.vue"; +import PagerTree from "./PagerTree.vue"; +import PromoSMS from "./PromoSMS.vue"; +import Pushbullet from "./Pushbullet.vue"; +import PushDeer from "./PushDeer.vue"; +import Pushover from "./Pushover.vue"; +import Pushy from "./Pushy.vue"; +import RocketChat from "./RocketChat.vue"; +import ServerChan from "./ServerChan.vue"; +import SerwerSMS from "./SerwerSMS.vue"; +import Signal from "./Signal.vue"; +import SMSManager from "./SMSManager.vue"; +import SMSPartner from "./SMSPartner.vue"; +import Slack from "./Slack.vue"; +import Squadcast from "./Squadcast.vue"; +import SMSEagle from "./SMSEagle.vue"; +import Stackfield from "./Stackfield.vue"; +import STMP from "./SMTP.vue"; +import Teams from "./Teams.vue"; +import TechulusPush from "./TechulusPush.vue"; +import Telegram from "./Telegram.vue"; +import Threema from "./Threema.vue"; +import Twilio from "./Twilio.vue"; +import Webhook from "./Webhook.vue"; +import WeCom from "./WeCom.vue"; +import GoAlert from "./GoAlert.vue"; +import ZohoCliq from "./ZohoCliq.vue"; +import Splunk from "./Splunk.vue"; +import SevenIO from "./SevenIO.vue"; +import Whapi from "./Whapi.vue"; +import Cellsynt from "./Cellsynt.vue"; +import WPush from "./WPush.vue"; +import SIGNL4 from "./SIGNL4.vue"; +import SendGrid from "./SendGrid.vue"; + +/** + * Manage all notification form. + * @type { Record<string, any> } + */ +const NotificationFormList = { + "alerta": Alerta, + "AlertNow": AlertNow, + "AliyunSMS": AliyunSMS, + "apprise": Apprise, + "Bark": Bark, + "Bitrix24": Bitrix24, + "clicksendsms": ClickSendSMS, + "CallMeBot": CallMeBot, + "smsc": SMSC, + "DingDing": DingDing, + "discord": Discord, + "Elks": Elks, + "Feishu": Feishu, + "FreeMobile": FreeMobile, + "GoogleChat": GoogleChat, + "gorush": Gorush, + "gotify": Gotify, + "GrafanaOncall": GrafanaOncall, + "HomeAssistant": HomeAssistant, + "HeiiOnCall": HeiiOnCall, + "Keep": Keep, + "Kook": Kook, + "line": Line, + "LineNotify": LineNotify, + "lunasea": LunaSea, + "matrix": Matrix, + "mattermost": Mattermost, + "nostr": Nostr, + "ntfy": Ntfy, + "octopush": Octopush, + "OneBot": OneBot, + "Onesender": Onesender, + "Opsgenie": Opsgenie, + "PagerDuty": PagerDuty, + "FlashDuty": FlashDuty, + "PagerTree": PagerTree, + "promosms": PromoSMS, + "pushbullet": Pushbullet, + "PushByTechulus": TechulusPush, + "PushDeer": PushDeer, + "pushover": Pushover, + "pushy": Pushy, + "rocket.chat": RocketChat, + "serwersms": SerwerSMS, + "signal": Signal, + "SIGNL4": SIGNL4, + "SMSManager": SMSManager, + "SMSPartner": SMSPartner, + "slack": Slack, + "squadcast": Squadcast, + "SMSEagle": SMSEagle, + "smtp": STMP, + "stackfield": Stackfield, + "teams": Teams, + "telegram": Telegram, + "threema": Threema, + "twilio": Twilio, + "Splunk": Splunk, + "webhook": Webhook, + "WeCom": WeCom, + "GoAlert": GoAlert, + "ServerChan": ServerChan, + "ZohoCliq": ZohoCliq, + "SevenIO": SevenIO, + "whapi": Whapi, + "gtxmessaging": GtxMessaging, + "Cellsynt": Cellsynt, + "WPush": WPush, + "SendGrid": SendGrid, +}; + +export default NotificationFormList; |