|
|
|
@ -8,9 +8,15 @@ |
|
|
|
<div :class="leftMenu.find(item => item.children) ? 'children' : 'no_child'"> |
|
|
|
<div :class="leftMenu.find(item => item.children) ? 'children' : 'no_child'"> |
|
|
|
<div class="left_menu" @click="clickItem(item, index)" v-for="(item, index) in leftMenu" :key="item.id" |
|
|
|
<div class="left_menu" @click="clickItem(item, index)" v-for="(item, index) in leftMenu" :key="item.id" |
|
|
|
:class="index == selectIndex ? 'active' : ''"> |
|
|
|
:class="index == selectIndex ? 'active' : ''"> |
|
|
|
<div class="left_menu_item"> |
|
|
|
<el-tooltip v-if="item.name && item.name.length > 4" class="item" effect="dark" :content="item.name" placement="right-start"> |
|
|
|
|
|
|
|
<div class="left_menu_item"> |
|
|
|
|
|
|
|
<i :class="item.source" style="margin-bottom: 5px;"></i> |
|
|
|
|
|
|
|
<span class="name_text">{{ item.name }}</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</el-tooltip> |
|
|
|
|
|
|
|
<div class="left_menu_item" v-else> |
|
|
|
<i :class="item.source" style="margin-bottom: 5px;"></i> |
|
|
|
<i :class="item.source" style="margin-bottom: 5px;"></i> |
|
|
|
{{ item.name }} |
|
|
|
<span class="name_text">{{ item.name }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -145,6 +151,16 @@ export default { |
|
|
|
overflow: hidden; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
text-overflow: ellipsis; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.name_text{ |
|
|
|
|
|
|
|
display: inline-block; |
|
|
|
|
|
|
|
width: 52px; |
|
|
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
text-overflow: ellipsis; /* 超出宽度200px后显示省略号 */ |
|
|
|
|
|
|
|
white-space: nowrap; /* 限制不允许换行 */ |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
&:hover { |
|
|
|
background: #0066ff; |
|
|
|
background: #0066ff; |
|
|
|
color: #fff; |
|
|
|
color: #fff; |
|
|
|
|