diff --git a/power.html b/power.html
index f5bfa2b..19a69e3 100644
--- a/power.html
+++ b/power.html
@@ -58,8 +58,8 @@
                     <el-col :span="6">
                         <module-one-1-1 label="监控概况" :amplify="false" name="amplify-xmkg">
                             <div class="project-number">
-                                <div>项目总数：<span v-cloak>{{100}}</span> 个</div>
-                                <div>在建项目数：<span v-cloak>{{86}}</span> 个</div>
+                                <div>监测设备<span v-cloak>{{block1.total}}</span> 个</div>
+                                <div>在线设备：<span v-cloak>{{block1.online}}</span> 个</div>
                             </div>
                             <div class="mon-over">
                                 <div class="mon-over-bg">
@@ -75,25 +75,29 @@
                                     <div class="mon-over-content-item one">
                                         <div class="mv-title">本日用电</div>
                                         <div>
-                                            <span class="mv-num">100.56</span><span class="mv-unit">w</span>
+                                            <span class="mv-num">{{block1.DailyElectricity}}</span><span
+                                                class="mv-unit">w</span>
                                         </div>
                                     </div>
                                     <div class="mon-over-content-item two">
                                         <div class="mv-title">本月用电</div>
                                         <div>
-                                            <span class="mv-num">100.56</span><span class="mv-unit">w</span>
+                                            <span class="mv-num">{{block1.MonthlyElectricity}}</span><span
+                                                class="mv-unit">w</span>
                                         </div>
                                     </div>
                                     <div class="mon-over-content-item one">
-                                        <div class="mv-title">本日用电</div>
+                                        <div class="mv-title">本月日均用电</div>
                                         <div>
-                                            <span class="mv-num">100.56</span><span class="mv-unit">w</span>
+                                            <span class="mv-num">{{block1.MonthAvgDailyElectricity}}</span><span
+                                                class="mv-unit">w</span>
                                         </div>
                                     </div>
                                     <div class="mon-over-content-item two">
-                                        <div class="mv-title">本月用电</div>
+                                        <div class="mv-title">本年日均用电</div>
                                         <div>
-                                            <span class="mv-num">100.56</span><span class="mv-unit">w</span>
+                                            <span class="mv-num">{{block1.YearAvgDailyElectricity}}</span><span
+                                                class="mv-unit">w</span>
                                         </div>
                                     </div>
                                 </div>
@@ -108,16 +112,21 @@
                                     <div :class="eleLoadSel==1?'active':''" @click="doEleLoadSel(1)">
                                         近七天
                                     </div>
-                                    <el-select v-model="eleLoadSelArea" placeholder="请选择" class="ele-load-area-sel"
-                                        style="width: 100px">
-                                        <el-option v-for="(item,idx) in eleLoadArea" :key="idx" :label="item"
-                                            :value="item">
+                                    <el-select :key="regionElKey" v-model="eleLoadSelArea" placeholder="请选择"
+                                        class="ele-load-area-sel" clearable @change="loadEleLoad" style="width: 100px">
+                                        <el-option v-for="(it,idx) in regions" :key="it.regionId" :label="it.regionName"
+                                            :value="it.regionId">
                                         </el-option>
                                     </el-select>
                                 </div>
-                                <div>
-                                    <power-chart id="eleLoadChart" className="ele-load-chart" width="100%"
+                                <div :key="block2.elKey">
+                                    <div v-if="!block2.datas || block2.datas.length==0" class="pw-no-data"
+                                        style="margin-top: 20px;">
+                                        暂无数据
+                                    </div>
+                                    <power-chart v-else id="eleLoadChart" className="ele-load-chart" width="100%"
                                         height="240px" :render="renderEleLoad" />
+
                                 </div>
                             </div>
                         </module-one-1-1>
@@ -131,23 +140,39 @@
                                         近七天
                                     </div>
                                     <el-select v-model="eleTrendSelArea" placeholder="请选择" class="ele-trend-area-sel"
-                                        style="width: 100px">
-                                        <el-option v-for="(item,idx) in eleLoadArea" :key="idx" :label="item"
-                                            :value="item">
+                                        style="width: 100px" @change="loadEleTrend" clearable>
+                                        <el-option v-for="(it,idx) in regions" :key="it.regionId" :label="it.regionName"
+                                            :value="it.regionId">
                                         </el-option>
                                     </el-select>
                                 </div>
                                 <div>
-                                    <power-chart id="ele-trendChart" className="ele-trend-chart" width="100%"
-                                        height="240px" :render="renderEleTrendSel" />
+                                    <div v-if="!block3.datas || block3.datas.length==0" class="pw-no-data"
+                                        style="margin-top: 20px;">
+                                        暂无数据
+                                    </div>
+                                    <power-chart v-else :key="block3.elKey" id="ele-trendChart"
+                                        className="ele-trend-chart" width="100%" height="240px"
+                                        :render="renderEleTrendSel" />
                                 </div>
                             </div>
                         </module-one-1-1>
                     </el-col>
                     <el-col :span="18">
                         <el-row>
-                            <el-col :span="16" style="height: 640px; margin-bottom: 20px" class="power-center">
-                                <module-two-2-2 label="场布图"> </module-two-2-2>
+                            <el-col :span="16" style="height: 640px; margin-bottom: 20px" class="power-center power-map">
+                                <module-two-2-2 label="场布图"> 
+                                    <div :style="'background-image:url('+mapInfo.url+')'" class="map-image">
+                                        <el-popover v-for="(it,idx) in mapInfo.regions"
+                                            placement="top-start"
+                                            title="标题"
+                                            width="200"
+                                            trigger="hover"
+                                            content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
+                                            <i slot="reference" class="el-icon-location map-location" :style="'top:'+it.y+'px;left:'+it.x+'px'"></i>
+                                        </el-popover>
+                                    </div>
+                                </module-two-2-2>
                             </el-col>
                             <el-col :span="8">
                                 <div style="padding: 10px">
@@ -158,92 +183,158 @@
                                         <el-col :span="8">
                                             <div class="time-study-value">
                                                 <p>今日报警数</p>
-                                                <div class="analyse-num"><span v-cloak v-html="100"></span>次</div>
+                                                <div class="analyse-num"><span v-cloak
+                                                        v-html="block6.todayWarningCount"></span>次</div>
                                             </div>
                                             <div class="time-study-value">
                                                 <p>本周报警数</p>
-                                                <div class="analyse-num"><span v-cloak v-html="2000"></span> 次</div>
+                                                <div class="analyse-num"><span v-cloak
+                                                        v-html="block6.monthWarningCount"></span> 次</div>
                                             </div>
                                         </el-col>
                                         <el-col :span="16" class="warning-list">
-                                            <div v-for="(it,idx) in warningData" class="warning-item" :key="idx">
+                                            <div v-for="(it,idx) in block6.typeWarningList" class="warning-item"
+                                                :key="idx">
                                                 <div class="warning-text">
-                                                 <i class="el-icon-caret-top"></i>
-                                                 <span class="w-title">{{it.title}}</span>
-                                                 <span class="w-data"><span>{{it.count}}</span>次</span>
+                                                    <i class="el-icon-caret-top"></i>
+                                                    <span class="w-title">{{it.title}}</span>
+                                                    <span class="w-data"><span>{{it.count}}</span>次</span>
                                                 </div>
                                                 <div class="warning-chart">
-                                                    <div class="w-chart-bg">                                                       
-                                                    <div class="w-chart-prc" :style="'width:'+(it.w)+'%'"></div>
-                                                </div>
-                                            </div>
-                                            </div>
-                                        </el-col>
-                                            </el-row>
-                                    <div class="analyse-title" style="margin-top: 40px;">
-                                        <div class="analyse-text">正在发生</div>
-                                        
-                                    </div>
-                                    <div v-if="warningList==null||warningList.length==0" class="not-data">暂无预警数据</div>
-                                        <div id="warnListDiv" class="warn-list scroll" @mouseout="listMinMouseoutType"  @mouseover="listMinMouseoverType">
-                                            <div :class="warningTypeIndex==idx?'active':''" v-for="(it,idx) in warningList" :key="idx" class="warn-item">
-                                                <div class="warn-item-title">{{it.type=="t1"?'断相':it.type=="t2"?"电压不平衡":it.type=="t3"?"失流":"失压"}}</div>
-                                                <div class="w-c-row1">
-                                                    <div class="w-c-bg">
-                                                        <svg v-if="it.type=='t1'" class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6371"><path d="M0 1024V0h1024v1024z m69.12-439.296v326.656a44.544 44.544 0 0 0 45.056 45.056H911.36c37.376 0 45.056-7.68 45.056-44.544v-302.08-25.6h-202.752v-68.096h204.8V112.128a44.544 44.544 0 0 0-44.544-44.544H113.152c-38.4 0-45.568 7.168-45.568 46.592V517.12h232.448a124.928 124.928 0 0 0 48.64-11.264c127.488-58.368 256-118.272 384-178.688l28.16 61.44c-15.872 8.192-26.624 13.312-41.472 19.456a2494.976 2494.976 0 0 0-233.472 111.104 512 512 0 0 1-307.2 66.56c-34.816-4.096-71.68-1.024-109.568-1.024z" p-id="6372"></path></svg>
-                                                        <svg v-if="it.type=='t2'" class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7515"><path d="M773.743 804.865c-21.478 0-40.363-9.873-56.134-29.344-11.993-14.809-21.051-33.447-29.81-51.473-16.783-34.536-29.202-57.174-48.168-57.174-18.963 0-31.382 22.638-48.163 57.173-8.76 18.025-17.816 36.664-29.81 51.473-15.77 19.472-34.655 29.345-56.132 29.345-21.477 0-40.362-9.873-56.132-29.345-11.993-14.808-21.05-33.447-29.809-51.472-16.782-34.536-29.201-57.174-48.165-57.174-18.963 0-31.382 22.638-48.164 57.173-8.759 18.025-17.815 36.664-29.809 51.473-15.769 19.472-34.655 29.345-56.131 29.345s-40.362-9.873-56.131-29.345c-11.993-14.809-21.049-33.447-29.808-51.473-16.781-34.535-29.2-57.173-48.163-57.173v-42c21.477 0 40.362 9.873 56.131 29.345 11.993 14.809 21.049 33.447 29.808 51.473 16.781 34.535 29.2 57.173 48.163 57.173s31.382-22.638 48.164-57.173c8.759-18.025 17.815-36.664 29.809-51.473 15.769-19.472 34.655-29.345 56.131-29.345 21.477 0 40.363 9.873 56.132 29.345 11.993 14.809 21.05 33.447 29.809 51.473 16.782 34.535 29.201 57.173 48.165 57.173s31.383-22.638 48.165-57.174c8.759-18.025 17.815-36.664 29.808-51.472 15.77-19.472 34.655-29.345 56.132-29.345 21.478 0 40.363 9.873 56.134 29.344 11.993 14.809 21.051 33.447 29.81 51.473 16.783 34.536 29.202 57.174 48.168 57.174s31.385-22.638 48.168-57.174c8.759-18.025 17.816-36.664 29.81-51.473 15.77-19.471 34.655-29.344 56.133-29.344v42c-18.965 0-31.384 22.638-48.167 57.173-8.759 18.025-17.816 36.665-29.81 51.474-15.771 19.471-34.657 29.344-56.134 29.344zM773.743 552.779c-21.478 0-40.363-9.873-56.134-29.344-11.993-14.809-21.051-33.448-29.81-51.473-16.783-34.536-29.202-57.173-48.168-57.173-18.963 0-31.382 22.637-48.163 57.173-8.76 18.025-17.816 36.664-29.81 51.473-15.77 19.472-34.655 29.345-56.132 29.345-21.477 0-40.362-9.873-56.132-29.345-11.993-14.808-21.05-33.447-29.809-51.472-16.782-34.536-29.201-57.173-48.165-57.173-18.963 0-31.382 22.637-48.164 57.173-8.759 18.025-17.815 36.664-29.809 51.472-15.769 19.472-34.655 29.345-56.131 29.345s-40.362-9.873-56.131-29.345c-11.993-14.808-21.049-33.447-29.808-51.472-16.781-34.536-29.2-57.173-48.163-57.173v-42c21.477 0 40.362 9.873 56.131 29.345 11.993 14.808 21.049 33.447 29.808 51.472 16.781 34.536 29.2 57.173 48.163 57.173s31.382-22.637 48.164-57.173c8.759-18.025 17.815-36.664 29.809-51.472 15.769-19.472 34.655-29.345 56.131-29.345 21.477 0 40.363 9.873 56.132 29.344 11.993 14.809 21.05 33.448 29.809 51.473 16.782 34.536 29.201 57.173 48.165 57.173s31.383-22.638 48.165-57.173c8.759-18.025 17.815-36.664 29.808-51.473 15.77-19.471 34.655-29.344 56.132-29.344 21.478 0 40.363 9.873 56.134 29.344 11.993 14.808 21.051 33.447 29.81 51.473 16.783 34.536 29.202 57.173 48.168 57.173s31.385-22.638 48.168-57.174c8.759-18.025 17.816-36.664 29.81-51.473 15.77-19.471 34.655-29.344 56.133-29.344v42c-18.965 0-31.384 22.637-48.167 57.173-8.759 18.025-17.816 36.664-29.81 51.473-15.771 19.471-34.657 29.344-56.134 29.344z" fill="#040000" p-id="7516"></path><path d="M820.635 339.512l-62.4-174.578h38.227l44.18 129.207 42.752-129.207h37.393l-62.52 174.578h-37.632z"  p-id="7517"></path></svg>
-                                                        <svg v-if="it.type=='t3'" class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10342"><path d="M796.444 924.444v33.195a66.36 66.36 0 0 1-66.36 66.361H293.916a66.36 66.36 0 0 1-66.36-66.36v-33.196h-45.74A124.928 124.928 0 0 1 56.89 799.516V124.928A124.928 124.928 0 0 1 181.817 0h660.366a124.928 124.928 0 0 1 124.928 124.928v674.588a124.928 124.928 0 0 1-124.928 124.928h-45.739zM181.817 85.334a39.595 39.595 0 0 0-39.595 39.594v674.588a39.595 39.595 0 0 0 39.595 39.595h660.366a39.595 39.595 0 0 0 39.595-39.595V124.928a39.595 39.595 0 0 0-39.595-39.595H181.817zM413.81 481.578l-62.663 89.301H225.678v-56.889h95.886l99.84-142.222 102.585 199.95 76.743-134.741 54.756 109.824h171.278v56.889H620.288l-22.898-45.91-76.018 133.462L413.81 481.607zM629.675 199.11l-42.966 65.678h81.735L535.552 412.444l48.398-102.5h-57.728l40.676-110.833h62.777z" p-id="10343"></path></svg>
-                                                        <svg v-if="it.type=='t4'" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11150" class="icon" style="width: 1em; height: 1em; vertical-align: middle; fill: currentcolor; overflow: hidden;"><path d="M512 768c143.4 0 256 56.3 256 128s-112.6 128-256 128-256-56.3-256-128 112.6-128 256-128z" fill="#F4A214" opacity=".25" p-id="11151" style=""></path><path d="M512 853.5c71.7 0 128 18.9 128 42.5s-56.3 42.5-128 42.5-128-18.9-128-42.5 56.3-42.5 128-42.5z" fill="#F4A214" opacity=".502" p-id="11152"></path><path d="M800.8 217.1c45.6 116.7 14.3 249.9-78.3 334.3L512 917.5 297 546.8c-90.6-86.5-118.8-220.2-70.7-335.9C292.9 52.7 475.1-21 632.8 46.1c76.8 32.2 137.2 93.7 168 171z" fill="#F4A214" p-id="11153" style="
-                                                            fill: transparent !important;">
-                                                        </path><path d="M512 0h3.6c66 0.5 130.6 21 184.8 58.4 54.3 36.9 96.3 89.6 119.8 151 48.1 123.9 16.4 264.7-81.4 355.8L512 960 280.1 560.1c-129-125.4-131.6-331.3-6.1-459.8 16.4-16.9 34.8-31.7 54.3-45.1C382.5 18.9 446.5 0 512 0z m0 874.5l193.5-336.9 2.6-2C823.3 430.1 831.5 251.4 726 136.2c-14.8-16.4-31.7-30.7-49.7-43-97.8-66.6-225.8-67.6-324.6-2.6-47.1 31.2-84.5 75.8-106 128-44.5 107.5-18.4 231.9 66 312.3l2 2L512 874.5z" fill="#FFFFFF" p-id="11154"></path><path d="M256 341.5c0-141.3 114.7-256 256-256s256 114.7 256 256-114.7 256-256 256-256-114.7-256-256z m469.5 0C725.5 223.7 629.8 128 512 128s-213.5 95.7-213.5 213.5 95.7 213 213.5 213 213.5-95.2 213.5-213z" fill="#FFFFFF" p-id="11155"></path><path d="M648.2 199.4v28.2H424.7v72.2c-1.2 73.4-12.3 131.9-33.2 175.5l-22.3-19.8c16.7-37.2 25.4-89.1 26-155.6V199.4h253z m-208 105h83.1v-59.2h29.1v59.2h86.5v28.8h-86.5v101.1H656v28.8H423.5v-28.8h99.8v-101h-83.1v-28.9z m154.4 41.9c17.2 24 30.6 45.2 40.3 63.6l-23.6 16.4c-9.5-19-22.7-40.8-39.7-65.4l23-14.6z" fill="#FFFFFF" p-id="11156"></path><path d="M693.4 376c-61 0-110.4 49.2-110.4 110s49.4 110 110.4 110S803 546.8 803 486s-49.5-110-109.6-110z" fill="#FFFFFF" p-id="11157" style="
-                                                            fill: transparent !important;">
-                                                        </path>
-                                                        <path d="M693.4 376c60.1 0 109.6 49.2 109.6 110s-48.6 110-109.6 110S583 546.8 583 486s49.4-110 110.4-110m0-18c-34.3 0-66.5 13.3-90.8 37.5-24.3 24.1-37.6 56.3-37.6 90.5s13.4 66.4 37.6 90.5c24.3 24.2 56.5 37.5 90.8 37.5s66.4-13.3 90.4-37.5c23.9-24.1 37.1-56.2 37.1-90.5 0.1-70.6-57.1-128-127.5-128z" fill="#F4A214" p-id="11158"></path>
-                                                        <path d="M707.3 495.1c11.3 24.6 31.8 41.3 63.2 48.1-3.2 3.4-7.9 9.9-9.9 14.1-32.6-8.6-53-26.6-65.8-54.4-8.3 21.9-26.6 41.6-65.3 54.3-1.8-3.6-6.2-10-9.6-13 36.8-12 53.3-29.6 60.4-49.1h-58v-15.2h61.9c1.1-7 1.5-14.1 1.5-21.1v-7.9h-34c-4.5 9.1-9.6 17-14.7 23.3-3.1-2.4-10.5-6.2-14.4-7.9 12-13.1 21.7-34.3 27.4-55.6l15.9 3.4c-2.1 7.3-4.5 14.6-7.5 21.5h27.4v-27.1h15.7v27.1h51.4v15.2h-51.4v8.1c0 7-0.3 13.9-1.1 20.9h65.9V495h-59z" p-id="11159"></path>
-                                                    </svg></div>
-                                                    <div style="margin-left: 10px;">
-                                                        <div class="w-c-row1-t">{{it.title}}</div>
-                                                        <div  class="w-c-row1-date">{{toDateTime(it.date)}}</div>
+                                                    <div class="w-chart-bg">
+                                                        <div class="w-chart-prc" :style="'width:'+(it.w)+'%'"></div>
                                                     </div>
                                                 </div>
-                                                <div class="w-c-row2">
-                                                    <div><span class="w-c-row2-l">区域:</span><span class="w-c-row2-t" :title="it.area">{{it.area}}</span></div>
-                                                    <div><span class="w-c-row2-l">地点:</span><span class="w-c-row2-t" :title="it.addr">{{it.addr}}</span></div>
+                                            </div>
+                                        </el-col>
+                                    </el-row>
+                                    <div class="analyse-title" style="margin-top: 40px;">
+                                        <div class="analyse-text">正在发生</div>
+
+                                    </div>
+                                    <div v-if="warningList==null||warningList.length==0" class="not-data">暂无预警数据</div>
+                                    <div id="warnListDiv" class="warn-list scroll" @mouseout="listMinMouseoutType"
+                                        @mouseover="listMinMouseoverType">
+                                        <div :class="warningTypeIndex==idx?'active':''"
+                                            v-for="(it,idx) in block6.warningList" :key="idx" class="warn-item">
+                                            <div class="warn-item-title">
+                                                {{it.type=="t1"?'断相':it.type=="t2"?"电压不平衡":it.type=="t3"?"失流":"失压"}}
+                                            </div>
+                                            <div class="w-c-row1">
+                                                <div class="w-c-bg">
+                                                    <svg v-if="it.type=='t1'" class="icon"
+                                                        style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;"
+                                                        viewBox="0 0 1024 1024" version="1.1"
+                                                        xmlns="http://www.w3.org/2000/svg" p-id="6371">
+                                                        <path
+                                                            d="M0 1024V0h1024v1024z m69.12-439.296v326.656a44.544 44.544 0 0 0 45.056 45.056H911.36c37.376 0 45.056-7.68 45.056-44.544v-302.08-25.6h-202.752v-68.096h204.8V112.128a44.544 44.544 0 0 0-44.544-44.544H113.152c-38.4 0-45.568 7.168-45.568 46.592V517.12h232.448a124.928 124.928 0 0 0 48.64-11.264c127.488-58.368 256-118.272 384-178.688l28.16 61.44c-15.872 8.192-26.624 13.312-41.472 19.456a2494.976 2494.976 0 0 0-233.472 111.104 512 512 0 0 1-307.2 66.56c-34.816-4.096-71.68-1.024-109.568-1.024z"
+                                                            p-id="6372"></path>
+                                                    </svg>
+                                                    <svg v-if="it.type=='t2'" class="icon"
+                                                        style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;"
+                                                        viewBox="0 0 1024 1024" version="1.1"
+                                                        xmlns="http://www.w3.org/2000/svg" p-id="7515">
+                                                        <path
+                                                            d="M773.743 804.865c-21.478 0-40.363-9.873-56.134-29.344-11.993-14.809-21.051-33.447-29.81-51.473-16.783-34.536-29.202-57.174-48.168-57.174-18.963 0-31.382 22.638-48.163 57.173-8.76 18.025-17.816 36.664-29.81 51.473-15.77 19.472-34.655 29.345-56.132 29.345-21.477 0-40.362-9.873-56.132-29.345-11.993-14.808-21.05-33.447-29.809-51.472-16.782-34.536-29.201-57.174-48.165-57.174-18.963 0-31.382 22.638-48.164 57.173-8.759 18.025-17.815 36.664-29.809 51.473-15.769 19.472-34.655 29.345-56.131 29.345s-40.362-9.873-56.131-29.345c-11.993-14.809-21.049-33.447-29.808-51.473-16.781-34.535-29.2-57.173-48.163-57.173v-42c21.477 0 40.362 9.873 56.131 29.345 11.993 14.809 21.049 33.447 29.808 51.473 16.781 34.535 29.2 57.173 48.163 57.173s31.382-22.638 48.164-57.173c8.759-18.025 17.815-36.664 29.809-51.473 15.769-19.472 34.655-29.345 56.131-29.345 21.477 0 40.363 9.873 56.132 29.345 11.993 14.809 21.05 33.447 29.809 51.473 16.782 34.535 29.201 57.173 48.165 57.173s31.383-22.638 48.165-57.174c8.759-18.025 17.815-36.664 29.808-51.472 15.77-19.472 34.655-29.345 56.132-29.345 21.478 0 40.363 9.873 56.134 29.344 11.993 14.809 21.051 33.447 29.81 51.473 16.783 34.536 29.202 57.174 48.168 57.174s31.385-22.638 48.168-57.174c8.759-18.025 17.816-36.664 29.81-51.473 15.77-19.471 34.655-29.344 56.133-29.344v42c-18.965 0-31.384 22.638-48.167 57.173-8.759 18.025-17.816 36.665-29.81 51.474-15.771 19.471-34.657 29.344-56.134 29.344zM773.743 552.779c-21.478 0-40.363-9.873-56.134-29.344-11.993-14.809-21.051-33.448-29.81-51.473-16.783-34.536-29.202-57.173-48.168-57.173-18.963 0-31.382 22.637-48.163 57.173-8.76 18.025-17.816 36.664-29.81 51.473-15.77 19.472-34.655 29.345-56.132 29.345-21.477 0-40.362-9.873-56.132-29.345-11.993-14.808-21.05-33.447-29.809-51.472-16.782-34.536-29.201-57.173-48.165-57.173-18.963 0-31.382 22.637-48.164 57.173-8.759 18.025-17.815 36.664-29.809 51.472-15.769 19.472-34.655 29.345-56.131 29.345s-40.362-9.873-56.131-29.345c-11.993-14.808-21.049-33.447-29.808-51.472-16.781-34.536-29.2-57.173-48.163-57.173v-42c21.477 0 40.362 9.873 56.131 29.345 11.993 14.808 21.049 33.447 29.808 51.472 16.781 34.536 29.2 57.173 48.163 57.173s31.382-22.637 48.164-57.173c8.759-18.025 17.815-36.664 29.809-51.472 15.769-19.472 34.655-29.345 56.131-29.345 21.477 0 40.363 9.873 56.132 29.344 11.993 14.809 21.05 33.448 29.809 51.473 16.782 34.536 29.201 57.173 48.165 57.173s31.383-22.638 48.165-57.173c8.759-18.025 17.815-36.664 29.808-51.473 15.77-19.471 34.655-29.344 56.132-29.344 21.478 0 40.363 9.873 56.134 29.344 11.993 14.808 21.051 33.447 29.81 51.473 16.783 34.536 29.202 57.173 48.168 57.173s31.385-22.638 48.168-57.174c8.759-18.025 17.816-36.664 29.81-51.473 15.77-19.471 34.655-29.344 56.133-29.344v42c-18.965 0-31.384 22.637-48.167 57.173-8.759 18.025-17.816 36.664-29.81 51.473-15.771 19.471-34.657 29.344-56.134 29.344z"
+                                                            fill="#040000" p-id="7516"></path>
+                                                        <path
+                                                            d="M820.635 339.512l-62.4-174.578h38.227l44.18 129.207 42.752-129.207h37.393l-62.52 174.578h-37.632z"
+                                                            p-id="7517"></path>
+                                                    </svg>
+                                                    <svg v-if="it.type=='t3'" class="icon"
+                                                        style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;"
+                                                        viewBox="0 0 1024 1024" version="1.1"
+                                                        xmlns="http://www.w3.org/2000/svg" p-id="10342">
+                                                        <path
+                                                            d="M796.444 924.444v33.195a66.36 66.36 0 0 1-66.36 66.361H293.916a66.36 66.36 0 0 1-66.36-66.36v-33.196h-45.74A124.928 124.928 0 0 1 56.89 799.516V124.928A124.928 124.928 0 0 1 181.817 0h660.366a124.928 124.928 0 0 1 124.928 124.928v674.588a124.928 124.928 0 0 1-124.928 124.928h-45.739zM181.817 85.334a39.595 39.595 0 0 0-39.595 39.594v674.588a39.595 39.595 0 0 0 39.595 39.595h660.366a39.595 39.595 0 0 0 39.595-39.595V124.928a39.595 39.595 0 0 0-39.595-39.595H181.817zM413.81 481.578l-62.663 89.301H225.678v-56.889h95.886l99.84-142.222 102.585 199.95 76.743-134.741 54.756 109.824h171.278v56.889H620.288l-22.898-45.91-76.018 133.462L413.81 481.607zM629.675 199.11l-42.966 65.678h81.735L535.552 412.444l48.398-102.5h-57.728l40.676-110.833h62.777z"
+                                                            p-id="10343"></path>
+                                                    </svg>
+                                                    <svg v-if="it.type=='t4'" viewBox="0 0 1024 1024" version="1.1"
+                                                        xmlns="http://www.w3.org/2000/svg" p-id="11150" class="icon"
+                                                        style="width: 1em; height: 1em; vertical-align: middle; fill: currentcolor; overflow: hidden;">
+                                                        <path
+                                                            d="M512 768c143.4 0 256 56.3 256 128s-112.6 128-256 128-256-56.3-256-128 112.6-128 256-128z"
+                                                            fill="#F4A214" opacity=".25" p-id="11151" style=""></path>
+                                                        <path
+                                                            d="M512 853.5c71.7 0 128 18.9 128 42.5s-56.3 42.5-128 42.5-128-18.9-128-42.5 56.3-42.5 128-42.5z"
+                                                            fill="#F4A214" opacity=".502" p-id="11152"></path>
+                                                        <path
+                                                            d="M800.8 217.1c45.6 116.7 14.3 249.9-78.3 334.3L512 917.5 297 546.8c-90.6-86.5-118.8-220.2-70.7-335.9C292.9 52.7 475.1-21 632.8 46.1c76.8 32.2 137.2 93.7 168 171z"
+                                                            fill="#F4A214" p-id="11153" style="
+                                                            fill: transparent !important;">
+                                                        </path>
+                                                        <path
+                                                            d="M512 0h3.6c66 0.5 130.6 21 184.8 58.4 54.3 36.9 96.3 89.6 119.8 151 48.1 123.9 16.4 264.7-81.4 355.8L512 960 280.1 560.1c-129-125.4-131.6-331.3-6.1-459.8 16.4-16.9 34.8-31.7 54.3-45.1C382.5 18.9 446.5 0 512 0z m0 874.5l193.5-336.9 2.6-2C823.3 430.1 831.5 251.4 726 136.2c-14.8-16.4-31.7-30.7-49.7-43-97.8-66.6-225.8-67.6-324.6-2.6-47.1 31.2-84.5 75.8-106 128-44.5 107.5-18.4 231.9 66 312.3l2 2L512 874.5z"
+                                                            fill="#FFFFFF" p-id="11154"></path>
+                                                        <path
+                                                            d="M256 341.5c0-141.3 114.7-256 256-256s256 114.7 256 256-114.7 256-256 256-256-114.7-256-256z m469.5 0C725.5 223.7 629.8 128 512 128s-213.5 95.7-213.5 213.5 95.7 213 213.5 213 213.5-95.2 213.5-213z"
+                                                            fill="#FFFFFF" p-id="11155"></path>
+                                                        <path
+                                                            d="M648.2 199.4v28.2H424.7v72.2c-1.2 73.4-12.3 131.9-33.2 175.5l-22.3-19.8c16.7-37.2 25.4-89.1 26-155.6V199.4h253z m-208 105h83.1v-59.2h29.1v59.2h86.5v28.8h-86.5v101.1H656v28.8H423.5v-28.8h99.8v-101h-83.1v-28.9z m154.4 41.9c17.2 24 30.6 45.2 40.3 63.6l-23.6 16.4c-9.5-19-22.7-40.8-39.7-65.4l23-14.6z"
+                                                            fill="#FFFFFF" p-id="11156"></path>
+                                                        <path
+                                                            d="M693.4 376c-61 0-110.4 49.2-110.4 110s49.4 110 110.4 110S803 546.8 803 486s-49.5-110-109.6-110z"
+                                                            fill="#FFFFFF" p-id="11157" style="
+                                                            fill: transparent !important;">
+                                                        </path>
+                                                        <path
+                                                            d="M693.4 376c60.1 0 109.6 49.2 109.6 110s-48.6 110-109.6 110S583 546.8 583 486s49.4-110 110.4-110m0-18c-34.3 0-66.5 13.3-90.8 37.5-24.3 24.1-37.6 56.3-37.6 90.5s13.4 66.4 37.6 90.5c24.3 24.2 56.5 37.5 90.8 37.5s66.4-13.3 90.4-37.5c23.9-24.1 37.1-56.2 37.1-90.5 0.1-70.6-57.1-128-127.5-128z"
+                                                            fill="#F4A214" p-id="11158"></path>
+                                                        <path
+                                                            d="M707.3 495.1c11.3 24.6 31.8 41.3 63.2 48.1-3.2 3.4-7.9 9.9-9.9 14.1-32.6-8.6-53-26.6-65.8-54.4-8.3 21.9-26.6 41.6-65.3 54.3-1.8-3.6-6.2-10-9.6-13 36.8-12 53.3-29.6 60.4-49.1h-58v-15.2h61.9c1.1-7 1.5-14.1 1.5-21.1v-7.9h-34c-4.5 9.1-9.6 17-14.7 23.3-3.1-2.4-10.5-6.2-14.4-7.9 12-13.1 21.7-34.3 27.4-55.6l15.9 3.4c-2.1 7.3-4.5 14.6-7.5 21.5h27.4v-27.1h15.7v27.1h51.4v15.2h-51.4v8.1c0 7-0.3 13.9-1.1 20.9h65.9V495h-59z"
+                                                            p-id="11159"></path>
+                                                    </svg>
+                                                </div>
+                                                <div style="margin-left: 10px;">
+                                                    <div class="w-c-row1-t">{{it.title}}</div>
+                                                    <div class="w-c-row1-date">{{toDateTime(it.timeStamp)}}</div>
                                                 </div>
                                             </div>
+                                            <div class="w-c-row2">
+                                                <div><span class="w-c-row2-l">区域:</span><span class="w-c-row2-t"
+                                                        :title="it.region">{{it.region}}</span></div>
+                                                <div><span class="w-c-row2-l">地点:</span><span class="w-c-row2-t"
+                                                        :title="it.address">{{it.address}}</span></div>
+                                            </div>
                                         </div>
+                                    </div>
                                 </div>
                             </el-col>
                         </el-row>
                         <el-row>
                             <el-col :span="8">
                                 <module-one-1-1 label="电流趋势">
-                                <div class="warning-info current-trend">
-                                    <div class="current-trend-title warning-info-title">
-                                        <div :class="currentTrendSel==0?'active':''" @click="doCurrentTrendSel(0)">
-                                            今日
+                                    <div class="warning-info current-trend">
+                                        <div class="current-trend-title warning-info-title">
+                                            <div :class="currentTrendSel==0?'active':''" @click="doCurrentTrendSel(0)">
+                                                今日
+                                            </div>
+                                            <div :class="currentTrendSel==1?'active':''" @click="doCurrentTrendSel(1)">
+                                                近七天
+                                            </div>
+                                            <el-select v-model="currentTrendSelArea" placeholder="请选择"
+                                                class="current-trend-area-sel" style="width: 100px"
+                                                @change="loadCurrentTrend" clearable>
+                                                <el-option v-for="(it,idx) in regions" :key="it.regionId"
+                                                    :label="it.regionName" :value="it.regionId">
+                                            </el-select>
                                         </div>
-                                        <div :class="currentTrendSel==1?'active':''" @click="doCurrentTrendSel(1)">
-                                            近七天
+                                        <div>
+                                            <div v-if="!block4.datas || block4.datas.length==0" class="pw-no-data"
+                                                style="margin-top: 20px;">
+                                                暂无数据
+                                            </div>
+                                            <power-chart v-else :key="block4.elKey" id="current-trendChart"
+                                                className="current-trend-chart" width="100%" height="240px"
+                                                :render="renderCurrentTrendSel" />
                                         </div>
-                                        <el-select v-model="currentTrendSelArea" placeholder="请选择" class="current-trend-area-sel"
-                                            style="width: 100px">
-                                            <el-option v-for="(item,idx) in currentLoadArea" :key="idx" :label="item"
-                                                :value="item">
-                                            </el-option>
-                                        </el-select>
                                     </div>
-                                    <div>
-                                        <power-chart id="current-trendChart" className="current-trend-chart" width="100%"
-                                            height="240px" :render="renderCurrentTrendSel" />
-                                    </div>
-                                </div>
-                            </module-one-1-1>
+                                </module-one-1-1>
                             </el-col>
                             <el-col :span="16">
                                 <module-one-1-2 label="区域用电趋势">
                                     <power-chart id="area-ele-trendChart" className="area-ele-trend-chart" width="100%"
-                                        height="300px" :render="renderAreaEleTrendSel" />    
+                                        height="300px" :render="renderAreaEleTrendSel" />
                                 </module-one-1-2>
                             </el-col>
                         </el-row>
@@ -278,86 +369,423 @@
 <!-- 请求依赖 -->
 <script src="https://cdn.makalu.cc/js/axios/axios.min.js"></script>
 <script>
-    let requestUrl =
-        "https://jzgj.crfeb.com.cn/largeScreen/digitalConstruction/";
-    let deptId = 131;
+    var mapDatas = [
+        {
+            projectId: 3,
+            url: './power/prj3.png',
+            regions: [
+                {
+                    "regionId": 1,
+                    "regionName": "区域1",
+                    x:400,
+                    y:300
+                },
+                {
+                    "regionId": 2,
+                    "regionName": "区域1245",
+                    x:470,
+                    y:490
+                },
+                {
+                    "regionId": 3,
+                    "regionName": "区域2",
+                    x:770,
+                    y:160
+                }
+            ]
+        }
+    ]
+</script>
+<script>
+    let baseUrl = 'https://aqzg-t.makalu.cc';
+    let projectId = 3;
+    let regionId = 1;
     var vm = new Vue({
         el: "#app",
         data() {
             return {
+                mapInfo:null,
                 eleLoadSel: 0,
-                eleLoadArea: ["全部区域", "区域A", "区域B", "区域C"],
+                regions: [],
+                regionElKey: 0,
                 eleLoadSelArea: "",
                 eleTrendSel: "",
                 eleTrendSelArea: "",
                 currentTrendSel: "",
                 currentTrendSelArea: "",
-                warningData:[
-                    {title:'断相',count:10,w:0},
-                    {title:'电压不平衡',count:12,w:0},
-                    {title:'失流',count:15,w:0},
-                    {title:'失压',count:18,w:0},
-                ],
-                warningList:[
-                    {type:'t1', title:'当前区域断相',date:new Date(),area:'区域A',addr:'3号线2期-5分部-工区西场地-广州市荔湾区华飞捷诚汽车服务中心-停车场 '},
-                    {type:'t2', title:'当前区域电压不平衡',date:new Date(),area:'区域B',addr:'3号线2期-5分部-工区西场地-广州市荔湾区'},
-                    {type:'t3', title:'当前区域失流',date:new Date(),area:'区域C',addr:'3号线2期-5分部-工区西场地-广州市荔湾区'},
-                    {type:'t4', title:'当前区域失压',date:new Date(),area:'区域D',addr:'3号线2期-5分部-工区西场地-广州市荔湾区'},
+                block1: {
+                    total: 0,
+                    online: 0,
+                    DailyElectricity: 0,
+                    MonthlyElectricity: 0,
+                    MonthAvgDailyElectricity: 0,
+                    YearAvgDailyElectricity: 0,
+                },
+                block2: {
+                    elKey: 0,
+                    titles: [],
+                    datas: [],
+                    rotate: 0
+                },
+                block3: {
+                    elKey: 0,
+                    areas: [],
+                    titles: [],
+                    datas: [],
+                    rotate: 0
+                },
+                block4: {
+                    elKey: 0,
+                    max: 0,
+                    titles: [],
+                    datas: [],
+                    rotate: 0
+                },
+                block5: {
+                    elKey: 0,
+                    areas: [],
+                    titles: [],
+                    datas: [],
+                    rotate: 0
+                },
+                block6: {
+                    todayWarningCount: 0,
+                    monthWarningCount: 0,
+                    typeWarningList: [],
+                    warningList: []
+                },
+                warningList: [
+                    { type: 't1', title: '当前区域断相', date: new Date(), area: '区域A', addr: '3号线2期-5分部-工区西场地-广州市荔湾区华飞捷诚汽车服务中心-停车场 ' },
+                    { type: 't2', title: '当前区域电压不平衡', date: new Date(), area: '区域B', addr: '3号线2期-5分部-工区西场地-广州市荔湾区' },
+                    { type: 't3', title: '当前区域失流', date: new Date(), area: '区域C', addr: '3号线2期-5分部-工区西场地-广州市荔湾区' },
+                    { type: 't4', title: '当前区域失压', date: new Date(), area: '区域D', addr: '3号线2期-5分部-工区西场地-广州市荔湾区' },
                 ],
                 //报警分析
-                warningTypeInterval:undefined,
-                warningTypeIndex:0,
-                
+                warningTypeInterval: undefined,
+                warningTypeIndex: 0,
+
             };
         },
 
         created() {
             //预警类型 定时器
-            this.warningTypeInterval = setInterval(this.automaticRollType,5000);
+            this.warningTypeInterval = setInterval(this.automaticRollType, 1000 * 60);
+            this.loadRegions();
+            this.loadMap();
             this.init();
         },
-        
+
         methods: {
-             //报警类型
-             automaticRollType(){
+            loadMap(){
+                let maps=mapDatas.filter(d=>d.projectId==projectId);
+                this.mapInfo=maps.length>0?maps[0]:null;
+            },
+            loadRegions() {
+                let url = '/api/device/smart_meter/region_information';
+                this.post(url, { projectId: projectId }).then(d => {
+                    this.regions = d.data?.data || [];
+                    this.regionElKey++;
+                });
+            },
+            //报警类型
+            automaticRollType() {
                 var height = $("#warnListDiv .warn-item").innerHeight()
-                if($("#warnListDiv").scrollTop() == height*this.warningList.length - $("#warnListDiv").innerHeight()){
+                if ($("#warnListDiv").scrollTop() == height * this.warningList.length - $("#warnListDiv").innerHeight()) {
                     this.warningTypeIndex = 0
-                }else{
+                } else {
                     this.warningTypeIndex = this.warningTypeIndex + 1
                 }
-                $("#warnListDiv").animate({scrollTop:(height*this.warningTypeIndex)+'px'})
+                $("#warnListDiv").animate({ scrollTop: (height * this.warningTypeIndex) + 'px' })
             },
-            listMinMouseoverType(){
+            listMinMouseoverType() {
                 clearInterval(this.warningTypeInterval);
             },
-            listMinMouseoutType(){
-                this.warningTypeInterval=setInterval(this.automaticRollType,5000);
+            listMinMouseoutType() {
+                this.warningTypeInterval = setInterval(this.automaticRollType, 5000);
             },
-            toDateTime(dt){
+            toDateTime(dt) {
                 return moment(dt).format("YYYY年MM月DD日 HH:mm:ss");
             },
-            init() { 
-                let tmp=2;
-                this.warningData.forEach(d=>{
-                    if(d.count>tmp){
-                        tmp=d.count;
-                    }
-                });
-                tmp=tmp+2;
-                this.warningData.forEach(d=>{
-                    d.w=(d.count*100.0/tmp).toFixed(2);
-                });
-
+            init() {
+                this.loadCount();
+                this.loadElectricity_information();
+                this.loadEleLoad();
+                this.loadEleTrend();
+                this.loadCurrentTrend();
+                this.loadAreaEleTrendSel();
+                this.loadWarningCount();
+                this.loadWarningList();
+                setTimeout(this.init, 10000)
             },
+            getDates(n) {
+                let dt1 = moment(new Date()).format("YYYY-MM-DD 23:59:59");
+                if (n == 0) {
+                    return {
+                        dtStart: moment(new Date()).format("YYYY-MM-DD 00:00:00"),
+                        dtEnd: dt1
+                    }
+                } else if (n == 365) {
+                    let dt2 = moment(new Date()).add(-1, "years").format("YYYY-MM-DD 00:00:00");
+                    return {
+                        dtStart: dt2,
+                        dtEnd: dt1
+                    }
+                } else {
+                    let dt2 = moment(new Date()).add(-1 * n, "days").format("YYYY-MM-DD 00:00:00");
+                    return {
+                        dtStart: dt2,
+                        dtEnd: dt1
+                    }
+                }
+            },
+            //用电负荷
+            loadEleLoad() {
+                let postData = {
+                    projectId: projectId,
+                    isRegion: false,
+                };
+                if (this.eleLoadSel == 0) {
+                    //今日
+                    let dts = this.getDates(0);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                    this.block2.rotate = 0;
+                } else {
+                    //近七天
+                    let dts = this.getDates(7);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                    this.block2.rotate = 45;
+                }
+                if (this.eleLoadSelArea) {
+                    postData.regionId = this.eleLoadSelArea;
+                }
+                let url = '/api/device/smart_meter/electricity_load';
+                this.post(url, postData).then(d => {
+                    let data = d.data?.data || [];
+                    if (data.length > 0) {
+                        let list = (data[0].list || []);
+                        this.block2.titles = list.map(it => it.time);
+                        this.block2.datas = list.map(it => it.load);
+                    } else {
+                        this.block2.titles = [];
+                        this.block2.datas = [];
+                    }
+                    this.block2.elKey++;
+                });
+            },
+            loadEleTrend() {
+                let postData = {
+                    projectId: projectId,
+                    isRegion: false,
+                };
+                if (this.eleTrendSel == 0) {
+                    //今日
+                    let dts = this.getDates(0);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                    this.block3.rotate = 0;
+                } else {
+                    //近七天
+                    let dts = this.getDates(7);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                    this.block3.rotate = 45;
+                }
+                if (this.eleTrendSelArea) {
+                    postData.regionId = this.eleTrendSelArea;
+                }
+                let url = '/api/device/smart_meter/electricity_consumption_trend';
+                this.post(url, postData).then(d => {
+                    let data = d.data?.data || [];
+                    if (data.length > 0) {
+                        let list = data[0].list || [];
+                        this.block3.areas = data.map(it => it.regionName);
+                        this.block3.titles = list.map(it => it.time);
+                        this.block3.datas = data.map(it => {
+                            return {
+                                name: it.regionName,
+                                type: 'line',
+                                smooth: true,
+                                data: it.list.map(item => item.statistics)
+                            };
+                        });
+                    } else {
+                        this.block3.areas = [];
+                        this.block3.titles = [];
+                        this.block3.datas = [];
+                    }
+                    this.block3.elKey++;
+                });
+            },
+            loadCurrentTrend() {
+                let postData = {
+                    projectId: projectId,
+                    isRegion: false,
+                };
+                if (this.currentTrendSel == 0) {
+                    //今日
+                    let dts = this.getDates(0);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                } else {
+                    //近七天
+                    let dts = this.getDates(7);
+                    postData.startTime = dts.dtStart;
+                    postData.endTime = dts.dtEnd;
+                }
+                if (this.currentTrendSelArea) {
+                    postData.regionId = this.currentTrendSelArea;
+                }
+                let url = '/api/device/smart_meter/current_tendency';
+                this.post(url, postData).then(d => {
+                    let data = d.data?.data || [];
+                    if (data.length > 0) {
+                        let list = data[0].list || [];
+                        this.block4.titles = list.map(it => it.time);
+                        let tmps = [{
+                            name: "A相",
+                            type: "bar",
+                            data: [],
+                            stack: 'A相',
+                            barWidth: 10,
+                        },
+                        {
+                            name: 'B相',
+                            type: 'bar',
+                            data: [],
+                            stack: 'A相',
+                        },
+                        {
+                            name: 'C相',
+                            type: 'bar',
+                            data: [],
+                            stack: 'A相',
+                        }
+                        ];
+                        let max = 0;
+                        list.forEach(it => {
+                            tmps[0].data.push(it.A);
+                            tmps[1].data.push(it.B);
+                            tmps[2].data.push(it.C);
+                            let curMax = Math.floor(it.A + it.B + it.C) + 1
+                            if (curMax > max) {
+                                max = curMax;
+                            }
+
+                        });
+                        this.block4.max = max;
+                        this.block4.datas = tmps;
+                    } else {
+                        this.block4.titles = [];
+                        this.block4.datas = [];
+                    }
+                    this.block4.rotate = this.currentTrendSel == 0 ? 0 : 45;
+                    this.block4.elKey++;
+                });
+            },
+            loadAreaEleTrendSel() {
+                let postData = {
+                    projectId: projectId,
+                    isRegion: false,
+                };
+                let dts = this.getDates(365);
+                postData.startTime = dts.dtStart;
+                postData.endTime = dts.dtEnd;
+                let url = '/api/device/smart_meter/electricity_consumption_trend'
+                this.post(url, postData).then(d => {
+                    let data = d.data?.data || [];
+                    if (data.length > 0) { }
+                });
+            },
+            //获取智能电表警告计数【预警概况】
+            loadWarningCount() {
+                let url = "/api/device/smart_meter/warning_count";
+                let postData = { projectId: projectId };
+                this.post(url, postData).then(d => {
+                    let data = d.data?.data || {};
+                    this.block6.todayWarningCount = data.todayWarningCount || 0;
+                    this.block6.monthWarningCount = data.monthWarningCount || 0;
+                    let tmps = (data.typeWarningList || []).map((it, idx) => {
+                        return {
+                            count: it.count,
+                            w: 0,
+                            title: ["断相", "电压不平衡", "失流", "失压"][idx]
+                        }
+                    });
+                    let tmp = 2;
+                    tmps.forEach(d => {
+                        if (d.count > tmp) {
+                            tmp = d.count;
+                        }
+                    });
+                    tmp = tmp + 2;
+                    tmps.forEach(d => {
+                        d.w = (d.count * 100.0 / tmp).toFixed(2);
+                    });
+                    this.block6.typeWarningList = tmps;
+                });
+            },
+            //获取智能电表警告列表【预警概况】
+            loadWarningList() {
+                let url = "/api/device/smart_meter/warning_list?pageNum=1&pageSize=10";
+                let postData = { projectId: projectId };
+                this.post(url, postData).then(d => {
+                    this.block6.warningList = (d.data?.data?.rows || []).map(it => {
+                        if (it.warningType == "yiyi") {
+                            it.type = "t1";
+                            it.title = "当前区域断相";
+                        }
+                        if (it.warningType == "erer") {
+                            it.type = "t2";
+                            it.title = "当前区域电压不平衡";
+                        }
+                        if (it.warningType == "sn") {
+                            it.type = "t3";
+                            it.title = "当前区域失流";
+                        }
+                        if (it.warningType == "ss") {
+                            it.type = "t4";
+                            it.title = "当前区域失压";
+                        }
+                        it.address = it.address || "暂无";
+                        return it;
+                    });
+                });
+            },
+            post(url, data) {
+                return axios.post(baseUrl + url, data);
+            },
+            loadCount() {
+                let url = '/api/device/smart_meter/count'
+                this.post(url, { projectId: projectId }).then(d => {
+                    let data = d?.data?.data || {};
+                    this.block1.total = data.total || 0;
+                    this.block1.online = data.online || 0;
+                });
+            },
+            loadElectricity_information() {
+                let url = '/api/device/smart_meter/electricity_information'
+                this.post(url, { projectId: projectId }).then(d => {
+                    let data = d?.data?.data || {};
+                    this.block1.DailyElectricity = (data.DailyElectricity || 0).toFixed(2);
+                    this.block1.MonthlyElectricity = (data.MonthlyElectricity || 0).toFixed(2)
+                    this.block1.MonthAvgDailyElectricity = (data.MonthAvgDailyElectricity || 0).toFixed(2)
+                    this.block1.YearAvgDailyElectricity = (data.YearAvgDailyElectricity || 0).toFixed(2)
+                });
+            },
+
             doEleLoadSel(n) {
                 this.eleLoadSel = n;
+                this.loadEleLoad();
             },
             doEleTrendSel(n) {
                 this.eleTrendSel = n;
+                this.loadEleTrend();
             },
             doCurrentTrendSel(n) {
                 this.currentTrendSel = n;
+                this.loadCurrentTrend();
             },
             renderEleLoad(opt) {
                 let option = {
@@ -365,7 +793,7 @@
                         left: "5%",
                         right: "5%",
                         bottom: "10%",
-                        top: "5%",
+                        top: "10%",
                         containLabel: true,
                     },
                     tooltip: {
@@ -376,19 +804,11 @@
                         {
                             type: "category",
                             boundaryGap: false,
-                            data: [
-                                "08:00",
-                                "10:00",
-                                "12:00",
-                                "14:00",
-                                "16:00",
-                                "18:00",
-                                "20:00",
-                            ],
-                            axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            data: this.block2.titles,
+                            axisLabel: { color: "#a2c8f9", rotate: this.block2.rotate, },
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         },
@@ -397,9 +817,9 @@
                         {
                             type: "value",
                             axisLabel: { color: "red" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         },
@@ -419,11 +839,10 @@
                             itemStyle: {
                                 normal: { areaStyle: { type: "default", color: "#63baff" } },
                             },
-                            data: [10, 12, 21, 54, 260, 830, 710],
+                            data: this.block2.datas,
                         },
                     ],
                 };
-                console.log("--->",option)
                 return option;
             },
             renderEleTrendSel(opt) {
@@ -439,29 +858,21 @@
                         trigger: 'axis'
                     },
                     legend: {
-                        data: ['区域A', '区域B', '区域C', '区域D'],
+                        data: this.block3.areas,
                         textStyle: { color: "#a2c8f9" },
-                        
+
                     },
-                   
+
                     calculable: true,
                     xAxis: [
                         {
                             type: 'category',
                             boundaryGap: false,
-                            data: [
-                                "08:00",
-                                "10:00",
-                                "12:00",
-                                "14:00",
-                                "16:00",
-                                "18:00",
-                                "20:00",
-                            ],
-                            axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            data: this.block3.titles,
+                            axisLabel: { color: "#a2c8f9", rotate: this.block3.rotate, },
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         }
@@ -470,39 +881,14 @@
                         {
                             type: 'value',
                             axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         }
                     ],
-                    series: [
-                        {
-                            name: '区域A',
-                            type: 'line',                            
-                            data: [120, 132, 101, 134, 90, 230, 210],
-                            smooth:true,
-                        },
-                        {
-                            name: '区域B',
-                            type: 'line',
-                            data: [220, 182, 191, 234, 290, 330, 310],
-                            smooth:true,
-                        },
-                        {
-                            name: '区域C',
-                            type: 'line',
-                            data: [150, 232, 201, 154, 190, 330, 410],
-                            smooth:true,
-                        },
-                        {
-                            name: '区域D',
-                            type: 'line',
-                            data: [320, 332, 301, 334, 390, 330, 320],
-                            smooth:true,
-                        }
-                    ]
+                    series: this.block3.datas
                 };
 
 
@@ -514,7 +900,7 @@
                         left: "5%",
                         right: "5%",
                         bottom: "10%",
-                        top: "15%",
+                        top: "25%",
                         containLabel: true,
                     },
                     tooltip: {
@@ -523,63 +909,35 @@
                     legend: {
                         data: ['A相', 'B相', 'C相'],
                         textStyle: { color: "#a2c8f9" },
-                        
+
                     },
-                   
+
                     calculable: true,
                     xAxis: [
                         {
                             type: 'category',
-                            data: [
-                                "08:00",
-                                "10:00",
-                                "12:00",
-                                "14:00",
-                                "16:00",
-                                "18:00",
-                                "20:00",
-                            ],
-                            axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            data: this.block4.titles,
+                            axisLabel: { color: "#a2c8f9", rotate: this.block4.rotate, },
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
-                            }
+                            },
                         }
                     ],
                     yAxis: [
                         {
                             type: 'value',
                             axisLabel: { color: "#a2c8f9" },
-                            
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            max: this.block4.max,
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         }
                     ],
-                    series: [
-                        {
-                            name: 'A相',
-                            type: 'bar',                            
-                            data: [120, 132, 101, 134, 90, 230, 210],
-                            stack: 'A相',
-                            barWidth:10,
-                        },
-                        {
-                            name: 'B相',
-                            type: 'bar',
-                            data: [220, 182, 191, 234, 290, 330, 310],
-                            stack: 'A相',
-                        },
-                        {
-                            name: 'C相',
-                            type: 'bar',
-                            data: [150, 232, 201, 154, 190, 330, 410],
-                            stack: 'A相',
-                        }
-                    ]
+                    series: this.block4.datas
                 };
 
 
@@ -600,9 +958,9 @@
                     legend: {
                         data: ['区域A', '区域B', '区域C', '区域D'],
                         textStyle: { color: "#a2c8f9" },
-                        
+
                     },
-                   
+
                     calculable: true,
                     xAxis: [
                         {
@@ -623,9 +981,9 @@
                                 "12月",
                             ],
                             axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         }
@@ -634,9 +992,9 @@
                         {
                             type: 'value',
                             axisLabel: { color: "#a2c8f9" },
-                            splitLine:{                               
-                                lineStyle:{
-                                    opacity:0.1
+                            splitLine: {
+                                lineStyle: {
+                                    opacity: 0.1
                                 }
                             }
                         }
@@ -644,27 +1002,27 @@
                     series: [
                         {
                             name: '区域A',
-                            type: 'line',                            
+                            type: 'line',
                             data: [120, 132, 101, 134, 90, 230, 210, 101, 134, 90, 230, 210],
-                            smooth:true,
+                            smooth: true,
                         },
                         {
                             name: '区域B',
                             type: 'line',
                             data: [220, 182, 191, 234, 290, 330, 310, 191, 234, 290, 330, 310],
-                            smooth:true,
+                            smooth: true,
                         },
                         {
                             name: '区域C',
                             type: 'line',
                             data: [150, 232, 201, 154, 190, 330, 410, 201, 154, 190, 330, 410],
-                            smooth:true,
+                            smooth: true,
                         },
                         {
                             name: '区域D',
                             type: 'line',
                             data: [320, 332, 301, 334, 390, 330, 320, 301, 334, 390, 330, 320],
-                            smooth:true,
+                            smooth: true,
                         }
                     ]
                 };
diff --git a/power/nodata.svg b/power/nodata.svg
new file mode 100644
index 0000000..9e1de8e
--- /dev/null
+++ b/power/nodata.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 79 86" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><linearGradient id="linearGradient-1-1" x1="38.8503086%" y1="0%" x2="61.1496914%" y2="100%"><stop stop-color="#FCFCFD" offset="0%"></stop><stop stop-color="#EEEFF3" offset="100%"></stop></linearGradient><linearGradient id="linearGradient-2-1" x1="0%" y1="9.5%" x2="100%" y2="90.5%"><stop stop-color="#FCFCFD" offset="0%"></stop><stop stop-color="#E9EBEF" offset="100%"></stop></linearGradient><rect id="path-3-1" x="0" y="0" width="17" height="36"></rect></defs><g id="Illustrations" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="B-type" transform="translate(-1268.000000, -535.000000)"><g id="Group-2" transform="translate(1268.000000, 535.000000)"><path id="Oval-Copy-2" d="M39.5,86 C61.3152476,86 79,83.9106622 79,81.3333333 C79,78.7560045 57.3152476,78 35.5,78 C13.6847524,78 0,78.7560045 0,81.3333333 C0,83.9106622 17.6847524,86 39.5,86 Z" fill="#F7F8FC"></path><polygon id="Rectangle-Copy-14" fill="#E5E7E9" transform="translate(27.500000, 51.500000) scale(1, -1) translate(-27.500000, -51.500000) " points="13 58 53 58 42 45 2 45"></polygon><g id="Group-Copy" transform="translate(34.500000, 31.500000) scale(-1, 1) rotate(-25.000000) translate(-34.500000, -31.500000) translate(7.000000, 10.000000)"><polygon id="Rectangle-Copy-10" fill="#E5E7E9" transform="translate(11.500000, 5.000000) scale(1, -1) translate(-11.500000, -5.000000) " points="2.84078316e-14 3 18 3 23 7 5 7"></polygon><polygon id="Rectangle-Copy-11" fill="#EDEEF2" points="-3.69149156e-15 7 38 7 38 43 -3.69149156e-15 43"></polygon><rect id="Rectangle-Copy-12" fill="url(#linearGradient-1-1)" transform="translate(46.500000, 25.000000) scale(-1, 1) translate(-46.500000, -25.000000) " x="38" y="7" width="17" height="36"></rect><polygon id="Rectangle-Copy-13" fill="#F8F9FB" transform="translate(39.500000, 3.500000) scale(-1, 1) translate(-39.500000, -3.500000) " points="24 7 41 7 55 -3.63806207e-12 38 -3.63806207e-12"></polygon></g><rect id="Rectangle-Copy-15" fill="url(#linearGradient-2-1)" x="13" y="45" width="40" height="36"></rect><g id="Rectangle-Copy-17" transform="translate(53.000000, 45.000000)"><mask id="mask-4-1" fill="white"><use xlink:href="#path-3-1"></use></mask><use id="Mask" fill="#E0E3E9" transform="translate(8.500000, 18.000000) scale(-1, 1) translate(-8.500000, -18.000000) " xlink:href="#path-3-1"></use><polygon id="Rectangle-Copy" fill="#D5D7DE" mask="url(#mask-4-1)" transform="translate(12.000000, 9.000000) scale(-1, 1) translate(-12.000000, -9.000000) " points="7 0 24 0 20 18 -1.70530257e-13 16"></polygon></g><polygon id="Rectangle-Copy-18" fill="#F8F9FB" transform="translate(66.000000, 51.500000) scale(-1, 1) translate(-66.000000, -51.500000) " points="62 45 79 45 70 58 53 58"></polygon></g></g></g></svg>
\ No newline at end of file
diff --git a/power/power.css b/power/power.css
index b517a7d..f25d250 100644
--- a/power/power.css
+++ b/power/power.css
@@ -186,3 +186,31 @@
   background-color: #01a9ff;
   border-radius: 4px;
 }
+.app-power .pw-no-data {
+  text-align: center;
+  color: #eee;
+  font-size: 12px;
+}
+.app-power .pw-no-data::before {
+  margin-bottom: 10px;
+  background-image: url(nodata.svg);
+  height: 100px;
+  background-repeat: no-repeat;
+  background-position: center;
+  opacity: 0.4;
+  display: block;
+  content: " ";
+}
+.app-power .power-map .map-image {
+  height: calc(100% - 23px);
+  background-repeat: no-repeat;
+  background-size: 100%;
+  background-position: center;
+  position: relative;
+}
+.app-power .power-map .map-image .map-location {
+  position: absolute;
+  color: #09f781;
+  font-size: 40px;
+  text-shadow: 1px 1px 8px #010b2d;
+}
diff --git a/power/power.less b/power/power.less
index 8598696..0e5c120 100644
--- a/power/power.less
+++ b/power/power.less
@@ -205,4 +205,34 @@
     background-color: rgb(1, 169, 255);
     border-radius: 4px;
   }
+  .pw-no-data{
+    text-align: center;
+    color: #eee;
+    font-size: 12px;
+    &::before{
+      margin-bottom: 10px;
+      background-image: url(./nodata.svg);
+      height: 100px;
+      background-repeat: no-repeat;      
+      background-position: center;
+      opacity: 0.4;
+      display:block;
+      content:" ";
+    }
+  }
+  .power-map{
+    .map-image{
+      height: calc(100% - 23px);
+      background-repeat: no-repeat;
+      background-size: 100%;
+      background-position: center;
+      position: relative;
+      .map-location {
+        position: absolute;
+        color: #09f781;
+        font-size: 40px;
+        text-shadow: 1px 1px 8px #010b2d;
+      }
+    }
+  } 
 }
diff --git a/power/prj3.png b/power/prj3.png
new file mode 100644
index 0000000..4b4aff1
Binary files /dev/null and b/power/prj3.png differ