fix:修改a-sub-menu的icon

This commit is contained in:
orgin 2023-06-12 15:35:14 +08:00
parent e69e2ad877
commit 1ccf2c12db

View File

@ -43,7 +43,6 @@ const SubMenu = {
<span slot="title" > <span slot="title" >
<span>{{ menuInfo.meta.title }}</span> <span>{{ menuInfo.meta.title }}</span>
<div class="line"></div> <div class="line"></div>
<img src="@/assets/images/global/delete.png" alt="" />
</span> </span>
<template v-for="item in menuInfo.children"> <template v-for="item in menuInfo.children">
<a-menu-item v-if="!item.children" :key="item.path" class="sub-menu-children"> <a-menu-item v-if="!item.children" :key="item.path" class="sub-menu-children">
@ -113,6 +112,9 @@ export default {
methods: { methods: {
// ,MenuItem // ,MenuItem
menuClick({ item, key, keyPath }) { menuClick({ item, key, keyPath }) {
// var parentPath = item._props.parentMenu._props.eventKey;
// var parentTitle = parentPath.substring(parentPath.lastIndexOf("/") + 1, parentPath.length)
// var par = {"type": "q"}
// key, // key,
this.$router.push({ this.$router.push({
path: key, path: key,
@ -128,7 +130,7 @@ export default {
} else { } else {
// //
this.defaultSelectedKeys.push(f.path) this.defaultSelectedKeys.push(f.path)
return true; return true
} }
}) })
}, },
@ -196,7 +198,7 @@ export default {
font-weight: bold; font-weight: bold;
font-stretch: normal; font-stretch: normal;
line-height: 43px; line-height: 43px;
letter-spacing: 2px; // letter-spacing: 2px;
color: #ade6ee; color: #ade6ee;
} }
.line { .line {
@ -211,7 +213,7 @@ export default {
::v-deep .ant-menu-inline > .ant-menu-submenu[menuindex] > .ant-menu-submenu-title { ::v-deep .ant-menu-inline > .ant-menu-submenu[menuindex] > .ant-menu-submenu-title {
border-bottom: 1px solid #0cecca66; border-bottom: 1px solid #0cecca66;
color: #ffffff !important; color: #ffffff !important;
height: 50px; height: 47px;
.line { .line {
width: 96%; width: 96%;
height: 5px; height: 5px;
@ -230,16 +232,43 @@ export default {
content: ''; content: '';
display: block; display: block;
height: 100%; height: 100%;
width: 10px; width: 5px;
position: absolute; position: absolute;
top: 2px; top: 2px;
right: 0; right: 0;
background-color: #0cebc9; background-color: #0cebc9;
} }
} }
::v-deep .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected { ::v-deep {
///\\
.ant-menu-submenu-open.ant-menu-submenu[menuindex] > .ant-menu-submenu-title > .ant-menu-submenu-arrow::before {
width: 0px;
transform: rotate(45deg) translateX(4.5px);
}
///\\
.ant-menu-submenu-open.ant-menu-submenu[menuindex] > .ant-menu-submenu-title > .ant-menu-submenu-arrow::after {
content: url(~@/assets/images/station-operation/toggle.png);
width: 0px;
transform: rotate(-90deg) translateX(-6.5px) translateY(-8.5px);;
}
//\/\
.ant-menu-inline-collapsed .ant-menu-submenu-arrow::before,
.ant-menu-submenu[menuindex] > .ant-menu-submenu-title .ant-menu-submenu-arrow::before {
width: 0px;
transform: rotate(-45deg) translateX(4.5px);
}
//\//
.ant-menu-inline-collapsed .ant-menu-submenu-arrow::after,
.ant-menu-submenu[menuindex] > .ant-menu-submenu-title .ant-menu-submenu-arrow::after {
content: url(~@/assets/images/station-operation/toggle.png);
width: 0px;
transform: rotate(90deg) translateX(-5.5px) translateY(-19.5px);
}
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: #075259 !important; background-color: #075259 !important;
color: #0cecca; color: #0cecca;
}
} }
</style> </style>