193 lines
9.3 KiB
Vue
193 lines
9.3 KiB
Vue
|
<template>
|
||
|
|
<div style="">
|
||
|
|
|
||
|
|
<v-container grid-list-md>
|
||
|
|
<v-layout row wrap>
|
||
|
|
<v-flex md12>
|
||
|
|
<h1>App {{ app.name }}</h1>
|
||
|
|
<v-card class="mx-auto" flat style="margin-top: 10px;">
|
||
|
|
<v-tabs
|
||
|
|
background-color="white"
|
||
|
|
color="fff"
|
||
|
|
left
|
||
|
|
|
||
|
|
>
|
||
|
|
<v-tab>Overview</v-tab>
|
||
|
|
<v-tab>API Access</v-tab>
|
||
|
|
<v-tab>Settings</v-tab>
|
||
|
|
<v-tab disabled>Users</v-tab>
|
||
|
|
|
||
|
|
<v-tab-item :key="1" :transition="false" :reverse-transition="false" >
|
||
|
|
<v-container style="padding-right: 0px; padding-left:0px;">
|
||
|
|
<img :src="imageUrl" style="float: right;width: 100px;">
|
||
|
|
<b>Description</b><br>
|
||
|
|
{{ app.description }}<br><br>
|
||
|
|
<a :href="app.url">{{ app.url }}</a>
|
||
|
|
</v-container>
|
||
|
|
|
||
|
|
</v-tab-item>
|
||
|
|
<v-tab-item :key="2" :transition="false" :reverse-transition="false">
|
||
|
|
<v-container style="padding-right: 0px; padding-left:0px;">
|
||
|
|
<h2>oAuth Token</h2>
|
||
|
|
<p>
|
||
|
|
Here are the oAuth API-Keys. You use this Keys to start the oAuth authorization work flow.
|
||
|
|
</p>
|
||
|
|
<v-text-field
|
||
|
|
label="API Key"
|
||
|
|
:value="app.apiKey"
|
||
|
|
hint="You can't edit this"
|
||
|
|
></v-text-field>
|
||
|
|
<v-text-field
|
||
|
|
label="API Secret"
|
||
|
|
:value="app.apiSecret"
|
||
|
|
hint="You can't edit this"
|
||
|
|
></v-text-field>
|
||
|
|
<br>
|
||
|
|
<h2>API Access</h2>
|
||
|
|
<p>
|
||
|
|
You can access the API to get informations about this APP with the following API Credentials:
|
||
|
|
<v-text-field
|
||
|
|
label="API Token"
|
||
|
|
value=""
|
||
|
|
disabled
|
||
|
|
></v-text-field>
|
||
|
|
<v-text-field
|
||
|
|
label="Refresh Token"
|
||
|
|
value=""
|
||
|
|
disabled
|
||
|
|
></v-text-field>
|
||
|
|
<h2>Development Access</h2>
|
||
|
|
<p>
|
||
|
|
To test the App you can use the following Developer Access and Refresh token, they are connected to your user.
|
||
|
|
<v-text-field
|
||
|
|
label="Access Token"
|
||
|
|
value=""
|
||
|
|
disabled
|
||
|
|
></v-text-field>
|
||
|
|
<v-text-field
|
||
|
|
label="Refresh Token"
|
||
|
|
value=""
|
||
|
|
disabled
|
||
|
|
></v-text-field>
|
||
|
|
</p>
|
||
|
|
</v-container>
|
||
|
|
</v-tab-item>
|
||
|
|
<v-tab-item :key="3" :transition="false" :reverse-transition="false">
|
||
|
|
<v-container style="padding-right: 0px; padding-left:0px;">
|
||
|
|
<v-layout>
|
||
|
|
<v-flex md8>
|
||
|
|
<v-text-field
|
||
|
|
label="App Name"
|
||
|
|
:value="app.name"
|
||
|
|
></v-text-field>
|
||
|
|
<v-text-field
|
||
|
|
label="URL"
|
||
|
|
:value="app.url"
|
||
|
|
></v-text-field>
|
||
|
|
<v-textarea
|
||
|
|
label="Description"
|
||
|
|
:value="app.description"
|
||
|
|
|
||
|
|
></v-textarea>
|
||
|
|
<v-text-field
|
||
|
|
label="Direct Login URL"
|
||
|
|
:value="app.directUrl"
|
||
|
|
hint="URL to login with this oAuth Provider"
|
||
|
|
></v-text-field>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.testingWarning"
|
||
|
|
label="Testing Warning"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.untrustedWarning"
|
||
|
|
label="Untrusted Warning"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.autoAccept"
|
||
|
|
label="Auto Accept"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.showOnWebpage"
|
||
|
|
label="Show on Webpage"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.stopAutoRedirect"
|
||
|
|
label="Stop Auto Redirect"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.hideInAppList"
|
||
|
|
label="Hide in App List"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
<v-checkbox
|
||
|
|
v-model="app.properties.userCantRemoveApp"
|
||
|
|
label="Disabled user possible to remove App-Access"
|
||
|
|
disabled
|
||
|
|
></v-checkbox>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</v-flex>
|
||
|
|
<v-flex md4>
|
||
|
|
IMAGE
|
||
|
|
</v-flex>
|
||
|
|
</v-layout>
|
||
|
|
</v-container>
|
||
|
|
</v-tab-item>
|
||
|
|
<v-tab-item :key="4" :transition="false" :reverse-transition="false">
|
||
|
|
<v-container style="padding-right: 0px; padding-left:0px;">
|
||
|
|
|
||
|
|
</v-container>
|
||
|
|
</v-tab-item>
|
||
|
|
|
||
|
|
</v-tabs>
|
||
|
|
</v-card>
|
||
|
|
</v-flex>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</v-layout>
|
||
|
|
</v-container>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import ServerService from '../services/Server'
|
||
|
|
import UserService from '../services/User'
|
||
|
|
import LoginComponent from '../components/Login'
|
||
|
|
import AppService from '../services/Apps'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
app: null,
|
||
|
|
imageUrl: ''
|
||
|
|
}
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
"Login": LoginComponent
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
|
||
|
|
},
|
||
|
|
mounted: function() {
|
||
|
|
AppService.getApp(this.$route.params.id).then((res) => {
|
||
|
|
this.app = res.data.data;
|
||
|
|
})
|
||
|
|
this.imageUrl = AppService.getAppImage(this.$route.params.id);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
|
||
|
|
</style>
|