diff --git a/spug_web/src/pages/monitor/Table.js b/spug_web/src/pages/monitor/Table.js index 6c578b1..e7099d9 100644 --- a/spug_web/src/pages/monitor/Table.js +++ b/spug_web/src/pages/monitor/Table.js @@ -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']) diff --git a/spug_web/src/pages/monitor/index.js b/spug_web/src/pages/monitor/index.js index 7ec6a73..3137fd9 100644 --- a/spug_web/src/pages/monitor/index.js +++ b/spug_web/src/pages/monitor/index.js @@ -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 ( - + store.f_name = e.target.value} placeholder="请输入"/> - + + + + - + @@ -35,4 +41,4 @@ export default function () { ) -} +}) diff --git a/spug_web/src/pages/monitor/store.js b/spug_web/src/pages/monitor/store.js index 61a7d45..2dc13b2 100644 --- a/spug_web/src/pages/monitor/store.js +++ b/spug_web/src/pages/monitor/store.js @@ -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)