1
|
|
|
import React, { Fragment, useState, useEffect } from 'react'; |
2
|
|
|
import { |
3
|
|
|
Button, |
4
|
|
|
ButtonGroup, |
5
|
|
|
Card, |
6
|
|
|
CardBody, |
7
|
|
|
Col, |
8
|
|
|
CustomInput, |
9
|
|
|
CardTitle, |
10
|
|
|
CardText, |
11
|
|
|
Form, |
12
|
|
|
FormGroup, |
13
|
|
|
Input, |
14
|
|
|
Label, |
15
|
|
|
Row, |
16
|
|
|
Table, |
17
|
|
|
Spinner, |
18
|
|
|
Nav, |
19
|
|
|
NavItem, |
20
|
|
|
NavLink, |
21
|
|
|
TabContent, |
22
|
|
|
TabPane |
23
|
|
|
} from 'reactstrap'; |
24
|
|
|
import Cascader from 'rc-cascader'; |
25
|
|
|
import FalconCardHeader from '../../common/FalconCardHeader'; |
26
|
|
|
import MultipleLineChart from '../common/MultipleLineChart'; |
27
|
|
|
import SectionLineChart from '../common/SectionLineChart'; |
28
|
|
|
import { getCookieValue, createCookie, checkEmpty } from '../../../helpers/utils'; |
29
|
|
|
import withRedirect from '../../../hoc/withRedirect'; |
30
|
|
|
import { withTranslation } from 'react-i18next'; |
31
|
|
|
import { toast } from 'react-toastify'; |
32
|
|
|
import { v4 as uuidv4 } from 'uuid'; |
33
|
|
|
import { APIBaseURL, settings } from '../../../config'; |
34
|
|
|
import useInterval from '../../../hooks/useInterval'; |
35
|
|
|
import { useLocation } from 'react-router-dom'; |
36
|
|
|
import Datetime from 'react-datetime'; |
37
|
|
|
import classNames from 'classnames'; |
38
|
|
|
|
39
|
|
|
const EnergyStoragePowerStationDetails = ({ setRedirect, setRedirectUrl, t }) => { |
40
|
|
|
const location = useLocation(); |
41
|
|
|
const uuid = location.search.split('=')[1]; |
42
|
|
|
const energyStoragePowerStationUUID = location.search.split('=')[1]; |
43
|
|
|
|
44
|
|
|
useEffect(() => { |
45
|
|
|
let is_logged_in = getCookieValue('is_logged_in'); |
46
|
|
|
let user_name = getCookieValue('user_name'); |
47
|
|
|
let user_display_name = getCookieValue('user_display_name'); |
48
|
|
|
let user_uuid = getCookieValue('user_uuid'); |
49
|
|
|
let token = getCookieValue('token'); |
50
|
|
|
if (checkEmpty(is_logged_in) || checkEmpty(token) || checkEmpty(user_uuid) || !is_logged_in) { |
51
|
|
|
setRedirectUrl(`/authentication/basic/login`); |
52
|
|
|
setRedirect(true); |
53
|
|
|
} else { |
54
|
|
|
//update expires time of cookies |
55
|
|
|
createCookie('is_logged_in', true, settings.cookieExpireTime); |
56
|
|
|
createCookie('user_name', user_name, settings.cookieExpireTime); |
57
|
|
|
createCookie('user_display_name', user_display_name, settings.cookieExpireTime); |
58
|
|
|
createCookie('user_uuid', user_uuid, settings.cookieExpireTime); |
59
|
|
|
createCookie('token', token, settings.cookieExpireTime); |
60
|
|
|
} |
61
|
|
|
}); |
62
|
|
|
|
63
|
|
|
useEffect(() => { |
64
|
|
|
let timer = setInterval(() => { |
65
|
|
|
let is_logged_in = getCookieValue('is_logged_in'); |
66
|
|
|
if (is_logged_in === null || !is_logged_in) { |
67
|
|
|
setRedirectUrl(`/authentication/basic/login`); |
68
|
|
|
setRedirect(true); |
69
|
|
|
} |
70
|
|
|
}, 1000); |
71
|
|
|
return () => clearInterval(timer); |
72
|
|
|
}, [setRedirect, setRedirectUrl]); |
73
|
|
|
|
74
|
|
|
const [activeTabLeft, setActiveTabLeft] = useState('1'); |
75
|
|
|
const toggleTabLeft = tab => { |
76
|
|
|
if (activeTabLeft !== tab) setActiveTabLeft(tab); |
77
|
|
|
}; |
78
|
|
|
|
79
|
|
|
const [activeTabRight, setActiveTabRight] = useState('1'); |
80
|
|
|
const toggleTabRight = tab => { |
81
|
|
|
if (activeTabRight !== tab) setActiveTabRight(tab); |
82
|
|
|
}; |
83
|
|
|
|
84
|
|
|
const [activeTabBottom, setActiveTabBottom] = useState('1'); |
85
|
|
|
const toggleTabBottom = tab => { |
86
|
|
|
if (activeTabBottom !== tab) setActiveTabBottom(tab); |
87
|
|
|
}; |
88
|
|
|
|
89
|
|
|
// State |
90
|
|
|
const [selectedSpaceName, setSelectedSpaceName] = useState(undefined); |
91
|
|
|
const [selectedSpaceID, setSelectedSpaceID] = useState(undefined); |
92
|
|
|
const [stationList, setStationList] = useState([]); |
93
|
|
|
const [filteredStationList, setFilteredStationList] = useState([]); |
94
|
|
|
const [selectedStation, setSelectedStation] = useState(undefined); |
95
|
|
|
const [cascaderOptions, setCascaderOptions] = useState(undefined); |
96
|
|
|
|
97
|
|
|
// buttons |
98
|
|
|
const [submitButtonDisabled, setSubmitButtonDisabled] = useState(true); |
99
|
|
|
const [spinnerHidden, setSpinnerHidden] = useState(true); |
100
|
|
|
const [spaceCascaderHidden, setSpaceCascaderHidden] = useState(false); |
101
|
|
|
|
102
|
|
|
//Results |
103
|
|
|
const [energyStoragePowerStationName, setEnergyStoragePowerStationName] = useState(); |
104
|
|
|
const [energyStoragePowerStationAddress, setEnergyStoragePowerStationAddress] = useState(); |
105
|
|
|
const [energyStoragePowerStationPostalCode, setEnergyStoragePowerStationPostalCode] = useState(); |
106
|
|
|
const [energyStoragePowerStationRatedCapacity, setEnergyStoragePowerStationRatedCapacity] = useState(); |
107
|
|
|
const [energyStoragePowerStationRatedPower, setEnergyStoragePowerStationRatedPower] = useState(); |
108
|
|
|
const [energyStoragePowerStationSVG, setEnergyStoragePowerStationSVG] = useState(); |
109
|
|
|
|
110
|
|
|
const [parameterLineChartLabels, setParameterLineChartLabels] = useState([]); |
111
|
|
|
const [parameterLineChartData, setParameterLineChartData] = useState({}); |
112
|
|
|
const [parameterLineChartOptions, setParameterLineChartOptions] = useState([]); |
113
|
|
|
|
114
|
|
|
useEffect(() => { |
115
|
|
|
console.log("uuid:"); |
116
|
|
|
console.log(uuid); |
117
|
|
|
if (uuid === null || !uuid) { |
118
|
|
|
let isResponseOK = false; |
119
|
|
|
setSpaceCascaderHidden(false); |
120
|
|
|
fetch(APIBaseURL + '/spaces/tree', { |
121
|
|
|
method: 'GET', |
122
|
|
|
headers: { |
123
|
|
|
'Content-type': 'application/json', |
124
|
|
|
'User-UUID': getCookieValue('user_uuid'), |
125
|
|
|
Token: getCookieValue('token') |
126
|
|
|
}, |
127
|
|
|
body: null |
128
|
|
|
}) |
129
|
|
|
.then(response => { |
130
|
|
|
console.log(response); |
131
|
|
|
if (response.ok) { |
132
|
|
|
isResponseOK = true; |
133
|
|
|
} |
134
|
|
|
return response.json(); |
135
|
|
|
}) |
136
|
|
|
.then(json => { |
137
|
|
|
console.log(json); |
138
|
|
|
if (isResponseOK) { |
139
|
|
|
// rename keys |
140
|
|
|
json = JSON.parse( |
141
|
|
|
JSON.stringify([json]) |
142
|
|
|
.split('"id":') |
143
|
|
|
.join('"value":') |
144
|
|
|
.split('"name":') |
145
|
|
|
.join('"label":') |
146
|
|
|
); |
147
|
|
|
setCascaderOptions(json); |
148
|
|
|
setSelectedSpaceName([json[0]].map(o => o.label)); |
149
|
|
|
setSelectedSpaceID([json[0]].map(o => o.value)); |
150
|
|
|
// get Energy Storage Power Stations by root Space ID |
151
|
|
|
let isResponseOK = false; |
152
|
|
|
fetch(APIBaseURL + '/spaces/' + [json[0]].map(o => o.value) + '/energystoragepowerstations', { |
153
|
|
|
method: 'GET', |
154
|
|
|
headers: { |
155
|
|
|
'Content-type': 'application/json', |
156
|
|
|
'User-UUID': getCookieValue('user_uuid'), |
157
|
|
|
Token: getCookieValue('token') |
158
|
|
|
}, |
159
|
|
|
body: null |
160
|
|
|
}) |
161
|
|
|
.then(response => { |
162
|
|
|
if (response.ok) { |
163
|
|
|
isResponseOK = true; |
164
|
|
|
} |
165
|
|
|
return response.json(); |
166
|
|
|
}) |
167
|
|
|
.then(json => { |
168
|
|
|
if (isResponseOK) { |
169
|
|
|
json = JSON.parse( |
170
|
|
|
JSON.stringify([json]) |
171
|
|
|
.split('"id":') |
172
|
|
|
.join('"value":') |
173
|
|
|
.split('"name":') |
174
|
|
|
.join('"label":') |
175
|
|
|
); |
176
|
|
|
console.log(json); |
177
|
|
|
setStationList(json[0]); |
178
|
|
|
setFilteredStationList(json[0]); |
179
|
|
|
if (json[0].length > 0) { |
180
|
|
|
setSelectedStation(json[0][0].value); |
181
|
|
|
// enable submit button |
182
|
|
|
setSubmitButtonDisabled(false); |
183
|
|
|
} else { |
184
|
|
|
setSelectedStation(undefined); |
185
|
|
|
// disable submit button |
186
|
|
|
setSubmitButtonDisabled(true); |
187
|
|
|
} |
188
|
|
|
} else { |
189
|
|
|
toast.error(t(json.description)); |
190
|
|
|
} |
191
|
|
|
}) |
192
|
|
|
.catch(err => { |
193
|
|
|
console.log(err); |
194
|
|
|
}); |
195
|
|
|
// end of get Energy Storage Power Stations by root Space ID |
196
|
|
|
} else { |
197
|
|
|
toast.error(t(json.description)); |
198
|
|
|
} |
199
|
|
|
}) |
200
|
|
|
.catch(err => { |
201
|
|
|
console.log(err); |
202
|
|
|
}); |
203
|
|
|
} else { |
204
|
|
|
setSpaceCascaderHidden(true); |
205
|
|
|
loadData(APIBaseURL + '/reports/energystoragepowerstationdetails?uuid=' + energyStoragePowerStationUUID) |
206
|
|
|
} |
207
|
|
|
}, [energyStoragePowerStationUUID]); |
208
|
|
|
|
209
|
|
|
const loadData = url => { |
210
|
|
|
console.log('url:' + url); |
211
|
|
|
let isResponseOK = false; |
212
|
|
|
fetch(url, { |
213
|
|
|
method: 'GET', |
214
|
|
|
headers: { |
215
|
|
|
'Content-type': 'application/json', |
216
|
|
|
'User-UUID': getCookieValue('user_uuid'), |
217
|
|
|
Token: getCookieValue('token') |
218
|
|
|
}, |
219
|
|
|
body: null |
220
|
|
|
}) |
221
|
|
|
.then(response => { |
222
|
|
|
if (response.ok) { |
223
|
|
|
isResponseOK = true; |
224
|
|
|
} |
225
|
|
|
return response.json(); |
226
|
|
|
}) |
227
|
|
|
.then(json => { |
228
|
|
|
if (isResponseOK) { |
229
|
|
|
console.log(json); |
230
|
|
|
if (uuid !== null && uuid) { |
231
|
|
|
setFilteredStationList([{ id: json['energy_storage_power_station']['id'], label: json['energy_storage_power_station']['name'] }]); |
232
|
|
|
setSelectedStation(json['energy_storage_power_station']['id']); |
233
|
|
|
} |
234
|
|
|
setEnergyStoragePowerStationName(json['energy_storage_power_station']['name']); |
235
|
|
|
setEnergyStoragePowerStationAddress(json['energy_storage_power_station']['address']); |
236
|
|
|
setEnergyStoragePowerStationPostalCode(json['energy_storage_power_station']['postal_code']); |
237
|
|
|
setEnergyStoragePowerStationRatedCapacity(json['energy_storage_power_station']['rated_capacity']); |
238
|
|
|
setEnergyStoragePowerStationRatedPower(json['energy_storage_power_station']['rated_power']); |
239
|
|
|
setEnergyStoragePowerStationSVG({ __html: json['energy_storage_power_station']['svg'] }); |
240
|
|
|
let timestamps = {}; |
241
|
|
|
json['parameters']['timestamps'].forEach((currentValue, index) => { |
242
|
|
|
timestamps['a' + index] = currentValue; |
243
|
|
|
}); |
244
|
|
|
setParameterLineChartLabels(timestamps); |
245
|
|
|
|
246
|
|
|
let values = {}; |
247
|
|
|
json['parameters']['values'].forEach((currentValue, index) => { |
248
|
|
|
values['a' + index] = currentValue; |
249
|
|
|
}); |
250
|
|
|
setParameterLineChartData(values); |
251
|
|
|
|
252
|
|
|
let names = []; |
253
|
|
|
json['parameters']['names'].forEach((currentValue, index) => { |
254
|
|
|
names.push({ value: 'a' + index, label: currentValue }); |
255
|
|
|
}); |
256
|
|
|
setParameterLineChartOptions(names); |
257
|
|
|
|
258
|
|
|
} |
259
|
|
|
}) |
260
|
|
|
.catch(err => { |
261
|
|
|
console.log(err); |
262
|
|
|
}); |
263
|
|
|
} |
264
|
|
|
const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0'; |
265
|
|
|
|
266
|
|
|
let onSpaceCascaderChange = (value, selectedOptions) => { |
267
|
|
|
setSelectedSpaceName(selectedOptions.map(o => o.label).join('/')); |
268
|
|
|
setSelectedSpaceID(value[value.length - 1]); |
269
|
|
|
|
270
|
|
|
let isResponseOK = false; |
271
|
|
|
fetch(APIBaseURL + '/spaces/' + value[value.length - 1] + '/energystoragepowerstations', { |
272
|
|
|
method: 'GET', |
273
|
|
|
headers: { |
274
|
|
|
'Content-type': 'application/json', |
275
|
|
|
'User-UUID': getCookieValue('user_uuid'), |
276
|
|
|
Token: getCookieValue('token') |
277
|
|
|
}, |
278
|
|
|
body: null |
279
|
|
|
}) |
280
|
|
|
.then(response => { |
281
|
|
|
if (response.ok) { |
282
|
|
|
isResponseOK = true; |
283
|
|
|
} |
284
|
|
|
return response.json(); |
285
|
|
|
}) |
286
|
|
|
.then(json => { |
287
|
|
|
if (isResponseOK) { |
288
|
|
|
json = JSON.parse( |
289
|
|
|
JSON.stringify([json]) |
290
|
|
|
.split('"id":') |
291
|
|
|
.join('"value":') |
292
|
|
|
.split('"name":') |
293
|
|
|
.join('"label":') |
294
|
|
|
); |
295
|
|
|
console.log(json); |
296
|
|
|
setStationList(json[0]); |
297
|
|
|
setFilteredStationList(json[0]); |
298
|
|
|
if (json[0].length > 0) { |
299
|
|
|
setSelectedStation(json[0][0].value); |
300
|
|
|
// enable submit button |
301
|
|
|
setSubmitButtonDisabled(false); |
302
|
|
|
} else { |
303
|
|
|
setSelectedStation(undefined); |
304
|
|
|
// disable submit button |
305
|
|
|
setSubmitButtonDisabled(true); |
306
|
|
|
} |
307
|
|
|
} else { |
308
|
|
|
toast.error(t(json.description)); |
309
|
|
|
} |
310
|
|
|
}) |
311
|
|
|
.catch(err => { |
312
|
|
|
console.log(err); |
313
|
|
|
}); |
314
|
|
|
}; |
315
|
|
|
|
316
|
|
|
// Handler |
317
|
|
|
const handleSubmit = e => { |
318
|
|
|
e.preventDefault(); |
319
|
|
|
|
320
|
|
|
loadData(APIBaseURL + '/reports/energystoragepowerstationdetails?id=' + selectedStation); |
321
|
|
|
}; |
322
|
|
|
|
323
|
|
|
|
324
|
|
|
const refreshSVGData = () => { |
325
|
|
|
let isResponseOK = false; |
326
|
|
|
fetch(APIBaseURL + '/reports/pointrealtime', { |
327
|
|
|
method: 'GET', |
328
|
|
|
headers: { |
329
|
|
|
'Content-type': 'application/json', |
330
|
|
|
'User-UUID': getCookieValue('user_uuid'), |
331
|
|
|
Token: getCookieValue('token') |
332
|
|
|
}, |
333
|
|
|
body: null |
334
|
|
|
}) |
335
|
|
|
.then(response => { |
336
|
|
|
if (response.ok) { |
337
|
|
|
isResponseOK = true; |
338
|
|
|
} |
339
|
|
|
return response.json(); |
340
|
|
|
}) |
341
|
|
|
.then(json => { |
342
|
|
|
if (isResponseOK) { |
343
|
|
|
console.log(json); |
344
|
|
|
json.forEach(currentPoint => { |
345
|
|
|
let textElement = document.getElementById('PT' + currentPoint['point_id']); |
346
|
|
|
if (textElement) { |
347
|
|
|
textElement.textContent = parseFloat(currentPoint['value']).toFixed(2); |
348
|
|
|
} |
349
|
|
|
let circleElement = document.getElementById('CIRCLE' + currentPoint['point_id']); |
350
|
|
|
if (circleElement) { |
351
|
|
|
if (currentPoint['value'] > 0) { |
352
|
|
|
circleElement.className.baseVal = 'flow'; |
353
|
|
|
} else if (currentPoint['value'] < 0) { |
354
|
|
|
circleElement.className.baseVal = 'flow-reverse'; |
355
|
|
|
} else { |
356
|
|
|
circleElement.className.baseVal = ''; |
357
|
|
|
} |
358
|
|
|
} |
359
|
|
|
}); |
360
|
|
|
} |
361
|
|
|
}) |
362
|
|
|
.catch(err => { |
363
|
|
|
console.log(err); |
364
|
|
|
}); |
365
|
|
|
}; |
366
|
|
|
|
367
|
|
|
useInterval(() => { |
368
|
|
|
refreshSVGData(); |
369
|
|
|
}, 1000 * 10); |
370
|
|
|
|
371
|
|
|
return ( |
372
|
|
|
<Fragment> |
373
|
|
|
|
374
|
|
|
<Form onSubmit={handleSubmit}> |
375
|
|
|
<Row form> |
376
|
|
|
<Col xs={6} sm={3} hidden={spaceCascaderHidden}> |
377
|
|
|
<FormGroup className="form-group"> |
378
|
|
|
<Cascader |
379
|
|
|
options={cascaderOptions} |
380
|
|
|
onChange={onSpaceCascaderChange} |
381
|
|
|
changeOnSelect |
382
|
|
|
expandTrigger="hover" |
383
|
|
|
> |
384
|
|
|
<Input value={selectedSpaceName || ''} readOnly /> |
385
|
|
|
</Cascader> |
386
|
|
|
</FormGroup> |
387
|
|
|
</Col> |
388
|
|
|
<Col xs="auto"> |
389
|
|
|
<FormGroup> |
390
|
|
|
<Form inline> |
391
|
|
|
<CustomInput |
392
|
|
|
type="select" |
393
|
|
|
id="stationSelect" |
394
|
|
|
name="stationSelect" |
395
|
|
|
onChange={({ target }) => setSelectedStation(target.value)} |
396
|
|
|
> |
397
|
|
|
{filteredStationList.map((station, index) => ( |
398
|
|
|
<option value={station.value} key={station.value}> |
399
|
|
|
{station.label} |
400
|
|
|
</option> |
401
|
|
|
))} |
402
|
|
|
</CustomInput> |
403
|
|
|
</Form> |
404
|
|
|
</FormGroup> |
405
|
|
|
</Col> |
406
|
|
|
<Col xs="auto"> |
407
|
|
|
<FormGroup> |
408
|
|
|
<ButtonGroup id="submit"> |
409
|
|
|
<Button color="success" disabled={submitButtonDisabled}> |
410
|
|
|
{t('Submit')} |
411
|
|
|
</Button> |
412
|
|
|
</ButtonGroup> |
413
|
|
|
</FormGroup> |
414
|
|
|
</Col> |
415
|
|
|
</Row> |
416
|
|
|
</Form> |
417
|
|
|
<Row noGutters> |
418
|
|
|
<Col lg="3" className="pr-lg-2"> |
419
|
|
|
<Nav tabs> |
420
|
|
|
<NavItem className="cursor-pointer"> |
421
|
|
|
<NavLink |
422
|
|
|
className={classNames({ active: activeTabLeft === '1' })} |
423
|
|
|
onClick={() => { |
424
|
|
|
toggleTabLeft('1'); |
425
|
|
|
}} |
426
|
|
|
> |
427
|
|
|
<h6>电量指标</h6> |
428
|
|
|
</NavLink> |
429
|
|
|
</NavItem> |
430
|
|
|
<NavItem className="cursor-pointer"> |
431
|
|
|
<NavLink |
432
|
|
|
className={classNames({ active: activeTabLeft === '2' })} |
433
|
|
|
onClick={() => { |
434
|
|
|
toggleTabLeft('2'); |
435
|
|
|
}} |
436
|
|
|
> |
437
|
|
|
<h6>收益指标</h6> |
438
|
|
|
</NavLink> |
439
|
|
|
</NavItem> |
440
|
|
|
<NavItem className="cursor-pointer"> |
441
|
|
|
<NavLink |
442
|
|
|
className={classNames({ active: activeTabLeft === '3' })} |
443
|
|
|
onClick={() => { |
444
|
|
|
toggleTabLeft('3'); |
445
|
|
|
}} |
446
|
|
|
> |
447
|
|
|
<h6>节能减排</h6> |
448
|
|
|
</NavLink> |
449
|
|
|
</NavItem> |
450
|
|
|
</Nav> |
451
|
|
|
<TabContent activeTab={activeTabLeft}> |
452
|
|
|
<TabPane tabId="1"> |
453
|
|
|
<Card className="mb-3 fs--1"> |
454
|
|
|
<Fragment> |
455
|
|
|
<CardBody className="pt-0"> |
456
|
|
|
<Table borderless className="fs--1 mb-0"> |
457
|
|
|
<tbody> |
458
|
|
|
<tr className="border-bottom"> |
459
|
|
|
<th className="pl-0">今日充电量</th> |
460
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
461
|
|
|
</tr> |
462
|
|
|
<tr className="border-bottom"> |
463
|
|
|
<th className="pl-0">今日放电量</th> |
464
|
|
|
<th className="pr-0 text-right ">0 kWh</th> |
465
|
|
|
</tr> |
466
|
|
|
<tr className="border-bottom"> |
467
|
|
|
<th className="pl-0 pb-0">累计充电量</th> |
468
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
469
|
|
|
</tr> |
470
|
|
|
<tr className="border-bottom"> |
471
|
|
|
<th className="pl-0 pb-0">累计放电量</th> |
472
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
473
|
|
|
</tr> |
474
|
|
|
<tr className="border-bottom"> |
475
|
|
|
<th className="pl-0 pb-0">综合效率</th> |
476
|
|
|
<th className="pr-0 text-right">0%</th> |
477
|
|
|
</tr> |
478
|
|
|
<tr className="border-bottom"> |
479
|
|
|
<th className="pl-0 pb-0">放电达成率</th> |
480
|
|
|
<th className="pr-0 text-right">0%</th> |
481
|
|
|
</tr> |
482
|
|
|
</tbody> |
483
|
|
|
</Table> |
484
|
|
|
</CardBody> |
485
|
|
|
</Fragment> |
486
|
|
|
</Card> |
487
|
|
|
</TabPane> |
488
|
|
|
<TabPane tabId="2"> |
489
|
|
|
<Card className="mb-3 fs--1"> |
490
|
|
|
<Fragment> |
491
|
|
|
<CardBody className="pt-0"> |
492
|
|
|
<Table borderless className="fs--1 mb-0"> |
493
|
|
|
<tbody> |
494
|
|
|
<tr className="border-bottom"> |
495
|
|
|
<th className="pl-0">今日成本</th> |
496
|
|
|
<th className="pr-0 text-right">0 元</th> |
497
|
|
|
</tr> |
498
|
|
|
<tr className="border-bottom"> |
499
|
|
|
<th className="pl-0">今日收入</th> |
500
|
|
|
<th className="pr-0 text-right ">0 元</th> |
501
|
|
|
</tr> |
502
|
|
|
<tr className="border-bottom"> |
503
|
|
|
<th className="pl-0 pb-0">累计成本</th> |
504
|
|
|
<th className="pr-0 text-right">0 元</th> |
505
|
|
|
</tr> |
506
|
|
|
<tr className="border-bottom"> |
507
|
|
|
<th className="pl-0 pb-0">累计收入</th> |
508
|
|
|
<th className="pr-0 text-right">0 元</th> |
509
|
|
|
</tr> |
510
|
|
|
<tr className="border-bottom"> |
511
|
|
|
<th className="pl-0 pb-0">今日盈利</th> |
512
|
|
|
<th className="pr-0 text-right">0 元</th> |
513
|
|
|
</tr> |
514
|
|
|
<tr className="border-bottom"> |
515
|
|
|
<th className="pl-0 pb-0">累计盈利</th> |
516
|
|
|
<th className="pr-0 text-right">0 元</th> |
517
|
|
|
</tr> |
518
|
|
|
</tbody> |
519
|
|
|
</Table> |
520
|
|
|
</CardBody> |
521
|
|
|
</Fragment> |
522
|
|
|
</Card> |
523
|
|
|
</TabPane> |
524
|
|
|
<TabPane tabId="3"> |
525
|
|
|
<Card className="mb-3 fs--1"> |
526
|
|
|
<Fragment> |
527
|
|
|
<CardBody className="pt-0"> |
528
|
|
|
<Table borderless className="fs--1 mb-0"> |
529
|
|
|
<tbody> |
530
|
|
|
<tr className="border-bottom"> |
531
|
|
|
<th className="pl-0">今日充电量</th> |
532
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
533
|
|
|
</tr> |
534
|
|
|
<tr className="border-bottom"> |
535
|
|
|
<th className="pl-0">今日放电量</th> |
536
|
|
|
<th className="pr-0 text-right ">0 kWh</th> |
537
|
|
|
</tr> |
538
|
|
|
<tr className="border-bottom"> |
539
|
|
|
<th className="pl-0 pb-0">累计充电量</th> |
540
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
541
|
|
|
</tr> |
542
|
|
|
<tr className="border-bottom"> |
543
|
|
|
<th className="pl-0 pb-0">累计放电量</th> |
544
|
|
|
<th className="pr-0 text-right">0 kWh</th> |
545
|
|
|
</tr> |
546
|
|
|
<tr className="border-bottom"> |
547
|
|
|
<th className="pl-0 pb-0">综合效率</th> |
548
|
|
|
<th className="pr-0 text-right">0%</th> |
549
|
|
|
</tr> |
550
|
|
|
<tr className="border-bottom"> |
551
|
|
|
<th className="pl-0 pb-0">放电达成率</th> |
552
|
|
|
<th className="pr-0 text-right">0%</th> |
553
|
|
|
</tr> |
554
|
|
|
</tbody> |
555
|
|
|
</Table> |
556
|
|
|
</CardBody> |
557
|
|
|
</Fragment> |
558
|
|
|
</Card> |
559
|
|
|
</TabPane> |
560
|
|
|
</TabContent> |
561
|
|
|
</Col> |
562
|
|
|
<Col lg="6" className="pr-lg-2" key={uuidv4()}> |
563
|
|
|
<div dangerouslySetInnerHTML={energyStoragePowerStationSVG} /> |
564
|
|
|
</Col> |
565
|
|
|
<Col lg="3" className="pr-lg-2"> |
566
|
|
|
<Nav tabs> |
567
|
|
|
<NavItem className="cursor-pointer"> |
568
|
|
|
<NavLink |
569
|
|
|
className={classNames({ active: activeTabRight === '1' })} |
570
|
|
|
onClick={() => { |
571
|
|
|
toggleTabRight('1'); |
572
|
|
|
}} |
573
|
|
|
> |
574
|
|
|
<h6>设备状态</h6> |
575
|
|
|
</NavLink> |
576
|
|
|
</NavItem> |
577
|
|
|
<NavItem className="cursor-pointer"> |
578
|
|
|
<NavLink |
579
|
|
|
className={classNames({ active: activeTabRight === '2' })} |
580
|
|
|
onClick={() => { |
581
|
|
|
toggleTabRight('2'); |
582
|
|
|
}} |
583
|
|
|
> |
584
|
|
|
<h6>电站信息</h6> |
585
|
|
|
</NavLink> |
586
|
|
|
</NavItem> |
587
|
|
|
</Nav> |
588
|
|
|
<TabContent activeTab={activeTabRight}> |
589
|
|
|
<TabPane tabId="1"> |
590
|
|
|
<Card className="mb-3 fs--1"> |
591
|
|
|
<Fragment> |
592
|
|
|
<CardBody className="pt-0"> |
593
|
|
|
<Table borderless className="fs--1 mb-0"> |
594
|
|
|
<tbody> |
595
|
|
|
<tr className="border-bottom"> |
596
|
|
|
<th className="pl-0 pb-0">通信网关</th> |
597
|
|
|
<th className="pr-0 text-right">正常</th> |
598
|
|
|
</tr> |
599
|
|
|
<tr className="border-bottom"> |
600
|
|
|
<th className="pl-0">1# PCS</th> |
601
|
|
|
<th className="pr-0 text-right">正常</th> |
602
|
|
|
</tr> |
603
|
|
|
<tr className="border-bottom"> |
604
|
|
|
<th className="pl-0">1#电池堆</th> |
605
|
|
|
<th className="pr-0 text-right ">正常</th> |
606
|
|
|
</tr> |
607
|
|
|
<tr className="border-bottom"> |
608
|
|
|
<th className="pl-0 pb-0">1#空调</th> |
609
|
|
|
<th className="pr-0 text-right">正常</th> |
610
|
|
|
</tr> |
611
|
|
|
<tr className="border-bottom"> |
612
|
|
|
<th className="pl-0 pb-0">1#网关表</th> |
613
|
|
|
<th className="pr-0 text-right">正常</th> |
614
|
|
|
</tr> |
615
|
|
|
<tr className="border-bottom"> |
616
|
|
|
<th className="pl-0 pb-0">1#用户表</th> |
617
|
|
|
<th className="pr-0 text-right">正常</th> |
618
|
|
|
</tr> |
619
|
|
|
</tbody> |
620
|
|
|
</Table> |
621
|
|
|
</CardBody> |
622
|
|
|
</Fragment> |
623
|
|
|
</Card> |
624
|
|
|
</TabPane> |
625
|
|
|
<TabPane tabId="2"> |
626
|
|
|
<Card className="mb-3 fs--1"> |
627
|
|
|
<Fragment> |
628
|
|
|
<CardBody className="pt-0"> |
629
|
|
|
<Table borderless className="fs--1 mb-0"> |
630
|
|
|
<tbody> |
631
|
|
|
<tr className="border-bottom"> |
632
|
|
|
<th className="pl-0">{t('Name')}</th> |
633
|
|
|
<th className="pr-0 text-right">{energyStoragePowerStationName}</th> |
634
|
|
|
</tr> |
635
|
|
|
<tr className="border-bottom"> |
636
|
|
|
<th className="pl-0">{t('Address')}</th> |
637
|
|
|
<th className="pr-0 text-right ">{energyStoragePowerStationAddress}</th> |
638
|
|
|
</tr> |
639
|
|
|
<tr className="border-bottom"> |
640
|
|
|
<th className="pl-0 pb-0">{t('Postal Code')}</th> |
641
|
|
|
<th className="pr-0 text-right">{energyStoragePowerStationPostalCode}</th> |
642
|
|
|
</tr> |
643
|
|
|
<tr className="border-bottom"> |
644
|
|
|
<th className="pl-0 pb-0">{t('Rated Capacity')} </th> |
645
|
|
|
<th className="pr-0 text-right">{energyStoragePowerStationRatedCapacity} kW</th> |
646
|
|
|
</tr> |
647
|
|
|
<tr className="border-bottom"> |
648
|
|
|
<th className="pl-0 pb-0">{t('Rated Power')} </th> |
649
|
|
|
<th className="pr-0 text-right">{energyStoragePowerStationRatedPower} kW</th> |
650
|
|
|
</tr> |
651
|
|
|
</tbody> |
652
|
|
|
</Table> |
653
|
|
|
</CardBody> |
654
|
|
|
</Fragment> |
655
|
|
|
</Card> |
656
|
|
|
</TabPane> |
657
|
|
|
</TabContent> |
658
|
|
|
</Col> |
659
|
|
|
</Row> |
660
|
|
|
|
661
|
|
|
<Nav tabs> |
662
|
|
|
<NavItem className="cursor-pointer"> |
663
|
|
|
<NavLink |
664
|
|
|
className={classNames({ active: activeTabBottom === '1' })} |
665
|
|
|
onClick={() => { |
666
|
|
|
toggleTabBottom('1'); |
667
|
|
|
}} |
668
|
|
|
> |
669
|
|
|
<h6>{t('Operating Characteristic Curve')}</h6> |
670
|
|
|
</NavLink> |
671
|
|
|
</NavItem> |
672
|
|
|
<NavItem className="cursor-pointer"> |
673
|
|
|
<NavLink |
674
|
|
|
className={classNames({ active: activeTabBottom === '2' })} |
675
|
|
|
onClick={() => { |
676
|
|
|
toggleTabBottom('2'); |
677
|
|
|
}} |
678
|
|
|
> |
679
|
|
|
<h6>{t('Strategy Management')}</h6> |
680
|
|
|
</NavLink> |
681
|
|
|
</NavItem> |
682
|
|
|
<NavItem className="cursor-pointer"> |
683
|
|
|
<NavLink |
684
|
|
|
className={classNames({ active: activeTabBottom === '3' })} |
685
|
|
|
onClick={() => { |
686
|
|
|
toggleTabBottom('3'); |
687
|
|
|
}} |
688
|
|
|
> |
689
|
|
|
<h6>{t('Fault Alarms')}</h6> |
690
|
|
|
</NavLink> |
691
|
|
|
</NavItem> |
692
|
|
|
|
693
|
|
|
<NavItem className="cursor-pointer"> |
694
|
|
|
<NavLink |
695
|
|
|
className={classNames({ active: activeTabBottom === '4' })} |
696
|
|
|
onClick={() => { |
697
|
|
|
toggleTabBottom('4'); |
698
|
|
|
}} |
699
|
|
|
> |
700
|
|
|
<h6>PCS</h6> |
701
|
|
|
</NavLink> |
702
|
|
|
</NavItem> |
703
|
|
|
|
704
|
|
|
<NavItem className="cursor-pointer"> |
705
|
|
|
<NavLink |
706
|
|
|
className={classNames({ active: activeTabBottom === '5' })} |
707
|
|
|
onClick={() => { |
708
|
|
|
toggleTabBottom('5'); |
709
|
|
|
}} |
710
|
|
|
> |
711
|
|
|
<h6>BMS</h6> |
712
|
|
|
</NavLink> |
713
|
|
|
</NavItem> |
714
|
|
|
|
715
|
|
|
<NavItem className="cursor-pointer"> |
716
|
|
|
<NavLink |
717
|
|
|
className={classNames({ active: activeTabBottom === '6' })} |
718
|
|
|
onClick={() => { |
719
|
|
|
toggleTabBottom('6'); |
720
|
|
|
}} |
721
|
|
|
> |
722
|
|
|
<h6>电表</h6> |
723
|
|
|
</NavLink> |
724
|
|
|
</NavItem> |
725
|
|
|
|
726
|
|
|
<NavItem className="cursor-pointer"> |
727
|
|
|
<NavLink |
728
|
|
|
className={classNames({ active: activeTabBottom === '7' })} |
729
|
|
|
onClick={() => { |
730
|
|
|
toggleTabBottom('7'); |
731
|
|
|
}} |
732
|
|
|
> |
733
|
|
|
<h6>空调</h6> |
734
|
|
|
</NavLink> |
735
|
|
|
</NavItem> |
736
|
|
|
|
737
|
|
|
<NavItem className="cursor-pointer"> |
738
|
|
|
<NavLink |
739
|
|
|
className={classNames({ active: activeTabBottom === '8' })} |
740
|
|
|
onClick={() => { |
741
|
|
|
toggleTabBottom('8'); |
742
|
|
|
}} |
743
|
|
|
> |
744
|
|
|
<h6>消防</h6> |
745
|
|
|
</NavLink> |
746
|
|
|
</NavItem> |
747
|
|
|
</Nav> |
748
|
|
|
<TabContent activeTab={activeTabBottom}> |
749
|
|
|
<TabPane tabId="1"> |
750
|
|
|
<MultipleLineChart |
751
|
|
|
reportingTitle="" |
752
|
|
|
baseTitle="" |
753
|
|
|
labels={parameterLineChartLabels} |
754
|
|
|
data={parameterLineChartData} |
755
|
|
|
options={parameterLineChartOptions} |
756
|
|
|
/> |
757
|
|
|
</TabPane> |
758
|
|
|
<TabPane tabId="2"> |
759
|
|
|
<Card className="mb-3 fs--1"> |
760
|
|
|
<CardBody className="bg-light"> |
761
|
|
|
<SectionLineChart></SectionLineChart> |
762
|
|
|
</CardBody> |
763
|
|
|
</Card> |
764
|
|
|
</TabPane> |
765
|
|
|
<TabPane tabId="3"> |
766
|
|
|
<Card className="mb-3 fs--1"> |
767
|
|
|
<CardBody className="bg-light"> |
768
|
|
|
<Table striped className="border-bottom"> |
769
|
|
|
<thead> |
770
|
|
|
<tr> |
771
|
|
|
<th>#</th> |
772
|
|
|
<th>主题</th> |
773
|
|
|
<th>内容</th> |
774
|
|
|
<th>创建时间</th> |
775
|
|
|
<th>开始时间</th> |
776
|
|
|
<th>结束时间</th> |
777
|
|
|
<th>状态</th> |
778
|
|
|
<th>更新时间</th> |
779
|
|
|
</tr> |
780
|
|
|
</thead> |
781
|
|
|
<tbody> |
782
|
|
|
<tr> |
783
|
|
|
<th scope="row">1</th> |
784
|
|
|
<td /> |
785
|
|
|
<td /> |
786
|
|
|
<td /> |
787
|
|
|
<td /> |
788
|
|
|
<td /> |
789
|
|
|
<td /> |
790
|
|
|
<td /> |
791
|
|
|
</tr> |
792
|
|
|
<tr> |
793
|
|
|
<th scope="row">2</th> |
794
|
|
|
<td /> |
795
|
|
|
<td /> |
796
|
|
|
<td /> |
797
|
|
|
<td /> |
798
|
|
|
<td /> |
799
|
|
|
<td /> |
800
|
|
|
<td /> |
801
|
|
|
</tr> |
802
|
|
|
<tr> |
803
|
|
|
<th scope="row">3</th> |
804
|
|
|
<td /> |
805
|
|
|
<td /> |
806
|
|
|
<td /> |
807
|
|
|
<td /> |
808
|
|
|
<td /> |
809
|
|
|
<td /> |
810
|
|
|
<td /> |
811
|
|
|
</tr> |
812
|
|
|
<tr> |
813
|
|
|
<th scope="row">4</th> |
814
|
|
|
<td /> |
815
|
|
|
<td /> |
816
|
|
|
<td /> |
817
|
|
|
<td /> |
818
|
|
|
<td /> |
819
|
|
|
<td /> |
820
|
|
|
<td /> |
821
|
|
|
</tr> |
822
|
|
|
</tbody> |
823
|
|
|
</Table> |
824
|
|
|
</CardBody> |
825
|
|
|
</Card> |
826
|
|
|
</TabPane> |
827
|
|
|
<TabPane tabId="4"> |
828
|
|
|
<Card className="mb-3 fs--1"> |
829
|
|
|
<CardBody className="bg-light"> |
830
|
|
|
<Table striped className="border-bottom"> |
831
|
|
|
<thead> |
832
|
|
|
<tr> |
833
|
|
|
<th>#</th> |
834
|
|
|
<th>主题</th> |
835
|
|
|
<th>内容</th> |
836
|
|
|
<th>创建时间</th> |
837
|
|
|
<th>开始时间</th> |
838
|
|
|
<th>结束时间</th> |
839
|
|
|
<th>状态</th> |
840
|
|
|
<th>更新时间</th> |
841
|
|
|
</tr> |
842
|
|
|
</thead> |
843
|
|
|
<tbody> |
844
|
|
|
<tr> |
845
|
|
|
<th scope="row">1</th> |
846
|
|
|
<td /> |
847
|
|
|
<td /> |
848
|
|
|
<td /> |
849
|
|
|
<td /> |
850
|
|
|
<td /> |
851
|
|
|
<td /> |
852
|
|
|
<td /> |
853
|
|
|
</tr> |
854
|
|
|
<tr> |
855
|
|
|
<th scope="row">2</th> |
856
|
|
|
<td /> |
857
|
|
|
<td /> |
858
|
|
|
<td /> |
859
|
|
|
<td /> |
860
|
|
|
<td /> |
861
|
|
|
<td /> |
862
|
|
|
<td /> |
863
|
|
|
</tr> |
864
|
|
|
<tr> |
865
|
|
|
<th scope="row">3</th> |
866
|
|
|
<td /> |
867
|
|
|
<td /> |
868
|
|
|
<td /> |
869
|
|
|
<td /> |
870
|
|
|
<td /> |
871
|
|
|
<td /> |
872
|
|
|
<td /> |
873
|
|
|
</tr> |
874
|
|
|
<tr> |
875
|
|
|
<th scope="row">4</th> |
876
|
|
|
<td /> |
877
|
|
|
<td /> |
878
|
|
|
<td /> |
879
|
|
|
<td /> |
880
|
|
|
<td /> |
881
|
|
|
<td /> |
882
|
|
|
<td /> |
883
|
|
|
</tr> |
884
|
|
|
</tbody> |
885
|
|
|
</Table> |
886
|
|
|
</CardBody> |
887
|
|
|
</Card> |
888
|
|
|
</TabPane> |
889
|
|
|
<TabPane tabId="5"> |
890
|
|
|
<Card className="mb-3 fs--1"> |
891
|
|
|
<CardBody className="bg-light"> |
892
|
|
|
<Table striped className="border-bottom"> |
893
|
|
|
<thead> |
894
|
|
|
<tr> |
895
|
|
|
<th>#</th> |
896
|
|
|
<th>主题</th> |
897
|
|
|
<th>内容</th> |
898
|
|
|
<th>创建时间</th> |
899
|
|
|
<th>开始时间</th> |
900
|
|
|
<th>结束时间</th> |
901
|
|
|
<th>状态</th> |
902
|
|
|
<th>更新时间</th> |
903
|
|
|
</tr> |
904
|
|
|
</thead> |
905
|
|
|
<tbody> |
906
|
|
|
<tr> |
907
|
|
|
<th scope="row">1</th> |
908
|
|
|
<td /> |
909
|
|
|
<td /> |
910
|
|
|
<td /> |
911
|
|
|
<td /> |
912
|
|
|
<td /> |
913
|
|
|
<td /> |
914
|
|
|
<td /> |
915
|
|
|
</tr> |
916
|
|
|
<tr> |
917
|
|
|
<th scope="row">2</th> |
918
|
|
|
<td /> |
919
|
|
|
<td /> |
920
|
|
|
<td /> |
921
|
|
|
<td /> |
922
|
|
|
<td /> |
923
|
|
|
<td /> |
924
|
|
|
<td /> |
925
|
|
|
</tr> |
926
|
|
|
<tr> |
927
|
|
|
<th scope="row">3</th> |
928
|
|
|
<td /> |
929
|
|
|
<td /> |
930
|
|
|
<td /> |
931
|
|
|
<td /> |
932
|
|
|
<td /> |
933
|
|
|
<td /> |
934
|
|
|
<td /> |
935
|
|
|
</tr> |
936
|
|
|
<tr> |
937
|
|
|
<th scope="row">4</th> |
938
|
|
|
<td /> |
939
|
|
|
<td /> |
940
|
|
|
<td /> |
941
|
|
|
<td /> |
942
|
|
|
<td /> |
943
|
|
|
<td /> |
944
|
|
|
<td /> |
945
|
|
|
</tr> |
946
|
|
|
</tbody> |
947
|
|
|
</Table> |
948
|
|
|
</CardBody> |
949
|
|
|
</Card> |
950
|
|
|
</TabPane> |
951
|
|
|
<TabPane tabId="6"> |
952
|
|
|
<Card className="mb-3 fs--1"> |
953
|
|
|
<CardBody className="bg-light"> |
954
|
|
|
<Table striped className="border-bottom"> |
955
|
|
|
<thead> |
956
|
|
|
<tr> |
957
|
|
|
<th>#</th> |
958
|
|
|
<th>主题</th> |
959
|
|
|
<th>内容</th> |
960
|
|
|
<th>创建时间</th> |
961
|
|
|
<th>开始时间</th> |
962
|
|
|
<th>结束时间</th> |
963
|
|
|
<th>状态</th> |
964
|
|
|
<th>更新时间</th> |
965
|
|
|
</tr> |
966
|
|
|
</thead> |
967
|
|
|
<tbody> |
968
|
|
|
<tr> |
969
|
|
|
<th scope="row">1</th> |
970
|
|
|
<td /> |
971
|
|
|
<td /> |
972
|
|
|
<td /> |
973
|
|
|
<td /> |
974
|
|
|
<td /> |
975
|
|
|
<td /> |
976
|
|
|
<td /> |
977
|
|
|
</tr> |
978
|
|
|
<tr> |
979
|
|
|
<th scope="row">2</th> |
980
|
|
|
<td /> |
981
|
|
|
<td /> |
982
|
|
|
<td /> |
983
|
|
|
<td /> |
984
|
|
|
<td /> |
985
|
|
|
<td /> |
986
|
|
|
<td /> |
987
|
|
|
</tr> |
988
|
|
|
<tr> |
989
|
|
|
<th scope="row">3</th> |
990
|
|
|
<td /> |
991
|
|
|
<td /> |
992
|
|
|
<td /> |
993
|
|
|
<td /> |
994
|
|
|
<td /> |
995
|
|
|
<td /> |
996
|
|
|
<td /> |
997
|
|
|
</tr> |
998
|
|
|
<tr> |
999
|
|
|
<th scope="row">4</th> |
1000
|
|
|
<td /> |
1001
|
|
|
<td /> |
1002
|
|
|
<td /> |
1003
|
|
|
<td /> |
1004
|
|
|
<td /> |
1005
|
|
|
<td /> |
1006
|
|
|
<td /> |
1007
|
|
|
</tr> |
1008
|
|
|
</tbody> |
1009
|
|
|
</Table> |
1010
|
|
|
</CardBody> |
1011
|
|
|
</Card> |
1012
|
|
|
</TabPane> |
1013
|
|
|
<TabPane tabId="7"> |
1014
|
|
|
<Card className="mb-3 fs--1"> |
1015
|
|
|
<CardBody className="bg-light"> |
1016
|
|
|
<Table striped className="border-bottom"> |
1017
|
|
|
<thead> |
1018
|
|
|
<tr> |
1019
|
|
|
<th>#</th> |
1020
|
|
|
<th>主题</th> |
1021
|
|
|
<th>内容</th> |
1022
|
|
|
<th>创建时间</th> |
1023
|
|
|
<th>开始时间</th> |
1024
|
|
|
<th>结束时间</th> |
1025
|
|
|
<th>状态</th> |
1026
|
|
|
<th>更新时间</th> |
1027
|
|
|
</tr> |
1028
|
|
|
</thead> |
1029
|
|
|
<tbody> |
1030
|
|
|
<tr> |
1031
|
|
|
<th scope="row">1</th> |
1032
|
|
|
<td /> |
1033
|
|
|
<td /> |
1034
|
|
|
<td /> |
1035
|
|
|
<td /> |
1036
|
|
|
<td /> |
1037
|
|
|
<td /> |
1038
|
|
|
<td /> |
1039
|
|
|
</tr> |
1040
|
|
|
<tr> |
1041
|
|
|
<th scope="row">2</th> |
1042
|
|
|
<td /> |
1043
|
|
|
<td /> |
1044
|
|
|
<td /> |
1045
|
|
|
<td /> |
1046
|
|
|
<td /> |
1047
|
|
|
<td /> |
1048
|
|
|
<td /> |
1049
|
|
|
</tr> |
1050
|
|
|
<tr> |
1051
|
|
|
<th scope="row">3</th> |
1052
|
|
|
<td /> |
1053
|
|
|
<td /> |
1054
|
|
|
<td /> |
1055
|
|
|
<td /> |
1056
|
|
|
<td /> |
1057
|
|
|
<td /> |
1058
|
|
|
<td /> |
1059
|
|
|
</tr> |
1060
|
|
|
<tr> |
1061
|
|
|
<th scope="row">4</th> |
1062
|
|
|
<td /> |
1063
|
|
|
<td /> |
1064
|
|
|
<td /> |
1065
|
|
|
<td /> |
1066
|
|
|
<td /> |
1067
|
|
|
<td /> |
1068
|
|
|
<td /> |
1069
|
|
|
</tr> |
1070
|
|
|
</tbody> |
1071
|
|
|
</Table> |
1072
|
|
|
</CardBody> |
1073
|
|
|
</Card> |
1074
|
|
|
</TabPane> |
1075
|
|
|
<TabPane tabId="8"> |
1076
|
|
|
<Card className="mb-3 fs--1"> |
1077
|
|
|
<CardBody className="bg-light"> |
1078
|
|
|
<Table striped className="border-bottom"> |
1079
|
|
|
<thead> |
1080
|
|
|
<tr> |
1081
|
|
|
<th>#</th> |
1082
|
|
|
<th>主题</th> |
1083
|
|
|
<th>内容</th> |
1084
|
|
|
<th>创建时间</th> |
1085
|
|
|
<th>开始时间</th> |
1086
|
|
|
<th>结束时间</th> |
1087
|
|
|
<th>状态</th> |
1088
|
|
|
<th>更新时间</th> |
1089
|
|
|
</tr> |
1090
|
|
|
</thead> |
1091
|
|
|
<tbody> |
1092
|
|
|
<tr> |
1093
|
|
|
<th scope="row">1</th> |
1094
|
|
|
<td /> |
1095
|
|
|
<td /> |
1096
|
|
|
<td /> |
1097
|
|
|
<td /> |
1098
|
|
|
<td /> |
1099
|
|
|
<td /> |
1100
|
|
|
<td /> |
1101
|
|
|
</tr> |
1102
|
|
|
<tr> |
1103
|
|
|
<th scope="row">2</th> |
1104
|
|
|
<td /> |
1105
|
|
|
<td /> |
1106
|
|
|
<td /> |
1107
|
|
|
<td /> |
1108
|
|
|
<td /> |
1109
|
|
|
<td /> |
1110
|
|
|
<td /> |
1111
|
|
|
</tr> |
1112
|
|
|
<tr> |
1113
|
|
|
<th scope="row">3</th> |
1114
|
|
|
<td /> |
1115
|
|
|
<td /> |
1116
|
|
|
<td /> |
1117
|
|
|
<td /> |
1118
|
|
|
<td /> |
1119
|
|
|
<td /> |
1120
|
|
|
<td /> |
1121
|
|
|
</tr> |
1122
|
|
|
<tr> |
1123
|
|
|
<th scope="row">4</th> |
1124
|
|
|
<td /> |
1125
|
|
|
<td /> |
1126
|
|
|
<td /> |
1127
|
|
|
<td /> |
1128
|
|
|
<td /> |
1129
|
|
|
<td /> |
1130
|
|
|
<td /> |
1131
|
|
|
</tr> |
1132
|
|
|
</tbody> |
1133
|
|
|
</Table> |
1134
|
|
|
</CardBody> |
1135
|
|
|
</Card> |
1136
|
|
|
</TabPane> |
1137
|
|
|
</TabContent> |
1138
|
|
|
</Fragment> |
1139
|
|
|
); |
1140
|
|
|
}; |
1141
|
|
|
|
1142
|
|
|
export default withTranslation()(withRedirect(EnergyStoragePowerStationDetails)); |
1143
|
|
|
|