From 7e19706ab9a5e8965fc3142727ddf082fea47aad Mon Sep 17 00:00:00 2001
From: zengmingjie <zengmingjie@qq.com>
Date: Thu, 19 Jun 2025 23:41:07 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/index.scss                   | 161 ++++-------
 src/assets/img/icon_model.png               | Bin 0 -> 910 bytes
 src/assets/img/icon_postions.png            | Bin 0 -> 1115 bytes
 src/assets/img/mute.png                     | Bin 0 -> 741 bytes
 src/assets/img/query.png                    | Bin 0 -> 3949 bytes
 src/assets/img/refresh.png                  | Bin 0 -> 818 bytes
 src/assets/img/setup.png                    | Bin 0 -> 4414 bytes
 src/assets/img/sound.png                    | Bin 0 -> 1007 bytes
 src/assets/img/user.png                     | Bin 0 -> 4065 bytes
 src/views/contentData/LeftSidebar/index.vue |  61 +++-
 src/views/contentData/headerTop/index.vue   | 303 +-------------------
 src/views/contentData/index.vue             |  14 +-
 src/views/index.vue                         |   6 +-
 src/views/mapControl/index.vue              |  82 +++++-
 vue.config.js                               |   2 +-
 15 files changed, 199 insertions(+), 430 deletions(-)
 create mode 100644 src/assets/img/icon_model.png
 create mode 100644 src/assets/img/icon_postions.png
 create mode 100644 src/assets/img/mute.png
 create mode 100644 src/assets/img/query.png
 create mode 100644 src/assets/img/refresh.png
 create mode 100644 src/assets/img/setup.png
 create mode 100644 src/assets/img/sound.png
 create mode 100644 src/assets/img/user.png

diff --git a/src/assets/css/index.scss b/src/assets/css/index.scss
index 20be1a3..7965235 100644
--- a/src/assets/css/index.scss
+++ b/src/assets/css/index.scss
@@ -29,7 +29,7 @@ body {
 
 // 滚动条样式
 ::-webkit-scrollbar {
-  width: 5px;
+  width: 0px;
   height: 3px;
   background-color: transparent;
 }
@@ -117,108 +117,11 @@ body {
         height: 40px;
         display: flex;
         align-items: center;
-        margin-right: 40px;
+        margin-right: 20px;
         margin-top: 10px;
-        .menuItem {
-          width: 305px;
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          margin-right: 10px;
-          .menuFor {
-            width: 41px;
-            height: 41px;
-            text-align: center;
-            margin: 0 auto;
-            .itemIcon {
-              width: 100%;
-              height: 100%;
-              margin-right: 10px;
-              cursor: pointer;
-              img {
-                width: 100%;
-                height: 100%;
-              }
-            }
-          }
-        }
-        .menuItemQuanping {
-          width: 10%;
-          margin-right: 20px;
-          .menuFor {
-            text-align: center;
-            margin: 0 auto;
-            .itemIcon {
-              width: 24px;
-              height: 24px;
-              cursor: pointer;
-              img {
-                width: 100%;
-                height: 100%;
-              }
-            }
-          }
-        }
-        .user {
-          width: 15%;
-          height: 100%;
-          margin-right: 30px;
-          .el-dropdown {
-            cursor: pointer;
-            height: 100%;
-            img {
-              width: 32px;
-              height: 32px;
-              margin-top: 5px;
-            }
-          }
-        }
-        .time {
-          width: 93px;
-          height: 36px;
-          .top {
-            width: 100%;
-            height: 50%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            font-size: 12px;
-            .time_date {
-              width: 50px;
-              text-align: center;
-              color: #fff;
-            }
-            span {
-              border: 0.2px solid #000;
-              background-color: #000;
-            }
-            .weather {
-              width: 50%;
-              display: flex;
-              align-items: center;
-              color: #fff;
-              border-left: 1px solid #ccc;
-              margin-left: 5px;
-              padding-left: 5px;
-              img {
-                width: 10px;
-                height: 10px;
-              }
-              .weather_text {
-                font-size: 12px;
-                margin-left: 2px;
-              }
-            }
-          }
-          .date {
-            width: 100%;
-            height: 50%;
-            text-align: center;
-            font-size: 20px;
-            color: #fff;
-            letter-spacing: 1px;
-          }
-        }
+        color: #61ff3a;
+        justify-content: space-between;
+        font-size: 1vw;
       }
     }
     .left-sidebar {
@@ -227,7 +130,6 @@ body {
       position: absolute;
       top: 60px;
       left: 0;
-      pointer-events: auto;
       padding: 0;
       margin: 0;
       padding: 0 40px;
@@ -266,8 +168,9 @@ body {
       }
       .drone-list {
         width: 100%;
-        height: calc(100% - 200px);
+        height: calc(100% - 140px);
         margin-top: 25px;
+        pointer-events: none;
         .title {
           width: 100%;
           height: 40px;
@@ -279,9 +182,9 @@ body {
           margin: 0;
           overflow: auto;
           margin-top: 10px;
+
           li {
             width: 95%;
-            border-bottom: 1px dashed #ccc;
             padding: 5px;
             color: #0144ef;
             margin-left: 2%;
@@ -295,6 +198,7 @@ body {
               background-size: 100% 100%;
               background-repeat: no-repeat;
               background-position: center;
+              pointer-events: auto;
               .top {
                 width: 98%;
                 height: 50%;
@@ -341,11 +245,11 @@ body {
                     width: 50%;
                     .color-ef {
                       color: #0144ef;
-                      font-size: 14px;
+                      font-size: 1.09vw;
                     }
                     .text-fff {
                       color: #000;
-                      font-size: 12px;
+                      font-size: 1.09vw;
                     }
                   }
                 }
@@ -358,6 +262,7 @@ body {
               background-size: 100% 100%;
               background-repeat: no-repeat;
               background-position: center;
+              pointer-events: auto;
               .top {
                 width: 98%;
                 height: 30px;
@@ -537,13 +442,51 @@ body {
               }
             }
             .navigation-content {
-              width: 140px;
-              height: 244px;
+              width: 100px;
+              height: 200px;
               background: url(../img/uavBackfff-big.png);
               background-size: 100% 100%;
               background-repeat: no-repeat;
               background-position: center;
               margin-left: 9px;
+              padding: 20px;
+              pointer-events: auto;
+              .navigation-content-text {
+                text-align: left;
+                margin-bottom: 5px;
+                font-size: 1.09vw;
+                .color-ef-fw {
+                  color: #0144ef;
+                  font-size: 1.09vw;
+                  font-weight: 600;
+                }
+                .text-fff {
+                  color: #000;
+                  font-size: 1.09vw;
+                }
+              }
+              .navigation-content-qrcode {
+                width: 80px;
+                height: 80px;
+                background-color: red;
+                margin: 0 auto;
+                margin-top: 5px;
+                margin-bottom: 5px;
+              }
+            }
+            .navigation-content-btn {
+              width: 100%;
+              .btns {
+                width: 100%;
+                height: 100%;
+                display: flex;
+                align-items: center;
+                justify-content: space-around;
+                .el-button--primary {
+                  background-color: #0144ef;
+                  border-color: #0144ef;
+                }
+              }
             }
           }
         }
diff --git a/src/assets/img/icon_model.png b/src/assets/img/icon_model.png
new file mode 100644
index 0000000000000000000000000000000000000000..548dc75ec5698a17faf47a099c458ac64d16e0a3
GIT binary patch
literal 910
zcmV;919AL`P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH10zX9K~#7F?N&=t
z+dvTQ89RF`q_TEyU~ZrUQN<EYfO3ME6JVdf<^<*j@iJ97!JGh&;B`Vu&Kg^j*Ro{K
zPeRDqq>5LSsu<1mynge#dx-vP96g@Wr^lG~fS@J_lP<Msg3TfSREn-?O+%Uo3wj|W
zy%f>!zG%~ZaX3Q=ibacVo2XG=0W0eb)SVD&p_Dw=R?gLmKG#*Fo&s*xOUQnvW^cpv
z<{(xA2MSsgRCz5$$z`3;)e3mBhTPZb6I~#~rLp!T>B@CFFw{`AP;2^FrA9dcWPpzY
zZ6%~ern6v9RX9#!?7PI_-5n3anFYgo1fpM|p!Nv=>unb)x=PmwVrN|jR^ut{D<Qwo
zj)hl^9f2_EKyJ>uuYIkTbs3^0#Fb5|)YzF2+2O|@BS1=fV&%k;ih?ZJ9PSlBKCwnk
zo2<u(byd63_|znNK%5I(%~BJ}C>ba=(~bqMV?CrF@2;r|>><^jAaYkbWSGu^fp58R
znWr(W<TT6Hr$$-Z<-M(REQH>a)SYUJn7&~xm$XFeRE~8s8zw|Mz0a6i+2(4nqdQ(T
zFqDL7O}5|BsPe4GoA1dv%s9@zZ>r(2AYm$Sl$;7lqatG?TUKL5d`M`h0m62B*0S!<
z8ycaE<2+rbs=OvNIvO(;+9pq<@n-FMVVchfqnDI-LhB%-ex0^!Wo=e~Nz8&v;P_{c
zZr(o>2N|;4-3%mA=S%t?O!MD8$j$3}4lxEBv9y$#d6bMqlqh&%k}b}`Cgi^t|Gblq
zC#JRrd-_`JF818|_8Q|@sx(u?eqeA7t2TWoMlKI21iQ@w7r{x6a!uJYhr0?ug=nMv
z`A+EGJ$J!jVIHGF;YtvJgJl7Yq2=)c_MO%1guY6U*nAUgykQR+yS$tVfEQNc)HhA5
zA0)U(vB|cx;o(*S-y$9;{cUjeQOyc?o<M$((T>YrIq(AR`YV-HKw|<q?BS#+#bi6k
zn+_^~<W?yJy{O8%5rGWuaGHWtXWNR|3#57FpA%rf-LeIP>d!4|@N8>Lpg>Wslntfk
k&$hjAk~N|Zy<!ji1%!<Hv9EHFssI2007*qoM6N<$f-iug_5c6?

literal 0
HcmV?d00001

diff --git a/src/assets/img/icon_postions.png b/src/assets/img/icon_postions.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce5fc54de910e6536ea5a186a87a42f228cc58ff
GIT binary patch
literal 1115
zcmV-h1f=_kP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1Mo>iK~#7F%~wrs
z(@+rp#&Ne03xvdqa00>!8fYr9BRv7(1T80MdIHiDG@O7gks81~LDLg7tXR;>fo<bA
z%)I9~c48;)j|3yNb^YeO@0)q^XW$<T;il4x>ez@oU}|LEPC#*plP4qGP^uGX|7rpL
zzHDff>M+L4@d3U)9^l>xsKq{xM6ojm;&TFz3}Ngs>P*y>qh82LJtg8{2PeT=kI)+M
z2G#Igv>H~KacE-n5C)S%{q3kL2kr}jhT~c5;_HJ?xD^4hT)@vPxLC@lW)a>9=_x)U
z@tEv;g<%kuse7dd`C`coye5ZK0ay7FjCmOB5E*N^c<snuV<}9LsOy0}I13K+(9D{~
z#I8JbM5ih1BT*V57QJw;XRf_H+Q6nfHsBjQt5*b7?17rypzx<+`5;G3u0?=*3T`cw
zzeMPgj|*)5d6()+oLKT!$J<4T6cQlvHZ45SAh+Pl-MWCB2=D<jc9`&9ugUF;`${s^
zzs9lZLbGE#YE~wI#5$;ZXCifAmWl%U!3={Qz6QtYA-=}TghYMrJs`=Jv3-u?iUi(d
zEXW0(=MEqtmA#e(h}j&vW$$fviOHP1?bJXe0_Bnv8U9_kN?cqU43%a;F@b!<H!=Xp
zd#QLuX=SLD=>5pOCwl0Ryiqj*PD1<JH}mp)T}uN>BK{~xt{v@5;Mxqx1+GiyR)SQW
z0K=SG^4a^$q!qLVXxg=-@6?VWn&<d&E<Sv?wA292dUhQFOuaswwJo%-=21Ni`nj}o
z*4gXOKEYF2n~7S_=sJT^;!9HA3)<11EPk{HkfhmSDc*`YNvWRLe9tzh#XfQpJij>s
z5pVlyz-;eU(oC$=yk95T4m#^2CGNKvtIpDT4%li|mvZ|#S8DG8T&2=Pl<`D)kG}=@
zY65ly^I8&+1MPA-5*qcx;9xDd2C$I=wPHl00!y^r?x*dTF_62r(e1UP9_z%DB~b>x
zb=e`ReTGvWb1d(}WslGzcpAOBNEnz}ejZpLah#@Nf!jrQPcmpX8PO*4yfoP4gU~bG
z)DlTOb0U^6+@p3uO8dO+j#>vsMR#trZpiy&I;z|0Xr%|VvWZ1f2|r-?sE<{mT{9Nz
z#l5R$J}c^3ACW#vv3g!~6;8IU`chh1e$H~W{;s0ELeJffE*6*aSFj-^*p=C)4XoFf
z-8&J{OmbfB>AyuKc{vMotd0ddneCH}Ay@|s4sG9`PR9tJj?+D@pH8>7(Uiz-fV~$I
zz_a*Ju_K(u#CifV(T@z~uBdF{_M*UtW{Q5<$ISXlm;{?=Ow)aWsb}cfvZ4$ktbqE-
hW`~c_+Ti>j<Sz)=%QdH9&8q+a002ovPDHLkV1kF95NQAa

literal 0
HcmV?d00001

diff --git a/src/assets/img/mute.png b/src/assets/img/mute.png
new file mode 100644
index 0000000000000000000000000000000000000000..9966c40de7bedcaa7b7e1191e205123f551e596b
GIT binary patch
literal 741
zcmV<B0vi2^P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0(wbAK~#7F?U+Gm
z)Ib!5-(=S`&F)5}hZU)Ms0Z<)XAwNLTIi*=)`K33Ahghn^(0gT5j?dbXcaArB4W|1
zpr~a}B8WZN?WG>P$X3`$h22fENn<wSj3rVQUBpZ>1m?R0UJiNx<juVQ4O%krF^u6N
zAkZL5U??F3lW4Ju7mx&<kVG)lq{JpqAyp$m!Vv;^BLwh92;hwn5C+2pv{Lp{5CSd&
zXyVr%IN9EjYJOqKYl9G^A!Z8iy|&4__U7_xgUPpJ6Y!zv$v0=6+~RV$6>lbT0kp=i
zKXh`h-??fK+qWm}7C(71Fd#Akw9fB6cQTLOtYu9L|JrN$4%9e1tX6vtZgTebSGEHK
zLJN3O_|e`RE9;Ha#>6x2fRFbo=5W7aYFXmq84_B+rD<zxtM@}k6m#r^Vz5p;fLRIA
zRnBH4-?V(mvdO4HcyUA1cWjdy5FyO^z&NSx`P-U)hCG8<)X7tXmEesKz#AceH;EU(
ztdU*0Z)>+6uVpRU|Gg;G$aN;Akx}2H6OSMGA4=b7Eq`vRz9sC`)r!!6U}99QG{<VD
zFU`JkGx~QwMQ!xQWl!!qB-h7IDkd-{w1B}Lx&Ehk_W{{{R&dojPn}$O)lbjNIoiv&
zu6lY%F$TJ28yJC#2L1{WQX=Iu-89hb-j#Mge_0=B&XYel@RvpS7a~7}sG++&u2!fs
z?b@00Xe>yc1+g8YRLI=b+_#AlwUX~(cQVD^2L=zz_4yf1KXp_wSO|%H543{r55vM}
zZ`XQh{SUF<3vGnOz$3g6Z-fBe2m!ni0(e6O)F7cC1SN^|!VBcubp;XzxqPkp7^Z##
Xq}=Ov;o1!&00000NkvXXu0mjf+^9*3

literal 0
HcmV?d00001

diff --git a/src/assets/img/query.png b/src/assets/img/query.png
new file mode 100644
index 0000000000000000000000000000000000000000..1d2fca0ba6098b0f461f367d37e0b69d06376300
GIT binary patch
literal 3949
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
Hu0mjfX=Qwi

literal 0
HcmV?d00001

diff --git a/src/assets/img/refresh.png b/src/assets/img/refresh.png
new file mode 100644
index 0000000000000000000000000000000000000000..0d1780a40d3a31d812c3beaa14bdd61868d348c4
GIT binary patch
literal 818
zcmV-21I_%2P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0>?>2K~#7F?N>o^
z+CUKOS;;w@syu)nguK8?jH_}pd4cf@Y`*~f0^=7LUVyo!DkN5ZApd}za)?vn9HgDh
zF2W!{LIhE%RJku&w98D-?r5eL_^;vpsKN^mu>+{^O5^AtZa_OnQ1FORU7ThhkjDr*
z9^mWiZc($F2^hyNE@a`Q{3;eLW5k3mBJ|)_M)+$2^`8={dnc=^$(ylQe`L_Tae`Q)
zJ`hrDiPZ?~iOJIx5#S16D)-wHsD~|?Y|k9a_*O^gNJL}g;X_ze5t`!o0?CfCu`{e(
z7blQ*9<Ym#_>{ku>xfW<zKm*lBvuI=KQ)M)zMUlW^hC~nQ`9+7C%?MP>dca034~zA
zBO!COO28A=4jz&-4|rI4ixNQf@WEJLd?&W8Z<Si<=(crEl00VHOM=)shfUyB%n6w2
zDcLIEdh0XKgV<u|TjUZ@v1gwWJw8{uC>xRLV9hQp5OB_>{^4UEkVIzIJ!BD}BuO-3
zfW3kJ<u~p#0oJ!nRKsubu`k4q4~HK~QNVb?6!St<4{u=dAi}#{Dqk+-Q<p>U%Xc0~
zgEF-tm4ugM>h`O2#VQp}Tr)nT#5ZTJ)XJh*d)OPOF@5s4OaitV?kKY|-9sH&_e9-H
z0x&(?)lHO*_fO4dVdKn;-8uq>Y0D-|S+IS^X<6Gwsx9;xmGPHDa&d=}Kqm8(E~_1+
zM9KUsVAHL5U`0d1TOEhHkubS*Vr@)SkrsWp)MeL7GF1=TQYu@?&wwK#<!{-Z&9=L9
zNhXf2^{~=jUY03Jmq?6d+$kcn*U5MpUy1Y1y5;$@{5Wio!VMNKAwonXwwCW$2Xby>
zOyV(|gPLTQtWl>ljrcIJK9VCn7yajFx!8O$naOM;CYNqQIVddSi(kzQPQoTJH!KmN
wH|a_KE_1$C%Ev@@X<z*$1#{kI){B3EKY;}W-I<S|-2eap07*qoM6N<$g6o`ce*gdg

literal 0
HcmV?d00001

diff --git a/src/assets/img/setup.png b/src/assets/img/setup.png
new file mode 100644
index 0000000000000000000000000000000000000000..d5dcfacd370ee2ea278672ce77312c39de74c84d
GIT binary patch
literal 4414
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
Ef=qa7hX4Qo

literal 0
HcmV?d00001

diff --git a/src/assets/img/sound.png b/src/assets/img/sound.png
new file mode 100644
index 0000000000000000000000000000000000000000..9c41532462ed96ecefd9de5b730ac8d22d08edc8
GIT binary patch
literal 1007
zcmV<L0}%X)P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1B6LLK~#7F?U-9g
z6j2z*&&<y5&hG4P!X_FRQ5J|jXhl?H_*7y<;I)@Xu?$~Il6na3LKgx-AA&G&AFPMM
zD?*g5_EJ_DUC<sBG%(W0t+jM!c6WAWcBVPItQlo`wi$<o`N6_+mi;*YbH2-e27AxQ
zWwH#e01UW5G9iO03<FKr@VxvA!$Af}Mr1(aNxON7k~KI;atr}_V+hb2LxA2G0#*vc
z0&MhyXa*{?DgwF(1Y6k|CiTgXNCK51fQAf>h?d*!oO5_gw8mCczW{9nOwUNBhMU2Z
zUmMpBRRzF2zthW6o^Eczny0z3NFXTVY)G+Q8lakhww^HM>EWDgK#tZGWdm|`sg15I
zwgw8S=`=PZnScf$3Fv<zkaY0Rlk{|O&KZAXAy!o}$y64RtjnP|c8x(2(9{-M<MS_l
zk~vuff34R3V|_Xv0SLgFxpj|o-l((B0Ynl?A($Qx3YXybxS+<f)b|5>%^W}k&W4kh
z18$glSsP7!MUgd#^8bY9z>$L_>uq)UJXan5_*!<RNk9k@EqHkH*_#O=H_ODswbm}q
zMYCwdu8Wm`8?UNo-6t-vZn)v=wbYzLxm8x_Rz3Y;J4!6w1WbGqEi-<JP};6zjT4hH
zHxSWVcsnXuP-5vKV0SLT=WUPG%lOAw_u8>FCg96A38^l1ccV;D{;&C<i-3WbqV@SZ
zA!_Un<(s2jXM8deHA?GJaS<Vuwq|ZAvNqvjnj6jv8I%@SgRmyzg7S9~VU$?92!Mmm
z>v8$wEfWs0_;0&%%-Rd+cpRo4J{4?>*TyC#A_H*(L#r`55it+G;iIvRmyitV6i=uI
z;MDXf-p9Ad|D0=N-RGNwDKH%nLV@fpCgFaw>ucdYOYqcDk^zVy-9TN1jaItGZ<CT{
zCA|F+Px)pgQ{NzOhoAC7D|_s)HL%hffv28`4}u^GD9AI1{<f~TPqxd;+gm$1Clu1r
z7j`^*Es)jaBvZ2A5&{~6jWF_Opb}F``rPdeJ375#D!!J!78luoWP%SgRZ5PZP9RPG
zg{pG^rb2y<ZT>-v%Lj8Bu0gw?)zcV6lR*~G>6VL**;v2V4oxTVo^3=J_WOn!`<zxn
zRIP#KfHi{J=a*wuy^z|QhZyfh^~MmOH--ScF$Cxh6hMO{1;fA;uFS?u%Cq$}NHP?A
dOG`3n{t1;cYKE+OtUdq$002ovPDHLkV1henzzF~V

literal 0
HcmV?d00001

diff --git a/src/assets/img/user.png b/src/assets/img/user.png
new file mode 100644
index 0000000000000000000000000000000000000000..7cb699a94295b99f57f0dcaa603c0e5f99810c91
GIT binary patch
literal 4065
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
T8R-qD00000NkvXXu0mjf4czK;

literal 0
HcmV?d00001

diff --git a/src/views/contentData/LeftSidebar/index.vue b/src/views/contentData/LeftSidebar/index.vue
index 6d93271..6db3fba 100644
--- a/src/views/contentData/LeftSidebar/index.vue
+++ b/src/views/contentData/LeftSidebar/index.vue
@@ -127,7 +127,30 @@
               </div>
             </div>
           </div>
-          <div class="navigation-content" v-if="!drone.detailsShow"></div>
+          <div class="navigation-content" v-if="!drone.detailsShow">
+            <div class="navigation-content-text">
+              <span class="color-ef">距飞手：</span>
+              <span class="text-fff">{{ drone.height || 0 }}米</span>
+            </div>
+            <div class="navigation-content-text">
+              <span class="color-ef">距我：</span>
+              <span class="text-fff">{{ drone.height || 0 }}米</span>
+            </div>
+            <div class="navigation-content-qrcode"></div>
+            <div class="navigation-content-text">
+              <span class="text-fff">跳转到导航系统</span>
+            </div>
+            <div class="navigation-content-btn">
+              <div class="btns">
+                <div class="btn-trust">
+                  <el-button type="primary">是</el-button>
+                </div>
+                <div class="btn-navigation">
+                  <el-button type="primary">否</el-button>
+                </div>
+              </div>
+            </div>
+          </div>
         </li>
       </ul>
     </div>
@@ -252,7 +275,9 @@ export default {
       showAudioPrompt: false
     };
   },
-  mounted() {},
+  mounted() {
+    this.startTracking();
+  },
   watch: {
     homeData: {
       handler(newVal) {
@@ -333,6 +358,38 @@ export default {
     }
   },
   methods: {
+    startTracking() {
+      if (!navigator.geolocation) {
+        console.error("您的浏览器不支持地理位置功能");
+        return;
+      }
+
+      this.loading = true;
+
+      // 使用 watchPosition 实时监听位置变化
+      this.watchId = navigator.geolocation.watchPosition(
+        this.handleSuccess,
+        this.handleError,
+        {
+          enableHighAccuracy: true, // 高精度模式
+          timeout: 5000, // 超时时间 5 秒
+          maximumAge: 0 // 不使用缓存数据
+        }
+      );
+      this.isTracking = true;
+    }, // 位置获取成功
+    handleSuccess(position) {
+      this.loading = false;
+      this.latitude = position.coords.latitude;
+      this.longitude = position.coords.longitude;
+      this.lastUpdated = new Date().toLocaleString();
+      console.log(position, "this.watchId");
+    },
+    // 位置获取失败
+    handleError(error) {
+      this.loading = false;
+      this.error = this.getErrorMessage(error.code);
+    },
     enableAudio() {
       this.iswarning = true;
       const media = this.$refs.uavAudio;
diff --git a/src/views/contentData/headerTop/index.vue b/src/views/contentData/headerTop/index.vue
index 27d8407..f5cafc7 100644
--- a/src/views/contentData/headerTop/index.vue
+++ b/src/views/contentData/headerTop/index.vue
@@ -11,122 +11,18 @@
         <!-- <img src="@/assets/img/title.svg" alt="" /> -->
       </div>
     </div>
-    <!-- <div class="header-menu">
-      <div class="menuItem" v-if="isAdmins">
-        <div
-          class="menuFor"
-          v-for="(item, index) in menuList"
-          :key="index"
-          @click="handleMenuClick(item)"
-        >
-          <div class="itemIcon">
-            <el-tooltip
-              class="item"
-              effect="dark"
-              :content="item.name"
-              placement="bottom"
-            >
-              <img
-                :src="activeId === item.id ? item.iconActive : item.icon"
-                :alt="item.name"
-              />
-            </el-tooltip>
-          </div>
-        </div>
-      </div>
-      <div class="menuItemQuanping">
-        <div
-          class="menuFor"
-          v-for="(item, index) in quanping"
-          :key="index"
-          @click="handlefdClick(item)"
-        >
-          <div class="itemIcon">
-            <el-tooltip
-              class="item"
-              effect="dark"
-              :content="item.name"
-              placement="bottom"
-            >
-              <img :src="item.icon" :alt="item.name" />
-            </el-tooltip>
-          </div>
-        </div>
-      </div>
-      <div class="user">
-        <el-dropdown trigger="click">
-          <img :size="30" src="@/assets/img/menu/iconUser.png" />
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item @click.native="passClick">
-              修改密码
-            </el-dropdown-item>
-            <el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-      <div class="time">
-        <div class="top">
-          <div class="time_date">{{ currentTime }}</div>
-          <div class="weather">
-            <img src="@/assets/img/menu/tianqi.png" alt="" />
-            <div class="weather_text">
-              {{ homeView.weather?.now.temperature + "°C" }}
-            </div>
-          </div>
-        </div>
-        <div class="date">{{ currentDate }}</div>
-      </div>
-    </div> -->
-    <el-dialog
-      :title="title"
-      :visible.sync="showDialog"
-      :before-close="handleClose"
-      append-to-body
-    >
-      <!-- 对话框组件 -->
-      <component :is="currentDialog"></component>
-    </el-dialog>
-    <el-dialog
-      :title="titleDialog"
-      :visible.sync="dialog"
-      :before-close="handleClose"
-      append-to-body
-      class="el-dialog-center"
-    >
-      <my-form
-        :formNewList="formDrawerList"
-        :fromItem="fromItem"
-        dialogImageUrl
-        @determine="determine"
-        @handleClose="handleClose"
-        labelWidth="120px"
-      >
-      </my-form>
-    </el-dialog>
+    <div class="header-menu">
+      <span>{{ leftText }}</span>
+      <span style="width: 20px"> | </span>
+      <span>{{ rightText }}</span>
+    </div>
   </div>
 </template>
 
 <script>
-// 导入各个对话框组件
-import PermissionDialog from "../../menuData/PermissionDialog.vue"; // ID: 1
-import DeviceDialog from "../../menuData/DeviceDialog.vue"; // ID: 2
-import LogDialog from "../../menuData/LogDialog.vue"; // ID: 3
-import AlertDialog from "../../menuData/AlertDialog.vue"; // ID: 5
-import PositionDialog from "../../menuData/PositionDialog.vue"; // ID: 6
-import AnalysisDialog from "../../menuData/AnalysisDialog.vue"; // ID: 7
-import WhitListDialog from "../../menuData/WhitListDialog.vue"; // ID: 8
-import { userUpdatepwd } from "@/api/user.js";
 export default {
   name: "header-top",
-  components: {
-    PermissionDialog,
-    DeviceDialog,
-    LogDialog,
-    AlertDialog,
-    PositionDialog,
-    AnalysisDialog,
-    WhitListDialog
-  },
+  components: {},
   props: {
     homeData: {
       type: Object,
@@ -135,105 +31,19 @@ export default {
   },
   data() {
     return {
-      menuList: [
-        {
-          id: 1,
-          name: "人员",
-          icon: require("@/assets/img/menu/xitongquanxian.png"),
-          iconActive: require("@/assets/img/menu/xitongquanxian-hove.png")
-        },
-        {
-          id: 2,
-          name: "设备",
-          icon: require("@/assets/img/menu/shebei.png"),
-          iconActive: require("@/assets/img/menu/shebei-hove.png")
-        },
-        {
-          id: 3,
-          name: "日志",
-          icon: require("@/assets/img/menu/rizhi.png"),
-          iconActive: require("@/assets/img/menu/rizhi-hove.png")
-        },
-        {
-          id: 4,
-          name: "首页",
-          icon: require("@/assets/img/menu/tongji.png"),
-          iconActive: require("@/assets/img/menu/tongji-hove.png")
-        },
-        {
-          id: 5,
-          name: "预警",
-          icon: require("@/assets/img/menu/yujing.png"),
-          iconActive: require("@/assets/img/menu/yujing-hove.png")
-        },
-        {
-          id: 6,
-          name: "防区",
-          icon: require("@/assets/img/menu/zhendi.png"),
-          iconActive: require("@/assets/img/menu/zhendi-hove.png")
-        },
-        {
-          id: 7,
-          name: "统计分析",
-          icon: require("@/assets/img/menu/tjfx.png"),
-          iconActive: require("@/assets/img/menu/tjfx-hove.png")
-        },
-        {
-          id: 8,
-          name: "白名单",
-          icon: require("@/assets/img/menu/bmd.png"),
-          iconActive: require("@/assets/img/menu/bmd-hove.png")
-        }
-      ],
-      quanping: [
-        {
-          id: 8,
-          name: "全屏",
-          icon: require("@/assets/img/menu/quanping.png"),
-          iconActive: require("@/assets/img/menu/quanping.png")
-        }
-      ],
-      activeId: 4,
       currentTime: "",
       currentDate: "",
       currentDialog: "",
-      showDialog: false,
-      title: "",
-      titleDialog: "",
-      homeView: {
-        weather: {
-          now: {
-            temperature: 0
-          }
-        }
-      },
-      formDrawerList: [
-        {
-          label: "原密码",
-          type: "input",
-          model: "oldPwd",
-          rules: [{ required: true, message: "请输入原密码" }],
-          showPassword: true
-        },
-        {
-          label: "新密码",
-          type: "input",
-          model: "newPwd",
-          rules: [{ required: true, message: "请输入新密码" }],
-          showPassword: true
-        }
-      ],
       fromItem: {},
-      dialog: false,
-      isAdmins: false
+      isAdmins: false,
+      leftText: "平台已连接",
+      rightText: "定位正常"
     };
   },
   created() {},
   watch: {
     homeData: {
-      handler(newVal) {
-        this.homeView = newVal;
-      },
+      handler(newVal) {},
       deep: true
     }
   },
@@ -247,99 +57,6 @@ export default {
       const now = new Date();
       this.currentTime = now.toLocaleTimeString(); // 获取当前时间，格式为本地时间格式
       this.currentDate = now.toLocaleDateString(); // 获取当前日期，格式为本地日期格式
-    },
-    passClick() {
-      this.fromItem = {};
-      this.titleDialog = "修改密码";
-      // 修改密码的逻辑
-      this.dialog = true;
-      console.log("修改密码");
-    },
-    logout() {
-      // 退出登录的逻辑
-      localStorage.removeItem("setToken");
-      localStorage.removeItem("userId");
-      localStorage.removeItem("userName");
-      localStorage.removeItem("isAdmin");
-      this.$router.push("/login");
-    },
-    // 确定按钮
-    determine(value) {
-      let params = {};
-      params = value;
-      params.id = localStorage.getItem("userId");
-      userUpdatepwd(params).then((res) => {
-        if (res.code === 0) {
-          this.$message.success("修改成功");
-        }
-      });
-      this.dialog = false;
-    },
-    handlefdClick(value) {
-      if (document.fullscreenElement) {
-        document
-          .exitFullscreen()
-          .then(() => {
-            console.log("退出全屏模式");
-          })
-          .catch((err) => {
-            console.error(`退出全屏模式失败: ${err.message}`);
-          });
-      } else {
-        document.documentElement
-          .requestFullscreen()
-          .then(() => {
-            console.log("进入全屏模式");
-          })
-          .catch((err) => {
-            console.error(`进入全屏模式失败: ${err.message}`);
-          });
-      }
-    },
-
-    handleMenuClick(value) {
-      this.activeId = value.id; // 点击时更新激活的ID
-      this.title = value.name; // 点击时更新对话框标题
-      // 根据ID决定显示哪个对话框
-      switch (value.id) {
-        case 1:
-          this.currentDialog = "PermissionDialog";
-          this.showDialog = true;
-          break;
-        case 2:
-          this.currentDialog = "DeviceDialog";
-          this.showDialog = true;
-          break;
-        case 3:
-          this.currentDialog = "LogDialog";
-          this.showDialog = true;
-          break;
-        case 4:
-          this.showDialog = false;
-          break;
-        case 5:
-          this.currentDialog = "AlertDialog";
-          this.showDialog = true;
-          break;
-        case 6:
-          this.currentDialog = "PositionDialog";
-          this.showDialog = true;
-          break;
-        case 7:
-          this.currentDialog = "AnalysisDialog";
-          this.showDialog = true;
-          break;
-        case 8:
-          this.currentDialog = "WhitListDialog";
-          this.showDialog = true;
-          break;
-      }
-    },
-    handleClose() {
-      // 关闭对话框时清空激活的ID
-      this.activeId = 4;
-      this.showDialog = false;
-      this.dialog = false;
     }
   }
 };
diff --git a/src/views/contentData/index.vue b/src/views/contentData/index.vue
index 439208e..0b4795d 100644
--- a/src/views/contentData/index.vue
+++ b/src/views/contentData/index.vue
@@ -3,24 +3,24 @@
   <div class="app-container">
     <headerTop :homeData="homeView" />
     <LeftSidebar :homeData="homeView" :signaData="signaList" />
-    <RightSidebar :homeData="homeView" />
-    <Footer />
+    <!-- <RightSidebar :homeData="homeView" /> -->
+    <!-- <Footer /> -->
   </div>
 </template>
 
 <script>
 import headerTop from "./headerTop/index.vue";
 import LeftSidebar from "./LeftSidebar/index.vue";
-import RightSidebar from "./RightSidebar/index.vue";
-import Footer from "./Footer/index.vue";
+// import RightSidebar from "./RightSidebar/index.vue";
+// import Footer from "./Footer/index.vue";
 
 export default {
   name: "App",
   components: {
     headerTop,
-    LeftSidebar,
-    RightSidebar,
-    Footer
+    LeftSidebar
+    // RightSidebar
+    // Footer
   },
   props: {
     homeData: {
diff --git a/src/views/index.vue b/src/views/index.vue
index f97580c..ae1f804 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -31,9 +31,9 @@ export default {
   },
   mounted() {
     this.initHomeData();
-    this.timeInterval = setInterval(() => {
-      this.initHomeData();
-    }, 2000);
+    // this.timeInterval = setInterval(() => {
+    //   this.initHomeData();
+    // }, 2000);
   },
   methods: {
     initHomeData() {
diff --git a/src/views/mapControl/index.vue b/src/views/mapControl/index.vue
index e710f11..4d940ff 100644
--- a/src/views/mapControl/index.vue
+++ b/src/views/mapControl/index.vue
@@ -1,9 +1,24 @@
 <template>
   <div class="HomeMap">
-    <div class="zoom-level">当前缩放等级: {{ zoomLevel }}</div>
+    <div class="zoom-level" @click="soundAndMenu">
+      <img :src="zoomLevelImage" alt="" />
+    </div>
     <div id="map" ref="olMap" class="map-container"></div>
     <div class="pointingNorth" @click="mapNorth">
-      <img src="@/assets/img/menu/zhibeizhen.png" alt="指北" />
+      <img src="@/assets/img/user.png" alt="" />
+      <img src="@/assets/img/setup.png" alt="" />
+      <img src="@/assets/img/query.png" alt="" />
+    </div>
+    <div class="configuration">
+      <div class="refresh">
+        <img src="@/assets/img/refresh.png" alt="" />
+      </div>
+      <div class="refresh">
+        <img src="@/assets/img/icon_postions.png" alt="" />
+      </div>
+      <div class="refresh">
+        <img src="@/assets/img/icon_model.png" alt="" />
+      </div>
     </div>
   </div>
 </template>
@@ -21,7 +36,8 @@ export default {
   data() {
     return {
       map: null,
-      zoomLevel: null
+      zoomLevel: null,
+      isZoomedIn: false
     };
   },
   created() {
@@ -32,9 +48,17 @@ export default {
     this.initMap();
   },
   computed: {
-    ...mapGetters(["statePage", "cityCode"])
+    ...mapGetters(["statePage", "cityCode"]),
+    zoomLevelImage() {
+      return this.isZoomedIn
+        ? require("@/assets/img/sound.png")
+        : require("@/assets/img/mute.png");
+    }
   },
   methods: {
+    soundAndMenu() {
+      this.isZoomedIn = !this.isZoomedIn;
+    },
     initMap() {
       // 初始化 OpenLayers 地图
 
@@ -118,13 +142,37 @@ export default {
 
   .zoom-level {
     position: absolute;
-    bottom: 0.8%;
-    left: 1%;
+    top: 60px;
+    right: 40px;
     z-index: 1000;
     color: #fff;
-    background: rgba(0, 0, 0, 0.5);
-    padding: 5px;
-    border-radius: 3px;
+    img {
+      width: 48px;
+      height: 48px;
+    }
+  }
+  .configuration {
+    position: absolute;
+    bottom: 32px;
+    right: 40px;
+    z-index: 1000;
+    color: #fff;
+    width: 29px;
+    height: 174px;
+    background-color: rgba(209, 242, 255, 0.9);
+    padding: 19px 8px;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    .refresh {
+      width: 32px;
+      height: 32px;
+      img {
+        width: 32px;
+        height: 32px;
+      }
+    }
   }
 
   .map-container {
@@ -133,15 +181,19 @@ export default {
   }
 
   .pointingNorth {
+    width: 236px;
+    height: 52px;
     position: absolute;
-    bottom: 5%;
-    right: 25%;
-    cursor: pointer;
+    bottom: 37px;
+    left: 50%;
+    transform: translateX(-50%);
     z-index: 1000;
-
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
     img {
-      width: 35px;
-      height: 35px;
+      width: 52px;
+      height: 52px;
     }
   }
 }
diff --git a/vue.config.js b/vue.config.js
index 3c06fce..90211dd 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -18,7 +18,7 @@ module.exports = defineConfig({
   productionSourceMap: false,
   transpileDependencies: true,
   devServer: {
-    host: "127.0.0.1",
+    host: "192.168.1.9",
     port: 9997,
     open: true,
     proxy: {}