github
/
spug
mirror of https://github.com/openspug/spug
1
0
Fork 0
Code Issues Releases Wiki Activity

A web update

pull/22/head
雷二猛 2019-12-14 15:35:31 +08:00
parent 9c829a63e6
commit 1cc43bc0c0
10 changed files with 63 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
spug_web/src/pages/alarm/contact/Form.js
View File

@ -28,10 +28,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -41,28 +37,28 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="姓名">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="姓名">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入联系人姓名"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="手机号">
<Form.Item label="手机号">
{getFieldDecorator('phone', {initialValue: info['phone']})(
<Input placeholder="请输入手机号"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="邮箱">
<Form.Item label="邮箱">
{getFieldDecorator('email', {initialValue: info['email']})(
<Input placeholder="请输入邮箱地址"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="微信Token">
<Form.Item label="微信Token">
{getFieldDecorator('wx_token', {initialValue: info['wx_token']})(
<Input placeholder="请输入微信token"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="钉钉">
<Form.Item label="钉钉">
{getFieldDecorator('ding', {initialValue: info['ding']})(
<Input placeholder="请输入钉钉机器人地址"/>
)}

12
spug_web/src/pages/alarm/group/Form.js
View File

@ -29,10 +29,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -42,18 +38,18 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="组名称">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="组名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入联系组名称"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入模板备注信息"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="选择联系人">
<Form.Item required label="选择联系人">
{getFieldDecorator('contacts', {valuePropName: 'targetKeys', initialValue: info['contacts']})(
<Transfer
rowKey={item => item.id}

12
spug_web/src/pages/config/environment/Form.js
View File

@ -28,10 +28,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -41,18 +37,18 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="环境名称">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="环境名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入环境名称，例如：开发环境"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="唯一标识符">
<Form.Item required label="唯一标识符">
{getFieldDecorator('key', {initialValue: info['key']})(
<Input placeholder="请输入唯一标识符，例如：dev"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入备注信息"/>
)}

12
spug_web/src/pages/config/service/Form.js
View File

@ -28,10 +28,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -41,18 +37,18 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="服务名称">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="服务名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入服务名称，例如：订单处理服务"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="唯一标识符">
<Form.Item required label="唯一标识符">
{getFieldDecorator('key', {initialValue: info['key']})(
<Input placeholder="请输入唯一标识符，例如：api_order"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入备注信息"/>
)}

14
spug_web/src/pages/config/setting/Form.js
View File

@ -53,10 +53,6 @@ class ComForm extends React.Component {
const info = store.record;
const {envs} = this.state;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -66,23 +62,23 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="Key">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="Key">
{getFieldDecorator('key', {initialValue: info['key']})(
<Input disabled={this.isModify} placeholder="请输入"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="Value">
<Form.Item label="Value">
{getFieldDecorator('value', {initialValue: info['value']})(
<Input.TextArea placeholder="请输入"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="备注">
<Form.Item label="备注">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入备注信息"/>
)}
</Form.Item>
<Form.Item {...itemLayout} label="选择环境">
<Form.Item label="选择环境">
{envStore.records.map((item, index) => (
<Row
key={item.id}

14
spug_web/src/pages/exec/template/Form.js
View File

@ -54,10 +54,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -67,8 +63,8 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="模板类型">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="模板类型">
<Col span={16}>
{getFieldDecorator('type', {initialValue: info['type']})(
<Select placeholder="请选择模板类型">
@ -82,19 +78,19 @@ class ComForm extends React.Component {
<Button type="link" onClick={this.handleAddZone}>添加类型</Button>
</Col>
</Form.Item>
<Form.Item {...itemLayout} required label="模板名称">
<Form.Item required label="模板名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入模板名称"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="模板内容">
<Form.Item required label="模板内容">
<ACEditor
mode="sh"
value={this.state.body}
onChange={val => this.setState({body: val})}
height="300px"/>
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入模板备注信息"/>
)}

12
spug_web/src/pages/host/Form.js
View File

@ -102,8 +102,8 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="主机类别">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="主机类别">
<Col span={16}>
{getFieldDecorator('zone', {initialValue: info['zone']})(
<Select placeholder="请选择主机类别/区域/分组">
@ -117,12 +117,12 @@ class ComForm extends React.Component {
<Button type="link" onClick={this.handleAddZone}>添加类别</Button>
</Col>
</Form.Item>
<Form.Item {...itemLayout} required label="主机别名">
<Form.Item required label="主机别名">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入主机别名"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="连接地址" style={{marginBottom: 0}}>
<Form.Item required label="连接地址" style={{marginBottom: 0}}>
<Form.Item style={{display: 'inline-block', width: 'calc(30%)'}}>
{getFieldDecorator('username', {initialValue: info['username']})(
<Input addonBefore="ssh" placeholder="用户名"/>
@ -139,12 +139,12 @@ class ComForm extends React.Component {
)}
</Form.Item>
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入主机备注信息"/>
)}
</Form.Item>
<Form.Item {...itemTailLayout}>
<Form.Item wrapperCol={{span: 14, offset: 6}}>
<span role="img" aria-label="notice">⚠️ 首次验证时需要输入登录用户名对应的密码，但不会存储该密码。</span>
</Form.Item>
</Form>

42
spug_web/src/pages/monitor/Form.js
View File

@ -60,16 +60,6 @@ class ComForm extends React.Component {
}, () => this.setState({loading: false}))
};
itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
itemTailLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14, offset: 6}
};
getStyle = (t) => {
const type = this.props.form.getFieldValue('type');
return t.indexOf(type) !== -1 ? {display: 'block'} : {display: 'none'}
@ -123,9 +113,9 @@ class ComForm extends React.Component {
<Steps.Step key={0} title="创建任务"/>
<Steps.Step key={1} title="设置规则"/>
</Steps>
<Form>
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<div style={{display: page === 0 ? 'block' : 'none'}}>
<Form.Item {...this.itemLayout} label="监控类型">
<Form.Item label="监控类型">
{getFieldDecorator('type', {initialValue: info['type'] || '1'})(
<Select placeholder="请选择监控类型">
<Select.Option value="1">站点检测</Select.Option>
@ -135,19 +125,19 @@ class ComForm extends React.Component {
</Select>
)}
</Form.Item>
<Form.Item {...this.itemLayout} required label="任务名称">
<Form.Item required label="任务名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入任务名称"/>
)}
</Form.Item>
<Form.Item {...this.itemLayout} required label="监控地址" style={this.getStyle('1')}>
<Form.Item required label="监控地址" style={this.getStyle('1')}>
<Input value={addr['1']} addonBefore={this.siteBefore()} placeholder="请输入监控地址"
onChange={e => this.handleAddr('1', e)}/>
</Form.Item>
<Form.Item {...this.itemLayout} required label="监控地址" style={this.getStyle('2')}>
<Form.Item required label="监控地址" style={this.getStyle('2')}>
<Input value={addr['2']} placeholder="请输入监控地址（IP/域名）" onChange={e => this.handleAddr('2', e)}/>
</Form.Item>
<Form.Item {...this.itemLayout} required label="监控主机" style={this.getStyle('34')}>
<Form.Item required label="监控主机" style={this.getStyle('34')}>
<Select value={addr['3']} placeholder="请选择主机" onChange={v => this.handleAddr('3', v)}>
{hostStore.records.map(item => (
<Select.Option value={String(item.id)}
@ -155,24 +145,24 @@ class ComForm extends React.Component {
))}
</Select>
</Form.Item>
<Form.Item {...this.itemLayout} required label="检测端口" style={this.getStyle('2')}>
<Form.Item required label="检测端口" style={this.getStyle('2')}>
<Input value={extra['2']} placeholder="请输入端口号" onChange={e => this.handleExtra('2', e)}/>
</Form.Item>
<Form.Item {...this.itemLayout} required label="进程名称" style={this.getStyle('3')}>
<Form.Item required label="进程名称" style={this.getStyle('3')}>
<Input value={extra['3']} placeholder="请输入进程名称" onChange={e => this.handleExtra('3', e)}/>
</Form.Item>
<Form.Item {...this.itemLayout} required label="脚本内容" style={this.getStyle('4')}
<Form.Item required label="脚本内容" style={this.getStyle('4')}
extra={<LinkButton onClick={() => this.setState({showTmp: true})}>从模板添加</LinkButton>}>
<ACEditor mode="sh" value={extra['4']} height="200px" onChange={e => this.handleExtra('4', e)}/>
</Form.Item>
<Form.Item {...this.itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入备注信息"/>
)}
</Form.Item>
</div>
<div style={{display: page === 1 ? 'block' : 'none'}}>
<Form.Item {...this.itemLayout} label="监控频率">
<Form.Item label="监控频率">
{getFieldDecorator('rate', {initialValue: info['rate'] || 5})(
<Radio.Group>
<Radio value={1}>1分钟</Radio>
@ -183,7 +173,7 @@ class ComForm extends React.Component {
</Radio.Group>
)}
</Form.Item>
<Form.Item {...this.itemLayout} label="报警阈值">
<Form.Item label="报警阈值">
{getFieldDecorator('threshold', {initialValue: info['threshold'] || 3})(
<Radio.Group>
<Radio value={1}>1次</Radio>
@ -194,7 +184,7 @@ class ComForm extends React.Component {
</Radio.Group>
)}
</Form.Item>
<Form.Item {...this.itemLayout} required label="报警联系人组">
<Form.Item required label="报警联系人组">
{getFieldDecorator('notify_grp', {valuePropName: 'targetKeys', initialValue: info['notify_grp']})(
<Transfer
lazy={false}
@ -205,12 +195,12 @@ class ComForm extends React.Component {
render={item => item.name}/>
)}
</Form.Item>
<Form.Item {...this.itemLayout} required label="报警方式">
<Form.Item required label="报警方式">
{getFieldDecorator('notify_mode', {initialValue: info['notify_mode']})(
<Checkbox.Group options={modeOptions}/>
)}
</Form.Item>
<Form.Item {...this.itemLayout} label="通道沉默">
<Form.Item label="通道沉默">
{getFieldDecorator('quiet', {initialValue: info['quiet'] || 24 * 60})(
<Select placeholder="请选择">
<Select.Option value={5}>5分钟</Select.Option>
@ -226,7 +216,7 @@ class ComForm extends React.Component {
)}
</Form.Item>
</div>
<Form.Item {...this.itemTailLayout}>
<Form.Item wrapperCol={{span: 14, offset: 6}}>
{page === 1 &&
<Button disabled={!b2} type="primary" onClick={this.handleSubmit} loading={loading}>提交</Button>}
{page === 0 &&

27
spug_web/src/pages/schedule/Form.js
View File

@ -101,14 +101,6 @@ class ComForm extends React.Component {
const {getFieldDecorator} = this.props.form;
const {page, args, loading, showTmp} = this.state;
const [b1, b2, b3] = this.verifyButtonStatus();
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
const itemTailLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14, offset: 6}
};
return (
<Modal
visible
@ -123,9 +115,9 @@ class ComForm extends React.Component {
<Steps.Step key={1} title="选择执行对象"/>
<Steps.Step key={2} title="设置触发器"/>
</Steps>
<Form>
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<div style={{display: page === 0 ? 'block' : 'none'}}>
<Form.Item {...itemLayout} required label="任务类型">
<Form.Item required label="任务类型">
<Col span={16}>
{getFieldDecorator('type', {initialValue: info['type']})(
<Select placeholder="请选择任务类型">
@ -139,13 +131,12 @@ class ComForm extends React.Component {
<Button type="link" onClick={this.handleAddZone}>添加类型</Button>
</Col>
</Form.Item>
<Form.Item {...itemLayout} required label="任务名称">
<Form.Item required label="任务名称">
{getFieldDecorator('name', {initialValue: info['name']})(
<Input placeholder="请输入任务名称"/>
)}
</Form.Item>
<Form.Item
{...itemLayout}
required
label="任务内容"
extra={<LinkButton onClick={() => this.setState({showTmp: true})}>从模板添加</LinkButton>}>
@ -153,16 +144,16 @@ class ComForm extends React.Component {
mode="sh"
value={this.state.command}
onChange={val => this.setState({command: val})}
height="200px"/>
height="150px"/>
</Form.Item>
<Form.Item {...itemLayout} label="备注信息">
<Form.Item label="备注信息">
{getFieldDecorator('desc', {initialValue: info['desc']})(
<Input.TextArea placeholder="请输入模板备注信息"/>
)}
</Form.Item>
</div>
<div style={{minHeight: 224, display: page === 1 ? 'block' : 'none'}}>
<Form.Item {...itemLayout} required label="执行对象">
<Form.Item required label="执行对象">
{store.targets.map((id, index) => (
<React.Fragment key={index}>
<Select
@ -183,14 +174,14 @@ class ComForm extends React.Component {
</React.Fragment>
))}
</Form.Item>
<Form.Item {...itemTailLayout}>
<Form.Item wrapperCol={{span: 14, offset: 6}}>
<Button type="dashed" style={{width: '60%'}} onClick={store.addTarget}>
<Icon type="plus"/>添加执行对象
</Button>
</Form.Item>
</div>
<div style={{display: page === 2 ? 'block' : 'none'}}>
<Form.Item {...itemTailLayout}>
<Form.Item wrapperCol={{span: 14, offset: 6}}>
{getFieldDecorator('trigger', {valuePropName: 'activeKey', initialValue: info['trigger'] || 'interval'})(
<Tabs tabPosition="left" style={{minHeight: 200}}>
<Tabs.TabPane tab="普通间隔" key="interval">
@ -222,7 +213,7 @@ class ComForm extends React.Component {
)}
</Form.Item>
</div>
<Form.Item {...itemTailLayout}>
<Form.Item wrapperCol={{span: 14, offset: 6}}>
{page === 2 &&
<Button disabled={!b3} type="primary" onClick={this.handleSubmit} loading={loading}>提交</Button>}
{page === 0 &&

12
spug_web/src/pages/system/account/Form.js
View File

@ -26,10 +26,6 @@ class ComForm extends React.Component {
render() {
const info = store.record;
const {getFieldDecorator} = this.props.form;
const itemLayout = {
labelCol: {span: 6},
wrapperCol: {span: 14}
};
return (
<Modal
visible
@ -38,18 +34,18 @@ class ComForm extends React.Component {
onCancel={() => store.formVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form>
<Form.Item {...itemLayout} required label="登录名">
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="登录名">
{getFieldDecorator('username', {initialValue: info['username']})(
<Input placeholder="请输入登录名"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="姓名">
<Form.Item required label="姓名">
{getFieldDecorator('nickname', {initialValue: info['nickname']})(
<Input placeholder="请输入姓名"/>
)}
</Form.Item>
<Form.Item {...itemLayout} required label="密码">
<Form.Item required label="密码">
{getFieldDecorator('password', {initialValue: info.id ? '******' : undefined})(
<Input type="password" placeholder="请输入密码"/>
)}