yos_web/src/components/newLayout/index.vue

<template>
  <div class="panel">
    <div class="flex-align-stretch">
      <asideTemp @getModules="getModules"></asideTemp>
      <div style="flex:100" class="body__panel">
        <headeTemp></headeTemp>
        <div>
          <menuTemp class="sticky normal-margin" ref="menu"></menuTemp>
          <div class="radius">
            <router-view></router-view>
          </div>
        </div>
      </div>
      <navTemp @getModules="getModules"></navTemp>
    </div>
  </div>
</template>

<script>
import headeTemp from './modules/header.vue'
import asideTemp from './modules/aside.vue'
import menuTemp from './modules/menu.vue'
import navTemp from './modules/navRight.vue'

export default {
  components:{
    headeTemp,
    asideTemp,
    menuTemp,
    navTemp
  },
  data () {
    return {

    }
  },
  methods:{
    getModules (mod,type) {
      this.$refs['menu'].setModules(mod,type)
    },
     // 查询应用授权
    async query_userauth () {
      const res = await this.$api.requested({
        "classname": "sysmanage.develop.userauthforweb.userauth",
        "method": "query_userauth",
        "content": {
          "place":1
        }
      })

      this.auth_data = res.data
      sessionStorage.setItem('module_info', JSON.stringify(this.auth_data))
      // this.$router.push('/main')
    },
    // 查询文件夹ID信息
    async querySite_Parameter () {
      const res = await this.$api.requested({
        "classname": "webmanage.site.site",
        "method": "querySite_Parameter",
        "content": {
        }
      })
      let obj = {
        appfolderid: res.data.appfolderid, // 应用附件文件夹ID
        salematerialfolderid: res.data.salematerialfolderid // 营销物文件夹ID
      }
      sessionStorage.setItem('folderid',JSON.stringify(obj))
    }   
  },
  created () {
    this.query_userauth()
    this.querySite_Parameter()
  }
}

</script>
<style>
.panel{
  background: url("../../assets/wallhaven-0pq8gm.jpeg") no-repeat;
  background-size: cover;
}
.el-menu{
  border-right:0
}
</style>
<style scoped>
.body__panel{
  height: 100vh;
  /* padding-right: 16px; */
  margin-right: 10px;
  overflow-y: scroll;
}
.body__panel::-webkit-scrollbar{
  display:none !important;
}
.sticky {
  position: sticky;
}
.radius{
  /* margin: 16px 0; */
  border-radius:10px;
  overflow: hidden;
  box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
  transform: translate3d(0,-2px,0);
  background: #fff;
}

</style>