调整代码

src/views/Layout/eHeader/eMenuCard.vue

@@ -1,97 +0,0 @@
-<template>
-  <div class="menu-card">
-    <router-link to="">{{ node.name }}</router-link>
-    <div class="card" :class="show ? 'open' : 'close'">
-      <slot :scope="{ node }" />
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    index: {
-      type: Number,
-      default: -1
-    },
-    active: {
-      type: Number,
-      default: 0
-    },
-    node: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  data() {
-    return {};
-  },
-  computed: {
-    show() {
-      return this.active == this.index + 1;
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-a {
-  text-decoration: none;
-  color: #333333;
-}
-
-.menu-card {
-  position: relative;
-  display: inline-block;
-  cursor: pointer;
-
-  a {
-    margin: 0 15px;
-    line-height: 78px;
-    height: 78px;
-  }
-
-  &:hover {
-    &::after {
-      content: "";
-      width: 100%;
-      height: 2px;
-      background-color: #000;
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: -1px;
-      min-width: 35px;
-    }
-  }
-
-  .card {
-    position: fixed;
-    display: block;
-    margin: 0;
-  }
-}
-
-.open {
-  z-index: 16;
-  left: 0;
-  top: auto;
-  margin-top: 0;
-  bottom: auto;
-  overflow: hidden;
-  width: 100%;
-  background: #fff;
-  padding: 0;
-  cursor: default;
-  border: 1px solid #e5e5e5;
-  opacity: 1;
-  transition: opacity 0.5s;
-}
-
-.close {
-  opacity: 0;
-  transition: opacity 0.5s;
-}
-</style>

src/views/Layout/eHeader/eMenuList.vue

@@ -82,9 +82,9 @@ export default {
     &:hover {
       &::after {
         content: "";
-        width: 30%;
+        width: 100%;
         height: 2px;
-        background-color: darkred;
+        background-color: rgb(84, 92, 100);
         position: absolute;
         left: 50%;
         right: 0;