优化element的菜单组件为时尚感组件

element框架中的menu组件设计较为简洁，未包含背景图的扩展功能，不过可以根据具体需求进行自定义调整。为了实现子组件的递归生成，我们独立开发了一个top-bar组件。在修改样式时，需要额外添加一个div容器，因为每个组件内部原本都包含了一个div包裹结构。首先，在整个头部区域添加背景图片；其次，menu组件中设置的background属性会对所有菜单项生效，但若不想对父级菜单进行修改，则可将父菜单的背景设为transparent。最后，为了让父级菜单在hover时呈现出平行四边形效果，可以通过伪元素结合transform: skewX(-45deg)实现，并由于父元素是透明状态，因此需通过z-index:1确保图形能够正常显示。

    <el-menu
      :default-active="activeIndex"
      mode="horizontal"
      @select="handleSelect"
      class="leftMenu"
      background-color="#052d8d"
      text-color="#acf4ff"
      active-text-color="#acf4ff"
    >
      <top-bar :navMenus="leftRoute" />
    </el