固废相关样式调整

chenzeping

2021-04-02 54003c39859ef97a07b3d59f70c6379168f0f106

固废相关样式调整

 src/assets/css/map/map-panel-style.less

@@ -1,13 +1,11 @@
@import "_map-variable";

/*全局设置***********/
h1,h2,h3,h4,h5,h6,ul,li,p{
h1, h2, h3, h4, h5, h6, ul, li, p {
  padding: 0;
  margin: 0;
  list-style: none;
}




.el-button--primary {
@@ -201,44 +199,55 @@
  display: none !important;
}

.el-tabs--card>.el-tabs__header .el-tabs__nav{
.el-tabs--card > .el-tabs__header .el-tabs__nav {
  border: none;
}

.el-tabs--card>.el-tabs__header .el-tabs__item{
.el-tabs--card > .el-tabs__header .el-tabs__item {
  border: none;
  margin-left: 10px;
}



/***************Company 图层 悬浮框样式。*********************************/
.company-bindTooltip{
  background:none;
  border:none;
  color:red;
.company-bindTooltip {
  background: none;
  border: none;
  color: red;
  font-size: 16px;
  font-weight: 900 !important;
  text-shadow: 0 0 5px #fff;
  box-shadow: none;
}
.company-bindTooltip-hover h3{

.company-bindTooltip-hover h3 {
  text-align: center;
  border-bottom:1px solid #0B3B6D;
  border-bottom: 1px solid #0B3B6D;
  margin: 0;
  padding:0;
  padding: 0;
}
.company-bindTooltip-hover ul{

.company-bindTooltip-hover ul {
  list-style: none;
  margin: 0;
  padding:0;
  padding: 0;
  width: 260px;
  display: flex;
  flex-wrap: wrap;
}
.company-bindTooltip-hover ul li{

.company-bindTooltip-hover ul li {
  margin: 0;
  padding:3px 0;
  padding: 3px 0;
  width: 50%;
}

/*************** PublicTable 表格样式。*********************************/
.cell {
  padding: 0;
}

.el-table .cell, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell {
  /* padding-left: 10px; */
  text-align: center;
}

 src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue

@@ -8,6 +8,7 @@
    <div class="main">
      <div class="main-video">
        <el-table
            border
            tooltip-effect="dark"
            :data="displayContentTableData"
        >
@@ -57,6 +58,7 @@
  .main-video {
    width: 100%;
    min-height: 195px;
    //border: 1px @color solid;

    video {
      width: 100%;
@@ -65,7 +67,6 @@
    }
  }
}

.border_corner {
  z-index: 999;
  position: absolute;

 src/components/LayerController/logic/SolidWaste.js

@@ -43,12 +43,6 @@
          iconAnchor: [25, 25]
        })
      })
      marker.bindTooltip(getSolidWasteData[i].Name, {
        permanent: true,
        offset: [0, 14],
        direction: 'bottom',
        className: 'company-bindTooltip'
      })
      layer.addLayer(marker)
    }
  }
@@ -94,7 +88,7 @@
    this.setPanTo(e.latlng, 200)
  }

  // flayTo()
  // flayTo() 弹框的可滑动事件
  this.setPanTo = (pos, value) => {
    var position = pos
    position = window.map.latLngToLayerPoint(position)

 src/components/panel/topicSearch/SolidWasteSearch.vue

@@ -27,16 +27,64 @@
          <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i>
        </el-input>
      </el-form>
      <el-card class="box-card"
               v-for="(item,index) in searchDataDisplay"
               :key="index">
        <div>
          {{ item.CompanyName }}
      <el-scrollbar style="height:500px">
        <div class="environmental-risk-list">
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
      </el-card>
        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
          <i class="state"></i>
          <div>
            <h3>###炼化部</h3>
            <p>所属部门：<span>炼化部</span></p>
            <p>风险级别：<span>三级</span></p>
          </div>
        </div>
      </el-scrollbar>
      <!--      <el-card class="box-card"-->
      <!--               v-for="(item,index) in searchDataDisplay"-->
      <!--               :key="index">-->
      <!--        <div>-->
      <!--          {{ item.CompanyName }}-->
      <!--        </div>-->
      <!--      </el-card>-->
    </div>
    <!--      <el-scrollbar style="height:100%">-->
    <!--      </el-scrollbar>-->
  </div>
</template>

@@ -149,6 +197,44 @@
</script>

<style lang="less" scoped>
.el-radio.is-checked .levelOfRisk-type {
  color: #409EFF
}

.levelOfRisk {
  padding-left: 20px
}

.levelOfRisk .el-radio {
  padding-bottom: 6px
}

.environmental-risk-list {
  border: 1px solid @color;
  margin-right: 10px;
  margin-bottom: 15px;
  position: relative;
  padding-left: 50px;
  padding-top: 3px;
  padding-bottom: 3px;
  color: #f5f5f5;

  .state {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -15px;
    border-radius: 50%;
    box-shadow: 0 0 3px #000;
    background: #0B3B6D;
  }
}

.el-input {
  margin: 15px auto;
}

.solidwaste-search {
  position: relative;
@@ -177,7 +263,6 @@
  }

  .search-btn {

  }

  .search-radio {