1.优化导航栏

loulijun2021

2023-01-30 2ae96b796658f5507326c48e4b25bbbe80b38dfe

1.优化导航栏

 src/components/PageRefresh/PageRefresh.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,16 @@
<!--页面刷新功能组件  æš‚不开发   æœ‰éœ€æ±‚了再开发-->
<template>
  <div>
    <i class="el-icon-refresh-right" style="font-size: 20px;cursor: pointer;line-height:50px" />
  </div>
</template>

<script>
export default {
  name: 'PageRefresh'
}
</script>

<style scoped>

</style>

 src/layout/components/Navbar.vue

@@ -11,10 +11,23 @@
        class="hamburger-container"
        @toggleClick="toggleSideBar"
      />
      <!--      :style="{marginLeft:$store.state.settings.menuIsHorizontal?'50px':'40px'}"-->
      <breadcrumb
        class="breadcrumb-container"
        :style="{marginLeft:$store.state.settings.menuIsHorizontal?'20px':''}"
      />

      <!--页面刷新功能  æš‚不开发   æœ‰éœ€æ±‚了再开发-->
      <!--      <el-tooltip class="item" effect="dark" content="刷新页面" placement="bottom">-->
      <!--                <PageRefresh-->
      <!--                  :style="{-->
      <!--                    color:$store.state.settings.headBackgroundColorValue?'#fff':'#000',-->
      <!--                    marginLeft:$store.state.settings.menuIsHorizontal?'20px':'50px'-->
      <!--                  }"-->
      <!--                  style="position: absolute;"-->
      <!--                  @click="pageRefreshClick"-->
      <!--                />-->
      <!--      </el-tooltip>-->

      <el-menu
        v-if="$store.state.settings.menuIsHorizontal"
@@ -41,15 +54,19 @@

        <!--      <template v-if="device!=='mobile'">-->
        <template>
          <el-tooltip class="item" effect="dark" content="菜单搜索" placement="bottom">
          <search id="header-search" class="right-menu-item" />
          </el-tooltip>
          <!--        <error-log class="errLog-container right-menu-item hover-effect" />-->
          <el-tooltip class="item" effect="dark" content="全屏" placement="bottom">
          <screenfull id="screenfull" class="right-menu-item hover-effect" />
          </el-tooltip>
          <!--        <el-tooltip content="Global Size" effect="dark" placement="bottom">-->
          <!--          <size-select id="size-select" class="right-menu-item hover-effect" />-->
          <!--        </el-tooltip>-->
        </template>

        <el-dropdown class="avatar-container" trigger="click">
        <el-dropdown class="avatar-container" trigger="hover">
          <div class="avatar-wrapper">
            <!--          <img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar">-->
            <div style="display: flex;align-items: center;margin-top: -5px">
@@ -130,6 +147,7 @@
import Search from '@/components/HeaderSearch'
import Screenfull from '@/components/Screenfull'
import variables from '@/styles/variables.scss'
import PageRefresh from '@/components/PageRefresh/PageRefresh'

export default {
  components: {
@@ -137,7 +155,8 @@
    Breadcrumb,
    Hamburger,
    Search,
    Screenfull
    Screenfull,
    PageRefresh
  },
  directives: { elDragDialog },
  data() {