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

Merge branch 'develop'

pull/133/head
13621160019@163.com 2022-02-26 15:13:17 +08:00
parent 8acd4eacda 4fc94d3712
commit 3ee08bf7a2
2 changed files with 127 additions and 146 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

164
web/src/components/MyEMS/Meter/MeterCost.js
View File

@ -65,13 +65,27 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
const [selectedMeter, setSelectedMeter] = useState(undefined);
const [comparisonType, setComparisonType] = useState('month-on-month');
const [periodType, setPeriodType] = useState('daily');
const [basePeriodBeginsDatetime, setBasePeriodBeginsDatetime] = useState(current_moment.clone().subtract(1, 'months').startOf('month'));
const [basePeriodEndsDatetime, setBasePeriodEndsDatetime] = useState(current_moment.clone().subtract(1, 'months'));
const [basePeriodBeginsDatetimeDisabled, setBasePeriodBeginsDatetimeDisabled] = useState(true);
const [basePeriodEndsDatetimeDisabled, setBasePeriodEndsDatetimeDisabled] = useState(true);
const [reportingPeriodBeginsDatetime, setReportingPeriodBeginsDatetime] = useState(current_moment.clone().startOf('month'));
const [reportingPeriodEndsDatetime, setReportingPeriodEndsDatetime] = useState(current_moment);
const [cascaderOptions, setCascaderOptions] = useState(undefined);
const [reportingPeriodDateRange, setReportingPeriodDateRange] = useState([current_moment.clone().startOf('month').toDate(), current_moment.toDate()]);
const [basePeriodDateRange, setBasePeriodDateRange] = useState([current_moment.clone().subtract(1, 'months').startOf('month').toDate(), current_moment.clone().subtract(1, 'months').toDate()]);
const [basePeriodDateRangePickerDisabled, setBasePeriodDateRangePickerDisabled] = useState(true);
const dateRangePickerLocale = {
sunday: t('sunday'),
monday: t('monday'),
tuesday: t('tuesday'),
wednesday: t('wednesday'),
thursday: t('thursday'),
friday: t('friday'),
saturday: t('saturday'),
ok: t('ok'),
today: t('today'),
yesterday: t('yesterday'),
hours: t('hours'),
minutes: t('minutes'),
seconds: t('seconds'),
last7Days: t('last7Days')
};
const dateRangePickerStyle = { display: 'block', zIndex: 10};
// buttons
const [submitButtonDisabled, setSubmitButtonDisabled] = useState(true);
@ -94,27 +108,6 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
const [detailedDataTableData, setDetailedDataTableData] = useState([]);
const [excelBytesBase64, setExcelBytesBase64] = useState(undefined);
const [values, setValues] = useState([reportingPeriodBeginsDatetime.toDate(), reportingPeriodEndsDatetime.toDate()]);
const [baseValues, setBaseValues] = useState([current_moment.clone().subtract(1, 'months').startOf('month').toDate(),
current_moment.clone().subtract(1, 'months').toDate()]);
const [basePeriodDatetimeDisabled, setBasePeriodDatetimeDisabled] = useState(true);
const local = {
sunday: t('sunday'),
monday: t('monday'),
tuesday: t('tuesday'),
wednesday: t('wednesday'),
thursday: t('thursday'),
friday: t('friday'),
saturday: t('saturday'),
ok: t('ok'),
today: t('today'),
yesterday: t('yesterday'),
hours: t('hours'),
minutes: t('minutes'),
seconds: t('seconds'),
last7Days: t('last7Days')
};
const styles = { display: 'block', zIndex: 10};
useEffect(() => {
let isResponseOK = false;
@ -253,66 +246,50 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
console.log(target.value);
setComparisonType(target.value);
if (target.value === 'year-over-year') {
setBasePeriodDatetimeDisabled(true);
setBasePeriodBeginsDatetime(moment(reportingPeriodBeginsDatetime).subtract(1, 'years'));
setBasePeriodEndsDatetime(moment(reportingPeriodEndsDatetime).subtract(1, 'years'));
setBaseValues([moment(reportingPeriodBeginsDatetime).subtract(1, 'years').toDate(),
moment(reportingPeriodEndsDatetime).subtract(1, 'years').toDate()]);
setBasePeriodDateRangePickerDisabled(true);
setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'years').toDate(),
moment(reportingPeriodDateRange[1]).subtract(1, 'years').toDate()]);
} else if (target.value === 'month-on-month') {
setBasePeriodDatetimeDisabled(true);
setBasePeriodBeginsDatetime(moment(reportingPeriodBeginsDatetime).subtract(1, 'months'));
setBasePeriodEndsDatetime(moment(reportingPeriodEndsDatetime).subtract(1, 'months'));
setBaseValues([moment(reportingPeriodBeginsDatetime).subtract(1, 'months').toDate(),
moment(reportingPeriodEndsDatetime).subtract(1, 'months').toDate()]);
setBasePeriodDateRangePickerDisabled(true);
setBasePeriodDateRange([moment(reportingPeriodDateRange[0]).subtract(1, 'months').toDate(),
moment(reportingPeriodDateRange[1]).subtract(1, 'months').toDate()]);
} else if (target.value === 'free-comparison') {
setBasePeriodDatetimeDisabled(false);
setBasePeriodDateRangePickerDisabled(false);
} else if (target.value === 'none-comparison') {
setBaseValues([]);
setBasePeriodBeginsDatetime(undefined);
setBasePeriodEndsDatetime(undefined);
setBasePeriodDatetimeDisabled(true);
setBasePeriodDateRange([null, null]);
setBasePeriodDateRangePickerDisabled(true);
}
};
let onBasePeriodChange = (DateRange) => {
console.log(DateRange);
if(DateRange == null) {
setBaseValues([]);
setBasePeriodDateRange([null, null]);
} else {
setBasePeriodDateRange([DateRange[0], DateRange[1]]);
}
let startDate = moment(DateRange[0]);
let endDate = moment(DateRange[1]);
setBaseValues([DateRange[0], DateRange[1]]);
setBasePeriodBeginsDatetime(startDate);
setBasePeriodEndsDatetime(endDate);
};
let onChange = (DateRange) => {
let onReportingPeriodChange = (DateRange) => {
if(DateRange == null) {
setValues([]);
}
let startDate = moment(DateRange[0]);
let endDate = moment(DateRange[1]);
setValues([DateRange[0], DateRange[1]]);
setReportingPeriodBeginsDatetime(startDate);
setReportingPeriodEndsDatetime(endDate);
setReportingPeriodDateRange([null, null]);
} else {
setReportingPeriodDateRange([DateRange[0], DateRange[1]]);
if (comparisonType === 'year-over-year') {
setBasePeriodBeginsDatetime(startDate.clone().subtract(1, 'years'));
setBasePeriodEndsDatetime(endDate.clone().subtract(1, 'years'));
setBaseValues([startDate.clone().subtract(1, 'years').toDate(),
endDate.clone().subtract(1, 'years').toDate()]);
setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'years').toDate(), moment(DateRange[1]).clone().subtract(1, 'years').toDate()]);
} else if (comparisonType === 'month-on-month') {
setBasePeriodBeginsDatetime(startDate.clone().subtract(1, 'months'));
setBasePeriodEndsDatetime(endDate.clone().subtract(1, 'months'));
setBaseValues([startDate.clone().subtract(1, 'months').toDate(),
endDate.clone().subtract(1, 'months').toDate()]);
setBasePeriodDateRange([moment(DateRange[0]).clone().subtract(1, 'months').toDate(), moment(DateRange[1]).clone().subtract(1, 'months').toDate()]);
}
}
};
let onClean = event => {
setValues([]);
let onBasePeriodClean = event => {
setBasePeriodDateRange([null, null]);
};
let onBaseClean = event => {
setValues([]);
let onReportingPeriodClean = event => {
setReportingPeriodDateRange([null, null]);
};
// Handler
@ -323,10 +300,10 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
console.log(selectedMeter);
console.log(comparisonType);
console.log(periodType);
console.log(basePeriodBeginsDatetime != null ? basePeriodBeginsDatetime.format('YYYY-MM-DDTHH:mm:ss') : undefined);
console.log(basePeriodEndsDatetime != null ? basePeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss') : undefined);
console.log(reportingPeriodBeginsDatetime.format('YYYY-MM-DDTHH:mm:ss'));
console.log(reportingPeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss'));
console.log(basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : null)
console.log(basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : null)
console.log(moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss'))
console.log(moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss'));
// disable submit button
setSubmitButtonDisabled(true);
@ -342,10 +319,10 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
fetch(APIBaseURL + '/reports/metercost?' +
'meterid=' + selectedMeter +
'&periodtype=' + periodType +
'&baseperiodstartdatetime=' + (basePeriodBeginsDatetime != null ? basePeriodBeginsDatetime.format('YYYY-MM-DDTHH:mm:ss') : '') +
'&baseperiodenddatetime=' + (basePeriodEndsDatetime != null ? basePeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss') : '') +
'&reportingperiodstartdatetime=' + reportingPeriodBeginsDatetime.format('YYYY-MM-DDTHH:mm:ss') +
'&reportingperiodenddatetime=' + reportingPeriodEndsDatetime.format('YYYY-MM-DDTHH:mm:ss'), {
'&baseperiodstartdatetime=' + (basePeriodDateRange[0] != null ? moment(basePeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') : '') +
'&baseperiodenddatetime=' + (basePeriodDateRange[1] != null ? moment(basePeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss') : '') +
'&reportingperiodstartdatetime=' + moment(reportingPeriodDateRange[0]).format('YYYY-MM-DDTHH:mm:ss') +
'&reportingperiodenddatetime=' + moment(reportingPeriodDateRange[1]).format('YYYY-MM-DDTHH:mm:ss'), {
method: 'GET',
headers: {
"Content-type": "application/json",
@ -551,37 +528,38 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
</Col>
<Col xs={6} sm={3}>
<FormGroup className="form-group">
<Label className={labelClasses} for="basePeriodBeginsDatetime">
{t('Base Period')}{t('(Optional)')}
<Label className={labelClasses} for="basePeriodDateRangePicker">{t('Base Period')}{t('(Optional)')}
</Label>
<DateRangePicker
readOnly={basePeriodDatetimeDisabled}
format="MM/dd/yyyy hh:mm aa"
value={baseValues}
id='basePeriodDateRangePicker'
readOnly={basePeriodDateRangePickerDisabled}
format="yyyy-MM-dd hh:mm aa"
value={basePeriodDateRange}
onChange={onBasePeriodChange}
size="md"
style={styles}
onClean={onBaseClean}
locale={local}
style={dateRangePickerStyle}
onClean={onBasePeriodClean}
locale={dateRangePickerLocale}
showMeridian
placeholder={"~"}
placeholder={t("Select Date Range")}
/>
</FormGroup>
</Col>
<Col xs={6} sm={3}>
<FormGroup className="form-group">
<Label className={labelClasses}>{t('Reporting Period')}</Label>
<Label className={labelClasses} for="reportingPeriodDateRangePicker">{t('Reporting Period')}</Label>
<br/>
<DateRangePicker
format="MM/dd/yyyy hh:mm aa"
value={values}
id='reportingPeriodDateRangePicker'
format="yyyy-MM-dd hh:mm aa"
value={reportingPeriodDateRange}
onChange={onReportingPeriodChange}
size="md"
style={styles}
onChange={onChange}
style={dateRangePickerStyle}
onClean={onReportingPeriodClean}
locale={dateRangePickerLocale}
showMeridian
placeholder="Select Date Range"
onClean={onClean}
locale={local}
placeholder={t("Select Date Range")}
/>
</FormGroup>
</Col>

93
web/src/i18n.js
View File

@ -134,6 +134,22 @@ const resources = {
'Output Energy Category': 'Output Energy Category',
'Fraction Parameter': 'Fraction Parameter',
'Search': 'Search',
//DateRangePicker
'sunday': 'Su',
'monday': 'Mo',
'tuesday': 'Tu',
'wednesday': 'We',
'thursday': 'Th',
'friday': 'Fr',
'saturday': 'Sa',
'ok': 'OK',
'today': 'Today',
'yesterday': 'Yesterday',
'hours': 'Hours',
'minutes': 'Minutes',
'seconds': 'Seconds',
'last7Days': 'Last 7 Days',
'Select Date Range': 'Select Date Range',
//Card Summaries and Line Charts
'Base Period': 'Base Period',
'Reporting Period': 'Reporting Period',
@ -786,21 +802,6 @@ const resources = {
'API.VIRTUAL_POINT_SHOULD_BE_ANALOG_VALUE': 'Virtual point should be analog value',
'API.WEB_MESSAGE_NOT_FOUND': 'Web message not found',
'API.WECHAT_MESSAGE_NOT_FOUND': 'Wechat message not found',
//DateRangePicker
'sunday': 'Su',
'monday': 'Mo',
'tuesday': 'Tu',
'wednesday': 'We',
'thursday': 'Th',
'friday': 'Fr',
'saturday': 'Sa',
'ok': 'OK',
'today': 'Today',
'yesterday': 'Yesterday',
'hours': 'Hours',
'minutes': 'Minutes',
'seconds': 'Seconds',
'last7Days': 'Last 7 Days'
}
},
de: {
@ -933,6 +934,22 @@ const resources = {
'Output Energy Category': 'Ausgangsenergiekategorie',
'Fraction Parameter': 'Fraktion Parameter',
'Search': 'Suche',
//DateRangePicker
'sunday': 'So',
'monday': 'Mo',
'tuesday': 'Di',
'wednesday': 'Mi',
'thursday': 'Do',
'friday': 'Fr',
'saturday': 'Sa',
'ok': 'OKAY',
'today': 'Heute',
'yesterday': 'Gestern',
'hours': 'Stunden',
'minutes': 'Protokoll',
'seconds': 'Nachschlag',
'last7Days': 'Letzte 7 Tage',
'Select Date Range': 'Datumsbereich auswählen',
//Card Summaries and Line Charts
'Base Period': 'Basiszeitraum',
'Reporting Period': 'Berichtszeitraum',
@ -1596,21 +1613,6 @@ const resources = {
'API.VIRTUAL_POINT_SHOULD_BE_ANALOG_VALUE': 'Virtual point should be analog value',
'API.WEB_MESSAGE_NOT_FOUND': 'Web message not found',
'API.WECHAT_MESSAGE_NOT_FOUND': 'Wechat message not found',
//DateRangePicker
'sunday': 'So',
'monday': 'Mo',
'tuesday': 'Di',
'wednesday': 'Mi',
'thursday': 'Do',
'friday': 'Fr',
'saturday': 'Sa',
'ok': 'OKAY',
'today': 'Heute',
'yesterday': 'Gestern',
'hours': 'Stunden',
'minutes': 'Protokoll',
'seconds': 'Nachschlag',
'last7Days': 'Letzte 7 Tage'
}
},
zh_CN: {
@ -1741,6 +1743,22 @@ const resources = {
'Output Energy Category': '产出能源分类',
'Fraction Parameter': '分式参数',
'Search': '搜索',
//DateRangePicker
'sunday': '日',
'monday': '一',
'tuesday': '二',
'wednesday': '三',
'thursday': '四',
'friday': '五',
'saturday': '六',
'ok': '确定',
'today': '今天',
'yesterday': '昨天',
'hours': '时',
'minutes': '分',
'seconds': '秒',
'last7Days': '最近七天',
'Select Date Range': '选择日期范围',
//Card Summaries and Line Charts
'Base Period': '基准期',
'Reporting Period': '报告期',
@ -2379,21 +2397,6 @@ const resources = {
'API.VIRTUAL_POINT_SHOULD_BE_ANALOG_VALUE': 'Virtual point should be analog value',
'API.WEB_MESSAGE_NOT_FOUND': 'Web message not found',
'API.WECHAT_MESSAGE_NOT_FOUND': 'Wechat message not found',
//DateRangePicker
'sunday': '日',
'monday': '一',
'tuesday': '二',
'wednesday': '三',
'thursday': '四',
'friday': '五',
'saturday': '六',
'ok': '确定',
'today': '今天',
'yesterday': '昨天',
'hours': '时',
'minutes': '分',
'seconds': '秒',
'last7Days': '最近七天',
}
}
};