666 lines
38 KiB
Plaintext
666 lines
38 KiB
Plaintext
@{
|
|
ViewData["MainNum"] = "3";
|
|
ViewData["SubNum"] = "3";
|
|
ViewData["Title"] = "逆變器交叉分析";
|
|
}
|
|
|
|
<div class="container-fluid">
|
|
<div class="row flex-nowrap wrapper">
|
|
<div class="col-md-2 col-1 pl-0 pr-0 collapse width border-right sidebar vh-100">
|
|
|
|
<div class="list-group border-0 card text-center text-md-left" id="sidebar">
|
|
|
|
<div class="border bg-light rounded-top">
|
|
<div class="form-group p-2 m-0 rounded-top">
|
|
<input type="text" class="form-control form-control-lg shadow-inset-2 m-0" id="js_list_accordion_filter" placeholder="">
|
|
</div>
|
|
<div id="js_list_accordion" class="accordion accordion-hover accordion-clean js-list-filter">
|
|
</div>
|
|
<span class="filter-message js-filter-message"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto px-0">
|
|
<a href="javascript:;" data-target=".sidebar" data-toggle="collapse" class="btn btn-default btn-xs btn-icon waves-effect waves-themed" style="border-radius: 0;"><i onclick="myfunc(this)" class="fal fa-angle-right fa-lg py-3"></i></a>
|
|
</div>
|
|
|
|
<main class="col px-5 pl-md-2 main">
|
|
<ol class="breadcrumb page-breadcrumb">
|
|
<li class="breadcrumb-item"><a href="javascript:void(0);">交叉分析</a></li>
|
|
<li class="breadcrumb-item active">@ViewData["Title"]</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-crosshairs"></i> @ViewData["Title"]
|
|
</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="mb-5 d-flex justify-content-start">
|
|
<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 class="pr-3">
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="GetAnalysisInverter()">查詢</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-5">
|
|
<div class="card p-3 w-100">
|
|
<div class="row mb-5 d-flex justify-content-end">
|
|
<div class="pr-3">
|
|
<div class="btn-group" id="js-demo-nesting" role="group" aria-label="Button group with nested dropdown">
|
|
<div class="btn-group" role="group">
|
|
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">選擇比較欄位</button>
|
|
<ul class="dropdown-menu" id="compare-dropdown-menu" style="width:10vw;overflow-x:hidden; max-height:50vh">
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option1" tabIndex="-1">日照度<input type="checkbox" class="float-right" name="compare_col[]" value="Irradiance" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option2" tabIndex="-1">直流功率 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DCKW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option3" tabIndex="-1">輸出功率 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="ACKW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option4" tabIndex="-1">直流電壓1 (V)<input type="checkbox" class="float-right" name="compare_col[]" value="DC1V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option5" tabIndex="-1">直流電流1 (A)<input type="checkbox" class="float-right" name="compare_col[]" value="DC1A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">直流功率1 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DC1KW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option4" tabIndex="-1">直流電壓2 (V)<input type="checkbox" class="float-right" name="compare_col[]" value="DC2V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option5" tabIndex="-1">直流電流2 (A)<input type="checkbox" class="float-right" name="compare_col[]" value="DC2A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">直流功率2 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DC2KW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option4" tabIndex="-1">直流電壓3 (V)<input type="checkbox" class="float-right" name="compare_col[]" value="DC3V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option5" tabIndex="-1">直流電流3 (A)<input type="checkbox" class="float-right" name="compare_col[]" value="DC3A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">直流功率3 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DC3KW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option4" tabIndex="-1">直流電壓4 (V)<input type="checkbox" class="float-right" name="compare_col[]" value="DC4V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option5" tabIndex="-1">直流電流4 (A)<input type="checkbox" class="float-right" name="compare_col[]" value="DC4A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">直流功率4 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DC4KW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option4" tabIndex="-1">直流電壓5 (V)<input type="checkbox" class="float-right" name="compare_col[]" value="DC5V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option5" tabIndex="-1">直流電流5 (A)<input type="checkbox" class="float-right" name="compare_col[]" value="DC5A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">直流功率5 (KW)<input type="checkbox" class="float-right" name="compare_col[]" value="DC5KW" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電壓A (V)<input type="checkbox" class="float-right" name="compare_col[]" value="AC1V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電壓B (V)<input type="checkbox" class="float-right" name="compare_col[]" value="AC2V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電壓C (V)<input type="checkbox" class="float-right" name="compare_col[]" value="AC3V" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電流A (A)<input type="checkbox" class="float-right" name="compare_col[]" value="AC1A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電流B (A)<input type="checkbox" class="float-right" name="compare_col[]" value="AC2A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">交流電流C (A)<input type="checkbox" class="float-right" name="compare_col[]" value="AC3A" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">PR<input type="checkbox" class="float-right" name="compare_col[]" value="PR" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">RA1 (%)<input type="checkbox" class="float-right" name="compare_col[]" value="RA1" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">RA2 (%)<input type="checkbox" class="float-right" name="compare_col[]" value="RA2" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">RA3 (%)<input type="checkbox" class="float-right" name="compare_col[]" value="RA3" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">RA4 (%)<input type="checkbox" class="float-right" name="compare_col[]" value="RA4" /></a></li>
|
|
<li><a href="javascript:void(0)" class="dropdown-item" data-value="option6" tabIndex="-1">RA5 (%)<input type="checkbox" class="float-right" name="compare_col[]" value="RA5" /></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@*<div class="pr-3">
|
|
<div class="btn-group" id="js-demo-nesting" role="group" aria-label="Button group with nested dropdown">
|
|
<div class="btn-group" role="group">
|
|
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">下載 </button>
|
|
<div class="dropdown-menu">
|
|
<a class="dropdown-item" href="javascript:void(0)">2021 四月</a>
|
|
<a class="dropdown-item" href="javascript:void(0)">2021 三月</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pr-3">
|
|
<button type="button" class="btn btn-secondary waves-effect waves-themed"><i class="fal fa-expand fs-md"></i></button>
|
|
</div>*@
|
|
|
|
</div>
|
|
<figure class="highcharts-figure">
|
|
<div id="container"></div>
|
|
|
|
</figure>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
@section Scripts{
|
|
<script>
|
|
var searchType = 0;//搜尋條件(日,日區間,月,年)
|
|
var datepicker;
|
|
var timerange;//選取時間
|
|
var selected_inverter = [];
|
|
var selected_YAxis = [];
|
|
var analysisInverter;
|
|
var myXAxis = []; var myYAxis = []; var mySeries = [];
|
|
var chart;
|
|
var default_compare_row_data = ["ACKW"]
|
|
var compare_row_data = [
|
|
{ key: "Irradiance", title: "日照度"},
|
|
{ key: "DCKW", title: "直流功率 (KW)"},
|
|
{ key: "ACKW", title: "輸出功率 (KW)"},
|
|
{ key: "DC1V", title: "直流電壓1 (V)"},
|
|
{ key: "DC1A", title: "直流電流1 (A)"},
|
|
{ key: "DC1KW", title: "直流功率1 (KW)"},
|
|
{ key: "DC2V", title: "直流電壓2 (V)"},
|
|
{ key: "DC2A", title: "直流電流2 (A)"},
|
|
{ key: "DC2KW", title: "直流功率2 (KW)"},
|
|
{ key: "DC3V", title: "直流電壓3 (V)"},
|
|
{ key: "DC3A", title: "直流電流3 (A)"},
|
|
{ key: "DC3KW", title: "直流功率3 (KW)"},
|
|
{ key: "DC4V", title: "直流電壓4 (V)"},
|
|
{ key: "DC4A", title: "直流電流4 (A)"},
|
|
{ key: "DC4KW", title: "直流功率4 (KW)"},
|
|
{ key: "DC5V", title: "直流電壓5 (V)"},
|
|
{ key: "DC5A", title: "直流電流5 (A)"},
|
|
{ key: "DC5KW", title: "直流功率5 (KW)"},
|
|
{ key: "AC1V", title: "交流電壓A (V)"},
|
|
{ key: "AC2V", title: "交流電壓B (V)"},
|
|
{ key: "AC3V", title: "交流電壓C (V)"},
|
|
{ key: "AC1A", title: "交流電流A (A)"},
|
|
{ key: "AC2A", title: "交流電流B (A)"},
|
|
{ key: "AC3A", title: "交流電流C (A)"},
|
|
{ key: "PR", title: "PR"},
|
|
{ key: "RA1", title: "RA1 (%)"},
|
|
{ key: "RA2", title: "RA2 (%)"},
|
|
{ key: "RA3", title: "RA3 (%)"},
|
|
{ key: "RA4", title: "RA4 (%)"},
|
|
{ key: "RA5", title: "RA5 (%)"}
|
|
]
|
|
|
|
var default_compare_date = ["KWH"]
|
|
var compare_date = [
|
|
{ key: "Irradiance", title: "日照度"},
|
|
{ key: "KWH", title: "KWH"},
|
|
{ key: "TodayKWH", title: "TodayKWH"},
|
|
{ key: "TotalKWH", title: "TotalKWH"},
|
|
{ key: "PR", title: "PR"},
|
|
{ key: "RA1", title: "RA1 (%)"},
|
|
{ key: "RA2", title: "RA2 (%)"},
|
|
{ key: "RA3", title: "RA3 (%)"},
|
|
{ key: "RA4", title: "RA4 (%)"},
|
|
{ key: "RA5", title: "RA5 (%)"}
|
|
]
|
|
|
|
$(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();
|
|
//#endregion
|
|
|
|
//#region 載入左邊選單列表
|
|
GetPowerStationCollapse("");
|
|
//#endregion
|
|
|
|
|
|
})
|
|
|
|
function myfunc(div) {
|
|
var className = div.getAttribute("class");
|
|
if (className == "fal fa-angle-left fa-lg py-3") {
|
|
div.className = "fal fa-angle-right fa-lg py-3";
|
|
}
|
|
else {
|
|
div.className = "fal fa-angle-left fa-lg py-3";
|
|
}
|
|
}
|
|
|
|
//#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);
|
|
|
|
$("#compare-dropdown-menu").empty();
|
|
var str = "";
|
|
$.each(compare_row_data, function (index, item) {
|
|
str += '<li><a href="javascript:void(0)" class="dropdown-item" tabIndex="-1">' + item.title + '<input type="checkbox" class="float-right" name="compare_col[]" value="' + item.key + '" /></a></li>'
|
|
});
|
|
$("#compare-dropdown-menu").append(str);
|
|
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);
|
|
|
|
$("#compare-dropdown-menu").empty();
|
|
var str = "";
|
|
$.each(compare_date, function (index, item) {
|
|
str += '<li><a href="javascript:void(0)" class="dropdown-item" tabIndex="-1">' + item.title + '<input type="checkbox" class="float-right" name="compare_col[]" value="' + item.key + '" /></a></li>'
|
|
});
|
|
$("#compare-dropdown-menu").append(str);
|
|
|
|
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);
|
|
|
|
$("#compare-dropdown-menu").empty();
|
|
var str = "";
|
|
$.each(compare_date, function (index, item) {
|
|
str += '<li><a href="javascript:void(0)" class="dropdown-item" tabIndex="-1">' + item.title + '<input type="checkbox" class="float-right" name="compare_col[]" value="' + item.key + '" /></a></li>'
|
|
});
|
|
$("#compare-dropdown-menu").append(str);
|
|
|
|
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);
|
|
|
|
$("#compare-dropdown-menu").empty();
|
|
var str = "";
|
|
$.each(compare_date, function (index, item) {
|
|
str += '<li><a href="javascript:void(0)" class="dropdown-item" tabIndex="-1">' + item.title + '<input type="checkbox" class="float-right" name="compare_col[]" value="' + item.key + '" /></a></li>'
|
|
});
|
|
$("#compare-dropdown-menu").append(str);
|
|
|
|
break;
|
|
}
|
|
if (type == 1) {
|
|
timerange = $('#DateGettext').val();
|
|
}
|
|
else {
|
|
timerange = $('#DateGet').val();
|
|
}
|
|
}
|
|
//#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();
|
|
});
|
|
//#endregion
|
|
|
|
//#region 更換inputtext
|
|
$('#DateGettext').on('change', function () {
|
|
timerange = $('#DateGettext').val();
|
|
});
|
|
//#endregion
|
|
|
|
$("#js_list_accordion_filter").change(function (e) {
|
|
GetPowerStationCollapse($(this).val());
|
|
});
|
|
|
|
$('#js_list_accordion').on("change", 'input[name="selectedInverterId[]"]', function (event) {
|
|
if (this.checked) {
|
|
if ($.inArray(this.value, selected_inverter) < 0) {
|
|
var powerStationId = $(this).attr('data-power-station-id');
|
|
selected_inverter.push({ powerStationId: powerStationId, InverterId: this.value });
|
|
}
|
|
} else {
|
|
if ($.inArray(this.value, selected_inverter) > -1) {
|
|
var powerStationId = $(this).attr('data-power-station-id');
|
|
selected_inverter.splice($.inArray({ powerStationId: powerStationId, InverterId: this.value }, selected_inverter), 1);
|
|
}
|
|
}
|
|
console.log(selected_inverter);
|
|
});
|
|
|
|
$('#js_list_accordion').on("change", 'input[name="selectedInverterLayer2[]"]', function (event) {
|
|
if (this.checked) {
|
|
$(this).parents(".list-group-item").find('input[name="selectedInverterId[]"]').prop("checked", true).trigger("change");
|
|
} else {
|
|
$(this).parents(".list-group-item").find('input[name="selectedInverterId[]"]').prop("checked", false).trigger("change");
|
|
}
|
|
});
|
|
|
|
$('#compare-dropdown-menu').on('change','input[name="compare_col[]"]', function (e) {
|
|
if (this.checked) {
|
|
selected_YAxis.push($(this).val());
|
|
} else {
|
|
selected_YAxis.splice($.inArray($(this).val(), selected_YAxis), 1);
|
|
}
|
|
|
|
ReloadHighCharts();
|
|
});
|
|
|
|
function GetPowerStationCollapse(filter) {
|
|
var url = "/AnalysisInverter/GetInverterCollapse"
|
|
|
|
var send_data = {
|
|
Filter: filter
|
|
}
|
|
|
|
$.post(url, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.data.msg);
|
|
return;
|
|
}
|
|
|
|
var inverterCollapse = rel.data;
|
|
|
|
$('#js_list_accordion').empty();
|
|
|
|
if (inverterCollapse == undefined && inverterCollapse.length <= 0) {
|
|
$('#js_list_accordion').append("<div>查無結果</div>");
|
|
}
|
|
|
|
var str = "";
|
|
|
|
Object.keys(inverterCollapse).map(function (key, index) {
|
|
str += '<div class="card border-top-left-radius-0 border-top-right-radius-0" id="templateCard">' +
|
|
'<div class="card-header">' +
|
|
'<a href="javascript:void(0);" class="card-title collapsed" data-toggle="collapse" data-target="#js_list_accordion-' + index + '" aria-expanded="false" data-filter-tags="settings">' +
|
|
'<i class="fal fa-globe width-2 fs-xl"></i>' +
|
|
'<span class="city-name">' + key + '</span>' +
|
|
'<span class="ml-auto">' +
|
|
'<span class="collapsed-reveal"><i class="fal fa-chevron-up fs-xl"></i></span>' +
|
|
'<span class="collapsed-hidden"><i class="fal fa-chevron-down fs-xl"></i></span>' +
|
|
'</span>' +
|
|
'</a>' +
|
|
'</div>' +
|
|
'<div id="js_list_accordion-' + index + '" class="collapse" data-parent="#js_list_accordion" style="">' +
|
|
'<div class="card-body">' +
|
|
'<ul class="list-group list-group-flush">';
|
|
Object.keys(inverterCollapse[key]).map(function (powerStationkey, index) {
|
|
str += '<li class="list-group-item">' +
|
|
'<div class="d-flex justify-content-between">' +
|
|
'<h4 class="font-weight-bold"><i class="fal fa-charging-station"></i> ' + powerStationkey + '</h4>' +
|
|
'<div class="">' +
|
|
'<input type="checkbox" class="" name="selectedInverterLayer2[]" >' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'<ul class="list-group list-group-flush">';
|
|
$.each(inverterCollapse[key][powerStationkey], function (index, inverter) {
|
|
str += '<li class="list-group-item pr-0 d-flex justify-content-between">' +
|
|
'<a href="#"><i class="fal fa-server"></i> ' + inverter.inverterName + '</a>' +
|
|
'<div class=""><input type="checkbox" class="" name="selectedInverterId[]" data-power-station-id="' + inverter.powerStationId + '" value="' + inverter.inverterId + '">' + '</div>'
|
|
'</li>';
|
|
});
|
|
str += '</ul>' +
|
|
'</li>';
|
|
});
|
|
|
|
str += '</ul>';
|
|
str += '</div>';
|
|
str += '</div>';
|
|
|
|
});
|
|
|
|
$('#js_list_accordion').append(str);
|
|
$('#js_list_accordion').find('.card').first().addClass(" border-top-left-radius-0 border-top-right-radius-0");
|
|
|
|
if (selected_inverter.length <= 0) {
|
|
$('input[name="selectedInverterId[]"]').first().trigger("click");
|
|
}
|
|
|
|
$('input[name="selectedInverterId[]"]').each(function () {
|
|
if ($.inArray(this.value, selected_inverter) > -1) {
|
|
$(this).prop('checked', true);
|
|
}
|
|
});
|
|
|
|
$("#js_list_accordion .collapse").collapse('show');
|
|
|
|
}, 'json');
|
|
}
|
|
|
|
function GetAnalysisInverter() {
|
|
|
|
var date;
|
|
if (searchType != 1) {
|
|
date = $('#DateGet').val();
|
|
} else {
|
|
date = $('#DateGettext').val();
|
|
}
|
|
|
|
var url = "/AnalysisInverter/GetAnalysisByInverterIds";
|
|
|
|
var send_data = {
|
|
SearchType: searchType,
|
|
SelectedDate: date,
|
|
InverterIdInfos: selected_inverter
|
|
}
|
|
|
|
$.post(url, send_data, function (rel) {
|
|
if (rel.code != "0000") {
|
|
toast_error(rel.msg);
|
|
return;
|
|
}
|
|
|
|
analysisInverter = rel.data;
|
|
|
|
if (searchType != 0) {
|
|
$('input[name="compare_col[]"]').each(function () {
|
|
if ($.inArray(this.value, default_compare_date) > -1) {
|
|
$(this).prop('checked', true).trigger('change');
|
|
}
|
|
});
|
|
}
|
|
else {
|
|
$('input[name="compare_col[]"]').each(function () {
|
|
if ($.inArray(this.value, default_compare_row_data) > -1) {
|
|
$(this).prop('checked', true).trigger('change');
|
|
}
|
|
});
|
|
}
|
|
|
|
ReloadHighCharts();
|
|
}, 'json');
|
|
}
|
|
|
|
function ReloadHighCharts() {
|
|
|
|
myYAxis = []; mySeries = [];
|
|
|
|
myXAxis = analysisInverter.xAxis
|
|
|
|
Object.keys(analysisInverter.multipleYaxes).map(function (key, index) {
|
|
|
|
if (selected_YAxis.indexOf(key) > -1) {
|
|
var yAxis = {
|
|
title: {
|
|
text: analysisInverter.multipleYaxes[key],
|
|
},
|
|
id: key,
|
|
opposite: myYAxis.length > 0 ? true : false,
|
|
showEmpty: false
|
|
}
|
|
|
|
myYAxis.push(yAxis);
|
|
}
|
|
});
|
|
|
|
analysisInverter.series.map(function (item, index) {
|
|
if (selected_YAxis.indexOf(item.yaxesKey) > -1) {
|
|
var ser = {
|
|
type: 'spline',
|
|
name: item.name,
|
|
data: item.values,
|
|
yAxis: item.yaxesKey,
|
|
}
|
|
|
|
mySeries.push(ser);
|
|
}
|
|
});
|
|
|
|
if (chart) {
|
|
chart.destroy();
|
|
}
|
|
|
|
chart = new Highcharts.Chart({
|
|
lang: { //匯出相關中文名稱配置
|
|
printChart: '列印圖表',
|
|
downloadJPEG: '下載JPEG檔案',
|
|
downloadPDF: '下載PDF檔案',
|
|
downloadPNG: '下載PNG檔案',
|
|
downloadSVG: '下載SVG檔案',
|
|
downloadCSV: '下載CSV檔案',
|
|
downloadXLS: '下載XLS檔案',
|
|
viewData: '檢視資料表格',
|
|
viewFullscreen: '全屏檢視'
|
|
},
|
|
chart: {
|
|
renderTo: 'container',
|
|
height: 600,
|
|
animation: false
|
|
},
|
|
title: {
|
|
text: '交叉分析圖表'
|
|
},
|
|
tooltip: {
|
|
formatter: function () {
|
|
return '<b>' + this.series.name + '</b><br>' +
|
|
'<span>' + this.x + '</span><br>' +
|
|
'<b style = "color:rgb(103, 180, 172);" >' + this.point.y + '</b>';
|
|
}
|
|
},
|
|
xAxis: {
|
|
categories: myXAxis,
|
|
labels: {
|
|
step: 1,
|
|
formatter: function () {
|
|
if (searchType == 0) {
|
|
var aa = this.value.substr(-2);
|
|
if (aa == "00") {
|
|
return '<span>' + this.value + '</span>';
|
|
} else {
|
|
return '<span style="display:none">' + this.value + '</span>';
|
|
}
|
|
} else {
|
|
return this.value
|
|
}
|
|
}
|
|
}
|
|
},
|
|
yAxis: myYAxis,
|
|
|
|
series: mySeries,
|
|
});
|
|
|
|
@*$("#container").highcharts({
|
|
chart: {
|
|
height: 600
|
|
},
|
|
xAxis: {
|
|
categories: myXAxis
|
|
},
|
|
yAxis: myYAxis,
|
|
|
|
series: mySeries,
|
|
});*@
|
|
}
|
|
</script>
|
|
}
|