114 lines
2.8 KiB
JavaScript
114 lines
2.8 KiB
JavaScript
// 核心库
|
|
import React from 'react'
|
|
import { connect } from 'dva'
|
|
// 组件库
|
|
import { Table } from 'antd'
|
|
import { Search, FullDatePicker, LayoutCard } from '@woowalker/feui'
|
|
import CommonChart from '../../Chart/CommonChart'
|
|
// 工具库
|
|
import { initFilter, addRuleAndGroups } from '../../../utils/common'
|
|
import moment from 'moment'
|
|
|
|
|
|
class EMLossRankingPage extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
head: [],
|
|
data: [],
|
|
dateType: '1',
|
|
dateString: moment().format('YYYY-MM'),
|
|
orderType: 0,
|
|
chartData: {}
|
|
}
|
|
}
|
|
|
|
handleSearch = (value) => {
|
|
const { dateType, dateString } = this.state
|
|
value.rules.push({
|
|
field: 'Parameter2',
|
|
operator: 0,
|
|
value: dateType,
|
|
isCustom: true,
|
|
isSysParam: false,
|
|
})
|
|
value.rules.push({
|
|
field: 'Parameter3',
|
|
operator: 0,
|
|
value: dateString,
|
|
isCustom: true,
|
|
isSysParam: false,
|
|
})
|
|
value.rules.push({
|
|
field: 'Parameter5',
|
|
operator: 0,
|
|
value: "LOSS",
|
|
isCustom: true,
|
|
isSysParam: false,
|
|
})
|
|
// 获取数据
|
|
const { login, dispatch } = this.props
|
|
const json = initFilter(login.OrgId)
|
|
addRuleAndGroups(json, value)
|
|
|
|
dispatch({
|
|
type: 'app/getDataByPost',
|
|
url: 'EM/EMEnergyDosage/GetLossRanking',
|
|
payload: json
|
|
}).then(res => {
|
|
if (res) {
|
|
const { chartData } = res
|
|
this.setState({
|
|
...res,
|
|
chartData: {
|
|
xAxis: chartData.XAxis[0].Data,
|
|
yAxis: chartData.YAxis,
|
|
data: chartData.Data
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
render() {
|
|
const { formId, formCode } = this.props
|
|
const { head, data,dateType, dateString, chartData } = this.state
|
|
return (
|
|
<>
|
|
<Search
|
|
formId={formId}
|
|
formCode={formCode}
|
|
onSearch={this.handleSearch}
|
|
extraSearch={[
|
|
<FullDatePicker
|
|
dateType={dateType}
|
|
dateString={dateString}
|
|
onlyItem
|
|
onChange={({ dateString, dateType }) => this.setState({ dateString, dateType })}
|
|
options={['0', '1', '3']}
|
|
/>
|
|
]}
|
|
/>
|
|
<LayoutCard title='排名'>
|
|
<CommonChart
|
|
chartId='EMLossRankingPage'
|
|
{...chartData}
|
|
style={{ height: 300 }}
|
|
/>
|
|
</LayoutCard>
|
|
<LayoutCard title='损耗同比'>
|
|
<Table
|
|
size='small'
|
|
columns={head.map(({ Title: title, DataIndex: dataIndex }) => ({ title, dataIndex }))}
|
|
dataSource={data}
|
|
pagination={{ pageSize: 5 }}
|
|
style={{ marginTop: 8 }}
|
|
/>
|
|
</LayoutCard>
|
|
</>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default connect(({ login }) => ({ login }))(EMLossRankingPage)
|