statistics.vue 56 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518
  1. <template>
  2. <view>
  3. <u-picker-select title="日期选择" :maskCloseAble="true" v-model="tabsFrom.show2" :defaultTime="tabsFrom.show2Index" :endYear="endYear"
  4. mode="time" :params="params" @confirm="selector2confirm" @cancel="selector2cancel"
  5. @reset="selector2reset">
  6. </u-picker-select>
  7. <u-select title="" v-model="tabsFrom.show1" :defaultValue="[current2]"
  8. :list="childList" value-name="id" label-name="name"
  9. @confirm="selector1confirm" >
  10. </u-select>
  11. <!-- 导航栏 -->
  12. <view class="navbar">
  13. <view class="title" v-if="companyInfotype==4">
  14. 能源管理
  15. <span style="padding-left: 4px;" >
  16. |
  17. </span>
  18. <span style="padding-left: 4px;" >
  19. {{datacompanyInfo.name}}
  20. </span>
  21. </view>
  22. <view class="title" v-else>
  23. 能源管理
  24. <span style="padding-left: 4px;" v-if="companyList.length>1&&current!=0">
  25. |
  26. </span>
  27. <span style="padding-left: 4px;" v-if="companyList.length>1&&current!=0">
  28. <template v-if="kWhList.length==1">
  29. {{kWhList[0].name}}
  30. </template>
  31. <template v-else>
  32. {{childList.length==1?companyInfo.name : childInfo.name}}
  33. </template>
  34. </span>
  35. <span style="padding-left: 4px;" v-if="companyList.length==1">
  36. |
  37. </span>
  38. <span style="padding-left: 4px;" v-if="companyList.length==1">
  39. <template v-if="kWhList.length==1">
  40. {{kWhList[0].name}}
  41. </template>
  42. <template v-else>
  43. {{childList.length==1?companyInfo.name : childInfo.name}}
  44. </template>
  45. </span>
  46. </view>
  47. </view>
  48. <view class="tabs-box tabs-box2" v-if="companyInfotype==4&&readingMeterNum&&monitorMeterNum" >
  49. <view class="tabs2" :class="'tabs-len-2'"
  50. :style="{width: '100%', }">
  51. <u-tabs-one :gutter="32"
  52. :list="companyInfotypeList" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
  53. bg-color="#1677FF" :current="1" @change="companyInfotypeChange"></u-tabs-one>
  54. </view>
  55. </view>
  56. <!-- 标签 -->
  57. <view class="tabs-box" v-else >
  58. <view class="tabs" :class="'tabs-len-'+merchantList1.length" v-show="companyList.length>1"
  59. :style="{width: companyList.length>3 ? '' : '100%'}">
  60. <u-tabs-one v-if="utabsone"
  61. :list="merchantList1" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
  62. bg-color="#1677FF" :current="current" @change="change"></u-tabs-one>
  63. </view>
  64. <view class="more" @click="popShow=true" v-if="companyList.length >= 4">
  65. <u-icon name="arrow-down" color="#fff" size="40"></u-icon>
  66. </view>
  67. </view>
  68. <!-- 标签弹出层 -->
  69. <u-popup v-model="popShow" duration="10" mode="top" :negative-top="88" border-radius="16">
  70. <view class="popup-tabs">
  71. <view class="tabs">
  72. <u-tabs
  73. :list="merchantList1" :is-scroll="false" :current="current" @change="change"></u-tabs>
  74. </view>
  75. <view class="more">
  76. <u-icon name="arrow-up" color="#777777" size="40" @click="popShow=false"></u-icon>
  77. </view>
  78. </view>
  79. <view class="tabs-options">
  80. <view class="item" v-for="(item, index) in merchantList2" :key="index"
  81. @click="merchantChange(item,index)">
  82. {{item.name}}
  83. </view>
  84. </view>
  85. </u-popup>
  86. <view class="main electronicMonitoring-123" v-show="kWhList.length==1" style="padding:32rpx 0;">
  87. <view class="electronicMonitoring-title"
  88. @click="titleCk"
  89. v-if="childList&&childList.length>0" >
  90. <view>
  91. {{childListName}}
  92. </view>
  93. <view v-show="childList.length>1">
  94. <u-icon name="arrow-down"></u-icon>
  95. </view>
  96. </view>
  97. <electronicMonitoring v-show="kWhList.length" :ref="'refMyEm'+companyId"></electronicMonitoring>
  98. <u-divider :isnone="kWhList.length==0" nonetext="暂无数据" border-color="#CFD2D5">已经到底了</u-divider>
  99. </view>
  100. <view class="main current-123" v-show="(kWhList.length!=1)">
  101. <view class="electronicMonitoring-title"
  102. @click="titleCk"
  103. v-if="companyType==1"
  104. v-show="childList&&childList.length>0" >
  105. <view>
  106. {{childListName}}
  107. </view>
  108. <view v-show="childList.length>1">
  109. <u-icon name="arrow-down"></u-icon>
  110. </view>
  111. </view>
  112. <view class="electronicMonitoring-title2"
  113. v-else
  114. v-show="childList&&childList.length>1" >
  115. <u-tabs-one height="60" v-if="childList&&childList.length"
  116. :currentIndexBl="true" bg-color="#f2f4f6"
  117. :list="childList" :is-scroll="false" :current="current2" @change="change2"></u-tabs-one>
  118. </view>
  119. <!-- 电表运行情况 -->
  120. <view class="statistics-1 statistics">
  121. <view class="title">
  122. <view class="icon">
  123. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  124. </view>
  125. <view class="text">
  126. 电表运行情况
  127. </view>
  128. <view class="check-all" @click="toEquipmentConditionMonitoring">
  129. 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  130. </view>
  131. </view>
  132. <view class="item">
  133. <view class="item-progess">
  134. <view class="img-box">
  135. <u-circle-progress active-color="#2979ff" :percent="alarmsPercent" width="88">
  136. </u-circle-progress>
  137. </view>
  138. </view>
  139. <!-- 累计 -->
  140. <view class="total">
  141. <view class="total1">
  142. <view class="normal">
  143. 正常 <span style="color:#19be6b;margin: 0 8rpx;">{{alarmsForm.okNum}}</span> 台
  144. </view>
  145. <view class="abnormal">
  146. 异常 <span style="color:red;margin: 0 8rpx;">{{alarmsForm.errorNum}}</span> 台
  147. </view>
  148. </view>
  149. <view class="total2" v-if="false">
  150. 本月累计触发告警 <text class="total-number">{{alarmsForm.errorMonthNum}}</text> 次
  151. </view>
  152. </view>
  153. </view>
  154. </view>
  155. <view class="" v-show="companyId==''&&companyList.length>1&&datacompanyInfo.type=='2'">
  156. <!-- 电表运行情况 -->
  157. <view class="statistics-1 statistics" >
  158. <view class="title">
  159. <view class="icon">
  160. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  161. </view>
  162. <view class="text">
  163. 在用园区与产权单位
  164. </view>
  165. </view>
  166. <view class=" contractList" >
  167. <view class="contractListClass" v-for="(item,i) in companyList" :key="i"
  168. @click="change(i+1)">
  169. <view class="contractListClass1">
  170. {{item.name}}
  171. </view>
  172. <view class="contractListClass2">
  173. <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  174. </view>
  175. </view>
  176. </view>
  177. </view>
  178. </view>
  179. <view class="" v-show="companyId==''&&companyList.length>1&&datacompanyInfo.type=='2'">
  180. <!-- 电表运行情况 -->
  181. <view class="statistics-1 statistics statistics-3" >
  182. <view class="title">
  183. <view class="icon">
  184. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  185. </view>
  186. <view class="text">
  187. 平台预计收入(元)
  188. </view>
  189. </view>
  190. <view class=" contractList" >
  191. <!-- @click="gotoUrl('/pages/tenantList/contractList?query=1')" -->
  192. <view class="contractListClass" v-for="(item,i) in platformRevenueList" :key="i"
  193. >
  194. <view class="contractListClass1">
  195. <view class="class1">{{item.name}}</view>
  196. <view class="class2">{{month}}月预计收入</view>
  197. </view>
  198. <view class="contractListClass2">
  199. {{item.incomeFee}}
  200. <u-icon name="arrow-right" v-if="0" style="margin-left: 12rpx;" size="24" color="#838383"></u-icon>
  201. </view>
  202. </view>
  203. </view>
  204. </view>
  205. </view>
  206. <view class="">
  207. <!-- 电表运行情况 -->
  208. <view class="statistics-1 statistics" v-show="companyId&&codes&&codes.indexOf('property')!=-1&&(tenantListNum0)">
  209. <view class="title">
  210. <view class="icon">
  211. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  212. </view>
  213. <view class="text">
  214. 租户管理预警
  215. </view>
  216. </view>
  217. <view class=" contractList">
  218. <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=1')">
  219. <view class="contractListClass1">
  220. <image class="img" src="@/assets/img/riLine-wallet-2-line.svg"></image>
  221. 账户余额不足 <span class="tenantListNum">{{tenantListNum1}}</span> 家
  222. </view>
  223. <view class="contractListClass2">
  224. <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  225. </view>
  226. </view>
  227. <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=2')">
  228. <view class="contractListClass1">
  229. <!-- <image class="img" src="@/assets/img/riLine-time-line2.svg"></image> -->
  230. <u-icon name="warning" class="img" size="32" color="#ef8132"></u-icon>
  231. 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum2}}</span> 家<span>(即将到期)</span>
  232. </view>
  233. <view class="contractListClass2">
  234. <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  235. </view>
  236. </view>
  237. <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=3')">
  238. <view class="contractListClass1">
  239. <image class="img" src="@/assets/img/riLine-time-line2.svg"></image>
  240. 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum3}}</span> 家<span>(已到期)</span>
  241. </view>
  242. <view class="contractListClass2">
  243. <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  244. </view>
  245. </view>
  246. </view>
  247. </view>
  248. </view>
  249. <!-- 统计2 异常告警记录 -->
  250. <view class="statistics-2 statistics" v-show="companyId&&codes&&codes.indexOf('property')!=-1&&(tenantListNum0)" >
  251. <view class="title">
  252. <view class="icon">
  253. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  254. </view>
  255. <view class="text">
  256. 租户断电提醒
  257. </view>
  258. <view class="check-all" @click="gotoUrl('/pages/tenantList/remindList?id='+companyId)">
  259. 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  260. </view>
  261. </view>
  262. <u-divider :isnone="abnormalRecordsList.length==0" nonetext="无记录"
  263. border-color="#fff"></u-divider>
  264. <!-- 异常 -->
  265. <view class="abnormal-item" v-for="(item,index) in abnormalRecordsList"
  266. :key="index"
  267. >
  268. <!-- @click="gotoUrl('/pages/abnormal/abnormalAlarmDetails?id='+item.id)"
  269. -->
  270. <view class="item-title">
  271. <view class="name">
  272. {{item.content}}
  273. </view>
  274. <view class="date" style="display: flex; justify-content: space-between;margin-top: 4rpx;">
  275. <view>{{item.title}}</view>
  276. <view>{{item.createTime}}</view>
  277. </view>
  278. </view>
  279. </view>
  280. </view>
  281. <!-- 能源管理 -->
  282. <view v-show="companyId" class="statistics statistics-manage">
  283. <view class="title">
  284. <view class="icon">
  285. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  286. </view>
  287. <view class="text">
  288. 能源管理
  289. </view>
  290. <view class="check-all" @click="toEquipmentElectricity">
  291. 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  292. </view>
  293. </view>
  294. <view class="content"
  295. style="display: flex;justify-content: center;margin: 40px 0;"
  296. v-if="!getHomePageManageshowLoading">
  297. <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
  298. <i class="uni-icon_toast uni-loading"
  299. style="
  300. width: 80rpx;
  301. height: 80rpx;
  302. "
  303. ></i><p class="uni-toast__content"> </p>加载中...</div>
  304. </view>
  305. <view class="content" v-else-if="getHomePageManageshowLoading&&meterList.length == 0">
  306. <u-divider :isnone="true" nonetext="无记录"
  307. border-color="#fff"></u-divider>
  308. </view>
  309. <!-- 图表 -->
  310. <view class="chart" v-show="getHomePageManageshowLoading">
  311. <view class="u-subsection">
  312. <u-subsection :list="list" :current="homePageManageType" @change="sectionChange"
  313. font-size="24"></u-subsection>
  314. <view style="margin-top: 18rpx;" v-if="homePageManageType==5&&tabsFrom.show2Text">
  315. 指定时间:{{tabsFrom.show2Text}}
  316. </view>
  317. </view>
  318. <view class="incomeExpenditureClass" v-show="companyType!=4&&homePageManageObj.showPark" >
  319. <view class="incomeRow" >
  320. <view class="income1">
  321. <view class="income11">
  322. 电费收入 (元)
  323. </view>
  324. <view class="income12">
  325. {{incomeExpenditureObj.incomeFee}}
  326. <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
  327. </view>
  328. </view>
  329. <view class="income1">
  330. <view class="income11">
  331. 电费支出 (元)
  332. </view>
  333. <view class="income12">
  334. {{incomeExpenditureObj.expenditureFee}}
  335. <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
  336. </view>
  337. </view>
  338. </view>
  339. <view class="incomeRow" >
  340. <view class="income1">
  341. <view class="income11">
  342. 收支情况 (元)
  343. </view>
  344. <view class="income12" :style="incomeExpenditureObj.differenceFee>=0?'color:red':'color:#52b8aa'">
  345. {{incomeExpenditureObj.differenceFee>0?'+':''}}{{incomeExpenditureObj.differenceFee}}
  346. <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
  347. </view>
  348. </view>
  349. <view class="income1">
  350. <view class="income11">
  351. 节约电费 (元)
  352. </view>
  353. <view class="income12" style="color:#52b8aa">
  354. {{incomeExpenditureObj.saveFee}}
  355. <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
  356. </view>
  357. </view>
  358. </view>
  359. </view>
  360. <view class="chat-box" id="barEcharts-statistics" v-show="companyType!=4&&homePageManageObj.showPark">
  361. </view>
  362. </view>
  363. <view class="search" v-if="false">
  364. <view class="switch">
  365. <u-switch v-model="checked" size="40"></u-switch><text>只看离线表</text>
  366. </view>
  367. <view class="search-box">
  368. <input type="text" placeholder="请输入电表查询" />
  369. <view class="icon">
  370. <img src="@/assets/img/riLine-search-line 1.svg" alt="" />
  371. </view>
  372. </view>
  373. </view>
  374. <!-- 电表统计 -->
  375. <Tree-Body :meterList="meterList" ref="mytree"
  376. :showPark="homePageManageObj.showPark"
  377. @query="getHomePageManageChildMeter"
  378. v-if="getHomePageManageReady"
  379. :role="codes&&codes.indexOf('switch')!=-1"
  380. @switchBtn="switchBtnApi"
  381. ></Tree-Body>
  382. </view>
  383. <!-- 用电量 -->
  384. <view class="statistics-e statistics" v-if="!companyId">
  385. <view class="title">
  386. <view class="icon">
  387. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  388. </view>
  389. <view class="text">
  390. 用电量 (度)
  391. </view>
  392. <view class="check-all" @click="toEquipmentElectricity">
  393. 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  394. </view>
  395. </view>
  396. <view class="content" style="display: flex;justify-content: center;margin: 40px 0;"
  397. v-if="getHomePageKwhshowLoading">
  398. <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
  399. <i class="uni-icon_toast uni-loading"
  400. style="
  401. width: 80rpx;
  402. height: 80rpx;
  403. "
  404. ></i><p class="uni-toast__content"> </p>加载中...</div>
  405. </view>
  406. <view class="content" v-else-if="!getHomePageKwhshowLoading&&kWhListHome.length == 0">
  407. <u-divider :isnone="true" nonetext="无记录"
  408. border-color="#fff"></u-divider>
  409. </view>
  410. <view class="content" v-else >
  411. <view class="electricity">
  412. <view class="item" v-for="(item, index) in kWhListHome" :key="index"
  413. @click="toElectronicMonitoring(item)">
  414. <view class="item-content">
  415. <view class="equipment">
  416. <view class="equipment1 ">
  417. {{replaceLastTwoWords(item.name)}}
  418. </view>
  419. <view class="equipment2">
  420. {{item.installationAddressSimple}}
  421. </view>
  422. <view class="state" v-if="!item.online">
  423. <!-- <view class="dot off-line"></view> -->
  424. <view class="text">离线</view>
  425. </view>
  426. <view class="state state2" v-else>
  427. <!-- <view class="dot on-line"></view> -->
  428. <view class="text">在线</view>
  429. </view>
  430. </view>
  431. <view class="electricity">
  432. <view class="electricity-item electricity-item-day">
  433. <view class="date">
  434. 今日
  435. </view>
  436. <view class="number">
  437. {{item.thisDayKwh}}
  438. </view>
  439. </view>
  440. <view class="electricity-item">
  441. <view class="date">
  442. 本月
  443. </view>
  444. <view class="number">
  445. {{item.thisMonthKwh}}
  446. </view>
  447. </view>
  448. <view class="electricity-item">
  449. <view class="date">
  450. 上月
  451. </view>
  452. <view class="number">
  453. {{item.lastMonthKwh}}
  454. </view>
  455. </view>
  456. </view>
  457. </view>
  458. <view class="more">
  459. <u-icon name="arrow-right" color="#d4d4d4" size="24"></u-icon>
  460. </view>
  461. </view>
  462. </view>
  463. </view>
  464. </view>
  465. <!-- 异常设备排名 -->
  466. <view class="statistics statistics-ranking" v-if="false">
  467. <view class="title">
  468. <view class="icon">
  469. <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
  470. </view>
  471. <view class="text">
  472. 异常设备排名
  473. </view>
  474. <view class="check-all">
  475. 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
  476. </view>
  477. </view>
  478. <!-- 合计 -->
  479. <view class="total">
  480. 本年度共有<text> 42</text>次设备异常告警
  481. </view>
  482. <view class="ranking-main">
  483. <view class="item" v-for="(item,i) in 3" :key="i"
  484. @click="gotoUrl('/pages/equipmentDataMonitoring/electronicMonitoring?id='+'&name=')">
  485. <view class="ranking">
  486. 1
  487. </view>
  488. <view class="name">
  489. <view class="name1">
  490. 荆鹏软件园01
  491. </view>
  492. <view class="name2">
  493. 荆鹏集团
  494. </view>
  495. </view>
  496. <view class="time">
  497. 5次
  498. </view>
  499. </view>
  500. </view>
  501. <!-- 查看全部排名 -->
  502. <!-- <view class="check-all" @click="gotoUrl('/pages/abnormal/abnormalDeviceRanking')">
  503. 查看全部排名 <u-icon name="arrow-down" size="24" color="rgba(119,119,119,1)"></u-icon>
  504. </view> -->
  505. </view>
  506. <u-divider nonetext="暂无数据" border-color="#CFD2D5">已经到底了</u-divider>
  507. </view>
  508. <energyCenterTabbar :current="0"></energyCenterTabbar>
  509. </view>
  510. </template>
  511. <script>
  512. import {
  513. parseUnixTime,
  514. beforeTimeStamp,
  515. getWeek,newDate
  516. } from '@/apis/utils'
  517. import energyCenterTabbar from '@/components/energyCenterTabbar.vue'
  518. import electronicMonitoring from '@/pages/equipmentDataMonitoring/electronicMonitoring.vue'
  519. import * as echarts from 'echarts';
  520. import * as API_index from '@/apis/pagejs/index.js'
  521. import * as API_tenantList from '@/apis/pagejs/tenantList.js'
  522. import * as API from '@/apis/pagejs/energyManage.js'
  523. import TreeBody from '@/components/tree/tree-body.vue';
  524. export default {
  525. components: {
  526. energyCenterTabbar,TreeBody,electronicMonitoring
  527. },
  528. data() {
  529. return {
  530. abnormalRecordsList: [],
  531. queryDate: '',
  532. alarmsPercent: 0,
  533. alarmsForm: {
  534. okNum: 0,
  535. errorNum: 0,
  536. errorMonthNum: 0
  537. }, // 累计报警
  538. companyId: '', // 商户ID
  539. pageIndexe: 1, // 设备数据检测
  540. totalPagee: 1,
  541. deviceList: [],
  542. pageIndexp: 1, // 用电量
  543. totalPagep: 1,
  544. kWhList: [],
  545. kWhListHome: [],
  546. codes: '', // 判断:reading用电量 detector设备数据检测
  547. merchantList1: [], // 商户
  548. merchantList2: [],
  549. companyList: [],
  550. datacompanyInfo:{},
  551. companyInfotypeCurrent:1,
  552. companyInfotypeList:[
  553. {
  554. name: '变压器巡检仪'
  555. },
  556. {
  557. name: '费控电表计量仪'
  558. }
  559. ],
  560. popShow: false,
  561. popShowtest: true,
  562. current: 0,
  563. current2: 0,
  564. myLineChart: null, // 图表
  565. myBarChart: null,
  566. myPieChart: null,
  567. intervalId: null, // 用于存储间隔ID
  568. intervalReady: false, // 用于存储间隔ID
  569. list: [{
  570. name: '上月',
  571. value: "2"
  572. },
  573. {
  574. name: '当月',
  575. value: "1"
  576. },
  577. {
  578. name: '今日',
  579. value: "4"
  580. }, {
  581. name: '当年',
  582. value: "3"
  583. }, {
  584. name: '合计',
  585. value: "0"
  586. },
  587. {
  588. name: '指定时间',
  589. value: "10"
  590. }
  591. ],
  592. checked: false,
  593. homePageManageType: 2,
  594. meterList: [],
  595. showPark:false,
  596. meterListShow:{},
  597. homePageManageObj: {
  598. chargeKwh: 0,
  599. lostKwh: 0,
  600. parkKwh: 0,
  601. freeKwh:0,
  602. publicKwh:0,
  603. },
  604. endYear: '',
  605. params: {
  606. year: true,
  607. month: true,
  608. day: false,
  609. hour: false,
  610. minute: false,
  611. second: false
  612. },
  613. value: '2',
  614. clickType: -1,
  615. tabsFrom: {
  616. show1: false,
  617. show1Index: 0,
  618. show2Index: '',
  619. show2: false,
  620. show1Text: "全部类型",
  621. show2Text: "",
  622. },
  623. getHomePageManageReady:false,
  624. utabsone:true,
  625. incomeExpenditureObj:{},
  626. getHomePageKwhshowLoading:false,
  627. getHomePageManageshowLoading:false,
  628. companyInfotype:0,
  629. readingMeterNum:0, //计量仪
  630. monitorMeterNum:0, //巡检仪
  631. tenantListNum0:0,
  632. tenantListNum1:0,
  633. tenantListNum2:0,
  634. tenantListNum3:0,
  635. childList:[],
  636. childInfo:{},
  637. companyInfo:{},
  638. month:0,
  639. platformRevenueList:[],
  640. }
  641. },
  642. onLoad() {
  643. var date = new Date();
  644. var year = date.getFullYear();
  645. var month = date.getMonth() + 1 >= 10 ? date.getMonth() + 1 : '0' + (date.getMonth() + 1);
  646. this.month=date.getMonth() + 1
  647. this.endYear = new Date().getFullYear();
  648. this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
  649. this.getfindByOpenId();
  650. this.getCompanyInfoList();
  651. },
  652. onReady() {
  653. },
  654. onUnload(){
  655. this.clearTimer(); // 组件销毁前清除定时器
  656. console.log("组件销毁前清除定时器")
  657. },
  658. beforeDestroy() {
  659. this.clearTimer(); // 组件销毁前清除定时器
  660. console.log("组件销毁前清除定时器")
  661. },
  662. onHide(){
  663. this.intervalReady=false
  664. this.clearTimer();
  665. },
  666. onShow(){
  667. if(!this.intervalReady&&this.companyList.length>1){
  668. this.startInterval();
  669. }
  670. },
  671. computed:{
  672. childListName(){
  673. return this.childInfo.name;
  674. },
  675. companyType(){
  676. return this.companyInfo.type;
  677. }
  678. },
  679. methods: {
  680. titleCk() {
  681. if(this.childList.length>1){
  682. this.tabsFrom.show1 = true
  683. }
  684. },
  685. stateBl(timekey,day){
  686. var get=newDate(timekey)
  687. var time=new Date()
  688. if(!day){
  689. return time>get;
  690. }else{
  691. var get2=newDate(timekey)
  692. get2.setDate(get2.getDate() - day)
  693. console.log(timekey)
  694. return get2<time&&get>time;
  695. }
  696. },
  697. selectTypeMethod(tenant,selectType){
  698. var selectType1=this.selectType;
  699. if(selectType){
  700. selectType1=selectType;
  701. }
  702. // if(){
  703. // }
  704. if(true){
  705. var bl=false;
  706. for(var j in tenant.tenantContractList){
  707. var tenant1=tenant.tenantContractList[j]
  708. //console.log(tenant1.autoDeductFee)
  709. if(tenant1.autoDeductFee!=true){
  710. continue;
  711. }
  712. if(selectType1==0){
  713. return true
  714. }
  715. if(selectType1==1){
  716. return tenant.balance<tenant.minBalance
  717. }
  718. for(var k in tenant1.contractItemList){
  719. var item=tenant1.contractItemList[k]
  720. //console.log(item.prepaidEndTime)
  721. if(item.paymentMethod==1&&item.name!='电费'){
  722. if(selectType1==2){
  723. if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime,30)){
  724. bl=true;
  725. }
  726. }
  727. if(selectType1==3){
  728. if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime)){
  729. bl=true;
  730. }
  731. if(item.prepaidEndTime==null){
  732. bl=true;
  733. }
  734. }
  735. }
  736. }
  737. }
  738. return bl
  739. }
  740. },
  741. getTenantList(){
  742. // uni.showLoading({
  743. // title: "加载中",
  744. // mask: true,
  745. // })
  746. API_tenantList.tenantContractList({
  747. companyId:this.companyId
  748. }).then((response) => {
  749. uni.hideLoading();
  750. //this.getTenantListReady=true
  751. var tenantList=response.data.tenantInfoList;
  752. this.tenantListNum0=tenantList.length
  753. for(var i in tenantList){
  754. var obj=tenantList[i]
  755. if(this.selectTypeMethod(obj,1)){
  756. this.tenantListNum1++;
  757. }
  758. if(this.selectTypeMethod(obj,2)){
  759. this.tenantListNum2++;
  760. }
  761. if(this.selectTypeMethod(obj,3)){
  762. this.tenantListNum3++;
  763. }
  764. }
  765. }).catch(error => {
  766. uni.showToast({
  767. title: error,
  768. icon: "none"
  769. })
  770. })
  771. },
  772. //绑定权限
  773. getfindByOpenId() {
  774. API_index.findByOpenId({
  775. openId: this.carhelp.getOpenId()
  776. }).then((response) => {
  777. if(response.data&&response.data.companyInfo){
  778. this.datacompanyInfo=response.data.companyInfo
  779. this.companyInfotype = response.data.companyInfo.type;
  780. if(this.companyInfotype==4){
  781. this.getFindMeterList()
  782. }
  783. }
  784. if(response.data){
  785. var token = response ? response.data.token : '';
  786. this.carhelp.setPersonInfo(response.data.regUser );
  787. this.carhelp.setToken(token);
  788. this.carhelp.setPersonInfoPlus(response.data);
  789. this.codes =response.data.regUser.codes
  790. if(this.companyId&&this.codes&&this.codes.indexOf('property')!=-1){
  791. this.getTenantList()
  792. }
  793. }
  794. }).catch(error => {
  795. uni.showToast({
  796. title: error,
  797. icon: "none"
  798. })
  799. })
  800. },
  801. getFindMeterList(){
  802. API.findMeterList().then((response) => {
  803. //readingMeterNum 计量仪 //monitorMeterNum 巡检仪
  804. this.readingMeterNum=response.data.readingMeterNum
  805. this.monitorMeterNum=response.data.monitorMeterNum
  806. }).catch(error => {
  807. uni.showToast({
  808. title: error,
  809. icon: "none"
  810. })
  811. })
  812. },
  813. switchBtnApiMethod(node,key){
  814. uni.showLoading({
  815. title: "加载中",
  816. mask: true,
  817. })
  818. API.remoteSwitch({
  819. meterId:node.id,
  820. enabled:key
  821. }).then((res) => {
  822. uni.hideLoading();
  823. node.switchStatus=key
  824. }).catch(error => {
  825. uni.showToast({
  826. title: error,
  827. icon: "none"
  828. })
  829. })
  830. },
  831. switchBtnApi(node,key){
  832. uni.showModal({
  833. confirmColor:`${key?'#3CC51F':'red'}`,
  834. confirmText:`${key?'开启':'关闭'}`,
  835. content: `确认是否要"${key?'开启':'关闭'}"${this.replaceLastTwoWords(node.name)}`,
  836. title: "提示",
  837. success:res=> {
  838. if(res.confirm){
  839. this.switchBtnApiMethod(node,key);
  840. }
  841. }
  842. })
  843. console.log(node,key)
  844. },
  845. getIncomeExpenditure(){
  846. API.incomeExpenditure({
  847. //parentMeterId:item.id,
  848. queryDate:this.queryDate,
  849. companyId: this.companyId,
  850. type: this.list[this.homePageManageType].value
  851. }).then((response) => {
  852. this.incomeExpenditureObj=response.data
  853. this.incomeExpenditureObj.id=1
  854. }).catch(error => {
  855. uni.showToast({
  856. title: error,
  857. icon: "none"
  858. })
  859. })
  860. },
  861. // 设备数据监测
  862. getHomePageManageChildMeter(item,bl) {
  863. if(!bl){
  864. // uni.showLoading({
  865. // title: "加载中",
  866. // mask: true,
  867. // })
  868. }
  869. API.homePageManageChildMeter({
  870. parentMeterId:item.id,
  871. queryDate:this.queryDate,
  872. companyId: this.companyId,
  873. type: this.list[this.homePageManageType].value
  874. }).then((response) => {
  875. // if(!bl){
  876. // uni.hideLoading();
  877. // }
  878. // this.meterList = response.data.meterList;
  879. // if(!this.meterListShow.id){
  880. // this.meterListShow.id=1
  881. // this.recursionList(this.meterList)
  882. // }
  883. var childMeterList=response.data.childMeterList
  884. item.childMeterList=childMeterList
  885. if(!bl){
  886. for(var i in childMeterList){
  887. var obj=childMeterList[i]
  888. this.getHomePageManageChildMeter(obj,true)
  889. }
  890. }
  891. }).catch(error => {
  892. uni.showToast({
  893. title: error,
  894. icon: "none"
  895. })
  896. })
  897. },
  898. recursionList(list){
  899. if(list){
  900. for(var i in list){
  901. var obj=list[i]
  902. this.meterListShow[obj.id]=false
  903. this.recursionList(obj.childMeterList)
  904. }
  905. }
  906. },
  907. ifBtnShow(item){
  908. return this.meterListShow[item.id]
  909. },
  910. showBtn(item){
  911. var key=this.meterListShow[item.id];
  912. this.$set(this.meterListShow,item.id,!key)
  913. console.log("showBtn,",key)
  914. this.$forceUpdate()
  915. },
  916. selector2reset(e) {
  917. console.log(e)
  918. this.tabsFrom.show2Text = '全部时间'
  919. this.tabsFrom.show2Index = '';
  920. if (e.day) {
  921. this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
  922. this.getHomePageManage();
  923. } else {
  924. this.homePageManageType = this.clickType;
  925. if (this.homePageManageType != 5) {
  926. this.list[5].name = '指定时间';
  927. }
  928. this.getHomePageManage();
  929. }
  930. },
  931. selector2cancel() {
  932. if(this.clickType != -1) {
  933. }
  934. this.homePageManageType = this.clickType;
  935. },
  936. selector2confirm(e) {
  937. this.tabsFrom.show2Text = e.year + "年" + e.month + "月"
  938. this.tabsFrom.show2Index = e.year + "-" + e.month
  939. if (e.day) {
  940. this.tabsFrom.show2Text += e.day + "日"
  941. this.tabsFrom.show2Index += '-' + e.day
  942. this.queryDateMethod(this.tabsFrom.show2Index, true)
  943. } else {
  944. this.queryDateMethod(this.tabsFrom.show2Index, false)
  945. }
  946. },
  947. queryDateMethod(queryTime, day) {
  948. this.homePageManageType = "5";
  949. if (day) {
  950. this.queryDate = queryTime;
  951. this.list[5].value = '9';
  952. } else {
  953. this.queryDate = queryTime + "-01";
  954. this.list[5].value = '10';
  955. }
  956. //this.list[5].name = queryTime;
  957. this.getHomePageManage();
  958. },
  959. clearTimer() {
  960. if (this.intervalId) {
  961. clearInterval(this.intervalId); // 清除定时器
  962. this.intervalId = null; // 重置定时器ID
  963. }
  964. },
  965. startInterval() {
  966. this.clearTimer(); // 组件销毁前清除定时器
  967. this.intervalId = setInterval(() => {
  968. this.getHomePageKwh('', true)
  969. }, 60000);
  970. },
  971. merchantChangeApi() {
  972. this.popShow=false
  973. if (this.companyId) {
  974. if(this.companyId&&this.codes&&this.codes.indexOf('property')!=-1){
  975. this.getTenantList()
  976. }
  977. this.getHomePageKwh(this.companyId)
  978. this.getAbnormalAlarmRecord();
  979. }else{
  980. this.kWhList=[]
  981. this.getDeviceStatus()
  982. this.getPlatformRevenue()
  983. }
  984. },
  985. companyInfotypeChange(index){
  986. if(index!=this.companyInfotypeCurrent){
  987. var url=""
  988. if(process.car.NODE_ENV=='dev'){
  989. url='http://localhost:8081/#/'
  990. }else if(process.car.NODE_ENV=='test'){
  991. url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric-test/#/'
  992. }else{
  993. url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric/#/'
  994. }
  995. window.location.href=url+"pages/statistics/statistics"
  996. }
  997. },
  998. change(index) {
  999. this.current = index;
  1000. this.current2=0;
  1001. this.childList=[]
  1002. var company= this.merchantList1[index]
  1003. if(company.id!=''){
  1004. this.childList=company.childList;
  1005. if(this.childList&&this.childList.length){
  1006. this.companyId = this.childList[0].id;
  1007. this.childInfo=this.childList[0]
  1008. }else{
  1009. this.childList=[]
  1010. this.companyId =company.id
  1011. this.childInfo=company
  1012. }
  1013. }else{
  1014. this.companyId =''
  1015. }
  1016. this.companyInfo=company;
  1017. this.merchantChangeApi()
  1018. },
  1019. change2(index) {
  1020. this.current2=index;
  1021. this.companyId = this.childList[this.current2].id;
  1022. this.childInfo=this.childList[this.current2]
  1023. this.merchantChangeApi()
  1024. },
  1025. merchantChange(company, index) {
  1026. if(this.current==0){
  1027. this.current=1;
  1028. }
  1029. var m = company;
  1030. var n = this.merchantList1[this.current];
  1031. this.merchantList1[this.current] = m;
  1032. this.merchantList2[index] = n;
  1033. //this.$forceUpdate()
  1034. this.utabsone=false
  1035. this.companyId = company.id;
  1036. this.companyInfo=company
  1037. if(company.id!=''){
  1038. this.childList=company.childList;
  1039. if(this.childList&&this.childList.length){
  1040. this.companyId = this.childList[0].id;
  1041. this.childInfo=this.childList[0]
  1042. }else{
  1043. this.childList=[]
  1044. this.companyId =company.id
  1045. this.childInfo=company
  1046. }
  1047. }else{
  1048. this.companyId =''
  1049. }
  1050. this.merchantChangeApi()
  1051. this.popShow = false;
  1052. },
  1053. getCompanyInfoList() {
  1054. // uni.showLoading({
  1055. // title: "加载中",
  1056. // mask: true,
  1057. // })
  1058. API.deviceCompanyList().then((response) => {
  1059. //uni.hideLoading();
  1060. var list = response.data.companyInfoList;
  1061. var mList1 = [];
  1062. var mList2 = [];
  1063. mList1.push({
  1064. id: '',
  1065. name: '全部'
  1066. });
  1067. for (var i = 0; i < list.length; i++) {
  1068. if (i >= 3) {
  1069. mList2.push(list[i]);
  1070. } else {
  1071. mList1.push(list[i]);
  1072. }
  1073. }
  1074. this.companyList = list;
  1075. if(this.companyList&&this.companyList.length&&this.companyList.length==1){
  1076. this.childList=list[0].childList
  1077. if(!this.childList){
  1078. this.childList=[]
  1079. }
  1080. // this.childList=[
  1081. // ...list[0].childList,
  1082. // {
  1083. // name:'创客公寓',
  1084. // id:''
  1085. // },
  1086. // {
  1087. // name:'创客公寓',
  1088. // id:''
  1089. // }
  1090. // ]
  1091. }
  1092. if(this.companyList.length==1&&this.childList.length==0){
  1093. this.companyId=this.companyList[0].id
  1094. this.childInfo=this.companyList[0]
  1095. this.companyInfo=this.companyList[0]
  1096. }else if(this.companyList.length==1){
  1097. this.companyId=this.childList[0].id
  1098. this.childInfo=this.childList[0]
  1099. this.companyInfo=this.companyList[0]
  1100. }else{
  1101. this.getHomePageKwh('')
  1102. }
  1103. this.merchantList1 = mList1;
  1104. this.merchantList2 = mList2;
  1105. this.merchantChangeApi()
  1106. }).catch(error => {
  1107. uni.showToast({
  1108. title: error,
  1109. icon: "none"
  1110. })
  1111. })
  1112. },
  1113. sectionChange(index) {
  1114. this.clickType = this.homePageManageType ;
  1115. this.homePageManageType = index;
  1116. if (index == 5) {
  1117. this.tabsFrom.show2 = true;
  1118. //this.params.day = false;
  1119. } else {
  1120. this.list[5].name = '指定时间'
  1121. this.getHomePageManage()
  1122. }
  1123. },
  1124. getHomePageManage(bl) {
  1125. this.getHomePageManageReady=false
  1126. if(bl){
  1127. this.getHomePageManageshowLoading=false
  1128. }else{
  1129. uni.showLoading({
  1130. title: "加载中",
  1131. mask: true,
  1132. })
  1133. }
  1134. this.incomeExpenditureObj={}
  1135. var type=this.list[this.homePageManageType].value
  1136. API.homePageManage({
  1137. queryDate:this.queryDate,
  1138. companyId: this.companyId,
  1139. type: type
  1140. }).then((response) => {
  1141. this.getHomePageManageReady=true
  1142. if(bl){
  1143. this.getHomePageManageshowLoading=true
  1144. }else{
  1145. uni.hideLoading();
  1146. }
  1147. this.meterList = response.data.meterList;
  1148. //console.log(this.meterList)
  1149. this.homePageManageObj = response.data;
  1150. //this.$forceUpdate()
  1151. if(this.companyType!=4&&this.homePageManageObj.showPark){
  1152. this.myBarChart=null;
  1153. this.$nextTick(()=>{
  1154. this.getBarCharts()
  1155. })
  1156. this.getIncomeExpenditure();
  1157. }
  1158. }).catch(error => {
  1159. uni.showToast({
  1160. title: error,
  1161. icon: "none"
  1162. })
  1163. })
  1164. },
  1165. // 报警
  1166. getAbnormalAlarmRecord() {
  1167. if(this.companyId&&this.codes&&this.codes.indexOf('property')!=-1){
  1168. }else{
  1169. return
  1170. }
  1171. API.remindList({
  1172. configId: '',
  1173. pageIndex: 1,
  1174. pageSize: 3,
  1175. companyId: this.companyId
  1176. }).then((response) => {
  1177. this.abnormalRecordsList = response.data.data;
  1178. }).catch(error => {
  1179. uni.showToast({
  1180. title: error,
  1181. icon: "none"
  1182. })
  1183. })
  1184. },
  1185. selector1confirm(e) {
  1186. //this.getHomePageKwh()
  1187. console.log(e)
  1188. this.companyId=e[0].value
  1189. this.current2=e[0].i
  1190. this.childInfo=this.childList[this.current2];
  1191. uni.showLoading()
  1192. this.merchantChangeApi()
  1193. },
  1194. // 用电量
  1195. getHomePageKwh( companyId,interval) {
  1196. if (!interval) {
  1197. // uni.showLoading({
  1198. // title: "加载中",
  1199. // mask: true,
  1200. // })
  1201. this.getHomePageKwhshowLoading=true;
  1202. }
  1203. API.homePageKwh({
  1204. pageIndex: 1,
  1205. pageSize: 5,
  1206. companyId:companyId
  1207. }).then((response) => {
  1208. if (!interval) {
  1209. //uni.hideLoading();
  1210. this.getHomePageKwhshowLoading=false;
  1211. }
  1212. if(companyId){
  1213. this.kWhList = response.data.data;
  1214. if(this.kWhList.length==1){
  1215. this.utabsone=true
  1216. var item=this.kWhList[0];
  1217. this.$refs['refMyEm'+companyId].init({
  1218. id:item.id,
  1219. name:item.name,
  1220. companyId:item.companyId,
  1221. ref:1,
  1222. })
  1223. }else{
  1224. this.getHomePageManage(1)
  1225. this.getDeviceStatus()
  1226. this.getAbnormalAlarmRecord();
  1227. }
  1228. }else{
  1229. this.utabsone=true
  1230. this.kWhListHome= response.data.data;
  1231. if (!interval) {
  1232. this.startInterval(); // 组件挂载后开始间隔
  1233. }else{
  1234. this.intervalReady=true
  1235. }
  1236. }
  1237. }).catch(error => {
  1238. uni.showToast({
  1239. title: error,
  1240. icon: "none"
  1241. })
  1242. })
  1243. },
  1244. getPlatformRevenue(){
  1245. if(this.companyId==''&&this.companyList.length>1&&this.datacompanyInfo.type=='2'){
  1246. }else{
  1247. return
  1248. }
  1249. var queryDate =parseUnixTime(new Date(), '{y}-{m}-1');
  1250. API.platformRevenue({
  1251. queryDate:queryDate
  1252. }).then((response) => {
  1253. this.platformRevenueList=response.data.companyInfoList
  1254. }).catch(error => {
  1255. uni.showToast({
  1256. title: error,
  1257. icon: "none"
  1258. })
  1259. })
  1260. },
  1261. // 累计报警
  1262. getDeviceStatus() {
  1263. API.deviceStatus({
  1264. companyId: this.companyId
  1265. }).then((response) => {
  1266. this.utabsone=true
  1267. this.alarmsForm = response.data;
  1268. if (this.alarmsForm.okNum != 0) {
  1269. this.alarmsPercent = this.alarmsForm.okNum / (this.alarmsForm.okNum + this.alarmsForm
  1270. .errorNum) * 100;
  1271. }
  1272. }).catch(error => {
  1273. uni.showToast({
  1274. title: error,
  1275. icon: "none"
  1276. })
  1277. })
  1278. },
  1279. // 故障类型
  1280. getBarCharts() {
  1281. if (!this.myBarChart) {
  1282. this.myBarChart = echarts.init(document.getElementById('barEcharts-statistics'),null,{
  1283. width:uni.upx2px(620),height:uni.upx2px(740)
  1284. });
  1285. }
  1286. this.myBarChart.clear()
  1287. var data=[
  1288. {
  1289. name:"总表电量",
  1290. key:"parkKwh",
  1291. color:"#307af6"
  1292. },
  1293. {
  1294. name:"计费电量",
  1295. key:"chargeKwh",
  1296. color:"#52b8aa"
  1297. },
  1298. {
  1299. name:"自用电量",
  1300. key:"freeKwh",
  1301. color:"#53b56b"
  1302. },
  1303. {
  1304. name:"公用电量",
  1305. key:"publicKwh",
  1306. color:"#ef8132"
  1307. },
  1308. {
  1309. name:"电损量",
  1310. key:"lostKwh",
  1311. color:"#dc4441"
  1312. }
  1313. ]
  1314. var dataName=[]
  1315. var dataSeries=[]
  1316. for(var i in data){
  1317. var it=data[i]
  1318. dataName.push(it.name)
  1319. dataSeries.push({})
  1320. }
  1321. for(var i in data){
  1322. var it=data[i]
  1323. dataSeries[data.length-i-1]={
  1324. name:it.name,
  1325. type: 'bar',
  1326. itemStyle:{
  1327. color:it.color
  1328. },
  1329. data: [
  1330. this.homePageManageObj[it.key]
  1331. ],
  1332. coordinateSystem: 'polar',
  1333. label: {
  1334. show: true,
  1335. position: 'start',
  1336. formatter: '{c}度'
  1337. }
  1338. }
  1339. }
  1340. var option = {
  1341. polar: {
  1342. center:['50%','58%'],
  1343. radius:[25, '80%']
  1344. },
  1345. angleAxis: {
  1346. startAngle: 75,
  1347. label: {
  1348. rotate: 45, // 旋转标签,使得重叠的概率降低
  1349. // margin: 5 // 设置标签与轴线之间的距离,增加空间
  1350. }
  1351. },
  1352. legend: {
  1353. itemGap:5,
  1354. data: dataName,
  1355. //orient :'vertical'
  1356. },
  1357. radiusAxis: {
  1358. type: 'category',
  1359. data: ['']
  1360. },
  1361. tooltip: {},
  1362. series: dataSeries
  1363. };
  1364. console.log(option)
  1365. this.myBarChart.setOption(option);
  1366. },
  1367. toDataMonitoringList() {
  1368. uni.navigateTo({
  1369. url: '/pages/equipmentDataMonitoring/dataMonitoring-list'
  1370. })
  1371. },
  1372. toEquipmentConditionMonitoring() {
  1373. uni.navigateTo({
  1374. url: '/pages/equipmentInformation/equipmentConditionMonitoring?companyId='+this.companyId
  1375. })
  1376. },
  1377. toWorkOrderManagement() {
  1378. uni.navigateTo({
  1379. url: '/pages/workOrderManagement/workOrderManagement'
  1380. })
  1381. },
  1382. toEquipmentElectricity() {
  1383. uni.navigateTo({
  1384. url: '/pages/equipmentDataMonitoring/equipmentElectricity?companyId=' + this.companyId
  1385. })
  1386. },
  1387. toElectronicMonitoring(item) {
  1388. uni.navigateTo({
  1389. url: '/pages/equipmentDataMonitoring/electronicMonitoring?id=' + item.id + '&name=' + item
  1390. .name +
  1391. '&companyId=' + item.companyId
  1392. })
  1393. }
  1394. }
  1395. }
  1396. </script>
  1397. <style lang="scss" scoped>
  1398. .incomeExpenditureClass{
  1399. width: 100%;
  1400. padding:16rpx 0;
  1401. .incomeRow{
  1402. display: flex;
  1403. justify-content: space-evenly;
  1404. }
  1405. .income1:last-child{
  1406. .income11,.income12{
  1407. border-right: 1px solid #c5c3c3;
  1408. }
  1409. }
  1410. .income1{
  1411. .income121{
  1412. font-size: 24rpx;
  1413. color:#c5c3c3;
  1414. }
  1415. width: 50%;
  1416. text-align: center;
  1417. .income11{
  1418. padding:12rpx 0;
  1419. background-color: #1677FF ;
  1420. color:#fff;
  1421. font-size: 32rpx;
  1422. border-top: 1px solid #c5c3c3;
  1423. border-left: 1px solid #c5c3c3;
  1424. }
  1425. .income12{
  1426. padding:12rpx 0;
  1427. border-top: 1px solid #c5c3c3;
  1428. border-bottom: 1px solid #c5c3c3;
  1429. border-left: 1px solid #c5c3c3;
  1430. font-size: 40rpx;
  1431. }
  1432. }
  1433. }
  1434. /deep/.u-drawer-content {
  1435. margin-top: 88rpx;
  1436. }
  1437. .popup-tabs {
  1438. background-color: #fff;
  1439. display: flex;
  1440. align-items: center;
  1441. justify-content: space-between;
  1442. padding-top: 32rpx;
  1443. padding-right: 32rpx;
  1444. color: rgba(51, 51, 51, 1);
  1445. font-size: 32rpx;
  1446. .tabs {
  1447. width: 88%;
  1448. }
  1449. }
  1450. // /deep/.u-tab-item {
  1451. // width: 25% !important;
  1452. // flex: none !important;
  1453. // }
  1454. .tabs-box{
  1455. .tabs-len-1{
  1456. }
  1457. .tabs-len-2{
  1458. /deep/.u-tab-item {
  1459. // max-width: 39% !important;
  1460. // flex: none !important;
  1461. }
  1462. }
  1463. .tabs-len-3{
  1464. /deep/.u-tab-item {
  1465. max-width: 39% !important;
  1466. flex: none !important;
  1467. }
  1468. }
  1469. .tabs-len-4{
  1470. /deep/.u-tab-item {
  1471. max-width: 26% !important;
  1472. flex: none !important;
  1473. }
  1474. }
  1475. .tabs{
  1476. /deep/.u-tab-item:first-child {
  1477. width: 20% !important;
  1478. flex: none !important;
  1479. }
  1480. }
  1481. }
  1482. // /deep/.u-tab-item2 {
  1483. // width: 33% !important;
  1484. // flex: none !important;
  1485. // }
  1486. .tabs-options {
  1487. display: flex;
  1488. padding: 24rpx 32rpx 0;
  1489. flex-wrap: wrap;
  1490. .item {
  1491. width: 25%;
  1492. margin-bottom: 40rpx;
  1493. }
  1494. }
  1495. // 导航栏
  1496. .navbar {
  1497. background-color: rgba(22, 119, 255, 1);
  1498. color: #fff;
  1499. line-height: 88rpx;
  1500. display: flex;
  1501. justify-content: space-between;
  1502. align-items: center;
  1503. padding: 0 32rpx;
  1504. color: rgba(255, 255, 255, 1);
  1505. font-size: 36rpx;
  1506. position: fixed;
  1507. left: 0;
  1508. right: 0;
  1509. top: 0;
  1510. z-index: 999999;
  1511. font-weight: bold;
  1512. .title{
  1513. overflow: hidden;
  1514. white-space: nowrap;
  1515. text-overflow: ellipsis;
  1516. }
  1517. .img {
  1518. width: 48rpx;
  1519. height: 48rpx;
  1520. vertical-align: middle;
  1521. }
  1522. }
  1523. // 标签
  1524. .tabs-box {
  1525. padding: 32rpx 0;
  1526. margin-top: 88rpx;
  1527. padding-right: 32rpx;
  1528. background-color: rgba(22, 119, 255, 1);
  1529. display: flex;
  1530. align-items: center;
  1531. justify-content: space-between;
  1532. .tabs {
  1533. width: 97%;
  1534. }
  1535. .more{
  1536. padding-right: 12rpx;
  1537. }
  1538. }
  1539. .main {
  1540. border-radius: 16px 16px 0px 0px;
  1541. background: linear-gradient(180deg, rgba(242, 244, 246, 1) 61%, rgba(255, 255, 255, 0) 100%);
  1542. margin-top: -24rpx;
  1543. padding: 32rpx;
  1544. .statistics {
  1545. border-radius: 8px;
  1546. background-color: rgba(255, 255, 255, 1);
  1547. box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
  1548. margin-bottom: 24rpx;
  1549. padding: 40rpx;
  1550. .title {
  1551. display: flex;
  1552. align-items: center;
  1553. margin-bottom: 20rpx;
  1554. .img {
  1555. width: 36rpx;
  1556. height: 36rpx;
  1557. vertical-align: middle;
  1558. border-radius: 999px;
  1559. }
  1560. .change {
  1561. display: flex;
  1562. align-items: center;
  1563. .change-img {
  1564. width: 32rpx;
  1565. height: 32rpx;
  1566. vertical-align: middle;
  1567. }
  1568. text {
  1569. margin-left: 8rpx;
  1570. }
  1571. }
  1572. .text {
  1573. color: rgba(16, 16, 16, 1);
  1574. font-size: 36rpx;
  1575. margin-left: 16rpx;
  1576. font-weight: bold;
  1577. }
  1578. .change {
  1579. margin-left: 16rpx;
  1580. font-size: 24rpx;
  1581. color: #838383;
  1582. }
  1583. .check-all {
  1584. margin-left: auto;
  1585. color: rgba(131, 131, 131, 1);
  1586. font-size: 24rpx;
  1587. }
  1588. }
  1589. }
  1590. // 用电量
  1591. .statistics-e {
  1592. padding: 40rpx;
  1593. .electricity {
  1594. background-color: #fff;
  1595. .item:last-of-type {
  1596. border: none;
  1597. padding-bottom: 0;
  1598. }
  1599. .item {
  1600. padding: 16rpx 0;
  1601. display: flex;
  1602. align-items: center;
  1603. justify-content: space-between;
  1604. border-bottom: 1px solid rgba(245, 245, 245, 1);
  1605. .item-content {
  1606. width: 93%;
  1607. }
  1608. .equipment {
  1609. display: flex;
  1610. align-items: center;
  1611. .equipment1 {
  1612. color: rgba(51, 51, 51, 1);
  1613. font-size: 32rpx;
  1614. max-width: 40%;
  1615. font-weight: bold;
  1616. white-space: nowrap;
  1617. overflow: hidden;
  1618. text-overflow: ellipsis;
  1619. }
  1620. .equipment2 {
  1621. color: rgba(119, 119, 119, 1);
  1622. margin-left: 16rpx;
  1623. max-width: 40%;
  1624. white-space: nowrap;
  1625. overflow: hidden;
  1626. text-overflow: ellipsis;
  1627. }
  1628. }
  1629. // 状态
  1630. .state {
  1631. white-space: pre;
  1632. //width: 64rpx;
  1633. //height: 36rpx;
  1634. padding: 0 4rpx;
  1635. line-height: 36rpx;
  1636. border-radius: 8rpx;
  1637. font-size: 22rpx;
  1638. text-align: center;
  1639. border: 1px solid rgba(255, 123, 0, 1);
  1640. color: rgba(255, 123, 0, 1);
  1641. margin-left: auto;
  1642. // .dot {
  1643. // margin-right: 8rpx;
  1644. // width: 16rpx;
  1645. // height: 16rpx;
  1646. // background-color: rgba(255, 123, 0, 1);
  1647. // border-radius: 999px;
  1648. // margin-left: auto;
  1649. // }
  1650. }
  1651. .state2 {
  1652. border: 1px solid rgba(0, 185, 98, 1);
  1653. color: rgba(0, 185, 98, 1);
  1654. }
  1655. .electricity {
  1656. display: flex;
  1657. justify-content: space-between;
  1658. align-items: center;
  1659. margin-top: 8rpx;
  1660. text-align: center;
  1661. .electricity-item {
  1662. display: flex;
  1663. align-items: center;
  1664. width: 33.3%;
  1665. height: 40rpx;
  1666. line-height: 40rpx;
  1667. .number {
  1668. color: rgba(51, 51, 51, 1);
  1669. font-weight: bold;
  1670. font-size: 24rpx;
  1671. margin-left: 8rpx;
  1672. }
  1673. .date {
  1674. color: rgba(119, 119, 119, 1);
  1675. font-size: 24rpx;
  1676. }
  1677. }
  1678. }
  1679. }
  1680. }
  1681. }
  1682. // 统计1
  1683. .statistics-1 {
  1684. background-color: rgba(255, 255, 255, 1);
  1685. width: 100%;
  1686. padding: 24rpx;
  1687. box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
  1688. border-radius: 8px;
  1689. margin-bottom: 24rpx;
  1690. .item {
  1691. margin-top: 32rpx;
  1692. display: flex;
  1693. align-items: center;
  1694. .item-progess {
  1695. display: flex;
  1696. align-items: center;
  1697. .img {
  1698. width: 88rpx;
  1699. height: 88rpx;
  1700. margin-right: 24rpx;
  1701. vertical-align: middle;
  1702. }
  1703. }
  1704. .total {
  1705. margin-left: 24rpx;
  1706. color: rgba(119, 119, 119, 1);
  1707. .total1 {
  1708. display: flex;
  1709. color: rgba(51, 51, 51, 1);
  1710. font-size: 32rpx;
  1711. font-weight: bold;
  1712. .normal {
  1713. margin-bottom: 12rpx;
  1714. }
  1715. }
  1716. .total2 {
  1717. color: rgba(119, 119, 119, 1);
  1718. }
  1719. .abnormal {
  1720. margin-left: 24rpx;
  1721. }
  1722. }
  1723. .total-number {
  1724. color: rgba(255, 123, 0, 1);
  1725. margin: 0 8rpx;
  1726. font-weight: bold;
  1727. }
  1728. }
  1729. }
  1730. // 统计2异常报警记录
  1731. .statistics-2 {
  1732. .abnormal-item:last-of-type {
  1733. border-bottom: none !important;
  1734. padding-bottom: 0;
  1735. }
  1736. .abnormal-item {
  1737. display: flex;
  1738. justify-content: space-between;
  1739. align-items: center;
  1740. padding: 16rpx;
  1741. border-bottom: 1px solid rgba(245, 245, 245, 1);
  1742. .item-title {
  1743. color: rgba(51, 51, 51, 1);
  1744. .img {
  1745. width: 32rpx;
  1746. height: 32rpx;
  1747. margin-right: 8rpx;
  1748. }
  1749. .name {
  1750. color: rgba(51, 51, 51, 1);
  1751. font-weight: bold;
  1752. }
  1753. .date {
  1754. color: rgba(119, 119, 119, 1);
  1755. font-size: 24rpx;
  1756. }
  1757. }
  1758. .item-value {
  1759. text-align: right;
  1760. display: flex;
  1761. align-items: center;
  1762. .more {
  1763. margin-left: 8rpx;
  1764. }
  1765. .value1 {
  1766. font-weight: bold;
  1767. color: rgba(51, 51, 51, 1);
  1768. }
  1769. .value2 {
  1770. color: rgba(119, 119, 119, 1);
  1771. font-size: 24rpx;
  1772. }
  1773. }
  1774. }
  1775. }
  1776. .statistics-3 {
  1777. }
  1778. .statistics-4 {
  1779. }
  1780. // 异常设备排名
  1781. .statistics-ranking {
  1782. .total {
  1783. color: rgba(16, 16, 16, 1);
  1784. padding-left: 52rpx;
  1785. text {
  1786. color: #1677FF;
  1787. padding: 0 8rpx;
  1788. }
  1789. }
  1790. .ranking-main {
  1791. margin-top: 40rpx;
  1792. border-radius: 16px;
  1793. background-color: #fff;
  1794. .item:last-of-type {
  1795. margin-bottom: 0;
  1796. }
  1797. .item {
  1798. display: flex;
  1799. align-items: center;
  1800. margin-bottom: 32rpx;
  1801. .ranking {
  1802. color: rgba(16, 16, 16, 1);
  1803. font-weight: bold;
  1804. }
  1805. .icon {
  1806. width: 72rpx;
  1807. height: 72rpx;
  1808. border-radius: 4px;
  1809. background-color: rgba(219, 234, 255, 1);
  1810. display: flex;
  1811. align-items: center;
  1812. justify-content: center;
  1813. margin-left: 24rpx;
  1814. .img {
  1815. width: 48rpx;
  1816. height: 48rpx;
  1817. }
  1818. }
  1819. .name {
  1820. margin-left: 16rpx;
  1821. .name1 {
  1822. color: rgba(51, 51, 51, 1);
  1823. font-weight: bold;
  1824. }
  1825. .name2 {
  1826. color: rgba(119, 119, 119, 1);
  1827. font-size: 24rpx;
  1828. margin-top: 4rpx;
  1829. }
  1830. }
  1831. .time {
  1832. color: rgba(16, 16, 16, 1);
  1833. margin-left: auto;
  1834. font-weight: bold;
  1835. }
  1836. }
  1837. }
  1838. // 查看全部排名
  1839. .check-all {
  1840. text-align: center;
  1841. color: rgba(119, 119, 119, 1);
  1842. font-size: 12px;
  1843. }
  1844. }
  1845. // 能源管理
  1846. .statistics-manage {
  1847. padding: 40rpx 0;
  1848. .title,
  1849. .chart,
  1850. .search,
  1851. .meter-statistic {
  1852. padding: 0 32rpx;
  1853. }
  1854. // 图表
  1855. .chart {
  1856. padding-top: 32rpx;
  1857. border-top: 1px solid rgba(242, 242, 242, 1);
  1858. /deep/.u-subsection {
  1859. padding: 2px;
  1860. }
  1861. /deep/.u-item {
  1862. padding: 0;
  1863. font-size: 24rpx
  1864. }
  1865. .chat-box {
  1866. //margin-top: 24rpx;
  1867. width: 100%;
  1868. //height: 480rpx;
  1869. img {
  1870. width: 100%;
  1871. height: 100%;
  1872. }
  1873. }
  1874. }
  1875. .search {
  1876. border-top: 1px solid rgba(242, 242, 242, 1);
  1877. border-bottom: 1px solid rgba(242, 242, 242, 1);
  1878. display: flex;
  1879. align-items: center;
  1880. justify-content: space-between;
  1881. padding: 40rpx 32rpx;
  1882. .switch {
  1883. display: flex;
  1884. align-items: center;
  1885. text {
  1886. margin-left: 8rpx;
  1887. color: rgba(51, 51, 51, 1);
  1888. }
  1889. }
  1890. .search-box {
  1891. border-radius: 50px;
  1892. background-color: rgba(242, 244, 246, 1);
  1893. color: rgba(136, 136, 136, 1);
  1894. height: 56rpx;
  1895. line-height: 56rpx;
  1896. padding-left: 16rpx;
  1897. padding-right: 8rpx;
  1898. flex: 1;
  1899. margin-left: 28rpx;
  1900. display: flex;
  1901. align-items: center;
  1902. justify-content: space-between;
  1903. uni-input {
  1904. height: 56rpx;
  1905. line-height: 56rpx !important;
  1906. font-size: 28rpx;
  1907. width: 75%;
  1908. }
  1909. .icon {
  1910. display: flex;
  1911. align-items: center;
  1912. justify-content: center;
  1913. width: 64rpx;
  1914. height: 40rpx;
  1915. border-radius: 50px;
  1916. background-color: rgba(22, 119, 255, 1);
  1917. }
  1918. }
  1919. }
  1920. }
  1921. // 电表统计
  1922. .meter-statistic {
  1923. margin-top: 32rpx;
  1924. .meter-statistic-main{
  1925. display: flex;
  1926. align-items: center;
  1927. }
  1928. .sum {
  1929. .meter-name {
  1930. color: rgba(51, 51, 51, 1);
  1931. font-size: 32rpx;
  1932. margin-left: 8rpx;
  1933. font-weight: bold;
  1934. }
  1935. .icon {
  1936. margin-right: 8rpx;
  1937. img {
  1938. width: 40rpx;
  1939. height: 40rpx;
  1940. vertical-align: middle;
  1941. }
  1942. }
  1943. .meter-state {
  1944. margin-left: 8rpx;
  1945. width: 64rpx;
  1946. height: 36rpx;
  1947. line-height: 36rpx;
  1948. border-radius: 4px;
  1949. background-color: rgba(255, 255, 255, 1);
  1950. color: rgba(0, 185, 98, 1);
  1951. font-size: 22rpx;
  1952. text-align: center;
  1953. border: 1px solid rgba(0, 185, 98, 1);
  1954. }
  1955. .meter-state2 {
  1956. border: 1px solid rgba(255, 123, 0, 1);
  1957. color: rgba(255, 123, 0, 1);
  1958. }
  1959. .meter-number {
  1960. margin-left: auto;
  1961. color: rgba(51, 51, 51, 1);
  1962. font-size: 32rpx;
  1963. /deep/.u-icon--right {
  1964. margin-left: 8rpx;
  1965. }
  1966. }
  1967. }
  1968. .sum2 {
  1969. padding: 0 32rpx;
  1970. margin-top: 8rpx;
  1971. display: flex;
  1972. align-items: center;
  1973. justify-content: space-between;
  1974. .title {
  1975. color: rgba(119, 119, 119, 1);
  1976. }
  1977. .value {
  1978. color: rgba(119, 119, 119, 1);
  1979. }
  1980. }
  1981. // 一级表
  1982. .first-level {
  1983. padding-left: 16rpx;
  1984. margin-top: 20rpx;
  1985. .meter-name {
  1986. font-size: 28rpx
  1987. }
  1988. }
  1989. .first-level-list{
  1990. width: 100%;
  1991. display: flex;
  1992. align-items: center;
  1993. }
  1994. // 二级表
  1995. .second-level {
  1996. padding-left: 32rpx;
  1997. margin-top: 20rpx;
  1998. .meter-name {
  1999. font-size: 24rpx
  2000. }
  2001. }
  2002. .else-switch {
  2003. padding-left: 72rpx;
  2004. .meter-name {
  2005. font-size: 24rpx
  2006. }
  2007. .item {
  2008. margin-top: 24rpx;
  2009. }
  2010. }
  2011. }
  2012. }
  2013. /deep/.u-drawer {
  2014. z-index: 999 !important;
  2015. }
  2016. .contractList{
  2017. font-weight: bold;
  2018. .contractListClass{
  2019. display: flex;
  2020. margin-top:24rpx;
  2021. justify-content: space-between;
  2022. color: rgba(51,51,51,1);
  2023. .img{
  2024. width: 32rpx;
  2025. height: 32rpx;
  2026. margin-right: 18rpx;
  2027. }
  2028. .contractListClass1{
  2029. display: flex;
  2030. align-items: center;
  2031. }
  2032. .tenantListNum{
  2033. margin: 0 8rpx;
  2034. color:#FF7B00 ;
  2035. }
  2036. }
  2037. }
  2038. .statistics-3 {
  2039. .contractListClass{
  2040. .contractListClass1{
  2041. display: block;
  2042. .class1{
  2043. font-size: 28rpx;
  2044. color: rgba(51,51,51,1);
  2045. }
  2046. .class2{
  2047. font-size: 24rpx;
  2048. color: rgba(119,119,119,1);
  2049. }
  2050. }
  2051. .contractListClass2{
  2052. font-size: 40rpx;
  2053. color: rgba(16,16,16,1);
  2054. font-weight: bold;
  2055. display: flex;
  2056. align-items: center;
  2057. }
  2058. }
  2059. }
  2060. .statistics-4 {
  2061. }
  2062. .electronicMonitoring-title2{
  2063. margin-bottom: 16rpx;
  2064. }
  2065. .electronicMonitoring-title{
  2066. display: flex;
  2067. margin: 0px 32rpx;
  2068. justify-content: space-between;
  2069. }
  2070. .current-123{
  2071. .electronicMonitoring-title{
  2072. margin: 8rpx 0rpx 32rpx 0;
  2073. }
  2074. }
  2075. .electronicMonitoring-123{
  2076. }
  2077. </style>