mirror of https://github.com/openspug/spug
style migrate v3
parent
4ed1cca33c
commit
715b59f902
|
@ -5,7 +5,8 @@
|
|||
*/
|
||||
import React from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import { Table, Tag } from 'antd';
|
||||
import { Radio, Tag } from 'antd';
|
||||
import { TableCard } from 'components';
|
||||
import store from './store';
|
||||
import groupStore from '../group/store';
|
||||
|
||||
|
@ -61,15 +62,20 @@ class ComTable extends React.Component {
|
|||
}];
|
||||
|
||||
render() {
|
||||
let data = store.records;
|
||||
if (store.f_name) {
|
||||
data = data.filter(item => item['name'].toLowerCase().includes(store.f_name.toLowerCase()))
|
||||
}
|
||||
return (
|
||||
<Table
|
||||
<TableCard
|
||||
rowKey="id"
|
||||
title="报警历史记录"
|
||||
loading={store.isFetching}
|
||||
dataSource={data}
|
||||
dataSource={store.dataSource}
|
||||
onReload={store.fetchRecords}
|
||||
actions={[
|
||||
<Radio.Group value={store.f_status} onChange={e => store.f_status = e.target.value}>
|
||||
<Radio.Button value="">全部</Radio.Button>
|
||||
<Radio.Button value="1">报警发生</Radio.Button>
|
||||
<Radio.Button value="2">报警恢复</Radio.Button>
|
||||
</Radio.Group>
|
||||
]}
|
||||
pagination={{
|
||||
showSizeChanger: true,
|
||||
showLessItems: true,
|
||||
|
|
|
@ -5,23 +5,29 @@
|
|||
*/
|
||||
import React from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import { SyncOutlined } from '@ant-design/icons';
|
||||
import { Input, Button } from 'antd';
|
||||
import { SearchForm, AuthCard } from 'components';
|
||||
import { SearchForm, AuthDiv, Breadcrumb } from 'components';
|
||||
import ComTable from './Table';
|
||||
import store from './store';
|
||||
|
||||
export default observer(function () {
|
||||
return (
|
||||
<AuthCard auth="alarm.alarm.view">
|
||||
<AuthDiv auth="alarm.alarm.view">
|
||||
<Breadcrumb>
|
||||
<Breadcrumb.Item>首页</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>报警中心</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>报警历史</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
<SearchForm>
|
||||
<SearchForm.Item span={8} title="任务名称">
|
||||
<Input allowClear value={store.f_name} onChange={e => store.f_name = e.target.value} placeholder="请输入"/>
|
||||
</SearchForm.Item>
|
||||
<SearchForm.Item span={8}>
|
||||
<Button type="primary" icon="sync" onClick={store.fetchRecords}>刷新</Button>
|
||||
<Button type="primary" icon={<SyncOutlined/>} onClick={store.fetchRecords}>刷新</Button>
|
||||
</SearchForm.Item>
|
||||
</SearchForm>
|
||||
<ComTable/>
|
||||
</AuthCard>
|
||||
</AuthDiv>
|
||||
)
|
||||
})
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
* Copyright (c) <spug.dev@gmail.com>
|
||||
* Released under the AGPL-3.0 License.
|
||||
*/
|
||||
import { observable } from "mobx";
|
||||
import { observable, computed } from 'mobx';
|
||||
import http from 'libs/http';
|
||||
|
||||
class Store {
|
||||
|
@ -11,6 +11,14 @@ class Store {
|
|||
@observable isFetching = false;
|
||||
|
||||
@observable f_name;
|
||||
@observable f_status = '';
|
||||
|
||||
@computed get dataSource() {
|
||||
let records = this.records;
|
||||
if (this.f_name) records = records.filter(x => x.name.toLowerCase().includes(this.f_name.toLowerCase()));
|
||||
if (this.f_status) records = records.filter(x => x.status === this.f_status);
|
||||
return records
|
||||
}
|
||||
|
||||
fetchRecords = () => {
|
||||
this.isFetching = true;
|
||||
|
|
Loading…
Reference in New Issue