forked from vikunja/frontend
Compare commits
21 Commits
main
...
feature/ca
Author | SHA1 | Date | |
---|---|---|---|
ef69fd28b2 | |||
e08c3a3594 | |||
6063c03c2f | |||
1c9f2b53ec | |||
dd9dbc0103 | |||
7d43bbad4e | |||
e57615c020 | |||
9820fcba31 | |||
2d71897581 | |||
5106be028c | |||
92238df2d5 | |||
9c4585bf1d | |||
2405f958b1 | |||
e4af8a950a | |||
e2fc5e940d | |||
c49fd997d2 | |||
4f7a78b432 | |||
79dd9ac30e | |||
700691ef33 | |||
5432981f58 | |||
6404f475ff |
|
@ -95,9 +95,16 @@
|
||||||
"disableSuccess": "Two factor authentication was sucessfully disabled."
|
"disableSuccess": "Two factor authentication was sucessfully disabled."
|
||||||
},
|
},
|
||||||
"caldav": {
|
"caldav": {
|
||||||
"title": "Caldav",
|
"title": "CalDAV",
|
||||||
"howTo": "You can connect Vikunja to caldav clients to view and manage all tasks from different clients. Enter this url into your client:",
|
"howTo": "You can connect Vikunja to CalDAV clients to view and manage all tasks from different clients. Enter this url into your client:",
|
||||||
"more": "More information about caldav in Vikunja"
|
"more": "More information about CalDAV in Vikunja",
|
||||||
|
"tokens": "CalDAV Tokens",
|
||||||
|
"tokensHowTo": "You can use a CalDAV token to use instead of a password to log in the above endpoint.",
|
||||||
|
"createToken": "Create a token",
|
||||||
|
"tokenCreated": "Here is your token: {token}",
|
||||||
|
"wontSeeItAgain": "Write it down, you won't be able to see it again.",
|
||||||
|
"mustUseToken": "You need to create a CalDAV token if you want to use CalDAV with a third party client. Use the token as the password.",
|
||||||
|
"usernameIs": "Your username is: {0}"
|
||||||
},
|
},
|
||||||
"avatar": {
|
"avatar": {
|
||||||
"title": "Avatar",
|
"title": "Avatar",
|
||||||
|
@ -476,7 +483,10 @@
|
||||||
"showMenu": "Show the menu",
|
"showMenu": "Show the menu",
|
||||||
"hideMenu": "Hide the menu",
|
"hideMenu": "Hide the menu",
|
||||||
"forExample": "For example:",
|
"forExample": "For example:",
|
||||||
"welcomeBack": "Welcome Back!"
|
"welcomeBack": "Welcome Back!",
|
||||||
|
"id": "ID",
|
||||||
|
"created": "Created at",
|
||||||
|
"actions": "Actions"
|
||||||
},
|
},
|
||||||
"input": {
|
"input": {
|
||||||
"resetColor": "Reset Color",
|
"resetColor": "Reset Color",
|
||||||
|
|
15
src/models/caldavToken.js
Normal file
15
src/models/caldavToken.js
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import AbstractModel from './abstractModel'
|
||||||
|
|
||||||
|
export default class CaldavTokenModel extends AbstractModel {
|
||||||
|
constructor(data) {
|
||||||
|
super(data)
|
||||||
|
this.created = new Date(this.created)
|
||||||
|
}
|
||||||
|
|
||||||
|
defaults() {
|
||||||
|
return {
|
||||||
|
id: 0,
|
||||||
|
created: null,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
25
src/services/caldavToken.js
Normal file
25
src/services/caldavToken.js
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
import {formatISO} from 'date-fns'
|
||||||
|
import CaldavTokenModel from '../models/caldavToken'
|
||||||
|
import AbstractService from './abstractService'
|
||||||
|
|
||||||
|
export default class CaldavTokenService extends AbstractService {
|
||||||
|
constructor() {
|
||||||
|
super({
|
||||||
|
getAll: '/user/settings/token/caldav',
|
||||||
|
create: '/user/settings/token/caldav',
|
||||||
|
delete: '/user/settings/token/caldav/{id}',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
processModel(model) {
|
||||||
|
return {
|
||||||
|
...model,
|
||||||
|
created: formatISO(new Date(model.created)),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
modelFactory(data) {
|
||||||
|
return new CaldavTokenModel(data)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -16,40 +16,105 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<h5 class="mt-5 mb-4 has-text-weight-bold">
|
||||||
|
{{ $t('user.settings.caldav.tokens') }}
|
||||||
|
</h5>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
<a href="https://vikunja.io/docs/caldav/" rel="noreferrer noopener nofollow" target="_blank">
|
{{ isLocalUser ? $t('user.settings.caldav.tokensHowTo') : $t('user.settings.caldav.mustUseToken') }}
|
||||||
|
<template v-if="!isLocalUser">
|
||||||
|
<br/>
|
||||||
|
<i18n-t keypath="user.settings.caldav.usernameIs">
|
||||||
|
<strong>{{ username }}</strong>
|
||||||
|
</i18n-t>
|
||||||
|
</template>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<table class="table" v-if="tokens.length > 0">
|
||||||
|
<tr>
|
||||||
|
<th>{{ $t('misc.id') }}</th>
|
||||||
|
<th>{{ $t('misc.created') }}</th>
|
||||||
|
<th class="has-text-right">{{ $t('misc.actions') }}</th>
|
||||||
|
</tr>
|
||||||
|
<tr v-for="tk in tokens" :key="tk.id">
|
||||||
|
<td>{{ tk.id }}</td>
|
||||||
|
<td>{{ formatDateShort(tk.created) }}</td>
|
||||||
|
<td class="has-text-right">
|
||||||
|
<x-button type="secondary" @click="deleteToken(tk)">
|
||||||
|
{{ $t('misc.delete') }}
|
||||||
|
</x-button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<Message v-if="newToken" class="mb-4">
|
||||||
|
{{ $t('user.settings.caldav.tokenCreated', {token: newToken.token}) }}<br/>
|
||||||
|
{{ $t('user.settings.caldav.wontSeeItAgain') }}
|
||||||
|
</Message>
|
||||||
|
|
||||||
|
<x-button icon="plus" class="mb-4" @click="createToken" :loading="service.loading">
|
||||||
|
{{ $t('user.settings.caldav.createToken') }}
|
||||||
|
</x-button>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
<a :href="CALDAV_DOCS" rel="noreferrer noopener nofollow" target="_blank">
|
||||||
{{ $t('user.settings.caldav.more') }}
|
{{ $t('user.settings.caldav.more') }}
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
</card>
|
</card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts" setup>
|
||||||
import copy from 'copy-to-clipboard'
|
import copy from 'copy-to-clipboard'
|
||||||
import {mapState} from 'vuex'
|
import {computed, ref} from 'vue'
|
||||||
import {CALDAV_DOCS} from '@/urls'
|
import {useI18n} from 'vue-i18n'
|
||||||
|
import {useStore} from 'vuex'
|
||||||
|
|
||||||
export default {
|
import {CALDAV_DOCS} from '@/urls'
|
||||||
name: 'user-settings-caldav',
|
import {useTitle} from '@/composables/useTitle'
|
||||||
data() {
|
import {success} from '@/message'
|
||||||
return {
|
import Message from '@/components/misc/message.vue'
|
||||||
caldavDocsUrl: CALDAV_DOCS,
|
import CaldavTokenService from '@/services/caldavToken'
|
||||||
}
|
import CaldavTokenModel from '@/models/caldavToken'
|
||||||
},
|
|
||||||
mounted() {
|
const service = new CaldavTokenService()
|
||||||
this.setTitle(`${this.$t('user.settings.caldav.title')} - ${this.$t('user.settings.title')}`)
|
|
||||||
},
|
function useTokens(): ref<CaldavTokenModel[]> {
|
||||||
computed: {
|
const tokens = ref<CaldavTokenModel[]>([])
|
||||||
caldavUrl() {
|
service.getAll()
|
||||||
return `${this.$store.getters['config/apiBase']}/dav/principals/${this.userInfo.username}/`
|
.then((t: CaldavTokenModel[]) => {
|
||||||
},
|
tokens.value = t
|
||||||
...mapState('config', ['caldavEnabled']),
|
})
|
||||||
...mapState({
|
return tokens
|
||||||
userInfo: state => state.auth.info,
|
}
|
||||||
}),
|
|
||||||
},
|
const tokens = useTokens()
|
||||||
methods: {
|
|
||||||
copy,
|
const store = useStore()
|
||||||
},
|
const {t} = useI18n()
|
||||||
|
|
||||||
|
useTitle(() => `${t('user.settings.caldav.title')} - ${t('user.settings.title')}`)
|
||||||
|
|
||||||
|
const caldavUrl = computed(() => `${store.getters['config/apiBase']}/dav/principals/${store.state.auth.info.username}/`)
|
||||||
|
const caldavEnabled = computed(() => store.state.config.caldavEnabled)
|
||||||
|
const isLocalUser = computed(() => store.state.auth.info?.isLocalUser)
|
||||||
|
const username = computed(() => store.state.auth.info?.username)
|
||||||
|
|
||||||
|
const newToken = ref(null)
|
||||||
|
|
||||||
|
async function createToken() {
|
||||||
|
newToken.value = await service.create({})
|
||||||
|
tokens.value.push(newToken.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
async function deleteToken(token: CaldavTokenModel) {
|
||||||
|
const r = await service.delete(token)
|
||||||
|
const i = tokens.value.findIndex(v => v.id === token.id)
|
||||||
|
if (i === -1) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
tokens.value.splice(i, 1)
|
||||||
|
success(r)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user