You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
bililive_webapp/src/App.vue

109 lines
3.1 KiB

<template>
<el-container>
<el-header>
<template v-if="$route.fullPath.startsWith(backend)">
<el-row>
<el-col :span="4">
<h1>bilibili直播通知后台管理</h1>
</el-col>
<el-col :span="20" v-if="[managerLoginPath,managerRegisterPath].includes($route.fullPath)">
<el-menu mode="horizontal" :router="true" :default-active="configPath">
<el-submenu index="1">
<template v-slot:title>推送配置</template>
<el-menu-item :index="configPath">当前配置</el-menu-item>
<el-menu-item :index="telegramPath">修改telegram bot</el-menu-item>
</el-submenu>
<el-submenu index="2">
<template v-slot:title>个人信息</template>
<el-menu-item :index="managerPasswordPath">修改密码</el-menu-item>
<el-menu-item :index="managerEmailPath">修改邮箱</el-menu-item>
<el-menu-item @click="managerLogout">退出登录</el-menu-item>
</el-submenu>
</el-menu>
</el-col>
</el-row>
</template>
<template v-else-if="$route.fullPath.startsWith(frontend)">
<el-row>
<el-col :span="4">
<h1>bilibili直播通知</h1>
</el-col>
<el-col :span="20" v-if="$route.fullPath!==userLoginPath">
<el-menu mode="horizontal">
<el-submenu index="1">
<template v-slot:title>个人信息</template>
<el-menu-item @click="userLogout">退出登录</el-menu-item>
</el-submenu>
</el-menu>
</el-col>
</el-row>
</template>
</el-header>
<el-main>
<router-view/>
</el-main>
</el-container>
</template>
<script lang="ts">
import {computed, defineComponent} from 'vue'
import Config from "./components/Config.vue";
import {useStore} from "vuex";
import {
backend,
configPath,
frontend,
managerEmailPath,
managerLoginPath,
managerPasswordPath,
managerRegisterPath,
telegramPath,
userLoginPath
} from "./router";
//@ts-ignore
import crumbs from 'crumbsjs';
import {useRouter} from "vue-router";
import {manager_token_key} from "./global";
export default defineComponent({
name: 'App',
components: {Config},
setup() {
const store = useStore()
const router = useRouter()
const managerLogout = () => {
crumbs.deleteAll()
router.replace(managerLoginPath)
}
const userLogout = () => {
crumbs.deleteAll()
router.replace(userLoginPath)
}
const isLogin = computed<boolean>(() => crumbs.get(manager_token_key) !== null)
return {
store, managerLoginPath, managerRegisterPath, managerLogout, configPath, telegramPath
, managerEmailPath, managerPasswordPath, backend, frontend, userLoginPath, userLogout
}
}
})
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>