<!DOCTYPE html>
<html>

<head>
    <title>smartpager.network Interface</title>
    <!-- <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet"> -->
    <link href="css/materialdesignicons.min.css" rel="stylesheet">
    <link href="css/vuetify.min.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>

<body>
    <div id="app">
        <v-app>
            <v-app-bar app>
                <v-toolbar-title>smartpager.network Interface</v-toolbar-title>
                <v-spacer></v-spacer>
            </v-app-bar>
            <v-main>
                <v-tabs v-model="configTab" next-icon="mdi-arrow-right-bold-box-outline" prev-icon="mdi-arrow-left-bold-box-outline" show-arrows>
                    <v-tab key="dispatcher">Dispatcher</v-tab>
                    <v-tab key="dispatcher_cfg">Dispatcher Config</v-tab>
                    <v-tab key="dwd">DWD</v-tab>
                    <v-tab key="nina">MOWAS/BBK</v-tab>
                    <v-tab key="testalarm">Testalarm</v-tab>
                    <v-tab key="tg">Telegram</v-tab>
                </v-tabs>
                <v-tabs-items v-model="configTab">
                    <v-tab-item key="dispatcher">
                        <iframe src="/disp_main/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                    <v-tab-item key="dispatcher_cfg">
                        <iframe src="/disp_cfg/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                    <v-tab-item key="dwd">
                        <iframe src="/msg-dwd_cfg/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                    <v-tab-item key="nina">
                        <iframe src="/msg-mowas_cfg/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                    <v-tab-item key="testalarm">
                        <iframe src="/msg-testalarm_cfg/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                    <v-tab-item key="tg">
                        <iframe src="/msg-tg_cfg/" style="width: 100%; height: 50rem; display: block;"></iframe>
                    </v-tab-item>
                </v-tabs-items>
            </v-main>
        </v-app>
    </div>

    <script src="js/vue/vue.js"></script>
    <script src="js/vue/vuetify.js"></script>
    <script src="js/vue/vue-resource_1.5.1.js"></script>
    <script>
        new Vue({
            el: '#app',
            vuetify: new Vuetify(),
            http: { root: '/' },
            data() {
                return {
                    EXPERTMODE: false,
                    configTab: null,
                }
            },
            created() {
            },
            methods: {
            }
        })
    </script>
</body>

</html>