From a36a86732eb403fe1c9d545f7aadd735ede48f96 Mon Sep 17 00:00:00 2001 From: lixuefeng <1126141216@qq.com> Date: Mon, 21 Jul 2025 16:17:18 +0800 Subject: [PATCH] =?UTF-8?q?=E7=B1=BB=E5=9E=8B=EF=BC=9A=E5=BC=80=E5=8F=91?= =?UTF-8?q?=20=E6=8F=8F=E8=BF=B0=EF=BC=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/monitor.js | 25 ++ src/assets/images/imgloading.png | Bin 0 -> 7032 bytes src/components/ImageDialog/index.vue | 120 ++++++++ src/utils/config.js | 4 +- src/views/home/components/box-2.vue | 272 +++++++++++------- src/views/monitor/components/box-1.vue | 39 ++- src/views/monitor/components/trafficList.vue | 253 +++++++++++++++++ src/views/monitor/components/warnList.vue | 280 +++++++++++++++++++ 8 files changed, 880 insertions(+), 113 deletions(-) create mode 100644 src/assets/images/imgloading.png create mode 100644 src/components/ImageDialog/index.vue create mode 100644 src/views/monitor/components/trafficList.vue create mode 100644 src/views/monitor/components/warnList.vue diff --git a/src/api/monitor.js b/src/api/monitor.js index f38c57e..f907bc5 100644 --- a/src/api/monitor.js +++ b/src/api/monitor.js @@ -1,5 +1,30 @@ import request from './request' +export function getTrafficEventsApi() { + return request({ + url: '/fjtcc-api/api/largeScreen/monitor/trafficEvents', + method: 'get' + }) +} +export function getVideoEventApi(scenicSpotId) { + return request({ + url: '/fjtcc-api/api/largeScreen/monitor/videoEvents?scenicSpotId='+scenicSpotId, + method: 'get' + }) +} +export function getVideoEventObjImgApi(objId) { + return request({ + url: '/fjtcc-api/api/largeScreen/monitor/videoEventsImg/'+objId, + method: 'get' + }) +} +export function getPreviewUrlSubApi(data) { + return request({ + url: '/fjtcc-api/api/largeScreen/video/getPreviewUrlSub', + method: 'post', + data + }) +} // 安全页面视频类型 export function getVideoTypeApi(data) { return request({ diff --git a/src/assets/images/imgloading.png b/src/assets/images/imgloading.png new file mode 100644 index 0000000000000000000000000000000000000000..9c4a0bc6070b00018f99a3d5c071b95780248270 GIT binary patch literal 7032 zcmeHMc{rO{+mB_smu@pChKU-ZNUR~Tq#b+JR;_&}wPq1PXi#lcEoIu;D@<*%6h%=K z)gn_$Xo#Y!rJ?rPcfKcP^!2`1XWsd)@BRMyt}mBdch0%aeV^a+yO-yjTey*d_Td93 z4}d_R!@4>e7eFBPRN%XB-yUFwsyo#R2tI)pcND zH)mC_nS#EwK29Cw>ZTKbN0|f|TyzTXaDqF7k!r#!L}jUqS*6VaX+Zv;^lyloc& z{ANuyWyQLBQ9uY{jnD?QU$vb2si{3>gVSN@sopK@h(sqI2_KhAuB5d ztdR2d#}FKdQW$TM9Sa&LZzsGPj^KvH2(v6YIAVPWs$c-=?~j1SeKCvi{(~lfFeuRh z2bFY*nR}Fh#^v9u~7f{|Wv`-mX}ju(}CM_$MC;$e^a_lZg?@R&F!}|Fp zY=Oa-z(-+#XvYI#t>7^K0|>-3p{sHBBC&U(|L`wwQGw592E2LL&mRorD@gAO;fv*p zjtJ#qoc7ax%oUN&$h>6o+vGQoz~w(hCpUw>(=52E-W8u%t!np3N~!kJnGoltYuDa5 zM@+hYdxAGIN7HI=&c2U}qjN}+9}_1g-(A5V(~_7lzpZYUt%*QC>{6ZhhyVyAJ+OL+ z4Fr0A90dBX|BJl(nR9!*Tb?1ZgIMF;Qdos;d%Rm70qO>8yj$)w1Z|I5@`e})^skb& zJ!^iq+y!R`-flQ7xc><_ESUcaXJ`CBgtG&0H#;o${)(Ny3ulL|f5XylXZ>9`JMdU6 z?7-QPyPdb2oxcg^Yfk$bEY@~AFm~j>gYz|~eFYY4yB!!iayLt7u1FkWdz2sh+BUd+ zOk^eZp7NmRoxz5bq5Y`W>dh70vhJ#rwRlNVoxnlAgzxb zi42mqA#&Xw$*?L=Dp>z0FVaA0#>U+a3@k1#hM;*;0RRXtT1bE`8E@_2oOt#sCNU@L zV5r#VgSJEaC%WFdsu>bwhxW=Goz9E?L4-{OU-!O4>`@>2d7F#M-lo~UJe)N6m8n7T zWk)3&xKIDI06aEA8V?+v(aE!vS_UaVs@i+S6ZI|ds=i42wjmypv*nT6uCEl`k z3Pg*b^QX@ytqooqOPkClBldbWXlfk}NN`aJ=|9w!A)|jr{(hOfbLMi~zJd|`J5HJX z#dKaSD%ZSp(F~`rNg&v`PdmSWSZ(YWV=1F{-|66y)H5+XD>8{!V!~c7#~V8u<|Wv^ z8h*omL#+KuZ_r}E-2A+VdP6GVbHKp$sAK;f&kwgBPzODl=36Ij_7kP|q(h^{w^Zcu zl?|O)c$Z9kZf&`v)r8RT*0NDZ#vZ^hqQqTNs3*caO(gX=cVn?AB!hD#Rp3%>aA#+k zdve&hoM`6#mM;D^FbrLoh2_-;LgllB!7@>8Ib`q9ZDnxV=^5hZLpBFQCU9v4D6b2g*@&QT+>a3tBS9j}LL^C3r@eONE7E#d%9e7ZCgiBDMwSvzd z05gAq5ItNG57mY)N03^p`o@M=!wWc9 zA*5?z>`E8S*MQzLdm#m`6u;FZ#rBGaV#03Do^6mckMsP5o1GMQbn-rhe%nHumPk0Q zbf1Y|Y&Tbv(oXq~ta@*C@xjb`Qd8CA{sQ(_3N#|SBwLq1LYcI*8rN!x$TsftAZ$js z_qwOLzca|jmSuy#1)xeQc8MKho^a7uc8H$SJ5!i68jw9K)sl#*I^osZPE_la;@D?+ z6?Iv*F_%sjs9j%wKCFYlmXGJf8%ufgHnkQrwihseq`sFo@x*q%zFBG6--be`F=1?g zV&F@ARUyk-fi6t)*li8(ns;3B{+(@T4uIp9pFNUYzVm+D(aIl=P$+vIq2|HefF0@$Krg$y?L3?g(Y`^3R;Zu`#bW?F14Ib6UrIsimaMh zqiXa`o}cMF_8X;j!95>kP_yat-8L^BJ(bi<0kc?CN{xBnfc5>U({>n)qJB?3oSO!4 zJ@-4;rBQ7*8FTW?o?L1{1jP4o0t9!!kE7gNxT2UeF2)=d z@?3BxyF_luK(1%3zJv7cA$4-3#k{{>%Vz2)jvHdai0be*fe}B1TLjT<4qttU@3K6ESJdR`GH^M=vNAD!ox@1N(dyxQ2#!!PLejHKg_*|Pj* zV(8{r$D+Xl3ki#IZVi_t+zSmUo8`!0?x^A8&GBZm)8BWjs5(C_gQvVJwO>IH9(5;{OcTZe7HV?Se2$VuUloz{3GDj}f2E|CHVpRMwhWj~4I;eA9Ub6yZ5%6k z6yq!41h-XGN=DYLMm)uz9rRW@OdTXSwsZ5p7!8evZ3jf@CzX8oU5LBlOP+4ZR#Hxu z$%TecL8xM5HQ9^SU(hX~Aw zhsC}R2&`Pig_Ww*#5sLN*tluP%=NBG5~*TX`2BQHyl@3G#5Z@g4$XziA4NW3WKotBeD&o_@c(bcjalT`1B$sH~LN>I!G!H~xHDyh#f z-_5C{+N4rSP1*C*y8EQ1lcA@tEH_0@Ylzg!Bn_gh!szIOCqFHaTpv41ucimQpg%yJ z;UcfDdi%v6uJ#`Dkf=4yc7uh{$$B3`uFny#eU?A)EIrJ{tZ4L=*Ey$CfrQ#7dwa>W zOTM#%kjpD|CHh5>zWGX9WDxLrj7FAm=&70d-gBBHX}O@%<00ZdtWZ!HQ&YHjyB2XZ zWpf(V%L9l2d$@*+gl(6AZUVHyH||Ldc$H$iv{GcFF;m^LNqSRoKv*Rt5RMQrRqUn& zTmCkAUrDt8gv8Ld%rQ!JB08|A$YUvV28oeGj;6ZWvwuK;pXXa>TR)utsh8?kMXH?VZ?u{Cih{xUGdEGgT zxokZA*_{JGGPtD6T}UxXpUcZC=WexJCE5*ij;qx%W(qT(5L_jLU5%Sa^2mxC9~Z=_ z%82A2s5+QN9w6-G1dD-<;{yr9CxYJ!7}%NTt(Bl`dV4L8LZQk8AL`nP86FNN|2g)U z6}yD1bq^krE-B8%8L1U|PAi}`%@BB?L`(L4lJq;5|Km-%k6vI}d1}g(PFSO^xHgqy zc#UWx~inG7YU9B#ERvq!<_4N)Lr*DrK%OH6LridUJ9-KW^^ZVe#A(rzeH( zF>%Y(25dw-YQVjcGPvx z4Y5a(>2i3LB4fSdYlA`YlR?@GJu}R)K*6>WyKlp;XZSm}HLbo_>FE-`n`e|Vz9F#& zBhfaBSDpj}Rb`w!lKMuAD9S!(s|HwosN zj=Ar+WOAytY-Ex71mmi*6`sM*(&Z!HD^T)vJk|eLV6oaluX|~Us(UBnzT(lE+#5qt z?`n`nv|u2G>R@yicuT?jgJX65B+k(xyo4J3B8^{w33y;J_tW`%Uat<1)6Ej-n^-l` z{?+$qXYS$`Lq=J5IL(nwM$6>Z5KU+qbJXwDUD}nDo&p^^m=0$d;}@@ za3rI5&j?YiDr&9(-Uyd_`?Tfci%~C81b^MKRz^Iez;>#gi8s(Sj1Ir#w4$R8T=hdl z`N;(*Xs%ootN69V*ku(l%@o@`!w=eeOW%r(ELVgSuji?1xv17DRybN!uEz3tw%IUe zuK`KkPv@rCPW_UOXf>g7?`aNFbt#z`e&!lfxy1pLEyE7-tlL@b zwx;Q`iv}a&^q_Q&VUaX>dHK|>oTwSUmY?eUZ{9D?rIP7c~Jx&a=#OQz1 zKUbAFd5<}J9q+$!$ZU;_cOn}PE=AfP6LUswGe);)TXlmSM{I>83fhz z^lD(G$!teY1QGA8)bG|Alxv}fl?qv2^*5j2n=CT=TNAD-pzymV%-H!FEvbUjW>98P}e7Q+-|ZOOV{xkbA(UvCuh>T)Hiv6s#Uypzr!m#D-M_ zj&f6-6w{J}T!pjE$h60G!Kc-VCh&~=CK3iIyt-J+_DP$x+Fwi##lNp%6zm0xxAEk% z#kw!+8YI$D*-FV2QuJ`sUzk9N(J8kMw#?Ho4-L(vnihd@sMu&bJChEfE$s(l&yC=f zH?Y^V2}>IF84W(%`|7;vm87AEuzPQfAW&D}#N7CfA<>=rvP7^*!ffDag3=z~Cgyh` z?3-e|=K5-@2faqi(-)v?BNu9Lnz_i-?nO41iR#d>jMrZDz}5C^Sgce{5hBo}vMP6V zVSDMo-6|}xG|*l!@OLEBDJECsJ43bTdzKaHKTSzKL$sdHD?Vv z^aoIHQu8fXE^gpOF@9}y)ImgH>E!rp-wdD$^Q+(E@U~&U3}l<0)OAjP?%@peX$`7pO{X2R0(Qqxct4W^=eg7jJBVZF&11oZ>))y)8R1(>Aq*#o`-x5P^E&c`o zMExi*fL)sF6w>AuUCcyQAYs|cD=fcxK@jBv{;X?zOyRHBVf)5`G|qvtr-EEI=-~t7Lq#5XZUNuSWjLj50&`hs14^x(^#TE zfxu2|Iu0m)Fs2cw+`F`AO~m{f^jM)^_)lGtvE$*ssREm`jEFbZWIl%?<1s%j*4;f3 zyV=S0|INC8>ac#Tr3nP${~AmGH=A{Tr0;gGki{Nw2l>*E2Clz<*+bmj%KV$X!>>6F ks0RPmX^$G#>p&bJHd1wN6C~;x>wjUong$w$KigmXFEXBM!2kdN literal 0 HcmV?d00001 diff --git a/src/components/ImageDialog/index.vue b/src/components/ImageDialog/index.vue new file mode 100644 index 0000000..15c9dce --- /dev/null +++ b/src/components/ImageDialog/index.vue @@ -0,0 +1,120 @@ + + + + + diff --git a/src/utils/config.js b/src/utils/config.js index 0bfb1e5..50bf75e 100644 --- a/src/utils/config.js +++ b/src/utils/config.js @@ -1,7 +1,7 @@ -export const baseUrl = 'http://192.168.77.209:81' +export const baseUrl = 'http://127.0.0.1:81' export const proBaseUrl = 'http://192.168.77.200' -export const socketBaseUrl = 'ws://192.168.77.209:81/fjtcc-api' +export const socketBaseUrl = 'ws://127.0.0.1:81/fjtcc-api' export const proSocketBaseUrl = 'ws://192.168.77.200:8060' export const mode = 'pro' // 测试 dev 正式 pro diff --git a/src/views/home/components/box-2.vue b/src/views/home/components/box-2.vue index a863f39..bbb5197 100644 --- a/src/views/home/components/box-2.vue +++ b/src/views/home/components/box-2.vue @@ -47,85 +47,73 @@
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + @@ -169,22 +157,114 @@ map.value.setMapStyleV2({ styleId: 'd1e61f575b3ef4e2df71ab6a5690ddab' // 23c9fb8e1c604995f97f0f1cebd7036fF }) - map.value.setTrafficOn() - // res.data.list.map((item) => { - // item.map((i) => { - // // 创建折线 - // let arr = [] - // i.path.map((j) => { - // arr.push(new BMapGL.Point(j[0], j[1])) - // }) - // var polyline = new BMapGL.Polyline(arr, { - // strokeColor: '#9AFF02', - // strokeWeight: 8, - // strokeOpacity: 0.8 - // }) - // map.value.addOverlay(polyline) - // }) - // }) + const allData = [ + [ + 109.57843364485261,31.050783420337332 + ], + [ + 109.5763185309496,31.042512315044785 + ], + [ + 109.578438523583,31.041253717253543 + ], + [ + 109.58480087476947,31.041557307017047 + ], + [ + 109.58971689758278,31.04091104021125 + ], + [ + 109.59452326321068,31.04025926587977 + ], + [ + 109.60838415909252,31.035555713566687 + ], + [ + 109.60995055557738,31.032199123538422 + ], + [ + 109.62156263671656,31.018465302840454 + ], + [ + 109.62534994444817,31.016071773573458 + ], + [ + 109.62877486684926,31.01814529506191 + ], + [ + 109.63464468590746,31.027249858930684 + ], + [ + 109.6405129788155,31.029770289201934 + ], + [ + 109.65561363054604,31.038740966425156 + ], + [ + 109.65665229650565,31.042456954560258 + ], + [ + 109.65365673982508,31.045094749902372 + ], + [ + 109.65079175912291,31.04683943792912 + ], + [ + 109.6471467686651,31.04454011173439 + ], + [ + 109.64258701251156,31.04402745793725 + ], + [ + 109.63436954572919,31.043833122861844 + ], + [ + 109.6279668506477,31.044815504006518 + ], + [ + 109.6198507320364,31.046067463158575 + ], + [ + 109.61224510312262,31.045350944237523 + ], + [ + 109.60633406560694,31.05148153531427 + ], + [ + 109.6048887477277,31.052512113965893 + ], + [ + 109.59660938015361,31.050968484315057 + ], + [ + 109.590694912004,31.050620057176253 + ], + [ + 109.58255014801492,31.053206076638133 + ], + [ + 109.58176241763722,31.05377630574891 + ], + [ + 109.57821941737987,31.053703848067492 + ], + [ + 109.57848246902094,31.050563464855543 + ] + ]; + let arr = [] + allData.map((item) => { + // 创建折线 + arr.push(new BMapGL.Point(item[0], item[1])) + }) + console.log(arr) + var polyline = new BMapGL.Polyline(arr, { + strokeColor: '#9C9C9C', + strokeStyle: 'dashed', + strokeWeight: 3, + strokeOpacity: 0.8 + }) + map.value.addOverlay(polyline) // timter = setInterval(() => { // getBaiduMapCrowded() // }, 5000) @@ -270,7 +350,7 @@ onMounted(() => { getSpotList() - + }) @@ -291,7 +371,7 @@ } .map { width: 100%; - height: vh(810); + height: vh(710); background-color: transparent; } .box-3 { diff --git a/src/views/monitor/components/box-1.vue b/src/views/monitor/components/box-1.vue index 100ecb8..a369649 100644 --- a/src/views/monitor/components/box-1.vue +++ b/src/views/monitor/components/box-1.vue @@ -17,8 +17,8 @@ :end-val="aiAnalyzeData.allAnalysisPoints" /> -
- 异常点位 +
+ 异常点位
@@ -28,11 +28,11 @@ 核心景区分析点位 -
+
异常点位
-
+
异常告警
@@ -67,11 +67,11 @@ :end-val="trafficAiAnalyzeData.coreMonitoringPoints" />
-
+
拥堵点位
-
+
拥堵告警
@@ -130,7 +130,7 @@ :end-val="pointAlarmData.analysisPoints" />
-
+
异常点位
-
- +
+
-
+
当前告警
异常告警 -
已解除告警
@@ -190,13 +188,16 @@
+ + + + diff --git a/src/views/monitor/components/warnList.vue b/src/views/monitor/components/warnList.vue new file mode 100644 index 0000000..e16223c --- /dev/null +++ b/src/views/monitor/components/warnList.vue @@ -0,0 +1,280 @@ + + + + +