Merge branch 'master' of http://192.168.0.105:10010/r/school-web

shuishen

2022-01-12 acb45c731c3ccd0a67061efb4e7bdf4f56005672

 src/components/campusNav/index.vue

@@ -34,19 +34,41 @@
            </div>
            <div class="content">
                <div>
                    <div>
                        <el-input v-model="getToName"
                    <div id="ToNameContainer">
                        <el-input v-model="toNameText"
                                  @input="toNameChange"
                                  placeholder="起点……">
                            <template slot="prepend"><i class="el-icon-location"
                                   style="color: green;"></i></template>
                        </el-input>
                        <div v-show="toNameShow"
                             class="toname-value-box">
                            <ul>
                                <li v-for="(item, index) in toNameList"
                                    :key="index"
                                    @click="loadPopup(item)">
                                    {{item.name}}
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div>
                        <el-input v-model="comeName"
                    <div id="ComeNameContainer">
                        <el-input v-model="comeNameText"
                                  @input="comeNameChange"
                                  placeholder="终点……">
                            <template slot="prepend"><i class="el-icon-location"
                                   style="color: red;"></i></template>
                        </el-input>
                        <div v-show="comeNameShow"
                             class="comename-value-box">
                            <ul>
                                <li v-for="(item, index) in comeNameList"
                                    :key="index"
                                    @click="loadPopup(item)">
                                    {{item.name}}
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div>
@@ -60,6 +82,7 @@

<script>
import { mapGetters } from 'vuex'
import { getSearchList } from '@/api/pc/public/search'
import axios from 'axios'
export default {
    name: 'campusNav',
@@ -70,12 +93,20 @@
            tabTwoFlag: false,
            DC: null,
            navigationWay: '步行',
            routeLayer: null
            routeLayer: null,
            toNameText: '',
            comeNameText: '',
            toNameList: [],
            comeNameList: [],
            toNameShow: false,
            comeNameShow: false

        }
    },
    computed: {
        ...mapGetters([
            'viewer',
            'twoOrThree',
            // 起点
            'startingPoint',
            // 终点
@@ -85,6 +116,20 @@
            // 到达名称
            'comeName'
        ])
    },
    watch: {
        getToName: {
            immediate: true,
            handler (newCode, oldCode) {
                this.toNameText = newCode
            }
        },
        comeName: {
            immediate: true,
            handler (newCode, oldCode) {
                this.comeNameText = newCode
            }
        }
    },
    created () {
        this.DC = global.DC
@@ -143,6 +188,15 @@
                this.$router.push('/pcLayout/default')
            }

            this.toNameText = ''
            this.toNameList = []
            this.toNameShow = false
            this.comeNameText = ''
            this.comeNameList = []
            this.comeNameShow = false
            if (this.routeLayer != null) {
                this.routeLayer.clear()
            }
            this.$store.commit('SET_COMENAME', '')
            this.$store.commit('SET_TERMINUS', null)
            this.$store.commit('SET_GETTONAME', '')
@@ -179,19 +233,41 @@

            var routes = ''

            var startLog = Number(this.startingPoint[0]).toFixed(6)
            var startLat = Number(this.startingPoint[1]).toFixed(6)
            var endLog = Number(this.terminus[0]).toFixed(6)
            var endLat = Number(this.terminus[1]).toFixed(6)

            var origin = this.DC.CoordTransform.WGS84ToGCJ02(startLog, startLat)
            var destination = this.DC.CoordTransform.WGS84ToGCJ02(endLog, endLat)

            if (this.navigationWay == '步行') {
                axios.get('https://restapi.amap.com/v3/direction/walking', {
                    params: {
                        origin: `${Number(this.startingPoint[0]).toFixed(6)},${Number(this.startingPoint[1]).toFixed(6)}`,
                        destination: `${Number(this.terminus[0]).toFixed(6)},${Number(this.terminus[1]).toFixed(6)}`,
                        origin: `${origin[0].toFixed(6) + ',' + origin[1].toFixed(6)}`,
                        destination: `${destination[0].toFixed(6) + ',' + destination[1].toFixed(6)}`,
                        key: '4b3e1db3211054ce5b466407cbb9d221',
                        output: 'json'
                    }
                }).then(res => {
                    res.data.route.paths[0].steps.forEach(item => {
                        item.polyline += ';'
                        routes += item.polyline
                        item.polyline = item.polyline.split(';')

                        var lineArr = []

                        item.polyline.forEach(it => {
                            it = it.split(',')
                            lineArr.push(this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(','))
                        })

                        lineArr = lineArr.join(';')

                        lineArr += ';'

                        routes += lineArr
                    })

                    console.log(routes, 123)

                    routes = routes.substr(0, routes.length - 1)

@@ -205,13 +281,45 @@
                        clampToGround: true
                    })
                    this.routeLayer.addOverlay(polyline)
                    this.viewer.flyTo(this.routeLayer)
                    if (this.twoOrThree == '3 维') {
                        this.viewer.flyTo(this.routeLayer)
                    } else {
                        var longitude = null
                        var latitude = null
                        startLog = Number(startLog)
                        endLog = Number(endLog)
                        if (startLog > endLog) {
                            longitude = (startLog - endLog) / 2 + endLog
                        } else {
                            longitude = (endLog - startLog) / 2 + startLog
                        }
                        startLat = Number(startLat)
                        endLat = Number(endLat)
                        if (startLat > endLat) {
                            latitude = (startLat - endLat) / 2 + endLat
                        } else {
                            latitude = (endLat - startLat) / 2 + startLat
                        }

                        this.viewer.camera.setView({
                            // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                            // fromDegrees()方法，将经纬度和高程转换为世界坐标
                            destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(longitude, latitude, 300),
                            orientation: {
                                // 指向
                                heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                // 视角
                                pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
                                roll: 0.0
                            }
                        })
                    }
                })
            } else {
                axios.get('https://restapi.amap.com/v3/direction/driving', {
                    params: {
                        origin: `${Number(this.startingPoint[0]).toFixed(6)},${Number(this.startingPoint[1]).toFixed(6)}`,
                        destination: `${Number(this.terminus[0]).toFixed(6)},${Number(this.terminus[1]).toFixed(6)}`,
                        origin: `${startLog + ',' + startLat}`,
                        destination: `${endLog + ',' + endLat}`,
                        key: '4b3e1db3211054ce5b466407cbb9d221',
                        strategy: 2,
                        extensions: 'all',
@@ -235,7 +343,40 @@
                        clampToGround: true
                    })
                    this.routeLayer.addOverlay(polyline)
                    this.viewer.flyTo(this.routeLayer)

                    if (this.twoOrThree == '3 维') {
                        this.viewer.flyTo(this.routeLayer)
                    } else {
                        var longitude = null
                        var latitude = null
                        startLog = Number(startLog)
                        endLog = Number(endLog)
                        if (startLog > endLog) {
                            longitude = (startLog - endLog) / 2 + endLog
                        } else {
                            longitude = (endLog - startLog) / 2 + startLog
                        }
                        startLat = Number(startLat)
                        endLat = Number(endLat)
                        if (startLat > endLat) {
                            latitude = (startLat - endLat) / 2 + endLat
                        } else {
                            latitude = (endLat - startLat) / 2 + startLat
                        }

                        this.viewer.camera.setView({
                            // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                            // fromDegrees()方法，将经纬度和高程转换为世界坐标
                            destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(longitude, latitude, 300),
                            orientation: {
                                // 指向
                                heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                // 视角
                                pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
                                roll: 0.0
                            }
                        })
                    }
                })
            }
        },
@@ -243,6 +384,52 @@
        clearLayer () {
            if (this.routeLayer != null) {
                this.routeLayer.clear()
            }
        },

        toNameChange () {
            if (this.toNameText == '') {
                this.toNameList = []
                this.toNameShow = false
                return
            }
            getSearchList({ mechanismName: this.toNameText }).then(res => {
                if (res.data.data.length > 0) {
                    this.toNameList = res.data.data
                    this.toNameShow = true
                }
            })
        },

        comeNameChange () {
            if (this.comeNameText == '') {
                this.comeNameList = []
                this.comeNameShow = false
                return
            }
            getSearchList({ mechanismName: this.comeNameText }).then(res => {
                if (res.data.data.length > 0) {
                    this.comeNameList = res.data.data
                    this.comeNameShow = true
                }
            })
        },

        shortcutShow (event) {
            var toBox = document.getElementById('ToNameContainer')

            if (toBox) {
                if (!toBox.contains(event.target)) { // 这句是说如果我们点击到了id为myPanel以外的区域
                    this.toNameShow = false
                }
            }

            var comeBox = document.getElementById('ComeNameContainer')

            if (comeBox) {
                if (!comeBox.contains(event.target)) { // 这句是说如果我们点击到了id为myPanel以外的区域
                    this.comeNameShow = false
                }
            }
        }
    }
@@ -366,6 +553,7 @@
        }

        .content {
            position: relative;
            padding: 0 10px;
            display: flex;
            align-items: center;
@@ -387,6 +575,39 @@
                width: 100px;
                text-align: center;
            }

            .toname-value-box,
            .comename-value-box {
                position: absolute;
                top: 48px;
                left: 65px;
                width: auto;
                min-width: 160px;
                max-height: 520px;
                color: #2c3e50;
                background: #fff;
                overflow-y: auto;
                box-shadow: 0 0 14px 2px rgb(221, 221, 221);
                border-radius: 5px;
                z-index: 11;

                ul {
                    li {
                        padding-left: 20px;
                        height: 36px;
                        line-height: 36px;
                        cursor: pointer;
                    }

                    li:hover {
                        background: #f5f5f5;
                    }
                }
            }

            .comename-value-box {
                top: 100px;
            }
        }
    }
}