NEZ-347 style:修改link导航name过长撑开下拉菜单的问题,修改添加 删除为图标

This commit is contained in:
zhangyu
2020-07-07 13:43:33 +08:00
parent 783e0a0531
commit 6185754028
2 changed files with 25 additions and 11 deletions

View File

@@ -13,7 +13,7 @@
</template>
<template v-for="(item, index) in $store.state.linkData">
<el-menu-item :index="'0-' + index">
<span class="linkTitle"><a :href='item.url' class="nz-a" target="_blank" :title="item.url">{{item.name}}</a></span>
<span class="linkTitle"><a :href='item.url' class="nz-a" target="_blank" :title="item.name">{{item.name}}</a></span>
</el-menu-item>
</template>
</el-submenu>
@@ -863,7 +863,7 @@
}
.linkTitle{
display: inline-block;
width: 100%;
width: 200px;
font-size: 15px;
color: #444444;
}
@@ -872,8 +872,12 @@
}
.linkTitle>a{
display: inline-block;
width: 100%;
width: 150px;
padding-left: 35px;
padding-right: 15px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>
<style>

View File

@@ -181,7 +181,7 @@
<el-input v-model="linkTemp.url" class="linkUrl"/>
</el-form-item>
<el-form-item prop="btn">
<el-button class="linkBtn nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-75" @click="linkAdd">Add</el-button>
<i class="nz-icon-create-square nz-icon" @click="linkAdd"></i>
</el-form-item>
</el-form>
</div>
@@ -211,16 +211,18 @@
</el-form-item>
</el-form>
<div class="linkFormContent" v-else>
<div class="linkTitleName">{{item.name}}</div>
<div class="linkTitleName" :title="item.name">{{item.name}}</div>
<div class="linkTitleUrl">
<span class="linkTitleUrlContent" @click="openUrl(item)">
<span class="linkTitleUrlContent" @click="openUrl(item)" @dblclick.stop="linkEdit(item)">
<!--<el-tooltip class="item" effect="dark" :content="item.url" placement="top" popper-class="linkUrlTip">-->
<span>{{item.url}}</span>
<!--</el-tooltip>-->
</span>
<i class="nz-icon nz-icon-edit" @click="linkEdit(item)" v-if="item.buildIn=='0'"></i>
<i class="nz-icon nz-icon-edit" @click.stop="linkEdit(item)" v-if="item.buildIn=='0'"></i>
</div>
<div class="linkFormBtn">
<i class="nz-icon nz-icon-delete" @click="linkDel(item)" v-if="item.buildIn=='0'"></i>
</div>
<div class="linkFormBtn"> <el-button class="linkBtn nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-75" @click="linkDel(item)" v-if="item.buildIn=='0'">Delete</el-button></div>
</div>
</div>
</draggable>
@@ -676,7 +678,7 @@
},
//openUrl 跳转页面
openUrl(item){
window.open(item.url)
// window.open(item.url)
}
},
mounted() {
@@ -768,14 +770,22 @@
cursor: pointer;
outline: none;
}
.linkTitleUrlContent:hover{
text-decoration:underline;
.nz-icon-delete{
cursor: pointer;
color: #ee6723;
}
/*.linkTitleUrlContent:hover{*/
/*text-decoration:underline;*/
/*}*/
.linkTitleUrl .nz-icon-edit{
font-size: 12px;
float: right;
cursor: pointer;
}
.nz-icon-create-square{
cursor: pointer;
color: #333333;
}
/deep/ .el-form-item--small .el-form-item__error{
padding-top: 0px;
}