mirror of
https://github.com/knadh/listmonk.git
synced 2025-03-01 08:45:28 +08:00
Add one-click provider config shortcut in OIDC settings.
This commit is contained in:
parent
4eabd967d8
commit
193f8a866b
1 changed files with 54 additions and 7 deletions
|
@ -8,21 +8,33 @@
|
|||
</div>
|
||||
<div class="column is-8">
|
||||
<b-field :label="$t('settings.security.OIDCURL')" label-position="on-border">
|
||||
<div>
|
||||
<b-input v-model="data['security.oidc']['provider_url']" name="oidc.provider_url"
|
||||
placeholder="https://login.yoursite.com" :disabled="!data['security.oidc']['enabled']" :maxlength="300"
|
||||
required type="url" pattern="https?://.*" />
|
||||
|
||||
<div class="spaced-links is-size-7 mt-2" :class="{ 'disabled': !data['security.oidc']['enabled'] }">
|
||||
<a href="#" @click.prevent="() => setProvider(n, 'google')">Google</a>
|
||||
<a href="#" @click.prevent="() => setProvider(n, 'github')">GitHub</a>
|
||||
<a href="#" @click.prevent="() => setProvider(n, 'microsoft')">Microsoft</a>
|
||||
<a href="#" @click.prevent="() => setProvider(n, 'apple')">Apple</a>
|
||||
</div>
|
||||
</div>
|
||||
</b-field>
|
||||
|
||||
<b-field :label="$t('settings.security.OIDCClientID')" label-position="on-border">
|
||||
<b-input v-model="data['security.oidc']['client_id']" name="oidc.client_id"
|
||||
<b-input v-model="data['security.oidc']['client_id']" name="oidc.client_id" ref="client_id"
|
||||
:disabled="!data['security.oidc']['enabled']" :maxlength="200" required />
|
||||
</b-field>
|
||||
|
||||
<b-field :label="$t('settings.security.OIDCClientSecret')" label-position="on-border">
|
||||
<b-input v-model="data['security.oidc']['client_secret']" name="oidc.client_secret" type="password"
|
||||
:disabled="!data['security.oidc']['enabled']" :maxlength="200" required />
|
||||
</b-field>
|
||||
<p class="is-size-7">
|
||||
<b-icon icon="warning-empty" /> {{ $t('settings.security.OIDCWarning') }}
|
||||
</p>
|
||||
|
||||
<b-field :label="$t('settings.security.OIDCRedirectURL')">
|
||||
<code><copy-text :text="`${serverConfig.root_url}/auth/oidc`" /></code>
|
||||
</b-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -50,14 +62,49 @@
|
|||
|
||||
<script>
|
||||
import Vue from 'vue';
|
||||
import { mapState } from 'vuex';
|
||||
import CopyText from '../../components/CopyText.vue';
|
||||
|
||||
const OIDC_PROVIDERS = {
|
||||
google: 'https://accounts.google.com',
|
||||
github: 'https://token.actions.githubusercontent.com',
|
||||
microsoft: 'https://login.microsoftonline.com/{TENANT_HERE}/v2.0',
|
||||
apple: 'https://appleid.apple.com',
|
||||
};
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
CopyText,
|
||||
},
|
||||
|
||||
props: {
|
||||
form: {
|
||||
type: Object, default: () => { },
|
||||
},
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['serverConfig']),
|
||||
|
||||
version() {
|
||||
return import.meta.env.VUE_APP_VERSION;
|
||||
},
|
||||
|
||||
isMobile() {
|
||||
return this.windowWidth <= 768;
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
setProvider(n, provider) {
|
||||
this.$set(this.data['security.oidc'], 'provider_url', OIDC_PROVIDERS[provider]);
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.$refs.client_id.focus();
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
data: this.form,
|
||||
|
|
Loading…
Reference in a new issue