From 756e81d6e35231521f0431e292edb22aed65e403 Mon Sep 17 00:00:00 2001 From: guoshipeng <3194674006@qq.com> Date: Mon, 14 Aug 2023 15:08:08 +0800 Subject: [PATCH] fix:设备详情百度地图换高德地图,经纬度批量修改 --- src/util/request.ts | 1 src/views/list/devicesBasic.vue | 150 +++++++--- src/components/map/pickCoordinate1.vue | 198 +++++++++++--- src/components/map/pickCoordinate.vue | 84 ++++-- package-lock.json | 53 ++++ public/index.html | 229 +++++++++------- package.json | 1 src/main.ts | 25 + 8 files changed, 505 insertions(+), 236 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0474547..88fb417 100644 --- a/package-lock.json +++ b/package-lock.json @@ -28,6 +28,7 @@ "rxjs-compat": "^6.5.3", "v-charts": "^1.18.0", "vue": "^2.6.10", + "vue-amap": "^0.5.10", "vue-baidu-map": "^0.21.22", "vue-class-component": "^7.1.0", "vue-i18n": "^8.15.1", @@ -17598,6 +17599,22 @@ "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=", "dev": true }, + "node_modules/uppercamelcase": { + "version": "1.1.0", + "resolved": "https://registry.npmmirror.com/uppercamelcase/-/uppercamelcase-1.1.0.tgz", + "integrity": "sha512-C7YEMvhgrvTEKEEVqA7LXNID/1TvvIwYZqNIKLquS6y/MGSkRQAav9LnTTILlC1RqUM8eTVBOe1U/fnB652PRA==", + "dependencies": { + "camelcase": "^1.2.1" + } + }, + "node_modules/uppercamelcase/node_modules/camelcase": { + "version": "1.2.1", + "resolved": "https://registry.npmmirror.com/camelcase/-/camelcase-1.2.1.tgz", + "integrity": "sha512-wzLkDa4K/mzI1OSITC+DUyjgIl/ETNHE9QvYgy6J6Jvqyyz4C0Xfd+lQhb19sX2jMpZV4IssUn0VDVmglV+s4g==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", @@ -17810,6 +17827,19 @@ "version": "2.6.13", "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.13.tgz", "integrity": "sha512-O+pAdJkce1ooYS1XyoQtpBQr9An+Oys3w39rkqxukVO3ZD1ilYJkWBGoRuadiQEm2LLJnCL2utV4TMSf52ubjw==" + }, + "node_modules/vue-amap": { + "version": "0.5.10", + "resolved": "https://registry.npmmirror.com/vue-amap/-/vue-amap-0.5.10.tgz", + "integrity": "sha512-9ViNCev1vx32+zZ5RvF/TmUZNbwL9QrdA2/OnD2GlXMfQBkJy7D08Vb7379t6guqnopDPtWJ8K6gg72h9+4GUg==", + "dependencies": { + "uppercamelcase": "^1.1.0" + }, + "engines": { + "core-js": "^2.5.0", + "node": ">= 4.0.0", + "npm": ">= 3.0.0" + } }, "node_modules/vue-baidu-map": { "version": "0.21.22", @@ -34371,6 +34401,21 @@ "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=", "dev": true }, + "uppercamelcase": { + "version": "1.1.0", + "resolved": "https://registry.npmmirror.com/uppercamelcase/-/uppercamelcase-1.1.0.tgz", + "integrity": "sha512-C7YEMvhgrvTEKEEVqA7LXNID/1TvvIwYZqNIKLquS6y/MGSkRQAav9LnTTILlC1RqUM8eTVBOe1U/fnB652PRA==", + "requires": { + "camelcase": "^1.2.1" + }, + "dependencies": { + "camelcase": { + "version": "1.2.1", + "resolved": "https://registry.npmmirror.com/camelcase/-/camelcase-1.2.1.tgz", + "integrity": "sha512-wzLkDa4K/mzI1OSITC+DUyjgIl/ETNHE9QvYgy6J6Jvqyyz4C0Xfd+lQhb19sX2jMpZV4IssUn0VDVmglV+s4g==" + } + } + }, "uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", @@ -34551,6 +34596,14 @@ "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.13.tgz", "integrity": "sha512-O+pAdJkce1ooYS1XyoQtpBQr9An+Oys3w39rkqxukVO3ZD1ilYJkWBGoRuadiQEm2LLJnCL2utV4TMSf52ubjw==" }, + "vue-amap": { + "version": "0.5.10", + "resolved": "https://registry.npmmirror.com/vue-amap/-/vue-amap-0.5.10.tgz", + "integrity": "sha512-9ViNCev1vx32+zZ5RvF/TmUZNbwL9QrdA2/OnD2GlXMfQBkJy7D08Vb7379t6guqnopDPtWJ8K6gg72h9+4GUg==", + "requires": { + "uppercamelcase": "^1.1.0" + } + }, "vue-baidu-map": { "version": "0.21.22", "resolved": "https://registry.npmjs.org/vue-baidu-map/-/vue-baidu-map-0.21.22.tgz", diff --git a/package.json b/package.json index ae50939..9ecda72 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "rxjs-compat": "^6.5.3", "v-charts": "^1.18.0", "vue": "^2.6.10", + "vue-amap": "^0.5.10", "vue-baidu-map": "^0.21.22", "vue-class-component": "^7.1.0", "vue-i18n": "^8.15.1", diff --git a/public/index.html b/public/index.html index 9e7b33d..c773f97 100644 --- a/public/index.html +++ b/public/index.html @@ -1,118 +1,143 @@ <!DOCTYPE html> <html lang="en"> - <head> - <meta charset="utf-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge"> - <meta name="viewport" content="width=device-width,initial-scale=1.0"> - <script src="//api.map.baidu.com/api?type=webgl&v=2.0&ak=9FrZ6v3P8xS290ygi40M5Ik3Fgwes4KY"></script> - <link rel="icon" href="<%= BASE_URL %>logo.ico"> - <link/> - <title>������������������������</title> - <style type="text/css"> - .preloader{ - position:fixed; - top:0; - left:0; - width:100%; - height:100%; - overflow:hidden; - background:#49a9ee; - z-index:9999; - transition:opacity .65s + +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width,initial-scale=1.0"> + <script type="text/javascript" + src="//api.map.baidu.com/api?type=webgl&v=2.0&ak=9FrZ6v3P8xS290ygi40M5Ik3Fgwes4KY"></script> + <script + src="https://webapi.amap.com/loca?v=1.3.2&key=be57d4add7dc10fb7f7924763a2179ae&plugin=AMap.MarkerClusterer"></script> + <link rel="icon" href="<%= BASE_URL %>logo.ico"> + <link /> + <title>������������������������</title> + + <style type="text/css"> + .preloader { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + overflow: hidden; + background: #49a9ee; + z-index: 9999; + transition: opacity .65s + } + + .preloader-hidden-add { + opacity: 1; + display: block + } + + .preloader-hidden-add-active { + opacity: 0 + } + + .preloader-hidden { + display: none + } + + .cs-loader { + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100% + } + + .cs-loader-inner { + transform: translateY(-50%); + top: 50%; + position: absolute; + width: 100%; + color: #fff; + text-align: center + } + + .cs-loader-inner label { + font-size: 20px; + opacity: 0; + display: inline-block + } + + @keyframes lol { + 0% { + opacity: 0; + transform: translateX(-300px) } - .preloader-hidden-add{ - opacity:1; - display:block + 33% { + opacity: 1; + transform: translateX(0) } - .preloader-hidden-add-active{ - opacity:0 + 66% { + opacity: 1; + transform: translateX(0) } - .preloader-hidden{ - display:none + 100% { + opacity: 0; + transform: translateX(300px) } + } - .cs-loader{ - position:absolute; - top:0; - left:0; - height:100%; - width:100% - } + .cs-loader-inner label:nth-child(6) { + animation: lol 3s infinite ease-in-out + } - .cs-loader-inner{ - transform:translateY(-50%); - top:50%; - position:absolute; - width:100%; - color:#fff; - text-align:center - } + .cs-loader-inner label:nth-child(5) { + animation: lol 3s .1s infinite ease-in-out + } - .cs-loader-inner label{ - font-size:20px; - opacity:0; - display:inline-block - } + .cs-loader-inner label:nth-child(4) { + animation: lol 3s .2s infinite ease-in-out + } - @keyframes lol{ - 0%{ - opacity:0; - transform:translateX(-300px) - } - 33%{ - opacity:1; - transform:translateX(0) - } - 66%{ - opacity:1; - transform:translateX(0) - } - 100%{ - opacity:0; - transform:translateX(300px) - } - } - .cs-loader-inner label:nth-child(6){ - animation:lol 3s infinite ease-in-out - } - .cs-loader-inner label:nth-child(5){ - animation:lol 3s .1s infinite ease-in-out - } - .cs-loader-inner label:nth-child(4){ - animation:lol 3s .2s infinite ease-in-out - } - .cs-loader-inner label:nth-child(3){ - animation:lol 3s .3s infinite ease-in-out - } - .cs-loader-inner label:nth-child(2){ - animation:lol 3s .4s infinite ease-in-out - } - .cs-loader-inner label:nth-child(1){ - animation:lol 3s .5s infinite ease-in-out - } - </style> - </head> - <body class="has-ad-rt"> - <noscript> - <strong>We're sorry but vue-alain doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> - </noscript> + .cs-loader-inner label:nth-child(3) { + animation: lol 3s .3s infinite ease-in-out + } - <div id="app"></div> - <div class="preloader"> - <div class="cs-loader"> - <div class="cs-loader-inner"> - <label> ���</label> - <label> ���</label> - <label> ���</label> - <label> ���</label> - <label> ���</label> - <label> ���</label> - </div> + .cs-loader-inner label:nth-child(2) { + animation: lol 3s .4s infinite ease-in-out + } + + .cs-loader-inner label:nth-child(1) { + animation: lol 3s .5s infinite ease-in-out + } + </style> +</head> + +<body class="has-ad-rt"> + <noscript> + <strong>We're sorry but vue-alain doesn't work properly without JavaScript enabled. Please enable it to + continue.</strong> + </noscript> + + <div id="app"></div> + <div class="preloader"> + <div class="cs-loader"> + <div class="cs-loader-inner"> + <label> ���</label> + <label> ���</label> + <label> ���</label> + <label> ���</label> + <label> ���</label> + <label> ���</label> </div> </div> - <!-- built files will be auto injected --> - </body> -</html> + </div> + <!-- built files will be auto injected --> + +</body> + +<script type="text/javascript"> + window._AMapSecurityConfig = { + securityJsCode: '20fcbbc1782d2853f433831e61fab769', + } + +</script> + +</html> \ No newline at end of file diff --git a/src/components/map/pickCoordinate.vue b/src/components/map/pickCoordinate.vue index 9f82ba7..19058e1 100644 --- a/src/components/map/pickCoordinate.vue +++ b/src/components/map/pickCoordinate.vue @@ -1,38 +1,65 @@ <template> <a-modal - title="������������" - destroyOnClose - :visible="true" - @ok="addLonAndLat" - @cancel="handleMapCancel" - okText="������" - class="modalStyle" + title="������������" + destroyOnClose + :visible="true" + @ok="addLonAndLat" + @cancel="handleMapCancel" + okText="������" + class="modalStyle" > - <p style="position: absolute; bottom:-3px;right: 200px"><span>���������������</span><span style="font-size: 18px;font-weight: bold">{{ mapRecord.name }}</span></p> + <p style="position: absolute; bottom: -3px; right: 200px"> + <span>���������������</span + ><span style="font-size: 18px; font-weight: bold">{{ + mapRecord.name + }}</span> + </p> <div> - <p> - <span>���������</span><a-input v-model="keyword" style="display: inline; width: 160px;height: 26px"/> - <span style="margin-left: 25px">���������</span><a-input disabled="disabled" v-model="lonAndLat.lng" style="display: inline; width: 160px;height: 26px"/> - <span style="margin-left: 25px">���������</span><a-input disabled="disabled" v-model="lonAndLat.lat" style="display: inline; width: 160px;height: 26px"/> - </p> -<!-- :scroll-wheel-zoom="true"--> - <baidu-map + <p> + <span>���������</span + ><a-input + v-model="keyword" + style="display: inline; width: 160px; height: 26px" + /> + <span style="margin-left: 25px">���������</span + ><a-input + disabled="disabled" + v-model="lonAndLat.lng" + style="display: inline; width: 160px; height: 26px" + /> + <span style="margin-left: 25px">���������</span + ><a-input + disabled="disabled" + v-model="lonAndLat.lat" + style="display: inline; width: 160px; height: 26px" + /> + </p> + <!-- :scroll-wheel-zoom="true"--> + <baidu-map :center="center" :zoom="zoom" @ready="handler" @click="mapClick" :scroll-wheel-zoom="true" - style="height: 400px;width: 100%;"> - <bm-control> - <bm-local-search :keyword="keyword" :auto-viewport="true" style="display: none" ></bm-local-search> - <bm-marker :position="{ lng:lonAndLat.lng , lat: lonAndLat.lat}" :dragging="true" animation="BMAP_ANIMATION_BOUNCE"> - </bm-marker> - </bm-control> - </baidu-map> - </div> + style="height: 400px; width: 100%" + > + <bm-control> + <bm-local-search + :keyword="keyword" + :auto-viewport="true" + style="display: none" + ></bm-local-search> + <bm-marker + :position="{ lng: lonAndLat.lng, lat: lonAndLat.lat }" + :dragging="true" + animation="BMAP_ANIMATION_BOUNCE" + > + </bm-marker> + </bm-control> + </baidu-map> + </div> </a-modal> - </template> <script lang="tsx"> @@ -139,13 +166,12 @@ </script> <style lang="less"> - -.modalStyle{ - .ant-modal{ +.modalStyle { + .ant-modal { margin-left: 25%; } - .ant-modal-content{ - width: 800px; + .ant-modal-content { + width: 800px; } } </style> diff --git a/src/components/map/pickCoordinate1.vue b/src/components/map/pickCoordinate1.vue index 4b75cec..8016aba 100644 --- a/src/components/map/pickCoordinate1.vue +++ b/src/components/map/pickCoordinate1.vue @@ -9,25 +9,67 @@ class="modalStyle" > <div> - <p> - <span>���������</span - ><a-input - v-model="keyword" - style="display: inline; width: 160px; height: 26px" - /> - <span style="margin-left: 25px">���������</span - ><a-input - v-model="clickPoint.lng" - style="display: inline; width: 160px; height: 26px" - /> - <span style="margin-left: 25px">���������</span - ><a-input - v-model="clickPoint.lat" - style="display: inline; width: 160px; height: 26px" - /> - </p> + <div style="display: flex"> + <div style="display: flex; width: 300px"> + <div>���������</div> + <a-input + placeholder="���������������" + id="tipinput" + style="width: 160px; height: 26px" + ></a-input> + <!-- <a-input + v-model="input" + placeholder="���������������" + id="tipinput" + style="width: 160px; height: 26px" + @change="searchMap" + ></a-input> --> + <!-- <a-button + size="small" + type="primary" + @click="searchMap" + style="margin-left: 10px" + >������</a-button + > --> + + <!-- <el-amap-search-box + :search-option="searchOption" + :on-search-result="selectPoi" + style="width: 200px; height: 26px; margin-left: 10px;border;" + /> --> + <!-- <a-input style="width: 160px; height: 26px" @focus="selectPoi" /> --> + </div> + <div> + <span style="margin-left: 25px">���������</span + ><a-input + v-model="clickPoint[0]" + style="display: inline; width: 160px; height: 26px" + /> + </div> + <div> + <span style="margin-left: 25px">���������</span + ><a-input + v-model="clickPoint[1]" + style="display: inline; width: 160px; height: 26px" + /> + </div> + </div> + <el-amap + ref="map" + :center="clickPoint" + :events="{ click: mapClick }" + :zoom="zoom" + :scroll-wheel-zoom="true" + style="height: 400px; width: 100%; margin-top: 20px" + > + <el-amap-marker + :position="clickPoint" + animation="AMAP_ANIMATION_BOUNCE" + :dragging="true" + ></el-amap-marker> + </el-amap> <!-- :scroll-wheel-zoom="true"--> - <baidu-map + <!-- <baidu-map :center="center" :zoom="zoom" @ready="handler" @@ -48,7 +90,7 @@ > </bm-marker> </bm-control> - </baidu-map> + </baidu-map> --> </div> </a-modal> </template> @@ -67,10 +109,10 @@ @Component({ }) export default class PickCoordinate extends Vue { - private center: any = { - lng: 120.726838, - lat: 31.3421 - } + private center: any = [ + 120.726838, + 31.3421 + ] @Prop({ type: String, default: '' @@ -84,13 +126,17 @@ private typeOperation!: string private keyword: string = '' - private zoom = 3 - - @Watch('clickPoint', {deep: true}) - private monitorMapFlag(newVal: any, oldVal: any) { - this.center.lng = newVal.lng - this.center.lat = newVal.lat + private zoom = 19 + private searchOption:any={ + city: '������', + citylimit: false } + @Watch('clickPoint', {deep: true, immediate: true},) + private monitorMapFlag(newVal: any, oldVal: any) { + console.log(newVal,'newVal'); + this.center= [newVal.lng,newVal.lat] + } + private num1:any=1 @Watch('lnglat', {deep: true, immediate: true}) private lnglatWatch(newVal: any, oldVal: any) { @@ -100,32 +146,68 @@ // this.center.lat = newVal.lat } private created() { - + console.log(this.clickPoint,'clickPoint'); } - - - // ��������������� - private handler({BMap, map}) { - this.center.lng = this.typeOperation === 'add' ? '120.726838' : this.lnglat.split(',')[1] - this.center.lat = this.typeOperation === 'add' ? '31.3421' : this.lnglat.split(',')[0] - this.zoom = 19 + // private handler({BMap, map}) { + // this.center.lng = this.typeOperation === 'add' ? '120.726838' : this.lnglat.split(',')[1] + // this.center.lat = this.typeOperation === 'add' ? '31.3421' : this.lnglat.split(',')[0] + // this.zoom = 19 + + // } + private selectPoi(e){ + console.log(e); + let poi = e + if (poi.length > 0) { + this.clickPoint = [poi[0].lng, poi[0].lat] + } + } + private input:any='' + private mark:any='' + private searchMap(){ + var autoOptions = { + input: "tipinput" + }; + var auto = new AMap.AutoComplete(autoOptions); + const placeSearch = new AMap.PlaceSearch(this.input); + console.log(window); + auto.on("select", select);//������������������������������������������������ + function select(e) { + console.log(e.poi.adcode); + placeSearch.setCity(e.poi.adcode); + placeSearch.search(e.poi.name); //��������������������� + } + + // ��������������� + // console.log(this.input); + // placeSearch.search(this.input, (status, result) => { + // // ������������������result������������������POI������ + + // console.log(result);//��������������������������������������������������������������������������� + // }); + // // ������������������������ + // AMap.event.addListener(placeSearch, "selectChanged", (SelectChangeEvent) => { + // // ������������������������������������������ + // this.mark = SelectChangeEvent.selected.data; + // console.log(SelectChangeEvent.selected.data,'������'); + // }); } // ��������������������������� - private clickPoint: any = this.lnglat === '' ? { - lng: ' 120.726838', - lat: ' 31.3421' - } : { - lng: this.lnglat.split(',')[1], - lat: this.lnglat.split(',')[0] - } + private clickPoint: any = this.lnglat === '' ? [ + 120.720262, + 31.335757 + ] : [ + this.lnglat.split(',')[1], + this.lnglat.split(',')[0] + ] private mapClick(e: any) { - const { lng, lat } = e.point - this.clickPoint.lng = lng - this.clickPoint.lat = lat + const { lng, lat } = e.lnglat + this.clickPoint=[ lng, lat] + this.$forceUpdate() + // console.log(this.clickPoint); } private handleMapCancel() { @@ -135,11 +217,12 @@ private addLonAndLat() { if (this.typeOperation === 'add') { + console.log('add'); this.sendLonLat(this.clickPoint) } else { + console.log('upa'); this.editLonLat(this.clickPoint) } - this.flagSend(false) } @@ -150,17 +233,19 @@ @Emit('sendLonLat') private sendLonLat(lonLat: any) { + console.log(lonLat,'jia'); return lonLat; } @Emit('editLonLat') private editLonLat(lonLat: any) { + console.log(lonLat,'gai'); return lonLat; } } </script> -<style lang="less"> +<style lang="less" scoped> .modalStyle { .ant-modal { margin-left: 25%; @@ -173,4 +258,19 @@ .anchorBL { display: none; } +/* ���������������������logo */ +/deep/.amap-logo { + display: none; + opacity: 0 !important; +} +/deep/.amap-copyright { + opacity: 0; +} +.amap-sug-result { + position: absolute; + z-index: 9999 !important;; + background-color: #fefefe; + border: 1px solid #d1d1d1; + bottom: auto; +} </style> diff --git a/src/main.ts b/src/main.ts index 083fd56..ad8ffc2 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,6 +1,6 @@ import Vue from 'vue'; import axios from 'axios' -import {i18n} from './app/index'; +import { i18n } from './app/index'; import App from './App.vue'; import router from '@/route/router'; @@ -11,11 +11,22 @@ //������������ import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { - ak: '9FrZ6v3P8xS290ygi40M5Ik3Fgwes4KY'//������������key + ak: '9FrZ6v3P8xS290ygi40M5Ik3Fgwes4KY'//������������key +}) + +import AMap from 'vue-amap' +Vue.use(AMap) +AMap.initAMapApiLoader({ + key: 'c4e73f2c6972766d6a54dffd2f501cac', + plugin: ['AMap.moveAnimation', 'AMap.PlaceSearch', 'AMap.Scale', + 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor', + 'AMap.DistrictSearch', 'AMap.Geocoder', 'AMap.AutoComplete'], + // ������������ sdk ��������� 1.4.4 + v: '1.4.4' }) // ������������������ -import {preloaderFinished} from './util/preloader'; +import { preloaderFinished } from './util/preloader'; preloaderFinished(); import Startup from '@/core/Startup'; @@ -38,17 +49,17 @@ app.$mount('#app'); // app������ - ( window as any ).appBootstrap(); + (window as any).appBootstrap(); // ������app������ store.commit('app/appName', res.data.app); // ���storage������������token������������������������token������ const initToken = app.$ss.get('token'); - if ( initToken != null) { - store.commit('user/loginSuccess', {token: initToken}); + if (initToken != null) { + store.commit('user/loginSuccess', { token: initToken }); // ������acl������ - store.dispatch('acl/login', {username: initToken}); + store.dispatch('acl/login', { username: initToken }); } }, ); diff --git a/src/util/request.ts b/src/util/request.ts index 0a78c66..f69facc 100644 --- a/src/util/request.ts +++ b/src/util/request.ts @@ -5,6 +5,7 @@ const instance = axios.create({ baseURL: 'http://47.99.64.149:8082/', // baseUrl������������������������������������url������ ������������ + // baseURL: 'http://120.26.43.34:8082/', // baseURL: 'http://www.7drlb7.com:8082/', // baseUrl������������������������������������url������ ������������ timeout: 5000 }) diff --git a/src/views/list/devicesBasic.vue b/src/views/list/devicesBasic.vue index 62b48f1..fab16c4 100644 --- a/src/views/list/devicesBasic.vue +++ b/src/views/list/devicesBasic.vue @@ -1089,7 +1089,6 @@ import { jsonp } from 'vue-jsonp' import any = jasmine.any; - const statusMap = ["default", "processing", "success", "error"]; const status = ["������", "���������", "���������", "������"]; @@ -1288,16 +1287,22 @@ ] private changesen:number=0 private handleChangevalue1(value: string){ + console.log(this.changesen); if(this.changesen===1){ this.handleChange2(this.reskey); } - this.changesen=1; } private AQIhandleChange(value: string){ - this.handleChange2(this.reskey); + console.log(this.changesen); + if(this.changesen===1){ + this.handleChange2(this.reskey); + } } private ceAQIhandleChange(value: string){ - this.handleChange2(this.reskey); + console.log(this.changesen); + if(this.changesen===1){ + this.handleChange2(this.reskey); + } } private tablecolumns:TableColumnType<datatable>=[ { @@ -1344,7 +1349,7 @@ ] private rowSelectionChange(selectedRowKeys: string[], selectedRows: DataType[]){ - console.log(selectedRows); + // console.log(selectedRows); this.selectedtable=selectedRows } private selectedtable:any[]=[] @@ -1506,6 +1511,7 @@ this.addMapFlag = true } private showMap2() { + this.typeOperation = 'upa' this.editMapFlag = true } // ������������������ @@ -1654,7 +1660,6 @@ //��������������������� private handleChange1(selectedItems:any) { - if (selectedItems === undefined) { this.selectMt = null }else { @@ -1678,9 +1683,10 @@ this.datatable=[] this.datatable=res.data.data if(this.selectvalue1==='a99054'){ + console.log(21323); for(var i=0;i<this.datatable.length;i++){ if(this.ceAQIvalue==='+'){ - this.datatable[i].cel=Number((this.datatable[i].cel + this.ceAQIvaluein).toFixed(2)) + this.datatable[i].cel=((this.datatable[i].cel-0) + (this.ceAQIvaluein-0)).toFixed(2) }else if(this.ceAQIvalue==='-'){ this.datatable[i].cel=Number((this.datatable[i].cel - this.ceAQIvaluein).toFixed(2)) }else if(this.ceAQIvalue==='*'){ @@ -1696,28 +1702,27 @@ // this.datatable[i].cel=parseFloat(this.datatable[i].cel+this.ceAQIvaluein).toFixed(2) // this.datatable[i].agehou='aqi*'+this.datatable[i].aqi+'+'+'ce1*'+this.datatable[i].cel if(this.AQIvalue1==='+'){ - // console.log(this,'+++'); - this.datatable[i].aqi=Number((this.datatable[i].aqi + this.AQIvalue).toFixed(2)) + this.datatable[i].aqi=((this.datatable[i].aqi-0) + (this.AQIvalue-0)).toFixed(2) }else if(this.AQIvalue1==='-'){ - this.datatable[i].aqi=Number((this.datatable[i].aqi - this.AQIvalue).toFixed(2)) + this.datatable[i].aqi=Number((this.datatable[i].aqi - this.AQIvalue)).toFixed(2) } else if(this.AQIvalue1==='*'){ - this.datatable[i].aqi=Number((this.datatable[i].aqi * this.AQIvalue).toFixed(2)) + this.datatable[i].aqi=Number((this.datatable[i].aqi * this.AQIvalue)).toFixed(2) }else if(this.AQIvalue1==='/'){ - this.datatable[i].aqi=Number((this.datatable[i].aqi / this.AQIvalue).toFixed(2)) + this.datatable[i].aqi=Number((this.datatable[i].aqi / this.AQIvalue).toFixed(3)) } if(this.ceAQIvalue==='+'){ - this.datatable[i].cel=Number((this.datatable[i].cel + this.ceAQIvaluein).toFixed(2)) + this.datatable[i].cel=((this.datatable[i].cel-0) + (this.ceAQIvaluein-0)).toFixed(2) }else if(this.ceAQIvalue==='-'){ - this.datatable[i].cel=Number((this.datatable[i].cel - this.ceAQIvaluein).toFixed(2)) + this.datatable[i].cel=Number((this.datatable[i].cel - this.ceAQIvaluein)).toFixed(2) }else if(this.ceAQIvalue==='*'){ - this.datatable[i].cel=Number((this.datatable[i].cel * this.ceAQIvaluein).toFixed(2)) + this.datatable[i].cel=Number((this.datatable[i].cel * this.ceAQIvaluein)).toFixed(2) }else if(this.ceAQIvalue==='/'){ this.datatable[i].cel=Number((this.datatable[i].cel / this.ceAQIvaluein).toFixed(3)) } this.datatable[i].agehou='aqi*'+this.datatable[i].aqi+'+'+'ce1*'+this.datatable[i].cel } } - + this.changesen=1; }) } @@ -2046,10 +2051,10 @@ } private handleCreateModalCancel1():any{ + this.datatable=[]; + this.selectvalue1='���������������'; + this.changesen=0; this.visibleCreateModal1=false; - this.datatable=[] - this.selectvalue1='���������������' - this.changesen=0 } private handlerSelectChange(arr1: any, arr2: any) { @@ -2190,48 +2195,95 @@ } private receiveFlag2(flag: boolean){ + console.log('receiveFlag2'); this.editMapFlag = flag } // ������������������������ private receiveLomLat(lonLat: any) { + this.addLL = lonLat this.getTownData(lonLat) } - + private getTownData(lonLat: any) { - // jsonp('/proxy/reverse_geocoding/v3/', { - jsonp('https://api.map.baidu.com/reverse_geocoding/v3/', { - ak: 'e5ig9Z7AKFjv8wbkqDbuLkUMzBev0tgT', - output: 'json', - coordtype: 'wgs8411', - extensions_town: true, - location: lonLat.lat+ ',' + lonLat.lng - }).then((res: any) => { - if(this.typeOperation === 'add') { - this.town_code = res.result.addressComponent.town_code - this.form.setFieldsValue({ - jingdu: this.addLL.lng, - weidu: this.addLL.lat, - town: res.result.addressComponent.town - }) - } else { - console.log(res); - if (!(res.result.addressComponent.town === '' && res.result.addressComponent.town_code === '')){ - this.editBeforeData.town.townName = res.result.addressComponent.town - this.editBeforeData.town.townCode = res.result.addressComponent.town_code - } else { - this.editBeforeData.town.townName = res.result.addressComponent.town - this.editBeforeData.town.townCode = res.result.addressComponent.town_code - this.$message.warning('������������������������') - } + console.log(lonLat,'dsasa'); + let self=this + var geocoder = new AMap.Geocoder({ + // city ������������������������������������������������������������adcode ��� citycode + city: '010' + }) + geocoder.getAddress(lonLat, function(status, result) { + console.log(result,'result'); + if (status === 'complete' && result.info === 'OK') { + // self.formattedAddress=result.regeocode.formattedAddress + // console.log(result,'321312'); + if(self.typeOperation === 'add') { + if(result.regeocode.addressComponent.towncode.length>9){ + self.town_code=result.regeocode.addressComponent.towncode.slice(0,9) + }else{ + self.town_code = result.regeocode.addressComponent.towncode + } + self.form.setFieldsValue({ + jingdu: self.addLL[0], + weidu: self.addLL[1], + town: result.regeocode.addressComponent.township + }) + console.log(self.town_code); + } else { + if (!(result.regeocode.addressComponent.township === '' && result.regeocode.addressComponent.towncode === '')){ + self.editBeforeData.town.townName = result.regeocode.addressComponent.township + if(result.regeocode.addressComponent.towncode.length>9){ + self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode.slice(0,9) + }else{ + self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode + } + // console.log(self.editBeforeData.town.townName,self.editBeforeData.town.townCode,'222'); + } else { + self.editBeforeData.town.townName = result.regeocode.addressComponent.town + self.editBeforeData.town.townCode = result.regeocode.addressComponent.towncode + self.$message.warning('������������������������') + } - } - }) + } + // result������������������������������������ + } + }) + + // jsonp('/proxy/reverse_geocoding/v3/', { + // jsonp('https://api.map.baidu.com/reverse_geocoding/v3/', { + // ak: 'e5ig9Z7AKFjv8wbkqDbuLkUMzBev0tgT', + // output: 'json', + // coordtype: 'wgs8411', + // extensions_town: true, + // location: lonLat.lat+ ',' + lonLat.lng + // }).then((res: any) => { + // console.log(res,'res'); + // if(this.typeOperation === 'add') { + // this.town_code = res.result.addressComponent.town_code + // this.form.setFieldsValue({ + // jingdu: this.addLL.lng, + // weidu: this.addLL.lat, + // town: res.result.addressComponent.town + // }) + // } else { + // console.log(res,'555'); + // if (!(res.result.addressComponent.town === '' && res.result.addressComponent.town_code === '')){ + // this.editBeforeData.town.townName = res.result.addressComponent.town + // this.editBeforeData.town.townCode = res.result.addressComponent.town_code + // } else { + // this.editBeforeData.town.townName = res.result.addressComponent.town + // this.editBeforeData.town.townCode = res.result.addressComponent.town_code + // this.$message.warning('������������������������') + // } + + // } + // }) } // ������������������������ private receiveLomLat1(lonLat: any) { - this.editBeforeData.longitude = lonLat.lng - this.editBeforeData.latitude = lonLat.lat + console.log(lonLat,'lonLat'); + this.editBeforeData.longitude = lonLat[0] + this.editBeforeData.latitude = lonLat[1] this.getTownData(lonLat) } -- Gitblit v1.8.0