spug/spug_web/src/pages/host/index.js

43 lines
1.6 KiB
JavaScript

/**
* Copyright (c) OpenSpug Organization. https://github.com/openspug/spug
* Copyright (c) <spug.dev@gmail.com>
* Released under the AGPL-3.0 License.
*/
import React from 'react';
import { observer } from 'mobx-react';
import { Input, Select } from 'antd';
import { SearchForm, AuthDiv, Breadcrumb } from 'components';
import ComTable from './Table';
import ComForm from './Form';
import ComImport from './Import';
import store from './store';
export default observer(function () {
return (
<AuthDiv auth="host.host.view">
<Breadcrumb>
<Breadcrumb.Item>首页</Breadcrumb.Item>
<Breadcrumb.Item>主机管理</Breadcrumb.Item>
</Breadcrumb>
<SearchForm>
<SearchForm.Item span={6} title="主机类别">
<Select allowClear placeholder="请选择" value={store.f_zone} onChange={v => store.f_zone = v}>
{store.zones.map(item => (
<Select.Option value={item} key={item}>{item}</Select.Option>
))}
</Select>
</SearchForm.Item>
<SearchForm.Item span={6} title="主机别名">
<Input allowClear value={store.f_name} onChange={e => store.f_name = e.target.value} placeholder="请输入"/>
</SearchForm.Item>
<SearchForm.Item span={6} title="连接地址">
<Input allowClear value={store.f_host} onChange={e => store.f_host = e.target.value} placeholder="请输入"/>
</SearchForm.Item>
</SearchForm>
<ComTable/>
{store.formVisible && <ComForm/>}
{store.importVisible && <ComImport/>}
</AuthDiv>
);
})