|
|
@@ -1,2344 +1,2344 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <u-picker-select title="日期选择" v-model="tabsFrom.show2" :defaultTime="tabsFrom.show2Index" :endYear="endYear"
|
|
|
- mode="time" :params="params" :noselect="false" @confirm="selector2confirm" @cancel="selector2cancel"
|
|
|
- @reset="selector2reset">
|
|
|
- </u-picker-select>
|
|
|
-
|
|
|
- <!-- 导航栏 -->
|
|
|
- <view class="navbar">
|
|
|
- <view class="title" v-if="companyInfotype==4">
|
|
|
- 能源管理
|
|
|
- <span style="padding-left: 4px;" >
|
|
|
- |
|
|
|
- </span>
|
|
|
- <span style="padding-left: 4px;" >
|
|
|
- {{companyInfo.name}}
|
|
|
- </span>
|
|
|
- </view>
|
|
|
- <view class="title" v-else>
|
|
|
- 能源管理
|
|
|
- <span style="padding-left: 4px;" v-if="companyList.length>1&¤t!=0">
|
|
|
- |
|
|
|
- </span>
|
|
|
- <span style="padding-left: 4px;" v-if="companyList.length>1&¤t!=0">
|
|
|
-
|
|
|
- <template v-if="kWhList.length==1">
|
|
|
- {{kWhList[0].name}}
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- {{merchantList1[current].name}}
|
|
|
- </template>
|
|
|
- </span>
|
|
|
- <span style="padding-left: 4px;" v-if="companyList.length==1">
|
|
|
- |
|
|
|
- </span>
|
|
|
- <span style="padding-left: 4px;" v-if="companyList.length==1">
|
|
|
-
|
|
|
- <template v-if="kWhList.length==1">
|
|
|
- {{kWhList[0].name}}
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- {{companyList[0].name}}
|
|
|
- </template>
|
|
|
- </span>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="tabs-box tabs-box2" v-if="companyInfotype==4&&readingMeterNum&&monitorMeterNum" >
|
|
|
-
|
|
|
- <view class="tabs2" :class="'tabs-len-2'"
|
|
|
- :style="{width: '100%', }">
|
|
|
- <u-tabs-one :gutter="32"
|
|
|
- :list="companyInfotypeList" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
|
|
|
- bg-color="#1677FF" :current="1" @change="companyInfotypeChange"></u-tabs-one>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 标签 -->
|
|
|
- <view class="tabs-box" v-else >
|
|
|
-
|
|
|
- <view class="tabs" :class="'tabs-len-'+merchantList1.length" v-show="companyList.length>1"
|
|
|
- :style="{width: companyList.length>3 ? '' : '100%'}">
|
|
|
- <u-tabs-one v-if="utabsone"
|
|
|
- :list="merchantList1" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
|
|
|
- bg-color="#1677FF" :current="current" @change="change"></u-tabs-one>
|
|
|
- </view>
|
|
|
- <view class="more" @click="popShow=true" v-if="companyList.length >= 4">
|
|
|
- <u-icon name="arrow-down" color="#fff" size="40"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 标签弹出层 -->
|
|
|
- <u-popup v-model="popShow" duration="10" mode="top" :negative-top="88" border-radius="16">
|
|
|
- <view class="popup-tabs">
|
|
|
- <view class="tabs">
|
|
|
- <u-tabs :list="merchantList1" :is-scroll="false" :current="current" @change="change"></u-tabs>
|
|
|
- </view>
|
|
|
- <view class="more">
|
|
|
- <u-icon name="arrow-up" color="#777777" size="40" @click="popShow=false"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="tabs-options">
|
|
|
- <view class="item" v-for="(item, index) in merchantList2" :key="index"
|
|
|
- @click="merchantChange(item,index)">
|
|
|
- {{item.name}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </u-popup>
|
|
|
- <view class="main electronicMonitoring-123" v-show="kWhList.length==1" style="padding: 0;">
|
|
|
-
|
|
|
- <electronicMonitoring v-show="kWhList.length" :ref="'refMyEm'+companyId"></electronicMonitoring>
|
|
|
-
|
|
|
- <u-divider :isnone="kWhList.length==0" nonetext="暂无数据" border-color="#CFD2D5">已经到底了</u-divider>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="main current-123" v-show="(kWhList.length!=1)">
|
|
|
- <!-- 电表运行情况 -->
|
|
|
- <view class="statistics-1 statistics">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 电表运行情况
|
|
|
- </view>
|
|
|
- <view class="check-all" @click="toEquipmentConditionMonitoring">
|
|
|
- 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="item">
|
|
|
- <view class="item-progess">
|
|
|
- <view class="img-box">
|
|
|
- <u-circle-progress active-color="#2979ff" :percent="alarmsPercent" width="66">
|
|
|
- </u-circle-progress>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <!-- 累计 -->
|
|
|
- <view class="total">
|
|
|
- <view class="total1">
|
|
|
- <view class="normal">
|
|
|
- 正常 <span style="color: #19be6b;margin: 0 8rpx;">{{alarmsForm.okNum}}</span> 台
|
|
|
- </view>
|
|
|
- <view class="abnormal">
|
|
|
- 异常 <span style="color: red;margin: 0 8rpx;" >{{alarmsForm.errorNum}}</span> 台
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="total2" v-if="0">
|
|
|
- 本月累计触发告警 <text class="total-number">{{alarmsForm.errorMonthNum}}</text> 次
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="">
|
|
|
- <!-- 电表运行情况 -->
|
|
|
- <view class="statistics-1 statistics" v-show="current==0&&codes&&codes.indexOf('property')!=-1&&(tenantListNum0)">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 租户管理预警
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class=" contractList">
|
|
|
- <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=1')">
|
|
|
- <view class="contractListClass1">
|
|
|
- <image class="img" src="@/assets/img/riLine-wallet-2-line.svg"></image>
|
|
|
- 账户余额不足 <span class="tenantListNum">{{tenantListNum1}}</span> 家
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="contractListClass2">
|
|
|
- <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=2')">
|
|
|
- <view class="contractListClass1">
|
|
|
- <!-- <image class="img" src="@/assets/img/riLine-time-line2.svg"></image> -->
|
|
|
- <u-icon name="warning" class="img" size="32" color="#ef8132"></u-icon>
|
|
|
- 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum2}}</span> 家<span>（即将到期）</span>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="contractListClass2">
|
|
|
- <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=3')">
|
|
|
- <view class="contractListClass1">
|
|
|
- <image class="img" src="@/assets/img/riLine-time-line2.svg"></image>
|
|
|
- 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum3}}</span> 家<span>（已到期）</span>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="contractListClass2">
|
|
|
- <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 能源管理 -->
|
|
|
- <view v-show="companyId" class="statistics statistics-manage">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 能源管理
|
|
|
- </view>
|
|
|
- <view class="check-all" @click="toEquipmentElectricity">
|
|
|
- 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="content"
|
|
|
- style="display: flex;justify-content: center;margin: 40px 0;"
|
|
|
- v-if="!getHomePageManageshowLoading">
|
|
|
-
|
|
|
- <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
|
|
|
- <i class="uni-icon_toast uni-loading"
|
|
|
- style="
|
|
|
- width: 80rpx;
|
|
|
- height: 80rpx;
|
|
|
-
|
|
|
- "
|
|
|
- ></i><p class="uni-toast__content"> </p>加载中...</div>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="content" v-else-if="getHomePageManageshowLoading&&meterList.length == 0">
|
|
|
- <u-divider :isnone="true" nonetext="无记录"
|
|
|
- border-color="#fff"></u-divider>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 图表 -->
|
|
|
- <view class="chart" v-show="getHomePageManageshowLoading">
|
|
|
- <view class="u-subsection">
|
|
|
- <u-subsection :list="list" :current="homePageManageType" @change="sectionChange"
|
|
|
- font-size="24"></u-subsection>
|
|
|
- </view>
|
|
|
- <view class="incomeExpenditureClass" v-show="companyType!=4&&homePageManageObj.showPark" >
|
|
|
- <view class="income1">
|
|
|
- <view class="income11">
|
|
|
- 电费收入 (元)
|
|
|
- </view>
|
|
|
- <view class="income12">
|
|
|
- {{incomeExpenditureObj.incomeFee}}
|
|
|
- <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="income1">
|
|
|
- <view class="income11">
|
|
|
- 电费支出 (元)
|
|
|
- </view>
|
|
|
- <view class="income12">
|
|
|
- {{incomeExpenditureObj.expenditureFee}}
|
|
|
- <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="income1">
|
|
|
- <view class="income11">
|
|
|
- 收支情况 (元)
|
|
|
- </view>
|
|
|
- <view class="income12" :style="incomeExpenditureObj.differenceFee>=0?'color:red':'color:#52b8aa'">
|
|
|
- {{incomeExpenditureObj.differenceFee}}
|
|
|
- <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="chat-box" id="barEcharts-statistics" v-show="companyType!=4&&homePageManageObj.showPark">
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="search" v-if="false">
|
|
|
- <view class="switch">
|
|
|
- <u-switch v-model="checked" size="40"></u-switch><text>只看离线表</text>
|
|
|
- </view>
|
|
|
- <view class="search-box">
|
|
|
- <input type="text" placeholder="请输入电表查询" />
|
|
|
- <view class="icon">
|
|
|
- <img src="@/assets/img/riLine-search-line 1.svg" alt="" />
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 电表统计 -->
|
|
|
- <Tree-Body :meterList="meterList" ref="mytree"
|
|
|
- :showPark="homePageManageObj.showPark"
|
|
|
- @query="getHomePageManageChildMeter"
|
|
|
- v-if="getHomePageManageReady"
|
|
|
- :role="codes&&codes.indexOf('switch')!=-1"
|
|
|
- @switchBtn="switchBtnApi"
|
|
|
- ></Tree-Body>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
- <!-- 用电量 -->
|
|
|
- <view class="statistics-e statistics" v-if="!companyId">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 用电量 (度)
|
|
|
- </view>
|
|
|
- <view class="check-all" @click="toEquipmentElectricity">
|
|
|
- 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="content" style="display: flex;justify-content: center;margin: 40px 0;"
|
|
|
- v-if="getHomePageKwhshowLoading">
|
|
|
-
|
|
|
- <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
|
|
|
- <i class="uni-icon_toast uni-loading"
|
|
|
- style="
|
|
|
- width: 80rpx;
|
|
|
- height: 80rpx;
|
|
|
-
|
|
|
- "
|
|
|
- ></i><p class="uni-toast__content"> </p>加载中...</div>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="content" v-else-if="!getHomePageKwhshowLoading&&kWhListHome.length == 0">
|
|
|
- <u-divider :isnone="true" nonetext="无记录"
|
|
|
- border-color="#fff"></u-divider>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="content" v-else >
|
|
|
- <view class="electricity">
|
|
|
-
|
|
|
- <view class="item" v-for="(item, index) in kWhListHome" :key="index"
|
|
|
- @click="toElectronicMonitoring(item)">
|
|
|
- <view class="item-content">
|
|
|
- <view class="equipment">
|
|
|
- <view class="equipment1 ">
|
|
|
- {{item.name}}
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="equipment2">
|
|
|
- {{item.installationAddressSimple}}
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <view class="state" v-if="!item.online">
|
|
|
- <!-- <view class="dot off-line"></view> -->
|
|
|
- <view class="text">离线</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="state state2" v-else>
|
|
|
- <!-- <view class="dot on-line"></view> -->
|
|
|
- <view class="text">在线</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="electricity">
|
|
|
- <view class="electricity-item electricity-item-day">
|
|
|
-
|
|
|
- <view class="date">
|
|
|
- 今日
|
|
|
- </view>
|
|
|
- <view class="number">
|
|
|
- {{item.thisDayKwh}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="electricity-item">
|
|
|
-
|
|
|
- <view class="date">
|
|
|
- 本月
|
|
|
- </view>
|
|
|
- <view class="number">
|
|
|
- {{item.thisMonthKwh}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="electricity-item">
|
|
|
-
|
|
|
- <view class="date">
|
|
|
- 上月
|
|
|
- </view>
|
|
|
- <view class="number">
|
|
|
- {{item.lastMonthKwh}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="more">
|
|
|
- <u-icon name="arrow-right" color="#d4d4d4" size="24"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 统计2 异常告警记录 -->
|
|
|
- <view class="statistics-2 statistics" v-if="codes&&codes.indexOf('property')!=-1" >
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 租户断电提醒
|
|
|
- </view>
|
|
|
- <view class="check-all" @click="gotoUrl('/pages/tenantList/remindList?id='+companyId)">
|
|
|
- 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <u-divider :isnone="abnormalRecordsList.length==0" nonetext="无记录"
|
|
|
- border-color="#fff"></u-divider>
|
|
|
- <!-- 异常 -->
|
|
|
- <view class="abnormal-item" v-for="(item,index) in abnormalRecordsList"
|
|
|
- :key="index"
|
|
|
-
|
|
|
- >
|
|
|
- <!-- @click="gotoUrl('/pages/abnormal/abnormalAlarmDetails?id='+item.id)"
|
|
|
- -->
|
|
|
- <view class="item-title">
|
|
|
-
|
|
|
- <view class="name">
|
|
|
- {{item.content}}
|
|
|
- </view>
|
|
|
- <view class="date" style="display: flex; justify-content: space-between;margin-top: 4rpx;">
|
|
|
- <view>{{item.title}}</view>
|
|
|
- <view>{{item.createTime}}</view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <!-- 异常设备排名 -->
|
|
|
- <view class="statistics statistics-ranking" v-if="false">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 异常设备排名
|
|
|
- </view>
|
|
|
- <view class="check-all">
|
|
|
- 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 合计 -->
|
|
|
- <view class="total">
|
|
|
- 本年度共有<text> 42</text>次设备异常告警
|
|
|
- </view>
|
|
|
- <view class="ranking-main">
|
|
|
- <view class="item" v-for="(item,i) in 3" :key="i"
|
|
|
- @click="gotoUrl('/pages/equipmentDataMonitoring/electronicMonitoring?id='+'&name=')">
|
|
|
- <view class="ranking">
|
|
|
- 1
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="name">
|
|
|
- <view class="name1">
|
|
|
- 荆鹏软件园01
|
|
|
- </view>
|
|
|
- <view class="name2">
|
|
|
- 荆鹏集团
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="time">
|
|
|
- 5次
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 查看全部排名 -->
|
|
|
- <!-- <view class="check-all" @click="gotoUrl('/pages/abnormal/abnormalDeviceRanking')">
|
|
|
- 查看全部排名 <u-icon name="arrow-down" size="24" color="rgba(119,119,119,1)"></u-icon>
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
-
|
|
|
- <energyCenterTabbar :current="0"></energyCenterTabbar>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-
|
|
|
- import {
|
|
|
- parseUnixTime,
|
|
|
- beforeTimeStamp,
|
|
|
- getWeek,newDate
|
|
|
- } from '@/apis/utils'
|
|
|
-
|
|
|
- import energyCenterTabbar from '@/components/energyCenterTabbar.vue'
|
|
|
- import electronicMonitoring from '@/pages/equipmentDataMonitoring/electronicMonitoring.vue'
|
|
|
-
|
|
|
-
|
|
|
- import * as echarts from 'echarts';
|
|
|
- import * as API_index from '@/apis/pagejs/index.js'
|
|
|
- import * as API_tenantList from '@/apis/pagejs/tenantList.js'
|
|
|
-
|
|
|
- import * as API from '@/apis/pagejs/energyManage.js'
|
|
|
- import TreeBody from '@/components/tree/tree-body.vue';
|
|
|
-
|
|
|
- export default {
|
|
|
- components: {
|
|
|
- energyCenterTabbar,TreeBody,electronicMonitoring
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- abnormalRecordsList: [], // 异常告警记录
|
|
|
- queryDate: '',
|
|
|
- queryDateMonth:"",
|
|
|
- alarmsPercent: 0,
|
|
|
- alarmsForm: {
|
|
|
- okNum: 0,
|
|
|
- errorNum: 0,
|
|
|
- errorMonthNum: 0
|
|
|
- }, // 累计报警
|
|
|
- companyId: '', // 商户ID
|
|
|
- pageIndexe: 1, // 设备数据检测
|
|
|
- totalPagee: 1,
|
|
|
- deviceList: [],
|
|
|
- pageIndexp: 1, // 用电量
|
|
|
- totalPagep: 1,
|
|
|
- kWhList: [],
|
|
|
- kWhListHome: [],
|
|
|
- codes: '', // 判断：reading用电量 detector设备数据检测
|
|
|
- merchantList1: [], // 商户
|
|
|
- merchantList2: [],
|
|
|
- companyList: [],
|
|
|
- companyInfo:{},
|
|
|
- companyInfotypeCurrent:1,
|
|
|
- companyInfotypeList:[
|
|
|
- {
|
|
|
- name: '变压器巡检仪'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '费控电表计量仪'
|
|
|
- }
|
|
|
- ],
|
|
|
- popShow: false,
|
|
|
- popShowtest: true,
|
|
|
- current: 0,
|
|
|
- myLineChart: null, // 图表
|
|
|
- myBarChart: null,
|
|
|
- myPieChart: null,
|
|
|
- intervalId: null, // 用于存储间隔ID
|
|
|
- intervalReady: false, // 用于存储间隔ID
|
|
|
- list: [{
|
|
|
- name: '上月',
|
|
|
- value: "2"
|
|
|
- },
|
|
|
- {
|
|
|
- name: '当月',
|
|
|
- value: "1"
|
|
|
- },
|
|
|
- {
|
|
|
- name: '今日',
|
|
|
- value: "4"
|
|
|
- }, {
|
|
|
- name: '当年',
|
|
|
-
|
|
|
- value: "3"
|
|
|
- }, {
|
|
|
- name: '合计',
|
|
|
-
|
|
|
- value: "0"
|
|
|
- },
|
|
|
- {
|
|
|
- name: '指定月份',
|
|
|
- value: "10"
|
|
|
- }
|
|
|
- ],
|
|
|
-
|
|
|
- checked: false,
|
|
|
- homePageManageType: 2,
|
|
|
- meterList: [],
|
|
|
- showPark:false,
|
|
|
- meterListShow:{},
|
|
|
- homePageManageObj: {
|
|
|
- chargeKwh: 0,
|
|
|
- lostKwh: 0,
|
|
|
- parkKwh: 0,
|
|
|
- freeKwh:0,
|
|
|
- publicKwh:0,
|
|
|
- },
|
|
|
- endYear: '',
|
|
|
- params: {
|
|
|
- year: true,
|
|
|
- month: true,
|
|
|
- day: true,
|
|
|
- hour: false,
|
|
|
- minute: false,
|
|
|
- second: false
|
|
|
- },
|
|
|
- value: '2',
|
|
|
- clickType: -1,
|
|
|
- tabsFrom: {
|
|
|
- show1: false,
|
|
|
- show1Index: 0,
|
|
|
- show2Index: '',
|
|
|
- show2: false,
|
|
|
- show1Text: "全部类型",
|
|
|
- show2Text: "全部时间",
|
|
|
-
|
|
|
- },
|
|
|
- getHomePageManageReady:false,
|
|
|
-
|
|
|
- utabsone:true,
|
|
|
- companyType:0,
|
|
|
- incomeExpenditureObj:{},
|
|
|
- getHomePageKwhshowLoading:false,
|
|
|
- getHomePageManageshowLoading:false,
|
|
|
- companyInfotype:0,
|
|
|
- readingMeterNum:0, //计量仪
|
|
|
- monitorMeterNum:0, //巡检仪
|
|
|
- tenantListNum0:0,
|
|
|
- tenantListNum1:0,
|
|
|
- tenantListNum2:0,
|
|
|
- tenantListNum3:0,
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- var date = new Date();
|
|
|
- var year = date.getFullYear();
|
|
|
- var month = date.getMonth() + 1 >= 10 ? date.getMonth() + 1 : '0' + (date.getMonth() + 1);
|
|
|
- this.queryDateMonth = year + '-' + month;
|
|
|
- this.endYear = new Date().getFullYear();
|
|
|
- this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
|
|
|
-
|
|
|
- this.getfindByOpenId();
|
|
|
- this.getCompanyInfoList();
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
- onReady() {
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
- onUnload(){
|
|
|
- this.clearTimer(); // 组件销毁前清除定时器
|
|
|
-
|
|
|
- console.log("组件销毁前清除定时器")
|
|
|
- },
|
|
|
-
|
|
|
- beforeDestroy() {
|
|
|
- this.clearTimer(); // 组件销毁前清除定时器
|
|
|
-
|
|
|
- console.log("组件销毁前清除定时器")
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- onHide(){
|
|
|
- this.intervalReady=false
|
|
|
- this.clearTimer();
|
|
|
- },
|
|
|
- onShow(){
|
|
|
- if(!this.intervalReady&&this.companyList.length>1){
|
|
|
- this.startInterval();
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- stateBl(timekey,day){
|
|
|
- var get=newDate(timekey)
|
|
|
- var time=new Date()
|
|
|
- if(!day){
|
|
|
-
|
|
|
- return time>get;
|
|
|
- }else{
|
|
|
-
|
|
|
- var get2=newDate(timekey)
|
|
|
- get2.setDate(get2.getDate() - day)
|
|
|
- console.log(timekey)
|
|
|
- return get2<time&&get>time;
|
|
|
- }
|
|
|
- },
|
|
|
- selectTypeMethod(tenant,selectType){
|
|
|
- var selectType1=this.selectType;
|
|
|
- if(selectType){
|
|
|
- selectType1=selectType;
|
|
|
- }
|
|
|
-
|
|
|
- // if(){
|
|
|
-
|
|
|
- // }
|
|
|
- if(true){
|
|
|
- var bl=false;
|
|
|
- for(var j in tenant.tenantContractList){
|
|
|
-
|
|
|
-
|
|
|
- var tenant1=tenant.tenantContractList[j]
|
|
|
- //console.log(tenant1.autoDeductFee)
|
|
|
- if(tenant1.autoDeductFee!=true){
|
|
|
- continue;
|
|
|
- }
|
|
|
- if(selectType1==0){
|
|
|
- return true
|
|
|
- }
|
|
|
- if(selectType1==1){
|
|
|
- return tenant.balance<tenant.minBalance
|
|
|
- }
|
|
|
- for(var k in tenant1.contractItemList){
|
|
|
-
|
|
|
- var item=tenant1.contractItemList[k]
|
|
|
- //console.log(item.prepaidEndTime)
|
|
|
-
|
|
|
- if(item.paymentMethod==1&&item.name!='电费'){
|
|
|
-
|
|
|
- if(selectType1==2){
|
|
|
- if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime,30)){
|
|
|
- bl=true;
|
|
|
- }
|
|
|
- }
|
|
|
- if(selectType1==3){
|
|
|
- if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime)){
|
|
|
- bl=true;
|
|
|
- }
|
|
|
- if(item.prepaidEndTime==null){
|
|
|
- bl=true;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- return bl
|
|
|
- }
|
|
|
- },
|
|
|
- getTenantList(){
|
|
|
- // uni.showLoading({
|
|
|
- // title: "加载中",
|
|
|
- // mask: true,
|
|
|
- // })
|
|
|
- API_tenantList.tenantContractList().then((response) => {
|
|
|
- uni.hideLoading();
|
|
|
- //this.getTenantListReady=true
|
|
|
- var tenantList=response.data.tenantInfoList;
|
|
|
- this.tenantListNum0=tenantList.length
|
|
|
-
|
|
|
- for(var i in tenantList){
|
|
|
- var obj=tenantList[i]
|
|
|
- if(this.selectTypeMethod(obj,1)){
|
|
|
- this.tenantListNum1++;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- if(this.selectTypeMethod(obj,2)){
|
|
|
- this.tenantListNum2++;
|
|
|
- }
|
|
|
- if(this.selectTypeMethod(obj,3)){
|
|
|
- this.tenantListNum3++;
|
|
|
- }
|
|
|
- }
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- //绑定权限
|
|
|
- getfindByOpenId() {
|
|
|
-
|
|
|
- API_index.findByOpenId({
|
|
|
- openId: this.carhelp.getOpenId()
|
|
|
- }).then((response) => {
|
|
|
- if(response.data&&response.data.companyInfo){
|
|
|
- this.companyInfo=response.data.companyInfo
|
|
|
- this.companyInfotype = response.data.companyInfo.type;
|
|
|
- if(this.companyInfotype==4){
|
|
|
- this.getFindMeterList()
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
- if(response.data){
|
|
|
- var token = response ? response.data.token : '';
|
|
|
- this.carhelp.setPersonInfo(response.data.regUser );
|
|
|
-
|
|
|
- this.carhelp.setToken(token);
|
|
|
- this.carhelp.setPersonInfoPlus(response.data);
|
|
|
-
|
|
|
- this.codes =response.data.regUser.codes
|
|
|
- if(this.codes&&this.codes.indexOf('property')!=-1){
|
|
|
- this.getTenantList()
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- getFindMeterList(){
|
|
|
-
|
|
|
- API.findMeterList().then((response) => {
|
|
|
- //readingMeterNum 计量仪 //monitorMeterNum 巡检仪
|
|
|
- this.readingMeterNum=response.data.readingMeterNum
|
|
|
- this.monitorMeterNum=response.data.monitorMeterNum
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- companyIdSet(val,item){
|
|
|
- this.companyType= 0
|
|
|
- if(val&&item){
|
|
|
- this.companyType= item.type
|
|
|
- }else{
|
|
|
- if(!val){
|
|
|
-
|
|
|
- }else{
|
|
|
- var bl=false
|
|
|
- this.companyList.find(item=>{
|
|
|
-
|
|
|
- if(item.id==val){
|
|
|
-
|
|
|
- this.companyType= item.type;
|
|
|
- }
|
|
|
- })
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
- switchBtnApiMethod(node,key){
|
|
|
- uni.showLoading({
|
|
|
- title: "加载中",
|
|
|
- mask: true,
|
|
|
- })
|
|
|
- API.remoteSwitch({
|
|
|
- meterId:node.id,
|
|
|
- enabled:key
|
|
|
- }).then((res) => {
|
|
|
- uni.hideLoading();
|
|
|
- node.switchStatus=key
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
-
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- switchBtnApi(node,key){
|
|
|
- uni.showModal({
|
|
|
- confirmColor:`${key?'#3CC51F':'red'}`,
|
|
|
- confirmText:`${key?'开启':'关闭'}`,
|
|
|
- content: `确认是否要"${key?'开启':'关闭'}"${node.name}`,
|
|
|
- title: "提示",
|
|
|
- success:res=> {
|
|
|
- if(res.confirm){
|
|
|
- this.switchBtnApiMethod(node,key);
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- console.log(node,key)
|
|
|
- },
|
|
|
- getIncomeExpenditure(){
|
|
|
-
|
|
|
- API.incomeExpenditure({
|
|
|
- //parentMeterId:item.id,
|
|
|
- queryDate:this.queryDate,
|
|
|
- companyId: this.companyId,
|
|
|
- type: this.list[this.homePageManageType].value
|
|
|
- }).then((response) => {
|
|
|
-
|
|
|
- this.incomeExpenditureObj=response.data
|
|
|
- this.incomeExpenditureObj.id=1
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- // 设备数据监测
|
|
|
- getHomePageManageChildMeter(item,bl) {
|
|
|
- if(!bl){
|
|
|
- // uni.showLoading({
|
|
|
- // title: "加载中",
|
|
|
- // mask: true,
|
|
|
- // })
|
|
|
- }
|
|
|
-
|
|
|
- API.homePageManageChildMeter({
|
|
|
- parentMeterId:item.id,
|
|
|
- queryDate:this.queryDate,
|
|
|
- companyId: this.companyId,
|
|
|
- type: this.list[this.homePageManageType].value
|
|
|
- }).then((response) => {
|
|
|
- // if(!bl){
|
|
|
- // uni.hideLoading();
|
|
|
- // }
|
|
|
- // this.meterList = response.data.meterList;
|
|
|
- // if(!this.meterListShow.id){
|
|
|
- // this.meterListShow.id=1
|
|
|
- // this.recursionList(this.meterList)
|
|
|
- // }
|
|
|
-
|
|
|
- var childMeterList=response.data.childMeterList
|
|
|
- item.childMeterList=childMeterList
|
|
|
-
|
|
|
-
|
|
|
- if(!bl){
|
|
|
- for(var i in childMeterList){
|
|
|
- var obj=childMeterList[i]
|
|
|
- this.getHomePageManageChildMeter(obj,true)
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- recursionList(list){
|
|
|
- if(list){
|
|
|
- for(var i in list){
|
|
|
- var obj=list[i]
|
|
|
-
|
|
|
- this.meterListShow[obj.id]=false
|
|
|
- this.recursionList(obj.childMeterList)
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- ifBtnShow(item){
|
|
|
- return this.meterListShow[item.id]
|
|
|
- },
|
|
|
- showBtn(item){
|
|
|
- var key=this.meterListShow[item.id];
|
|
|
-
|
|
|
- this.$set(this.meterListShow,item.id,!key)
|
|
|
- console.log("showBtn,",key)
|
|
|
-
|
|
|
- this.$forceUpdate()
|
|
|
- },
|
|
|
- selector2reset(e) {
|
|
|
- console.log(e)
|
|
|
- this.tabsFrom.show2Text = '全部时间'
|
|
|
- this.tabsFrom.show2Index = '';
|
|
|
-
|
|
|
- if (e.day) {
|
|
|
- this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
|
|
|
-
|
|
|
- this.getHomePageManage();
|
|
|
- } else {
|
|
|
-
|
|
|
- this.homePageManageType = this.clickType;
|
|
|
- if (this.homePageManageType != 5) {
|
|
|
- this.list[5].name = '指定月份';
|
|
|
- }
|
|
|
- this.getHomePageManage();
|
|
|
- }
|
|
|
- },
|
|
|
- selector2cancel() {
|
|
|
- if(this.clickType != -1) {
|
|
|
-
|
|
|
- }
|
|
|
- this.homePageManageType = this.clickType;
|
|
|
- },
|
|
|
- selector2confirm(e) {
|
|
|
- this.tabsFrom.show2Text = e.year + "年" + e.month + "月"
|
|
|
-
|
|
|
- this.tabsFrom.show2Index = e.year + "-" + e.month
|
|
|
- if (e.day) {
|
|
|
- this.tabsFrom.show2Text += e.day + "日"
|
|
|
- this.tabsFrom.show2Index += '-' + e.day
|
|
|
-
|
|
|
- this.queryDateMethod(this.tabsFrom.show2Index, true)
|
|
|
- } else {
|
|
|
- this.queryDateMethod(this.tabsFrom.show2Index, false)
|
|
|
- }
|
|
|
- },
|
|
|
- queryDateMethod(queryTime, day) {
|
|
|
-
|
|
|
- if (day) {
|
|
|
- this.queryDate = queryTime;
|
|
|
-
|
|
|
- } else {
|
|
|
-
|
|
|
- this.queryDate = queryTime + "-01";
|
|
|
-
|
|
|
- this.homePageManageType = "5";
|
|
|
- this.list[5].name = queryTime;
|
|
|
-
|
|
|
- this.getHomePageManage();
|
|
|
- }
|
|
|
- },
|
|
|
- clearTimer() {
|
|
|
- if (this.intervalId) {
|
|
|
- clearInterval(this.intervalId); // 清除定时器
|
|
|
- this.intervalId = null; // 重置定时器ID
|
|
|
- }
|
|
|
- },
|
|
|
- startInterval() {
|
|
|
- this.clearTimer(); // 组件销毁前清除定时器
|
|
|
-
|
|
|
-
|
|
|
- this.intervalId = setInterval(() => {
|
|
|
-
|
|
|
- this.getHomePageKwh('', true)
|
|
|
- }, 60000);
|
|
|
- },
|
|
|
- merchantChangeApi() {
|
|
|
- this.popShow=false
|
|
|
-
|
|
|
-
|
|
|
- if (this.companyId) {
|
|
|
-
|
|
|
- this.getHomePageKwh(this.companyId)
|
|
|
-
|
|
|
-
|
|
|
- }else{
|
|
|
- this.kWhList=[]
|
|
|
- this.getDeviceStatus()
|
|
|
- this.getAbnormalAlarmRecord();
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- companyInfotypeChange(index){
|
|
|
- if(index!=this.companyInfotypeCurrent){
|
|
|
- var url=""
|
|
|
- if(process.car.NODE_ENV=='dev'){
|
|
|
-
|
|
|
- url='http://localhost:8081/#/'
|
|
|
-
|
|
|
- }else if(process.car.NODE_ENV=='test'){
|
|
|
-
|
|
|
- url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric-test/#/'
|
|
|
-
|
|
|
- }else{
|
|
|
- url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric/#/'
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- window.location.href=url+"pages/statistics/statistics"
|
|
|
- }
|
|
|
- },
|
|
|
- change(index) {
|
|
|
- this.current = index;
|
|
|
- this.companyId = this.merchantList1[index].id;
|
|
|
- this.companyIdSet(this.companyId)
|
|
|
- this.merchantChangeApi()
|
|
|
- },
|
|
|
- merchantChange(item, index) {
|
|
|
- if(this.current==0){
|
|
|
- this.current=1;
|
|
|
- }
|
|
|
- var m = item;
|
|
|
- var n = this.merchantList1[this.current];
|
|
|
- this.merchantList1[this.current] = m;
|
|
|
- this.merchantList2[index] = n;
|
|
|
- //this.$forceUpdate()
|
|
|
- this.utabsone=false
|
|
|
- this.companyId = item.id;
|
|
|
- this.companyIdSet(this.companyId)
|
|
|
- this.merchantChangeApi()
|
|
|
- this.popShow = false;
|
|
|
- },
|
|
|
-
|
|
|
- getCompanyInfoList() {
|
|
|
- // uni.showLoading({
|
|
|
- // title: "加载中",
|
|
|
- // mask: true,
|
|
|
- // })
|
|
|
- API.deviceCompanyList().then((response) => {
|
|
|
- //uni.hideLoading();
|
|
|
- var list = response.data.companyInfoList;
|
|
|
-
|
|
|
- var mList1 = [];
|
|
|
- var mList2 = [];
|
|
|
-
|
|
|
- mList1.push({
|
|
|
- id: '',
|
|
|
- name: '全部'
|
|
|
- });
|
|
|
- for (var i = 0; i < list.length; i++) {
|
|
|
- if (i >= 3) {
|
|
|
- mList2.push(list[i]);
|
|
|
- } else {
|
|
|
- mList1.push(list[i]);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- this.companyList = list;
|
|
|
- if(list.length==1){
|
|
|
- this.companyId=list[0].id
|
|
|
- this.companyIdSet(this.companyId)
|
|
|
-
|
|
|
- }else{
|
|
|
- this.getHomePageKwh('')
|
|
|
- }
|
|
|
- this.merchantList1 = mList1;
|
|
|
- this.merchantList2 = mList2;
|
|
|
- this.merchantChangeApi()
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- sectionChange(index) {
|
|
|
- this.clickType = this.homePageManageType ;
|
|
|
- this.homePageManageType = index;
|
|
|
- if (index == 5) {
|
|
|
- this.tabsFrom.show2 = true;
|
|
|
- this.params.day = false;
|
|
|
- } else {
|
|
|
- this.list[5].name = '指定月份'
|
|
|
- this.getHomePageManage()
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- getHomePageManage(bl) {
|
|
|
- this.getHomePageManageReady=false
|
|
|
- if(bl){
|
|
|
- this.getHomePageManageshowLoading=false
|
|
|
-
|
|
|
- }else{
|
|
|
- uni.showLoading({
|
|
|
- title: "加载中",
|
|
|
- mask: true,
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- this.incomeExpenditureObj={}
|
|
|
- API.homePageManage({
|
|
|
- queryDate:this.queryDate,
|
|
|
- companyId: this.companyId,
|
|
|
- type: this.list[this.homePageManageType].value
|
|
|
- }).then((response) => {
|
|
|
- this.getHomePageManageReady=true
|
|
|
- if(bl){
|
|
|
-
|
|
|
- this.getHomePageManageshowLoading=true
|
|
|
- }else{
|
|
|
- uni.hideLoading();
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.meterList = response.data.meterList;
|
|
|
- //console.log(this.meterList)
|
|
|
- this.homePageManageObj = response.data;
|
|
|
- //this.$forceUpdate()
|
|
|
- if(this.companyType!=4&&this.homePageManageObj.showPark){
|
|
|
-
|
|
|
- this.myBarChart=null;
|
|
|
- this.$nextTick(()=>{
|
|
|
- this.getBarCharts()
|
|
|
- })
|
|
|
-
|
|
|
- this.getIncomeExpenditure();
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 异常告警记录
|
|
|
- getAbnormalAlarmRecord() {
|
|
|
- if(this.codes&&this.codes.indexOf('property')!=-1){
|
|
|
-
|
|
|
- }else{
|
|
|
- return
|
|
|
- }
|
|
|
- API.remindList({
|
|
|
- // queryDate: this.queryDateMonth,
|
|
|
- configId: '',
|
|
|
- pageIndex: 1,
|
|
|
- pageSize: 5,
|
|
|
- companyId: this.companyId
|
|
|
- }).then((response) => {
|
|
|
-
|
|
|
- this.abnormalRecordsList = response.data.data;
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- // 用电量
|
|
|
- getHomePageKwh( companyId,interval) {
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- if (!interval) {
|
|
|
- // uni.showLoading({
|
|
|
- // title: "加载中",
|
|
|
- // mask: true,
|
|
|
- // })
|
|
|
- this.getHomePageKwhshowLoading=true;
|
|
|
- }
|
|
|
- API.homePageKwh({
|
|
|
- pageIndex: 1,
|
|
|
- pageSize: 5,
|
|
|
- companyId:companyId
|
|
|
- }).then((response) => {
|
|
|
- if (!interval) {
|
|
|
- //uni.hideLoading();
|
|
|
- this.getHomePageKwhshowLoading=false;
|
|
|
- }
|
|
|
-
|
|
|
- if(companyId){
|
|
|
- this.kWhList = response.data.data;
|
|
|
- if(this.kWhList.length==1){
|
|
|
-
|
|
|
- var item=this.kWhList[0];
|
|
|
- this.$refs['refMyEm'+companyId].init({
|
|
|
- id:item.id,
|
|
|
- name:item.name,
|
|
|
- companyId:item.companyId,
|
|
|
- ref:1,
|
|
|
- })
|
|
|
- }else{
|
|
|
- this.getHomePageManage(1)
|
|
|
- this.getDeviceStatus()
|
|
|
- this.getAbnormalAlarmRecord();
|
|
|
- }
|
|
|
- }else{
|
|
|
- this.kWhListHome= response.data.data;
|
|
|
- if (!interval) {
|
|
|
- this.startInterval(); // 组件挂载后开始间隔
|
|
|
- }else{
|
|
|
- this.intervalReady=true
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 累计报警
|
|
|
- getDeviceStatus() {
|
|
|
-
|
|
|
- API.deviceStatus({
|
|
|
- companyId: this.companyId
|
|
|
- }).then((response) => {
|
|
|
- this.utabsone=true
|
|
|
- this.alarmsForm = response.data;
|
|
|
- if (this.alarmsForm.okNum != 0) {
|
|
|
- this.alarmsPercent = this.alarmsForm.okNum / (this.alarmsForm.okNum + this.alarmsForm
|
|
|
- .errorNum) * 100;
|
|
|
- }
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 故障类型
|
|
|
- getBarCharts() {
|
|
|
- if (!this.myBarChart) {
|
|
|
- this.myBarChart = echarts.init(document.getElementById('barEcharts-statistics'),null,{
|
|
|
- width:uni.upx2px(620),height:uni.upx2px(740)
|
|
|
- });
|
|
|
- }
|
|
|
- this.myBarChart.clear()
|
|
|
- var data=[
|
|
|
-
|
|
|
-
|
|
|
- {
|
|
|
- name:"园区电量",
|
|
|
- key:"parkKwh",
|
|
|
- color:"#307af6"
|
|
|
- },
|
|
|
- {
|
|
|
- name:"计费电量",
|
|
|
- key:"chargeKwh",
|
|
|
- color:"#52b8aa"
|
|
|
- },
|
|
|
- {
|
|
|
- name:"自用电量",
|
|
|
- key:"freeKwh",
|
|
|
- color:"#53b56b"
|
|
|
- },
|
|
|
- {
|
|
|
- name:"公用电量",
|
|
|
- key:"publicKwh",
|
|
|
- color:"#ef8132"
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
- name:"电损量",
|
|
|
- key:"lostKwh",
|
|
|
- color:"#dc4441"
|
|
|
- }
|
|
|
- ]
|
|
|
- var dataName=[]
|
|
|
- var dataSeries=[]
|
|
|
- for(var i in data){
|
|
|
- var it=data[i]
|
|
|
- dataName.push(it.name)
|
|
|
- dataSeries.push({})
|
|
|
- }
|
|
|
- for(var i in data){
|
|
|
- var it=data[i]
|
|
|
- dataSeries[data.length-i-1]={
|
|
|
- name:it.name,
|
|
|
- type: 'bar',
|
|
|
- itemStyle:{
|
|
|
- color:it.color
|
|
|
- },
|
|
|
- data: [
|
|
|
-
|
|
|
- this.homePageManageObj[it.key]
|
|
|
- ],
|
|
|
- coordinateSystem: 'polar',
|
|
|
- label: {
|
|
|
- show: true,
|
|
|
- position: 'start',
|
|
|
- formatter: '{c}度'
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- var option = {
|
|
|
-
|
|
|
- polar: {
|
|
|
- center:['50%','58%'],
|
|
|
- radius:[25, '80%']
|
|
|
- },
|
|
|
- angleAxis: {
|
|
|
-
|
|
|
- startAngle: 75,
|
|
|
- label: {
|
|
|
- rotate: 45, // 旋转标签，使得重叠的概率降低
|
|
|
- // margin: 5 // 设置标签与轴线之间的距离，增加空间
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- legend: {
|
|
|
- itemGap:5,
|
|
|
-
|
|
|
-
|
|
|
- data: dataName,
|
|
|
- //orient :'vertical'
|
|
|
- },
|
|
|
- radiusAxis: {
|
|
|
- type: 'category',
|
|
|
- data: ['']
|
|
|
- },
|
|
|
- tooltip: {},
|
|
|
-
|
|
|
- series: dataSeries
|
|
|
- };
|
|
|
- console.log(option)
|
|
|
- this.myBarChart.setOption(option);
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- toDataMonitoringList() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/equipmentDataMonitoring/dataMonitoring-list'
|
|
|
- })
|
|
|
- },
|
|
|
- toEquipmentConditionMonitoring() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/equipmentInformation/equipmentConditionMonitoring?companyId='+this.companyId
|
|
|
- })
|
|
|
- },
|
|
|
- toWorkOrderManagement() {
|
|
|
-
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/workOrderManagement/workOrderManagement'
|
|
|
- })
|
|
|
- },
|
|
|
- toEquipmentElectricity() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/equipmentDataMonitoring/equipmentElectricity'
|
|
|
- })
|
|
|
- },
|
|
|
- toElectronicMonitoring(item) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/equipmentDataMonitoring/electronicMonitoring?id=' + item.id + '&name=' + item
|
|
|
- .name +
|
|
|
- '&companyId=' + item.companyId
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
- .incomeExpenditureClass{
|
|
|
- display: flex;
|
|
|
- justify-content: space-evenly;
|
|
|
- width: 100%;
|
|
|
- padding:32rpx 0;
|
|
|
- .income1:last-child{
|
|
|
- .income11,.income12{
|
|
|
- border-right: 1px solid #c5c3c3;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- .income1{
|
|
|
- .income121{
|
|
|
- font-size: 24rpx;
|
|
|
- color:#c5c3c3;
|
|
|
- }
|
|
|
- width: 33.33%;
|
|
|
- text-align: center;
|
|
|
- .income11{
|
|
|
- padding:12rpx 0;
|
|
|
- background-color: #1677FF ;
|
|
|
- color:#fff;
|
|
|
- font-size: 32rpx;
|
|
|
- border-top: 1px solid #c5c3c3;
|
|
|
- border-left: 1px solid #c5c3c3;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .income12{
|
|
|
- padding:12rpx 0;
|
|
|
- border-top: 1px solid #c5c3c3;
|
|
|
- border-bottom: 1px solid #c5c3c3;
|
|
|
- border-left: 1px solid #c5c3c3;
|
|
|
- font-size: 40rpx;
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- /deep/.u-drawer-content {
|
|
|
- margin-top: 88rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .popup-tabs {
|
|
|
- background-color: #fff;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- padding-top: 32rpx;
|
|
|
- padding-right: 32rpx;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 32rpx;
|
|
|
-
|
|
|
- .tabs {
|
|
|
- width: 88%;
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- // /deep/.u-tab-item {
|
|
|
- // width: 25% !important;
|
|
|
- // flex: none !important;
|
|
|
- // }
|
|
|
- .tabs-len-1{
|
|
|
-
|
|
|
- }
|
|
|
- .tabs-len-2{
|
|
|
- /deep/.u-tab-item {
|
|
|
- // max-width: 39% !important;
|
|
|
- // flex: none !important;
|
|
|
- }
|
|
|
- }
|
|
|
- .tabs-len-3{
|
|
|
- /deep/.u-tab-item {
|
|
|
- max-width: 39% !important;
|
|
|
- flex: none !important;
|
|
|
- }
|
|
|
- }
|
|
|
- .tabs-len-4{
|
|
|
- /deep/.u-tab-item {
|
|
|
- max-width: 26% !important;
|
|
|
- flex: none !important;
|
|
|
- }
|
|
|
- }
|
|
|
- .tabs{
|
|
|
- /deep/.u-tab-item:first-child {
|
|
|
- width: 20% !important;
|
|
|
- flex: none !important;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // /deep/.u-tab-item2 {
|
|
|
- // width: 33% !important;
|
|
|
- // flex: none !important;
|
|
|
- // }
|
|
|
-
|
|
|
- .tabs-options {
|
|
|
- display: flex;
|
|
|
- padding: 24rpx 32rpx 0;
|
|
|
- flex-wrap: wrap;
|
|
|
-
|
|
|
- .item {
|
|
|
- width: 25%;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 导航栏
|
|
|
- .navbar {
|
|
|
-
|
|
|
-
|
|
|
- background-color: rgba(22, 119, 255, 1);
|
|
|
- color: #fff;
|
|
|
- line-height: 88rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 0 32rpx;
|
|
|
- color: rgba(255, 255, 255, 1);
|
|
|
- font-size: 36rpx;
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- top: 0;
|
|
|
- z-index: 999999;
|
|
|
- font-weight: bold;
|
|
|
- .title{
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- .img {
|
|
|
- width: 48rpx;
|
|
|
- height: 48rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- // 标签
|
|
|
- .tabs-box {
|
|
|
- padding: 32rpx 0;
|
|
|
- margin-top: 88rpx;
|
|
|
- padding-right: 32rpx;
|
|
|
- background-color: rgba(22, 119, 255, 1);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .tabs {
|
|
|
- width: 97%;
|
|
|
- }
|
|
|
- .more{
|
|
|
- padding-right: 12rpx;
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .main {
|
|
|
- border-radius: 16px 16px 0px 0px;
|
|
|
- background: linear-gradient(180deg, rgba(242, 244, 246, 1) 61%, rgba(255, 255, 255, 0) 100%);
|
|
|
- margin-top: -24rpx;
|
|
|
- padding: 32rpx;
|
|
|
-
|
|
|
- .statistics {
|
|
|
- border-radius: 8px;
|
|
|
- background-color: rgba(255, 255, 255, 1);
|
|
|
- box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
- margin-bottom: 24rpx;
|
|
|
- padding: 40rpx;
|
|
|
-
|
|
|
- .title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 20rpx;
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- vertical-align: middle;
|
|
|
- border-radius: 999px;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .change {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .change-img {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
-
|
|
|
- text {
|
|
|
-
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .text {
|
|
|
- color: rgba(16, 16, 16, 1);
|
|
|
- font-size: 36rpx;
|
|
|
- margin-left: 16rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .change {
|
|
|
- margin-left: 16rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #838383;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .check-all {
|
|
|
- margin-left: auto;
|
|
|
- color: rgba(131, 131, 131, 1);
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 用电量
|
|
|
- .statistics-e {
|
|
|
- padding: 40rpx;
|
|
|
-
|
|
|
-
|
|
|
- .electricity {
|
|
|
- background-color: #fff;
|
|
|
-
|
|
|
- .item:last-of-type {
|
|
|
- border: none;
|
|
|
- padding-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .item {
|
|
|
- padding: 16rpx 0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
-
|
|
|
- .item-content {
|
|
|
- width: 93%;
|
|
|
- }
|
|
|
-
|
|
|
- .equipment {
|
|
|
-
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
-
|
|
|
- .equipment1 {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 32rpx;
|
|
|
- max-width: 40%;
|
|
|
- font-weight: bold;
|
|
|
-
|
|
|
- white-space: nowrap;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
-
|
|
|
- .equipment2 {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- margin-left: 16rpx;
|
|
|
- max-width: 40%;
|
|
|
- white-space: nowrap;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 状态
|
|
|
- .state {
|
|
|
- white-space: pre;
|
|
|
- //width: 64rpx;
|
|
|
- //height: 36rpx;
|
|
|
- padding: 0 4rpx;
|
|
|
- line-height: 36rpx;
|
|
|
- border-radius: 8rpx;
|
|
|
- font-size: 22rpx;
|
|
|
- text-align: center;
|
|
|
- border: 1px solid rgba(255, 123, 0, 1);
|
|
|
- color: rgba(255, 123, 0, 1);
|
|
|
- margin-left: auto;
|
|
|
-
|
|
|
- // .dot {
|
|
|
- // margin-right: 8rpx;
|
|
|
-
|
|
|
- // width: 16rpx;
|
|
|
- // height: 16rpx;
|
|
|
- // background-color: rgba(255, 123, 0, 1);
|
|
|
- // border-radius: 999px;
|
|
|
- // margin-left: auto;
|
|
|
-
|
|
|
- // }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .state2 {
|
|
|
- border: 1px solid rgba(0, 185, 98, 1);
|
|
|
- color: rgba(0, 185, 98, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .electricity {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- margin-top: 8rpx;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .electricity-item {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- width: 33.3%;
|
|
|
- height: 40rpx;
|
|
|
- line-height: 40rpx;
|
|
|
-
|
|
|
- .number {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
-
|
|
|
- font-weight: bold;
|
|
|
- font-size: 24rpx;
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .date {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
-
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 统计1
|
|
|
- .statistics-1 {
|
|
|
- background-color: rgba(255, 255, 255, 1);
|
|
|
- width: 100%;
|
|
|
- padding: 24rpx;
|
|
|
- box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
- border-radius: 8px;
|
|
|
- margin-bottom: 24rpx;
|
|
|
-
|
|
|
-
|
|
|
- .item {
|
|
|
-
|
|
|
- margin-top: 32rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .item-progess {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 88rpx;
|
|
|
- height: 88rpx;
|
|
|
- margin-right: 24rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .total {
|
|
|
- margin-left: 24rpx;
|
|
|
-
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
-
|
|
|
- .total1 {
|
|
|
- display: flex;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
-
|
|
|
- .normal {
|
|
|
- margin-bottom: 12rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .total2 {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .abnormal {
|
|
|
- margin-left: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .total-number {
|
|
|
- color: rgba(255, 123, 0, 1);
|
|
|
- margin: 0 8rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 统计2异常报警记录
|
|
|
- .statistics-2 {
|
|
|
- .abnormal-item:last-of-type {
|
|
|
- border-bottom: none !important;
|
|
|
- padding-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .abnormal-item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 16rpx;
|
|
|
- border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
-
|
|
|
-
|
|
|
- .item-title {
|
|
|
-
|
|
|
-
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- margin-right: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .name {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .date {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .item-value {
|
|
|
- text-align: right;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .more {
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .value1 {
|
|
|
- font-weight: bold;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .value2 {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 统计3设备实时监控
|
|
|
- .statistics-3 {
|
|
|
- .monitoring-item {
|
|
|
- padding: 16rpx 0;
|
|
|
- border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
-
|
|
|
- .item-title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .text1 {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .company-name {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- font-size: 24rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .state {
|
|
|
- margin-left: 12rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- color: rgba(255, 123, 0, 1);
|
|
|
-
|
|
|
- text {
|
|
|
- margin-right: 8rpx;
|
|
|
- display: inline-block;
|
|
|
- width: 16rpx;
|
|
|
- height: 16rpx;
|
|
|
- border-radius: 999px;
|
|
|
- }
|
|
|
-
|
|
|
- .off-line {
|
|
|
-
|
|
|
- background-color: rgba(255, 123, 0, 1);
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .on-line {
|
|
|
- background-color: rgba(0, 185, 98, 1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .state2 {
|
|
|
- color: rgba(0, 185, 98, 1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .state {
|
|
|
- margin-left: auto;
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .state1,
|
|
|
- .state2 {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-left: 24rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .more {
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- vertical-align: middle;
|
|
|
- margin-right: 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- // 监控信息
|
|
|
- .infos {
|
|
|
- margin-top: 8rpx;
|
|
|
-
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- flex-wrap: wrap;
|
|
|
-
|
|
|
- .infos-item {
|
|
|
- width: 38%;
|
|
|
-
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 22rpx;
|
|
|
- // margin-right: 16rpx;
|
|
|
- margin-bottom: 8rpx;
|
|
|
-
|
|
|
- .icon {}
|
|
|
- }
|
|
|
-
|
|
|
- .text {
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 设备状态
|
|
|
- .statistics-4 {
|
|
|
-
|
|
|
- .chat-img {
|
|
|
- width: 100%;
|
|
|
- height: 620rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 故障类型
|
|
|
- .statistics-5,
|
|
|
- .statistics-6 {
|
|
|
- .chat-img {
|
|
|
- width: 100%;
|
|
|
- height: 410rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 异常设备排名
|
|
|
- .statistics-ranking {
|
|
|
- .total {
|
|
|
- color: rgba(16, 16, 16, 1);
|
|
|
- padding-left: 52rpx;
|
|
|
-
|
|
|
- text {
|
|
|
- color: #1677FF;
|
|
|
- padding: 0 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .ranking-main {
|
|
|
- margin-top: 40rpx;
|
|
|
- border-radius: 16px;
|
|
|
- background-color: #fff;
|
|
|
-
|
|
|
- .item:last-of-type {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .item {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 32rpx;
|
|
|
-
|
|
|
- .ranking {
|
|
|
- color: rgba(16, 16, 16, 1);
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .icon {
|
|
|
- width: 72rpx;
|
|
|
- height: 72rpx;
|
|
|
- border-radius: 4px;
|
|
|
- background-color: rgba(219, 234, 255, 1);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- margin-left: 24rpx;
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 48rpx;
|
|
|
- height: 48rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .name {
|
|
|
- margin-left: 16rpx;
|
|
|
-
|
|
|
- .name1 {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .name2 {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- font-size: 24rpx;
|
|
|
- margin-top: 4rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .time {
|
|
|
- color: rgba(16, 16, 16, 1);
|
|
|
- margin-left: auto;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- // 查看全部排名
|
|
|
- .check-all {
|
|
|
- text-align: center;
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 能源管理
|
|
|
- .statistics-manage {
|
|
|
- padding: 40rpx 0;
|
|
|
-
|
|
|
- .title,
|
|
|
- .chart,
|
|
|
- .search,
|
|
|
- .meter-statistic {
|
|
|
- padding: 0 32rpx;
|
|
|
- }
|
|
|
-
|
|
|
- // 图表
|
|
|
- .chart {
|
|
|
- padding-top: 32rpx;
|
|
|
- border-top: 1px solid rgba(242, 242, 242, 1);
|
|
|
-
|
|
|
- /deep/.u-subsection {
|
|
|
- padding: 2px;
|
|
|
- }
|
|
|
-
|
|
|
- /deep/.u-item {
|
|
|
- padding: 0;
|
|
|
- font-size: 24rpx
|
|
|
- }
|
|
|
-
|
|
|
- .chat-box {
|
|
|
- //margin-top: 24rpx;
|
|
|
- width: 100%;
|
|
|
- //height: 480rpx;
|
|
|
-
|
|
|
- img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .search {
|
|
|
- border-top: 1px solid rgba(242, 242, 242, 1);
|
|
|
- border-bottom: 1px solid rgba(242, 242, 242, 1);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 40rpx 32rpx;
|
|
|
-
|
|
|
- .switch {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- text {
|
|
|
- margin-left: 8rpx;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .search-box {
|
|
|
- border-radius: 50px;
|
|
|
- background-color: rgba(242, 244, 246, 1);
|
|
|
- color: rgba(136, 136, 136, 1);
|
|
|
- height: 56rpx;
|
|
|
- line-height: 56rpx;
|
|
|
- padding-left: 16rpx;
|
|
|
- padding-right: 8rpx;
|
|
|
- flex: 1;
|
|
|
- margin-left: 28rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- uni-input {
|
|
|
- height: 56rpx;
|
|
|
- line-height: 56rpx !important;
|
|
|
- font-size: 28rpx;
|
|
|
- width: 75%;
|
|
|
- }
|
|
|
-
|
|
|
- .icon {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 64rpx;
|
|
|
- height: 40rpx;
|
|
|
- border-radius: 50px;
|
|
|
- background-color: rgba(22, 119, 255, 1);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- // 电表统计
|
|
|
- .meter-statistic {
|
|
|
- margin-top: 32rpx;
|
|
|
- .meter-statistic-main{
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .sum {
|
|
|
-
|
|
|
-
|
|
|
- .meter-name {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 32rpx;
|
|
|
- margin-left: 8rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .icon {
|
|
|
- margin-right: 8rpx;
|
|
|
-
|
|
|
- img {
|
|
|
- width: 40rpx;
|
|
|
- height: 40rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .meter-state {
|
|
|
- margin-left: 8rpx;
|
|
|
- width: 64rpx;
|
|
|
- height: 36rpx;
|
|
|
- line-height: 36rpx;
|
|
|
- border-radius: 4px;
|
|
|
- background-color: rgba(255, 255, 255, 1);
|
|
|
- color: rgba(0, 185, 98, 1);
|
|
|
- font-size: 22rpx;
|
|
|
- text-align: center;
|
|
|
- border: 1px solid rgba(0, 185, 98, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .meter-state2 {
|
|
|
- border: 1px solid rgba(255, 123, 0, 1);
|
|
|
- color: rgba(255, 123, 0, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .meter-number {
|
|
|
- margin-left: auto;
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- font-size: 32rpx;
|
|
|
-
|
|
|
- /deep/.u-icon--right {
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .sum2 {
|
|
|
- padding: 0 32rpx;
|
|
|
- margin-top: 8rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .title {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .value {
|
|
|
- color: rgba(119, 119, 119, 1);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 一级表
|
|
|
- .first-level {
|
|
|
- padding-left: 16rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .meter-name {
|
|
|
- font-size: 28rpx
|
|
|
- }
|
|
|
- }
|
|
|
- .first-level-list{
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- // 二级表
|
|
|
- .second-level {
|
|
|
- padding-left: 32rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .meter-name {
|
|
|
- font-size: 24rpx
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .else-switch {
|
|
|
- padding-left: 72rpx;
|
|
|
-
|
|
|
- .meter-name {
|
|
|
- font-size: 24rpx
|
|
|
- }
|
|
|
-
|
|
|
- .item {
|
|
|
- margin-top: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- /deep/.u-drawer {
|
|
|
- z-index: 999 !important;
|
|
|
- }
|
|
|
-
|
|
|
- .contractList{
|
|
|
- font-weight: bold;
|
|
|
- .contractListClass{
|
|
|
- display: flex;
|
|
|
- margin-top:24rpx;
|
|
|
- justify-content: space-between;
|
|
|
- color: rgba(51,51,51,1);
|
|
|
-
|
|
|
- .img{
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- margin-right: 18rpx;
|
|
|
- }
|
|
|
- .contractListClass1{
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .tenantListNum{
|
|
|
- margin: 0 8rpx;
|
|
|
- color:#FF7B00 ;
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <u-picker-select title="日期选择" v-model="tabsFrom.show2" :defaultTime="tabsFrom.show2Index" :endYear="endYear"
|
|
|
+ mode="time" :params="params" :noselect="false" @confirm="selector2confirm" @cancel="selector2cancel"
|
|
|
+ @reset="selector2reset">
|
|
|
+ </u-picker-select>
|
|
|
+
|
|
|
+ <!-- 导航栏 -->
|
|
|
+ <view class="navbar">
|
|
|
+ <view class="title" v-if="companyInfotype==4">
|
|
|
+ 能源管理
|
|
|
+ <span style="padding-left: 4px;" >
|
|
|
+ |
|
|
|
+ </span>
|
|
|
+ <span style="padding-left: 4px;" >
|
|
|
+ {{companyInfo.name}}
|
|
|
+ </span>
|
|
|
+ </view>
|
|
|
+ <view class="title" v-else>
|
|
|
+ 能源管理
|
|
|
+ <span style="padding-left: 4px;" v-if="companyList.length>1&¤t!=0">
|
|
|
+ |
|
|
|
+ </span>
|
|
|
+ <span style="padding-left: 4px;" v-if="companyList.length>1&¤t!=0">
|
|
|
+
|
|
|
+ <template v-if="kWhList.length==1">
|
|
|
+ {{kWhList[0].name}}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ {{merchantList1[current].name}}
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+ <span style="padding-left: 4px;" v-if="companyList.length==1">
|
|
|
+ |
|
|
|
+ </span>
|
|
|
+ <span style="padding-left: 4px;" v-if="companyList.length==1">
|
|
|
+
|
|
|
+ <template v-if="kWhList.length==1">
|
|
|
+ {{kWhList[0].name}}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ {{companyList[0].name}}
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="tabs-box tabs-box2" v-if="companyInfotype==4&&readingMeterNum&&monitorMeterNum" >
|
|
|
+
|
|
|
+ <view class="tabs2" :class="'tabs-len-2'"
|
|
|
+ :style="{width: '100%', }">
|
|
|
+ <u-tabs-one :gutter="32"
|
|
|
+ :list="companyInfotypeList" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
|
|
|
+ bg-color="#1677FF" :current="1" @change="companyInfotypeChange"></u-tabs-one>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 标签 -->
|
|
|
+ <view class="tabs-box" v-else >
|
|
|
+
|
|
|
+ <view class="tabs" :class="'tabs-len-'+merchantList1.length" v-show="companyList.length>1"
|
|
|
+ :style="{width: companyList.length>3 ? '' : '100%'}">
|
|
|
+ <u-tabs-one v-if="utabsone"
|
|
|
+ :list="merchantList1" :is-scroll="false" active-color="#fff" inactive-color="#CCE2FF"
|
|
|
+ bg-color="#1677FF" :current="current" @change="change"></u-tabs-one>
|
|
|
+ </view>
|
|
|
+ <view class="more" @click="popShow=true" v-if="companyList.length >= 4">
|
|
|
+ <u-icon name="arrow-down" color="#fff" size="40"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 标签弹出层 -->
|
|
|
+ <u-popup v-model="popShow" duration="10" mode="top" :negative-top="88" border-radius="16">
|
|
|
+ <view class="popup-tabs">
|
|
|
+ <view class="tabs">
|
|
|
+ <u-tabs :list="merchantList1" :is-scroll="false" :current="current" @change="change"></u-tabs>
|
|
|
+ </view>
|
|
|
+ <view class="more">
|
|
|
+ <u-icon name="arrow-up" color="#777777" size="40" @click="popShow=false"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="tabs-options">
|
|
|
+ <view class="item" v-for="(item, index) in merchantList2" :key="index"
|
|
|
+ @click="merchantChange(item,index)">
|
|
|
+ {{item.name}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ <view class="main electronicMonitoring-123" v-show="kWhList.length==1" style="padding: 0;">
|
|
|
+
|
|
|
+ <electronicMonitoring v-show="kWhList.length" :ref="'refMyEm'+companyId"></electronicMonitoring>
|
|
|
+
|
|
|
+ <u-divider :isnone="kWhList.length==0" nonetext="暂无数据" border-color="#CFD2D5">已经到底了</u-divider>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="main current-123" v-show="(kWhList.length!=1)">
|
|
|
+ <!-- 电表运行情况 -->
|
|
|
+ <view class="statistics-1 statistics">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 电表运行情况
|
|
|
+ </view>
|
|
|
+ <view class="check-all" @click="toEquipmentConditionMonitoring">
|
|
|
+ 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="item">
|
|
|
+ <view class="item-progess">
|
|
|
+ <view class="img-box">
|
|
|
+ <u-circle-progress active-color="#2979ff" :percent="alarmsPercent" width="88">
|
|
|
+ </u-circle-progress>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <!-- 累计 -->
|
|
|
+ <view class="total">
|
|
|
+ <view class="total1">
|
|
|
+ <view class="normal">
|
|
|
+ 正常 <span style="color:#19be6b;margin: 0 8rpx;">{{alarmsForm.okNum}}</span> 台
|
|
|
+ </view>
|
|
|
+ <view class="abnormal">
|
|
|
+ 异常 <span style="color:red;margin: 0 8rpx;">{{alarmsForm.errorNum}}</span> 台
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="total2" v-if="false">
|
|
|
+ 本月累计触发告警 <text class="total-number">{{alarmsForm.errorMonthNum}}</text> 次
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="">
|
|
|
+ <!-- 电表运行情况 -->
|
|
|
+ <view class="statistics-1 statistics" v-show="current==0&&codes&&codes.indexOf('property')!=-1&&(tenantListNum0)">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 租户管理预警
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class=" contractList">
|
|
|
+ <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=1')">
|
|
|
+ <view class="contractListClass1">
|
|
|
+ <image class="img" src="@/assets/img/riLine-wallet-2-line.svg"></image>
|
|
|
+ 账户余额不足 <span class="tenantListNum">{{tenantListNum1}}</span> 家
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="contractListClass2">
|
|
|
+ <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=2')">
|
|
|
+ <view class="contractListClass1">
|
|
|
+ <!-- <image class="img" src="@/assets/img/riLine-time-line2.svg"></image> -->
|
|
|
+ <u-icon name="warning" class="img" size="32" color="#ef8132"></u-icon>
|
|
|
+ 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum2}}</span> 家<span>（即将到期）</span>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="contractListClass2">
|
|
|
+ <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="contractListClass" @click="gotoUrl('/pages/tenantList/contractList?query=3')">
|
|
|
+ <view class="contractListClass1">
|
|
|
+ <image class="img" src="@/assets/img/riLine-time-line2.svg"></image>
|
|
|
+ 租赁费催缴提醒 <span class="tenantListNum">{{tenantListNum3}}</span> 家<span>（已到期）</span>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="contractListClass2">
|
|
|
+ <u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 能源管理 -->
|
|
|
+ <view v-show="companyId" class="statistics statistics-manage">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 能源管理
|
|
|
+ </view>
|
|
|
+ <view class="check-all" @click="toEquipmentElectricity">
|
|
|
+ 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="content"
|
|
|
+ style="display: flex;justify-content: center;margin: 40px 0;"
|
|
|
+ v-if="!getHomePageManageshowLoading">
|
|
|
+
|
|
|
+ <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
|
|
|
+ <i class="uni-icon_toast uni-loading"
|
|
|
+ style="
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+
|
|
|
+ "
|
|
|
+ ></i><p class="uni-toast__content"> </p>加载中...</div>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="content" v-else-if="getHomePageManageshowLoading&&meterList.length == 0">
|
|
|
+ <u-divider :isnone="true" nonetext="无记录"
|
|
|
+ border-color="#fff"></u-divider>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 图表 -->
|
|
|
+ <view class="chart" v-show="getHomePageManageshowLoading">
|
|
|
+ <view class="u-subsection">
|
|
|
+ <u-subsection :list="list" :current="homePageManageType" @change="sectionChange"
|
|
|
+ font-size="24"></u-subsection>
|
|
|
+ </view>
|
|
|
+ <view class="incomeExpenditureClass" v-show="companyType!=4&&homePageManageObj.showPark" >
|
|
|
+ <view class="income1">
|
|
|
+ <view class="income11">
|
|
|
+ 电费收入 (元)
|
|
|
+ </view>
|
|
|
+ <view class="income12">
|
|
|
+ {{incomeExpenditureObj.incomeFee}}
|
|
|
+ <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="income1">
|
|
|
+ <view class="income11">
|
|
|
+ 电费支出 (元)
|
|
|
+ </view>
|
|
|
+ <view class="income12">
|
|
|
+ {{incomeExpenditureObj.expenditureFee}}
|
|
|
+ <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="income1">
|
|
|
+ <view class="income11">
|
|
|
+ 收支情况 (元)
|
|
|
+ </view>
|
|
|
+ <view class="income12" :style="incomeExpenditureObj.differenceFee>=0?'color:red':'color:#52b8aa'">
|
|
|
+ {{incomeExpenditureObj.differenceFee}}
|
|
|
+ <span class="income121" v-if="!incomeExpenditureObj.id">加载中...</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="chat-box" id="barEcharts-statistics" v-show="companyType!=4&&homePageManageObj.showPark">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="search" v-if="false">
|
|
|
+ <view class="switch">
|
|
|
+ <u-switch v-model="checked" size="40"></u-switch><text>只看离线表</text>
|
|
|
+ </view>
|
|
|
+ <view class="search-box">
|
|
|
+ <input type="text" placeholder="请输入电表查询" />
|
|
|
+ <view class="icon">
|
|
|
+ <img src="@/assets/img/riLine-search-line 1.svg" alt="" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 电表统计 -->
|
|
|
+ <Tree-Body :meterList="meterList" ref="mytree"
|
|
|
+ :showPark="homePageManageObj.showPark"
|
|
|
+ @query="getHomePageManageChildMeter"
|
|
|
+ v-if="getHomePageManageReady"
|
|
|
+ :role="codes&&codes.indexOf('switch')!=-1"
|
|
|
+ @switchBtn="switchBtnApi"
|
|
|
+ ></Tree-Body>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <!-- 用电量 -->
|
|
|
+ <view class="statistics-e statistics" v-if="!companyId">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 用电量 (度)
|
|
|
+ </view>
|
|
|
+ <view class="check-all" @click="toEquipmentElectricity">
|
|
|
+ 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="content" style="display: flex;justify-content: center;margin: 40px 0;"
|
|
|
+ v-if="getHomePageKwhshowLoading">
|
|
|
+
|
|
|
+ <div class="uni-toast" style="display: flex;font-size: 60rpx; color: rgb(192, 196, 204);" >
|
|
|
+ <i class="uni-icon_toast uni-loading"
|
|
|
+ style="
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+
|
|
|
+ "
|
|
|
+ ></i><p class="uni-toast__content"> </p>加载中...</div>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="content" v-else-if="!getHomePageKwhshowLoading&&kWhListHome.length == 0">
|
|
|
+ <u-divider :isnone="true" nonetext="无记录"
|
|
|
+ border-color="#fff"></u-divider>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="content" v-else >
|
|
|
+ <view class="electricity">
|
|
|
+
|
|
|
+ <view class="item" v-for="(item, index) in kWhListHome" :key="index"
|
|
|
+ @click="toElectronicMonitoring(item)">
|
|
|
+ <view class="item-content">
|
|
|
+ <view class="equipment">
|
|
|
+ <view class="equipment1 ">
|
|
|
+ {{replaceLastTwoWords(item.name)}}
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="equipment2">
|
|
|
+ {{item.installationAddressSimple}}
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <view class="state" v-if="!item.online">
|
|
|
+ <!-- <view class="dot off-line"></view> -->
|
|
|
+ <view class="text">离线</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="state state2" v-else>
|
|
|
+ <!-- <view class="dot on-line"></view> -->
|
|
|
+ <view class="text">在线</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="electricity">
|
|
|
+ <view class="electricity-item electricity-item-day">
|
|
|
+
|
|
|
+ <view class="date">
|
|
|
+ 今日
|
|
|
+ </view>
|
|
|
+ <view class="number">
|
|
|
+ {{item.thisDayKwh}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="electricity-item">
|
|
|
+
|
|
|
+ <view class="date">
|
|
|
+ 本月
|
|
|
+ </view>
|
|
|
+ <view class="number">
|
|
|
+ {{item.thisMonthKwh}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="electricity-item">
|
|
|
+
|
|
|
+ <view class="date">
|
|
|
+ 上月
|
|
|
+ </view>
|
|
|
+ <view class="number">
|
|
|
+ {{item.lastMonthKwh}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="more">
|
|
|
+ <u-icon name="arrow-right" color="#d4d4d4" size="24"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 统计2 异常告警记录 -->
|
|
|
+ <view class="statistics-2 statistics" v-if="codes&&codes.indexOf('property')!=-1" >
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 租户断电提醒
|
|
|
+ </view>
|
|
|
+ <view class="check-all" @click="gotoUrl('/pages/tenantList/remindList?id='+companyId)">
|
|
|
+ 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-divider :isnone="abnormalRecordsList.length==0" nonetext="无记录"
|
|
|
+ border-color="#fff"></u-divider>
|
|
|
+ <!-- 异常 -->
|
|
|
+ <view class="abnormal-item" v-for="(item,index) in abnormalRecordsList"
|
|
|
+ :key="index"
|
|
|
+
|
|
|
+ >
|
|
|
+ <!-- @click="gotoUrl('/pages/abnormal/abnormalAlarmDetails?id='+item.id)"
|
|
|
+ -->
|
|
|
+ <view class="item-title">
|
|
|
+
|
|
|
+ <view class="name">
|
|
|
+ {{item.content}}
|
|
|
+ </view>
|
|
|
+ <view class="date" style="display: flex; justify-content: space-between;margin-top: 4rpx;">
|
|
|
+ <view>{{item.title}}</view>
|
|
|
+ <view>{{item.createTime}}</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 异常设备排名 -->
|
|
|
+ <view class="statistics statistics-ranking" v-if="false">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 异常设备排名
|
|
|
+ </view>
|
|
|
+ <view class="check-all">
|
|
|
+ 查看全部<u-icon name="arrow-right" size="24" color="#838383"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 合计 -->
|
|
|
+ <view class="total">
|
|
|
+ 本年度共有<text> 42</text>次设备异常告警
|
|
|
+ </view>
|
|
|
+ <view class="ranking-main">
|
|
|
+ <view class="item" v-for="(item,i) in 3" :key="i"
|
|
|
+ @click="gotoUrl('/pages/equipmentDataMonitoring/electronicMonitoring?id='+'&name=')">
|
|
|
+ <view class="ranking">
|
|
|
+ 1
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="name">
|
|
|
+ <view class="name1">
|
|
|
+ 荆鹏软件园01
|
|
|
+ </view>
|
|
|
+ <view class="name2">
|
|
|
+ 荆鹏集团
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="time">
|
|
|
+ 5次
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 查看全部排名 -->
|
|
|
+ <!-- <view class="check-all" @click="gotoUrl('/pages/abnormal/abnormalDeviceRanking')">
|
|
|
+ 查看全部排名 <u-icon name="arrow-down" size="24" color="rgba(119,119,119,1)"></u-icon>
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <energyCenterTabbar :current="0"></energyCenterTabbar>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+ import {
|
|
|
+ parseUnixTime,
|
|
|
+ beforeTimeStamp,
|
|
|
+ getWeek,newDate
|
|
|
+ } from '@/apis/utils'
|
|
|
+
|
|
|
+ import energyCenterTabbar from '@/components/energyCenterTabbar.vue'
|
|
|
+ import electronicMonitoring from '@/pages/equipmentDataMonitoring/electronicMonitoring.vue'
|
|
|
+
|
|
|
+
|
|
|
+ import * as echarts from 'echarts';
|
|
|
+ import * as API_index from '@/apis/pagejs/index.js'
|
|
|
+ import * as API_tenantList from '@/apis/pagejs/tenantList.js'
|
|
|
+
|
|
|
+ import * as API from '@/apis/pagejs/energyManage.js'
|
|
|
+ import TreeBody from '@/components/tree/tree-body.vue';
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ energyCenterTabbar,TreeBody,electronicMonitoring
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ abnormalRecordsList: [], // 异常告警记录
|
|
|
+ queryDate: '',
|
|
|
+ queryDateMonth:"",
|
|
|
+ alarmsPercent: 0,
|
|
|
+ alarmsForm: {
|
|
|
+ okNum: 0,
|
|
|
+ errorNum: 0,
|
|
|
+ errorMonthNum: 0
|
|
|
+ }, // 累计报警
|
|
|
+ companyId: '', // 商户ID
|
|
|
+ pageIndexe: 1, // 设备数据检测
|
|
|
+ totalPagee: 1,
|
|
|
+ deviceList: [],
|
|
|
+ pageIndexp: 1, // 用电量
|
|
|
+ totalPagep: 1,
|
|
|
+ kWhList: [],
|
|
|
+ kWhListHome: [],
|
|
|
+ codes: '', // 判断：reading用电量 detector设备数据检测
|
|
|
+ merchantList1: [], // 商户
|
|
|
+ merchantList2: [],
|
|
|
+ companyList: [],
|
|
|
+ companyInfo:{},
|
|
|
+ companyInfotypeCurrent:1,
|
|
|
+ companyInfotypeList:[
|
|
|
+ {
|
|
|
+ name: '变压器巡检仪'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '费控电表计量仪'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ popShow: false,
|
|
|
+ popShowtest: true,
|
|
|
+ current: 0,
|
|
|
+ myLineChart: null, // 图表
|
|
|
+ myBarChart: null,
|
|
|
+ myPieChart: null,
|
|
|
+ intervalId: null, // 用于存储间隔ID
|
|
|
+ intervalReady: false, // 用于存储间隔ID
|
|
|
+ list: [{
|
|
|
+ name: '上月',
|
|
|
+ value: "2"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '当月',
|
|
|
+ value: "1"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '今日',
|
|
|
+ value: "4"
|
|
|
+ }, {
|
|
|
+ name: '当年',
|
|
|
+
|
|
|
+ value: "3"
|
|
|
+ }, {
|
|
|
+ name: '合计',
|
|
|
+
|
|
|
+ value: "0"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '指定月份',
|
|
|
+ value: "10"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+
|
|
|
+ checked: false,
|
|
|
+ homePageManageType: 2,
|
|
|
+ meterList: [],
|
|
|
+ showPark:false,
|
|
|
+ meterListShow:{},
|
|
|
+ homePageManageObj: {
|
|
|
+ chargeKwh: 0,
|
|
|
+ lostKwh: 0,
|
|
|
+ parkKwh: 0,
|
|
|
+ freeKwh:0,
|
|
|
+ publicKwh:0,
|
|
|
+ },
|
|
|
+ endYear: '',
|
|
|
+ params: {
|
|
|
+ year: true,
|
|
|
+ month: true,
|
|
|
+ day: true,
|
|
|
+ hour: false,
|
|
|
+ minute: false,
|
|
|
+ second: false
|
|
|
+ },
|
|
|
+ value: '2',
|
|
|
+ clickType: -1,
|
|
|
+ tabsFrom: {
|
|
|
+ show1: false,
|
|
|
+ show1Index: 0,
|
|
|
+ show2Index: '',
|
|
|
+ show2: false,
|
|
|
+ show1Text: "全部类型",
|
|
|
+ show2Text: "全部时间",
|
|
|
+
|
|
|
+ },
|
|
|
+ getHomePageManageReady:false,
|
|
|
+
|
|
|
+ utabsone:true,
|
|
|
+ companyType:0,
|
|
|
+ incomeExpenditureObj:{},
|
|
|
+ getHomePageKwhshowLoading:false,
|
|
|
+ getHomePageManageshowLoading:false,
|
|
|
+ companyInfotype:0,
|
|
|
+ readingMeterNum:0, //计量仪
|
|
|
+ monitorMeterNum:0, //巡检仪
|
|
|
+ tenantListNum0:0,
|
|
|
+ tenantListNum1:0,
|
|
|
+ tenantListNum2:0,
|
|
|
+ tenantListNum3:0,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ var date = new Date();
|
|
|
+ var year = date.getFullYear();
|
|
|
+ var month = date.getMonth() + 1 >= 10 ? date.getMonth() + 1 : '0' + (date.getMonth() + 1);
|
|
|
+ this.queryDateMonth = year + '-' + month;
|
|
|
+ this.endYear = new Date().getFullYear();
|
|
|
+ this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
|
|
|
+
|
|
|
+ this.getfindByOpenId();
|
|
|
+ this.getCompanyInfoList();
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ onUnload(){
|
|
|
+ this.clearTimer(); // 组件销毁前清除定时器
|
|
|
+
|
|
|
+ console.log("组件销毁前清除定时器")
|
|
|
+ },
|
|
|
+
|
|
|
+ beforeDestroy() {
|
|
|
+ this.clearTimer(); // 组件销毁前清除定时器
|
|
|
+
|
|
|
+ console.log("组件销毁前清除定时器")
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ onHide(){
|
|
|
+ this.intervalReady=false
|
|
|
+ this.clearTimer();
|
|
|
+ },
|
|
|
+ onShow(){
|
|
|
+ if(!this.intervalReady&&this.companyList.length>1){
|
|
|
+ this.startInterval();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ stateBl(timekey,day){
|
|
|
+ var get=newDate(timekey)
|
|
|
+ var time=new Date()
|
|
|
+ if(!day){
|
|
|
+
|
|
|
+ return time>get;
|
|
|
+ }else{
|
|
|
+
|
|
|
+ var get2=newDate(timekey)
|
|
|
+ get2.setDate(get2.getDate() - day)
|
|
|
+ console.log(timekey)
|
|
|
+ return get2<time&&get>time;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectTypeMethod(tenant,selectType){
|
|
|
+ var selectType1=this.selectType;
|
|
|
+ if(selectType){
|
|
|
+ selectType1=selectType;
|
|
|
+ }
|
|
|
+
|
|
|
+ // if(){
|
|
|
+
|
|
|
+ // }
|
|
|
+ if(true){
|
|
|
+ var bl=false;
|
|
|
+ for(var j in tenant.tenantContractList){
|
|
|
+
|
|
|
+
|
|
|
+ var tenant1=tenant.tenantContractList[j]
|
|
|
+ //console.log(tenant1.autoDeductFee)
|
|
|
+ if(tenant1.autoDeductFee!=true){
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ if(selectType1==0){
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ if(selectType1==1){
|
|
|
+ return tenant.balance<tenant.minBalance
|
|
|
+ }
|
|
|
+ for(var k in tenant1.contractItemList){
|
|
|
+
|
|
|
+ var item=tenant1.contractItemList[k]
|
|
|
+ //console.log(item.prepaidEndTime)
|
|
|
+
|
|
|
+ if(item.paymentMethod==1&&item.name!='电费'){
|
|
|
+
|
|
|
+ if(selectType1==2){
|
|
|
+ if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime,30)){
|
|
|
+ bl=true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(selectType1==3){
|
|
|
+ if(item.prepaidEndTime&&this.stateBl(item.prepaidEndTime)){
|
|
|
+ bl=true;
|
|
|
+ }
|
|
|
+ if(item.prepaidEndTime==null){
|
|
|
+ bl=true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ return bl
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getTenantList(){
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: "加载中",
|
|
|
+ // mask: true,
|
|
|
+ // })
|
|
|
+ API_tenantList.tenantContractList().then((response) => {
|
|
|
+ uni.hideLoading();
|
|
|
+ //this.getTenantListReady=true
|
|
|
+ var tenantList=response.data.tenantInfoList;
|
|
|
+ this.tenantListNum0=tenantList.length
|
|
|
+
|
|
|
+ for(var i in tenantList){
|
|
|
+ var obj=tenantList[i]
|
|
|
+ if(this.selectTypeMethod(obj,1)){
|
|
|
+ this.tenantListNum1++;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ if(this.selectTypeMethod(obj,2)){
|
|
|
+ this.tenantListNum2++;
|
|
|
+ }
|
|
|
+ if(this.selectTypeMethod(obj,3)){
|
|
|
+ this.tenantListNum3++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //绑定权限
|
|
|
+ getfindByOpenId() {
|
|
|
+
|
|
|
+ API_index.findByOpenId({
|
|
|
+ openId: this.carhelp.getOpenId()
|
|
|
+ }).then((response) => {
|
|
|
+ if(response.data&&response.data.companyInfo){
|
|
|
+ this.companyInfo=response.data.companyInfo
|
|
|
+ this.companyInfotype = response.data.companyInfo.type;
|
|
|
+ if(this.companyInfotype==4){
|
|
|
+ this.getFindMeterList()
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ if(response.data){
|
|
|
+ var token = response ? response.data.token : '';
|
|
|
+ this.carhelp.setPersonInfo(response.data.regUser );
|
|
|
+
|
|
|
+ this.carhelp.setToken(token);
|
|
|
+ this.carhelp.setPersonInfoPlus(response.data);
|
|
|
+
|
|
|
+ this.codes =response.data.regUser.codes
|
|
|
+ if(this.codes&&this.codes.indexOf('property')!=-1){
|
|
|
+ this.getTenantList()
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getFindMeterList(){
|
|
|
+
|
|
|
+ API.findMeterList().then((response) => {
|
|
|
+ //readingMeterNum 计量仪 //monitorMeterNum 巡检仪
|
|
|
+ this.readingMeterNum=response.data.readingMeterNum
|
|
|
+ this.monitorMeterNum=response.data.monitorMeterNum
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ companyIdSet(val,item){
|
|
|
+ this.companyType= 0
|
|
|
+ if(val&&item){
|
|
|
+ this.companyType= item.type
|
|
|
+ }else{
|
|
|
+ if(!val){
|
|
|
+
|
|
|
+ }else{
|
|
|
+ var bl=false
|
|
|
+ this.companyList.find(item=>{
|
|
|
+
|
|
|
+ if(item.id==val){
|
|
|
+
|
|
|
+ this.companyType= item.type;
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ switchBtnApiMethod(node,key){
|
|
|
+ uni.showLoading({
|
|
|
+ title: "加载中",
|
|
|
+ mask: true,
|
|
|
+ })
|
|
|
+ API.remoteSwitch({
|
|
|
+ meterId:node.id,
|
|
|
+ enabled:key
|
|
|
+ }).then((res) => {
|
|
|
+ uni.hideLoading();
|
|
|
+ node.switchStatus=key
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ switchBtnApi(node,key){
|
|
|
+ uni.showModal({
|
|
|
+ confirmColor:`${key?'#3CC51F':'red'}`,
|
|
|
+ confirmText:`${key?'开启':'关闭'}`,
|
|
|
+ content: `确认是否要"${key?'开启':'关闭'}"${this.replaceLastTwoWords(node.name)}`,
|
|
|
+ title: "提示",
|
|
|
+ success:res=> {
|
|
|
+ if(res.confirm){
|
|
|
+ this.switchBtnApiMethod(node,key);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(node,key)
|
|
|
+ },
|
|
|
+ getIncomeExpenditure(){
|
|
|
+
|
|
|
+ API.incomeExpenditure({
|
|
|
+ //parentMeterId:item.id,
|
|
|
+ queryDate:this.queryDate,
|
|
|
+ companyId: this.companyId,
|
|
|
+ type: this.list[this.homePageManageType].value
|
|
|
+ }).then((response) => {
|
|
|
+
|
|
|
+ this.incomeExpenditureObj=response.data
|
|
|
+ this.incomeExpenditureObj.id=1
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 设备数据监测
|
|
|
+ getHomePageManageChildMeter(item,bl) {
|
|
|
+ if(!bl){
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: "加载中",
|
|
|
+ // mask: true,
|
|
|
+ // })
|
|
|
+ }
|
|
|
+
|
|
|
+ API.homePageManageChildMeter({
|
|
|
+ parentMeterId:item.id,
|
|
|
+ queryDate:this.queryDate,
|
|
|
+ companyId: this.companyId,
|
|
|
+ type: this.list[this.homePageManageType].value
|
|
|
+ }).then((response) => {
|
|
|
+ // if(!bl){
|
|
|
+ // uni.hideLoading();
|
|
|
+ // }
|
|
|
+ // this.meterList = response.data.meterList;
|
|
|
+ // if(!this.meterListShow.id){
|
|
|
+ // this.meterListShow.id=1
|
|
|
+ // this.recursionList(this.meterList)
|
|
|
+ // }
|
|
|
+
|
|
|
+ var childMeterList=response.data.childMeterList
|
|
|
+ item.childMeterList=childMeterList
|
|
|
+
|
|
|
+
|
|
|
+ if(!bl){
|
|
|
+ for(var i in childMeterList){
|
|
|
+ var obj=childMeterList[i]
|
|
|
+ this.getHomePageManageChildMeter(obj,true)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ recursionList(list){
|
|
|
+ if(list){
|
|
|
+ for(var i in list){
|
|
|
+ var obj=list[i]
|
|
|
+
|
|
|
+ this.meterListShow[obj.id]=false
|
|
|
+ this.recursionList(obj.childMeterList)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ifBtnShow(item){
|
|
|
+ return this.meterListShow[item.id]
|
|
|
+ },
|
|
|
+ showBtn(item){
|
|
|
+ var key=this.meterListShow[item.id];
|
|
|
+
|
|
|
+ this.$set(this.meterListShow,item.id,!key)
|
|
|
+ console.log("showBtn,",key)
|
|
|
+
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ selector2reset(e) {
|
|
|
+ console.log(e)
|
|
|
+ this.tabsFrom.show2Text = '全部时间'
|
|
|
+ this.tabsFrom.show2Index = '';
|
|
|
+
|
|
|
+ if (e.day) {
|
|
|
+ this.queryDate = parseUnixTime(new Date(), '{y}-{m}-{d}');
|
|
|
+
|
|
|
+ this.getHomePageManage();
|
|
|
+ } else {
|
|
|
+
|
|
|
+ this.homePageManageType = this.clickType;
|
|
|
+ if (this.homePageManageType != 5) {
|
|
|
+ this.list[5].name = '指定月份';
|
|
|
+ }
|
|
|
+ this.getHomePageManage();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selector2cancel() {
|
|
|
+ if(this.clickType != -1) {
|
|
|
+
|
|
|
+ }
|
|
|
+ this.homePageManageType = this.clickType;
|
|
|
+ },
|
|
|
+ selector2confirm(e) {
|
|
|
+ this.tabsFrom.show2Text = e.year + "年" + e.month + "月"
|
|
|
+
|
|
|
+ this.tabsFrom.show2Index = e.year + "-" + e.month
|
|
|
+ if (e.day) {
|
|
|
+ this.tabsFrom.show2Text += e.day + "日"
|
|
|
+ this.tabsFrom.show2Index += '-' + e.day
|
|
|
+
|
|
|
+ this.queryDateMethod(this.tabsFrom.show2Index, true)
|
|
|
+ } else {
|
|
|
+ this.queryDateMethod(this.tabsFrom.show2Index, false)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ queryDateMethod(queryTime, day) {
|
|
|
+
|
|
|
+ if (day) {
|
|
|
+ this.queryDate = queryTime;
|
|
|
+
|
|
|
+ } else {
|
|
|
+
|
|
|
+ this.queryDate = queryTime + "-01";
|
|
|
+
|
|
|
+ this.homePageManageType = "5";
|
|
|
+ this.list[5].name = queryTime;
|
|
|
+
|
|
|
+ this.getHomePageManage();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ clearTimer() {
|
|
|
+ if (this.intervalId) {
|
|
|
+ clearInterval(this.intervalId); // 清除定时器
|
|
|
+ this.intervalId = null; // 重置定时器ID
|
|
|
+ }
|
|
|
+ },
|
|
|
+ startInterval() {
|
|
|
+ this.clearTimer(); // 组件销毁前清除定时器
|
|
|
+
|
|
|
+
|
|
|
+ this.intervalId = setInterval(() => {
|
|
|
+
|
|
|
+ this.getHomePageKwh('', true)
|
|
|
+ }, 60000);
|
|
|
+ },
|
|
|
+ merchantChangeApi() {
|
|
|
+ this.popShow=false
|
|
|
+
|
|
|
+
|
|
|
+ if (this.companyId) {
|
|
|
+
|
|
|
+ this.getHomePageKwh(this.companyId)
|
|
|
+
|
|
|
+
|
|
|
+ }else{
|
|
|
+ this.kWhList=[]
|
|
|
+ this.getDeviceStatus()
|
|
|
+ this.getAbnormalAlarmRecord();
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ companyInfotypeChange(index){
|
|
|
+ if(index!=this.companyInfotypeCurrent){
|
|
|
+ var url=""
|
|
|
+ if(process.car.NODE_ENV=='dev'){
|
|
|
+
|
|
|
+ url='http://localhost:8081/#/'
|
|
|
+
|
|
|
+ }else if(process.car.NODE_ENV=='test'){
|
|
|
+
|
|
|
+ url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric-test/#/'
|
|
|
+
|
|
|
+ }else{
|
|
|
+ url='https://dgj.hbjp.com.cn/charging-prod/jp-housekeep-electric/#/'
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ window.location.href=url+"pages/statistics/statistics"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ change(index) {
|
|
|
+ this.current = index;
|
|
|
+ this.companyId = this.merchantList1[index].id;
|
|
|
+ this.companyIdSet(this.companyId)
|
|
|
+ this.merchantChangeApi()
|
|
|
+ },
|
|
|
+ merchantChange(item, index) {
|
|
|
+ if(this.current==0){
|
|
|
+ this.current=1;
|
|
|
+ }
|
|
|
+ var m = item;
|
|
|
+ var n = this.merchantList1[this.current];
|
|
|
+ this.merchantList1[this.current] = m;
|
|
|
+ this.merchantList2[index] = n;
|
|
|
+ //this.$forceUpdate()
|
|
|
+ this.utabsone=false
|
|
|
+ this.companyId = item.id;
|
|
|
+ this.companyIdSet(this.companyId)
|
|
|
+ this.merchantChangeApi()
|
|
|
+ this.popShow = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ getCompanyInfoList() {
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: "加载中",
|
|
|
+ // mask: true,
|
|
|
+ // })
|
|
|
+ API.deviceCompanyList().then((response) => {
|
|
|
+ //uni.hideLoading();
|
|
|
+ var list = response.data.companyInfoList;
|
|
|
+
|
|
|
+ var mList1 = [];
|
|
|
+ var mList2 = [];
|
|
|
+
|
|
|
+ mList1.push({
|
|
|
+ id: '',
|
|
|
+ name: '全部'
|
|
|
+ });
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
+ if (i >= 3) {
|
|
|
+ mList2.push(list[i]);
|
|
|
+ } else {
|
|
|
+ mList1.push(list[i]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ this.companyList = list;
|
|
|
+ if(list.length==1){
|
|
|
+ this.companyId=list[0].id
|
|
|
+ this.companyIdSet(this.companyId)
|
|
|
+
|
|
|
+ }else{
|
|
|
+ this.getHomePageKwh('')
|
|
|
+ }
|
|
|
+ this.merchantList1 = mList1;
|
|
|
+ this.merchantList2 = mList2;
|
|
|
+ this.merchantChangeApi()
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ sectionChange(index) {
|
|
|
+ this.clickType = this.homePageManageType ;
|
|
|
+ this.homePageManageType = index;
|
|
|
+ if (index == 5) {
|
|
|
+ this.tabsFrom.show2 = true;
|
|
|
+ this.params.day = false;
|
|
|
+ } else {
|
|
|
+ this.list[5].name = '指定月份'
|
|
|
+ this.getHomePageManage()
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ getHomePageManage(bl) {
|
|
|
+ this.getHomePageManageReady=false
|
|
|
+ if(bl){
|
|
|
+ this.getHomePageManageshowLoading=false
|
|
|
+
|
|
|
+ }else{
|
|
|
+ uni.showLoading({
|
|
|
+ title: "加载中",
|
|
|
+ mask: true,
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ this.incomeExpenditureObj={}
|
|
|
+ API.homePageManage({
|
|
|
+ queryDate:this.queryDate,
|
|
|
+ companyId: this.companyId,
|
|
|
+ type: this.list[this.homePageManageType].value
|
|
|
+ }).then((response) => {
|
|
|
+ this.getHomePageManageReady=true
|
|
|
+ if(bl){
|
|
|
+
|
|
|
+ this.getHomePageManageshowLoading=true
|
|
|
+ }else{
|
|
|
+ uni.hideLoading();
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ this.meterList = response.data.meterList;
|
|
|
+ //console.log(this.meterList)
|
|
|
+ this.homePageManageObj = response.data;
|
|
|
+ //this.$forceUpdate()
|
|
|
+ if(this.companyType!=4&&this.homePageManageObj.showPark){
|
|
|
+
|
|
|
+ this.myBarChart=null;
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.getBarCharts()
|
|
|
+ })
|
|
|
+
|
|
|
+ this.getIncomeExpenditure();
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 异常告警记录
|
|
|
+ getAbnormalAlarmRecord() {
|
|
|
+ if(this.codes&&this.codes.indexOf('property')!=-1){
|
|
|
+
|
|
|
+ }else{
|
|
|
+ return
|
|
|
+ }
|
|
|
+ API.remindList({
|
|
|
+ // queryDate: this.queryDateMonth,
|
|
|
+ configId: '',
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 5,
|
|
|
+ companyId: this.companyId
|
|
|
+ }).then((response) => {
|
|
|
+
|
|
|
+ this.abnormalRecordsList = response.data.data;
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 用电量
|
|
|
+ getHomePageKwh( companyId,interval) {
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ if (!interval) {
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: "加载中",
|
|
|
+ // mask: true,
|
|
|
+ // })
|
|
|
+ this.getHomePageKwhshowLoading=true;
|
|
|
+ }
|
|
|
+ API.homePageKwh({
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 5,
|
|
|
+ companyId:companyId
|
|
|
+ }).then((response) => {
|
|
|
+ if (!interval) {
|
|
|
+ //uni.hideLoading();
|
|
|
+ this.getHomePageKwhshowLoading=false;
|
|
|
+ }
|
|
|
+
|
|
|
+ if(companyId){
|
|
|
+ this.kWhList = response.data.data;
|
|
|
+ if(this.kWhList.length==1){
|
|
|
+
|
|
|
+ var item=this.kWhList[0];
|
|
|
+ this.$refs['refMyEm'+companyId].init({
|
|
|
+ id:item.id,
|
|
|
+ name:item.name,
|
|
|
+ companyId:item.companyId,
|
|
|
+ ref:1,
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ this.getHomePageManage(1)
|
|
|
+ this.getDeviceStatus()
|
|
|
+ this.getAbnormalAlarmRecord();
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ this.kWhListHome= response.data.data;
|
|
|
+ if (!interval) {
|
|
|
+ this.startInterval(); // 组件挂载后开始间隔
|
|
|
+ }else{
|
|
|
+ this.intervalReady=true
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 累计报警
|
|
|
+ getDeviceStatus() {
|
|
|
+
|
|
|
+ API.deviceStatus({
|
|
|
+ companyId: this.companyId
|
|
|
+ }).then((response) => {
|
|
|
+ this.utabsone=true
|
|
|
+ this.alarmsForm = response.data;
|
|
|
+ if (this.alarmsForm.okNum != 0) {
|
|
|
+ this.alarmsPercent = this.alarmsForm.okNum / (this.alarmsForm.okNum + this.alarmsForm
|
|
|
+ .errorNum) * 100;
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 故障类型
|
|
|
+ getBarCharts() {
|
|
|
+ if (!this.myBarChart) {
|
|
|
+ this.myBarChart = echarts.init(document.getElementById('barEcharts-statistics'),null,{
|
|
|
+ width:uni.upx2px(620),height:uni.upx2px(740)
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.myBarChart.clear()
|
|
|
+ var data=[
|
|
|
+
|
|
|
+
|
|
|
+ {
|
|
|
+ name:"总表电量",
|
|
|
+ key:"parkKwh",
|
|
|
+ color:"#307af6"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:"计费电量",
|
|
|
+ key:"chargeKwh",
|
|
|
+ color:"#52b8aa"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:"自用电量",
|
|
|
+ key:"freeKwh",
|
|
|
+ color:"#53b56b"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:"公用电量",
|
|
|
+ key:"publicKwh",
|
|
|
+ color:"#ef8132"
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ name:"电损量",
|
|
|
+ key:"lostKwh",
|
|
|
+ color:"#dc4441"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ var dataName=[]
|
|
|
+ var dataSeries=[]
|
|
|
+ for(var i in data){
|
|
|
+ var it=data[i]
|
|
|
+ dataName.push(it.name)
|
|
|
+ dataSeries.push({})
|
|
|
+ }
|
|
|
+ for(var i in data){
|
|
|
+ var it=data[i]
|
|
|
+ dataSeries[data.length-i-1]={
|
|
|
+ name:it.name,
|
|
|
+ type: 'bar',
|
|
|
+ itemStyle:{
|
|
|
+ color:it.color
|
|
|
+ },
|
|
|
+ data: [
|
|
|
+
|
|
|
+ this.homePageManageObj[it.key]
|
|
|
+ ],
|
|
|
+ coordinateSystem: 'polar',
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ position: 'start',
|
|
|
+ formatter: '{c}度'
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ polar: {
|
|
|
+ center:['50%','58%'],
|
|
|
+ radius:[25, '80%']
|
|
|
+ },
|
|
|
+ angleAxis: {
|
|
|
+
|
|
|
+ startAngle: 75,
|
|
|
+ label: {
|
|
|
+ rotate: 45, // 旋转标签，使得重叠的概率降低
|
|
|
+ // margin: 5 // 设置标签与轴线之间的距离，增加空间
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ legend: {
|
|
|
+ itemGap:5,
|
|
|
+
|
|
|
+
|
|
|
+ data: dataName,
|
|
|
+ //orient :'vertical'
|
|
|
+ },
|
|
|
+ radiusAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: ['']
|
|
|
+ },
|
|
|
+ tooltip: {},
|
|
|
+
|
|
|
+ series: dataSeries
|
|
|
+ };
|
|
|
+ console.log(option)
|
|
|
+ this.myBarChart.setOption(option);
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ toDataMonitoringList() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/equipmentDataMonitoring/dataMonitoring-list'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toEquipmentConditionMonitoring() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/equipmentInformation/equipmentConditionMonitoring?companyId='+this.companyId
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toWorkOrderManagement() {
|
|
|
+
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/workOrderManagement/workOrderManagement'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toEquipmentElectricity() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/equipmentDataMonitoring/equipmentElectricity'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toElectronicMonitoring(item) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/equipmentDataMonitoring/electronicMonitoring?id=' + item.id + '&name=' + item
|
|
|
+ .name +
|
|
|
+ '&companyId=' + item.companyId
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .incomeExpenditureClass{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ width: 100%;
|
|
|
+ padding:32rpx 0;
|
|
|
+ .income1:last-child{
|
|
|
+ .income11,.income12{
|
|
|
+ border-right: 1px solid #c5c3c3;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .income1{
|
|
|
+ .income121{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color:#c5c3c3;
|
|
|
+ }
|
|
|
+ width: 33.33%;
|
|
|
+ text-align: center;
|
|
|
+ .income11{
|
|
|
+ padding:12rpx 0;
|
|
|
+ background-color: #1677FF ;
|
|
|
+ color:#fff;
|
|
|
+ font-size: 32rpx;
|
|
|
+ border-top: 1px solid #c5c3c3;
|
|
|
+ border-left: 1px solid #c5c3c3;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .income12{
|
|
|
+ padding:12rpx 0;
|
|
|
+ border-top: 1px solid #c5c3c3;
|
|
|
+ border-bottom: 1px solid #c5c3c3;
|
|
|
+ border-left: 1px solid #c5c3c3;
|
|
|
+ font-size: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /deep/.u-drawer-content {
|
|
|
+ margin-top: 88rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-tabs {
|
|
|
+ background-color: #fff;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding-top: 32rpx;
|
|
|
+ padding-right: 32rpx;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ width: 88%;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // /deep/.u-tab-item {
|
|
|
+ // width: 25% !important;
|
|
|
+ // flex: none !important;
|
|
|
+ // }
|
|
|
+ .tabs-len-1{
|
|
|
+
|
|
|
+ }
|
|
|
+ .tabs-len-2{
|
|
|
+ /deep/.u-tab-item {
|
|
|
+ // max-width: 39% !important;
|
|
|
+ // flex: none !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabs-len-3{
|
|
|
+ /deep/.u-tab-item {
|
|
|
+ max-width: 39% !important;
|
|
|
+ flex: none !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabs-len-4{
|
|
|
+ /deep/.u-tab-item {
|
|
|
+ max-width: 26% !important;
|
|
|
+ flex: none !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tabs{
|
|
|
+ /deep/.u-tab-item:first-child {
|
|
|
+ width: 20% !important;
|
|
|
+ flex: none !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // /deep/.u-tab-item2 {
|
|
|
+ // width: 33% !important;
|
|
|
+ // flex: none !important;
|
|
|
+ // }
|
|
|
+
|
|
|
+ .tabs-options {
|
|
|
+ display: flex;
|
|
|
+ padding: 24rpx 32rpx 0;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .item {
|
|
|
+ width: 25%;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 导航栏
|
|
|
+ .navbar {
|
|
|
+
|
|
|
+
|
|
|
+ background-color: rgba(22, 119, 255, 1);
|
|
|
+ color: #fff;
|
|
|
+ line-height: 88rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 32rpx;
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 999999;
|
|
|
+ font-weight: bold;
|
|
|
+ .title{
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .img {
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 标签
|
|
|
+ .tabs-box {
|
|
|
+ padding: 32rpx 0;
|
|
|
+ margin-top: 88rpx;
|
|
|
+ padding-right: 32rpx;
|
|
|
+ background-color: rgba(22, 119, 255, 1);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ width: 97%;
|
|
|
+ }
|
|
|
+ .more{
|
|
|
+ padding-right: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .main {
|
|
|
+ border-radius: 16px 16px 0px 0px;
|
|
|
+ background: linear-gradient(180deg, rgba(242, 244, 246, 1) 61%, rgba(255, 255, 255, 0) 100%);
|
|
|
+ margin-top: -24rpx;
|
|
|
+ padding: 32rpx;
|
|
|
+
|
|
|
+ .statistics {
|
|
|
+ border-radius: 8px;
|
|
|
+ background-color: rgba(255, 255, 255, 1);
|
|
|
+ box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ padding: 40rpx;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ border-radius: 999px;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .change {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .change-img {
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ text {
|
|
|
+
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .text {
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ margin-left: 16rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .change {
|
|
|
+ margin-left: 16rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #838383;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .check-all {
|
|
|
+ margin-left: auto;
|
|
|
+ color: rgba(131, 131, 131, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 用电量
|
|
|
+ .statistics-e {
|
|
|
+ padding: 40rpx;
|
|
|
+
|
|
|
+
|
|
|
+ .electricity {
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .item:last-of-type {
|
|
|
+ border: none;
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ padding: 16rpx 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
+
|
|
|
+ .item-content {
|
|
|
+ width: 93%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .equipment {
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+
|
|
|
+ .equipment1 {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ max-width: 40%;
|
|
|
+ font-weight: bold;
|
|
|
+
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+
|
|
|
+ .equipment2 {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ margin-left: 16rpx;
|
|
|
+ max-width: 40%;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 状态
|
|
|
+ .state {
|
|
|
+ white-space: pre;
|
|
|
+ //width: 64rpx;
|
|
|
+ //height: 36rpx;
|
|
|
+ padding: 0 4rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ text-align: center;
|
|
|
+ border: 1px solid rgba(255, 123, 0, 1);
|
|
|
+ color: rgba(255, 123, 0, 1);
|
|
|
+ margin-left: auto;
|
|
|
+
|
|
|
+ // .dot {
|
|
|
+ // margin-right: 8rpx;
|
|
|
+
|
|
|
+ // width: 16rpx;
|
|
|
+ // height: 16rpx;
|
|
|
+ // background-color: rgba(255, 123, 0, 1);
|
|
|
+ // border-radius: 999px;
|
|
|
+ // margin-left: auto;
|
|
|
+
|
|
|
+ // }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .state2 {
|
|
|
+ border: 1px solid rgba(0, 185, 98, 1);
|
|
|
+ color: rgba(0, 185, 98, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .electricity {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ margin-top: 8rpx;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .electricity-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ width: 33.3%;
|
|
|
+ height: 40rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+
|
|
|
+ .number {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .date {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 统计1
|
|
|
+ .statistics-1 {
|
|
|
+ background-color: rgba(255, 255, 255, 1);
|
|
|
+ width: 100%;
|
|
|
+ padding: 24rpx;
|
|
|
+ box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
+ border-radius: 8px;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+
|
|
|
+
|
|
|
+ .item {
|
|
|
+
|
|
|
+ margin-top: 32rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .item-progess {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 88rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ margin-right: 24rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .total {
|
|
|
+ margin-left: 24rpx;
|
|
|
+
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+
|
|
|
+ .total1 {
|
|
|
+ display: flex;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+
|
|
|
+ .normal {
|
|
|
+ margin-bottom: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .total2 {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .abnormal {
|
|
|
+ margin-left: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .total-number {
|
|
|
+ color: rgba(255, 123, 0, 1);
|
|
|
+ margin: 0 8rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 统计2异常报警记录
|
|
|
+ .statistics-2 {
|
|
|
+ .abnormal-item:last-of-type {
|
|
|
+ border-bottom: none !important;
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .abnormal-item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 16rpx;
|
|
|
+ border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
+
|
|
|
+
|
|
|
+ .item-title {
|
|
|
+
|
|
|
+
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ margin-right: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .name {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .date {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-value {
|
|
|
+ text-align: right;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .more {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .value1 {
|
|
|
+ font-weight: bold;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .value2 {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 统计3设备实时监控
|
|
|
+ .statistics-3 {
|
|
|
+ .monitoring-item {
|
|
|
+ padding: 16rpx 0;
|
|
|
+ border-bottom: 1px solid rgba(245, 245, 245, 1);
|
|
|
+
|
|
|
+ .item-title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .text1 {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .company-name {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .state {
|
|
|
+ margin-left: 12rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: rgba(255, 123, 0, 1);
|
|
|
+
|
|
|
+ text {
|
|
|
+ margin-right: 8rpx;
|
|
|
+ display: inline-block;
|
|
|
+ width: 16rpx;
|
|
|
+ height: 16rpx;
|
|
|
+ border-radius: 999px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .off-line {
|
|
|
+
|
|
|
+ background-color: rgba(255, 123, 0, 1);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .on-line {
|
|
|
+ background-color: rgba(0, 185, 98, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .state2 {
|
|
|
+ color: rgba(0, 185, 98, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .state {
|
|
|
+ margin-left: auto;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .state1,
|
|
|
+ .state2 {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-left: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .more {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ margin-right: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 监控信息
|
|
|
+ .infos {
|
|
|
+ margin-top: 8rpx;
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .infos-item {
|
|
|
+ width: 38%;
|
|
|
+
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 22rpx;
|
|
|
+ // margin-right: 16rpx;
|
|
|
+ margin-bottom: 8rpx;
|
|
|
+
|
|
|
+ .icon {}
|
|
|
+ }
|
|
|
+
|
|
|
+ .text {
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 设备状态
|
|
|
+ .statistics-4 {
|
|
|
+
|
|
|
+ .chat-img {
|
|
|
+ width: 100%;
|
|
|
+ height: 620rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 故障类型
|
|
|
+ .statistics-5,
|
|
|
+ .statistics-6 {
|
|
|
+ .chat-img {
|
|
|
+ width: 100%;
|
|
|
+ height: 410rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 异常设备排名
|
|
|
+ .statistics-ranking {
|
|
|
+ .total {
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+ padding-left: 52rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ color: #1677FF;
|
|
|
+ padding: 0 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .ranking-main {
|
|
|
+ margin-top: 40rpx;
|
|
|
+ border-radius: 16px;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .item:last-of-type {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 32rpx;
|
|
|
+
|
|
|
+ .ranking {
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ width: 72rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: rgba(219, 234, 255, 1);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ margin-left: 24rpx;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 48rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .name {
|
|
|
+ margin-left: 16rpx;
|
|
|
+
|
|
|
+ .name1 {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .name2 {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-top: 4rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .time {
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+ margin-left: auto;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ // 查看全部排名
|
|
|
+ .check-all {
|
|
|
+ text-align: center;
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 能源管理
|
|
|
+ .statistics-manage {
|
|
|
+ padding: 40rpx 0;
|
|
|
+
|
|
|
+ .title,
|
|
|
+ .chart,
|
|
|
+ .search,
|
|
|
+ .meter-statistic {
|
|
|
+ padding: 0 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 图表
|
|
|
+ .chart {
|
|
|
+ padding-top: 32rpx;
|
|
|
+ border-top: 1px solid rgba(242, 242, 242, 1);
|
|
|
+
|
|
|
+ /deep/.u-subsection {
|
|
|
+ padding: 2px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/.u-item {
|
|
|
+ padding: 0;
|
|
|
+ font-size: 24rpx
|
|
|
+ }
|
|
|
+
|
|
|
+ .chat-box {
|
|
|
+ //margin-top: 24rpx;
|
|
|
+ width: 100%;
|
|
|
+ //height: 480rpx;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ border-top: 1px solid rgba(242, 242, 242, 1);
|
|
|
+ border-bottom: 1px solid rgba(242, 242, 242, 1);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 40rpx 32rpx;
|
|
|
+
|
|
|
+ .switch {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ text {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .search-box {
|
|
|
+ border-radius: 50px;
|
|
|
+ background-color: rgba(242, 244, 246, 1);
|
|
|
+ color: rgba(136, 136, 136, 1);
|
|
|
+ height: 56rpx;
|
|
|
+ line-height: 56rpx;
|
|
|
+ padding-left: 16rpx;
|
|
|
+ padding-right: 8rpx;
|
|
|
+ flex: 1;
|
|
|
+ margin-left: 28rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ uni-input {
|
|
|
+ height: 56rpx;
|
|
|
+ line-height: 56rpx !important;
|
|
|
+ font-size: 28rpx;
|
|
|
+ width: 75%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ border-radius: 50px;
|
|
|
+ background-color: rgba(22, 119, 255, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ // 电表统计
|
|
|
+ .meter-statistic {
|
|
|
+ margin-top: 32rpx;
|
|
|
+ .meter-statistic-main{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .sum {
|
|
|
+
|
|
|
+
|
|
|
+ .meter-name {
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ margin-left: 8rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ margin-right: 8rpx;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .meter-state {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: rgba(255, 255, 255, 1);
|
|
|
+ color: rgba(0, 185, 98, 1);
|
|
|
+ font-size: 22rpx;
|
|
|
+ text-align: center;
|
|
|
+ border: 1px solid rgba(0, 185, 98, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .meter-state2 {
|
|
|
+ border: 1px solid rgba(255, 123, 0, 1);
|
|
|
+ color: rgba(255, 123, 0, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .meter-number {
|
|
|
+ margin-left: auto;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+
|
|
|
+ /deep/.u-icon--right {
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .sum2 {
|
|
|
+ padding: 0 32rpx;
|
|
|
+ margin-top: 8rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .value {
|
|
|
+ color: rgba(119, 119, 119, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 一级表
|
|
|
+ .first-level {
|
|
|
+ padding-left: 16rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .meter-name {
|
|
|
+ font-size: 28rpx
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .first-level-list{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ // 二级表
|
|
|
+ .second-level {
|
|
|
+ padding-left: 32rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .meter-name {
|
|
|
+ font-size: 24rpx
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .else-switch {
|
|
|
+ padding-left: 72rpx;
|
|
|
+
|
|
|
+ .meter-name {
|
|
|
+ font-size: 24rpx
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ margin-top: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/.u-drawer {
|
|
|
+ z-index: 999 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .contractList{
|
|
|
+ font-weight: bold;
|
|
|
+ .contractListClass{
|
|
|
+ display: flex;
|
|
|
+ margin-top:24rpx;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: rgba(51,51,51,1);
|
|
|
+
|
|
|
+ .img{
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ margin-right: 18rpx;
|
|
|
+ }
|
|
|
+ .contractListClass1{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .tenantListNum{
|
|
|
+ margin: 0 8rpx;
|
|
|
+ color:#FF7B00 ;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
zhengkaixin