123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114 |
- <div data-options="dxView : { name: 'MainDashboard', title: '@viewMainDashboard', pane: 'master' } ">
- <div data-options="dxContent : { targetPlaceholder: 'content' } ">
- <div data-options="dxViewPlaceholder: { viewName: 'SideMenu' }"></div>
- <div class="fr chart_wrap_box2" style="width: 180px; margin-top: -20px;">
- <!--<div class="fl">@energy</div>-->
- <div class="fr dx-field-value" data-bind="dxSelectBox: {
- dataSource: fuelTypes,
- displayExpr: 'Name' ,
- valueExpr: 'FuelTypeId' ,
- value: fuelTypeId }">
- </div>
- </div>
- <div class="fl width_100per" style="margin-top: 2px;">
- <!-- <div class="fl width_30per height_50per margin_bottom30px" id="test" data-bind="css: {'dx-state-invisible': false }">-->
- <div class="fl width_30per height_50per margin_bottom30px" >
- <p class="body_sub_title">@dayEnergyUsageStatus </p>
- <div class="chart_wrap_box2 width_100per height_90per">
- <ul class="energy_use_data_date" style="margin: 0 auto;">
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: todayCheck }" />
- <span style="margin-top: 5px;" class="date_type">@today</span>
- <span class="energy_unit" data-bind="text: todayValue">4.124/kWh</span>
- </li>
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: yesterdayCheck }" />
- <span style="margin-top: 5px;" class="date_type">@yesterday</span>
- <span class="energy_unit" data-bind="text: yesterdayValue">4.124/kWh</span>
- </li>
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: lastWeekCheck }" />
- <span style="margin-top: 5px;" class="date_type">@lastWeek</span>
- <span class="energy_unit" data-bind="text: lastWeekValue">4.124/kWh</span>
- </li>
- </ul>
- <div style="clear:both"></div>
- <div id="dayEnergyUsageChart" style="margin-top: 15px; width: 100%; height: 215px;"></div>
- </div>
- </div>
- <div class="fl width_30per height_50per margin_bottom30px margin_left15px" style="margin-bottom: 27px;">
- <p class="body_sub_title">@monthEnergyUsageStatus</p>
- <div class="chart_wrap_box2 width_100per height_90per">
- <ul class="energy_use_data_date">
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: thisMonthCheck }" />
- <span style="margin-top: 5px;" class="date_type">@thisMonth</span>
- <span class="energy_unit" data-bind="text: thisMonthValue">4.124/kWh</span>
- </li>
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: lastMonthCheck }" />
- <span style="margin-top: 5px;" class="date_type">@lastMonth</span>
- <span class="energy_unit" data-bind="text: lastMonthValue">4.124/kWh</span>
- </li>
- <li style="width: 26%;">
- <span style="float: left;" data-bind="dxCheckBox: { value: lastYearCheck }" />
- <span style="margin-top: 5px;" class="date_type">@lastYear</span>
- <span class="energy_unit" data-bind="text: lastYearValue">4.124/kWh</span>
- </li>
- </ul>
- <div style="clear:both"></div>
- <div id="monthEnergyUsageChart" style="margin-top: 15px; width: 100%; height: 215px;"></div>
- </div>
- </div>
- <!-- <div class="fl margin_left15px height_50per" style=\"margin-bottom: 27px; width:530px">-->
- <div class="fl margin_left15px height_50per" style="width:530px">
- <p class="body_sub_title">에너지 사용현황</p>
- <div class="chart_wrap_box2 width_100per height_90per">
- <div id="dayEnergyUsage" style="width:100%; margin-top:4px"></div>
- <div style="clear:both"></div>
- <div id="monthEnergyUsage" style="width:100%; margin-top:8px"></div>
- <div style="clear:both"></div>
- <div id="yearEnergyUsage" style="width:100%; margin-top:8px"></div>
- </div>
- </div>
- <div style="clear:both"></div>
- <div class="fl width_30per height_50per">
- <p class="body_sub_title">@yearEnergyUsageRateByGoal</p>
- <div class="chart_wrap_box2 width_100per height_90per">
- <div id="yearEnergyUsageGauge" style="float: left; width: 50%; height: 160px;"></div>
- <div id="yearElectricityUsageGauge" style="float: left; width: 50%; height: 160px;"></div>
- <div id="yearGasUsageGauge" style="margin-top: 5px; float: left; width: 50%; height: 160px;"></div>
- <div id="yearWaterUsageGauge" style="margin-top: 5px; float: left; width: 50%; height: 160px;"></div>
- </div>
- </div>
- <div class="fl width_30per height_50per margin_left15px">
- <p class="body_sub_title">@fuelTypeUsageRatio</p>
- <div class="chart_wrap_box2 width_100per height_90per">
- <div id="energyUsageRatioPieChart" style="width: 100%; height: 325px;"></div>
- </div>
- </div>
- <div class="fl margin_left15px height_35per" style="width:530px; ">
- <p class="body_sub_title">전체 CO2 발생현황</p>
- <div class="chart_wrap_box2 width_100per " style="height: 200px">
- <!-- <div id="dayCo2Usage" style="width:100%; margin-top:12px"></div>
- <div style="clear:both"></div>-->
- <div id="monthCo2Usage" style="width:100%; margin-top:4px"></div>
- <div style="clear:both"></div>
- <div id="yearCo2Usage" style="width:100%; margin-top:8px"></div>
- </div>
- </div>
- <div class="fl " style="width:530px; margin-top: 15px; margin-left: 15px; ">
- <p class="body_sub_title">외기 온습도</p>
- <div class="chart_wrap_box2 width_100per " style="height: 92px">
- <div class="unit_account" data-bind="text: currentTemp" style="margin-top:18px; margin-left:20px; width:220px"></div>
- <div class="unit_account" data-bind="text: currentHumi" style="margin-top:-44px; margin-left:270px; width:220px;"></div>
- </div>
- </div>
- </div>
- </div>
- </div>
|