右侧搜索栏统一样式修改。

chenyabin

2021-04-02 f74731373aa12d468609da8b60d6e503b77ba349

 src/components/panel/topicSearch/EnvRiskSearch.vue

@@ -40,12 +40,15 @@
            <el-radio  v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}<i :style="'background:'+item.color"></i></span></el-radio>
        </el-radio-group>
        <!--              <el-form-item >-->
        <el-input v-model="form.keyword" size="mini"
                  placeholder="在此输入关键字搜索">
        <div class="rightButtonSearch">
          <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索">
          <!--                  <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
          <!--                  <i slot="prefix" class="el-input__icon el-icon-search"></i>-->
          <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i>
            <!-- <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> -->
        </el-input>
          <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
        </div>

        <!--              </el-form-item>-->
        <!--              <el-form-item>-->
        <!--                <input type="button" class="btn-ok" @click="handleSearch" value="查询">-->
@@ -208,77 +211,5 @@
</script>

<style lang="less" scoped>
  .levelOfRisk-type{
    display: inline-block;
    position: relative;
    padding-right: 5px;
    color:#f5f5f5;
    i{
      display: block;
      width: 15px;
      height: 10px;
      position: absolute;
      top:50%;
      right: -15px;
      margin-top: -5px;
    }
  }
  .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;
  }
}
/******************以下公共部分**********/
  .sewers-search{
    position: relative;
    overflow: hidden;
    .search-panel{
      background-color: transparent;
      border: 1px solid @background-color-split;
      padding: 10px;

      /deep/ input {
        border-radius: 0;
        background-color: @background-color-split ;
        border: solid 1px @color ;
        color: @color-gray;
        font-size: 0.01rem;
        .el-select .el-input.is-focus .el-input__inner{
          border-color: @color;
        }
      }
      /deep/ input:focus{
        border-color: @color;
      }
    }
    .search-btn{

    }
    //location-btn{
    //
    //}
    .location-btn:hover,.el-input__icon:hover{
      color: @color;
      cursor: pointer;
    }
  }
</style>