A 添加监控中心任务类型过滤

pull/31/head
vapao 2020-02-27 20:35:38 +08:00
parent 4b132bc025
commit f2050274ce
3 changed files with 19 additions and 5 deletions

View File

@ -131,6 +131,9 @@ class ComTable extends React.Component {
if (store.f_name) {
data = data.filter(item => item['name'].toLowerCase().includes(store.f_name.toLowerCase()))
}
if (store.f_type) {
data = data.filter(item => item['type_alias'] === store.f_type)
}
if (store.f_status !== undefined) {
if (store.f_status === -3) {
data = data.filter(item => !item['is_active'])

View File

@ -4,19 +4,25 @@
* Released under the MIT License.
*/
import React from 'react';
import { observer } from 'mobx-react';
import { Input, Select, Button } from 'antd';
import { SearchForm, AuthDiv, AuthCard } from 'components';
import ComTable from './Table';
import store from './store';
export default function () {
export default observer(function () {
return (
<AuthCard auth="monitor.monitor.view">
<SearchForm>
<SearchForm.Item span={8} title="任务名称">
<SearchForm.Item span={6} title="任务名称">
<Input allowClear onChange={e => store.f_name = e.target.value} placeholder="请输入"/>
</SearchForm.Item>
<SearchForm.Item span={8} title="任务状态">
<SearchForm.Item span={6} title="任务类型">
<Select allowClear onChange={v => store.f_type = v} placeholder="请选择">
{store.types.map(item => <Select.Option key={item} value={item}>{item}</Select.Option>)}
</Select>
</SearchForm.Item>
<SearchForm.Item span={6} title="任务状态">
<Select allowClear onChange={v => store.f_status = v} placeholder="请选择">
<Select.Option value={-3}>未激活</Select.Option>
<Select.Option value={-2}>已激活</Select.Option>
@ -25,7 +31,7 @@ export default function () {
<Select.Option value={1}>异常</Select.Option>
</Select>
</SearchForm.Item>
<SearchForm.Item span={8}>
<SearchForm.Item span={6}>
<Button type="primary" icon="sync" onClick={store.fetchRecords}>刷新</Button>
</SearchForm.Item>
</SearchForm>
@ -35,4 +41,4 @@ export default function () {
<ComTable/>
</AuthCard>
)
}
})

View File

@ -10,21 +10,26 @@ import moment from "moment";
class Store {
@observable records = [];
@observable record = {};
@observable types = [];
@observable isFetching = false;
@observable formVisible = false;
@observable f_name;
@observable f_type;
@observable f_status;
fetchRecords = () => {
this.isFetching = true;
http.get('/api/monitor/')
.then(res => {
const tmp = new Set();
res.map(item => {
tmp.add(item['type_alias']);
const value = item['latest_run_time'];
item['latest_run_time'] = value ? moment(value).fromNow() : null;
return null
});
this.types = Array.from(tmp);
this.records = res
})
.finally(() => this.isFetching = false)