From 95a1c8ca00f42eb9887b7bc04661595bd7ff518b Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 24 Dec 2021 09:56:20 +0800
Subject: [PATCH] 图片及部分样式更改
---
src/components/campusNav/index.vue | 6
src/components/map/components/campusBuildingSearch.vue | 93 +++++++++++++
src/components/orgNavBar/index.vue | 4
src/components/arcNavBar/index.vue | 4
public/img/icon/path.png | 0
src/components/map/index.vue | 35 ++++-
src/components/serviceNavBar/index.vue | 4
src/styles/pcpage/tool/ranging.scss | 55 ++++++-
src/styles/pcpage/dc-ui.scss | 6
public/img/icon/dtcj.png | 0
src/components/leftNav/index.vue | 118 +++++++++-------
public/img/icon/search.png | 0
src/styles/pcpage/element-ui.scss | 27 +++
src/components/map/components/mapPopup.vue | 0
src/pcviews/tool/ranging.vue | 41 ++++-
src/api/pc/leftNav/index.js | 10 +
16 files changed, 315 insertions(+), 88 deletions(-)
diff --git a/public/img/icon/dtcj.png b/public/img/icon/dtcj.png
new file mode 100644
index 0000000..9807d96
--- /dev/null
+++ b/public/img/icon/dtcj.png
Binary files differ
diff --git a/public/img/icon/path.png b/public/img/icon/path.png
new file mode 100644
index 0000000..1fdf2c9
--- /dev/null
+++ b/public/img/icon/path.png
Binary files differ
diff --git a/public/img/icon/search.png b/public/img/icon/search.png
new file mode 100644
index 0000000..803b8d3
--- /dev/null
+++ b/public/img/icon/search.png
Binary files differ
diff --git a/src/api/pc/leftNav/index.js b/src/api/pc/leftNav/index.js
index 21cd826..a4ffdb1 100644
--- a/src/api/pc/leftNav/index.js
+++ b/src/api/pc/leftNav/index.js
@@ -2,7 +2,7 @@
* @Author: Morpheus
* @Date: 2021-05-09 15:17:44
* @Last Modified by: Morpheus
- * @Last Modified time: 2021-12-22 16:01:37
+ * @Last Modified time: 2021-12-23 14:09:00
*/
// 右侧nav栏相关
import request from '@/router/axios'
@@ -39,6 +39,14 @@
})
}
+export const getWayList = (params) => {
+ return request({
+ url: '/blade-road/road/selectList',
+ method: 'get',
+ params: params
+ })
+}
+
export const getTagList = (params) => {
return request({
url: '/blade-architecture/architecture/selectArchALL',
diff --git a/src/components/arcNavBar/index.vue b/src/components/arcNavBar/index.vue
index 470a231..e5f21e2 100644
--- a/src/components/arcNavBar/index.vue
+++ b/src/components/arcNavBar/index.vue
@@ -224,8 +224,8 @@
width: 322px;
height: auto;
border-radius: 8px;
- top: 16%;
- left: 5%;
+ top: 140px;
+ left: 140px;
background-color: transparent;
z-index: 999;
font-size: 14px;
diff --git a/src/components/campusNav/index.vue b/src/components/campusNav/index.vue
index 4c0342e..f10d29e 100644
--- a/src/components/campusNav/index.vue
+++ b/src/components/campusNav/index.vue
@@ -75,10 +75,12 @@
},
props: {
comeName: {
- type: String
+ type: String,
+ default: ''
},
getToName: {
- type: String
+ type: String,
+ default: ''
}
},
computed: {
diff --git a/src/components/leftNav/index.vue b/src/components/leftNav/index.vue
index 44b95f5..9468241 100644
--- a/src/components/leftNav/index.vue
+++ b/src/components/leftNav/index.vue
@@ -14,7 +14,7 @@
<script>
-import { getAEDkList, getParkList, getComeList, getSceneList, getTagList } from '@/api/pc/leftNav/index'
+import { getAEDkList, getParkList, getComeList, getSceneList, getWayList, getTagList } from '@/api/pc/leftNav/index'
export default {
name: 'leftNav',
@@ -46,22 +46,22 @@
checked: '/img/leftnav/scene-checked.png',
layer: 'sceneLayer'
},
- {
- flag: false,
- label: '监控',
- img: '/img/leftnav/monitor.png',
- normal: '/img/leftnav/monitor.png',
- checked: '/img/leftnav/monitor-checked.png',
- layer: 'sceneLayer'
- },
- {
- flag: false,
- label: '活动',
- img: '/img/leftnav/activity.png',
- normal: '/img/leftnav/activity.png',
- checked: '/img/leftnav/activity-checked.png',
- layer: 'activityLayer'
- },
+ // {
+ // flag: false,
+ // label: '监控',
+ // img: '/img/leftnav/monitor.png',
+ // normal: '/img/leftnav/monitor.png',
+ // checked: '/img/leftnav/monitor-checked.png',
+ // layer: 'sceneLayer'
+ // },
+ // {
+ // flag: false,
+ // label: '活动',
+ // img: '/img/leftnav/activity.png',
+ // normal: '/img/leftnav/activity.png',
+ // checked: '/img/leftnav/activity-checked.png',
+ // layer: 'activityLayer'
+ // },
{
flag: false,
label: 'AED',
@@ -163,22 +163,24 @@
this.tagLayer.show = false
})
- const positions2 = this.generatePosition(5)
- positions2.forEach((item, index) => {
- const divIcon = new this.DC.DivIcon(
- item,
- `
+ getWayList().then(res => {
+ res.data.data.forEach(item => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="way-entitys-box">
<div class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff; width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
- 工建街
+ ${item.roadname}
</div>
<div class="way-sign-box">
<img src="https://map.hit.edu.cn/images/roadsign3.png">
</div>
</div>
`
- )
- this.wayLayer.addOverlay(divIcon)
+ )
+ this.wayLayer.addOverlay(divIcon)
+ })
+ this.wayLayer.show = false
})
getSceneList().then(res => {
@@ -267,39 +269,45 @@
<style scoped lang='scss'>
.left-nav {
position: fixed;
- top: 15%;
- right: 6%;
+ top: 100px;
+ right: 20px;
+ // bottom: 20px;
+ // left: 0;
z-index: 1;
- li {
- margin-bottom: 8px;
- font-weight: 400;
- display: block;
- width: 98px;
- height: 33px;
- line-height: 33px;
- background-color: #fff;
- border-radius: 17px;
- text-align: center;
- font-size: 0;
- cursor: pointer;
+ ul {
+ // display: flex;
+ li {
+ // margin: 0 8px;
+ margin-bottom: 12px;
+ font-weight: 400;
+ display: block;
+ width: 98px;
+ height: 33px;
+ line-height: 33px;
+ background-color: #fff;
+ border-radius: 17px;
+ text-align: center;
+ font-size: 0;
+ cursor: pointer;
- img {
- width: 24px;
- height: 24px;
- vertical-align: middle;
- margin-right: 10px;
- image-rendering: -moz-crisp-edges;
- image-rendering: -o-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: crisp-edges;
- -ms-interpolation-mode: nearest-neighbor;
- }
+ img {
+ width: 24px;
+ height: 24px;
+ vertical-align: middle;
+ margin-right: 10px;
+ image-rendering: -moz-crisp-edges;
+ image-rendering: -o-crisp-edges;
+ image-rendering: -webkit-optimize-contrast;
+ image-rendering: crisp-edges;
+ -ms-interpolation-mode: nearest-neighbor;
+ }
- span {
- display: inline-block;
- vertical-align: middle;
- font-size: 14px;
- color: #2f2f2f;
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ color: #2f2f2f;
+ }
}
}
}
diff --git a/src/components/map/components/campusBuildingSearch.vue b/src/components/map/components/campusBuildingSearch.vue
new file mode 100644
index 0000000..f10cc0f
--- /dev/null
+++ b/src/components/map/components/campusBuildingSearch.vue
@@ -0,0 +1,93 @@
+<template>
+ <div>
+ <campusNav ref="campusNavRoute"
+ v-show="campusNavFlag" />
+ <div class="map-campus-serarch">
+ <el-input class="search-input"
+ placeholder="校园搜索…"
+ v-model="input3">
+ </el-input>
+ <el-button-group>
+ <el-button @click="navigationShow"
+ class="deblurring"
+ icon="el-icon-my-path"></el-button>
+ <el-button class="deblurring"
+ type="primary"
+ icon="el-icon-my-search"></el-button>
+ </el-button-group>
+ </div>
+ </div>
+</template>
+
+<script>
+
+export default {
+ name: 'campusBuildingSearch',
+ data () {
+ return {
+ campusNavFlag: false
+ }
+ },
+
+ methods: {
+ navigationShow () {
+ this.campusNavFlag = true
+ },
+ closeCampusNav () {
+ this.campusNavFlag = false
+ }
+ }
+
+}
+</script>
+
+<style lang='scss' scope>
+.map-campus-serarch {
+ position: fixed;
+ top: 100px;
+ left: 0;
+ right: 0;
+ bottom: auto;
+ margin: auto;
+ width: 320px;
+ height: 40px;
+ z-index: 11;
+
+ .search-input {
+ float: left;
+ width: 240px;
+ border-radius: 5px 0 0 5px;
+
+ input {
+ border-radius: 5px 0 0 5px;
+ }
+ }
+
+ .el-button-group {
+ float: left;
+ width: 80px;
+
+ .el-button {
+ margin: 0;
+ position: relative;
+ width: 40px;
+ height: 40px;
+ border-radius: 0;
+ border: none;
+
+ i {
+ margin: auto;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ }
+ }
+
+ .el-button:nth-child(2) {
+ border-radius: 0 5px 5px 0;
+ }
+ }
+}
+</style>
diff --git a/src/components/map/component/mapPopup.vue b/src/components/map/components/mapPopup.vue
similarity index 100%
rename from src/components/map/component/mapPopup.vue
rename to src/components/map/components/mapPopup.vue
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 416e290..5a134fc 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -6,17 +6,24 @@
<left-nav ref="leftNav"></left-nav>
<mapPopup />
+
+ <!-- <campusBuildingSearch /> -->
+ <div class="keep-out">
+ 智慧校园
+ </div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
-import mapPopup from './component/mapPopup.vue'
+import mapPopup from './components/mapPopup.vue'
+import campusBuildingSearch from './components/campusBuildingSearch.vue'
export default {
name: 'mapBox',
components: {
- mapPopup
+ mapPopup,
+ campusBuildingSearch
},
data () {
return {
@@ -232,13 +239,14 @@
)
wall.setStyle({
material: new that.DC.WallTrailMaterialProperty({
- color: that.DC.Color.DEEPSKYBLUE,
- speed: 4
+ color: that.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
+ // color: that.DC.Color.CYAN,
+ speed: 10
})
})
wallLayer.addOverlay(wall)
- viewer.use(new that.DC.Measure())
+ // viewer.use(new that.DC.Measure())
// viewer.flyTo(wallLayer)
@@ -248,8 +256,8 @@
viewer.compass.enable = true
viewer.zoomController.enable = true
- viewer.locationBar.enable = true
- viewer.distanceLegend.enable = true
+ // viewer.locationBar.enable = true
+ // viewer.distanceLegend.enable = true
}
that.DC.ready(initViewer)
@@ -261,4 +269,17 @@
</script>
<style lang='scss' scope>
+.keep-out {
+ position: fixed;
+ left: 6px;
+ bottom: 2px;
+ z-index: 11;
+ width: 72px;
+ height: 30px;
+ line-height: 30px;
+ text-align: center;
+ background: rgba(0, 0, 0, 0.8);
+ color: #fff;
+ border-radius: 8px;
+}
</style>
diff --git a/src/components/orgNavBar/index.vue b/src/components/orgNavBar/index.vue
index ddc8bc8..d8f67e1 100644
--- a/src/components/orgNavBar/index.vue
+++ b/src/components/orgNavBar/index.vue
@@ -169,8 +169,8 @@
width: 322px;
height: auto;
border-radius: 8px;
- top: 16%;
- left: 5%;
+ top: 140px;
+ left: 140px;
background-color: transparent;
z-index: 999;
font-size: 14px;
diff --git a/src/components/serviceNavBar/index.vue b/src/components/serviceNavBar/index.vue
index 99f650f..2d93d90 100644
--- a/src/components/serviceNavBar/index.vue
+++ b/src/components/serviceNavBar/index.vue
@@ -336,8 +336,8 @@
width: 322px;
height: auto;
border-radius: 8px;
- top: 16%;
- left: 5%;
+ top: 140px;
+ left: 140px;
background-color: transparent;
z-index: 999;
font-size: 14px;
diff --git a/src/pcviews/tool/ranging.vue b/src/pcviews/tool/ranging.vue
index 4380814..6d2c065 100644
--- a/src/pcviews/tool/ranging.vue
+++ b/src/pcviews/tool/ranging.vue
@@ -3,18 +3,40 @@
* @Name: 地图测距
* @Date: 2021-11-13 16:04:27
* @Last Modified by: Morpheus
- * @Last Modified time: 2021-11-13 16:26:49
+ * @Last Modified time: 2021-12-24 09:46:27
*/
<template>
<div class="tool-ranging">
- <el-button type="primary" size="mini" @click.stop="calcDistance">
- 开始
- </el-button>
+ <div class="header"
+ @mousedown="move"
+ :class="{'move': moveFlag}">
+ <div class="title">
+ <img class="icon deblurring"
+ src="/img/icon/dtcj.png"
+ alt="">
+ <span>
+ 地图测距
+ </span>
+ </div>
+ <img class="close"
+ src="/img/navicon/close.png"
+ alt=""
+ @click="closeModel">
+ </div>
+ <div class="content">
+ <el-button type="primary"
+ size="mini"
+ @click.stop="calcDistance">
+ 开始
+ </el-button>
- <el-button type="danger" size="mini" @click.stop="deactivate">
- 结束
- </el-button>
+ <el-button type="danger"
+ size="mini"
+ @click.stop="deactivate">
+ 结束
+ </el-button>
+ </div>
</div>
</template>
@@ -37,6 +59,11 @@
deactivate () {
this.viewer.measure.deactivate()
+ },
+
+ closeModel () {
+ this.$store.dispatch('delVisitedViews', this.$route)
+ this.$router.push('/pcLayout/default')
}
},
destroyed () {
diff --git a/src/styles/pcpage/dc-ui.scss b/src/styles/pcpage/dc-ui.scss
index 718b1d1..d6eb8c1 100644
--- a/src/styles/pcpage/dc-ui.scss
+++ b/src/styles/pcpage/dc-ui.scss
@@ -1,12 +1,14 @@
#viewer-container {
.dc-compass {
- top: 20px;
+ top: 40px;
+ left: 40px;
transform: scale(1.6);
}
.dc-zoom-controller {
- top: 120px;
+ top: 160px;
+ left: 56px;
transform: scale(1.6);
}
diff --git a/src/styles/pcpage/element-ui.scss b/src/styles/pcpage/element-ui.scss
index bbe189e..820dab4 100644
--- a/src/styles/pcpage/element-ui.scss
+++ b/src/styles/pcpage/element-ui.scss
@@ -39,7 +39,7 @@
.el-menu {
.el-menu-item {
- font-size: 14px !important;
+ font-size: 16px !important;
}
}
}
@@ -59,4 +59,29 @@
.el-image-viewer__wrapper {
background: #000;
+}
+
+#viewer-container {
+
+ .el-icon-my-path {
+ background: url(/img/icon/path.png) center no-repeat;
+ background-size: 14px 14px;
+ }
+
+ .el-icon-my-path:before {
+ content: "替";
+ font-size: 16px;
+ visibility: hidden;
+ }
+
+ .el-icon-my-search {
+ background: url(/img/icon/search.png) center no-repeat;
+ background-size: 14px 14px;
+ }
+
+ .el-icon-my-search:before {
+ content: "替";
+ font-size: 16px;
+ visibility: hidden;
+ }
}
\ No newline at end of file
diff --git a/src/styles/pcpage/tool/ranging.scss b/src/styles/pcpage/tool/ranging.scss
index 6facc25..ddfb0a8 100644
--- a/src/styles/pcpage/tool/ranging.scss
+++ b/src/styles/pcpage/tool/ranging.scss
@@ -1,11 +1,52 @@
.tool-ranging {
position: fixed;
- top: 80px;
- left: 10px;
- width: 160px;
- height: 54px;
- line-height: 54px;
- text-align: center;
+ top: 100px;
+ left: 140px;
+ width: 180px;
+ height: 106px;
background: #fff;
- border-radius: 5px;
+ border-radius: 8px;
+
+ .header {
+ position: relative;
+ border-radius: 8px 8px 0 0;
+ width: 100%;
+ height: 36px;
+ line-height: 36px;
+ background-color: #2196f3;
+
+ .title {
+ padding-left: 10px;
+
+ img {
+ width: 20px;
+ height: 20px;
+ vertical-align: middle;
+ }
+
+ span {
+ margin-left: 6px;
+ display: inline-block;
+ vertical-align: middle;
+ color: #fff;
+ }
+ }
+
+ .close {
+ position: absolute;
+ right: 6px;
+ top: 0;
+ left: auto;
+ bottom: 0;
+ margin: auto;
+ width: 14px;
+ height: 14px;
+ cursor: pointer;
+ }
+ }
+
+ .content {
+ line-height: 70px;
+ text-align: center;
+ }
}
\ No newline at end of file
--
Gitblit v1.9.3