From bbe8fd48f627ab77260a732a56c522fb2e112c48 Mon Sep 17 00:00:00 2001 From: jjLv <1981429112@qq.com> Date: Thu, 5 Dec 2024 11:16:37 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/index.js | 2 +- index.html | 3 + package-lock.json | 1658 ++++++++++++++++------------ src/api/index.js | 3 +- src/assets/img/close.png | Bin 0 -> 1939 bytes src/assets/img/location-icon.png | Bin 0 -> 4713 bytes src/assets/img/project-icon.png | Bin 0 -> 3844 bytes src/components/home/countryMap.vue | 179 ++- src/components/home/new-map.vue | 209 ++++ src/router/index.js | 10 +- src/views/Home/index.vue | 26 +- src/views/newHome/index.vue | 430 ++++++++ 12 files changed, 1689 insertions(+), 831 deletions(-) create mode 100644 src/assets/img/close.png create mode 100644 src/assets/img/location-icon.png create mode 100644 src/assets/img/project-icon.png create mode 100644 src/components/home/new-map.vue create mode 100644 src/views/newHome/index.vue diff --git a/config/index.js b/config/index.js index a995b14..ee6f874 100644 --- a/config/index.js +++ b/config/index.js @@ -19,7 +19,7 @@ var proxyUrl = (module.exports = { proxyTable: { '/screen': { // target: 'http://112.29.103.165:21626',//重庆 - target: 'http://192.168.2.216:39080', //测试 + target: 'http://localhost:39080', //测试 // target: 'http://10.40.92.74:8080', changeOrigin: true, // secure: true, //如果是https接口,需要配置这个参数 diff --git a/index.html b/index.html index a53b24b..82a65b1 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,9 @@ content="width=device-width, initial-scale=1.0, user-scalable=0" /> + + +
eAJwYi3W!fzrT5}l} zrSXmU+RT}3M}_Xo<>kl4QF}kb&O$F5OMQ{G)PvH;JtS^q4`@2GDcokiO1KPoE7gJ> zxOsVuOM{l*xfvpq4BpGs;mo-+*=KhDWy6XM!r9-3r9|nCa!sihWYN>Ski6AGH#-Vt`}OgKN@#mjQdS2jA}N!veoYzicb6 z*HRpWg$2TTMqN@wfC^cONP!oYm6&!@1D2VPVn|DZD@4uj0=f&ham!}$CA V${;l(Gsf-+phe%vV1J4jGpL7Z^aWc_!6Q%f#(XApW(|QQl z`#$i|KA^Kh_Z6VbePgmog#o1FC$&-uUYCny^w&J39>b<};+w5)c#42I(%kX|c?|{P z+>KfBidiHgOi!dxV+%0jya>=>WcRzkPFnh%ot82wl46xI7|qhsjU};VatJ0gVbV;! z)?$lwb>jwFTaE~lcViFJ?q+8kp+&*a;7>XYIQh)TT7#8iP5{1mH1O7T;GLZb5alW9 zw9A$-2_?!y12|nhSWX{*qHzN+t{0R1BF-}DQW>&Jfl~qrqb4+~o&0s+^w~oLWkkL+ zo!*~1O^*>oea8f4fTS}-i_pj&Q3!DUOD~C*7+6~`&Ld#1ojI5tujwG3HCEoS9PrDh z6R;T=u}qx~ocLAUwM9-wFPm*+oy>hQieJLy-d>!lfQelqLs|0`CJz+C>QujMyM(zX z^yad041qceH4_Q0p*~?&TNn8`w9_vu M`p zMAG gGWeDm*K#fyPbu#(x2$CJjwmQIjmQ zByK4kxCM?!>(7K9x;DE6ARqT;UbJRK^`q09m^HNpvw4gjurZnpOlBWi3Yk5hc{sFG zrq2$;SSkQvOvy@aV@U;Sv)1I=lT8#c>LRRSk!qI5C~va1GJ+*xR_e#8UXiKXYlW{2 zdHB(K>o|x}lR}>+EFFARGt0y5I_$rLg!&0xk(cCJ6Dex7f^j)A#8Ez^opt*GjG7$! zG#ZZu$(YhhLS6d^{iL`g%vMHY2st`r;b*_SpAuGlK&9L)j0TW oBg&kyfKRx`v9D6CDo$yF^1n^Ikfz_hF2HEX`){Vk*1`nJ>ymmiDxcx{ zfFo1Hhn)5@Z
?pmLd)l zz$Gv`t$Ag}4A#kKFJfKv_X~FCc4i%m_T#t?p#x|89tSTiuboT2{HW+pN?ISau0;8F z2Dmw6BlR}R+iG>WdHf?Th9VUZkwo{n*dj9#6C?=JKUdLa_1C=^scicz@W!(dJMeUQ z&sfPYpI#EilKNyucnr_Sz*-szB}ZR85ou6{DGhKr3DR=8sOBK=ys+HI=AU+=w{7Sr zt$l4Fw%iT8@~~z-H(@|Eo~erICPM(X+*4UHve?Jtj>3)@*!c@tt0(Z7+Kv N{v)2(;hjHb|i59Svi!AGybcSYuxpnXl$yXWL z_Q u(jadb+VC>?7TMBqcDrGadm8_5Mum%L3W}32I?GwfzF6b{_#9)kGW= zSOYOSOUu%vWWf)ki5N%S(e}ilx{^Z$Ri`d;MRiW#BB|f=#O2I-GKU({i!#kP)SShM zb1zTo_x ?7CH;aUEkmt= z-p$jMT$43NU|a&n>yq_l$b<7_DcQRZql-h&do&?+4Y+#VmFylHN5Av2hCEiZ`S>2K zox=<;<%T*Zi#;Mh{2L9^lUyGGwUCtO6X?kTQ&u$-p+ZD1ayce} *f7hi!*WIWzV)VLN`3ej>I^`- zCakT79q5(Pn)%AEUK04@V_T 6pN={;B6$^FUJzhs?3z=j$4a!q4=#R )X9;&22uLi7T zGVb&;xFdEwk*qm0!?5l_XV-EjrAxZxUS2L@Px)D`rCfAa$E|o}PBrZ QP9~AS-q6Y;g$;*;&yzFQ3eDiW&V5?jLqV=6xr96EodakaqLbgXV5a` z2eQaO-?3<7q>I<*v2y;^xK01YalpOOfT+vHS}ORTeXOHm>4G>(wgR`>rl$@JRPLt_ z@v6F-5&K|XU(HTJx?e*BR$jD--GV{N=UU7NTgJkZkHqCp7OPmwEn`ZzPi5rQl%CxJPU)O}?bS(O?NL#=r347M90+D^-A*}D? znx$2%SL~ZpXV<@ dQ zZm2>*J;HnwRxG%V4arhQhGa1#l29g{g)6;0?n!TLjKn`_P>T=Ax)Vue!8L^&=Hzai zJBqqS{N}%{>X!h+l3`iQ$kQuD%l>YxDRtwbs=qKbZfM TlrEFuTq9Oz zCgEB+ff%NY2$+ jITxv&w=L-(! ?keuWXruw2oW z*|S;cnB#FFW!Y
H(jO{N$?dpqI5n1H=_nJVqj8cU&i`!9&V=d<0pi* z(=Ge?f{A6Rq*euB`QyqlxbF+CSUM8-L-}yElkIDS_vQz9!tW!u)D_yYj6DTfx}rx! zk!!{u7yOJ}iyBHzEM`Q;xnrh~TjuaUysejF#V+U_f@D93KxLb7$Kf5g9yOMl0+S-$ zk}Pv0x#h Wa3kA-CkavC;SO4d@@8LGR^U zVn43|_g;DfTUhOVxn&y3f9R>X#f)4 ^wNM$KYIB%!>u7uS&colUW-K&8j^?{(toWuxGJw)`JOlfzI@$rZx@0000 @@ -111,48 +94,6 @@ export default { // } // }) }, - getMapSelect(type) { - let dom = document.getElementsByClassName('iconMap') - dom[0].style.display = 'none' - if (type == 1) { - this.type = 1 - if (this.mapEcharts) { - this.mapEcharts.dispose() - this.mapEcharts = null - } - if (this.mapEcharts2) { - this.mapEcharts2.dispose() - this.mapEcharts2 = null - } - setTimeout(() => { - this.mapEcharts = echarts.init(document.getElementById('mapEcharts')) - let mapJson1 = mapChinaJson - echarts.registerMap('china', mapJson1) - this.setMapOption() - }, 200) - } else { - this.type = 2 - this.isCity = 1 - this.getCityCount() - if (this.mapEcharts) { - this.mapEcharts.dispose() - this.mapEcharts = null - } - if (this.mapEcharts2) { - this.mapEcharts2.dispose() - this.mapEcharts2 = null - } - setTimeout(() => { - this.mapEcharts2 = echarts.init( - document.getElementById('mapEcharts2') - ) - // let mapJson2 = mapJson('1515507975659761665', '') - let mapJson2 = ningxiaJson - echarts.registerMap('hs', mapJson2) - this.setMapOption2() - }, 200) - } - }, getInitData() { this.mapEcharts = echarts.init(document.getElementById('mapEcharts')) this.mapJson = mapChinaJson @@ -175,27 +116,47 @@ export default { }) let mapData = [ + // { + // name: '青海省', + // value: ['101.778', '36.623'], + // a: '100', + // }, + // { + // name: '宁夏回族自治区', + // value: ['106.278', '38.466'], + // a: '100', + // }, + // { + // name: '安徽省', + // value: ['117.283', '31.861'], + // a: '100', + // }, + // { + // name: '湖南省', + // value: ['112.982', '28.194'], + // a: '100', + // }, { - name: '青海省', - value: ['101.778', '36.623'], - a: '100', - }, - { - name: '宁夏回族自治区', - value: ['106.278', '38.466'], - a: '100', - }, - { - name: '安徽省', - value: ['117.283', '31.861'], - a: '100', - }, - { - name: '湖南省', - value: ['112.982', '28.194'], - a: '100', + name: '重庆市', + value: [], + a: 100, }, ] + // let mapData = this.mapList.map((e) => { + // return { + // name: e.province, + // a: e.num, + // value: [], + // } + // }) + + for (let i = 0; i < mapData.length; i++) { + let geoCoord = geoCoordMap[mapData[i].name] + if (geoCoord) { + mapData[i].value = geoCoord.concat(mapData[i].value) + } + } + let that = this this.pointAll = this.cityCount this.pointAll.push({ @@ -219,7 +180,7 @@ export default { }, { name: '重庆市', - itemStyle: { normal: { areaColor: '#0A2B7B' } }, + itemStyle: { normal: { areaColor: '#2187FF' } }, }, { name: '河北省', @@ -323,7 +284,7 @@ export default { }, { name: '宁夏回族自治区', - itemStyle: { normal: { areaColor: '#2187FF' } }, + itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '海南省', @@ -492,26 +453,27 @@ export default { zlevel: 1, symbolSize: [45, 55], symbol: (value, params) => { - if (params.name == '安徽省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '湖南省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '宁夏回族自治区') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '青海省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } + return 'image://' + require('@/assets/img/myImage/markPoints.png') + // if (params.name == '安徽省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '湖南省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '宁夏回族自治区') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '青海省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } }, emphasis: { scale: false, @@ -527,7 +489,7 @@ export default { position: 'top', padding: [0, 0, -15, 0], formatter: function (params) { - return params.data.count + return params.data.a }, }, }, @@ -563,7 +525,22 @@ export default { that.mapEcharts.setOption(option) //设置option }) + const _this = this this.mapEcharts.on('click', function (params) { + if (params.data && params.data.a > 0) { + _this.$router.push({ + path: '/bigScrap/home-new', + query: { province: params.data.name, location: params.data.value }, + }) + } else if (params.region.count > 0) { + _this.$router.push({ + path: '/bigScrap/home-new', + query: { province: params.name, location: params.region.value }, + }) + } else { + _this.$message.error('当前省份没有工程数据!') + } + if (params.seriesType === 'scatter' && !params.name) { let option = that.mapEcharts.getOption() //获得option对象 // 点击变黄 diff --git a/src/components/home/new-map.vue b/src/components/home/new-map.vue new file mode 100644 index 0000000..e8c0a98 --- /dev/null +++ b/src/components/home/new-map.vue @@ -0,0 +1,209 @@ + + + + + + + + + diff --git a/src/router/index.js b/src/router/index.js index 70c9ff3..ded63fd 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -16,6 +16,11 @@ const routes = [ path: '/', redirect: '/Layout', }, + { + path: '/bigScrap/home-new', + name: 'home-new', + component: () => import('@/views/newHome/index.vue'), + }, { path: '/Layout', component: Layout, @@ -52,6 +57,7 @@ const routes = [ requireLoginAuth: true, }, }, + ], }, { @@ -63,7 +69,7 @@ const routes = [ const router = new Router({ mode: 'history', routes, - base: '/screen', + base: '', }) router.beforeEach(async (to, from, next) => { @@ -72,7 +78,7 @@ router.beforeEach(async (to, from, next) => { } const token = localStorage.getItem('token') if (!token) { - next('/screen/login/index') // 跳转到登录页 + next('/login/index') // 跳转到登录页 } else { next() // 放行 } diff --git a/src/views/Home/index.vue b/src/views/Home/index.vue index 81e7b72..fbb2e7b 100644 --- a/src/views/Home/index.vue +++ b/src/views/Home/index.vue @@ -19,31 +19,13 @@- - --- +- + - @@ -98,8 +80,8 @@ import CenterTop from '../../components/home/centerTop.vue' // import Center3DMap from '../../components/home/Center3DMap.vue' import Center3DMap from '../../components/home/center3DMap_new.vue' // import Center3DMap from '../../components/home/center3DMap_new.vue' -// import CountryMap from '../../components/home/countryMap.vue' -import CountryMap from '../../components/home/countryMap1.vue' +import CountryMap from '../../components/home/countryMap.vue' +// import CountryMap from '../../components/home/countryMap1.vue' import CenterFold from '../../components/home/centerFold.vue' import { getMaintenanceWarningApi } from '../../api/screen' export default { diff --git a/src/views/newHome/index.vue b/src/views/newHome/index.vue new file mode 100644 index 0000000..b759c49 --- /dev/null +++ b/src/views/newHome/index.vue @@ -0,0 +1,430 @@ + +++ + + + +++ + + + + +++++ + +{ + $router.go(-1) + } + " + >返回 +后台管理 ++++++{{ dateTimeString }}++ +++ + + + + + +++ +++ ++ 工程位置 +
+ 定位设备位置 +
++ ++ + + + + +