web
22 小时以前 51eeb5d0acba9b783e5c939c1fad4beffcaef8b2
src/screen/temp.vue
@@ -1,7 +1,15 @@
<template>
    <div class="main">
        <div class="header">
            <div class="top">金川水电站生态流量监测系统 </div>
            <div class="top">
                <div class="top-exit" @click="() => { router.push('/screen') }">
                    <img src="@/assets/images/exit.png" alt="" />
                    <span>选择系统</span>
                </div>
                <div class="top-name">
                    金川水电站水温监测系统
                </div>
            </div>
            <div class="nav">
                <div v-for="(item,index) in btnList" :key="index" @click="navTo(item)" class="plain" :class="item.url === route.path ? 'active' : ''">{{ item.name }}</div>
            </div>
@@ -18,11 +26,11 @@
const route = ref(useRoute())
const btnList = ref([
    {name:'总览',url:'/temp/home'},
    {name:'设备管理',url:''},
    {name:'实时监测', url:''},
    {name:'图形分析',url:''},
    {name:'汇总统计',url:''},
    {name:'报表管理',url:''},
    {name:'设备管理',url:'/temp/shebei'},
    {name:'实时监测', url:'/temp/monitor'},
    {name:'图形分析',url:'/temp/graphic'},
    {name:'汇总统计',url:'/temp/statics'},
    {name:'报表管理',url:'/temp/report'},
    {name:'系统管理',url:'/user'},
])
const navTo = (item) =>{
@@ -38,18 +46,35 @@
    .header{
        width: 100%;
        height: 14%;
        background-color: rgb(82, 120, 128);
        position: relative;
        .top{
            height: 60%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 38px;
            font-size: 48px;
            font-weight: 700;
            color: #fff;
            position: relative;
            z-index: 100;
            .top-exit{
                position: absolute;
                left: 100px;
                cursor: pointer;
                font-size: 20px;
                img{
                    width: 30px;
                    vertical-align: top;
                    margin-right: 10px;
                }
            }
        }
        .nav{
            display: flex;
            height: 40%;
            position: relative;
            z-index: 100;
            .plain{
                flex-grow: 1;
                height: 100%;