635fa4fb by 杨威

左侧树目录修改

1 parent 9ca7ce28
......@@ -31,6 +31,12 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe7a1;</span>
<div class="name">树目录</div>
<div class="code-name">&amp;#xe7a1;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7a0;</span>
<div class="name">下载</div>
<div class="code-name">&amp;#xe7a0;</div>
......@@ -567,6 +573,15 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont iconshumulu"></span>
<div class="name">
树目录
</div>
<div class="code-name">.iconshumulu
</div>
</li>
<li class="dib">
<span class="icon iconfont iconxiazai"></span>
<div class="name">
下载
......@@ -1326,6 +1341,14 @@
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#iconshumulu"></use>
</svg>
<div class="name">树目录</div>
<div class="code-name">#iconshumulu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#iconxiazai"></use>
</svg>
<div class="name">下载</div>
......
This diff could not be displayed because it is too large.
......@@ -6,6 +6,13 @@
"description": "",
"glyphs": [
{
"icon_id": "19383167",
"name": "树目录",
"font_class": "shumulu",
"unicode": "e7a1",
"unicode_decimal": 59297
},
{
"icon_id": "19376823",
"name": "下载",
"font_class": "xiazai",
......
......@@ -20,6 +20,9 @@ Created by iconfont
/>
<missing-glyph />
<glyph glyph-name="shumulu" unicode="&#59297;" d="M928 128h34.176a32 32 0 0 0 32-32v-128a32 32 0 0 0-32-32h-128a32 32 0 0 0-32 32v128a32 32 0 0 0 32 32h29.824V352a6.4 6.4 0 0 1-6.4 6.4H546.176V128h32a32 32 0 0 0 32-32v-128a32 32 0 0 0-32-32h-128a32 32 0 0 0-32 32v128a32 32 0 0 0 32 32h32V358.4H169.6a6.4 6.4 0 0 1-6.4-6.4V128h30.976a32 32 0 0 0 32-32v-128a32 32 0 0 0-32-32h-128a32 32 0 0 0-32 32v128a32 32 0 0 0 32 32h33.024V390.4a32 32 0 0 0 32 32h350.976V640h-32a32 32 0 0 0-32 32v128a32 32 0 0 0 32 32h128a32 32 0 0 0 32-32v-128a32 32 0 0 0-32-32h-32v-217.6H896a32 32 0 0 0 32-32V128z" horiz-adv-x="1024" />
<glyph glyph-name="xiazai" unicode="&#59296;" d="M529.066667 218.510222l193.763555 193.763556a33.166222 33.166222 0 1 0 46.933334-46.933334l-217.258667-217.201777a33.166222 33.166222 0 0 0-46.876445 0L288.369778 365.340444a33.166222 33.166222 0 0 0 46.933333 46.933334L529.066667 218.510222zM491.918222 207.644444V760.661333a33.166222 33.166222 0 1 0 66.389334 0V207.644444a33.166222 33.166222 0 1 0-66.389334 0zM854.300444 27.704889H203.832889v154.567111a33.166222 33.166222 0 0 1-66.332445 0v-187.733333c0-18.318222 14.791111-33.166222 33.166223-33.166223h716.8a33.166222 33.166222 0 0 1 33.166222 33.166223v187.733333a33.166222 33.166222 0 1 1-66.332445 0v-154.567111z" horiz-adv-x="1024" />
......
......@@ -10,6 +10,12 @@
linkLine_last: s_index === list.length - 1 && s_index !== 0,
third_layer: !item.children,
second_layer: item.children,
curNode:$route.query.bsm && $route.query.bsm==item.bsm,
zxx:item.qszt,
iszd:item.qszt&&item.type == 'zd',
isdz:item.qszt&&item.type == 'dz',
iszrz:item.qszt&&item.type == 'zrz',
isgzw:item.qszt&&item.type == 'gzw'
}"
>
<div
......@@ -17,48 +23,42 @@
@click="itemClick(item)"
@dblclick="dbclick(item,item.zdbsm)"
:class="{
active_color: item.expand,
active_color: item.expand
}"
>
<div
class="layer_text nowrap"
@contextmenu.prevent="openMenu($event, item,list)"
:class="{
active_color: item.expand,
curPage:$route.query.bsm && $route.query.bsm==item.bsm
active_color: item.expand
}"
:ref="($route.query.bsm && $route.query.bsm==item.bsm)?'curZxx':''"
:data-zdbsm="item.zdbsm"
:title=item.mc
>
<i v-show="!item.qszt" class="iconfont iconshumulu" style="margin-right:6px"></i>
<span class="qsztImg" v-if="item.bblx == 1 || (item.bhqkbsm != ''&& item.bhqkbsm != null)">
<!-- <span class="qsztFont" style="color: #9e9b9b"></span> -->
<i class="iconfont iconbian"></i>
<i :class="$route.query.bsm && $route.query.bsm==item.bsm ? 'iconfont iconbianing':'iconfont iconbian'"></i>
</span>
<template v-else>
<span class="qsztImg" v-if="item.qszt=='0'" >
<span class="qsztFont" style="color: red; "></span>
<!-- <span class="qsztFont" style="color: #2FA3FA; "></span> -->
<i :class="$route.query.bsm && $route.query.bsm==item.bsm ? 'iconfont iconlining':'iconfont iconlin'" style="color: #F7B500;"></i>
</span>
<span class="qsztImg" v-if="item.qszt=='1'" >
<span class="qsztFont" style="color: #1AD6E1; "></span>
<!-- <span class="qsztFont" style="color: #1AD6E1; "></span> -->
<i :class="$route.query.bsm && $route.query.bsm==item.bsm ? 'iconfont iconzhenging':'iconfont iconzheng'" style="color: #15D7E2;"></i>
</span>
<span class="qsztImg" v-if="item.qszt=='2'" >
<span class="qsztFont" style="color: #45AEFD; "></span>
<!-- <span class="qsztFont" style="color: #45AEFD; "></span> -->
<i :class="$route.query.bsm && $route.query.bsm==item.bsm ? 'iconfont iconxianing':'iconfont iconxian'" style="color: #2FA3FA;"></i>
</span>
</template>
<!-- <img class="qsztImg" v-if="item.qszt=='0'" :src="linshi"/>
<img class="qsztImg" v-if="item.qszt=='1'" :src="zhengshi"/>
<img class="qsztImg" v-if="item.qszt=='2'" :src="xianshi"/> -->
<span v-if="item.type=='zrz'" >(自然幢)
</span>
<span v-if="item.type=='dz'" >(多幢)
</span>
<span v-if="item.type=='gzw'" >(构筑物)
</span>
<span class="project-name">{{ item.mc }}</span>
<i class="iconfont iconziranchuang1 mr4" v-if="item.type=='zrz'"></i>
<i class="iconfont iconduochuang1 mr4" v-if="item.type=='dz'"></i>
<i class="iconfont icongouzhuwu mr4" v-if="item.type=='gzw'"></i>
<span>{{ item.mc }}</span>
</div>
<div
......@@ -336,7 +336,7 @@ export default {
cursor: pointer;
.layer_text {
flex: 1;
line-height: 16px;
line-height: 40px;
}
}
.first_vertical_line {
......@@ -349,14 +349,44 @@ export default {
}
.basic_banner {
position: relative;
width: 100%;
padding-bottom: 13px;
width: 279px;
height: 40px;
box-sizing: border-box;
padding-left: 24px;
}
.second_layer {
position: relative;
width: calc(100% - 20px);
cursor: pointer;
padding-left: 20px;
.basic_banner{
width: 100%;
}
}
.zxx{
width: 279px!important;
position: relative;
left: -80px;
text-indent: 80px;
}
.iszd{
.tree_item_box{
.zxx{
padding-left: 0;
left: 0;
}
}
}
.iszrz{
left: 0px!important;
text-indent: 96px;
}
.isdz{
text-indent: 96px!important;
.iszrz{
left: 0!important;
text-indent: 112px!important;
}
}
.third_layer {
position: relative;
......@@ -368,80 +398,78 @@ export default {
color: black!important;
}
.second_layer::before {
content: "";
position: absolute;
height: 1px;
width: 16px;
left: 8px;
top: 8px;
opacity: .5;
background: url('../../assets/images/rowline1.png');
background-position-y: center;
}
.third_layer::before {
content: "";
position: absolute;
height: 1px;
width: 16px;
left: 8px;
top: 8px;
opacity: .5;
background: url('../../assets/images/rowline1.png');
background-position-y: center;
}
// .second_layer::before {
// content: "";
// position: absolute;
// height: 1px;
// width: 16px;
// left: 8px;
// top: 8px;
// opacity: .5;
// background: url('../../assets/images/rowline1.png');
// background-position-y: center;
// }
// .third_layer::before {
// content: "";
// position: absolute;
// height: 1px;
// width: 16px;
// left: 8px;
// top: 8px;
// opacity: .5;
// background: url('../../assets/images/rowline1.png');
// background-position-y: center;
// }
.linkLine_default::after {
content: "";
position: absolute;
height: 100%;
width: 1px;
left: 7px;
top: 0px;
opacity: .5;
background: url('../../assets/images/colline1.png');
background-position-x: center;
}
.linkLine_first::after {
content: "";
position: absolute;
/* 为了触顶 */
top: -16px;
height: calc(100% + 16px);
width: 1px;
left: 7px;
opacity: .5;
background: url('../../assets/images/colline1.png');
background-position-x: center;
}
// 上半截
.linkLine_half_top::after {
content: "";
position: absolute;
height: 23px;
top: -14px;
width: 1px;
left: 7px;
opacity: .5;
background: url('../../assets/images/colline1.png');
background-position-x: center;
}
.linkLine_last::after {
content: "";
position: absolute;
height: 9px;
width: 1px;
left: 7px;
top: 0px;
opacity: .5;
background: url('../../assets/images/colline1.png');
background-position-x: center;
}
// .linkLine_default::after {
// content: "";
// position: absolute;
// height: 100%;
// width: 1px;
// left: 7px;
// top: 0px;
// opacity: .5;
// background: url('../../assets/images/colline1.png');
// background-position-x: center;
// }
// .linkLine_first::after {
// content: "";
// position: absolute;
// /* 为了触顶 */
// top: -16px;
// height: calc(100% + 16px);
// width: 1px;
// left: 7px;
// opacity: .5;
// background: url('../../assets/images/colline1.png');
// background-position-x: center;
// }
// // 上半截
// .linkLine_half_top::after {
// content: "";
// position: absolute;
// height: 23px;
// top: -14px;
// width: 1px;
// left: 7px;
// opacity: .5;
// background: url('../../assets/images/colline1.png');
// background-position-x: center;
// }
// .linkLine_last::after {
// content: "";
// position: absolute;
// height: 9px;
// width: 1px;
// left: 7px;
// top: 0px;
// opacity: .5;
// background: url('../../assets/images/colline1.png');
// background-position-x: center;
// }
.reTree_default_icon {
// opacity: .5;
background: url("../../assets/images/reTree_default_.svg") no-repeat center
center;
background-size: contain;
}
......@@ -480,14 +508,15 @@ export default {
}
.qsztImg{
width: 16px;
margin-right: 6px;
// border-radius: 50%; height: 20px; width: 20px; display: inline-block;
}
.project-name{
position: relative;
top: 1px;
}
.curPage{
color: orange;
.curNode{
>.basic_banner{
background: #E9F5FF;
box-shadow: inset 2px 0 0 0 #0C71FB;
color: #0C71FB;
}
}
.qsztFont{
text-align: center;
......@@ -500,5 +529,7 @@ export default {
border: 1px solid;
border-radius: 8px;
}
.mr4{
margin-right: 4px;
}
</style>
......
<template>
<div
class="content column-start-center reTree_box"
:style="{ fontSize: (size || 16) + 'px', lineHeight: (size || 16) + 'px', width: (islpb ? '200':'270') + 'px' }"
:style="{ fontSize: (size || 16) + 'px', lineHeight: (size || 16) + 'px', width: (islpb ? '200':'286') + 'px' }"
>
<div
class="column-start-center basic_layer"
......@@ -17,7 +17,7 @@
@click="itemClick(item)"
>
<div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item)">{{ item.mc }}</div><div
<div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item)"><i class="iconfont iconshumulu"></i> {{ item.mc }}</div><div
class="reTree_icon"
:style="{
height: (size || 16 * 1.2) + 'px',
......@@ -769,8 +769,8 @@ export default {
}
.basic_banner {
position: relative;
width: 100%;
padding-bottom: 13px;
width: 280px;
height: 40px;
}
.second_layer {
position: relative;
......
......@@ -270,7 +270,7 @@ export default {
})
}
this.$nextTick(()=>{
this.treeHeight = this.$el.clientHeight - 117;
this.treeHeight = this.$el.clientHeight - 132;
});
},
methods: {
......@@ -532,7 +532,7 @@ export default {
}
.el-aside {
width: 290px !important;
width: 280px !important;
background-color: #ffffff;
color: #333;
// text-align: center;
......@@ -558,24 +558,25 @@ export default {
}
}
.search-box{
height: 48px;
background-color: #3FA2E1;
height: 65px;
box-sizing: border-box;
padding: 9px 30px;
padding: 18px 20px;
border-right: 1px solid #dedede;
.searchInput{
/deep/ .el-input__inner{
height: 30px;
line-height: 30px;
border-radius: 15px;
width: 240px;
height: 38px;
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #DEDEDE;
}
/deep/ .el-input__suffix{
top: -5px!important;
top: 0!important;
}
}
}
.treeModule {
box-sizing: border-box;
padding: 20px 20px;
border-right: 1px solid #dedede;
}
.logo-box-show {
......@@ -603,7 +604,7 @@ export default {
}
.treeModule-show{
width: 290px;
width: 280px;
height: calc(100% - 120px);
position: absolute;
top: 120px;
......
......@@ -239,16 +239,16 @@
<!-- 右键菜单弹出框 -->
<el-dialog v-dialogDrag :close-on-click-modal="false" :title="taskTitle" :visible.sync="dialogVisible" width="50%" >
<!-- 根据菜单类型(menuType)和右键点击的楼盘类型(treeData.type)来区分弹框内容 -->
<div class="addCh" v-show="menuType == 'ljz'">
<div class="addCh" v-if="menuType == 'ljz'">
<addLjz ref="ljz" :ljzbsm="curBsm"></addLjz>
</div>
<div class="addCh" v-show="menuType == 'zdy'">
<div class="addCh" v-if="menuType == 'zdy'">
<addZdy ref="zdy" :zdybsm="curBsm"></addZdy>
</div>
<div class="addCh" v-show="menuType == 'c'">
<div class="addCh" v-if="menuType == 'c'">
<editCinfo ref="c" :cbsm="curBsm"></editCinfo>
</div>
<div class="addCh" v-show="menuType == 'ch'">
<div class="addCh" v-if="menuType == 'ch'">
<addCh
ref="ch"
:scyclx="scyclx"
......