summaryrefslogtreecommitdiff
path: root/ATRI/plugins/manege/atri-manege/src
diff options
context:
space:
mode:
Diffstat (limited to 'ATRI/plugins/manege/atri-manege/src')
-rw-r--r--ATRI/plugins/manege/atri-manege/src/App.vue104
-rw-r--r--ATRI/plugins/manege/atri-manege/src/assets/.gitkeep0
-rw-r--r--ATRI/plugins/manege/atri-manege/src/components/HelloWorld.vue170
-rw-r--r--ATRI/plugins/manege/atri-manege/src/main.js12
-rw-r--r--ATRI/plugins/manege/atri-manege/src/plugins/vuetify.js7
-rw-r--r--ATRI/plugins/manege/atri-manege/src/router/index.js29
-rw-r--r--ATRI/plugins/manege/atri-manege/src/views/About.vue5
-rw-r--r--ATRI/plugins/manege/atri-manege/src/views/Home.vue15
8 files changed, 342 insertions, 0 deletions
diff --git a/ATRI/plugins/manege/atri-manege/src/App.vue b/ATRI/plugins/manege/atri-manege/src/App.vue
new file mode 100644
index 0000000..d04b4f2
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/App.vue
@@ -0,0 +1,104 @@
+<template>
+ <v-app>
+ <v-navigation-drawer app v-model="drawer" class="na-d-0">
+ <v-list
+ nav
+ dense
+ >
+ <v-list-item-group active-class="nattier-blue--text text--accent-4">
+ <v-list-item>
+ <v-list-item-icon>
+ <v-icon>mdi-home</v-icon>
+ </v-list-item-icon>
+ <v-list-item-title>主页 | Home</v-list-item-title>
+ </v-list-item>
+
+ <v-list-item>
+ <v-list-item-icon>
+ <v-icon>mdi-wrench</v-icon>
+ </v-list-item-icon>
+ <v-list-item-title>控制台 | Control</v-list-item-title>
+ </v-list-item>
+
+ <v-list-item>
+ <v-list-item-icon>
+ <v-icon>mdi-database</v-icon>
+ </v-list-item-icon>
+ <v-list-item-title>数据 | Data</v-list-item-title>
+ </v-list-item>
+
+ <v-list-item>
+ <v-list-item-icon>
+ <v-icon>mdi-comment-processing</v-icon>
+ </v-list-item-icon>
+ <v-list-item-title>聊天 | Chat</v-list-item-title>
+ </v-list-item>
+ </v-list-item-group>
+ </v-list>
+ </v-navigation-drawer>
+
+ <v-app-bar app color="white" flat>
+ <v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
+
+ <v-toolbar-title>ATRI Console</v-toolbar-title>
+
+ <v-spacer></v-spacer>
+
+ <v-btn href="https://jq.qq.com/?_wv=1027&k=iKLJzM1u" target="_blank" text>
+ <span class="mr-2">Discuss</span>
+ <v-icon small>mdi-qqchat</v-icon>
+ </v-btn>
+
+ <v-btn href="https://github.com/Kyomotoi/ATRI" target="_blank" text>
+ <span class="mr-2">GitHub</span>
+ <v-icon small>mdi-link-variant</v-icon>
+ </v-btn>
+ </v-app-bar>
+
+ <!-- 根据应用组件来调整你的内容 -->
+ <v-main>
+
+ <!-- 给应用提供合适的间距 -->
+ <v-container fluid>
+
+ <!-- 如果使用 vue-router -->
+ <router-view></router-view>
+ </v-container>
+ </v-main>
+
+ <v-footer app>
+ <v-divider></v-divider>
+ <v-container fluid>
+ <v-row align="center" justify="center">
+ <v-col class="text-center" cols="auto">
+ <span> <v-icon>mdi-copyright</v-icon> Yours <strong>Kyomotoi</strong> </span>
+ </v-col>
+ <v-col class="text-center" cols="auto">
+ <span> <v-icon>mdi-github</v-icon> <strong>ATRI</strong> </span>
+ </v-col>
+ </v-row>
+ </v-container>
+ </v-footer>
+ </v-app>
+</template>
+
+<script>
+
+export default {
+ name: 'App',
+
+ data: () => ({
+ drawer: true,
+ }),
+};
+</script>
+
+<style>
+.text-center.a:visited {
+ color: aliceblue;
+}
+
+.na-d-0 {
+ background-image: url("https://i.loli.net/2021/07/19/WlFanrZHRQxb5Ay.png");
+}
+</style> \ No newline at end of file
diff --git a/ATRI/plugins/manege/atri-manege/src/assets/.gitkeep b/ATRI/plugins/manege/atri-manege/src/assets/.gitkeep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/assets/.gitkeep
diff --git a/ATRI/plugins/manege/atri-manege/src/components/HelloWorld.vue b/ATRI/plugins/manege/atri-manege/src/components/HelloWorld.vue
new file mode 100644
index 0000000..0ff52c0
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/components/HelloWorld.vue
@@ -0,0 +1,170 @@
+<template>
+ <v-app>
+ <!-- Running 将由 Fastpi控制
+ 正常:Running。非正常(刷新即丢失页面)Error。
+ -->
+ <h1 class="h1-index">ATRI is Running</h1>
+
+ <v-divider></v-divider>
+
+ <v-col>
+ <h3 class="h3-index">主体状态 | Status</h3>
+ </v-col>
+ <v-container>
+ <v-col>
+ <v-row>
+ <v-card height="170" width="400" class="ma-1">
+ <!--同上:
+ 正常:Normal operation。断开:Waiting for connection-->
+ <v-card-title>WS状态 | Websocket Status</v-card-title>
+ <div class="text-center">
+ <v-chip
+ class="ma-2"
+ color="green"
+ text-color="white"
+ >
+ Normal operation
+ </v-chip>
+ </div>
+ </v-card>
+
+ <v-card height="170" width="400" class="ma-1">
+ <v-card-title>自身状态 | Self Status</v-card-title>
+ <div class="text-center">
+ <v-chip
+ class="ma-2"
+ color="green"
+ text-color="white"
+ >
+ Normal operation
+ </v-chip>
+ </div>
+ </v-card>
+ </v-row>
+ </v-col>
+ </v-container>
+
+ <v-divider></v-divider>
+
+ <v-col>
+ <h3 class="h3-index">记录仪 | Dashboard</h3>
+ <div id="container" class="test-box"></div>
+ </v-col>
+ </v-app>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+
+export default {
+ mounted() {
+ let myChart = echarts.init(document.getElementById("container"));
+ let option = {
+ title: {
+ subtext: '数据统计间隔:1分钟',
+ left: '10'
+ },
+ legend: {
+ data: ['接受信息', '发送信息', '服务调用速率', '服务调用失败速率']
+ },
+ color: ["#32c1e5", "#e5bb32", "#77e532", "#e5323e"],
+ tooltip: {
+ trigger: 'axis'
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ axisPointer: {
+ show: true,
+ },
+ dataZoom: [
+ {
+ type: 'slider',
+ show: true,
+ xAxisIndex: [0]
+ },
+ {
+ type: 'slider',
+ show: true,
+ yAxisIndex: [0]
+ },
+ {
+ type: 'inside',
+ xAxisIndex: [0]
+ },
+ {
+ type: 'inside',
+ yAxisIndex: [0]
+ }
+ ],
+ toolbox: {
+ feature: {
+ dataZoom: {
+ yAxisIndex: false,
+ xAxisIndex: false
+ },
+ restore: {},
+ saveAsImage: {}
+ }
+ },
+ xAxis: [
+ {
+ type: 'category',
+ boundaryGap: false,
+ axisLine: {onZero: false},
+ data: ["7-20 20:00", "7-20 20:01", "7-20 20:02", "7-20 20:03", "7-20 20:04", "7-20 20:05", "7-20 20:06", "7-20 20:07"]
+ },
+ ],
+ yAxis: {
+ type: 'value'
+ },
+ series: [
+ {
+ name: '接受信息',
+ type: 'line',
+ data: [293, 394, 590, 493, 592, 489, 519, 528]
+ },
+ {
+ name: '发送信息',
+ type: 'line',
+ data: [220, 182, 191, 234, 290, 330, 310, 230]
+ },
+ {
+ name: '服务调用速率',
+ type: 'line',
+ data: [150, 232, 201, 154, 190, 330, 209, 291]
+ },
+ {
+ name: '服务调用失败速率',
+ type: 'line',
+ data: [12, 3, 42 ,3, 32, 4, 42, 20]
+ }
+ ]
+ };
+
+ myChart.setOption(option);
+ window.onresize = myChart.resize;
+ }
+}
+</script>
+
+<style>
+.h1-index {
+ font-size: 240%;
+ color: #8f8f8f;
+}
+
+.h3-index {
+ color: #8f8f8f;
+}
+
+.test-box {
+ width: 100%;
+ height: 600px;
+ background-color: white;
+}
+
+</style>
diff --git a/ATRI/plugins/manege/atri-manege/src/main.js b/ATRI/plugins/manege/atri-manege/src/main.js
new file mode 100644
index 0000000..917702d
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/main.js
@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router'
+import vuetify from './plugins/vuetify'
+
+Vue.config.productionTip = false
+
+new Vue({
+ router,
+ vuetify,
+ render: h => h(App)
+}).$mount('#app')
diff --git a/ATRI/plugins/manege/atri-manege/src/plugins/vuetify.js b/ATRI/plugins/manege/atri-manege/src/plugins/vuetify.js
new file mode 100644
index 0000000..5bdec19
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/plugins/vuetify.js
@@ -0,0 +1,7 @@
+import Vue from 'vue';
+import Vuetify from 'vuetify/lib/framework';
+
+Vue.use(Vuetify);
+
+export default new Vuetify({
+});
diff --git a/ATRI/plugins/manege/atri-manege/src/router/index.js b/ATRI/plugins/manege/atri-manege/src/router/index.js
new file mode 100644
index 0000000..d36779e
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/router/index.js
@@ -0,0 +1,29 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+import Home from '../views/Home.vue'
+
+Vue.use(VueRouter)
+
+const routes = [
+ {
+ path: '/',
+ name: 'Home',
+ component: Home
+ },
+ {
+ path: '/about',
+ name: 'About',
+ // route level code-splitting
+ // this generates a separate chunk (about.[hash].js) for this route
+ // which is lazy-loaded when the route is visited.
+ component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
+ }
+]
+
+const router = new VueRouter({
+ mode: 'history',
+ base: process.env.BASE_URL,
+ routes
+})
+
+export default router
diff --git a/ATRI/plugins/manege/atri-manege/src/views/About.vue b/ATRI/plugins/manege/atri-manege/src/views/About.vue
new file mode 100644
index 0000000..3fa2807
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/views/About.vue
@@ -0,0 +1,5 @@
+<template>
+ <div class="about">
+ <h1>This is an about page</h1>
+ </div>
+</template>
diff --git a/ATRI/plugins/manege/atri-manege/src/views/Home.vue b/ATRI/plugins/manege/atri-manege/src/views/Home.vue
new file mode 100644
index 0000000..636303a
--- /dev/null
+++ b/ATRI/plugins/manege/atri-manege/src/views/Home.vue
@@ -0,0 +1,15 @@
+<template>
+ <hello-world />
+</template>
+
+<script>
+ import HelloWorld from '../components/HelloWorld'
+
+ export default {
+ name: 'Home',
+
+ components: {
+ HelloWorld,
+ },
+ }
+</script>