696 lines
34 KiB
Plaintext
696 lines
34 KiB
Plaintext
@{
|
|
ViewData["MainNum"] = "3";
|
|
ViewData["SubNum"] = "1";
|
|
ViewData["Title"] = "合併電站";
|
|
}
|
|
@using SolarPower.Models.Role
|
|
@model RoleLayerEnum
|
|
|
|
<ol class="breadcrumb page-breadcrumb">
|
|
<li class="breadcrumb-item"><a href="javascript:void(0);">交叉分析</a></li>
|
|
<li class="breadcrumb-item active">合併電站</li>
|
|
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
|
</ol>
|
|
|
|
<div class="subheader">
|
|
<h1 class="subheader-title">
|
|
<i class='subheader-icon fal fa-globe'></i> 合併電站
|
|
</h1>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-xl-12">
|
|
<div id="panel-5" class="panel">
|
|
<div class="panel-container show">
|
|
<div class="panel-content">
|
|
<div class="row mb-3 d-flex align-items-center px-3">
|
|
<div class="pr-3">
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="Allcity()">全部縣市</button>
|
|
</div>
|
|
<div class="pr-3">
|
|
<div class="frame-wrap" id="citytest" style="display:none">
|
|
<button type="button" class="btn btn-outline-success waves-effect waves-themed">
|
|
新北市
|
|
<span class="badge bg-success-700 ml-2" id="acount">4</span>
|
|
</button>
|
|
</div>
|
|
<div class="frame-wrap" id="city">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-5 d-flex align-items-top px-3">
|
|
<div class="col-1 p-0">
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="Allpowerstation()">全選</button>
|
|
</div>
|
|
<div class="col-11">
|
|
<div class="row frame-wrap" id="CheckPowerStation">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-5 d-flex align-items-top px-3">
|
|
<div class="pr-3">
|
|
<div class="btn-group btn-group-md">
|
|
<button type="button" class="btn btn-success waves-effect waves-themed btn-change-searchType" id="Group0" onclick="changeType(0,this)">日</button>
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed btn-change-searchType" id="Group1" onclick="changeType(1,this)">日區間</button>
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed btn-change-searchType" id="Group2" onclick="changeType(2,this)">月</button>
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed btn-change-searchType" id="Group3" onclick="changeType(3,this)">年</button>
|
|
</div>
|
|
</div>
|
|
<div class="pr-3" id="quickSearchOption">
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed btn-change-quickSearch1" onclick="quickSearch(0)">今天</button>
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed btn-change-quickSearch2" onclick="quickSearch(1)">昨天</button>
|
|
</div>
|
|
|
|
<div class="pr-3">
|
|
<div class="btn-group" id="js-demo-nesting" role="group" aria-label="Button group with nested dropdown">
|
|
<input type="date" class="form-control" id="DateGet" />
|
|
</div>
|
|
<div class="btn-group" id="DateGettextdiv" role="group" aria-label="Button group with nested dropdown" >
|
|
<input type="text" class="form-control" id="DateGettext" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="frame-wrap">
|
|
<div class="row mb-5">
|
|
<div class="card-columns">
|
|
|
|
<div class="card">
|
|
<div class="card-header bg-fusion-25 pr-3 d-flex align-items-center flex-wrap">
|
|
<h4 class="mb-0 font-weight-bold"><span class="fal fa-bolt mr-1"></span> 發電量</h4>
|
|
<div class="ml-auto">kwh</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<p>總發電量</p>
|
|
<p><span class="color-info-700" id="total_kwh">126,161.72</span></p>
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<p>今日發電量</p>
|
|
<p><span class="color-info-700" id="today_kwh">4,069.73</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<div class="card-header bg-fusion-25 pr-3 d-flex align-items-center flex-wrap">
|
|
<h4 class="mb-0 font-weight-bold"><span class="fal fa-dollar-sign mr-1"></span> <span id="money-card-title">發電金額</span></h4>
|
|
<div class="ml-auto">NTD</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<p id="money-card-subtitle-total">總發金額</p>
|
|
<p><span class="color-info-700" id="total_money">126,161.72</span></p>
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<p id="money-card-subtitle-avg">今日發電金額</p>
|
|
<p><span class="color-info-700" id="today_money">4,069.73</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header bg-fusion-25 pr-3 d-flex align-items-center flex-wrap">
|
|
<h4 class="mb-0 font-weight-bold"><span class="fal fa-sun mr-1"></span> kWh / kWp</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<p>平均 kWh / kWp</p>
|
|
<p><span class="color-info-700" id="total_kwhkwp">140.39</span></p>
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<p>今日 kWh / kWp </p>
|
|
<p><span class="color-info-700" id="today_kwhkwp">4.53</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<div class="card-header bg-fusion-25 pr-3 d-flex align-items-center flex-wrap">
|
|
<h4 class="mb-0 font-weight-bold"><span class="fal fa-bolt mr-1"></span> PR值</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<p>平均 PR 值</p>
|
|
<p><span class="color-info-700" id="total_PR">119.04</span></p>
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<p>今日PR值</p>
|
|
<p><span class="color-info-700" id="today_PR">3.84</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header bg-fusion-25 pr-3 d-flex align-items-center flex-wrap">
|
|
<h4 class="mb-0 font-weight-bold"><span class="fal fa-cow mr-1"></span> 減碳量</h4>
|
|
<div class="ml-auto">kG</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<p>總減碳量</p>
|
|
<p><span class="color-info-700" id="total_carbon">6,091.78</span></p>
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<p>今日減碳量</p>
|
|
<p><span class="color-info-700" id="today_carbon">985.98</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-5">
|
|
<div class="col-xl-6">
|
|
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
|
|
<ol class="carousel-indicators">
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
</div>
|
|
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
|
|
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
|
<span class="sr-only">Previous</span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
|
|
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
|
<span class="sr-only">Next</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-6">
|
|
<div id="station-convas-div">
|
|
<canvas id="station-convas"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@section Scripts{
|
|
<script>
|
|
var ids = new Array(0);//當前選擇縣市
|
|
var powerids = new Array(0);//當前選擇電站
|
|
var Allids = new Array(0);//全部縣市
|
|
var Allpowerids = new Array(0);//全部電站
|
|
var searchType = 0;//搜尋條件(日,日區間,月,年)
|
|
var datepicker;
|
|
var timerange;//選取時間
|
|
$(function () {
|
|
//#region 預設初始值
|
|
$('#DateGet').val(new Date().toISOString().substring(0, 10));
|
|
document.getElementById("DateGettextdiv").style.display = "none";//隱藏
|
|
$('#DateGet').attr('style', 'width:205px');
|
|
$('#DateGettext').attr('style', 'width:205px');
|
|
timerange = $('#DateGet').val();
|
|
|
|
//#region Array.Remove
|
|
Array.prototype.remove = function (val) {
|
|
var index = this.indexOf(val);
|
|
if (index > -1) {
|
|
this.splice(index, 1);
|
|
}
|
|
};
|
|
//#endregion
|
|
|
|
//#endregion
|
|
|
|
//#region 預設載入該使用者可以選擇的電站
|
|
var Nurl = "/PowerStation/GetSolarCitySummary";
|
|
$.post(Nurl, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
for (var i = 0; i < rel.data.length; i++) {
|
|
$('#city').append("<button type='button' class='btn btn-success waves-effect waves-themed ml-2' id='" + 'cityID_' + rel.data[i].cityId + "'>" +
|
|
rel.data[i].city +
|
|
"<span class= 'badge bg-success-700 ml-2' >" + rel.data[i].amount + "</span >" +
|
|
"</button >");
|
|
ids.push(String(rel.data[i].cityId));
|
|
Allids.push(String(rel.data[i].cityId));
|
|
}
|
|
var send_data = {
|
|
cityid: ids
|
|
}
|
|
ids.sort();
|
|
var Nurl = "/PowerStation/GetSolarByCity";
|
|
$.post(Nurl, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
|
|
$('#CheckPowerStation').empty();
|
|
$.each(rel.data, function (index, val) {
|
|
$('#CheckPowerStation').append("<div class='col-2 mb-2 custom-control custom-checkbox custom-control-inline' id='station_" + val.id + "' ></div>");
|
|
$('#station_' + val.id).append("<input type='checkbox' class='custom-control-input' id='check_" + val.id + "' checked>");
|
|
$('#station_' + val.id).append("<label class='custom-control-label' for='check_" + val.id + "'>" + val.name + "</label>");
|
|
powerids.push(String(val.id));
|
|
Allpowerids.push(String(val.id));
|
|
});
|
|
|
|
GetStationsCard();//5張卡片值
|
|
photoshow();//輪播圖片
|
|
|
|
})
|
|
})
|
|
//#endregion
|
|
|
|
})
|
|
|
|
//#region 選擇電站checkbox
|
|
$('#CheckPowerStation').on("click", "input", function () {
|
|
var clickid = $(this).attr('id');
|
|
var classid = clickid.split("_");
|
|
var job = document.getElementById(clickid);
|
|
if (job.checked == true) {
|
|
powerids.push(classid[1]);
|
|
}
|
|
else {
|
|
powerids.remove(classid[1]);
|
|
}
|
|
GetStationsCard();
|
|
})
|
|
//#endregion
|
|
|
|
//#region 縣市全選
|
|
function Allcity() {
|
|
var Newpowerids = new Array(0);
|
|
ids = [];
|
|
$.each(Allids, function (index, val) {
|
|
var cityid = 'cityID_' + val;
|
|
document.getElementById(cityid).setAttribute("class", 'btn btn-success waves-effect waves-themed ml-2');
|
|
ids.push(val);
|
|
});
|
|
var send_data = {
|
|
cityid: ids
|
|
}
|
|
var Nurl = "/PowerStation/GetSolarByCity";
|
|
$.post(Nurl, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
$('#CheckPowerStation').empty();
|
|
Allpowerids = [];
|
|
$.each(rel.data, function (index, val) {
|
|
if (powerids.includes(String(val.id))) {
|
|
$('#CheckPowerStation').append("<div class='col-2 mb-2 custom-control custom-checkbox custom-control-inline' id='station_" + val.id + "' > ");
|
|
$('#station_' + val.id).append("<input type='checkbox' class='custom-control-input' id='check_" + val.id + "' checked>");
|
|
$('#station_' + val.id).append("<label class='custom-control-label' for='check_" + val.id + "'>" + val.name + "</label>");
|
|
Newpowerids.push(String(val.id));
|
|
}
|
|
else {
|
|
$('#CheckPowerStation').append("<div class='col-2 mb-2 custom-control custom-checkbox custom-control-inline' id='station_" + val.id + "' > ");
|
|
$('#station_' + val.id).append("<input type='checkbox' class='custom-control-input' id='check_" + val.id + "'>");
|
|
$('#station_' + val.id).append("<label class='custom-control-label' for='check_" + val.id + "'>" + val.name + "</label>");
|
|
}
|
|
Allpowerids.push(String(val.id));
|
|
});
|
|
powerids = [];
|
|
powerids = Newpowerids;
|
|
})
|
|
GetStationsCard();
|
|
}
|
|
//#endregion
|
|
|
|
//#region 電站全選
|
|
function Allpowerstation() {
|
|
powerids = [];
|
|
$.each(Allpowerids, function (index, val) {
|
|
$('#check_' + val).prop("checked", true);
|
|
powerids.push(val);
|
|
})
|
|
GetStationsCard();
|
|
}
|
|
//#endregion
|
|
|
|
//#region 選擇縣市
|
|
$('#city').on("click", "button", function () {
|
|
var clickid = $(this).attr('id');
|
|
var classid = clickid.split("_");
|
|
var Newpowerids = new Array(0);
|
|
var value = document.getElementById(clickid).className;
|
|
ids.sort(function (a, b) {
|
|
return a - b;
|
|
});
|
|
var send_data = {
|
|
cityid: ids
|
|
}
|
|
if (value == 'btn btn-outline-success waves-effect waves-themed ml-2') { //選擇
|
|
document.getElementById(clickid).setAttribute("class", 'btn btn-success waves-effect waves-themed ml-2');
|
|
ids.push(classid[1]);
|
|
}
|
|
else { //取消
|
|
document.getElementById(clickid).setAttribute("class", 'btn btn-outline-success waves-effect waves-themed ml-2');
|
|
ids.remove(classid[1]);
|
|
}
|
|
ids.sort();
|
|
var Nurl = "/PowerStation/GetSolarByCity";
|
|
$.post(Nurl, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
$('#CheckPowerStation').empty();
|
|
Allpowerids = [];
|
|
$.each(rel.data, function (index, val) {
|
|
if (powerids.includes(String(val.id))) {
|
|
$('#CheckPowerStation').append("<div class='col-2 mb-2 custom-control custom-checkbox custom-control-inline' id='station_" + val.id + "' > ");
|
|
$('#station_' + val.id).append("<input type='checkbox' class='custom-control-input' id='check_" + val.id + "' checked>");
|
|
$('#station_' + val.id).append("<label class='custom-control-label' for='check_" + val.id + "'>" + val.name + "</label>");
|
|
Newpowerids.push(String(val.id));
|
|
}
|
|
else {
|
|
$('#CheckPowerStation').append("<div class='col-2 mb-2 custom-control custom-checkbox custom-control-inline' id='station_" + val.id + "' > ");
|
|
$('#station_' + val.id).append("<input type='checkbox' class='custom-control-input' id='check_" + val.id + "'>");
|
|
$('#station_' + val.id).append("<label class='custom-control-label' for='check_" + val.id + "'>" + val.name + "</label>");
|
|
}
|
|
Allpowerids.push(String(val.id));
|
|
});
|
|
powerids = [];
|
|
powerids = Newpowerids;
|
|
})
|
|
GetStationsCard();
|
|
})
|
|
//#endregion
|
|
|
|
//#region 更換搜尋條件(日,日區間,月,年)
|
|
function changeType(type, e) {
|
|
searchType = type;
|
|
if ($(".btn-change-searchType").hasClass("btn-success")) {
|
|
$(".btn-change-searchType").removeClass("btn-success").addClass("btn-secondary");
|
|
}
|
|
document.getElementById("DateGettextdiv").style.display = "none";//隱藏
|
|
document.getElementById("DateGet").style.display = "";//隱藏
|
|
$(e).removeClass("btn-secondary").addClass("btn-success");
|
|
switch (type) {
|
|
case 0: $('#DateGet').prop({ 'type': 'date' });
|
|
$(".btn-change-quickSearch1").html("今天");
|
|
$(".btn-change-quickSearch2").html("昨天");
|
|
var today = new Date().toISOString().substring(0, 10);
|
|
$('#DateGet').val(today);
|
|
break;
|
|
case 1:
|
|
|
|
//#region Date-Picker
|
|
datepicker = $('#DateGettext').daterangepicker({
|
|
autoUpdateInput: false,
|
|
locale: { format: 'YYYY/MM/DD' },
|
|
opens: 'left'
|
|
});
|
|
|
|
$('#DateGettext').on('apply.daterangepicker', function (ev, picker) {
|
|
$(this).val(picker.startDate.format('YYYY/MM/DD') + ' - ' + picker.endDate.format('YYYY/MM/DD'));
|
|
$(this).trigger('change');
|
|
});
|
|
|
|
$('#DateGettext').on('cancel.daterangepicker', function (ev, picker) {
|
|
$(this).val('');
|
|
$(this).trigger('change');
|
|
});
|
|
//#endregion
|
|
|
|
$(".btn-change-quickSearch1").html("近7天");
|
|
$(".btn-change-quickSearch2").html("近30天");
|
|
//#region 預設近7天
|
|
var today = new Date();
|
|
var dateLimit = new Date(new Date().setDate(today.getDate() - 7));
|
|
var today_format = today.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
var dateLimit_format = dateLimit.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
datepicker.data('daterangepicker').setStartDate(dateLimit_format);
|
|
datepicker.data('daterangepicker').setEndDate(today_format);
|
|
document.getElementById("DateGettextdiv").style.display = "";//隱藏
|
|
document.getElementById("DateGet").style.display = "none";//隱藏
|
|
//#endregion
|
|
$('#DateGettext').val(dateLimit_format + ' - ' + today_format);
|
|
|
|
break;
|
|
case 2: $('#DateGet').prop({ 'type': 'month' });
|
|
$(".btn-change-quickSearch1").html("本月");
|
|
$(".btn-change-quickSearch2").html("上個月");
|
|
var now_month = new Date().toISOString().substring(0, 7);
|
|
$('#DateGet').val(now_month);
|
|
break;
|
|
case 3:
|
|
$(".btn-change-quickSearch1").html("今年");
|
|
$(".btn-change-quickSearch2").html("去年");
|
|
var now_year = new Date().toISOString().substring(0, 4);
|
|
$('#DateGet').prop({ 'type': 'number', 'min': 1900, 'max': now_year, 'step': 1 });
|
|
$('#DateGet').val(now_year);
|
|
break;
|
|
}
|
|
if (type == 1) {
|
|
timerange = $('#DateGettext').val();
|
|
}
|
|
else {
|
|
timerange = $('#DateGet').val();
|
|
}
|
|
GetStationsCard();
|
|
}
|
|
//#endregion
|
|
|
|
//#region 快速填入條件(EX.今昨天)
|
|
function quickSearch(day)
|
|
{
|
|
switch (searchType)
|
|
{
|
|
case 0:
|
|
if (day == 0) {
|
|
var today = new Date().toISOString().substring(0, 10);
|
|
$('#DateGet').val(today).trigger('change');
|
|
} else {
|
|
var dateLimit = new Date(new Date().setDate(new Date().getDate() - 1)).toISOString().substring(0, 10);
|
|
$('#DateGet').val(dateLimit).trigger('change');
|
|
}
|
|
break;
|
|
case 1:
|
|
if (day == 0) {
|
|
//#region 預設近7天
|
|
var today = new Date();
|
|
var dateLimit = new Date(new Date().setDate(today.getDate() - 7));
|
|
var today_format = today.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
var dateLimit_format = dateLimit.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
datepicker.data('daterangepicker').setStartDate(dateLimit_format);
|
|
datepicker.data('daterangepicker').setEndDate(today_format);
|
|
//#endregion
|
|
$('#DateGettext').val(dateLimit_format + ' - ' + today_format).trigger('change');
|
|
} else {
|
|
//#region 預設近30天
|
|
var today = new Date();
|
|
var dateLimit = new Date(new Date().setDate(today.getDate() - 30));
|
|
var today_format = today.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
var dateLimit_format = dateLimit.toISOString().slice(0, 10).replace(/-/g, "/");
|
|
datepicker.data('daterangepicker').setStartDate(dateLimit_format);
|
|
datepicker.data('daterangepicker').setEndDate(today_format);
|
|
//#endregion
|
|
$('#DateGettext').val(dateLimit_format + ' - ' + today_format).trigger('change');
|
|
}
|
|
break;
|
|
case 2:
|
|
if (day == 0) {
|
|
var now_month = new Date().toISOString().substring(0, 7);
|
|
$('#DateGet').val(now_month).trigger('change');
|
|
} else {
|
|
var dateLimit = new Date(new Date().setMonth(new Date().getMonth() - 1)).toISOString().substring(0, 7);
|
|
$('#DateGet').val(dateLimit).trigger('change');
|
|
}
|
|
break;
|
|
case 3:
|
|
if (day == 0) {
|
|
var now_year = new Date().toISOString().substring(0, 4);
|
|
$('#DateGet').val(now_year).trigger('change');
|
|
} else {
|
|
var dateLimit = new Date(new Date().setFullYear(new Date().getFullYear() - 1)).toISOString().substring(0, 4);
|
|
$('#DateGet').val(dateLimit).trigger('change');
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
//#endregion
|
|
|
|
//#region 更換input
|
|
$('#DateGet').on('change', function () {
|
|
timerange = $('#DateGet').val();
|
|
GetStationsCard();
|
|
});
|
|
//#endregion
|
|
|
|
//#region 更換inputtext
|
|
$('#DateGettext').on('change', function () {
|
|
timerange = $('#DateGettext').val();
|
|
GetStationsCard();
|
|
});
|
|
//#endregion
|
|
|
|
//#region 5張卡片值
|
|
function GetStationsCard()
|
|
{
|
|
var send_data = {
|
|
stationIds: powerids,
|
|
timerange: timerange,
|
|
seacrhType: searchType
|
|
}
|
|
|
|
var Nurl = "/AnalysisStationCombine/GetStationsCard";
|
|
$.post(Nurl, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
$('#total_kwh').html(rel.data.all_kwh.toFixed(2));
|
|
$('#total_money').html(rel.data.all_money.toFixed(2));
|
|
$('#total_kwhkwp').html(rel.data.all_KWH_KWP.toFixed(2));
|
|
$('#total_PR').html(rel.data.all_PR.toFixed(2));
|
|
$('#total_carbon').html(rel.data.all_Carbon.toFixed(2));
|
|
|
|
|
|
$('#today_kwh').html(rel.data.now_kwh.toFixed(2));
|
|
$('#today_money').html(rel.data.now_money.toFixed(2));
|
|
$('#today_kwhkwp').html(rel.data.now_KWH_KWP.toFixed(2));
|
|
$('#today_PR').html(rel.data.now_PR.toFixed(2));
|
|
$('#today_carbon').html(rel.data.now_Carbon.toFixed(2));
|
|
chart();
|
|
})
|
|
|
|
}
|
|
//#endregion
|
|
|
|
//#region 圖片輪播
|
|
function photoshow()
|
|
{
|
|
var url_image = "/PowerStation/GetAllPowerStationsALLImage";
|
|
var send_data = {
|
|
powerStationId: powerids
|
|
};
|
|
|
|
$.post(url_image, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
|
|
carouselExampleIndicators = $("#carouselExampleIndicators");
|
|
carouselExampleIndicators.find(".carousel-indicators").empty();
|
|
carouselExampleIndicators.find(".carousel-inner").empty();
|
|
rel.data.forEach(function (value, index) {
|
|
CreatePowerStationImagecarousel(carouselExampleIndicators, value, index);
|
|
});
|
|
|
|
carouselExampleIndicators.find(".carousel-indicators > li").first().addClass("active");
|
|
carouselExampleIndicators.find(".carousel-inner > .carousel-item").first().addClass("active");
|
|
|
|
}, 'json');
|
|
}
|
|
function CreatePowerStationImagecarousel(dom, value, index) {
|
|
var indicators = '<li data-target="#carouselExampleIndicators" data-slide-to="' + index + '"></li>'
|
|
var carousel_item = '<div class="carousel-item">' +
|
|
'<img class="d-block w-100" src="' + value.image + '">' +
|
|
'</div>'
|
|
|
|
dom.find(".carousel-indicators").append(indicators);
|
|
dom.find(".carousel-inner").append(carousel_item);
|
|
}
|
|
//#endregion
|
|
|
|
//#region 分析圖
|
|
function chart() {
|
|
var send_data = {
|
|
stationIds: powerids,
|
|
timerange: timerange,
|
|
seacrhType: searchType
|
|
}
|
|
var listmonth = new Array(0);
|
|
var listirradiance = new Array(0);
|
|
var listkwh = new Array(0);
|
|
|
|
var Nurl = "/AnalysisStationCombine/GetChart";
|
|
$.post(Nurl, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
$.each(rel.data, function (index, val) {
|
|
listmonth.push(val.time);
|
|
listirradiance.push(val.irradiance);
|
|
listkwh.push(val.kwh);
|
|
})
|
|
$('#station-convas-div').empty();
|
|
$('#station-convas-div').append('<canvas id="station-convas"></canvas>');
|
|
|
|
var ctx_history_kWh = document.getElementById('station-convas').getContext('2d');
|
|
var myhistorykwh = new Chart(ctx_history_kWh, {
|
|
type: 'bar',
|
|
data: {
|
|
labels: listmonth,
|
|
datasets: [{
|
|
type: 'line',
|
|
label: '日照度(kWh/㎡)',
|
|
borderColor: 'rgba(190, 45, 45,1)',
|
|
pointRadius: 4,
|
|
yAxisID: 'B',
|
|
fill: false,
|
|
data: listirradiance
|
|
}, {
|
|
type: 'bar',
|
|
borderColor: 'rgba(103, 180, 172, 1)',
|
|
backgroundColor: 'rgba(103, 180, 172, 0.2)',
|
|
borderWidth: 1,
|
|
label: '發電量(kWh)',
|
|
yAxisID: 'A',
|
|
data: listkwh
|
|
}]
|
|
},
|
|
options: {
|
|
title: {
|
|
display: true,
|
|
text: '發電量及日照度'
|
|
},
|
|
legend: {
|
|
display: true,
|
|
position: 'bottom'
|
|
},
|
|
scales: {
|
|
yAxes: [{
|
|
id: 'A',
|
|
type: 'linear',
|
|
position: 'left',
|
|
ticks: {
|
|
min: 0
|
|
},
|
|
scaleLabel: {
|
|
display: true,
|
|
labelString: 'kWh'
|
|
}
|
|
}, {
|
|
id: 'B',
|
|
type: 'linear',
|
|
position: 'right',
|
|
ticks: {
|
|
min: 0
|
|
},
|
|
scaleLabel: {
|
|
display: true,
|
|
labelString: 'kWh/㎡'
|
|
}
|
|
}]
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
}
|
|
//#endregion
|
|
|
|
</script>
|
|
} |