<template>
    <div style="margin-top: 50px;">
        <v-container grid-list-md pa-10>
            <v-layout row wrap>
                <v-flex md12>
                    <h1>App Detail: {{ app.name }}</h1>
                    <p>{{ app.description }}</p>
                    <a :href="app.url">{{ app.url }}</a>

                    <hr>
                    <v-simple-table>
                        <template v-slot:default>
                            <thead>
                            <tr>
                                <th class="text-left">Name</th>
                                <th class="text-left">Description</th>
                                <th class="text-right"></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>Auto Accept</td>
                                <td>User dont have to click login, if the user is logged in he/she will immediately redirected back.</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.autoAccept"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Testing Warning</td>
                                <td>Show warning that the Application is just in testing mode</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.testingWarning"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Untrusted Warning</td>
                                <td>Show warning that the Application is untrusted</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.untrustedWarning"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Show on Webpage</td>
                                <td>Show this App on the Webpage.</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.showOnWebpage"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Hide in App list</td>
                                <td>User cant see this App in his app list</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.hideInAppList"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Disable remove Access</td>
                                <td>User can't remove Access to this App in the AppList</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.userCantRemoveApp"></v-checkbox></td>
                            </tr>
                            <tr>
                                <td>Disable auto redirect</td>
                                <td>User always have to click a button to go to the App</td>
                                <td class="text-right"><v-checkbox v-model="app.properties.stopAutoRedirect"></v-checkbox></td>
                            </tr>
                            </tbody>
                        </template>
                    </v-simple-table>
                    <v-btn
                            color="success"
                            @click="save"
                    >
                        Save
                    </v-btn>
                </v-flex>
            </v-layout>
        </v-container>


    </div>

</template>

<script>

    import AdminService from '../../services/Admin'
    import AppService from '../../services/Apps'

    export default {
        data () {
            return {
                app: {}
            }
        },
        components: {
        },
        methods: {
            'loadApp': function () {
                AppService.getApp(this.$route.params.id).then((res) => {
                    this.app = res.data.data
                });
            },
            'save': function () {
                AdminService.saveAppProperties(this.$route.params.id, this.app.properties).then((res) => {
                    alert("Changes saved");
                    this.loadApp();
                }).catch((res) => {
                   alert("Something go wrong");
                });
            }
        },
        mounted: function() {
            this.loadApp();
        }
    }
</script>

