Merge remote-tracking branch 'origin/master'

wangqi

2021-03-15 e05684a5b3308d3751cd5f10bf144b2118617acf

Merge remote-tracking branch 'origin/master'

 package.json

@@ -30,7 +30,9 @@
    "nprogress": "^0.2.0",
    "rbush": "^3.0.1",
    "screenfull": "^3.3.3",
    "style-resources-loader": "^1.4.1",
    "vue": "^2.6.11",
    "vue-cli-plugin-style-resources-loader": "^0.1.4",
    "vue-count-to": "^1.0.13",
    "vue-focus": "^2.1.0",
    "vue-fullscreen": "^2.2.0",

 src/App.vue

@@ -14,7 +14,6 @@
</script>

<style lang="less">
@import '@assets/css/map/_map-variable';
html, body, #app{
  color: @color;
  height: 100vh;

 src/assets/css/map/_map-variable.less

@@ -1,5 +1,6 @@
@color:#00fff6;
@color-highlight:#fff700;
@color-gray:#C0C4CC;
@color-title:white;
@color-over:white;
@background-color:rgba(0,16,30,.8);

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

@@ -11,11 +11,34 @@
      text-align: center;
      height: 20px;
      line-height: 20px;

      color: #00fff6;
      cursor: pointer;
      -ms-flex-negative: 0;
      flex-shrink: 0;
  }
}
.el-tabs__header{
  font-size: .08333rem;
  line-height: .10938rem;
  background: rgba(0,255,246,.14);
}
.el-dialog{
  border: 0.00521rem solid @color;
  box-shadow: 0 0 0.03rem @color;
  background: rgba(0, 16, 30, 0.8);
  border-radius: 0.05208rem;

  .el-dialog__title{
    padding: .03125rem .08333rem;
    color: @color;
    cursor: pointer;
    flex-shrink: 0;
  }
}
.select-down {
    border: none !important;
    background-color: @background-color !important;
    background-color: @background-color ;

   //.el-scrollbar{
   //
@@ -40,27 +63,33 @@
   //     background-color: @background-color;
   // }
    .popper__arrow::after{
        border-bottom-color: @color !important;
        border-bottom-color: @color ;
    }
}
.sewers-search{
  display: block;
  //width: calc(100% - 10px);
  height:512px;
  .search-btn{


  }
  //location-btn{
  //
  //}

  .location-btn:hover,.el-input__icon:hover{
    color: @color;
    cursor: pointer;
.el-table{
  color: #00fff6;
}
.el-table th, .el-table tr{
  background: transparent;
}
.el-table thead {
  color: #ffffff;
  font-weight: 500;
}
.el-table, .el-table__expanded-cell {
  background-color: transparent;
}
.el-table thead.is-group th{
  background-color: transparent;
}
.map-input{
  input{
    border-radius: 0;
    background-color: @background-color-light ;
    border: solid 1px @color ;
  }
}


.map-tooltip.is-dark{
  font-size: .08333rem ;

 src/components/panel/LegendPanel.vue

@@ -145,7 +145,6 @@
</script>

<style lang="less">
@import '@assets/css/map/_map-variable';
.legend-panel {
  position: absolute;
  z-index: 502;

 src/components/panel/MenuTopic.vue

@@ -66,7 +66,6 @@
</script>

<style lang="less" >
@import '@assets/css/map/_map-variable';
.menu-special {
  position: absolute;
  left: 1rem;

 src/components/panel/RightSearchPanel.vue

@@ -1,18 +1,21 @@
<template>
  <div class="panel-right">
  <div class="panel-right" v-show="isShow">
    <div class="panel-tab">
      <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd"
           :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">
        <img :src="item.icon" style="width: 24px;height: 24px;"></div>
<!--      <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd"-->
<!--           :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">-->
<!--        <img :src="item.icon" style="width: 24px;height: 24px;"></div>-->
      <div class="container">
        <ul class="module-wrap"
            style="padding-top: 0px; transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 0ms; transform: translate(0px, 0px) translateZ(0px);">
          <li class="active module-wrap__box">
            <div class="module-wrap__box-item">
              <!----><img src="../../assets/images/map-pages/icon/dd.png" class="icon">
            </div><!---->
        <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="   ">
<!--            <span>{{item.name}}</span>-->

<!--            <div >-->
                <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
<!--            </div>-->
          </li>
        </ul><!----><!---->
          </el-tooltip>
        </ul>
      </div>
    </div>
<!--    <div class="panel-fold-btn" >-->
@@ -38,7 +41,6 @@
</template>

<script>
// import $ from 'jquery'
import EnvProtectSearch from './topicSearch/EnvProtectSearch'
import DischargeSearch from './topicSearch/DischargeSearch'
import { TopicList } from '../../conf/Topic'
@@ -49,6 +51,7 @@
  components: { EnvProtectSearch, DischargeSearch },
  data () {
    return {
      isShow: true,
      topicMenu: [],
      topicList: TopicList,
      topicCheckedList: [],
@@ -61,8 +64,7 @@
      toggleMonitorStyle: 'right:0px',

      title: '污雨水管网',

      isCollapse: false
      isCollapse: true
    }
  },
  computed: {},
@@ -75,7 +77,6 @@
      this.topicList.forEach((item) => {
        this.topicCheckedList.forEach((itm) => {
          if (item.name === itm) {
            // item.checked = tr
            this.topicMenu.push(item)
          }
        })
@@ -86,7 +87,12 @@
    handleClose (done) {
      console.log(done)
    },

    selected (val) {
      console.log(val)
      this.topicList.forEach((itm) => {
        itm.checked = val.name === itm.name
      })
    },
    handlePage (page) {
    },
    handleGd () {
@@ -139,17 +145,42 @@
</script>

<style lang="less">
@import '@assets/css/map/_map-variable';
.module-wrap{
  width: 0.15rem;
  height: 0.15rem;
  padding: .04167rem;
  //padding: .00521rem;
  background: rgba(0,16,30,.5);
  border-radius: .03125rem;
  border: .00521rem solid rgba(255,247,0,.5);
  margin: .04167rem 0;
  font-size: .08333rem;
  -webkit-transition: all .2s linear;
  transition: all .2s linear;
  cursor: pointer;
  position: relative;
  line-height: 0.15rem;
  li{
    margin: 0.00521rem 0;
    text-align: center;
    img{
      width: 0.1rem;
      height: 0.1rem;

    }
  }
}
.panel-right {
  width: 322px;
  display: inline-flex;
  //width: 322px;
  //height: 100%;
  //position: absolute;
  //right: 10px;
  //top: 10px;
  height: 0;
  position: absolute;
  top: .60417rem;
  right: .15625rem;
  top: .4rem;
  right: .08333rem;
  z-index: 501;
  display: -webkit-box;
  display: -ms-flexbox;
@@ -158,22 +189,22 @@
  -ms-flex-align: start;
  align-items: flex-start;

  .el-card__body {
    padding: 7px;
  }
  .el-form-item__content {
    color: rgb(52, 224, 255);
  }

  .el-picker-panel {
    background-color: #061e51 !important;
  }

  .el-input__inner {
    border-radius: 0 !important;
    background-color: #061e51 !important;
    border: solid 1px #0e639e !important;
  }
  //.el-card__body {
  //  padding: 7px;
  //}
  //.el-form-item__content {
  //  color: rgb(52, 224, 255);
  //}
  //
  //.el-picker-panel {
  //  background-color: #061e51 !important;
  //}
  //
  //.el-input__inner {
  //  border-radius: 0 !important;
  //  background-color: #061e51 !important;
  //  border: solid 1px #0e639e !important;
  //}

  .el-form-item__label {
    color: rgb(52, 224, 255);
@@ -281,8 +312,8 @@
    background-color: rgba(5,24,66,.8);
    border-radius: 10px 0 0 10px;
    .btn-stretch {
      width: 20px;
      height: 40px;
      //width: 20px;
      //height: 40px;
      background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -408px 5px;
      cursor: pointer;
      /*margin-left: -20px;*/
@@ -304,8 +335,8 @@
  }

  .tab-item {
    width: 32px;
    height: 30px;
    //width: .2rem;
    //height: .2rem;
    color: @color;
    font-size: 12px;
    background-color: #0B3B6D;
@@ -314,13 +345,9 @@
    cursor: pointer;
  }
  .panel-tab {
    position: absolute;
    left: 0;
    //height: 120px;
    top: 0;
    width: 32px;
    position: relative;
    z-index: 500;
    background: url('../../assets/images/map-pages/icon/caidan.png') no-repeat;
    margin-right: .025rem;
    .container{
      max-height: 3.125rem;
      overflow: hidden;
@@ -378,16 +405,16 @@
    font-size: 18px;
  }

  .search-panel {
    border: #07325B;
    background-color: #07325B !important;
    margin-top: 0px;

    .el-input__inner {
      border-radius: 0px !important;
      background-color: #061e51 !important;
    }
  }
  //.search-panel {
  //  border: #07325B;
  //  background-color: #07325B !important;
  //  margin-top: 0px;
  //
  //  .el-input__inner {
  //    border-radius: 0px !important;
  //    background-color: #061e51 !important;
  //  }
  //}

  input::-webkit-input-placeholder {
    color: #569ee1;

 src/components/panel/ToolBoxPanel.vue

@@ -264,7 +264,7 @@
    justify-content: space-around;

    .init-choose {
      background: #305B62;
      background: @background-color;
      width: 35px;
      height: 35px;
      border-radius: 50%;

 src/components/panel/topicSearch/SewersSearch.vue

@@ -1,12 +1,12 @@
<template>
 <div class="sewers-search">
 <div :class="'sewers-search map-background'">
    <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
      <div class="box__content" v-if="gdVisible">
        <div>
          <el-card class="search-panel">
          <div class="search-panel ">
            <el-form ref="form" :model="form" label-width="90px" class="search-form">
              <el-form-item label="设施类型：" size="mini" class="search-panel-item">
                <el-select v-model="form.pipelineType" @change="handlePipelineType"  popper-class="select-down">
                <el-select style="width: 100%" :popper-append-to-body="false" v-model="form.pipelineType" @change="handlePipelineType"  :popper-class="'select-down'">
                  <el-option
                      v-for="item in pipelineTypeOptions"
                      :key="item.value"
@@ -16,7 +16,7 @@
                </el-select>
              </el-form-item>
              <el-form-item :label="form.pipelineType+'：'" size="mini">
                <el-select v-model="form.dataType"  @change="handleDataType" popper-class="select-down">
                <el-select style="width: 100%" :popper-append-to-body="false" v-model="form.dataType"  @change="handleDataType" :popper-class="'select-down'">
                  <el-option
                      v-for="item in dataTypeOptions"
                      :key="item.value"
@@ -38,7 +38,7 @@
              <!--                <input type="button" class="btn-reset" @click="handleSearch" value="重置">-->
              <!--              </el-form-item>-->
            </el-form>
          </el-card>
          </div>
          <el-scrollbar style="height:100%">
          <el-card class="search-result" >
            <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
@@ -187,6 +187,41 @@
}
</script>

<style lang="less">
//@import '@assets/css/map/map-elem-ui';
<style lang="less" scoped>
.sewers-search{
  position: relative;
  width: 1.79167rem;
  height: 3.4375rem;
  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>

 src/conf/Topic.js

@@ -52,22 +52,4 @@
  checked: false,
  icon: '/assets/images/menu/special.png',
  comp: 'envProtectSearch'
}, {
  name: '预警报警',
  id: 8,
  checked: false,
  icon: '/assets/images/menu/special.png',
  comp: 'sewersSearch'
}, {
  name: '指标统计',
  id: 9,
  checked: false,
  icon: '/assets/images/menu/special.png',
  comp: 'envProtectSearch'
}, {
  name: '应急地图',
  id: 10,
  checked: false,
  icon: '/assets/images/menu/special.png',
  comp: 'sewersSearch'
}]

 src/main.js

@@ -8,7 +8,7 @@
import echartsDarkTheme from '@/styles/theme-dark/echarts/theme.json'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import './assets/css/map/_map-variable.less'
import '@assets/css/map/_map-variable.less'
import '@assets/css/map/map-panel-style.less'
import 'leaflet/dist/leaflet.css'
import L from 'leaflet'

 vue.config.js

@@ -1,5 +1,5 @@
const appConfig = require('./src/app.config')

const path = require('path')
module.exports = {
  publicPath: process.env.NODE_ENV === 'production' ? `/${appConfig.projectName}/` : '/',
  configureWebpack: config => {
@@ -16,6 +16,14 @@
  },
  parallel: require('os').cpus().length > 1, // 构建时开启多进程处理babel编译
  productionSourceMap: false,
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'less',
      patterns: [
        path.resolve(__dirname, './src/assets/css/map/_map-variable.less')
      ]
    }
  },
  devServer: {
    // host: 'localhost',
    // open: true,