112 lines
3.2 KiB
Vue
112 lines
3.2 KiB
Vue
<template lang="pug">
|
|
modal(:show='show', @close='close')
|
|
.modal-header
|
|
h3(v-if="id > 0") Edit Client
|
|
h3(v-else) New Client
|
|
.modal-body.aligned-form
|
|
.message.error(v-if='error') {{ error }}
|
|
.cell
|
|
label(for="title") Title
|
|
input(type="text" id="title" name="title" v-model="title")
|
|
.cell
|
|
label(for="description") Description
|
|
input(type="text" id="description" name="description" v-model="description")
|
|
.cell
|
|
label(for="url") URL
|
|
input(type="text" id="url" name="url" v-model="url")
|
|
.cell
|
|
label(for="scope") Scope
|
|
input(type="text" id="scope" name="scope" v-model="scope")
|
|
.cell
|
|
label(for="redirect_url") Redirect
|
|
input(type="text" id="redirect_url" name="redirect_url" v-model="redirect_url")
|
|
.cell
|
|
label(for="verified") Verified
|
|
input(type="checkbox" id="verified" name="verified" v-model="verified")
|
|
.modal-footer.text-align
|
|
button(@click='submit') Done
|
|
button(@click='newSecret' v-if="id > 0") New Secret
|
|
button(@click='close') Cancel
|
|
</template>
|
|
|
|
<script type="text/javascript">
|
|
import Modal from './Modal.vue'
|
|
const csrfToken = document.querySelector('meta[name="csrf-token"]').content
|
|
|
|
export default {
|
|
props: ['show', 'id'],
|
|
data: function () {
|
|
return {
|
|
error: '',
|
|
title: '',
|
|
description: '',
|
|
scope: '',
|
|
url: '',
|
|
redirect_url: '',
|
|
verified: false
|
|
}
|
|
},
|
|
components: {
|
|
Modal
|
|
},
|
|
methods: {
|
|
close: function () {
|
|
this.$emit('close')
|
|
this.error = ''
|
|
this.title = ''
|
|
this.description = ''
|
|
this.scope = ''
|
|
this.url = ''
|
|
this.redirect_url = ''
|
|
this.verified = false
|
|
},
|
|
submit: function () {
|
|
let url = this.id === -1 ? 'new' : 'update'
|
|
|
|
this.$http.post('/admin/api/client/' + url, {
|
|
id: this.id,
|
|
title: this.title,
|
|
description: this.description,
|
|
scope: this.scope,
|
|
url: this.url,
|
|
redirect_url: this.redirect_url,
|
|
verified: this.verified,
|
|
csrf: csrfToken
|
|
}).then(data => {
|
|
this.close()
|
|
this.$root.$emit('reload_clients')
|
|
}).catch(err => {
|
|
console.error(err)
|
|
if (err.body && err.body.error) this.error = err.body.error
|
|
})
|
|
},
|
|
newSecret: function () {
|
|
this.$http.post('/admin/api/client/new_secret/' + this.id).then(data => {
|
|
alert('New secret generated.')
|
|
this.$root.$emit('reload_clients')
|
|
}).catch(err => {
|
|
this.error = 'Failed to generate new secret.'
|
|
})
|
|
}
|
|
},
|
|
watch: {
|
|
id: function () {
|
|
if (this.id <= 0) return
|
|
this.$http.get('/admin/api/client/' + this.id).then(data => {
|
|
let dr = data.body
|
|
|
|
this.title = dr.title
|
|
this.description = dr.description
|
|
this.scope = dr.scope
|
|
this.url = dr.url
|
|
this.redirect_url = dr.redirect_url
|
|
this.verified = dr.verified
|
|
}).catch(err => {
|
|
alert('Failed to fetch client data')
|
|
this.close()
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|