added a new settings page for sso

This commit is contained in:
David Leimroth 2022-02-07 14:32:54 +01:00
parent d2395a5896
commit 2cd622cb89
4 changed files with 274 additions and 1 deletions

View File

@ -76,6 +76,11 @@ export default {
id: 'config-stats',
title: 'Your Stats',
path: '/config/stats'
},
{
id: 'config-sso',
title: 'SSO',
path: '/config/sso'
}
]
},

129
client/pages/config/sso.vue Normal file
View File

@ -0,0 +1,129 @@
<template>
<div>
<!-- <div class="h-0.5 bg-primary bg-opacity-50 w-full" /> -->
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
<div class="flex items-center mb-2">
<h1 class="text-xl">SSO Provider Settings</h1>
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">Issuer&nbsp;</p>
<ui-text-input v-model="oidc.issuer" :disabled="updatingSSOSettings" @input="updateSSOIssuer" />
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">Authorization URL&nbsp;</p>
<ui-text-input v-model="oidc.authorizationURL" :disabled="updatingSSOSettings" @input="updateAuthorizationURL" />
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">Token URL&nbsp;</p>
<ui-text-input v-model="oidc.tokenURL" :disabled="updatingSSOSettings" @input="updateSSOIssuer" />
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">User Info URL&nbsp;</p>
<ui-text-input v-model="oidc.userInfoURL" :disabled="updatingSSOSettings" @input="updateSSOIssuer" />
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">Client ID&nbsp;</p>
<ui-text-input v-model="oidc.clientID" :disabled="updatingSSOSettings" @input="updateSSOIssuer" />
</div>
<div class="flex items-center py-2">
<p class="pl-4 text-lg">Client Secret&nbsp;</p>
<ui-text-input type="password" v-model="oidc.clientSecret" :disabled="updatingSSOSettings" @input="updateSSOIssuer" />
</div>
<div class="flex items-center mb-2">
<h1 class="text-xl">User Settings</h1>
</div>
<div class="flex items-center mb-2">
<ui-btn @click="saveSSOSettings">Save</ui-btn>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
oidc: {
issuer: "",
authorizationURL: "",
tokenURL: "",
userInfoURL: "",
clientID: "",
clientSecret: "",
},
updatingSSOSettings: false,
newSSOSettings: {}
}
},
watch: {
SSOSettings(newVal, oldVal) {
if (newVal && !oldVal) {
this.newSSOSettings = { ...this.SSOSettings }
this.initSSOSettings()
}
}
},
computed: {
SSOSettings() {
return this.$store.state.SSOSettings
},
},
methods: {
updateSSOIssuer(val) {
return
this.updateSSOSettings({
issuer: val
})
},
updateAuthorizationURL(val) {
return
this.updateSSOSettings({
authorizationURL: val
})
},
saveSSOSettings(payload) {
console.log(this)
this.updatingSSOSettings = true
this.$store
.dispatch('updateSSOSettings', payload)
.then((success) => {
console.log('Updated SSO Settings', success)
this.updatingSSOSettings = false
})
.catch((error) => {
console.error('Failed to update SSO settings', error)
this.updatingSSOSettings = false
})
},
initSSOSettings() {
this.newSSOSettings = this.SSOSettings ? { ...this.SSOSettings } : {}
this.oidc.issuer = this.newSSOSettings.issuer
this.oidc.authorizationURL = this.newSSOSettings.authorizationURL
this.oidc.tokenURL = this.newSSOSettings.tokenURL
this.oidc.userInfoURL = this.newSSOSettings.userInfoURL
this.oidc.clientID = this.newSSOSettings.clientID
this.oidc.clientSecret = this.newSSOSettings.clientSecret
this.updatingSSOSettings = this.newSSOSettings.updatingSSOSettings
// this.newSSOSettings.coverDestination === this.$constants.CoverDestination.AUDIOBOOK
// this.useSquareBookCovers = this.newSSOSettings.coverAspectRatio === this.$constants.BookCoverAspectRatio.SQUARE
// this.useAlternativeBookshelfView = this.newSSOSettings.bookshelfView === this.$constants.BookshelfView.TITLES
},
},
mounted() {
this.initSSOSettings()
}
}
</script>

View File

@ -32,6 +32,10 @@ export const getters = {
if (!state.serverSettings) return null
return state.serverSettings[key]
},
getSSOSetting: state => key => {
if (!state.SSOSettings) return null
return state.getSSOSettings[key]
},
getBookCoverAspectRatio: state => {
if (!state.serverSettings || !state.serverSettings.coverAspectRatio) return 1.6
return state.serverSettings.coverAspectRatio === 0 ? 1.6 : 1
@ -59,6 +63,22 @@ export const actions = {
return false
})
},
updateSSOSettings({ commit }, payload) {
var updatePayload = {
...payload
}
return this.$axios.$patch('/api/SSOSettings', updatePayload).then((result) => {
if (result.success) {
commit('setSSOSettings', result.SSOSettings)
return true
} else {
return false
}
}).catch((error) => {
console.error('Failed to update server settings', error)
return false
})
},
checkForUpdate({ commit }) {
return checkForUpdate()
.then((res) => {
@ -104,7 +124,11 @@ export const mutations = {
},
setServerSettings(state, settings) {
if (!settings) return
state.serverSettings = settings
state.SSOSettings = settings
},
setSSOSettings(state, settings) {
if (!settings) return
state.SSOSettings = settings
},
setStreamAudiobook(state, audiobook) {
state.playOnLoad = true

115
client/store/sso.js Normal file
View File

@ -0,0 +1,115 @@
import Vue from 'vue'
const defaultSSOSettings = {
oidc: {
issuer: "",
authorizationURL: "",
tokenURL: "",
userInfoURL: "",
clientID: "",
clientSecret: "",
callbackURL: "/oidc/callback",
scope: "openid email profile"
},
user: {
createNewUser: false,
isActive: true,
settings: {
mobileOrderBy: 'recent',
mobileOrderDesc: true,
mobileFilterBy: 'all',
orderBy: 'book.title',
orderDesc: false,
filterBy: 'all',
playbackRate: 1,
bookshelfCoverSize: 120,
collapseSeries: false
},
permissions: {
download: false,
update: false,
delete: false,
upload: false,
accessAllLibraries: false
}
}
}
export const state = () => defaultSSOSettings
export const getters = {
getSSOIssuer: (state) => state.oidc.issuer,
getSSOAuthorizationURL: (state) => state.oidc.authorizationURL,
getSSOTokenURL: (state) => state.oidc.tokenURL,
getSSOUserInfoURL: (state) => state.oidc.userInfoURL,
getSSOClientID: (state) => state.oidc.clientID,
getSSOClientSecret: (state) => state.oidc.clientSecret,
getSSOCallbackURL: (state) => state.oidc.callbackURL,
getSSOScope: (state) => state.oidc.scope,
getUserCreateNewUser: (state) => state.user.createNewUser,
getUserIsActive: (state) => state.user.isActive,
getUserPermissionDownload: (state) => state.user.permissions.download,
getUserPermissionUpdate: (state) => state.user.permissions.update,
getUserPermissionDelete: (state) => state.user.permissions.delete,
getUserPermissionUpload: (state) => state.user.permissions.upload,
getUserPermissionAccessAllLibraries: (state) => state.user.permissions.accessAllLibraries,
}
export const actions = {
updateUserSettings({ commit }, payload) {
var updatePayload = {
...payload
}
// Immediately update
commit('setSSOSettings', updatePayload)
return this.$axios.$patch('/api/sso/settings', updatePayload).then((result) => {
if (result.success) {
commit('setSSOSettings', result.settings)
return true
} else {
return false
}
}).catch((error) => {
console.error('Failed to update sso settings', error)
return false
})
},
loadSSOSettings({ state, commit }) {
return defaultSSOSettings
if (state.collectionsLoaded) {
console.log('Collections already loaded')
return state.collections
}
return this.$axios.$get('/api/collections').then((collections) => {
commit('setCollections', collections)
return collections
}).catch((error) => {
console.error('Failed to get collections', error)
return []
})
}
}
export const mutations = {
setSSOSettings(state, settings) {
if (!settings) return
for (const key in settings) {
if (state.oidc[key] !== settings[key]) {
state.oidc[key] = settings[key]
}
}
},
setUserPermissions(state, permissions) {
if (!permissions) return
for (const key in permissions) {
if (state.user.permissions[key] !== permissions[key]) {
state.user.permissions[key] = permissions[key]
}
}
},
}