<template>
<view class="content">
<cu-custom bgColor="bg-blacks" :isBack="false">
<block slot="right">
<image src="../../static/picture/fourLine.png" style="width: 30px;height: 30px;margin-left: 2%;" @tap="openDrawer"></image>
</block>
<block slot="right">
<view class="icon cuIcon-notice text-white" v-if="badge != 0" style="margin-left: -70%;">
<view class="cu-tag looknumber" style="margin-top: -2%;">
<block v-if="badge != 1">{{ badge > 99 ? '99+' : badge }}</block>
</view>
</view>
</block>
<block slot="right">
</block>
<block slot="content">{{address}}</block>
<block slot="right">
<view class="plus" @tap="showModal" data-target="viewModal">+</view>
</block>
</cu-custom>
<!-- 抽屉组件 -->
<div>
<drawer ref="drawer"></drawer>
</div>
<div class="plusDrawer" @tap="hideModal">
<plusDrawer ref="plusDrawer"></plusDrawer>
</div>
<scroll-view scroll-y class="DrawerPage" :class="modalName == 'viewModal' ? 'show' : ''">
<!--时间组件-->
<view class="time">
<view class="timeimageshizhong" @tap="common.navTo('/components/weatherProphet/WeatherProphet')">
<image src="../../static/picture/dafeng.png" style="width: 20px;height: 20px;margin-left: 10px;"></image>
</view>
<view class="timeText">推荐时间：2020年4月15日 19:31</view>
<view class="timeIcon">
<image src="../../static/picture/qingwhite.png" style="width: 25px;height: 25px;"></image>
</view>
</view>
<!--电量卡片-->
<view class="InformationCard">
<view class="informationCardAll">
<view class="informationCardTextOne">
<view class="informationCardText">
<view class="textSilver" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=安全天数&callTargetUnit=天&pointKey=' +
windpowerstationdetail.target_comprehensive_indicators.aqts_real.ednaId
)
">
安全天数(天):
</view>
<view class="textWhite">
{{ windpowerstationdetail.target_comprehensive_indicators.aqts }}
</view>
</view>
<view class="informationCardTextzj">
<view class="textSilver" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=装机容量&callTargetUnit=mv&pointKey=' +
windpowerstationdetail.target_comprehensive_indicators.zjrl_real.ednaId
)
">
装机容量(mv):
</view>
<view class="textWhite3">
{{ windpowerstationdetail.target_comprehensive_indicators.zjrl }}
</view>
</view>
</view>
<view class="informationCardTextTwo">
<view class="informationCardTextNo1">
<view class="textSilver" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=日发电量&callTargetUnit=kwh&pointKey=' +
windpowerstationdetail.target_comprehensive_indicators.rfdl_real.ednaId
)
">
日发(万kwh):
</view>
<view class="textWhite">
{{ windpowerstationdetail.target_comprehensive_indicators.rfdl }}
</view>
</view>
<view class="informationCardText3">
<view class="textSilver" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=预测发电量&callTargetUnit=kwh&pointKey=' +
windpowerstationdetail.target_comprehensive_indicators.ycfdl_real.ednaId
)
">
预测发(万kwh):
</view>
<view class="textWhite2">
{{ windpowerstationdetail.target_comprehensive_indicators.ycfdl }}
</view>
</view>
<view class="informationCardText2">
<view class="textSilver" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=上网电量&callTargetUnit=kwh&pointKey=' +
windpowerstationdetail.target_comprehensive_indicators.swdl_real.ednaId
)
">
上网(万kwh):
</view>
<view class="textWhite">
{{ windpowerstationdetail.target_comprehensive_indicators.swdl }}
</view>
</view>
</view>
</view>
</view>
<!--风速卡片-->
<view class="speedPower">
<view class="cardinstallredSpeed" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=平均风速&callTargetUnit=kw/h&pointKey=' + windpowerstationdetail.target_windSpeed_power.pjfs_real.ednaId
)
">
<view class="cardinstalltitleRed">
平均风速(m/s)
<!-- <view class="textWhitekuangSpeed">(m/s)</view> -->
</view>
<view class="cardinstallnumberred">{{ windpowerstationdetail.target_windSpeed_power.pjfs }}</view>
<view class="cardinstallnumberredmin">
<view class="redMinText">min: {{ windpowerstationdetail.target_windSpeed_power.pjfsMin }}</view>
</view>
<view class="cardinstallnumberredmax">
<view class="redMaxText">max: {{ windpowerstationdetail.target_windSpeed_power.pjfsMax }}</view>
</view>
</view>
<view class="cardinstallredSpeed" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=预测风速&callTargetUnit=kw/h&pointKey=' + windpowerstationdetail.target_windSpeed_power.ycfs_real.ednaId
)
">
<view class="cardinstalltitleRed">
预测风速(m/s)
<!-- <view class="textWhitekuangSpeed">(m/s)</view> -->
</view>
<view class="cardinstallnumberred">{{ windpowerstationdetail.target_windSpeed_power.ycfs }}</view>
<view class="cardinstallnumberredmin">
<view class="redMinText">min: {{ windpowerstationdetail.target_windSpeed_power.ycfsMin }}</view>
</view>
<view class="cardinstallnumberredmax">
<view class="redMaxText">max: {{ windpowerstationdetail.target_windSpeed_power.ycfsMax }}</view>
</view>
</view>
<view class="cardinstallredSpeed" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=实际功率&callTargetUnit=kw&pointKey=' + windpowerstationdetail.target_windSpeed_power.sjgl_real.ednaId
)
">
<view class="cardinstalltitleRed">
实际功率(万kw)
<!-- <view class="textWhitekuang">(kw)</view> -->
</view>
<view class="cardinstallnumberred">{{ windpowerstationdetail.target_windSpeed_power.sjgl }}</view>
<view class="cardinstallnumberredmin">
<view class="redMinText">min: {{ windpowerstationdetail.target_windSpeed_power.sjglMin }}</view>
</view>
<view class="cardinstallnumberredmax">
<view class="redMaxText">max: {{ windpowerstationdetail.target_windSpeed_power.sjglMax }}</view>
</view>
</view>
<view class="cardinstallredSpeed" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=理论功率&callTargetUnit=kw&pointKey=' + windpowerstationdetail.target_windSpeed_power.llgl_real.ednaId
)
">
<view class="cardinstalltitleRed">
理论功率(万kw)
<!-- <view class="textWhitekuang">(kw)</view> -->
</view>
<view class="cardinstallnumberred">{{ windpowerstationdetail.target_windSpeed_power.llgl }}</view>
<view class="cardinstallnumberredmin">
<view class="redMinText">min: {{ windpowerstationdetail.target_windSpeed_power.llglMin }}</view>
</view>
<view class="cardinstallnumberredmax">
<view class="redMaxText">max: {{ windpowerstationdetail.target_windSpeed_power.llglMax }}</view>
</view>
</view>
</view>
<!--接入卡片-->
<view class="interfaceCard">
<view class="interfaceCardSmallTop">
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/001.png" style="width: 18px;height:18px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">接入</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.jr }}</view>
</view>
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/002.png" style="width: 18px;height:18px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">待机</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.dj }}</view>
</view>
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/003.png" style="width: 18px;height:18px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">运行</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.yx }}</view>
</view>
</view>
<view class="interfaceCardSmallTop">
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/004.png" style="width: 18px;height:18px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">故障</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.gz }}</view>
</view>
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/005.png" style="width: 18px;height:18px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">维护</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.wh }}</view>
</view>
<view class="interfaceCardSmall">
<view class="AccessCardimage">
<image src="../../static/picture/006.png" style="width: 18px;height:19px;margin-top: 9px;margin-left: 7px;"></image>
</view>
<view class="AccessCardText">离线</view>
<view class="AccessCardNumber">{{ windpowerstationdetail.index_windturbine_status.lx }}</view>
</view>
</view>
</view>
<!--进度条-->
<view class="progressBar">
<view class="progressBarAll">
<view class="progressBarOne">
<view class="progressBarLeft">
<view class="progressBarLeftText">{{ windpowerstationdetail.index_electricQuantity.yfdl }}kwh</view>
</view>
<view class="progressBarText">月计划发电量进度条</view>
<view class="progressBarRight">
<view class="progressBarRightText">{{ windpowerstationdetail.index_electricQuantity.yjhfdl }}kwh</view>
</view>
</view>
<view class="cu-progress round radius striped active">
<view class="bg-olive" :style="[{ width: loading ? monthOlive : '' }]"></view>
<view class="bg-angrey" :style="[{ width: loading ? monthAngrey : '' }]"></view>
</view>
</view>
<view class="progressBarAll">
<view class="progressBarOne">
<view class="progressBarLeft">
<view class="progressBarLeftText">{{ windpowerstationdetail.index_electricQuantity.nfdl }}kwh</view>
</view>
<view class="progressBarText">年计划发电量进度条</view>
<view class="progressBarRight">
<view class="progressBarRightText">{{ windpowerstationdetail.index_electricQuantity.njhfdl }}kwh</view>
</view>
</view>
<view class="cu-progress round radius striped active">
<view class="bg-olive" :style="[{ width: loading ? yearOlive : '' }]"></view>
<view class="bg-angrey" :style="[{ width: loading ? yearAngrey : '' }]"></view>
</view>
</view>
</view>
<scroll-view scroll-x class="horizontalSlider">
<view class="slide">
<view class="monthlyUtilizationHours" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=月利用小时&callTargetUnit=h&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.ylyxs_real.ednaId
)
">
月利用小时（h）：{{ windpowerstationdetail.index_target_basic_indicators.ylyxs }}
</view>
<view class="yearlyUtilizationHours" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=年利用小时&callTargetUnit=h&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.nlyxs_real.ednaId
)
">
年利用小时（h）：{{ windpowerstationdetail.index_target_basic_indicators.nlyxs }}
</view>
<view class="comprehensiveServicePowerConsumptionRate" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=综合厂利用率&callTargetUnit=%&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.zhcydl_real.ednaId
)
">
综合厂用电率(%)：{{ windpowerstationdetail.index_target_basic_indicators.zhcydl }}
</view>
<view class="equipmentAvailability" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=设备可利用率&callTargetUnit=%&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.sbklyl_real.ednaId
)
">
设备可利用率(%)：{{ windpowerstationdetail.index_target_basic_indicators.sbklyl }}
</view>
<view class="sulfurDioxideEmissionReduction" @tap="
common.navTo(
'/components/detail/Detail?callTargetName= 减排二氧化硫&callTargetUnit=吨&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.jpeyhl_real.ednaId
)
">
减排二氧化硫(吨)：{{ windpowerstationdetail.index_target_basic_indicators.jpeyhl }}
</view>
<view class="carbonDioxideReduction" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=减排二氧化碳&callTargetUnit=吨&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.jpeyht_real.ednaId
)
">
减排二氧化碳(吨)：{{ windpowerstationdetail.index_target_basic_indicators.jpeyht }}
</view>
<view class="waterSaving" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=节约用水&callTargetUnit=吨&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.jyys_real.ednaId
)
">
节约用水(吨)：{{ windpowerstationdetail.index_target_basic_indicators.jyys }}
</view>
<view class="saveStandardCoal" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=节约标煤&callTargetUnit=吨&pointKey=' +
windpowerstationdetail.index_target_basic_indicators.jybm_real.ednaId
)
">
节约标煤(吨)：{{ windpowerstationdetail.index_target_basic_indicators.jybm }}
</view>
<view class="mttr" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=mttr&callTargetUnit=h&pointKey=' + windpowerstationdetail.index_target_basic_indicators.mttr_real.ednaId
)
">
mttr(h)：{{ windpowerstationdetail.index_target_basic_indicators.mttr }}
</view>
<view class="mtbf" @tap="
common.navTo(
'/components/detail/Detail?callTargetName=mtbf&callTargetUnit=h&pointKey=' + windpowerstationdetail.index_target_basic_indicators.mtbf_real.ednaId
)
">
mtbf(h)：{{ windpowerstationdetail.index_target_basic_indicators.mtbf }}
</view>
</view>
</scroll-view>
<!--折线图-->
<view class="lineChart">
<view class="qiun-charts">
<view class="speedPowerDiagram">风速功率曲线图</view>
<canvas canvas-id="canvasLineA" id="canvasLineA" class="charts" @touchstart="touchLineA"></canvas>
</view>
</view>
<!-- 柱状图 -->
<view class="Histogram">
<view class="HistogramTitle">五项损失柱状图</view>
<view class="choice">
<view class="directGeneration">
<image src="../../static/picture/dianliang/dianlianglan.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="directGenerationText" @click="directGeneration()">应发</view>
</view>
<view class="powerGeneration">
<image src="../../static/picture/dianliang/dianlianglv.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="powerGenerationText" @click="powerGeneration()">日发</view>
</view>
<view class="faultPower">
<image src="../../static/picture/dianliang/dianlianghong.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="faultPowerText" @click="faultPower()">故障损失</view>
</view>
<view class="maintenancePower">
<image src="../../static/picture/dianliang/dianliangcheng.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="maintenancePowerText" @click="maintenancePower()">检修损失</view>
</view>
<view class="limitedPower">
<image src="../../static/picture/dianliang/dianliangfen.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="limitedPowerText" @click="limitedPower()">限电损失</view>
</view>
<view class="performancePower">
<image src="../../static/picture/dianliang/dianliangzi.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="performancePowerText" @click="performancePower()">性能损失</view>
</view>
<view class="AffectedPower">
<image src="../../static/picture/dianliang/dianlianghui.png" style="width: 18px;height: 18px;float: left;margin-top: 4px;"></image>
<view class="AffectedPowerText" @click="AffectedPower()">受累损失</view>
</view>
</view>
<view class="qiun-chart"><canvas canvas-id="canvasColumnStack" id="canvasColumnStack" class="chart" @touchstart="touchColumn"></canvas></view>
</view>
<!-- 风电场卡片 -->
<view class="windStation">
<scroll-view scroll-x class="scrollWindStationCard">
<view class="windStationCardContainer">
<view class="windStationCard" @tap="common.navTo('/components/windStationCardDetail/WindStationCardDetail?option=' + '崇礼')">
<view class="windStationTitle">崇礼风电场</view>
<view class="powerAndSpeedContainer">
<view class="powerAndSpeedRed">
预测发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{index_windStation_cardmodule.index_windStation_cardmodule.CL_FDC.ycdl}}</span>
</view>
<view class="powerAndSpeedRed">
日发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.rfdl }} --></span>
<span v-if="cardmodule==false"> {{ index_windStation_cardmodule.index_windStation_cardmodule.CL_FDC.rfdl }}</span>
</view>
<view class="powerAndSpeedRed">
实风速(m/s):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ssfs }} --></span>
<span v-if="cardmodule==false"> {{ index_windStation_cardmodule.index_windStation_cardmodule.CL_FDC.ssfs }}</span>
</view>
<view class="powerAndSpeedRed">
实功率(万kw):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ssgl }} --></span>
<span v-if="cardmodule==false"> {{ index_windStation_cardmodule.index_windStation_cardmodule.CL_FDC.ssgl }}
</span>
</view>
</view>
<!-- HQChart图 -->
<!-- <view class="HQChart">
<div class="divchart" ref="divchart"><div id="minute" style="width: 250px; height: 100px;" ref="minute"></div></div>
</view> -->
<view class="UChartContainer">
<view class="windStationUChart">
<view class="windStationQiun-charts">
<canvas canvas-id="windStationCanvasLineA" id="windStationCanvasLineA" class="windStationCharts" @touchstart="touchLineB1"></canvas>
</view>
</view>
<view class="UChartTitle">风速功率曲线图</view>
</view>
<view class="fanStatusContainer">
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/001.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">接入 0</span>
<span v-if="module==false">接入 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.jr }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/002.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">待机 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.dj }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/003.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">运行 0</span>
<span v-if="module==false">运行 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.yx }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/004.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">故障 0</span>
<span v-if="module==false">故障 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.gz }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/005.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">维护 0</span>
<span v-if="module==false">维护 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.wh }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/006.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">离线 0</span>
<span v-if="module==false">离线 {{ fdcstatusmodule.fdcstatusmodule.CL_FDC.lx }}</span>
</view>
</view>
</view>
<view class="windStationCard" @tap="common.navTo('/components/windStationCardDetail/WindStationCardDetail?option=' + '代县')">
<view class="windStationTitle">代县风电场</view>
<view class="powerAndSpeedContainer">
<view class="powerAndSpeedRed">
预测发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.DX_FDC.ycdl }}</span>
</view>
<view class="powerAndSpeedRed">
日发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.DX_FDC.rfdl }}</span>
</view>
<view class="powerAndSpeedRed">
实风速(m/s):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.DX_FDC.ssfs }}</span>
</view>
<view class="powerAndSpeedRed">
实功率(万kw):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.DX_FDC.ssgl }}</span>
</view>
</view>
<!-- HQChart图 -->
<!-- <view class="HQChart">
<div class="divchart" ref="divchart"><div id="minute" style="width: 250px; height: 100px;" ref="minute"></div></div>
</view> -->
<view class="UChartContainer">
<view class="windStationUChart">
<view class="windStationQiun-charts">
<canvas canvas-id="windStationCanvasLineB" id="windStationCanvasLineB" class="windStationCharts" @touchstart="touchLineB2"></canvas>
</view>
</view>
<view class="UChartTitle">风速功率曲线图</view>
<!-- <view class="xTime">时间</view> -->
</view>
<view class="fanStatusContainer">
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/001.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">接入 0</span>
<span v-if="module==false">接入 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.jr }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/002.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">待机 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.dj }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/003.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">运行 0</span>
<span v-if="module==false">运行 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.yx }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/004.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">故障 0</span>
<span v-if="module==false">故障 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.gz }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/005.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">维护 0</span>
<span v-if="module==false">维护 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.wh }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/006.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">离线 0</span>
<span v-if="module==false">离线 {{ fdcstatusmodule.fdcstatusmodule.DX_FDC.lx }}</span>
</view>
</view>
</view>
<view class="windStationCard" @tap="common.navTo('/components/windStationCardDetail/WindStationCardDetail?option=' + '康保')">
<view class="windStationTitle">康保风电场</view>
<view class="powerAndSpeedContainer">
<view class="powerAndSpeedRed">
预测发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.KB_FDC.ycdl }}</span>
</view>
<view class="powerAndSpeedRed">
日发(万kwh):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.KB_FDC.rfdl }}</span>
</view>
<view class="powerAndSpeedRed">
实风速(m/s):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.KB_FDC.ssfs }}</span>
</view>
<view class="powerAndSpeedRed">
实功率(万kw):
<span v-if="cardmodule">
<!-- {{ index_windStation_cardmodule.index_windStation_cardmodule.MHS_FDC.ycdl }} --></span>
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.KB_FDC.ssgl }}</span>
</view>
</view>
<!-- HQChart图 -->
<!-- <view class="HQChart">
<div class="divchart" ref="divchart"><div id="minute" style="width: 250px; height: 100px;" ref="minute"></div></div>
</view> -->
<view class="UChartContainer">
<view class="windStationUChart">
<view class="windStationQiun-charts">
<canvas canvas-id="windStationCanvasLineC" id="windStationCanvasLineC" class="windStationCharts" @touchstart="touchLineB3"></canvas>
</view>
</view>
<view class="UChartTitle">风速功率曲线图</view>
<!-- <view class="xTime">时间</view> -->
</view>
<view class="fanStatusContainer">
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/001.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">接入 0</span>
<span v-if="module==false">接入 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.jr }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/002.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">待机 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.dj }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/003.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">运行 0</span>
<span v-if="module==false">运行 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.yx }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/004.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">故障 0</span>
<span v-if="module==false">故障 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.gz }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/005.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">维护 0</span>
<span v-if="module==false">维护 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.wh }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/006.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">离线 0</span>
<span v-if="module==false">离线 {{ fdcstatusmodule.fdcstatusmodule.KB_FDC.lx }}</span>
</view>
</view>
</view>
<!-- <view class="windStationCard" @tap="common.navTo('/components/windStationCardDetail/WindStationCardDetail?option=' + '青山')">
<view class="windStationTitle">青山风电场</view>
<view class="powerAndSpeedContainer">
<view class="powerAndSpeedRed">
预测发(万kwh):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.QS_FDC.ycdl }}</span>
</view>
<view class="powerAndSpeedRed">
日发(万kwh):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.QS_FDC.rfdl }}</span>
</view>
<view class="powerAndSpeedRed">
实风速(m/s):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.QS_FDC.ssfs }}</span>
</view>
<view class="powerAndSpeedRed">
实功率(万kw):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.QS_FDC.ssgl }}</span>
</view>
</view>
<view class="UChartContainer">
<view class="windStationUChart">
<view class="windStationQiun-charts">
<canvas canvas-id="windStationCanvasLineD" id="windStationCanvasLineD" class="windStationCharts" @touchstart="touchLineB4"></canvas>
</view>
</view>
<view class="UChartTitle">风速功率曲线图</view>
</view>
<view class="fanStatusContainer">
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/001.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">接入 0</span>
<span v-if="module==false">接入 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.jr }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/002.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">待机 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.dj }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/003.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">运行 0</span>
<span v-if="module==false">运行 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.yx }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/004.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">故障 0</span>
<span v-if="module==false">故障 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.gz }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/005.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">维护 0</span>
<span v-if="module==false">维护 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.wh }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/006.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">离线 0</span>
<span v-if="module==false">离线 {{ fdcstatusmodule.fdcstatusmodule.QS_FDC.lx }}</span>
</view>
</view>
</view> -->
<!-- <view class="windStationCard" @tap="common.navTo('/components/windStationCardDetail/WindStationCardDetail?option=' + '香山')">
<view class="windStationTitle">香山风电场</view>
<view class="powerAndSpeedContainer">
<view class="powerAndSpeedRed">
预测发(万kwh):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.XS_FDC.ycdl }}</span>
</view>
<view class="powerAndSpeedRed">
日发(万kwh):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.XS_FDC.rfdl }}</span>
</view>
<view class="powerAndSpeedRed">
实风速(m/s):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.XS_FDC.ssfs }}</span>
</view>
<view class="powerAndSpeedRed">
实功率(万kw):
<span v-if="cardmodule">
<span v-if="cardmodule==false">{{ index_windStation_cardmodule.index_windStation_cardmodule.XS_FDC.ssgl }}</span>
</view>
</view>
<view class="UChartContainer">
<view class="windStationUChart">
<view class="windStationQiun-charts">
<canvas canvas-id="windStationCanvasLineE" id="windStationCanvasLineE" class="windStationCharts" @touchstart="touchLineB5"></canvas>
</view>
</view>
<view class="UChartTitle">风速功率曲线图</view>
</view>
<view class="fanStatusContainer">
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/001.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">接入 0</span>
<span v-if="module==false">接入 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.jr }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/002.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">待机 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.dj }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/003.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">运行 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.yx }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/004.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">故障 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.gz }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/005.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">维护 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.wh }}</span>
</view>
<view class="fanStatus">
<view class="statusIcon">
<image src="../../static/picture/006.png" style="width: 16px;height: 16px;margin-top: 7px;"></image>
</view>
<span v-if="module">待机 0</span>
<span v-if="module==false">离线 {{ fdcstatusmodule.fdcstatusmodule.XS_FDC.lx }}</span>
</view>
</view>
</view> -->
</view>
</scroll-view>
</view>
</scroll-view>
<view class="DrawerClose" :class="modalName == 'viewModal' ? 'show' : ''" @tap="hideModal"><text class="cuIcon-pullright"></text></view>
</view>
</template>
<script>
import plusDrawer from '../../components/drawer/plusDrawer.vue';
import drawer from '../../components/drawer/threeLineDrawer.vue';
import uCharts from '../../components/tools/u-charts/u-charts.js';
var _self;
var canvaLineA = null;
var canvaColumn = null;
var canvaLineB1 = null;
var canvaLineB2 = null;
var canvaLineB3 = null;
var canvaLineB4 = null;
var canvaLineB5 = null;
export default {
components: {
drawer: drawer,
plusDrawer: plusDrawer
},
data: function() {
return {
c1: {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18'],
series: [{
name: '应发电量(万kwh)',
data: [0, 0, 0, 0, 0, 0, 0],
color: '#007BF9'
},
{
name: '日发电量(万kwh)',
data: [18, 13, 12, 17, 13, 7, 11],
color: '#4EB64E'
},
{
name: '故障损失电量(万kwh)',
data: [17, 15, 17, 21, 16, 8, 10],
color: '#F14E51'
},
{
name: '检修损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12],
color: '#FF6B3E'
},
{
name: '限电损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12],
color: '#DC62D2'
},
{
name: '性能损失电量(万kwh)',
data: [15, 17, 19, 20, 6, 4, 12],
color: '#9DA3F6'
},
{
name: '受累损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 4, 12],
color: '#9E9E9E'
}
]
},
key_aqts: '',
fdcstatusmodule: {
fdcstatusmodule: ''
},
index_windStation_cardmodule: {
index_windStation_cardmodule: ''
},
index_curve_columnar_five_lossmodule: {
index_curve_columnar_five_lossmodule: ''
},
index_curve_columnar_windSpeed_powermodule: {
index_curve_columnar_windSpeed_powermodule: ''
},
badge: 22,
drawerList: [{
name: '首页'
},
{
name: '状态监视'
},
{
name: '矩阵监视'
},
{
name: '人员监视'
}
],
plusDrawerList: [],
modalName: null,
address: '河北能源集团',
windPowerStationId: '',
inconList: ['form', 'favor', 'question', 'edit'],
minaverageSpeed: '12',
maxaverageSpeed: '25',
loading: false,
cWidth: '',
cHeight: '',
pixelRatio: 1,
serverData: '',
dayHair: false,
fault: false,
overhaul: false,
powerLimitation: false,
performance: false,
toBeInvolved: false,
Xzuobiao: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18'],
rifa: [18, 13, 12, 17, 13, 7, 11],
guzhang: [17, 15, 17, 21, 16, 8, 10],
jianxiu: [14, 17, 19, 20, 6, 14, 12],
xiandian: [14, 17, 19, 20, 6, 14, 12],
xingneng: [15, 17, 19, 20, 6, 4, 12],
shoulei: [14, 17, 19, 20, 6, 4, 12],
clickFlag: 'stack',
windStationCardCWidth: '',
windStationCardCHeight: '',
windStationCardPixelRatio: 1,
monthOlive: '',
monthAngrey: '',
yearOlive: '',
yearAngrey: '',
FDC:'CL_FDC',
socketTask_target_comprehensive_indicators: '',
socketTask_target_windSpeed_power: '',
socketTask_index_windturbine_status: '',
socketTask_index_electricQuantity: '',
socketTask_index_target_basic_indicators: '',
socketTask_index_curve_columnar_five_loss: '',
socketTask_index_curve_columnar_windSpeed_power: '',
windpowerstationdetail: {
target_comprehensive_indicators: '',
target_windSpeed_power: '',
index_windturbine_status:'',
index_electricQuantity: '',
index_target_basic_indicators: ''
},
module: true,
cardmodule: true
};
},
created: function() {
this.viewUserid();
this.address = this.getWindPowerStationNameToSessionStorage();
if (this.address == '') {
this.pushWindPowerStationNameToSessionStorage('河北能源集团');
this.address = this.getWindPowerStationNameToSessionStorage();
}
if (this.address == '河北能源集团') {
this.FDC = '0';
}
if (this.address == '崇礼风电场') {
this.FDC = 'CL_FDC';
}
if (this.address == '代县风电场') {
this.FDC = 'DX_FDC';
}
if (this.address == '康保风电场') {
this.FDC = 'KB_FDC';
}
uni.setStorageSync('windPowerStationId',this.FDC);
},
onLoad: function() {
let that = this;
setTimeout(function() {
that.loading = true;
}, 500);
_self = this;
this.cWidth = uni.upx2px(750);
this.cHeight = uni.upx2px(400);
this.getServerData();
this.getColumnData();
this.windStationCardCWidth = 250;
this.windStationCardCHeight = 150;
/*
*/
this.target_comprehensive_indicators();
this.index_electricQuantity();
this.index_target_basic_indicators();
this.index_curve_columnar_five_loss();
this.target_windSpeed_power();
this.index_windturbine_status();
this.getWindStationCardData();
this.index_curve_columnar_windSpeed_power();
this.index_windStation_card(); /* P6F8与P6F4冲突 */
},
computed: {
backStageIp: function() {
return this.$store.state.wholeSituationBackStageIp;
},
backStagePort: function() {
return this.$store.state.wholeSituationBackStagePort;
},
windpowerstationNameToId: function() {
return this.$store.state.windpowerstationNameToId;
}
},
onHide() {
this.$refs.drawer.closeDrawer();
this.hideModal();
},
onShow() {
this.windPowerStationId = uni.getStorageSync('windPowerStationId');
this.address = this.getWindPowerStationNameToSessionStorage();
if (this.address == '河北能源集团') {
this.FDC = '0';
}
if (this.address == '崇礼风电场') {
this.FDC = 'CL_FDC';
}
if (this.address == '代县风电场') {
this.FDC = 'DX_FDC';
}
if (this.address == '康保风电场') {
this.FDC = 'KB_FDC';
}
},
methods: {
viewUserid:function(){
let _this = this;
_this.userid =uni.getStorageSync('userid')
//_this.userid = sessionStorage.getItem('userid');
uni.request({
url: 'http://' + this.backStageIp + ':' + this.backStagePort + '/GyeeorganController/GyeeOrganList?userid=' + _this.userid,
data: {},
method: 'GET',
success: function(res) {
for(let i=0;i<res.data.data.length;i++){
// _this.name.push(res.data.data[i].describes);
// _this.windId.push(res.data.data[i].name);
}
for(let j=0;j<res.data.data.length;j++){
var a = {};
_this.$set(a,"name",res.data.data[j].describes);
_this.$set(a,"windId",res.data.data[j].name);
_this.plusDrawerList.push(a);
}
},
})
},
async index_curve_columnar_five_loss() {
Date.prototype.Format = function(fmt) {
var o = {
'M+': this.getMonth() + 1, //月份
'd+': this.getDate(), //日
'h+': this.getHours(), //小时
'm+': this.getMinutes(), //分
's+': this.getSeconds(), //秒
'q+': Math.floor((this.getMonth() + 3) / 3), //季度
S: this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[
k]).substr(('' + o[k]).length));
return fmt;
};
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_curve_columnar_five_loss = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_7',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_curve_columnar_five_loss.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_curve_columnar_five_loss.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule = JSON.parse(res.data);
let ColumnStack = this.c1;
if (this.dayHair) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '日发电量(万kwh)',
data: [18, 13, 12, 17, 13, 7, 11, 15, 13],
color: '#4EB64E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.rifa.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.rifa[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.fault) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '故障损失电量(万kwh)',
data: [17, 15, 17, 21, 16, 8, 10, 17, 11],
color: '#F14E51'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.guzhang.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.guzhang[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.overhaul) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '检修损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#FF6B3E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.jianxiu.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.jianxiu[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.powerLimitation) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '限电损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#DC62D2'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.xiandian.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.xiandian[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.performance) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '性能损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#9DA3F6'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.xingneng.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.xingneng[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.toBeInvolved) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '受累损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#9E9E9E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.shoulei.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.shoulei[i]);
// console.log(ColumnStack.series[1].data)
}
}
ColumnStack.categories = [];
//ColumnStack.series[0].data=[];
ColumnStack.series[1].data = [];
ColumnStack.series[2].data = [];
ColumnStack.series[3].data = [];
ColumnStack.series[4].data = [];
ColumnStack.series[5].data = [];
ColumnStack.series[6].data = [];
/* LineA.series[0].name=this.targetName; */
_this.Xzuobiao = [];
_this.rifa = [];
_this.guzhang = [];
_this.jianxiu = [];
_this.xiandian = [];
_this.xingneng = [];
_this.shoulei = [];
for (var i = 0; i < _this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
.length; i++) {
let time = new Date(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].time).Format('MM/dd');
ColumnStack.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
//ColumnStack.series[0].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value7);
ColumnStack.series[1].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value1);
ColumnStack.series[2].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value2);
ColumnStack.series[3].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value3);
ColumnStack.series[4].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value4);
ColumnStack.series[5].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value5);
ColumnStack.series[6].data.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[
_this.FDC][i].value6);
_this.Xzuobiao.push(time);
// _this.$set(_this.rifa,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value1);
// _this.$set(_this.guzhang,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value2);
// _this.$set(_this.jianxiu,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value3);
// _this.$set(_this.xiandian,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value4);
// _this.$set(_this.xingneng,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value5);
// _this.$set(_this.shoulei,i,_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][i].value6);
_this.rifa.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC][
i
].value1);
_this.guzhang.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].value2);
_this.jianxiu.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].value3);
_this.xiandian.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].value4);
_this.xingneng.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].value5);
_this.shoulei.push(_this.index_curve_columnar_five_lossmodule.index_curve_columnar_five_lossmodule[_this.FDC]
[i].value6);
//ColumnStack.series[1].data.push(_this.rifa[i]);
}
_this.showColumnStack('canvasColumnStack', ColumnStack);
});
});
},
/* async index_windStation_card() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_windStation_card = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_8',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_windStation_card.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_windStation_card.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.index_windStation_cardmodule.index_windStation_cardmodule = JSON.parse(res.data);
console.log();
});
});
}, */
async index_windStation_card() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_windStation_card = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_8',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_windStation_card.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_windStation_card.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.index_windStation_cardmodule.index_windStation_cardmodule = JSON.parse(res.data);
_this.cardmodule = false;
console.log();
});
});
},
async index_curve_columnar_windSpeed_power() {
Date.prototype.Format = function(fmt) {
var o = {
'M+': this.getMonth() + 1, //月份
'd+': this.getDate(), //日
'h+': this.getHours(), //小时
'm+': this.getMinutes(), //分
's+': this.getSeconds(), //秒
'q+': Math.floor((this.getMonth() + 3) / 3), //季度
S: this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[
k]).substr(('' + o[k]).length));
return fmt;
};
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_curve_columnar_windSpeed_power = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_6',
/* url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_7/functionNumber_4', */
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_curve_columnar_windSpeed_power.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_curve_columnar_windSpeed_power.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule = JSON.parse(res
.data);
console.log("---");
let LineA = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineB = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineC = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineD = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineE = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let Line = {
categories: [],
series: [{
name: '功率',
data: [],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
Line.categories = [];
Line.series[0].data = [];
/* LineA.series[0].name=this.targetName; */
console.log(_this.FDC);
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
_this.FDC]['gl'].length; i++) {
let time = new Date(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[_this.FDC][
'gl'
][i].pointTime * 1000
).Format('hh');
Line.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
Line.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[_this.FDC][
'gl'
][i].pointValueInDouble
);
Line.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[_this.FDC][
'fs'
][i].pointValueInDouble
);
Line.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[_this.FDC][
'llgl'
][i].pointValueInDouble
);
Line.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[_this.FDC][
'ycgl'
][i].pointValueInDouble
);
}
LineA.categories = [];
LineA.series[0].data = [];
/* LineA.series[0].name=this.targetName; */
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'CL_FDC']['gl'].length; i++) {
let time = new Date(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['CL_FDC'][
'gl'
][i].pointTime * 1000
).Format('hh');
LineA.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
LineA.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['CL_FDC'][
'gl'
][i].pointValueInDouble
);
LineA.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['CL_FDC'][
'fs'
][i].pointValueInDouble
);
LineA.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['CL_FDC'][
'llgl'
][i].pointValueInDouble
);
LineA.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['CL_FDC'][
'ycgl'
][i].pointValueInDouble
);
}
LineB.categories = [];
LineB.series[0].data = [];
/* LineA.series[0].name=this.targetName; */
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'DX_FDC']['gl'].length; i++) {
let time = new Date(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['DX_FDC'][
'gl'
][i].pointTime * 1000
).Format('hh');
LineB.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
LineB.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['DX_FDC'][
'gl'
][i].pointValueInDouble
);
LineB.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['DX_FDC'][
'fs'
][i].pointValueInDouble
);
LineB.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['DX_FDC'][
'llgl'
][i].pointValueInDouble
);
LineB.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['DX_FDC'][
'ycgl'
][i].pointValueInDouble
);
}
LineC.categories = [];
LineC.series[0].data = [];
/* LineA.series[0].name=this.targetName; */
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'KB_FDC']['gl'].length; i++) {
let time = new Date(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['KB_FDC'][
'gl'
][i].pointTime * 1000
).Format('hh');
LineC.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
LineC.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['KB_FDC'][
'gl'
][i].pointValueInDouble
);
LineC.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['KB_FDC'][
'fs'
][i].pointValueInDouble
);
LineC.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['KB_FDC'][
'llgl'
][i].pointValueInDouble
);
LineC.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['KB_FDC'][
'ycgl'
][i].pointValueInDouble
);
}
/* LineD.categories = [];
LineD.series[0].data = [];
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'QS_FDC']['gl'].length; i++) {
let time = new Date(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'QS_FDC']['gl'][i].pointTime * 1000).Format(
'hh'
);
LineD.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
LineD.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['QS_FDC'][
'gl'
][i].pointValueInDouble
);
LineD.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['QS_FDC'][
'fs'
][i].pointValueInDouble
);
LineD.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['QS_FDC'][
'llgl'
][i].pointValueInDouble
);
LineD.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['QS_FDC'][
'ycgl'
][i].pointValueInDouble
);
}
LineE.categories = [];
LineE.series[0].data = [];
for (var i = 0; i < _this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'XS_FDC']['gl'].length; i++) {
let time = new Date(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule[
'XS_FDC']['gl'][i].pointTime * 1000).Format(
'hh'
);
LineE.categories.push(time);
//console.log(_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['MHS_FDC']['gl'][i].pointValueInDouble);
LineE.series[0].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['XS_FDC'][
'gl'
][i].pointValueInDouble
);
LineE.series[1].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['XS_FDC'][
'fs'
][i].pointValueInDouble
);
LineE.series[2].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['XS_FDC'][
'llgl'
][i].pointValueInDouble
);
LineE.series[3].data.push(
_this.index_curve_columnar_windSpeed_powermodule.index_curve_columnar_windSpeed_powermodule['XS_FDC'][
'ycgl'
][i].pointValueInDouble
);
} */
_this.showLineA('canvasLineA', Line);
_this.showWindStationCardLineA1('windStationCanvasLineA', LineA);
// _this.showWindStationCardLineA1('windStationCanvasLineA', LineA);
_this.showWindStationCardLineA2('windStationCanvasLineB', LineB);
_this.showWindStationCardLineA3('windStationCanvasLineC', LineC);/*
_this.showWindStationCardLineA4('windStationCanvasLineD', LineD);
_this.showWindStationCardLineA5('windStationCanvasLineE', LineE); */
});
});
},
openDrawer: function() {
this.$refs.drawer.openDrawer(250, this.drawerList, this.inconList);
},
closeDrawer: function() {
this.drawerIsShow = false;
},
pushWindPowerStationNameToSessionStorage(windpowerstationName) {
uni.setStorageSync('windpowerstationName', windpowerstationName);
//sessionStorage.setItem('windpowerstationName', windpowerstationName);
//alert("v"+ sessionStorage.getItem("windpowerstationName"));
//this.common.goback('/pages/index/Index');
},
getWindPowerStationNameToSessionStorage() {
uni.getStorageSync('windpowerstationName');
return uni.getStorageSync('windpowerstationName');
},
showModal(e) {
this.modalName = e.currentTarget.dataset.target;
this.$refs.plusDrawer.showModal(this.plusDrawerList, this.modalName);
},
hideModal() {
this.modalName = null;
this.$refs.plusDrawer.hideModal(this.modalName);
},
async target_comprehensive_indicators() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_target_comprehensive_indicators = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_1',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_target_comprehensive_indicators.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_target_comprehensive_indicators.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.windpowerstationdetail.target_comprehensive_indicators = JSON.parse(res.data)[_this.FDC];
console.log();
});
});
// 这里仅是事件监听【如果socket关闭了会执行】
/* this.socketTask_comprehensive_target.onClose(() => {
uni.request({
url: 'http://'+this.backStageIp+':'+this.backStagePort+'/targetdetail/close_targetdetail_target?pointKey='+this.pointKey,
success: (res) => {
}
});
}) */
},
async target_windSpeed_power() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_target_windSpeed_power = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_2',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_target_windSpeed_power.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_target_windSpeed_power.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.windpowerstationdetail.target_windSpeed_power = JSON.parse(res.data)[_this.FDC];
});
});
// 这里仅是事件监听【如果socket关闭了会执行】
/* this.socketTask_comprehensive_target.onClose(() => {
uni.request({
url: 'http://'+this.backStageIp+':'+this.backStagePort+'/targetdetail/close_targetdetail_target?pointKey='+this.pointKey,
success: (res) => {
}
});
}) */
},
async index_windturbine_status() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_windturbine_status = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_3',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_windturbine_status.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_windturbine_status.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.windpowerstationdetail.index_windturbine_status = JSON.parse(res.data)[_this.FDC];
_this.fdcstatusmodule.fdcstatusmodule = JSON.parse(res.data);
console.log("---");
_this.module = false;
});
});
// 这里仅是事件监听【如果socket关闭了会执行】
/* this.socketTask_comprehensive_target.onClose(() => {
uni.request({
url: 'http://'+this.backStageIp+':'+this.backStagePort+'/targetdetail/close_targetdetail_target?pointKey='+this.pointKey,
success: (res) => {
}
});
}) */
},
async index_electricQuantity() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_electricQuantity = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_4',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_electricQuantity.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_electricQuantity.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.windpowerstationdetail.index_electricQuantity = JSON.parse(res.data)[_this.FDC];
_this.monthOlive = (_this.windpowerstationdetail.index_electricQuantity.yfdl / 10000) * 100 + '%';
_this.monthAngrey = (1 - _this.windpowerstationdetail.index_electricQuantity.yfdl / 10000) * 100 + '%';
_this.yearOlive = (_this.windpowerstationdetail.index_electricQuantity.nfdl / 100000) * 100 + '%';
_this.yearAngrey = (1 - _this.windpowerstationdetail.index_electricQuantity.nfdl / 100000) * 100 + '%';
});
});
// 这里仅是事件监听【如果socket关闭了会执行】
/* this.socketTask_comprehensive_target.onClose(() => {
uni.request({
url: 'http://'+this.backStageIp+':'+this.backStagePort+'/targetdetail/close_targetdetail_target?pointKey='+this.pointKey,
success: (res) => {
}
});
}) */
},
async index_target_basic_indicators() {
let _this = this;
// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
this.socketTask_index_target_basic_indicators = uni.connectSocket({
// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
url: 'ws://' + this.backStageIp + ':' + this.backStagePort + '/websocket/pageNumber_6/functionNumber_5',
success(data) {
console.log('websocket连接成功');
}
});
let windpowerstationid = uni.getStorageSync('windpowerstationName');
// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
this.socketTask_index_target_basic_indicators.onOpen(res => {
console.log('WebSocket连接正常打开中...！');
this.is_open_socket = true;
// 注：只有连接正常打开中 ，才能正常收到消息
this.socketTask_index_target_basic_indicators.onMessage(res => {
//console.log("收到服务器内容：" + res.data);
_this.windpowerstationdetail.index_target_basic_indicators = JSON.parse(res.data)[_this.FDC];
});
});
// 这里仅是事件监听【如果socket关闭了会执行】
/* this.socketTask_comprehensive_target.onClose(() => {
uni.request({
url: 'http://'+this.backStageIp+':'+this.backStagePort+'/targetdetail/close_targetdetail_target?pointKey='+this.pointKey,
success: (res) => {
}
});
}) */
},
getServerData() {
// 折线图
let LineA = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
this.showLineA('canvasLineA', LineA);
},
showLineA(canvasId, chartData) {
var _self = this;
canvaLineA = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '4',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.pixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.cWidth * _self.pixelRatio,
height: _self.cHeight * _self.pixelRatio,
extra: {
line: {
type: 'line',
width: '1'
}
}
});
},
AffectedPower() {
(this.toBeInvolved = true), (this.performance = false);
this.powerLimitation = false;
this.overhaul = false;
this.dayHair = false;
this.fault = false;
this.clickFlag = 'group';
this.getColumnData();
},
performancePower() {
this.performance = true;
this.powerLimitation = false;
(this.toBeInvolved = false), (this.overhaul = false);
this.dayHair = false;
this.fault = false;
this.clickFlag = 'group';
this.getColumnData();
},
limitedPower() {
(this.toBeInvolved = false), (this.powerLimitation = true);
this.performance = false;
this.overhaul = false;
this.dayHair = false;
this.fault = false;
this.clickFlag = 'group';
this.getColumnData();
},
maintenancePower() {
(this.toBeInvolved = false), (this.overhaul = true);
this.performance = false;
this.dayHair = false;
this.fault = false;
this.powerLimitation = false;
this.clickFlag = 'group';
this.getColumnData();
},
directGeneration() {
(this.toBeInvolved = false), (this.dayHair = false);
this.performance = false;
this.fault = false;
this.overhaul = false;
this.powerLimitation = false;
this.clickFlag = 'stack';
this.getColumnData();
},
powerGeneration() {
(this.toBeInvolved = false), (this.dayHair = true);
this.performance = false;
this.fault = false;
this.overhaul = false;
this.powerLimitation = false;
this.clickFlag = 'group';
this.getColumnData();
},
faultPower() {
(this.toBeInvolved = false), (this.fault = true);
this.performance = false;
this.dayHair = false;
this.overhaul = false;
this.powerLimitation = false;
this.clickFlag = 'group';
this.getColumnData();
},
getColumnData() {
let ColumnStack = this.c1;
if (this.dayHair) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '日发电量(万kwh)',
data: [18, 13, 12, 17, 13, 7, 11, 15, 13],
color: '#4EB64E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.rifa.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.rifa[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.fault) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '故障损失电量(万kwh)',
data: [17, 15, 17, 21, 16, 8, 10, 17, 11],
color: '#F14E51'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.guzhang.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.guzhang[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.overhaul) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '检修损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#FF6B3E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.jianxiu.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.jianxiu[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.powerLimitation) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '限电损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#DC62D2'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.xiandian.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.xiandian[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.performance) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '性能损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#9DA3F6'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.xingneng.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.xingneng[i]);
// console.log(ColumnStack.series[1].data)
}
}
if (this.toBeInvolved) {
ColumnStack = {
categories: ['04/12', '04/13', '04/14', '04/15', '04/16', '04/17', '04/18', '04/19', '04/20'],
series: [{
name: '受累损失电量(万kwh)',
data: [14, 17, 19, 20, 6, 14, 12, 14, 10],
color: '#9E9E9E'
}]
};
ColumnStack.categories = [];
ColumnStack.series[0].data = [];
for (let i = 0; i < this.shoulei.length; i++) {
ColumnStack.categories.push(this.Xzuobiao[i]);
// console.log(ColumnStack.categories)
ColumnStack.series[0].data.push(this.shoulei[i]);
// console.log(ColumnStack.series[1].data)
}
}
this.showColumnStack('canvasColumnStack', ColumnStack);
},
showColumnStack(canvasId, chartData) {
var _self = this;
canvaColumn = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'column',
legend: {
show: false
},
fontSize: 11,
background: '#FFFFFF',
pixelRatio: _self.pixelRatio,
animation: true,
categories: chartData.categories,
series: chartData.series,
xAxis: {
disableGrid: true,
gridColor: 'silver',
fontColor: 'silver'
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 60,
axisLineColor: '#2E2E2E',
title: ' 电量:(kwh)',
titleFontColor: 'silver'
}],
gridColor: '#2E2E2E',
splitNumber: 5,
gridType: 'solid',
dashLength: 8,
showTitle: false
//disabled:true
},
dataLabel: false,
width: _self.cWidth * _self.pixelRatio,
height: _self.cHeight * _self.pixelRatio,
extra: {
column: {
type: _self.clickFlag,
width: '13'
}
}
});
},
touchColumn(e) {
let _this = this;
canvaColumn.showToolTip(e, {
format: function(item, category) {
if (item.name == '应发电量(万kwh)') {
return '';
} else {
return category + ' ' + item.name + ':' + item.data;
}
}
});
},
touchLineA(e) {
canvaLineA.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
touchLineB1(e) {
canvaLineB1.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
touchLineB2(e) {
canvaLineB2.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
touchLineB3(e) {
canvaLineB3.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
touchLineB4(e) {
canvaLineB4.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
touchLineB5(e) {
canvaLineB5.showToolTip(e, {
format: function(item, category) {
return category + ' ' + item.name + ':' + item.data;
}
});
},
moveLineA(e) {
canvaLineA.scroll(e);
},
getWindStationCardData: function() {
let LineA1 = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineB = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineC = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineD = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
let LineE = {
categories: [
' 17:26',
'18:56',
'19:56',
'20:56',
'21:56',
'22:56',
'23:56',
'00:56',
'01:56',
'02:56',
'03:56',
'04:56',
'05:56',
'06:56',
'07:56',
'08:56',
'09:56',
'10:56',
'11:56',
'12:56',
'13:56',
'14:56',
'15:56',
'16:56',
'17:56 '
],
series: [{
name: '功率',
data: [
],
color: '#4BB94B',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '风速',
data: [
],
color: '#E82E2F',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'm/s';
},
index: 1,
legendShape: 'circle'
},
{
name: '理论功率',
data: [
],
color: '#F5A83C',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 0,
legendShape: 'circle'
},
{
name: '预测功率',
data: [],
color: '#4A80B1',
textColor: '#FFFFFF',
textSize: this.seriesTextSize,
format: val => {
return val + 'kwh';
},
index: 1,
legendShape: 'circle'
}
]
};
this.showWindStationCardLineA1('windStationCanvasLineA', LineA1);
this.showWindStationCardLineA2('windStationCanvasLineB', LineB);
this.showWindStationCardLineA3('windStationCanvasLineC', LineC);
this.showWindStationCardLineA4('windStationCanvasLineD', LineD);
this.showWindStationCardLineA5('windStationCanvasLineE', LineE);
},
showWindStationCardLineA1(canvasId, chartData) {
var _self = this;
canvaLineB1 = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '9',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.windStationCardPixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
disableGrid: true,
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
disabled: true,
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.windStationCardCWidth * _self.windStationCardPixelRatio,
height: _self.windStationCardCHeight * _self.windStationCardPixelRatio,
padding: [10, 0, 0, 0], //画布填充边距，顺序为上右下左，同css，但必须4位
extra: {
line: {
type: 'line',
width: '1'
}
}
});
},
showWindStationCardLineA2(canvasId, chartData) {
var _self = this;
canvaLineB2 = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '9',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.windStationCardPixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
disableGrid: true,
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
disabled: true,
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.windStationCardCWidth * _self.windStationCardPixelRatio,
height: _self.windStationCardCHeight * _self.windStationCardPixelRatio,
padding: [10, 0, 0, 0], //画布填充边距，顺序为上右下左，同css，但必须4位
extra: {
line: {
type: 'line',
width: '1'
}
}
});
},
showWindStationCardLineA3(canvasId, chartData) {
var _self = this;
canvaLineB3 = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '9',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.windStationCardPixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
disableGrid: true,
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
disabled: true,
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.windStationCardCWidth * _self.windStationCardPixelRatio,
height: _self.windStationCardCHeight * _self.windStationCardPixelRatio,
padding: [10, 0, 0, 0], //画布填充边距，顺序为上右下左，同css，但必须4位
extra: {
line: {
type: 'line',
width: '1'
}
}
});
},
showWindStationCardLineA4(canvasId, chartData) {
var _self = this;
canvaLineB4 = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '9',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.windStationCardPixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
disableGrid: true,
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
disabled: true,
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.windStationCardCWidth * _self.windStationCardPixelRatio,
height: _self.windStationCardCHeight * _self.windStationCardPixelRatio,
padding: [10, 0, 0, 0], //画布填充边距，顺序为上右下左，同css，但必须4位
extra: {
line: {
type: 'line',
width: '1'
}
}
});
},
showWindStationCardLineA5(canvasId, chartData) {
var _self = this;
canvaLineB5 = new uCharts({
$this: _self,
canvasId: canvasId,
type: 'line',
fontSize: 11,
legend: {
show: true,
position: 'top',
float: 'right',
fontColor: 'silver',
itemGap: '9',
itemWidth: '3'
},
dataLabel: false,
dataPointShape: false,
background: '#FFFFFF',
pixelRatio: _self.windStationCardPixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
xAxis: {
disableGrid: true,
type: 'grid',
gridColor: 'silver',
fontColor: 'silver',
gridType: 'solid',
gridColor: '#2E2E2E',
axisLineColor: '#2E2E2E',
labelCount: '3'
// itemCount:"3"
},
yAxis: {
data: [{
type: 'value',
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'left',
axisLineColor: '#2E2E2E',
title: ' 风速:(m/s)',
titleFontColor: 'silver'
},
{
fontColor: 'silver',
disabled: false, //y轴轴线
min: 0,
max: 40,
position: 'right',
axisLineColor: '#2E2E2E',
title: '功率:(kwh)',
titleFontColor: 'silver'
}
],
disabled: true,
gridColor: '#2E2E2E',
splitNumber: 4,
gridType: 'solid',
dashLength: 8,
showTitle: 'true',
format: val => {
return val.toFixed(0) + '元';
}
},
width: _self.windStationCardCWidth * _self.windStationCardPixelRatio,
height: _self.windStationCardCHeight * _self.windStationCardPixelRatio,
padding: [10, 0, 0, 0], //画布填充边距，顺序为上右下左，同css，但必须4位
extra: {
line: {
type: 'line',
width: '1'
}
}
});
}
}
};
</script>
<style>
.textSmail {
font-size: 12px;
transform: scale(0.8);
}
.speedPowerDiagram {
width: 100px;
height: 30px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
float: left;
margin-top: 18px;
margin-left: 9px;
font-size: 11px;
}
.monthlyUtilizationHours {
width: 160px;
height: 30px;
margin-top: 20px;
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 9px;
text-align: center;
padding-top: 7px;
font-size: 12px;
}
.yearlyUtilizationHours {
width: 160px;
height: 30px;
margin-top: 10px;
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 9px;
text-align: center;
padding-top: 7px;
font-size: 12px;
}
.comprehensiveServicePowerConsumptionRate {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 200px;
margin-top: -70px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.equipmentAvailability {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 200px;
margin-top: -30px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.sulfurDioxideEmissionReduction {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 380px;
margin-top: -70px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.carbonDioxideReduction {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 380px;
margin-top: -30px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.waterSaving {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 560px;
margin-top: -70px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.saveStandardCoal {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 560px;
margin-top: -30px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.mttr {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 740px;
margin-top: -70px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.mtbf {
width: 160px;
height: 30px;
/* margin-top: 10px; */
/* background-color: #161616; */
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
color: silver;
margin-left: 740px;
margin-top: -30px;
text-align: center;
padding-top: 7px;
font-size: 12px;
float: left;
}
.horizontalSlider {
white-space: nowrap;
width: 100%;
height: 100px;
background-color: #242424;
clear: both;
/* margin-top: 540px; */
}
.slide {
width: 920px;
height: 100px;
background-color: #242424;
}
.qiun-charts {
width: 750upx;
height: 400upx;
}
.charts {
width: 750upx;
height: 400upx;
}
.uchartTitle {
position: absolute;
left: 9px;
top: 605px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
}
.Histogram {
width: 100%;
height: 300px;
background-color: #242424;
margin-top: 10px;
float: left;
}
.HistogramTitle {
width: calc(100% - 9px);
height: 30px;
line-height: 30px;
font-size: 11px;
color: silver;
margin-left: 9px;
}
.lineChart {
width: 100%;
height: 225px;
background-color: #242424;
margin-top: 10px;
float: left;
}
body {
font-family: '方正兰亭细黑_GBK';
font-size: 20px;
color: silver;
background: #000;
}
@font-face {
font-family: '方正兰亭细黑_GBK';
src: url(../../static/fzltxh.TTF);
}
page {
background-color: #1f1f1f;
font-family: '方正兰亭细黑_GBK';
overflow-x: hidden;
}
.top {
width: 100%;
height: 130upx;
padding-top: 5%;
background-color: #1f1f1f;
position: fixed;
top: 0px;
left: 0px;
z-index: 100;
}
.threeLine {
width: 50px;
height: 45px;
float: left;
}
.text {
width: calc(100% - 100px);
height: 45px;
float: left;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
line-height: 45px;
margin-top: 11px;
font-size: 18px;
}
.notice {
width: 50px;
height: 45px;
float: left;
margin-left: -60%;
margin-top: 6%;
}
.plus {
width: 30px;
height: 45px;
float: right;
color: white;
font-size: 35px;
line-height: 45px;
text-align: right;
margin-right: 2.5%;
}
.textWindpowerstation {
width: 180px;
height: 45px;
float: left;
text-align: center;
margin-left: 18px;
}
.time {
clear: both;
background-color: #242424;
width: 100%;
height: 30px;
/* float: left; */
}
.timeimageshizhong {
width: 30px;
height: 20px;
margin-top: 5px;
float: left;
}
.timeText {
width: 62%;
height: 30px;
float: left;
line-height: 30px;
font-size: 15px;
margin-left: 15px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
}
.timeIcon {
width: 25px;
height: 30px;
float: right;
margin-right: 2.5%;
/* margin-left: 5px; */
}
.timeIconImage {
width: 100%;
height: 25px;
margin-top: 1px;
}
.timeIconText {
width: 100%;
height: 25px;
text-align: center;
font-size: 12px;
}
.cardinstallgreenSecurity {
margin-left: 9px;
margin-top: 9px;
margin-bottom: 9px;
width: 30%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(133, 145, 132, 0.1) 0%, rgba(66, 130, 61, 0.2) 100%);
border-radius: 5px;
float: left;
/* font-family: "STKaiti"; */
}
.cardinstalltitle {
width: 100%;
height: 40px;
text-align: center;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 14px;
color: silver;
line-height: 40px;
float: left;
}
.cardinstallnumber {
/* font-weight: bold; */
width: 100%;
height: 40px;
text-align: center;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 16px;
/* color: #449618; */
line-height: 40px;
}
.cardinstallgreenEquipment {
margin-right: 11px;
margin-top: 10px;
width: 30%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
border-radius: 5px;
float: right;
/* font-family: "STKaiti"; */
}
.cardinstallgreen {
margin-left: 9px;
width: 30%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(133, 145, 132, 0.1) 0%, rgba(66, 130, 61, 0.2) 100%);
border-radius: 5px;
float: left;
}
.cardinstallblue {
margin-top: 9px;
margin-left: 9px;
width: 30%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(10, 82, 156, 0.2) 100%);
border-radius: 5px;
float: left;
}
.cardinstallblueright {
margin-right: 11px;
margin-top: 10px;
width: 30%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(10, 82, 156, 0.2) 100%);
border-radius: 5px;
float: right;
}
.cardinstalltitlegreen {
width: 100%;
height: 25px;
text-align: center;
/* margin-left: 37px; */
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 14px;
color: silver;
line-height: 25px;
/* float: left; */
}
.cardinstallnumbergreen {
width: 100%;
height: 25px;
text-align: center;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 20px;
color: white;
/* color: #449618; */
line-height: 25px;
float: left;
}
.cardinstallnumbergreenmin {
margin-left: 2px;
width: 55%;
height: 20px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 12px;
color: silver;
/* color: #449618; */
float: left;
}
.cardinstallnumbergreenmax {
/* font-weight: bold; */
margin-right: 2px;
width: 40%;
height: 20px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 12px;
color: silver;
/* color: #449618; */
float: right;
}
.greenMinText {
line-height: 20px;
float: left;
margin-left: 40px;
}
.greenMaxText {
line-height: 20px;
float: left;
}
.cardinstallnumberred {
width: 100%;
height: 25px;
text-align: center;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 20px;
color: white;
/* color: #E93131; */
line-height: 25px;
float: left;
}
.cardinstallnumberredmin {
margin-left: 2px;
width: 45%;
height: 20px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 12px;
color: silver;
/* color: #E93131; */
float: left;
}
.cardinstallnumberredmax {
margin-right: 2px;
width: 45%;
height: 20px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 12px;
color: silver;
/* color: #E93131; */
float: right;
}
.redMinText {
line-height: 20px;
float: right;
}
.redMaxText {
line-height: 20px;
float: left;
}
.electricityCard {
width: 100%;
height: 100px;
background-color: #242424;
/* height: 185px; */
float: left;
margin-top: 20rpx;
}
.speedPower {
width: 100%;
height: 180px;
background-color: #242424;
float: left;
margin-top: 20rpx;
}
.cardinstallgreenSpeed {
margin-top: 9px;
margin-left: 9px;
width: 46%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(133, 145, 132, 0.1) 0%, rgba(66, 130, 61, 0.2) 100%);
border-radius: 5px;
float: left;
}
.cardinstallredSpeed {
margin-top: 8px;
margin-left: 2.5%;
width: 46%;
height: 78px;
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
border-radius: 5px;
float: left;
}
.cardinstalltitleRed {
width: 100%;
height: 25px;
text-align: center;
/* margin-left: 45px; */
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
font-size: 14px;
color: silver;
line-height: 25px;
/* float: left; */
}
.textWhitekuangSpeed {
color: silver;
float: right;
margin-right: 70px;
}
.textWhitekuang {
color: silver;
float: right;
margin-right: 85px;
}
.textWhite {
color: white;
float: right;
width: 24px;
font-size: 10px;
margin-right: 13%;
transform: scale(0.975);
/* text-align: right; */
}
.textWhite2 {
color: white;
float: right;
margin-right: 15%;
transform: scale(0.975);
}
.textWhite3 {
color: white;
float: right;
/* margin-right: 1%; */
transform: scale(0.975);
}
.textSilver {
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
float: left;
}
.InformationCard {
margin-top: 0px;
width: 100%;
height: 70px;
background-color: #242424;
float: left;
}
.informationCardAll {
width: 95%;
margin-left: 2.5%;
margin-top: 10px;
height: 60px;
float: left;
}
.informationCardTextOne {
width: 100%;
height: 35px;
float: left;
margin-top: -10px;
}
.informationCardTextNo1 {
/* margin-left: 2%; */
width: 115px;
height: 35px;
font-size: 10px;
line-height: 35px;
font-size: 10px;
transform: scale(0.975);
float: left;
}
.informationCardText {
/* margin-left: 2%; */
width: 115px;
height: 35px;
line-height: 35px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 10px;
transform: scale(0.975);
float: left;
}
.informationCardTextzj {
/* margin-left: 43%; */
width: 115px;
height: 35px;
line-height: 35px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 10px;
transform: scale(0.975);
float: right;
}
.informationCardTextTwo {
width: 100%;
height: 35px;
float: left;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
}
.informationCardText2 {
/* margin-left: 6%; */
margin-left: calc(50% - 190px);
width: 115px;
height: 35px;
font-size: 10px;
line-height: 35px;
transform: scale(0.975);
float: left;
}
.informationCardText3 {
/* margin-left: 6%; */
margin-left: calc(50% - 170px);
width: 130px;
height: 35px;
font-size: 10px;
line-height: 35px;
transform: scale(0.975);
float: left;
}
.AccessCardNumber {
width: 30%;
height: 35px;
float: left;
line-height: 35px;
text-align: center;
font-size: 12px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
}
.AccessCardText {
width: 30%;
height: 35px;
float: left;
line-height: 35px;
text-align: center;
font-size: 12px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
}
.AccessCardimage {
margin-left: 5px;
width: 30%;
height: 35px;
float: left;
}
.interfaceCard {
margin-top: 10px;
width: 100%;
height: 85px;
background-color: #242424;
float: left;
}
.interfaceCardSmallTop {
margin-top: 5px;
width: 100%;
height: 35px;
float: left;
}
.interfaceCardSmall {
margin-left: 8px;
width: 30%;
height: 35px;
float: left;
}
.progressBarLeftText {
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
float: left;
margin-left: 5px;
}
.progressBarRightText {
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
float: right;
margin-right: 5px;
}
.progressBar {
margin-top: 10px;
width: 100%;
height: 115px;
background-color: #242424;
float: left;
}
.progressBarAll {
margin-left: 9px;
width: calc(100% - 5%);
height: 60px;
float: left;
}
.progressBarText {
text-align: center;
width: 50%;
height: 30px;
line-height: 30px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
float: left;
}
.progressBarOne {
width: 100%;
height: 30px;
float: left;
}
.progressBarLeft {
width: 25%;
height: 30px;
line-height: 30px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
float: left;
}
.progressBarRight {
width: 25%;
height: 30px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
line-height: 30px;
float: right;
}
/* 风电场卡片css */
.windStation {
clear: both;
width: calc(100% - 18px);
margin-left: 9px;
height: 320px;
color: silver;
margin-bottom: 120px;
/* background-color: #242424; */
}
.scrollWindStationCard {
white-space: nowrap;
}
.windStationCardContainer {
width: 1295px;
height: 350px;
margin-top: 10%;
}
.windStationCard {
width: 250px;
height: 100%;
margin-right: 9px;
float: left;
background-color: #242424;
}
.windStationTitle {
width: 90%;
height: 30px;
line-height: 30px;
font-size: 12px;
margin-left: 5px;
}
.powerAndSpeedContainer {
width: 100%;
height: 90px;
}
.powerAndSpeedRed {
margin-top: 8px;
margin-left: 2%;
margin-right: 2%;
width: 46%;
height: 37px;
line-height: 37px;
text-align: left;
font-size: 12px;
background: -webkit-linear-gradient(top, rgba(159, 131, 111, 0.1) 0%, rgba(193, 94, 21, 0.2) 100%);
border-radius: 5px;
float: left;
}
.powerAndSpeedRedText {
margin-left: 2%;
float: left;
}
.powerAndSpeedRed span {
color: white;
}
.HQChart {
width: 100%;
height: 100px;
margin-top: 8px;
}
.UChartContainer {
width: 250px;
height: 150px;
margin-top: 8px;
}
.windStationUChart {
width: 250px;
height: 150px;
position: absolute;
}
.windStationQiun-charts {
width: 250px;
height: 150px;
background-color: #242424;
}
.windStationCharts {
width: 250px;
height: 150px;
background-color: #242424;
}
.UChartTitle {
position: relative;
top: -2px;
left: 2px;
font-size: 12px;
width: 100px;
}
.xTime {
position: relative;
top: 90px;
left: 222px;
font-size: 8px;
width: 30px;
}
.fanStatusContainer {
width: 100%;
height: 70px;
}
.fanStatus {
width: 32%;
height: 30px;
margin-top: 5px;
margin-right: 0.5%;
margin-left: 0.5%;
float: left;
}
.statusIcon {
width: 22px;
height: 30px;
margin-left: 3px;
float: left;
}
.fanStatus {
height: 30px;
line-height: 30px;
font-size: 12px;
}
.AffectedPowerText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.AffectedPower {
width: 24.5%;
height: 25px;
float: left;
}
.performancePowerText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.performancePower {
width: 24.5%;
height: 25px;
float: left;
}
.limitedPowerText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.limitedPower {
margin-left: 1.2%;
width: 24.5%;
height: 25px;
float: left;
}
.maintenancePowerText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.maintenancePower {
margin-left: 2px;
width: 24.5%;
height: 25px;
float: left;
}
.faultPowerText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.faultPower {
width: 24.5%;
height: 25px;
float: left;
}
.powerGenerationText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.powerGeneration {
width: 24.5%;
height: 25px;
float: left;
}
.directGenerationText {
width: 55px;
height: 25px;
float: left;
margin-left: 2px;
line-height: 25px;
}
.directGeneration {
width: 24.5%;
height: 25px;
float: left;
margin-left: 1.3%;
}
.choice {
width: 100%;
height: 80px;
float: left;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
font-size: 12px;
}
.speedPowerDiagram {
width: 100px;
height: 30px;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
color: silver;
float: left;
margin-top: 18px;
margin-left: 9px;
font-size: 11px;
}
.qiun-chart {
margin-top: 50px;
width: 750upx;
height: 400upx;
}
.chart {
width: 750upx;
height: 400upx;
}
.DrawerPage {
position: fixed;
width: 100vw;
height: 100vh;
left: 0vw;
background-color: #1f1f1f;
transition: all 0.4s;
}
.DrawerPage.show {
transform: scale(0.9, 0.9);
left: 85vw;
box-shadow: 0 0 60upx rgba(0, 0, 0, 0.2);
transform-origin: 0;
}
.DrawerWindow {
position: absolute;
width: 85vw;
height: 100vh;
left: 0;
top: 0;
transform: scale(0.9, 0.9) translateX(-100%);
opacity: 0;
pointer-events: none;
transition: all 0.4s;
padding: 100upx 0;
}
.DrawerWindow.show {
transform: scale(1, 1) translateX(0%);
opacity: 1;
pointer-events: all;
}
.DrawerClose {
position: absolute;
width: 40vw;
height: 100vh;
right: 0;
top: 0;
color: transparent;
padding-bottom: 30upx;
display: flex;
align-items: flex-end;
justify-content: center;
background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.6));
letter-spacing: 5px;
font-size: 50upx;
opacity: 0;
pointer-events: none;
transition: all 0.4s;
}
.DrawerClose.show {
opacity: 1;
pointer-events: all;
width: 15vw;
color: #fff;
}
.DrawerPage .cu-bar.tabbar .action button.cuIcon {
width: 64upx;
height: 64upx;
line-height: 64upx;
margin: 0;
display: inline-block;
}
.DrawerPage .cu-bar.tabbar .action .cu-avatar {
margin: 0;
}
.DrawerPage .nav {
flex: 1;
}
.DrawerPage .nav .cu-item.cur {
border-bottom: 0;
position: relative;
}
.DrawerPage .nav .cu-item.cur::after {
content: '';
width: 10upx;
height: 10upx;
background-color: currentColor;
position: absolute;
bottom: 10upx;
border-radius: 10upx;
left: 0;
right: 0;
margin: auto;
}
.DrawerPage .cu-bar.tabbar .action {
flex: initial;
}
</style>