From 7845b8946aa2e58f053b09cef897e6c58df60e8a Mon Sep 17 00:00:00 2001
From: chenyabin <Chenab123!>
Date: 星期三, 07 四月 2021 15:31:14 +0800
Subject: [PATCH] 统一样式-图层组件按钮添加
---
src/components/panel/RightSearchPanel.vue | 54 +++++++++++++++++++++++++++++++++++-------------------
1 files changed, 35 insertions(+), 19 deletions(-)
diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue
index dacfcbe..875399d 100644
--- a/src/components/panel/RightSearchPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -5,9 +5,14 @@
<!-- :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">
+ <button type="button" class="el-button special-button el-button--default el-icon-d-arrow-right"></button>
+ </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 style=" ">
+ <li>
<!-- <span>{{item.name}}</span>-->
<!-- <div >-->
<img src="../../assets/images/map-pages/icon/sl.png" class="icon">
@@ -35,11 +40,11 @@
<div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>
</div>
- <div :class="'search-container map-background'">
- <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
- <component :title="title" :is="gcComp"></component>
- </div>
+ <div :class="'search-container map-background'">
+ <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
+ <component :title="title" :is="gcComp"></component>
</div>
+ </div>
</div>
</div>
</template>
@@ -97,7 +102,7 @@
},
selected (val) {
// console.log(val)
- this.title = val.name + '锛堟绱級'
+ this.title = val.name
this.topicList.forEach((itm) => {
itm.checked = val.name === itm.name
})
@@ -178,16 +183,14 @@
<style lang="less">
.search-title{
- color: rgb(255, 255, 255);
- font-size: 16px;
+ color:@color-title;
+ font-size: 18px;
margin: 5px;
}
.search-container {
position: relative;
width: 1.79167rem;
/*height: 5.6475rem;*/
- min-height: 80vh;
- max-height: 90vh;
overflow: hidden;
}
.module-wrap{
@@ -224,8 +227,8 @@
//top: 10px;
height: 0;
position: absolute;
- top: .4rem;
- right: .08333rem;
+ top: 0.42979rem;
+ right: 0.14583rem;
z-index: 501;
display: -webkit-box;
display: -ms-flexbox;
@@ -250,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;
+ border-radius:50% 0.03rem 0.03rem 50% ;
+ }
+ .el-button--default:hover{
+ background:@background-color;
+ }
.el-form-item__label {
color: rgb(52, 224, 255);
@@ -474,7 +486,7 @@
display: inline-block;
position: relative;
padding-right: 5px;
- color:#f5f5f5;
+ color:@color-shadow;
i{
display: block;
width: 15px;
@@ -488,14 +500,13 @@
.el-radio.is-checked .levelOfRisk-type{color:#409EFF}
.environmental-risk-list{
- border:1px solid @color;
- margin-right: 10px;
- margin-bottom: 15px;
position: relative;
+ cursor: pointer;
padding-left:50px;
- padding-top:3px;
- padding-bottom:3px;
- color: #f5f5f5;
+ padding-top:5px;
+ padding-bottom:5px;
+ color: @color-shadow;
+ border-bottom:1px solid @background-color-split;
.state{
width: 30px;
height: 30px;
@@ -508,6 +519,11 @@
background: #0B3B6D;
}
}
+ .environmental-risk-list.hover,
+ .environmental-risk-list:hover{
+ color:@color-over;
+ background: @background-color;
+ }
//.search-panel {
// border: #07325B;
// background-color: #07325B !important;
--
Gitblit v1.8.0