ric/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-11-30 18:24:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

improve notification component, no double template

Browse source
This commit is contained in:
LouisLam 2021-09-08 10:25:03 +08:00
parent 5ca0dd628d
commit f7562e00c1
2 changed files with 31 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/NotificationDialog.vue
View file

@ -37,7 +37,7 @@
<input id="name" v-model="notification.name" type="text" class="form-control" required> <input id="name" v-model="notification.name" type="text" class="form-control" required>
</div> </div>
<Telegram></Telegram> <Telegram v-if="notification.type === 'telegram'"></Telegram>
<!-- TODO: Convert all into vue components, but not an easy task. --> <!-- TODO: Convert all into vue components, but not an easy task. -->

62
src/components/notifications/Telegram.vue
View file

@ -1,42 +1,40 @@
<template> <template>
<template v-if="$parent.notification.type === name"> <div class="mb-3">
<div class="mb-3"> <label for="telegram-bot-token" class="form-label">Bot Token</label>
<label for="telegram-bot-token" class="form-label">Bot Token</label> <HiddenInput id="telegram-bot-token" v-model="$parent.notification.telegramBotToken" :required="true" autocomplete="one-time-code"></HiddenInput>
<HiddenInput id="telegram-bot-token" v-model="$parent.notification.telegramBotToken" :required="true" autocomplete="one-time-code"></HiddenInput> <div class="form-text">
<div class="form-text"> You can get a token from <a href="https://t.me/BotFather" target="_blank">https://t.me/BotFather</a>.
You can get a token from <a href="https://t.me/BotFather" target="_blank">https://t.me/BotFather</a>. </div>
</div> </div>
<div class="mb-3">
<label for="telegram-chat-id" class="form-label">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>
<div class="mb-3"> <div class="form-text">
<label for="telegram-chat-id" class="form-label">Chat ID</label> Support Direct Chat / Group / Channel's Chat ID
<div class="input-group mb-3"> <p style="margin-top: 8px;">
<input id="telegram-chat-id" v-model="$parent.notification.telegramChatID" type="text" class="form-control" required> You can get your chat id by sending message to the bot and go to this url to view the chat_id:
<button v-if="$parent.notification.telegramBotToken" class="btn btn-outline-secondary" type="button" @click="autoGetTelegramChatID"> </p>
{{ $t("Auto Get") }}
</button>
</div>
<div class="form-text"> <p style="margin-top: 8px;">
Support Direct Chat / Group / Channel's Chat ID <template v-if="$parent.notification.telegramBotToken">
<a :href="telegramGetUpdatesURL" target="_blank" style="word-break: break-word;">{{ telegramGetUpdatesURL }}</a>
</template>
<p style="margin-top: 8px;"> <template v-else>
You can get your chat id by sending message to the bot and go to this url to view the chat_id: {{ telegramGetUpdatesURL }}
</p> </template>
</p>
<p style="margin-top: 8px;">
<template v-if="$parent.notification.telegramBotToken">
<a :href="telegramGetUpdatesURL" target="_blank" style="word-break: break-word;">{{ telegramGetUpdatesURL }}</a>
</template>
<template v-else>
{{ telegramGetUpdatesURL }}
</template>
</p>
</div>
</div> </div>
</template> </div>
</template> </template>
<script> <script>