<template>
  <div :style="{ '--current-color': theme }" class="app-wrapper">
    <!-- <van-nav-bar :left-arrow="showBackButton" :title="route.meta.title || '福建水利监管工作平台'" @click-left="back"/> -->
    <!-- 展示页 -->
    <app-main/>
    <!-- 底部 -->
    <bottom-nav/>
  </div>
</template>
<script setup>
import {computed, ref} from 'vue';
import {AppMain, BottomNav} from '@/layout/components/index.js'
import {useRoute, useRouter} from "vue-router";

const router = useRouter()
const route = useRoute()

const theme = ref(localStorage.getItem('theme'))
const showBackButton = computed(() => route.meta.showBack)

function back() {
  router.go(-1)
}
</script>
<style lang="scss" scoped>
.app-wrapper {
  height: 100%;
  width: 100%;
  position: relative;

  .app-main {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height:100%;
    background-color: #ebecf0;
  }

}
</style>
<style>
.app-wrapper .van-nav-bar__content {
  background-color: #007BFF;
}

.app-wrapper .van-nav-bar .van-icon {
  color: #fff;
}
</style>
