seg_yinzy
/
myems
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'develop'

pull/128/MERGE
13621160019@163.com 2022-02-18 22:02:26 +08:00
parent 6d66f5b5a2 03e3f563fd
commit d710472825
4 changed files with 1663 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1687
web/package-lock.json generated vendored
View File

File diff suppressed because it is too large Load Diff

3
web/package.json vendored
View File

@ -74,7 +74,8 @@
"react-typed": "^1.2.0", "react-typed": "^1.2.0",
"reactstrap": "^8.6.0", "reactstrap": "^8.6.0",
"slick-carousel": "^1.8.1", "slick-carousel": "^1.8.1",
"uuid": "^3.4.0" "uuid": "^3.4.0",
"rsuite": "^5.6.1"
}, },
"scripts": { "scripts": {
"start": "react-scripts --openssl-legacy-provider start", "start": "react-scripts --openssl-legacy-provider start",

2
web/src/App.js
View File

@ -2,10 +2,12 @@ import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom'; import { BrowserRouter as Router } from 'react-router-dom';
import Layout from './layouts/Layout'; import Layout from './layouts/Layout';
import 'rsuite/dist/rsuite.min.css';
import 'react-toastify/dist/ReactToastify.min.css'; import 'react-toastify/dist/ReactToastify.min.css';
import 'react-datetime/css/react-datetime.css'; import 'react-datetime/css/react-datetime.css';
import 'react-image-lightbox/style.css'; import 'react-image-lightbox/style.css';
const App = () => { const App = () => {
return ( return (
<Router basename={process.env.PUBLIC_URL}> <Router basename={process.env.PUBLIC_URL}>

81
web/src/components/MyEMS/Meter/MeterEnergy.js
View File

@ -30,6 +30,7 @@ import ButtonIcon from '../../common/ButtonIcon';
import { APIBaseURL } from '../../../config'; import { APIBaseURL } from '../../../config';
import { periodTypeOptions } from '../common/PeriodTypeOptions'; import { periodTypeOptions } from '../common/PeriodTypeOptions';
import { comparisonTypeOptions } from '../common/ComparisonTypeOptions'; import { comparisonTypeOptions } from '../common/ComparisonTypeOptions';
import { DateRangePicker } from 'rsuite';
const DetailedDataTable = loadable(() => import('../common/DetailedDataTable')); const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
@ -94,6 +95,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]); const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
const [detailedDataTableData, setDetailedDataTableData] = useState([]); const [detailedDataTableData, setDetailedDataTableData] = useState([]);
const [excelBytesBase64, setExcelBytesBase64] = useState(undefined); const [excelBytesBase64, setExcelBytesBase64] = useState(undefined);
const [values, setValues] = useState([reportingPeriodBeginsDatetime.toDate(), reportingPeriodEndsDatetime.toDate()]);
useEffect(() => { useEffect(() => {
let isResponseOK = false; let isResponseOK = false;
@ -115,7 +117,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
}).then(json => { }).then(json => {
console.log(json); console.log(json);
if (isResponseOK) { if (isResponseOK) {
// rename keys // rename keys
json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":')); json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
setCascaderOptions(json); setCascaderOptions(json);
setSelectedSpaceName([json[0]].map(o => o.label)); setSelectedSpaceName([json[0]].map(o => o.label));
@ -261,22 +263,26 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
setBasePeriodEndsDatetime(newDateTime); setBasePeriodEndsDatetime(newDateTime);
}; };
let onReportingPeriodBeginsDatetimeChange = (newDateTime) => { let onChange = (DateRange) => {
setReportingPeriodBeginsDatetime(newDateTime); let startDate = moment(DateRange[0]);
let endDate = moment(DateRange[1]);
setValues([DateRange[0], DateRange[1]]);
setReportingPeriodBeginsDatetime(startDate);
if (comparisonType === 'year-over-year') { if (comparisonType === 'year-over-year') {
setBasePeriodBeginsDatetime(newDateTime.clone().subtract(1, 'years')); setBasePeriodBeginsDatetime(startDate.clone().subtract(1, 'years'));
} else if (comparisonType === 'month-on-month') { } else if (comparisonType === 'month-on-month') {
setBasePeriodBeginsDatetime(newDateTime.clone().subtract(1, 'months')); setBasePeriodBeginsDatetime(startDate.clone().subtract(1, 'months'));
}
setReportingPeriodEndsDatetime(endDate);
if (comparisonType === 'year-over-year') {
setBasePeriodEndsDatetime(endDate.clone().subtract(1, 'years'));
} else if (comparisonType === 'month-on-month') {
setBasePeriodEndsDatetime(endDate.clone().subtract(1, 'months'));
} }
}; };
let onReportingPeriodEndsDatetimeChange = (newDateTime) => { let onClean = event => {
setReportingPeriodEndsDatetime(newDateTime); setValues([]);
if (comparisonType === 'year-over-year') {
setBasePeriodEndsDatetime(newDateTime.clone().subtract(1, 'years'));
} else if (comparisonType === 'month-on-month') {
setBasePeriodEndsDatetime(newDateTime.clone().subtract(1, 'months'));
}
}; };
var getValidBasePeriodBeginsDatetimes = function (currentDate) { var getValidBasePeriodBeginsDatetimes = function (currentDate) {
@ -309,7 +315,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
console.log(reportingPeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss')); console.log(reportingPeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss'));
// disable submit button // disable submit button
setSubmitButtonDisabled(true); setSubmitButtonDisabled(true);
// show spinner // show spinner
setSpinnerHidden(false); setSpinnerHidden(false);
// hide export button // hide export button
@ -355,7 +361,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
let names = Array(); let names = Array();
names.push({ 'value': 'a0', 'label': json['meter']['energy_category_name'] }); names.push({ 'value': 'a0', 'label': json['meter']['energy_category_name'] });
setMeterLineChartOptions(names); setMeterLineChartOptions(names);
let timestamps = {} let timestamps = {}
timestamps['a0'] = json['reporting_period']['timestamps']; timestamps['a0'] = json['reporting_period']['timestamps'];
setMeterLineChartLabels(timestamps); setMeterLineChartLabels(timestamps);
@ -371,7 +377,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
names.push({ 'value': 'a' + index, 'label': currentValue }); names.push({ 'value': 'a' + index, 'label': currentValue });
}); });
setParameterLineChartOptions(names); setParameterLineChartOptions(names);
timestamps = {} timestamps = {}
json['parameters']['timestamps'].forEach((currentValue, index) => { json['parameters']['timestamps'].forEach((currentValue, index) => {
timestamps['a' + index] = currentValue; timestamps['a' + index] = currentValue;
@ -409,14 +415,14 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
detailed_value['a0'] = json['reporting_period']['values'][timestampIndex]; detailed_value['a0'] = json['reporting_period']['values'][timestampIndex];
detailed_value_list.push(detailed_value); detailed_value_list.push(detailed_value);
}); });
let detailed_value = {}; let detailed_value = {};
detailed_value['id'] = detailed_value_list.length; detailed_value['id'] = detailed_value_list.length;
detailed_value['startdatetime'] = t('Total'); detailed_value['startdatetime'] = t('Total');
detailed_value['a0'] = json['reporting_period']['total_in_category']; detailed_value['a0'] = json['reporting_period']['total_in_category'];
detailed_value_list.push(detailed_value); detailed_value_list.push(detailed_value);
setDetailedDataTableData(detailed_value_list); setDetailedDataTableData(detailed_value_list);
setExcelBytesBase64(json['excel_bytes_base64']); setExcelBytesBase64(json['excel_bytes_base64']);
// enable submit button // enable submit button
@ -425,7 +431,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
setSpinnerHidden(true); setSpinnerHidden(true);
// show export button // show export button
setExportButtonHidden(false); setExportButtonHidden(false);
} else { } else {
toast.error(json.description) toast.error(json.description)
setSpinnerHidden(true); setSpinnerHidden(true);
@ -452,7 +458,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
document.body.removeChild(link); document.body.removeChild(link);
}); });
}; };
return ( return (
<Fragment> <Fragment>
@ -484,7 +490,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
<Label className={labelClasses} for="meterSelect"> <Label className={labelClasses} for="meterSelect">
{t('Meter')} {t('Meter')}
</Label> </Label>
<Form inline> <Form inline>
<Input placeholder={t('Search')} onChange={onSearchMeter} /> <Input placeholder={t('Search')} onChange={onSearchMeter} />
<CustomInput type="select" id="meterSelect" name="meterSelect" onChange={({ target }) => setSelectedMeter(target.value)} <CustomInput type="select" id="meterSelect" name="meterSelect" onChange={({ target }) => setSelectedMeter(target.value)}
@ -496,7 +502,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
))} ))}
</CustomInput> </CustomInput>
</Form> </Form>
</FormGroup> </FormGroup>
</Col> </Col>
<Col xs="auto"> <Col xs="auto">
@ -559,26 +565,17 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
</Col> </Col>
<Col xs={6} sm={3}> <Col xs={6} sm={3}>
<FormGroup className="form-group"> <FormGroup className="form-group">
<Label className={labelClasses} for="reportingPeriodBeginsDatetime"> <Label className={labelClasses}>{t('Reporting Period')}</Label>
{t('Reporting Period Begins')} <br/>
</Label> <DateRangePicker
<Datetime id='reportingPeriodBeginsDatetime' format="MM/dd/yyyy hh:mm aa"
value={reportingPeriodBeginsDatetime} value={values}
onChange={onReportingPeriodBeginsDatetimeChange} size="sm"
isValidDate={getValidReportingPeriodBeginsDatetimes} onChange={onChange}
closeOnSelect={true} /> showMeridian
</FormGroup> placeholder="Select Date Range"
</Col> onClean={onClean}
<Col xs={6} sm={3}> />
<FormGroup className="form-group">
<Label className={labelClasses} for="reportingPeriodEndsDatetime">
{t('Reporting Period Ends')}
</Label>
<Datetime id='reportingPeriodEndsDatetime'
value={reportingPeriodEndsDatetime}
onChange={onReportingPeriodEndsDatetimeChange}
isValidDate={getValidReportingPeriodEndsDatetimes}
closeOnSelect={true} />
</FormGroup> </FormGroup>
</Col> </Col>
<Col xs="auto"> <Col xs="auto">
@ -597,7 +594,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
</Col> </Col>
<Col xs="auto"> <Col xs="auto">
<br></br> <br></br>
<ButtonIcon icon="external-link-alt" transform="shrink-3 down-2" color="falcon-default" <ButtonIcon icon="external-link-alt" transform="shrink-3 down-2" color="falcon-default"
hidden={exportButtonHidden} hidden={exportButtonHidden}
onClick={handleExport} > onClick={handleExport} >
{t('Export')} {t('Export')}