| src/components/mobileCortrolButtom/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/components/mobileCortrolSearch/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/components/mobilemap/index.vue | ●●●●● patch | view | raw | blame | history | |
| src/styles/divforms/divForms.scss | ●●●●● patch | view | raw | blame | history | |
| src/styles/esri/index.scss | ●●●●● patch | view | raw | blame | history |
src/components/mobileCortrolButtom/index.vue
@@ -4,7 +4,7 @@ mobileCortrolButtom --> <!-- <div class="m-l-inbut" @click="mubiao"><i class="el-icon-s-help"></i></div> --> <div class="m-l-inbut" v-show="true"> <div class="m-l-inbut" v-show="false"> <!-- <i class="el-icon-s-flag"></i> --> <el-dropdown trigger="click" @command="handleCommand"> <span class="el-dropdown-link icons"> @@ -40,10 +40,7 @@ import { getIp, getUsers } from '@/api/mobile/ip/index' import { getListarc } from '@/api/mobile/public/arc' import { getActivity } from '@/api/mobile/hd/hd' const options = { url: 'https://js.arcgis.com/4.14/', css: 'https://js.arcgis.com/4.14/esri/themes/light/main.css' } import { GCJ02ToWGS84 } from '@/utils/CoordTransform' export default { @@ -82,7 +79,7 @@ ]) }, created () { this.getStreet() // this.getStreet() }, mounted () { // eslint-disable-next-line no-undef src/components/mobileCortrolSearch/index.vue
@@ -4,20 +4,13 @@ --> <div class="m-left-mobileCortrolSearch"> <div class="m-left-SearchMain"> <el-input placeholder="请输入内容" v-model="input" clearable size="small" class="m-left-S-input" > <el-button slot="append" class="iconSearch" icon="el-icon-search icon" @click="search" ></el-button> </el-input> <slot name="selectCampusBox"></slot> <div class="m-left-input-box"> <el-input placeholder="请输入内容" v-model="input" clearable size="small" class="m-left-S-input"> <el-button slot="append" class="iconSearch" icon="el-icon-search icon" @click="search"></el-button> </el-input> </div> </div> </div> </template> @@ -52,31 +45,73 @@ .m-left-mobileCortrolSearch { width: 100%; position: fixed; top: 0; top: 10px; // left: 20px; z-index: 200; .m-left-SearchMain { margin: 0 auto; width: 60%; margin: 0 2%; width: 96%; position: relative; z-index: 1; top: 20px; display: flex; align-items: center; justify-content: center; .m-left-input-box { flex: 1; ::v-deep(input) { border-radius: 0 !important; border: none !important; background-color: #f1f1f1; } } &>div:first-child { border-radius: 4px 0 0 4px !important; .m-left-S-input { border-radius: 4px 0 0 4px !important; ::v-deep(input) { border-radius: 4px 0 0 4px !important; } } } .m-left-S-input { border: none; font-size: 16px; display: flex; align-items: center; justify-content: space-between; ::v-deep(input) { flex: 1 !important; } ::v-deep(.el-input-group__append) { width: 0 !important; border: none !important; border-radius: 0 !important; button { border-radius: 0 4px 4px 0 !important; } } } .iconSearch { width: 30px; height: 30px; width: 32px; height: 32px; padding-top: 0; padding-bottom: 0; background-color: rgb(33, 150, 243); display: flex; align-items: center; justify-content: center; border: none !important; font-size: 24px; color: #fff; } src/components/mobilemap/index.vue
@@ -1,6 +1,25 @@ <template> <div class="mobile-map-container"> <div id="sceneview"></div> <mobileCortrolSearch ref="mobileCortrolSearch"> <template slot="selectCampusBox"> <div class="select-campus-box" v-if="campusData.length > 1"> <el-dropdown trigger="click" @command="handleCommand"> <span class="el-dropdown-link icons"> {{ campusData.find(item => item.dictKey == campusValue).dictValue }} <i class="el-icon-caret-bottom"></i> </span> <el-dropdown-menu slot="dropdown"> <el-dropdown-item v-for="(item, index) in campusData" :key="index" :command="item"> {{ item.dictValue }} </el-dropdown-item> </el-dropdown-menu> </el-dropdown> </div> </template> </mobileCortrolSearch> <!-- 随地图改变图标弹窗↓ --> <div id="mobile-map_popup_content"></div> <mobileWindow ref="MobileWindow"></mobileWindow> @@ -12,7 +31,6 @@ <mobileCortrol ref="mobileCortrol"></mobileCortrol> <mobileCortrolButtom ref="mobileCortrolButtom" :mapCenter="mapCenter" :frislayertHeight="frislayertHeight"> </mobileCortrolButtom> <mobileCortrolSearch ref="mobileCortrolSearch"></mobileCortrolSearch> <!-- 控制↑ --> <!-- 控制大弹窗的弹窗 --> <!-- v-if="mBigPopupAfter" --> @@ -37,6 +55,7 @@ import axios from 'axios' import { mapGetters } from 'vuex' import { getBuildClock } from '@/api/mobile/buildsClock/buildsClock' // 楼栋详情 import { getListarc } from '@/api/mobile/public/arc' import OlView from "ol/View.js" @@ -132,6 +151,7 @@ height: 0 }, map2D: this.$store.state.openlayerData.openlayers.map2D, campusData: [], campusValue: '' } }, @@ -160,6 +180,10 @@ }) } } }, created () { this.getStreet() }, mounted () { @@ -405,6 +429,17 @@ setCampusValue (val) { this.campusValue = val }, handleCommand (command) { this.setCampusValue(command.dictKey) }, getStreet () { getListarc().then((res) => { this.setCampusValue(res.data.data[0].dictKey) this.campusData = res.data.data }) } } } @@ -428,6 +463,17 @@ /* overflow: hidden; */ } .select-campus-box { width: 28%; height: 32px; line-height: 32px; text-align: center; background: #f1f1f1; border-right: 1px solid #C0C4CC; box-sizing: border-box; z-index: 299; } .esri-view-surface--inset-outline:focus::after { outline: none !important; } src/styles/divforms/divForms.scss
@@ -282,8 +282,17 @@ } .el-dropdown-menu.el-popper { background-color: #29baf1 !important; border: 1px solid #29baf1 !important; padding: 0 !important; background-color: #2196f3 !important; border: 1px solid #2196f3 !important; .popper__arrow { border-bottom-color: #2196f3 !important; &::after { border-bottom-color: #2196f3 !important; } } li { color: #fff !important; src/styles/esri/index.scss
@@ -15,4 +15,8 @@ button { background-color: #2196f3 !important; } } #sceneview .ol-zoom { top: 52px !important; }