evcc-io/assets/js/components/Savings/SponsorTokenExpires.vue
Michael Geers 4163748e50
Config UI: improve sponsor token flow (#22989)
Co-authored-by: andig <andi@evcc.io>
Co-authored-by: andig <cpuidle@gmail.com>
2025-08-15 10:02:14 +00:00

45 lines
1 KiB
Vue

<template>
<div v-if="expiresSoon" class="alert alert-warning my-4" role="alert">
<i18n-t tag="div" keypath="settings.sponsorToken.expires" scope="global">
<template #inXDays>
{{ inXDays }}
</template>
<template #getNewToken>
<a href="https://sponsor.evcc.io" target="_blank" class="text-danger">
{{ $t("settings.sponsorToken.getNew") }}
</a>
</template>
</i18n-t>
<em v-if="!isTrial" class="d-block mt-2">
{{ $t("settings.sponsorToken.hint") }}
</em>
</div>
</template>
<script lang="ts">
import formatter from "@/mixins/formatter";
import { TRIAL } from "./Sponsor.vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "SponsorTokenExpires",
mixins: [formatter],
props: {
expiresSoon: Boolean,
expiresAt: String,
name: String,
fromYaml: Boolean,
},
computed: {
inXDays() {
return this.expiresAt
? this.fmtTimeAgo(new Date(this.expiresAt).getTime() - new Date().getTime())
: "";
},
isTrial() {
return this.name === TRIAL;
},
},
});
</script>