Merge branch 'MCUT' of https://gitea.mjm-staging.developers-homelab.net/BIMS/BIMS into MCUT

Frontend/_dashboard.html

@@ -184,7 +184,7 @@
                         </div>
                         <div class="panel-container show h-100">
                             <div class="panel-content poisition-relative h-100">
-                                <div style="width: 100%; min-height: 450px">
+                                <div class="mt-5" style="width: 100%; height: 400px">
                                     <canvas class="chart" id="eveMonElecChart"></canvas>
                                 </div>
                             </div>
@@ -201,7 +201,7 @@
                                     <h2>即時契約容量占比 - 第一校區</h2>
                                 </div>
                                 <div class="panel-container show h-100">
-                                    <div class="h-100 py-2" id="contractValueChart"></div>
+                                    <div id="contractValueChart" style="height: 240px"></div>
                                 </div>
                             </div>
                         </div>
@@ -210,10 +210,10 @@
                                  class="panel"
                                  style="height: calc(100% - 1.5rem)">
                                 <div class="panel-hdr">
-                                    <h2>即時契約容量占比 - 第一校區</h2>
+                                    <h2>即時契約容量占比 - 第二校區</h2>
                                 </div>
                                 <div class="panel-container h-100 show">
-                                    <div class="h-100 py-2" id="contractValueChart2"></div>
+                                    <div id="contractValueChart2" style="height: 240px"></div>
                                 </div>
                             </div>
                         </div>
@@ -399,8 +399,8 @@
                 } else {
                     contractCapacity = (res.data || [])[0]?.contract_value ?? 0;
                     getFirstEletric();
-                    getContractValueChange("Arean1");
+                    getContractValueChange("Area1");
-                    getContractValueChange("Arean2");
+                    getContractValueChange("Area2");
                 }
             },
             null,
@@ -433,7 +433,7 @@
     }
 
     function getSubBaja() {
-        let devPath = tarElePath.split("/")[1].split("_").slice(0, 8).join("/");
+        let devPath = tarElePath.split("/")[1]?.split("_").slice(0, 8).join("/");
         let tempOrdPath = { devicePath: devPath };
         let myBaja = new subscriptionElectricmeter();
 
@@ -454,9 +454,11 @@
     function getContractValueChange(compus) {
         let devPath = `Data/${compus}`;
         BajaSubscribeElectricmeterByBql({ devicePath: devPath }, (data) => {
-            let value = data.find(({ point_name }) => point_name === "P")?.value;
+            let value = data
+                .find(({ point_name }) => point_name === "P")
+                ?.value.replaceAll(",", "");
 
-            if (compus === "Arean1") {
+            if (value && compus === "Area1") {
                 if (data.some(({ point_name }) => point_name === "Capacity")) {
                     contractCapacityForchart1 = data.find(
                         ({ point_name }) => point_name === "Capacity"
@@ -464,9 +466,9 @@
                 }
                 chartContractValue(
                     "contractValueChart",
-                    (value / contractCapacityForchart1).roundDecimal(2) * 100
+                    ((value / contractCapacityForchart1) * 100).roundDecimal(2)
                 );
-            } else {
+            } else if (value && compus === "Area2") {
                 if (data.some(({ point_name }) => point_name === "Capacity")) {
                     contractCapacityForchart2 = data.find(
                         ({ point_name }) => point_name === "Capacity"
@@ -474,7 +476,7 @@
                 }
                 chartContractValue(
                     "contractValueChart2",
-                    (value / contractCapacityForchart2).roundDecimal(2) * 100
+                    ((value / contractCapacityForchart1) * 100).roundDecimal(2)
                 );
             }
         });
@@ -1166,7 +1168,7 @@
                         valueAnimation: true,
                         formatter: "{value} %",
                         color: "inherit",
-                        fontSize: 28,
+                        fontSize: 20,
                     },
                     data: [
                         {

Frontend/_reportManagement.html

@@ -33,6 +33,16 @@
                                     <span class="nav-link-text"> 電錶 - 同期比較 </span>
                                 </a>
                             </li>
+                            <li>
+                                <a name="reportTypeRadio"
+                                   href="javascript:;"
+                                   data-value="day"
+                                   data-type="compare">
+                                    <span class="nav-link-text">
+                                        電錶 - 總盤與分盤 - 月份比較
+                                    </span>
+                                </a>
+                            </li>
                         </ul>
                         <div class="filter-message js-filter-message m-0 text-left pl-4 py-3 fw-500"></div>
                     </div>
@@ -40,12 +50,12 @@
                 <div class="col-12 col-xl-10">
                     <div class="panel-hdr" style="min-height: auto">
                         <h2 class="py-2" id="xx">
-                            <div class="col-auto">
+                            <div class="col-auto price">
                                 <span class="report-type-name"></span>費每度單價
                             </div>
                             <input type="text"
                                    id="elecPriceDegree"
-                                   class="form-control col-1" />
+                                   class="form-control col-1 price" />
                             <div id="compareTypeBtnsDiv"
                                  class="item btn-group btn-group-toggle offset-1"
                                  data-toggle="buttons"
@@ -66,6 +76,28 @@
                                     月份同日比較
                                 </label>
                             </div>
+
+                            <div id="compareAreaBtnsDiv"
+                                 class="item btn-group btn-group-toggle"
+                                 data-toggle="buttons"
+                                 style="display: none">
+                                <label class="btn btn-outline-success waves-effect active waves-themed">
+                                    <input type="radio"
+                                           name="compareEleRadio"
+                                           id="compareAll"
+                                           value="0"
+                                           checked />
+                                    總計含分盤資料
+                                </label>
+                                <label class="btn btn-outline-success waves-effect waves-themed">
+                                    <input type="radio"
+                                           name="compareEleRadio"
+                                           id="compareSeperate"
+                                           value="1" />
+                                    總計不含分盤資料
+                                </label>
+                            </div>
+
                             <div class="col-auto offset-1">
                                 選擇<span id="elecTimeText">單一月份</span>
                             </div>
@@ -209,6 +241,7 @@
             name: "Electric",
             chiName: "電",
             listApiUrl: "ElectricList",
+            listApiUrlForTotal: "ElectricListEachTotal",
             exportListApiUrl: {
                 day: "ExportElectricList",
                 month: "ExportElectricList",
@@ -421,10 +454,24 @@
                 "#elecMonthDate, #elecYearDate, #elecStartEndDiv, #elecCompareDiv"
             ).hide();
             $("#compareTypeBtnsDiv").hide();
+            $("#compareAreaBtnsDiv").hide();
 
             const value = $(this).data("value");
+            const type = $(this).data("type");
             const curDate = $("#elecDate").val();
-            if (value === "day") {
+
+            $("#school_zone").show();
+            $("#building").show();
+            $(".price").show();
+
+            if (type === "compare") {
+                $("#elecTimeText").text("月份");
+                $("#elecMonthDate").show();
+                $("#compareAreaBtnsDiv").show();
+                $("#school_zone").hide();
+                $("#building").hide();
+                $(".price").hide();
+            } else if (value === "day") {
                 $("#elecTimeText").text("月份");
                 $("#elecMonthDate").show();
             } else if (value == "month") {
@@ -455,7 +502,8 @@
         $("[name=reportTypeRadio]")
             .parent("li")
             .on("click", function () {
-                $("[name=reportTypeRadio]").parent("li").removeClass("active");
+                $("[name=reportTypeRadio]").parent("li.active").removeClass("active");
+                // $("[name=compareTypeRadio]").parent("label").removeClass("active");
                 const oldVal = $("li.active [name=reportTypeRadio]").data("value");
                 $(this).addClass("active");
                 const newVal = $("li.active [name=reportTypeRadio]").data("value");
@@ -476,6 +524,18 @@
                 }
             });
 
+        $("[name=compareEleRadio]")
+            .parent("label")
+            .on("click", function () {
+                $("[name=compareEleRadio]").parent("label").removeClass("active");
+                const oldVal = $("label.active [name=compareEleRadio]").val();
+                $(this).addClass("active");
+                const newVal = $("label.active [name=compareEleRadio]").val();
+                if (oldVal !== newVal) {
+                    $("label.active [name=compareEleRadio]").trigger("change");
+                }
+            });
+
         $("[name=floorCheckbox]")
             .parent(".btn")
             .off("click")
@@ -503,6 +563,10 @@
     function getListSendData() {
         const tableType = $("li.active [name=reportTypeRadio]").data("value");
         const compareType = $("label.active [name=compareTypeRadio]").val();
+        const Mode =
+            $("li.active [name=reportTypeRadio]").data("type") == "compare"
+                ? $("label.active [name=compareEleRadio]").val()
+                : null; // 總盤、分盤
         const startTime =
             tableType == "day"
                 ? $("#elecMonthDate").val()
@@ -538,7 +602,21 @@
             return;
         }
 
-        let sent_data = {
+        let sent_data = Mode
+            ? {
+                tableType: "month",
+                building_tag: "",
+                floor_tag: $("[name=floorCheckbox]:checked")
+                    .map((i, e) => $(e).val())
+                    .toArray(),
+                startTime: startTime,
+                endTime: endTime,
+                price: $("#elecPriceDegree").val()
+                    ? parseFloat($("#elecPriceDegree").val())
+                    : null,
+                Mode: parseInt(Mode),
+            }
+            : {
                 tableType:
                     $("li.active [name=reportTypeRadio]").data("value") == "compare"
                         ? $("[name=compareTypeRadio]:checked").val()
@@ -572,7 +650,11 @@
         if (!Array.isArray(sent_data)) {
             sent_data = [sent_data];
         }
-        if (!sent_data.some((s) => s.building_tag)) {
+
+        if (
+            !sent_data[0]?.Mode?.toString() &&
+            !sent_data.some((s) => s.building_tag)
+        ) {
             toast_error("請選擇棟別");
             return;
         }
@@ -580,7 +662,13 @@
             toast_error("請選擇樓層");
             return;
         }
-        var url = baseApiUrl + "/api/" + reportTypeDict["RElec"]["listApiUrl"];
+        var url =
+            baseApiUrl +
+            "/api/" +
+            `${sent_data[0]?.Mode?.toString()
+                ? reportTypeDict["RElec"]["listApiUrlForTotal"]
+                : reportTypeDict["RElec"]["listApiUrl"]
+            }`;
 
         setLoading(true);
         sent_data.forEach((sdata, i) => {
@@ -787,7 +875,45 @@
             datatable.destroy();
             $("#report_table").empty();
         }
+
+        const ElecEachTotal =
+            $("li.active [name=reportTypeRadio]").data("type") === "compare";
+        if (ElecEachTotal) {
+            const [year, month] = $("#elecMonthDate").val().split("-");
+            datesColumns = [
+                {
+                    label: "選擇月份 <br>" + `${year}${month}` + "(A)",
+                    value: $("#elecMonthDate").val(),
+                },
+                {
+                    label:
+                        "前一月份 <br>" +
+                        `${year}${month - 1 > 10 ? month - 1 : `0${month - 1}`}` +
+                        "(B)",
+                    value: `${year}-${month - 1 > 10 ? month - 1 : `0${month - 1}`}`,
+                },
+                {
+                    label:
+                        "差異比較 <br>" +
+                        `${year}${month}(A)-${year}${month - 1 > 10 ? month - 1 : `0${month - 1}`
+                        }(B)`,
+                    value: "last month different",
+                },
+                {
+                    label: "去年同期 <br>" + `${year - 1}${month}` + "(C)",
+                    value: `${year - 1}-${month}`,
+                },
+                {
+                    label: "同期差異 <br>" + `${year - 1}${month}(A)-${year}${month}(C)`,
+                    value: "last year different",
+                },
+            ].map((dc) => {
+                return { title: dc.label, data: dc.value, sWidth: "120px" };
+            });
+        } else {
             datesColumns = setTableColumns();
+        }
+
         const compareType = $("label.active [name=compareTypeRadio]").val();
         datas.forEach((td) => {
             td.rawData.forEach((rd) => {
@@ -862,6 +988,7 @@
                     title: "棟別",
                     data: "building_name",
                     className: "text-nowrap",
+                    sWidth: "100px",
                 },
                 {
                     title: "樓層",
@@ -875,7 +1002,7 @@
                     sWidth: "100px",
                 },
                 ...datesColumns,
-                ...totalColumns,
+                ...(ElecEachTotal ? [] : totalColumns),
             ],
         });
     }
@@ -1066,10 +1193,13 @@
 
     $("#school_zone").on("click", function (event) {
         event.stopPropagation();
-        if (event.target.tagName !== "INPUT" && !$(event.target).hasClass("active")) {
+        if (
+            event.target.tagName !== "INPUT" &&
+            !$(event.target).hasClass("active")
+        ) {
             $("#school_zone label.active").removeClass("active");
             $(event.target).addClass("active");
-            SelectBuildings = []
+            SelectBuildings = [];
         } else if (event.target.tagName === "INPUT") {
             school_zone = event.target.value;
             getbuildings(school_zone);
@@ -1087,6 +1217,6 @@
         }
         $("#building").find(".item").empty();
         $("#building").find(".item").append(html);
-        SelectBuildings = []
+        SelectBuildings = [];
     }
 </script>