From 8117b8673b8d35ec165a33fea1ffe0c9cb8ea919 Mon Sep 17 00:00:00 2001
From: GGJ <357021191@qq.com>
Date: Sat, 27 Apr 2024 22:18:58 +0800
Subject: [PATCH] =?UTF-8?q?=E8=81=94=E8=B0=83=E5=85=A8=E6=99=AF=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=20=E7=9C=81=E7=BA=A7=20=E8=AF=A6=E6=83=85=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/device-boot/panorama.ts               |  36 ++
 src/assets/img/DYPC.png                       | Bin 0 -> 851 bytes
 src/assets/img/JBL.png                        | Bin 0 -> 700 bytes
 src/assets/img/PLPC.png                       | Bin 0 -> 1028 bytes
 src/assets/img/SB.png                         | Bin 0 -> 474 bytes
 src/assets/img/SXDY.png                       | Bin 0 -> 935 bytes
 .../panorama/components/details/evaluate.vue  | 109 +++--
 .../panorama/components/details/point.vue     |  17 +-
 .../components/details/steadyState.vue        | 433 +++++++++---------
 .../components/details/temporaryState.vue     | 158 +++++--
 .../panorama/components/details/terminal.vue  |  22 +-
 .../panorama/components/mapL.vue              |  66 ++-
 .../panorama/components/mapR.vue              | 305 +++++++-----
 .../pqs/qualityInspeection/panorama/index.vue |  16 +-
 14 files changed, 680 insertions(+), 482 deletions(-)
 create mode 100644 src/assets/img/DYPC.png
 create mode 100644 src/assets/img/JBL.png
 create mode 100644 src/assets/img/PLPC.png
 create mode 100644 src/assets/img/SB.png
 create mode 100644 src/assets/img/SXDY.png

diff --git a/src/api/device-boot/panorama.ts b/src/api/device-boot/panorama.ts
index d87b01cb..e44611cf 100644
--- a/src/api/device-boot/panorama.ts
+++ b/src/api/device-boot/panorama.ts
@@ -49,3 +49,39 @@ export function getGridDiagramMonitor(data: any) {
 export function getHalfReport(data: any) {
     return request({ url: '/device-boot/line/getHalfReport', method: 'post', data })
 }
+// 综合评估概览数据
+export function getAssessOverview(data: any) {
+    return request({ url: '/harmonic-boot/grid/getAssessOverview', method: 'post', data })
+}
+// 稳态电能质量水平评价概览数据
+export function getEvaluationOverview(data: any) {
+    return request({ url: '/harmonic-boot/grid/getEvaluationOverview', method: 'post', data })
+}
+// 综合评估详细数据
+export function getAssessDetail(data: any) {
+    return request({ url: '/harmonic-boot/grid/getAssessDetail', method: 'post', data })
+}
+// 稳态电能质量水平平均值、标准差
+export function getEvaluationData(data: any) {
+    return request({ url: '/harmonic-boot/grid/getEvaluationData', method: 'post', data })
+}
+// 稳态指标超标详情
+export function evaluationDetail(data: any) {
+    return request({ url: '/harmonic-boot/grid/evaluationDetail', method: 'post', data })
+}
+// 各稳态指标的环比
+export function evaluationRatio(data: any) {
+    return request({ url: '/harmonic-boot/grid/evaluationRatio', method: 'post', data })
+}
+// 暂态统计评价
+export function getEventLevelEvaluation(data: any) {
+    return request({ url: '/event-boot/gridDiagram/getEventLevelEvaluation', method: 'post', data })
+}
+// 暂态统计详情
+export function getEventStatisticsList(data: any) {
+    return request({ url: '/event-boot/gridDiagram/getEventStatisticsList', method: 'post', data })
+}
+// 获取监测点暂降事件分析
+export function getEventReason(data: any) {
+    return request({ url: '/event-boot/areaAnalysis/getEventReason', method: 'post', data })
+}
diff --git a/src/assets/img/DYPC.png b/src/assets/img/DYPC.png
new file mode 100644
index 0000000000000000000000000000000000000000..3a993a908fdbe739622542233050511626f02ff2
GIT binary patch
literal 851
zcmV-Z1FZasP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px&4M{{nRA@u(SxZvGFbuU>(=!3bf(30^lw(oOMAw*661R#XS+eYO+8H_n{UovV
z^m&q{81DQP?_B=y4<K9c@pJba!tWD&k10Nf5a18Ljwz<&_`}2Z>2)`KZu5aA3uK{V
ziaU=ODW=`&^<(dOHb3J6AP8R6FtN}Ka0`%X0FR&VTdZ-|-0KqDTD2B20{{)il(yNo
zTLh;rLxKFf?agwTZY07VQ;hpwL5RU@4%?K!TS2G*CgH!Pg^xdP`<IrW)1Ivbp#ne)
zs=|+f3a=TRh6{a$VDWM6Qko@-05*p$XdZ+r3SUd7miVz+LIi-cAPP?dJG&W9SlA*{
zk~>qVMxPezvjDK)rx;(jfTghkLR;JeKrHE#-vjQ=AS72}0cfr>2k6hH7>HyIO_l`!
zEF6d0vZ=;2__}4ik`)#JN{D-DzLdx~rIlpj01U~bcA*-rbN6c0DOte`Ky$5D061Vd
z;xGX~LN2H?FCei}4*(@4UG|@o#>@iQ*Ek__vZ7Q8rnl1PJb1_Akd`K}o>bj(R-gbx
z|CcnZ@pRAUZU#WfRZFh83II=Vd*f*p0G4#m_&yYgYIRGku^Ir4!^xp#sBk@Owi*Dd
z6+G_7o!D@aZDygofmU=)ASdnD7l2aW&j8f80>>65O6{P1*7eM#geB9KtYEQFErkvT
zBuk`Qgh#H#CPQz+8xKH3)*c!Qw8&)61Lww7HO=8*#x&VM`{LPLI+0bE6eYIsCN53;
ztP5eb@FbggSqyE*p<4~_UW*nxBVt#g#b=2t4aV^#E(>#6+A8enObcw>*YRlIdVJLy
zTh+ZvrfdN1SNBq_f#0>Ys9D8&-735o#8PhHc-ShG<-TPLUv7Bi^;8Sc1hp23Wv9>P
zc4h#CUZLaMJm1PZ58Z4u^{JxUDgfh#eMU@NN86*6Y5>`#D3Fos$HWC)1^5q5;mgbb
zemTz#7DGPooXrh@0O97sTHH=k&9<3wGXN~**wZ-=y5Zw69Le|G+@M=i@ine@wZJt5
drhD8yfInCH0A5|$m_z^o002ovPDHLkV1m_yg;f9m

literal 0
HcmV?d00001

diff --git a/src/assets/img/JBL.png b/src/assets/img/JBL.png
new file mode 100644
index 0000000000000000000000000000000000000000..cecfabed9fb04795d3727f73abba7046604ba2be
GIT binary patch
literal 700
zcmV;t0z>_YP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px%c1c7*RA@u(nbCH_APk0O*ZNGGkEIuDy9<4+b<d>NW5bq?!VgI(Dm`br>?+|)
zLh_TUO$C3uQ={E&T#lVW+d}Wb7az^EJ-;_ftJd1pO1Ia;N9XQidv4#9)}PL^{&MX0
zRREYxQBl~P8ngMgKS;H|9@>6Q05HvJ0)QSi9*?Du`Cl~vsWghE&zb<DRjT?3q|&Fl
z2%t3jtvo%dKDHWF6@duAtS$LXZfyX!=H(Jq2LN(@+OJka^Qsykl}1P-RTqH-K#)FF
zR-vKu&c&U1hSH~60FJnu%IK&9d#!ZuOW1qK>e0hSSz2|OZD08^7HRQPAY+AT+{Wau
zEwvv2m<3}uq9q`y^60NCu@3=CLr6AnVYm>tGKx-pNeDkphpM96&F1CHG^Qo?r#^s7
zS9mv-rV)2t?t8xdStCP>a6=gblN5;@`#~oT4Tk!I8wHg6ltZNU1ArVaB)mVn=NfJA
zt4aU2{`HYMi|hds*X!<k)To4;cB!b{4In3dERX~o0&pf}R75~3lIdgDl-Q5TX^9sQ
zOllND!HdLPi9Cz|um-kE?MI~q$4fQ5^AGUsD6BsMOApbrf6p$Xu}d`qpyrvJwBu@`
zD1fAyP<lpsO+<H;*c!>XP;N8hdXI_($NobAC<(pf9Ekuj<uF?VfmEDzb7VgWkfSI|
zrO$8<f={c##DtuU-up@@JqP|_CIOHa@P}wL&nz(%2&3TICjpSOHP7r=WbokktNW#W
z^lEnQGtR<fp9K(uNQGb0_^32W*=GYtAWCoE0-^z#2!Jsn?6p#z{~3tmVa_|qz6ih?
i@y6q~Z&uG5&;I~LZ8<6kT3opR0000<MNUMnLSTZ3Qa-K#

literal 0
HcmV?d00001

diff --git a/src/assets/img/PLPC.png b/src/assets/img/PLPC.png
new file mode 100644
index 0000000000000000000000000000000000000000..6ea1701e4695c4193e5076d9f5f986d1dd5d5fc7
GIT binary patch
literal 1028
zcmV+f1pE7mP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px&zDYzuRA@upSxZ*rFbs@m4QHC>Sg@Gxo&_9>=1j20^Atx;S(Yt19q7lf;5~>F
ztE4J@>@fZCpYX%&pLPRq_i{Rf7?0C59UM-%yg!{E9P7*_R{>aze(mgXS)O%4y+55d
z+p+1zyO%%55W`6rKIGN==OY0xfNcRX1VHh)YBT}Vqw?$R<MG5%$xH5^j}g`nIl>J<
zc>NMXIBUj`A>>_po{akZO}|47hZy38A{RqEO;Zg9fq0|g0)XL;Aw0AUXD`xvDN=I4
z$K&4_6h)GNF&O@TdbZNjvzG|~KG^lTnJ$zCOf>=`J<idvBGCl^oZsDe#Dki_D1{j3
z4A%qE1b~9|gmOy+Rys`+(UO6zAQGKOGe|Sss|kR4-+Oth(XIDb8z^w5aLW!Az%7ht
zPz(Y+-qS+`0C~SxxgUuXXDc$Axz9FfQBVNbypsm;23E!x1Cn|xc48|E6@X>oP&NE2
z%3(ceX`ujM38v-2Efv%o4FsV%w*atu(yq2Bx+Pyzk8{|QMoU`)T1fQ9J<LjMc?!9S
z!n5A<JlE2yeD5j%GGlqmKlVjEAoP8!?+V_JX&Xt(d9u--f~Ri<^4ivFtBJ~@(O!aQ
zN6Y}oyQ3glg6}y*PI6lXkL`U1V1ZZ#mB_>+r8I(#)Qkh~=UI8Jw)L3W_(m~`761~6
zb_!jPXF1S>rFDrKjkN9-*NL%`_Na=fHj9f0`15}+dn6i_--57b!&pPhw`jnh=MMV2
zmwgZ{XkZ`XQ;%O3oZf7K#*EAz{2l?A2XHIjdI}G&5%kEsZH<l^Wvo4EkI*X?Nx1!R
z_WC0>7R9Tz=o;lL<N3L0=28pG5wUW*p@VszrEhs=Td%=pD}lv{&pWqLOk|d!7TpV|
zInZGEuP8YA#BD^NUgPI_)aY??dvQ$^M%xC~Tn~UuHY$KR4X&qZBi^C4-d;;P>|OSn
z=M3Bz+n(OB${c>A(pS-dflBAFp-Pp`c6AQ6a&J;p&aHZ|A}5VRXK4T!Tz8<+dUr_)
z&(L8RFCtJKW1=?r7RUtvKa9Lv&ocG%eviR&&Dz$7eDx#+tDRiCMoKN4;0cCy);|hD
zr%CG1l>4_#YZm}1GStBWWWKy8&-v?lwl}`^+UfGfr;NHAzycySWm-l;YNeJWR@X_b
zQ)UUkn=FO^5C~<c*ri4IHUP|Rt?;z&zEBUXto7{x*eJ(caiwRCem4Uky~~$(N*0>+
ykaSU}UwJj#(u&zmkEXv{uOAlitquO~BJd9#MU$p?n-H}C0000<MNUMnLSTZV<loK!

literal 0
HcmV?d00001

diff --git a/src/assets/img/SB.png b/src/assets/img/SB.png
new file mode 100644
index 0000000000000000000000000000000000000000..5c663a33d45ec618c07c0d2a0ab3f865098d7dbd
GIT binary patch
literal 474
zcmV<00VV#4P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px$lu1NERA@u(nN51aAP|O`uJuf<$I^vKy3k`8&!lVVLtE;I{04>)JMJ`O^1bto
zFc1(6|G>ia3kI0m!T;mH>ezqO%=UHLk1@~lI-o>@l${Wws(3A2g6yx`&%p=c1o#zy
zipc`?n9FW(>U3UMA37x-XFkf(f-n!RyC8f3@@^$;Vr#M>fLI^8KMh#`J_}0<He)e>
z&Img&vCf(-Av`^YoNW@ooSuCUO#-Zr`wk@ZxT;(bO#&$4u@KDy#6pk&*s?cql6kt#
zY~Dx!aL`i1QJnFz8#eko34jVt1Tjj00ry;F00f!0hGYQlg)(c6q=bGp_qX><ZI;{L
z&gQ0x1i-S@EXhJYjS@|vItlauwsk<Qp!qgbDk0k{seTLf_EP{!{sUNuSx%)P$N|i9
ziaAM3aiR(UhFB~>N>)?GR&yXlRLWQec$sESLjA*C^LT&C;jVeSo>IQ0$3C<eIJox>
z4RPNS3+WWE0t8?3QJz8s2)<va;7z`5d=MZuO>>Q7fVncSpUV!g1DP540^KQjKsj$#
QX#fBK07*qoM6N<$g0>RN0{{R3

literal 0
HcmV?d00001

diff --git a/src/assets/img/SXDY.png b/src/assets/img/SXDY.png
new file mode 100644
index 0000000000000000000000000000000000000000..6d553fa111af789e0dc3bdfc9b6e718449a3fbc1
GIT binary patch
literal 935
zcmV;Y16cftP)<h;3K|Lk000e1NJLTq002e+001xu1^@s6tW^wH00001b5ch_0Itp)
z=>Px&VM#<mRA@u(nq6|!Fc8P3JST979)$E5JTROiozmFAxcBG-*JwJNgBgxcCVfV*
zjzu@?m9*<huE!>iv21C7`tOI<wr1hK^=-9%+EoXN!7iB#K(Ws4k5~2Oe=r?^4$A%U
zs%FKpNX2-i03%K<@c$ygY?}SOF=p$mz2xG{BEfhlf599=YFQi@1jWSEvM4a?+nc?0
zw(4SUR4t1EL!czp(t=qx)i-P0dt=Ox3^mP#vF7f$t3PIVR+dLlC|xE>CLIhW%R;6E
z#@8y?FlSx$wEJAAjGZkQ4vJJQtt)Ms>Mli3b=^Am+O8CW0(O96p6yvZVB2s_lk_ze
zlnD%uK~XI4Fe@-Qp!gUxJ21xleiu`Qb#@EK0d5Qq%=Yb<>kEa%L_>dl`kEv4i{{b}
z;?g%951h62S&Tt-jCKxw{KV=QyvTs7^`OuKZ?a&(AaD^${Sh-_)9f9&9y}UMzK)^0
z9BM43b`>8WecFzJwr`r752=T0udnRt`{S<qslAUIui53$d=zf#WZk+_j>VUH2Hj;p
zk47~F3L8(j^-mT|swR=bkv66%oJoQSWe;3`NZi4vX6eBZ!<i(QexN+{W@)^Msm8+{
z0_BvhyHr>rP7Fz}Oab;Ur7}tirdxQ9F{_7AvpZ$44F$N=jneDVSOCxCT!`K;QO#+y
zjnP6un{og!wCIuAEE=Z)6LKLskpzxtacB_Tls3kkWS8%Un$B(iL*h~~7a9W$g<T~0
zYIjr<J3J)q9I<WZn&qXyv~T*P1sOF`lZyQuQe{#=p-m|Q1}4YG#ulwT!(hX5s3sKG
zMgarHa6x#83t=!N?=J}^>Q4NtjqpqMP>gtqYGPTi7?_khNmH{VR}O)bQrl=?usdl|
zvk=UgIwiq71+z4mo;yjZTM3Mp)HeO}+^@BYg5lhWcIhR%D*=^qjYu|Q&s(E{VGK-u
zjv;}fDf*<btvHy#>k6<XD-;PFjjD=+q3-ltsp?a+L_IM@NYw)Kyb741<+}t7w-HcW
zYSc0s7}}7IeH17)K7J@{KWv7K=zs9#_t|UNR6Ar8#lY%(YeUk4$N?wTXObv(G%z`g
z)jlHxC#9CrTuEzCuJIfgY27qy#V~<bTq4XK3~q4KPd#GF`~$c`pk_kNlHULT002ov
JPDHLkV1h+)tjz!b

literal 0
HcmV?d00001

diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue b/src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue
index 62a12ab3..fcc4dfc3 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue
@@ -3,29 +3,29 @@
     <el-dialog draggable title="综合评估详情" v-model="dialogVisible" width="1400px">
         <div>
             <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="300px" :data="tableData">
-                <vxe-column field="devName" title="所属区域" />
-                <vxe-column field="devName" title="综合评估得分" />
-                <vxe-column field="devName" title="指标合格率" />
+                <vxe-column field="deptName" title="所属区域" />
+                <vxe-column field="assessData" title="综合评估得分" :formatter="formatter" />
+                <vxe-column field="qualifyData" title="指标合格率" :formatter="formatter" />
                 <vxe-colgroup title="各项指标得分">
                     <vxe-colgroup title="电压偏差">
-                        <vxe-column field="devName" title="评估得分" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="vdevAssessData" title="评估得分" :formatter="formatter" />
+                        <vxe-column field="vdevQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
-                    <vxe-colgroup title="评率偏差">
-                        <vxe-column field="devName" title="评估得分" />
-                        <vxe-column field="devName" title="指标合格率" />
+                    <vxe-colgroup title="频率偏差">
+                        <vxe-column field="freqAssessData" title="评估得分" :formatter="formatter" />
+                        <vxe-column field="freqQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="谐波含量">
-                        <vxe-column field="devName" title="评估得分" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="harmAssessData" title="评估得分" :formatter="formatter" />
+                        <vxe-column field="harmQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="电压闪变">
-                        <vxe-column field="devName" title="评估得分" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="flickerAssessData" title="评估得分" :formatter="formatter" />
+                        <vxe-column field="flickerQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="三相不平衡度">
-                        <vxe-column field="devName" title="评估得分" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="unbalanceAssessData" title="评估得分" :formatter="formatter" />
+                        <vxe-column field="unbalanceQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                 </vxe-colgroup>
             </vxe-table>
@@ -39,42 +39,63 @@
 import { ref } from 'vue'
 import MyEChart from '@/components/echarts/MyEchart.vue'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
-
+import { getAssessDetail } from '@/api/device-boot/panorama'
 const dialogVisible: any = ref(false)
 
-const tableData: any = ref([
-    {
-        devName: 123
-    }
-])
+const tableData: any = ref([])
 
-const picEChart = ref({
-    title: {
-        text: ''
-    },
-    xAxis: {
-        name: '(区域)',
-        data: ['承德', '承德', '承德', '承德', '承德', '承德', '承德']
-    },
-    yAxis: {
-        name: '',
-        min: 0,
-        max: 100
-    },
-    options: {
-        series: [
-            {
-                name: '评估得分',
-                type: 'bar',
-
-                data: [12, 12, 12, 12, 12, 12, 12]
-            }
-        ]
-    }
-})
+const picEChart = ref()
 const open = async (row: any) => {
+    getAssessDetail(row).then(res => {
+        tableData.value = res.data
+        picEChart.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    let tips = ''
+
+                    if (params[0].value == 3.14159) {
+                        tips += params[0].name + ':暂无数据<br/>'
+                    } else {
+                        tips += params[0].name + ':' + params[0].value + '%<br/>'
+                    }
+
+                    return tips
+                }
+            },
+            title: {
+                text: ''
+            },
+            xAxis: {
+                name: '(区域)',
+                data: res.data.map((item: any) => item.deptName)
+            },
+            yAxis: {
+                name: '',
+                min: 0,
+                max: 100
+            },
+            options: {
+                series: [
+                    {
+                        name: '评估得分',
+                        type: 'bar',
+
+                        data: res.data.map((item: any) => item.assessData)
+                    }
+                ]
+            }
+        }
+    })
+
     dialogVisible.value = true
 }
+const formatter = (row: any) => {
+    if (row.cellValue == 3.14159) {
+        return '暂无数据'
+    } else {
+        return row.cellValue
+    }
+}
 
 defineExpose({ open })
 </script>
diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/point.vue b/src/views/pqs/qualityInspeection/panorama/components/details/point.vue
index 61f310ff..cd6368b0 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/point.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/point.vue
@@ -15,8 +15,13 @@
             <el-col :span="12">
                 <div class="title">
                     <span>分布统计</span>
-                    <el-select v-model="time" style="width: 120px; margin-right: 80px" @change="statiStics">
-                        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
+                    <el-select
+                        v-model="statisticalType"
+                        :value-key='id'
+                        style="width: 120px; margin-right:  80px"
+                        @change="statiStics"
+                    >
+                        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
                     </el-select>
                 </div>
                 <div class="pie">
@@ -54,10 +59,12 @@ import { useDictData } from '@/stores/dictData'
 import { getGridDiagramLineTendency, getGridDiagramLineData, getHalfReport } from '@/api/device-boot/panorama'
 const dictData = useDictData()
 const dialogVisible: any = ref(false)
-const time = ref('1')
+
 const Voltage = dictData.getBasicData('Dev_Voltage_Stand')
 const tableData: any = ref([])
 const options = dictData.getBasicData('Statistical_Type', ['Report_Type'])
+const time = ref('1')
+const statisticalType = ref(options[0])
 const loadTypeArr = dictData.getBasicData('Interference_Source')
 
 const rowList: any = ref({})
@@ -132,13 +139,13 @@ const analysis = (e: any) => {
 }
 // 统计
 const statiStics = () => {
-    getGridDiagramLineData(rowList.value).then(res => {
+    getGridDiagramLineData({ ...rowList.value, statisticalType: statisticalType.value }).then(res => {
         picEChart.value = {
             title: {
                 text: ''
             },
             xAxis: {
-                name: '(区域)',
+             
                 data: res.data.map((item: any) => item.orgName)
             },
             yAxis: {
diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue b/src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue
index 0953b22b..a38d5ec6 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue
@@ -2,43 +2,47 @@
 <template>
     <!-- 终端 -->
     <el-dialog draggable title="稳态电能质量水平评估详情" v-model="dialogVisible" width="1400px">
-        <el-row style="height: 300px" :gutter="20">
-            <el-col :span="14">
+        <el-row style="height: 330px" :gutter="20">
+            <el-col :span="12">
                 <div class="title">
                     <span>稳态电能质量水平评估</span>
                 </div>
-                <vxe-table v-bind="defaultAttribute" size="mini" ref="vxeRef" height="260px" :data="tableData">
-                    <vxe-column field="devName" width="110px" />
-
-                    <vxe-colgroup title="500kV">
-                        <vxe-column field="devName" title="均值" />
-                        <vxe-column field="devName" title="标准差" />
-                    </vxe-colgroup>
-                    <vxe-colgroup title="220kV">
-                        <vxe-column field="devName" title="均值" />
-                        <vxe-column field="devName" title="标准差" />
-                    </vxe-colgroup>
-                    <vxe-colgroup title="110kV">
-                        <vxe-column field="devName" title="均值" />
-                        <vxe-column field="devName" title="标准差" />
-                    </vxe-colgroup>
-                    <vxe-colgroup title="35kV">
-                        <vxe-column field="devName" title="均值" />
-                        <vxe-column field="devName" title="标准差" />
-                    </vxe-colgroup>
-                    <vxe-colgroup title="其他">
-                        <vxe-column field="devName" title="均值" />
-                        <vxe-column field="devName" title="标准差" />
-                    </vxe-colgroup>
-                </vxe-table>
+                <div class="boxSteps">
+                    <el-steps>
+                        <template v-for="(item, i) in Voltage">
+                            <el-step
+                                :class="active == i ? 'highlight' : ''"
+                                :title="item.name"
+                                @click="handleClick(i)"
+                            ></el-step>
+                        </template>
+                    </el-steps>
+                </div>
+                <div v-for="(item, i) in evaluationData" class="evaluationData">
+                    <el-row style="width: 100%">
+                        <el-col :span="12" style="display: flex">
+                            <img :src="url[i]" />
+                            <span>{{ item.targetName }}</span>
+                        </el-col>
+                        <el-col :span="12" style="display: flex">
+                            <div style="width: 150px">
+                                均值：
+                                <span style="color: #339966">{{ item.avg == 3.14159 ? '--' : item.avg }}</span>
+                            </div>
+                            <div>
+                                标准差：
+                                <span style="color: #ff9900">{{ item.avg == 3.14159 ? '--' : item.avg }}</span>
+                            </div>
+                        </el-col>
+                    </el-row>
+                </div>
             </el-col>
-            <el-col :span="10">
+            <el-col :span="12">
                 <div class="title">
                     <span>稳态电能质量水平评估环比变化</span>
                 </div>
                 <div class="pie">
-                    <MyEChart style="height: 260px" :options="trendEChart" />
-                    <!-- <div style="height: 260px" ref="chartRef" /> -->
+                    <div style="height: 260px; width: 100%" ref="chartRef"></div>
                 </div>
             </el-col>
         </el-row>
@@ -47,153 +51,97 @@
                 <span>稳态电能质量水平评估详细列表</span>
             </div>
             <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="300px" :data="tableData">
-                <vxe-column field="devName" title="变电站名称" />
-                <vxe-column field="devName" title="超标天数" />
-                <vxe-column field="devName" title="超标差值" />
-                <vxe-column field="devName" title="在线监测点数量(个)" />
-                <vxe-column field="devName" title="超标监测点数量(个)" />
-                <vxe-column field="devName" title="超标监测点占比(%)" />
+                <vxe-column field="deptName" title="区域名称" />
+                <vxe-column field="onlineNum" title="在线监测点数量(个)" />
+                <vxe-column field="overNum" title="超标监测点数量(个)" />
+                <vxe-column field="overRatio" title="超标监测点占比(%)" />
+
+                <vxe-colgroup :title="item" v-for="(item, i) in title">
+                    <vxe-column title="超标天数">
+                        <template #default="scope">
+                            <span>{{ scope.row.list[i].overDay }}</span>
+                        </template>
+                    </vxe-column>
+                    <vxe-column title="超标监测点数	">
+                        <template #default="scope">
+                            <span>{{ scope.row.list[i].overNum }}</span>
+                        </template>
+                    </vxe-column>
+                </vxe-colgroup>
             </vxe-table>
         </div>
     </el-dialog>
 </template>
 <script setup lang="ts">
-import { ref } from 'vue'
-import MyEChart from '@/components/echarts/MyEchart.vue'
-import echarts from '@/components/echarts/echarts.ts'
+import { ref, nextTick } from 'vue'
+import echarts from '@/components/echarts/echarts'
+import { useDictData } from '@/stores/dictData'
+import { color } from '@/components/echarts/color'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
-
+import { getEvaluationData, evaluationDetail, evaluationRatio } from '@/api/device-boot/panorama'
 const dialogVisible: any = ref(false)
-const chartRef = ref()
-const tableData: any = ref([
-    {
-        devName: 123
-    }
-])
+const rowList = ref({})
+const active: any = ref(1)
+const evaluationData: any = ref([])
 
-const trendEChart = ref({
-    xAxis: {
-        show: false
-    },
-    legend: {
-        data: ['1月', '2月', '3月']
-    },
-    yAxis: {
-        show: false
-    },
-
-    options: {
-        dataZoom: null,
-        radar: {
-            center: ['50%', '50%'],
-            radius: '65%',
-            startAngle: 90,
-            splitNumber: 5,
-            splitArea: {
-                areaStyle: {
-                    color: ['#FFFFFF', '#F5F9FF'].reverse()
-                }
-            },
-            axisLabel: {
-                show: false
-            },
-            axisLine: {
-                show: true,
-                lineStyle: {
-                    color: '#D2E4F8'
-                }
-            },
-            splitLine: {
-                show: true,
-                lineStyle: {
-                    color: '#D2E4F8'
-                }
-            },
-            name: {
-                formatter: '{value}',
-                textStyle: {
-                    color: '#656565',
-                    fontSize: 15
-                }
-            },
-            indicator: [
-                {
-                    name: '评率偏差',
-                    max: 100
-                },
-                {
-                    name: '电压偏差',
-                    max: 100
-                },
-                {
-                    name: '闪变',
-                    max: 100
-                },
-                {
-                    name: '电压总谐波畸变率',
-                    max: 100
-                },
-                {
-                    name: '三相电压不平衡度',
-                    max: 100
-                }
-            ]
-        },
-
-        series: [
-            {
-                name: '1月',
-                // type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [9, 16, 16, 15, 12]
-            }
-        ]
+const dictData = useDictData()
+const Voltage: any = dictData.getBasicData('Dev_Voltage_Stand').filter(item => {
+    if (item.code == '35kV' || item.code == '500kV' || item.code == '220kV' || item.code == '110kV') {
+        return item
     }
 })
-const echart = () => {
-    let chart = echarts.init(chartRef.value)
-    var dataname = ['评率偏差', '电压偏差', '闪变', '电压总谐波畸变率', '三相电压不平衡度']
-    var datamax = [20, 20, 20, 20, 20, 20]
-    var datavaule = [9, 16, 16, 15, 12, 8]
-    var datavaule1 = [6, 8, 10, 6, 5, 8]
-    var datavaule2 = [19, 19, 19, 19, 19, 19]
 
-    var indicator = []
-    for (var i = 0; i < dataname.length; i++) {
+const chartRef = ref<HTMLDivElement>()
+const url: any = [
+    new URL(`@/assets/img/PLPC.png`, import.meta.url),
+    new URL(`@/assets/img/DYPC.png`, import.meta.url),
+    new URL(`@/assets/img/JBL.png`, import.meta.url),
+    new URL(`@/assets/img/SXDY.png`, import.meta.url),
+    new URL(`@/assets/img/SB.png`, import.meta.url)
+]
+const tableData: any = ref([])
+const title = ['电压偏差', '频率偏差', '电压总谐波畸变率', '闪变', '三相电压不平衡度']
+
+const echart = (row: any) => {
+    let chart = echarts.init(chartRef.value as HTMLDivElement)
+
+    let dataname = ['频率偏差', '电压偏差', '电压总谐波畸变率', '三相电压不平衡度', '闪变']
+    let datamax = [100, 100, 100, 100, 100, 100]
+    let indicator = []
+    for (let i = 0; i < dataname.length; i++) {
         indicator.push({
             name: dataname[i],
             max: datamax[i]
         })
     }
 
-    let option = {
+    let option: any = {
         tooltip: {
-            show: true,
-            trigger: 'item'
+            trigger: 'item',
+            axisPointer: {
+                type: 'shadow',
+                label: {
+                    color: '#fff',
+                    fontSize: 16
+                }
+            },
+            textStyle: {
+                color: '#fff',
+                fontStyle: 'normal',
+                opacity: 0.35,
+                fontSize: 14
+            },
+            backgroundColor: 'rgba(0,0,0,0.35)',
+            borderWidth: 0
         },
         legend: {
-            data: ['1月', '2月', '3月'],
+            data: row.map((item: any) => item.time),
             type: 'scroll',
             orient: 'vertical',
             icon: 'roundRect',
             right: '20',
-            top: 'center',
-            itemGap: 30,
+
+            itemGap: 10,
             itemWidth: 16,
             itemHeight: 16,
             textStyle: {
@@ -236,77 +184,69 @@ const echart = () => {
             indicator: indicator
         },
 
-        series: [
-            {
-                name: '1月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule]
-            },
-            {
-                name: '2月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule1]
-            },
-            {
-                name: '3月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule2]
-            }
-        ]
+        series: []
     }
+
+    row.forEach((item: any, i: any) => {
+        option.series.push({
+            name: item.time,
+            type: 'radar',
+            symbol: 'none',
+            areaStyle: {
+                normal: {
+                    color: color[i + 1]
+                }
+            },
+            itemStyle: {
+                color: color[i + 1]
+            },
+            data: [item.ratioList]
+        })
+    })
+
+    row.forEach((item: any, i: any) => {
+        option.series.push({
+            name: item.time + 1,
+            type: 'radar',
+            symbol: 'none',
+            areaStyle: {
+                normal: {
+                    color: color[i + 1]
+                }
+            },
+            itemStyle: {
+                color: color[i + 1]
+            },
+            data: [item.ratioList]
+        })
+    })
+
     chart.setOption(option)
 }
-// echart()
+
 const open = async (row: any) => {
+    rowList.value = row
     dialogVisible.value = true
+    // 稳态电能质量水平评估
+    handleClick(0)
+    //环比
+    evaluationRatio(row).then(res => {
+        echart(res.data)
+    })
+    // 稳态电能质量水平评估详细列表
+    evaluationDetail(row).then(res => {
+        tableData.value = res.data
+    })
+}
+// 点击电压等级
+const handleClick = (i: any) => {
+    active.value = i
+    getEvaluationData({
+        ...rowList.value,
+        voltageLevel: Voltage[i].id
+    }).then(res => {
+        evaluationData.value = res.data
+    })
 }
 
 defineExpose({ open })
@@ -328,7 +268,60 @@ defineExpose({ open })
     display: flex;
     justify-content: space-around;
 }
-:deep(.el-table thead) {
-    color: #000;
+.evaluationData {
+    height: 40px;
+    margin: 8px 30px;
+    width: 100%;
+    box-shadow: 1px 1px 1px 1px #e8e3e3;
+    display: flex;
+    font-size: 18px;
+    line-height: 40px;
+    img {
+        height: 30px;
+        width: 30px;
+        margin: 5px 30px;
+    }
+}
+
+.el-steps {
+    margin-top: 5px;
+}
+:deep(.el-step__icon) {
+    border: none;
+    background: #ccc;
+    margin-top: 5px;
+    width: 15px;
+    height: 15px;
+}
+:deep(.el-step__icon-inner) {
+    display: none;
+}
+:deep(.boxSteps) {
+    border-radius: 50px;
+    width: 60%;
+    height: 25px;
+    margin: auto;
+    margin-top: 30px;
+    .el-step__title {
+        line-height: 18px;
+        font-size: 16px;
+        margin-left: -10px;
+        font-weight: 500;
+        color: #000 !important;
+        position: relative;
+        top: -50px;
+    }
+}
+:deep(.highlight) {
+    .el-step__icon {
+        background: var(--el-color-primary);
+    }
+    .el-step__title {
+        font-weight: 700 !important;
+        color: var(--el-color-primary) !important;
+    }
+    // .is-wait {
+    //     color: var(--el-color-primary) !important;
+    // }
 }
 </style>
diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue b/src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue
index b152e906..d1231d7b 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue
@@ -18,8 +18,26 @@
             </vxe-table>
         </div>
         <div style="height: 300px; margin-top: 10px; display: flex">
-            <MyEChart style="height: 300px; width: 50%" :options="picEChart" />
-            <MyEChart style="height: 300px; width: 50%" :options="picEChart" />
+            <!-- 
+            -->
+            <div class="statistics-main">
+                <div class="statistics-box">
+                    <MyEChart style="height: 300px" :options="picEChart" />
+
+                    <el-table size="small" height="300px" :data="descentData">
+                        <el-table-column prop="name" label="暂降原因" width="80px" align="center" />
+                        <el-table-column prop="value" label="暂降次数" width="80px" align="center" />
+                    </el-table>
+                </div>
+
+                <div class="statistics-box">
+                    <MyEChart style="height: 300px" :options="picEChart1" />
+                    <el-table size="small" height="300px" :data="resembleData">
+                        <el-table-column prop="name" label="暂降原因" width="80px" align="center" />
+                        <el-table-column prop="value" label="暂降次数" width="80px" align="center" />
+                    </el-table>
+                </div>
+            </div>
         </div>
     </el-dialog>
 </template>
@@ -27,63 +45,105 @@
 import { ref } from 'vue'
 import MyEChart from '@/components/echarts/MyEchart.vue'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
+import { getEventStatisticsList, getEventReason } from '@/api/device-boot/panorama'
 
 const dialogVisible: any = ref(false)
 
-const tableData: any = ref([
-    {
-        devName: 123
-    }
-])
+const tableData: any = ref([])
+const descentData = ref([])
+const resembleData = ref([])
 
-const picEChart = ref({
-    legend: {
-        orient: 'vertical'
-    },
-    xAxis: {
-        show: false
-    },
-    yAxis: {
-        show: false
-    },
-    options: {
-        dataZoom: null,
-        series: [
-            {
-                type: 'pie',
-
-                center: ['50%', '50%'],
-                radius: '50%',
-                label: {
-                    formatter: function (e: any) {
-                        let {
-                            data: { value, name }
-                        } = e
-                        return `${name}：${value}`
-                    }
-                },
-
-                data: [
+const picEChart = ref({})
+const picEChart1 = ref({})
+const open = async (row: any) => {
+    getEventStatisticsList(row).then((res: any) => {
+        tableData.value = res.data
+    })
+    getEventReason(row).then(res => {
+        descentData.value = res.data.reason
+        resembleData.value = res.data.type
+        picEChart.value = {
+            tooltip: {
+                trigger: 'item'
+            },
+            legend: {
+                orient: 'vertical'
+            },
+            xAxis: {
+                show: false
+            },
+            yAxis: {
+                show: false
+            },
+            options: {
+                dataZoom: null,
+                series: [
                     {
-                        name: '其他',
-                        value: 53.4,
-                        itemStyle: {
-                            color: '#ff0000'
-                        }
-                    },
-                    {
-                        name: '大型感应电动机启动',
-                        value: 3.4
+                        type: 'pie',
+                        center: ['40%', '50%'],
+                        radius: '50%',
+                        label: {
+                            show: false,
+                            position: 'outside',
+                            textStyle: {
+                                //数值样式
+                            }
+                        },
+                        data: res.data.reason
                     }
                 ]
             }
-        ]
-    }
-})
-const open = async (row: any) => {
+        }
+        picEChart1.value = {
+            tooltip: {
+                trigger: 'item'
+            },
+            legend: {
+                orient: 'vertical'
+            },
+            xAxis: {
+                show: false
+            },
+            yAxis: {
+                show: false
+            },
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        type: 'pie',
+                        center: ['40%', '50%'],
+                        radius: '50%',
+                        label: {
+                            show: false,
+                            position: 'outside',
+                            textStyle: {
+                                //数值样式
+                            }
+                        },
+                        data: res.data.type
+                    }
+                ]
+            }
+        }
+    })
     dialogVisible.value = true
 }
 
 defineExpose({ open })
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.statistics-main {
+    height: 300px;
+    display: grid;
+    width: 100%;
+    grid-template-columns: 1fr 1fr;
+
+    .statistics-box {
+        height: 300px;
+        // display: flex;
+        display: grid;
+        grid-template-columns: 2fr 1fr;
+    }
+}
+</style>
diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue b/src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue
index 8a0cbad8..a2ed8b08 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue
@@ -17,8 +17,8 @@
                     <span>分布统计</span>
                 </div>
                 <div class="pie">
-                    <MyEChart style="height: 260px; width: 50%" :options="picEChart" />
-                    <el-table size="small" height="260px" style="width: 240px" :data="picList">
+                    <MyEChart style="height: 260px; width: 60%" :options="picEChart" />
+                    <el-table size="small" height="260px" style="width: 35%" :data="picList">
                         <el-table-column prop="orgName" width="80px" align="center"></el-table-column>
                         <el-table-column prop="onlineEvaluate" label="终端评价" align="center">
                             <template #default="scope">
@@ -113,7 +113,7 @@ const open = async (row: any) => {
         res.data.forEach((item: any) => {
             picData.push({
                 value: item.devCount,
-                name: `${item.orgName}：${item.devCount}台`,
+                name: `${item.orgName}`,
                 itemStyle: {
                     color: item.onlineEvaluate < 60 ? 'red' : item.onlineEvaluate < 90 ? 'orange' : 'green'
                 }
@@ -136,13 +136,21 @@ const open = async (row: any) => {
                     {
                         type: 'pie',
                         startAngle: 360,
-                        center: ['50%', '50%'],
-                        radius: ['25%', '35%'],
+                        center: ['50%', '55%'],
+                        radius: ['40%', '60%'],
                         endAngle: 0,
-
+                        labelLine: {
+                            length: 8,
+                            length2: 50,
+                            show: true
+                        },
+                        label: {
+                            padding: [0, -50],
+                            formatter: '{b}:{c}台\n\n'
+                        },
                         itemStyle: {
                             borderColor: '#fff',
-                            borderWidth: 5
+                            borderWidth: 1
                         },
 
                         data: picData
diff --git a/src/views/pqs/qualityInspeection/panorama/components/mapL.vue b/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
index 9de2bd17..18757504 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
@@ -1,7 +1,6 @@
 <template>
-    <div>
-        <DatePicker ref="datePickerRef" style="display: none" />
-        <div class="boxLeft" :class="show ? 'show' : 'noshow'" :style="height">
+    <div :class="show ? 'show' : 'noshow'">
+        <div class="boxLeft" :style="height">
             <div v-for="(item, i) in list" :style="boxHeight">
                 <div class="title">
                     <span>{{ item.title }}</span>
@@ -45,8 +44,8 @@
                                     <el-col :span="12">{{ item.titleT[1] }}</el-col>
                                 </el-row>
                                 <el-row :gutter="20" class="mt4">
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[4].numOne}}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[4].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[4].numOne }}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[4].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -56,8 +55,8 @@
                             <img src="@/assets/img/500kv.png" alt="" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[0].numOne}}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[0].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[0].numOne }}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[0].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -67,8 +66,8 @@
                             <img src="@/assets/img/220kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[1].numOne}}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[1].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[1].numOne }}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[1].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -78,8 +77,8 @@
                             <img src="@/assets/img/110kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[2].numOne}}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[2].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[2].numOne }}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[2].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -89,8 +88,8 @@
                             <img src="@/assets/img/35kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[3].numOne}}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[3].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[3].numOne }}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[3].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -258,7 +257,6 @@
 
 <script setup lang="ts">
 import { onMounted, reactive, ref, provide } from 'vue'
-import DatePicker from '@/components/form/datePicker/index.vue'
 import { useDictData } from '@/stores/dictData'
 import { mainHeight } from '@/utils/layout'
 import { ArrowRight } from '@element-plus/icons-vue'
@@ -272,12 +270,11 @@ const show = ref(false)
 const standRef = ref()
 const terminalRef = ref()
 const pointRef = ref()
-const datePickerRef = ref()
 const list: any = ref([
     {
         title: '变电站',
         img: new URL(`@/assets/img/BDZ.png`, import.meta.url),
-        titleT:['总数','告警'],
+        titleT: ['总数', '告警'],
         list: [
             {
                 numOne: 1,
@@ -304,7 +301,7 @@ const list: any = ref([
     {
         title: '终端统计',
         img: new URL(`@/assets/img/ZD.png`, import.meta.url),
-        titleT:['终端个数','终端在线率'],
+        titleT: ['终端个数', '终端在线率'],
         list: [
             {
                 numOne: 1,
@@ -331,7 +328,7 @@ const list: any = ref([
     {
         title: '监测点统计',
         img: new URL(`@/assets/img/JCD.png`, import.meta.url),
-        titleT:['总数','在线'],
+        titleT: ['总数', '在线'],
         list: [
             {
                 numOne: 1,
@@ -372,22 +369,14 @@ const open = (e: any) => {
 }
 const info = (row: any) => {
     let form = {
+        ...row,
         id: row.orgNo,
         deptIndex: row.orgNo,
         orgId: row.orgNo,
         ids: [],
         statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0],
         isUpToGrid: row.isUpToGrid,
-        monitorFlag: row.isUpToGrid,
-        // startTime: datePickerRef.value.timeValue[0],
-        // searchBeginTime: datePickerRef.value.timeValue[0],
-        // endTime: datePickerRef.value.timeValue[1],
-        // searchEndTime: datePickerRef.value.timeValue[1],
-        startTime:`2023-07-01`,
-        searchBeginTime: `2023-07-01`,
-        endTime: `2023-07-30`,
-        searchEndTime: `2023-07-30`,
-        type: datePickerRef.value.interval
+        monitorFlag: row.isUpToGrid
     }
     formRow.value = form
     getSubLineGiveAnAlarm(form).then()
@@ -401,8 +390,8 @@ defineExpose({ info })
 <style lang="scss" scoped>
 .boxLeft {
     background-color: #fff;
-    width: 400px;
-    padding: 10px;
+    width: 100%;
+    padding: 10px 0px 10px 10px;
     font-size: 13px;
     overflow: hidden;
 }
@@ -431,9 +420,9 @@ defineExpose({ info })
     // height: ;
     display: flex;
     justify-content: space-between;
-    font-weight: 550;
+    font-size: 16px;
     height: 22px;
-    line-height: 22px;
+    line-height: 23px;
     padding-left: 5px;
     width: 100%;
     background-image: linear-gradient(to right, #a4e5da, #fff);
@@ -444,6 +433,7 @@ defineExpose({ info })
         font-size: 12px;
         cursor: pointer;
     }
+    
 }
 .infoTop {
     display: flex;
@@ -481,16 +471,20 @@ defineExpose({ info })
     height: 200px;
     cursor: pointer;
 }
+
 .show {
     width: 0px;
-    padding: 0;
-
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 0;
+    }
 }
 .noshow {
-    width: 400px;
-    padding: 10px;
+    width: 25%;
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 10px 0px 10px 10px;
+    }
 }
 :deep(.el-card) {
     --el-card-padding: 10px !important;
diff --git a/src/views/pqs/qualityInspeection/panorama/components/mapR.vue b/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
index ff58b03d..f1efff0b 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/mapR.vue
@@ -1,7 +1,6 @@
 <template>
-    <div>
-        <DatePicker ref="datePickerRef" style="display: none" />
-        <div class="boxLeft" :class="show ? 'show' : 'noshow'" :style="height">
+    <div :class="show ? 'show' : 'noshow'">
+        <div class="boxLeft" :style="height">
             <!-- 综合评估 -->
             <div>
                 <div class="title">
@@ -12,9 +11,29 @@
                     </span>
                 </div>
                 <div class="evaluate">
-                    <div v-for="item in evaluate" style="width: 40px">
+                    <div v-for="item in assessList" style="min-width: 50px">
                         <div>{{ item.name }}</div>
-                        <div style="margin-top: 5px">{{ item.value }}</div>
+                        <div
+                            style="margin-top: 5px"
+                            :style="{
+                                color:
+                                    item.score == 3.14159
+                                        ? ''
+                                        : item.score > 4.5
+                                        ? '#339966'
+                                        : item.score > 4
+                                        ? '#3399ff'
+                                        : item.score > 3
+                                        ? '#ffcc33'
+                                        : item.score > 2
+                                        ? '#ff9900'
+                                        : item.score > 0
+                                        ? '#cc0000'
+                                        : ''
+                            }"
+                        >
+                            {{ item.score == 3.14159 ? '/' : item.score }}
+                        </div>
                     </div>
                 </div>
             </div>
@@ -31,9 +50,11 @@
                     <div class="top">
                         <span>
                             监测点越限占比:
-                            <span class="num">65%</span>
+                            <span class="num">
+                                {{ harmonicLineRatio == 3.14159 ? '暂无数据' : harmonicLineRatio + '%' }}
+                            </span>
                         </span>
-                        <el-select v-model="value" style="width: 120px" size="small">
+                        <el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small">
                             <el-option
                                 v-for="item in options"
                                 :key="item.value"
@@ -42,7 +63,7 @@
                             />
                         </el-select>
                     </div>
-                    <MyEChart :style="EchHeight" :options="WTCharts" />
+                    <MyEChart :style="EchHeight" :options="harmonicCharts" />
                 </div>
             </div>
             <!-- 暂态电能质量水平评价 -->
@@ -58,15 +79,10 @@
                     <div class="top">
                         <span>
                             暂态事件严重度:
-                            <span class="num">65%</span>
+                            <span class="num">{{ transientNum }}%</span>
                         </span>
-                        <el-select v-model="value" style="width: 120px" size="small">
-                            <el-option
-                                v-for="item in options1"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value"
-                            />
+                        <el-select v-model="value" style="width: 120px" size="small" @change="transientChange">
+                            <el-option v-for="item in options1" :key="item.id" :label="item.name" :value="item.id" />
                         </el-select>
                     </div>
                     <MyEChart :style="EchHeight" :options="WTCharts" />
@@ -148,7 +164,7 @@ import Evaluate from './details/evaluate.vue'
 import steadyState from './details/steadyState.vue'
 import temporaryState from './details/temporaryState.vue'
 import technique from './details/technique.vue'
-import DatePicker from '@/components/form/datePicker/index.vue'
+import { getAssessOverview, getEvaluationOverview, getEventLevelEvaluation } from '@/api/device-boot/panorama'
 const dictData = useDictData()
 const show = ref(false)
 const height = mainHeight(30)
@@ -156,10 +172,14 @@ const boxHeight: any = mainHeight(270, 3)
 const EchHeight: any = mainHeight(370, 3)
 const evaluateRef = ref()
 const steadyStateRef = ref()
-const datePickerRef = ref()
+const formRow: any = ref({})
 const temporaryStateRef = ref()
 const techniqueRef = ref()
 const options = ref([
+    {
+        label: '全指标',
+        value: '0'
+    },
     {
         label: '电压偏差',
         value: '1'
@@ -181,50 +201,14 @@ const options = ref([
         value: '5'
     }
 ])
-const options1 = ref([
-    {
-        label: '暂降',
-        value: '1'
-    },
-    {
-        label: '暂升',
-        value: '2'
-    },
-    {
-        label: '中断',
-        value: '3'
+const harmonicType = ref('0')
+const transientNum = ref(0)
+const options1: any = dictData.getBasicData('Event_Statis').filter(item => {
+    if (item.code == 'Voltage_Dip' || item.code == 'Voltage_Rise' || item.code == 'Short_Interruptions') {
+        return item
     }
-])
-const evaluate = ref([
-    {
-        name: '承德',
-        value: 5
-    },
-    {
-        name: '廊坊',
-        value: 5
-    },
-    {
-        name: '张家口',
-        value: 5
-    },
-    {
-        name: '秦皇岛',
-        value: 5
-    },
-    {
-        name: '唐山',
-        value: 5
-    },
-    {
-        name: '超高压',
-        value: 5
-    },
-    {
-        name: '风光储',
-        value: 5
-    }
-])
+})
+const assessList: any = ref([])
 const JDlist = ref([
     {
         name: '技术监督计划',
@@ -243,72 +227,150 @@ const JDlist = ref([
         value: 5
     }
 ])
-const WTCharts = ref({
-    xAxis: {
-        name: '%',
-        type: 'value',
-        max: 100
-    },
-    legend: {
-        show: false
-    },
-    yAxis: {
-        type: 'category',
-        data: ['承德', '廊坊', '唐山', '承德', '廊坊', '唐山']
-    },
-    grid: {
-        top: '10px',
-        left: '30px',
-        right: '30px',
-        bottom: '0px'
-    },
+const harmonicCharts = ref()
+const harmonicLineRatio: any = ref(0)
+const WTCharts = ref({})
 
-    options: {
-        dataZoom: null,
-        series: [
-            {
-                name: '占比',
-                type: 'bar',
-                data: [3, 4, 5, 3, 4, 5],
-                label: {
-                    show: true,
-                    position: 'right',
-                    fontSize: 12,
-                    formatter: function (params: any) {
-                        return `${params.value}%`
-                    }
-                }
-            }
-        ]
-    }
-})
-
-const value = ref('')
+const value = ref(options1[0].id)
 const open = (e: number) => {
     if (e == 0) {
-        evaluateRef.value.open()
+        evaluateRef.value.open(formRow.value)
     } else if (e == 1) {
-        steadyStateRef.value.open()
+        steadyStateRef.value.open(formRow.value)
     } else if (e == 2) {
-        temporaryStateRef.value.open()
+        temporaryStateRef.value.open(formRow.value)
     } else if (e == 3) {
-        techniqueRef.value.open()
+        techniqueRef.value.open(formRow.value)
     }
 }
 const info = (row: any) => {
     let form = {
+        ...row,
         id: row.orgNo,
         deptIndex: row.orgNo,
         orgId: row.orgNo,
         ids: [],
         statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0],
         isUpToGrid: row.isUpToGrid,
-        startTime: datePickerRef.value.timeValue[0],
-        searchBeginTime: datePickerRef.value.timeValue[0],
-        endTime: datePickerRef.value.timeValue[1],
-        searchEndTime: datePickerRef.value.timeValue[1],
-        type: datePickerRef.value.interval
+        monitorFlag: row.isUpToGrid
     }
+    formRow.value = form
+    // 综合评估
+    getAssessOverview(form).then(res => {
+        assessList.value = res.data
+    })
+    // 稳态电能质量水平评价概览数据
+    harmonicChange()
+    // 暂态统计详情
+    transientChange()
+}
+const harmonicChange = () => {
+    getEvaluationOverview({ ...formRow.value, harmonicType: harmonicType.value }).then(res => {
+        harmonicLineRatio.value = res.data.lineRatio
+
+        harmonicCharts.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    return params[0].name + ':' + (params[0].value == 3.14159 ? '暂无数据' : params[0].value) + '%<br/>'
+                }
+            },
+            xAxis: {
+                name: '%',
+                type: 'value',
+                max: 100
+            },
+            legend: {
+                show: false
+            },
+            yAxis: {
+                type: 'category',
+                data: res.data.childrenList.map((item: any) => item.deptName)
+            },
+            grid: {
+                top: '10px',
+                left: '30px',
+                right: '30px',
+                bottom: '0px'
+            },
+
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        name: '占比',
+                        type: 'bar',
+                        data: res.data.childrenList.map((item: any) => item.ratio),
+                        label: {
+                            show: true,
+                            position: 'right',
+                            fontSize: 12,
+                            formatter: function (params: any) {
+                                return `${params.value == 3.14159 ? '' : params.value}`
+                            }
+                        }
+                    }
+                ]
+            }
+        }
+    })
+}
+const transientChange = () => {
+    getEventLevelEvaluation({ ...formRow.value, ids: [value.value] }).then(res => {
+        let data = []
+        transientNum.value = 0
+        if (formRow.value.isUpToGrid == 0) {
+            data = res.data.info
+            transientNum.value = res.data.data
+        } else {
+            transientNum.value = res.data.gwData
+            data = res.data.gwInfo
+        }
+
+        WTCharts.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    return params[0].name + ':' + (params[0].value == 3.14159 ? '暂无数据' : params[0].value) + '%<br/>'
+                }
+            },
+            xAxis: {
+                name: '%',
+                type: 'value',
+                max: 100
+            },
+            legend: {
+                show: false
+            },
+            yAxis: {
+                type: 'category',
+                data: data.map((item: any) => item.orgName)
+            },
+            grid: {
+                top: '10px',
+                left: '30px',
+                right: '30px',
+                bottom: '0px'
+            },
+
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        name: '占比',
+                        type: 'bar',
+                        data: data.map((item: any) => item.count),
+                        label: {
+                            show: true,
+                            position: 'right',
+                            fontSize: 12,
+                            formatter: function (params: any) {
+                                return `${params.value}`
+                            }
+                        }
+                    }
+                ]
+            }
+        }
+    })
 }
 defineExpose({ info })
 </script>
@@ -316,8 +378,8 @@ defineExpose({ info })
 <style lang="scss" scoped>
 .boxLeft {
     background-color: #fff;
-    width: 400px;
-    padding: 10px;
+    width: 100%;
+    padding: 10px 0px 10px 10px;
     font-size: 13px;
     overflow: hidden;
 }
@@ -326,9 +388,9 @@ defineExpose({ info })
     // height: ;
     display: flex;
     justify-content: space-between;
-    font-weight: 550;
+    font-size: 16px;
     height: 22px;
-    line-height: 22px;
+    line-height: 23px;
     padding-left: 5px;
     width: 100%;
     background-image: linear-gradient(to right, #a4e5da, #fff);
@@ -348,6 +410,8 @@ defineExpose({ info })
     display: flex;
     justify-content: space-around;
     text-align: center;
+    overflow-x: auto;
+    overflow-y: hidden;
 }
 .boxR {
     border: 1px solid #ccc;
@@ -384,14 +448,17 @@ defineExpose({ info })
     cursor: pointer;
 }
 .show {
-    transition: all 0.3s ease;
     width: 0px;
-    padding: 0;
-    overflow: hidden;
+    transition: all 0.3s ease;
+    .boxLeft {
+        padding: 0;
+    }
 }
 .noshow {
-    width: 400px;
-    padding: 10px;
+    width: 25%;
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 10px 0px 10px 10px;
+    }
 }
 </style>
diff --git a/src/views/pqs/qualityInspeection/panorama/index.vue b/src/views/pqs/qualityInspeection/panorama/index.vue
index 92b003e2..14422a8e 100644
--- a/src/views/pqs/qualityInspeection/panorama/index.vue
+++ b/src/views/pqs/qualityInspeection/panorama/index.vue
@@ -1,6 +1,7 @@
 <template>
     <div class="default-main" :style="height">
         <div class="box">
+            <DatePicker ref="datePickerRef" style="display: none" />
             <el-form :inline="true" :model="form" class="demo-form-inline">
                 <el-form-item>
                     <el-input v-model="form.name" placeholder="请输入设备名称" :suffix-icon="Search">
@@ -49,11 +50,12 @@ import { mainHeight } from '@/utils/layout'
 import { Search, Refresh } from '@element-plus/icons-vue'
 import mapL from './components/mapL.vue'
 import mapR from './components/mapR.vue'
+import DatePicker from '@/components/form/datePicker/index.vue'
 const dictData = useDictData()
 defineOptions({
     name: '/panorama'
 })
-
+const datePickerRef = ref()
 const areaRef = ref()
 const mapLRef = ref()
 const mapRRef = ref()
@@ -67,7 +69,7 @@ const options: any = ref([
         id: 1
     }
 ])
-const form = ref({
+const form: any = ref({
     name: '',
     orgNo: dictData.state.area[0].id,
     isUpToGrid: 0
@@ -88,6 +90,16 @@ const reset = () => {
     info()
 }
 const info = () => {
+    // form.value.startTime = datePickerRef.value.timeValue[0]
+    // form.value.searchBeginTime = datePickerRef.value.timeValue[0]
+    // form.value.endTime = datePickerRef.value.timeValue[1]
+    // form.value.searchEndTime = datePickerRef.value.timeValue[1]
+    form.value.startTime = `2023-01-01`
+    form.value.searchBeginTime = `2023-01-01`
+    form.value.endTime = `2024-07-30`
+    form.value.searchEndTime = `2024-07-30`
+    form.value.type = datePickerRef.value.interval
+
     mapLRef.value.info(form.value)
     mapRRef.value.info(form.value)
 }