Commit 54bfdc33 authored by 纪泽龙's avatar 纪泽龙

修复左边拦长短的问题

parent b43719f0
......@@ -266,3 +266,9 @@
position: relative;
float: right;
}
// 上传按钮
.hide {
.el-upload--picture-card {
display: none;
}
}
......@@ -118,11 +118,11 @@
.hideSidebar {
.sidebar-container {
width: 54px !important;
// width: 54px !important;
}
.main-container {
margin-left: 54px;
// margin-left: 54px;
}
.submenu-title-noDropdown {
......
......@@ -11,9 +11,11 @@
:on-success="handleUploadSuccess"
:on-remove="handleRemove"
:on-preview="handleFileClick"
:on-change="fileChange"
:show-file-list="true"
:headers="headers"
class="upload-file-uploader"
:class="{hide:addShow}"
ref="upload"
>
<!-- 上传按钮 -->
......@@ -78,6 +80,7 @@ export default {
type: Boolean,
default: false,
},
},
data() {
return {
......@@ -89,6 +92,7 @@ export default {
modal:false,
dialogVisible:false,
dialogImageUrl:"",
addShow:true,
};
},
computed: {
......@@ -163,6 +167,7 @@ export default {
// 文件列表移除文件
handleRemove(file, fileList) {
console.log("列表移除", file, fileList);
this.addShow = fileList.length>0 ?true:false;
this.$emit("remove", file);
},
// 删除文件
......@@ -197,9 +202,15 @@ export default {
return "";
}
},
// 当改变列表改变时
fileChange(file,fileList){
this.addShow = fileList.length>0 ?true:false;
}
},
created() {
// this.fileList = this.list;
this.addShow = this.fileArr.length>0 ?true:false;
},
};
</script>
......@@ -223,4 +234,5 @@ export default {
.ele-upload-list__item-content-action .el-link {
margin-right: 10px;
}
</style>
......@@ -179,7 +179,7 @@ export default {
vertical-align: top;
display: inline-block;
word-break: break-all;
max-width: 280px;
max-width: 250px;
}
}
}
......
......@@ -6,12 +6,17 @@
>
<template v-for="(item, index) in topMenus">
<!-- <el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber" -->
<el-menu-item :style="" :index="item.path" :key="index" v-if="index < visibleNumber">
<el-menu-item
:style=""
:index="item.path"
:key="index"
v-if="index < visibleNumber"
>
<!-- 导航栏左侧图标 -->
<!-- <svg-icon :icon-class="item.meta.icon" /> -->
{{ item.meta.title }}</el-menu-item>
<div class="menu-item-div"></div>
{{ item.meta.title }}
</el-menu-item>
<!-- <div class="menu-item-div"></div> -->
</template>
<!-- 顶部菜单超出数量折叠 -->
......@@ -32,7 +37,7 @@
<script>
import { constantRoutes } from "@/router";
import '../../common/font/font.css'
import "../../common/font/font.css";
export default {
data() {
return {
......@@ -41,7 +46,7 @@ export default {
// 是否为首次加载
isFrist: false,
// 当前激活菜单的 index
currentIndex: undefined
currentIndex: undefined,
};
},
computed: {
......@@ -73,11 +78,13 @@ export default {
this.routers.map((router) => {
for (var item in router.children) {
if (router.children[item].parentPath === undefined) {
if(router.path === "/") {
router.children[item].path = "/redirect/" + router.children[item].path;
if (router.path === "/") {
router.children[item].path =
"/redirect/" + router.children[item].path;
} else {
if(!this.ishttp(router.children[item].path)) {
router.children[item].path = router.path + "/" + router.children[item].path;
if (!this.ishttp(router.children[item].path)) {
router.children[item].path =
router.path + "/" + router.children[item].path;
}
}
router.children[item].parentPath = router.path;
......@@ -103,17 +110,17 @@ export default {
}
var routes = this.activeRoutes(activePath);
if (routes.length === 0) {
activePath = this.currentIndex || this.routers[0].path
activePath = this.currentIndex || this.routers[0].path;
this.activeRoutes(activePath);
}
return activePath;
},
},
beforeMount() {
window.addEventListener('resize', this.setVisibleNumber)
window.addEventListener("resize", this.setVisibleNumber);
},
beforeDestroy() {
window.removeEventListener('resize', this.setVisibleNumber)
window.removeEventListener("resize", this.setVisibleNumber);
},
mounted() {
this.setVisibleNumber();
......@@ -126,6 +133,7 @@ export default {
},
// 菜单选择事件
handleSelect(key, keyPath) {
console.log(key)
this.currentIndex = key;
if (this.ishttp(key)) {
// http(s):// 路径新窗口打开
......@@ -148,14 +156,14 @@ export default {
}
});
}
if(routes.length > 0) {
if (routes.length > 0) {
this.$store.commit("SET_SIDEBAR_ROUTERS", routes);
}
return routes;
},
ishttp(url) {
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
}
return url.indexOf("http://") !== -1 || url.indexOf("https://") !== -1;
},
},
};
</script>
......@@ -176,9 +184,9 @@ export default {
}
.el-menu--horizontal > .el-menu-item.is-active {
border-bottom: 3px solid #{'var(--theme)'};
border-bottom: 3px solid #{"var(--theme)"};
/* box-shadow: inset 2px 2px 20px #5CD9D4; */
color: #5CD9D4;
color: #5cd9d4;
}
/* submenu item */
......@@ -186,19 +194,25 @@ export default {
height: 50px !important;
line-height: 50px !important;
}
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus{
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
.el-menu--horizontal > .el-menu-item:not(.is-disabled):focus {
background-color: rgba(0, 0, 0, 0);
/* opacity: 0; */
/* box-shadow: inset 2px 2px 20px #5CD9D4; */
color: #fff;
}
.menu-item-div{
.menu-item-div {
width: 2px;
height: 30px;
margin-top: 25px;
background-color: rgb(190, 189, 189);
float: left;
background: linear-gradient(130deg, rgba(0, 0, 0, 0) 0%,rgba(255,255,255,0.7) 50%, rgba(0, 0, 0, 0) 100%);
background: linear-gradient(
130deg,
rgba(0, 0, 0, 0) 0%,
rgba(255, 255, 255, 0.7) 50%,
rgba(0, 0, 0, 0) 100%
);
&:last-child {
width: 0px;
......
......@@ -4,7 +4,8 @@
<app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path)">
<el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{'submenu-title-noDropdown':!isNest}">
<item :icon="onlyOneChild.meta.icon||(item.meta&&item.meta.icon)"/><br>
<item :title="onlyOneChild.meta.title" />
<!-- <item :title="onlyOneChild.meta.title" /> -->
{{onlyOneChild.meta.title}}
</el-menu-item>
</app-link>
</template>
......
<template>
<div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
<sidebar class="sidebar-container" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }" />
<Sidebar class="sidebar-container" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }" />
<div :class="{hasTagsView:needTagsView}" class="main-container">
<div :class="{'fixed-header':fixedHeader}">
<navbar />
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment