From b1459c7ce38162a102348d541c07833044dc3d1c Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期三, 07 四月 2021 11:43:54 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/panel/RightSearchPanel.vue | 16 +++++ src/components/table/enterprise.vue | 2 src/components/table/summarySheets.vue | 2 src/components/panel/ToolBoxPanel.vue | 71 ++++++++++++++++++++--- src/components/LayerController/LayerController.vue | 27 ++++++-- src/components/LayerController/modules/LcServiceLayer.vue | 18 +++-- 6 files changed, 108 insertions(+), 28 deletions(-) diff --git a/src/components/LayerController/LayerController.vue b/src/components/LayerController/LayerController.vue index d9165bf..2fa037c 100644 --- a/src/components/LayerController/LayerController.vue +++ b/src/components/LayerController/LayerController.vue @@ -1,11 +1,11 @@ <template> <div :class='["float-panel",layerControllerVisible ? "active" : ""]' > - <div @click="showPanel" class="iconBtn transition" :class='layerControllerVisible ? "active-button" : ""' v-show="!layerControllerVisible" style="position: absolute;top:0;left: 0"> - <img src="@assets/images/map-pages/icon/layer.png" alt="" class="icon"> - <span class="icon-name">鍥惧眰</span> + <div @click="showPanel" class="iconBtn" :class='layerControllerVisible ? "active-button" : ""' v-show="!layerControllerVisible" style=" position: absolute;top:0;left: 0;"> + <img src="@assets/images/map-pages/icon/layer.png" alt="" class="icon"> + <span class="icon-name">鍥惧眰</span> </div> - <transition name="fade"> - <div :class="'legend-content map-background'" v-show="layerControllerVisible" style=" transform-origin: top left;"> + <transition name="animationChange"> + <div :class="'legend-content map-background'" v-show="layerControllerVisible"> <lc-service-layer></lc-service-layer> <buttom @click="showPanel" type="button" class="el-button special-button el-button--default el-icon-d-arrow-left"></buttom> </div> @@ -71,15 +71,28 @@ </script> <style lang="less"> + .animationChange-enter-active, .animationChange-leave-active { + transition: all 0.5s; + } + + .animationChange-enter, .animationChange-leave-to { + opacity: 0; + transform: translateX(-100px); + } + .float-panel.active{ + overflow: visible; + } .float-panel { position: absolute; left: 0.14583rem; - top: 0.8rem; + top: 0.73979rem; height: auto; font-size: 11px; z-index: 1000; display: flex; - + min-height: 0.28rem; + min-width: 0.28rem; + overflow: hidden; div { color: #00fff6; } diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue index 327bbae..5d553c3 100644 --- a/src/components/LayerController/modules/LcServiceLayer.vue +++ b/src/components/LayerController/modules/LcServiceLayer.vue @@ -20,7 +20,7 @@ :value="itm.code" @change="swWmsLayer(itm)"/>{{ itm.name }} <!-- 涓夌骇鍥惧眰閬嶅巻 --> - <div style="width: 100%"> + <div class="layerbox-item-3"> <div class="basemap-layer-item" v-for="layer in itm.layers" :key="layer.code"> <input type="checkbox" :name="'wmsSublayers_'+item.code+'_'+layer.code" @@ -126,15 +126,19 @@ .layerbox { width: 100%; .layerbox-item { - display: flex; - flex-flow: row wrap; - margin-left: 15px; - margin-top: 5px; - + padding-left: 20px; + padding-top: 5px; .basemap-layer-item { - width: 50%; + margin-bottom: 5px; } } + .layerbox-item-3{ + padding-left: 20px; + padding-top: 5px; + display: flex; + flex-wrap: wrap; + .basemap-layer-item{width: 50%} + } } } } diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue index c8ff02e..e309125 100644 --- a/src/components/panel/RightSearchPanel.vue +++ b/src/components/panel/RightSearchPanel.vue @@ -5,6 +5,11 @@ <!-- :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">--> <!-- <img :src="item.icon" style="width: 24px;height: 24px;"></div>--> <div class="container"> + <ul> + <li style="text-align: right"> + <buttom type="button" class="el-button special-button el-button--default el-icon-d-arrow-right"></buttom> + </li> + </ul> <ul v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" > <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left"> <li> @@ -222,7 +227,7 @@ //top: 10px; height: 0; position: absolute; - top: .46rem; + top: 0.42979rem; right: 0.14583rem; z-index: 501; display: -webkit-box; @@ -248,6 +253,15 @@ // background-color: #061e51 !important; // border: solid 1px #0e639e !important; //} + .el-button--default { + padding: 15px 3px; + background: rgba(0, 16, 30, 0.7); + color: #C0C4CC; + } + .el-button--default:hover{ + background: transparent; + border-color: #0f93a9; + } .el-form-item__label { color: rgb(52, 224, 255); diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index 0d0297d..ce0c138 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -1,7 +1,7 @@ <template> <div class="left-top-toolbox-panel"> <div class="specific-tools"> - <el-button :class="selectGroup === true ?'active-button':''" class="el-button-choice" @mouseover.enter.native="changeSelectMouse"> + <el-button :class="selectGroup === true ?'active-button':''" class="el-button-choice" @click.enter.native="changeSelectMouse"> <img src="@assets/images/map-pages/icon/toolbox/Selecd/tool.png" alt="" class="icon" /> <span class="span-default">宸ュ叿</span> </el-button> @@ -409,16 +409,15 @@ .specific-tools { display: flex; - - .el-button { + overflow: hidden; + .el-button { z-index: 999; padding: 0; margin: 0 0.015rem; - width: 45px; - height: 45px; + width: 0.2725rem; + height: 0.2725rem; background: @background-color; - //vertical-align: middle !important; - + vertical-align: middle !important; .base-map-img { position: absolute; } @@ -437,6 +436,10 @@ span { display: block; font-size: 10px; + } + } + .specific-tools-group .el-button{ + span{ color: #0B89B5; } } @@ -447,8 +450,8 @@ padding: 0; margin: 0; margin-right:0.015rem; - width: 45px; - height: 45px; + width: 0.2725rem; + height: 0.2725rem; background: @background-color; border: 0.00521rem solid @color-shadow; } @@ -460,6 +463,7 @@ .specific-tools-group { z-index: 1; + .tools-panel-choose { border: none; box-shadow: 0 0 0.03rem @color-shadow; @@ -481,11 +485,56 @@ } .special-button { - width: 22px; - height: 45px; + width: 0.1362rem; + height: 0.2725rem; color: @color-over; } } } } +.base-map-inner-panel { + display: flex; + justify-content: center; + align-items: center; + + .base-map-img { + position: absolute; + } + + .base-map-img-Tool:hover { + cursor: pointer; + } + + .base-map-anno-Tool { + position: absolute; + margin-left: 2px; + background-color: rgba(0, 0, 0, .5); + color: @color-over; + + .el-checkbox__label { + padding-left: 5px !important; + } + } + + .basemap-layer-item { + display: flex; + width: 50px; + height: 50px; + margin: 10px; + border: 2px solid white; + + input { + position: relative; + left: 0; + top: -53px; + } + + .basemap-layer-item-name { + position: relative; + left: 0; + top: -53px; + } + } +} + </style> diff --git a/src/components/table/enterprise.vue b/src/components/table/enterprise.vue index d2f65ae..371e9cb 100644 --- a/src/components/table/enterprise.vue +++ b/src/components/table/enterprise.vue @@ -82,7 +82,7 @@ cursor: pointer; } .enterprise-function:not(:first-child){ - margin-left: 10px; + margin-left: 0.05rem; } } </style> diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue index c030827..dcd7169 100644 --- a/src/components/table/summarySheets.vue +++ b/src/components/table/summarySheets.vue @@ -46,7 +46,7 @@ <style scoped lang="less"> .summary-sheets { position: absolute; - top: 0.46rem; + top: 0.42979rem; left: 0.14583rem; /*width: 850px;*/ /*height: 265px;*/ -- Gitblit v1.8.0