From afc36b98eafdb033ed7782882ea1f95d6095bc3a Mon Sep 17 00:00:00 2001
From: "13621160019@163.com" <13621160019@163.com>
Date: Sun, 27 Feb 2022 14:03:27 +0800
Subject: [PATCH] updated DateRangePicker for Meter reports in Web UI

---
 web/src/components/MyEMS/Meter/MeterBatch.js         |  3 +--
 web/src/components/MyEMS/Meter/MeterCarbon.js        |  6 ++----
 web/src/components/MyEMS/Meter/MeterCost.js          |  6 ++----
 web/src/components/MyEMS/Meter/MeterEnergy.js        | 12 +++++++-----
 .../components/MyEMS/Meter/MeterSubmetersBalance.js  |  3 +--
 web/src/components/MyEMS/Meter/MeterTracking.js      |  3 +--
 web/src/components/MyEMS/Meter/MeterTrend.js         |  3 +--
 web/src/components/MyEMS/Meter/OfflineMeterCost.js   |  6 ++----
 web/src/components/MyEMS/Meter/OfflineMeterEnergy.js |  6 ++----
 web/src/components/MyEMS/Meter/VirtualMeterCarbon.js |  6 ++----
 web/src/components/MyEMS/Meter/VirtualMeterCost.js   |  6 ++----
 web/src/components/MyEMS/Meter/VirtualMeterEnergy.js |  6 ++----
 12 files changed, 25 insertions(+), 41 deletions(-)

diff --git a/web/src/components/MyEMS/Meter/MeterBatch.js b/web/src/components/MyEMS/Meter/MeterBatch.js
index 126c2bd9..aa8bc82a 100644
--- a/web/src/components/MyEMS/Meter/MeterBatch.js
+++ b/web/src/components/MyEMS/Meter/MeterBatch.js
@@ -296,14 +296,13 @@ const MeterBatch = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterCarbon.js b/web/src/components/MyEMS/Meter/MeterCarbon.js
index 68e66637..2c837e54 100644
--- a/web/src/components/MyEMS/Meter/MeterCarbon.js
+++ b/web/src/components/MyEMS/Meter/MeterCarbon.js
@@ -531,14 +531,13 @@ const MeterCarbon = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -549,14 +548,13 @@ const MeterCarbon = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterCost.js b/web/src/components/MyEMS/Meter/MeterCost.js
index 83ff6726..cd11ae0c 100644
--- a/web/src/components/MyEMS/Meter/MeterCost.js
+++ b/web/src/components/MyEMS/Meter/MeterCost.js
@@ -531,14 +531,13 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -549,14 +548,13 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterEnergy.js b/web/src/components/MyEMS/Meter/MeterEnergy.js
index dfb30e88..54a4c7cb 100644
--- a/web/src/components/MyEMS/Meter/MeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/MeterEnergy.js
@@ -261,6 +261,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
     }
   };
 
+  // Callback fired when value changed
   let onBasePeriodChange = (DateRange) => {
     console.log(DateRange);
     
@@ -271,6 +272,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
     }
   };
 
+  // Callback fired when value changed
   let onReportingPeriodChange = (DateRange) => {
       if(DateRange == null) {
       setReportingPeriodDateRange([null, null]);
@@ -284,14 +286,16 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
     }
   };
 
+  // Callback fired when value clean
   let onBasePeriodClean = event => {
     setBasePeriodDateRange([null, null]);
   };
 
+  // Callback fired when value clean
   let onReportingPeriodClean = event => {
     setReportingPeriodDateRange([null, null]);
   };
-
+  
   // Handler
   const handleSubmit = e => {
     e.preventDefault();
@@ -536,14 +540,13 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -554,14 +557,13 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js b/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
index 12eac115..fb3f8299 100644
--- a/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
+++ b/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
@@ -465,14 +465,13 @@ const MeterSubmetersBalance = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterTracking.js b/web/src/components/MyEMS/Meter/MeterTracking.js
index 0dfb4abd..8d837d44 100644
--- a/web/src/components/MyEMS/Meter/MeterTracking.js
+++ b/web/src/components/MyEMS/Meter/MeterTracking.js
@@ -350,14 +350,13 @@ const MeterTracking = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/MeterTrend.js b/web/src/components/MyEMS/Meter/MeterTrend.js
index cf8f4691..5fdb297d 100644
--- a/web/src/components/MyEMS/Meter/MeterTrend.js
+++ b/web/src/components/MyEMS/Meter/MeterTrend.js
@@ -429,14 +429,13 @@ const MeterTrend = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/OfflineMeterCost.js b/web/src/components/MyEMS/Meter/OfflineMeterCost.js
index cdc98a6d..cf98314a 100644
--- a/web/src/components/MyEMS/Meter/OfflineMeterCost.js
+++ b/web/src/components/MyEMS/Meter/OfflineMeterCost.js
@@ -507,14 +507,13 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -525,14 +524,13 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js b/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
index bf964c2d..adbcc3ef 100644
--- a/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
@@ -509,14 +509,13 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -527,14 +526,13 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/VirtualMeterCarbon.js b/web/src/components/MyEMS/Meter/VirtualMeterCarbon.js
index bade1a17..a98bdda3 100644
--- a/web/src/components/MyEMS/Meter/VirtualMeterCarbon.js
+++ b/web/src/components/MyEMS/Meter/VirtualMeterCarbon.js
@@ -506,14 +506,13 @@ const VirtualMeterCarbon = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -524,14 +523,13 @@ const VirtualMeterCarbon = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/VirtualMeterCost.js b/web/src/components/MyEMS/Meter/VirtualMeterCost.js
index 425c069b..f27ca3f5 100644
--- a/web/src/components/MyEMS/Meter/VirtualMeterCost.js
+++ b/web/src/components/MyEMS/Meter/VirtualMeterCost.js
@@ -507,14 +507,13 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -525,14 +524,13 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>
diff --git a/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js b/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
index 2f4fd75b..e5ec1e6b 100644
--- a/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
@@ -508,14 +508,13 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <DateRangePicker 
                     id='basePeriodDateRangePicker'
                     readOnly={basePeriodDateRangePickerDisabled}
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={basePeriodDateRange}
                     onChange={onBasePeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onBasePeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                    />
                 </FormGroup>
@@ -526,14 +525,13 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   <br/>
                   <DateRangePicker
                     id='reportingPeriodDateRangePicker'
-                    format="yyyy-MM-dd hh:mm aa"
+                    format="yyyy-MM-dd HH:mm:ss"
                     value={reportingPeriodDateRange}
                     onChange={onReportingPeriodChange}
                     size="md"
                     style={dateRangePickerStyle}
                     onClean={onReportingPeriodClean}
                     locale={dateRangePickerLocale}
-                    showMeridian
                     placeholder={t("Select Date Range")}
                   />
                 </FormGroup>