Skip to content

D
dlink
Unverified Commit 02e300f0 authored by zhu-mingye's avatar zhu-mingye Committed by GitHub
Browse files
Options

[optimization][web] Frontend code optimization (#1102) 

* [Feature][*] Modify version into 0.6.8-SNAPSHOT

* Frontend code optimization
parent d76ccd50
Show whitespace changes
Inline Side-by-side
Showing with 627 additions and 614 deletions
dlink-web/src/pages/AlertGroup/index.tsx
View file @ 02e300f0
...@@ -175,7 +175,7 @@ const AlertGroupTableList: React.FC<{}> = (props: any) => { ...@@ -175,7 +175,7 @@ const AlertGroupTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<AlertGroupTableListItem> <ProTable<AlertGroupTableListItem>
headerTitle="报警组管理" headerTitle="报警组管理"
actionRef={actionRef} actionRef={actionRef}
...@@ -290,7 +290,7 @@ const AlertGroupTableList: React.FC<{}> = (props: any) => { ...@@ -290,7 +290,7 @@ const AlertGroupTableList: React.FC<{}> = (props: any) => {
modalVisible={updateModalVisible} modalVisible={updateModalVisible}
values={formValues} values={formValues}
/> />
): null} ) : null}
<Drawer <Drawer
width={600} width={600}
visible={!!row} visible={!!row}
......
dlink-web/src/pages/AlertInstance/components/AlertInstanceChooseForm.tsx
View file @ 02e300f0
...@@ -50,11 +50,11 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -50,11 +50,11 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
const [alertType, setAlertType] = useState<string>(); const [alertType, setAlertType] = useState<string>();
const chooseOne = (item: AlertConfig)=>{ const chooseOne = (item: AlertConfig) => {
setAlertType(item.type); setAlertType(item.type);
}; };
const onSubmit = async (value: any)=>{ const onSubmit = async (value: any) => {
const success = await createOrModifyAlertInstance(value); const success = await createOrModifyAlertInstance(value);
if (success) { if (success) {
handleChooseModalVisible(); handleChooseModalVisible();
...@@ -63,26 +63,26 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -63,26 +63,26 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
} }
}; };
const onTest = async (value:any)=>{ const onTest = async (value: any) => {
await sendTest(value); await sendTest(value);
}; };
return ( return (
<Modal <Modal
width={800} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
title={values?.id?'编辑报警实例':'创建报警实例'} title={values?.id ? '编辑报警实例' : '创建报警实例'}
visible={modalVisible} visible={modalVisible}
onCancel={() => { onCancel={() => {
setAlertType(undefined); setAlertType(undefined);
handleChooseModalVisible(); handleChooseModalVisible();
}} }}
maskClosable = {false} maskClosable={false}
destroyOnClose = {true} destroyOnClose={true}
footer={null} footer={null}
>{ >{
(!alertType&&!values?.id)&&(<List (!alertType && !values?.id) && (<List
grid={{ grid={{
gutter: 16, gutter: 16,
xs: 1, xs: 1,
...@@ -93,8 +93,10 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -93,8 +93,10 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
xxl: 4, xxl: 4,
}} }}
dataSource={ALERT_CONFIG_LIST} dataSource={ALERT_CONFIG_LIST}
renderItem={(item:AlertConfig) => ( renderItem={(item: AlertConfig) => (
<List.Item onClick={()=>{chooseOne(item)}}> <List.Item onClick={() => {
chooseOne(item)
}}>
<Card> <Card>
{getAlertIcon(item.type)} {getAlertIcon(item.type)}
</Card> </Card>
...@@ -102,7 +104,7 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -102,7 +104,7 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
)} )}
/>) />)
} }
{(values?.type == ALERT_TYPE.DINGTALK || alertType == ALERT_TYPE.DINGTALK)? {(values?.type == ALERT_TYPE.DINGTALK || alertType == ALERT_TYPE.DINGTALK) ?
<DingTalkForm <DingTalkForm
onCancel={() => { onCancel={() => {
setAlertType(undefined); setAlertType(undefined);
...@@ -116,9 +118,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -116,9 +118,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
onTest={(value) => { onTest={(value) => {
onTest(value); onTest(value);
}} }}
/>:undefined /> : undefined
} }
{(values?.type == ALERT_TYPE.WECHAT || alertType == ALERT_TYPE.WECHAT)? {(values?.type == ALERT_TYPE.WECHAT || alertType == ALERT_TYPE.WECHAT) ?
<WeChatForm <WeChatForm
onCancel={() => { onCancel={() => {
setAlertType(undefined); setAlertType(undefined);
...@@ -132,9 +134,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -132,9 +134,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
onTest={(value) => { onTest={(value) => {
onTest(value); onTest(value);
}} }}
/>:undefined /> : undefined
} }
{(values?.type == ALERT_TYPE.FEISHU || alertType == ALERT_TYPE.FEISHU)? {(values?.type == ALERT_TYPE.FEISHU || alertType == ALERT_TYPE.FEISHU) ?
<FeiShuForm <FeiShuForm
onCancel={() => { onCancel={() => {
setAlertType(undefined); setAlertType(undefined);
...@@ -148,9 +150,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -148,9 +150,9 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
onTest={(value) => { onTest={(value) => {
onTest(value); onTest(value);
}} }}
/>:undefined /> : undefined
} }
{(values?.type == ALERT_TYPE.EMAIL || alertType == ALERT_TYPE.EMAIL)? {(values?.type == ALERT_TYPE.EMAIL || alertType == ALERT_TYPE.EMAIL) ?
<EmailForm <EmailForm
onCancel={() => { onCancel={() => {
setAlertType(undefined); setAlertType(undefined);
...@@ -164,7 +166,7 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => { ...@@ -164,7 +166,7 @@ const AlertInstanceChooseForm: React.FC<UpdateFormProps> = (props) => {
onTest={(value) => { onTest={(value) => {
onTest(value); onTest(value);
}} }}
/>:undefined /> : undefined
} }
</Modal> </Modal>
); );
......
dlink-web/src/pages/AlertInstance/components/DingTalkForm.tsx
View file @ 02e300f0
...@@ -55,20 +55,20 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -55,20 +55,20 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => {
modalVisible, modalVisible,
} = props; } = props;
const onValuesChange = (change: any,all: any)=>{ const onValuesChange = (change: any, all: any) => {
setFormVals({...formVals,...change}); setFormVals({...formVals, ...change});
}; };
const sendTestForm = async () => { const sendTestForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleTest(buildJSONData(formVals,fieldsValue)); handleTest(buildJSONData(formVals, fieldsValue));
}; };
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleSubmit(buildJSONData(formVals,fieldsValue)); handleSubmit(buildJSONData(formVals, fieldsValue));
}; };
const renderContent = (vals) => { const renderContent = (vals) => {
...@@ -107,7 +107,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -107,7 +107,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => {
<Switch checkedChildren="是" unCheckedChildren="否" <Switch checkedChildren="是" unCheckedChildren="否"
defaultChecked={vals.isEnableProxy}/> defaultChecked={vals.isEnableProxy}/>
</Form.Item> </Form.Item>
{vals.isEnableProxy?<> {vals.isEnableProxy ? <>
<Form.Item <Form.Item
name="proxy" name="proxy"
label="代理" label="代理"
...@@ -131,7 +131,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -131,7 +131,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => {
label="密码" label="密码"
> >
<Input.Password placeholder="请输入password"/> <Input.Password placeholder="请输入password"/>
</Form.Item></>:undefined </Form.Item></> : undefined
} }
<Form.Item <Form.Item
name="isAtAll" name="isAtAll"
...@@ -162,7 +162,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -162,7 +162,7 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => {
label="展示方式" label="展示方式"
rules={[{required: true, message: '请选择展示方式！'}]} rules={[{required: true, message: '请选择展示方式！'}]}
> >
<Radio.Group > <Radio.Group>
<Radio value='markdown'>MarkDown</Radio> <Radio value='markdown'>MarkDown</Radio>
<Radio value='text'>文本</Radio> <Radio value='text'>文本</Radio>
</Radio.Group> </Radio.Group>
...@@ -186,10 +186,10 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -186,10 +186,10 @@ const DingTalkForm: React.FC<AlertInstanceFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护报警实例配置":"创建报警实例配置"} title={formVals.id ? "维护报警实例配置" : "创建报警实例配置"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/AlertInstance/components/EmailForm.tsx
View file @ 02e300f0
...@@ -55,20 +55,20 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -55,20 +55,20 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
modalVisible, modalVisible,
} = props; } = props;
const onValuesChange = (change: any,all: any)=>{ const onValuesChange = (change: any, all: any) => {
setFormVals({...formVals,...change}); setFormVals({...formVals, ...change});
}; };
const sendTestForm = async () => { const sendTestForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleTest(buildJSONData(formVals,fieldsValue)); handleTest(buildJSONData(formVals, fieldsValue));
}; };
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleSubmit(buildJSONData(formVals,fieldsValue)); handleSubmit(buildJSONData(formVals, fieldsValue));
}; };
...@@ -88,13 +88,15 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -88,13 +88,15 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
label="收件人" label="收件人"
rules={[{required: true, message: '请输入收件人邮箱！多个英文逗号隔开'}]} rules={[{required: true, message: '请输入收件人邮箱！多个英文逗号隔开'}]}
> >
<Input.TextArea placeholder="请输入收件人邮箱！多个英文逗号隔开!" allowClear autoSize={{minRows: 1, maxRows: 5}}/> <Input.TextArea placeholder="请输入收件人邮箱！多个英文逗号隔开!" allowClear
autoSize={{minRows: 1, maxRows: 5}}/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="receiverCcs" name="receiverCcs"
label="抄送人" label="抄送人"
> >
<Input.TextArea placeholder="请输入抄送人邮箱！多个英文逗号隔开!" allowClear autoSize={{minRows: 1, maxRows: 5}}/> <Input.TextArea placeholder="请输入抄送人邮箱！多个英文逗号隔开!" allowClear
autoSize={{minRows: 1, maxRows: 5}}/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="serverHost" name="serverHost"
...@@ -155,7 +157,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -155,7 +157,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
<Switch checkedChildren="是" unCheckedChildren="否" <Switch checkedChildren="是" unCheckedChildren="否"
defaultChecked={vals.sslEnable}/> defaultChecked={vals.sslEnable}/>
</Form.Item> </Form.Item>
{ ( vals.sslEnable ) && {(vals.sslEnable) &&
<Form.Item <Form.Item
name="smtpSslTrust" name="smtpSslTrust"
label="受信任域" label="受信任域"
...@@ -175,7 +177,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -175,7 +177,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
label="展示方式" label="展示方式"
rules={[{required: true, message: '请选择展示方式！'}]} rules={[{required: true, message: '请选择展示方式！'}]}
> >
<Radio.Group > <Radio.Group>
<Radio value='text'>文本</Radio> <Radio value='text'>文本</Radio>
<Radio value='table'>表格</Radio> <Radio value='table'>表格</Radio>
<Radio value='attachment'>附件</Radio> <Radio value='attachment'>附件</Radio>
...@@ -191,7 +193,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -191,7 +193,7 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
<Input allowClear placeholder="请输入XLS存放目录! 默认为 /tmp/xls"/> <Input allowClear placeholder="请输入XLS存放目录! 默认为 /tmp/xls"/>
</Form.Item> </Form.Item>
</> } </>}
</> </>
); );
...@@ -212,10 +214,10 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -212,10 +214,10 @@ const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护报警实例配置":"创建报警实例配置"} title={formVals.id ? "维护报警实例配置" : "创建报警实例配置"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/AlertInstance/components/FeiShuForm.tsx
View file @ 02e300f0
...@@ -55,20 +55,20 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -55,20 +55,20 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
modalVisible, modalVisible,
} = props; } = props;
const onValuesChange = (change: any,all: any)=>{ const onValuesChange = (change: any, all: any) => {
setFormVals({...formVals,...change}); setFormVals({...formVals, ...change});
}; };
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleSubmit(buildJSONData(formVals,fieldsValue)); handleSubmit(buildJSONData(formVals, fieldsValue));
}; };
const sendTestForm = async () => { const sendTestForm = async () => {
const fieldsValue = await form.getFieldsValue(); const fieldsValue = await form.getFieldsValue();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleTest(buildJSONData(formVals,fieldsValue)); handleTest(buildJSONData(formVals, fieldsValue));
}; };
const renderContent = (vals) => { const renderContent = (vals) => {
...@@ -107,7 +107,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -107,7 +107,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
<Switch checkedChildren="是" unCheckedChildren="否" <Switch checkedChildren="是" unCheckedChildren="否"
defaultChecked={vals.isEnableProxy}/> defaultChecked={vals.isEnableProxy}/>
</Form.Item> </Form.Item>
{vals.isEnableProxy?<> {vals.isEnableProxy ? <>
<Form.Item <Form.Item
name="proxy" name="proxy"
label="代理" label="代理"
...@@ -131,7 +131,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -131,7 +131,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
label="密码" label="密码"
> >
<Input.Password placeholder="请输入password"/> <Input.Password placeholder="请输入password"/>
</Form.Item></>:undefined </Form.Item></> : undefined
} }
<Form.Item <Form.Item
name="isAtAll" name="isAtAll"
...@@ -139,7 +139,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -139,7 +139,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
<Switch checkedChildren="启用" unCheckedChildren="禁用" <Switch checkedChildren="启用" unCheckedChildren="禁用"
defaultChecked={vals.isAtAll}/> defaultChecked={vals.isAtAll}/>
</Form.Item> </Form.Item>
{ ( !vals.isAtAll )&& {(!vals.isAtAll) &&
<Form.Item <Form.Item
name="users" name="users"
label="被@用户" label="被@用户"
...@@ -159,7 +159,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -159,7 +159,7 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
label="展示方式" label="展示方式"
rules={[{required: true, message: '请选择展示方式！'}]} rules={[{required: true, message: '请选择展示方式！'}]}
> >
<Radio.Group > <Radio.Group>
<Radio value='post'>富文本</Radio> <Radio value='post'>富文本</Radio>
<Radio value='text'>文本</Radio> <Radio value='text'>文本</Radio>
</Radio.Group> </Radio.Group>
...@@ -183,10 +183,10 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -183,10 +183,10 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护报警实例配置":"创建报警实例配置"} title={formVals.id ? "维护报警实例配置" : "创建报警实例配置"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/AlertInstance/components/WeChatForm.tsx
View file @ 02e300f0
...@@ -55,19 +55,19 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -55,19 +55,19 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => {
modalVisible, modalVisible,
} = props; } = props;
const onValuesChange = (change: any,all: any)=>{ const onValuesChange = (change: any, all: any) => {
setFormVals({...formVals,...change}); setFormVals({...formVals, ...change});
}; };
const sendTestForm = async () => { const sendTestForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleTest(buildJSONData(formVals,fieldsValue)); handleTest(buildJSONData(formVals, fieldsValue));
}; };
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals(buildJSONData(formVals,fieldsValue)); setFormVals(buildJSONData(formVals, fieldsValue));
handleSubmit(buildJSONData(formVals,fieldsValue)); handleSubmit(buildJSONData(formVals, fieldsValue));
}; };
const renderContent = (vals) => { const renderContent = (vals) => {
...@@ -92,7 +92,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -92,7 +92,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => {
<Radio value='群聊'>群聊</Radio> <Radio value='群聊'>群聊</Radio>
</Radio.Group> </Radio.Group>
</Form.Item> </Form.Item>
{ (vals.sendType == "群聊") ? {(vals.sendType == "群聊") ?
<> <>
<Form.Item <Form.Item
name="webhook" name="webhook"
...@@ -114,7 +114,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -114,7 +114,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => {
<Switch checkedChildren="启用" unCheckedChildren="禁用" <Switch checkedChildren="启用" unCheckedChildren="禁用"
defaultChecked={vals.isAtAll}/> defaultChecked={vals.isAtAll}/>
</Form.Item> </Form.Item>
{ ( !vals.isAtAll )&& {(!vals.isAtAll) &&
<Form.Item <Form.Item
name="users" name="users"
label="被@用户" label="被@用户"
...@@ -161,7 +161,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -161,7 +161,7 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => {
label="展示方式" label="展示方式"
rules={[{required: true, message: '请选择展示方式！'}]} rules={[{required: true, message: '请选择展示方式！'}]}
> >
<Radio.Group > <Radio.Group>
<Radio value='markdown'>MarkDown</Radio> <Radio value='markdown'>MarkDown</Radio>
<Radio value='text'>文本</Radio> <Radio value='text'>文本</Radio>
</Radio.Group> </Radio.Group>
...@@ -192,10 +192,10 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => { ...@@ -192,10 +192,10 @@ const WeChatForm: React.FC<AlertInstanceFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护报警实例配置":"创建报警实例配置"} title={formVals.id ? "维护报警实例配置" : "创建报警实例配置"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/AlertInstance/index.tsx
View file @ 02e300f0
...@@ -64,13 +64,13 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => { ...@@ -64,13 +64,13 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => {
<Menu.Item key="edit">编辑</Menu.Item> <Menu.Item key="edit">编辑</Menu.Item>
<Menu.Item key="delete">删除</Menu.Item> <Menu.Item key="delete">删除</Menu.Item>
</Menu> </Menu>
} }
> >
<a> <a>
更多 <DownOutlined/> 更多 <DownOutlined/>
</a> </a>
</Dropdown> </Dropdown>
); );
const columns: ProColumns<AlertInstanceTableListItem>[] = [ const columns: ProColumns<AlertInstanceTableListItem>[] = [
{ {
...@@ -108,13 +108,13 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => { ...@@ -108,13 +108,13 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => {
{ {
text: 'DingTalk', text: 'DingTalk',
value: 'DingTalk', value: 'DingTalk',
},{ }, {
text: 'WeChat', text: 'WeChat',
value: 'WeChat', value: 'WeChat',
},{ }, {
text: 'FeiShu', text: 'FeiShu',
value: 'FeiShu', value: 'FeiShu',
},{ }, {
text: 'Email', text: 'Email',
value: 'Email', value: 'Email',
} }
...@@ -179,16 +179,16 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => { ...@@ -179,16 +179,16 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => {
handleModalVisible(true); handleModalVisible(true);
setValues(record); setValues(record);
}} }}
> >
配置 配置
</a>, </a>,
<MoreBtn key="more" item={record}/>, <MoreBtn key="more" item={record}/>,
], ],
}, },
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<AlertInstanceTableListItem> <ProTable<AlertInstanceTableListItem>
headerTitle="报警实例管理" headerTitle="报警实例管理"
actionRef={actionRef} actionRef={actionRef}
...@@ -200,7 +200,7 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => { ...@@ -200,7 +200,7 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => {
<Button type="primary" onClick={() => handleModalVisible(true)}> <Button type="primary" onClick={() => handleModalVisible(true)}>
<PlusOutlined/> 新建 <PlusOutlined/> 新建
</Button>, </Button>,
]} ]}
request={(params, sorter, filter) => queryData(url, {...params, sorter, filter})} request={(params, sorter, filter) => queryData(url, {...params, sorter, filter})}
columns={columns} columns={columns}
rowSelection={{ rowSelection={{
...@@ -297,10 +297,10 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => { ...@@ -297,10 +297,10 @@ const AlertInstanceTableList: React.FC<{}> = (props: any) => {
}} }}
columns={columns} columns={columns}
/> />
)} )}
</Drawer> </Drawer>
</PageContainer> </PageContainer>
); );
}; };
export default AlertInstanceTableList; export default AlertInstanceTableList;
dlink-web/src/pages/AuthenticationCenter/NamespaceManager/components/NameSpaceForm.tsx
View file @ 02e300f0
...@@ -111,7 +111,7 @@ const NameSpaceForm: React.FC<TenantFormProps> = (props) => { ...@@ -111,7 +111,7 @@ const NameSpaceForm: React.FC<TenantFormProps> = (props) => {
return ( return (
<Modal <Modal
width={640} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id ? l('pages.nameSpace.update') : l('pages.nameSpace.create')} title={formVals.id ? l('pages.nameSpace.update') : l('pages.nameSpace.create')}
......
dlink-web/src/pages/AuthenticationCenter/RoleManager/components/RoleForm.tsx
View file @ 02e300f0
...@@ -148,7 +148,7 @@ const RoleForm: React.FC<TenantFormProps> = (props) => { ...@@ -148,7 +148,7 @@ const RoleForm: React.FC<TenantFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1000} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id ? l('pages.role.update') : l('pages.role.create')} title={formVals.id ? l('pages.role.update') : l('pages.role.create')}
......
dlink-web/src/pages/AuthenticationCenter/TenantManager/components/TenantForm.tsx
View file @ 02e300f0
...@@ -97,7 +97,7 @@ const TenantForm: React.FC<TenantFormProps> = (props) => { ...@@ -97,7 +97,7 @@ const TenantForm: React.FC<TenantFormProps> = (props) => {
return ( return (
<Modal <Modal
width={640} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id ? intl.formatMessage({id: 'pages.tenant.update'}) : intl.formatMessage({id: 'pages.tenant.create'})} title={formVals.id ? intl.formatMessage({id: 'pages.tenant.update'}) : intl.formatMessage({id: 'pages.tenant.create'})}
......
dlink-web/src/pages/AuthenticationCenter/TenantManager/index.tsx
View file @ 02e300f0
...@@ -84,7 +84,7 @@ const TenantFormList: React.FC<{}> = (props: any) => { ...@@ -84,7 +84,7 @@ const TenantFormList: React.FC<{}> = (props: any) => {
const handleGrantTenantForm = () => { const handleGrantTenantForm = () => {
return ( return (
<Modal title={l('pages.tenant.AssignUser')} visible={handleGrantTenant} <Modal title={l('pages.tenant.AssignUser')} visible={handleGrantTenant}
destroyOnClose={true} width={"1500px"} destroyOnClose={true} width={"90%"}
onCancel={() => { onCancel={() => {
setHandleGrantTenant(false); setHandleGrantTenant(false);
}} }}
......
dlink-web/src/pages/AuthenticationCenter/UserManager/components/PasswordForm.tsx
View file @ 02e300f0
...@@ -114,7 +114,7 @@ const PasswordForm: React.FC<PasswordFormProps> = (props) => { ...@@ -114,7 +114,7 @@ const PasswordForm: React.FC<PasswordFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={l('button.changePassword')} title={l('button.changePassword')}
......
dlink-web/src/pages/AuthenticationCenter/UserManager/components/UserForm.tsx
View file @ 02e300f0
...@@ -122,7 +122,7 @@ const UserForm: React.FC<UserFormProps> = (props) => { ...@@ -122,7 +122,7 @@ const UserForm: React.FC<UserFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id ? l('pages.user.UserUpdateUser') : l('pages.user.UserCreateUser')} title={formVals.id ? l('pages.user.UserUpdateUser') : l('pages.user.UserCreateUser')}
......
dlink-web/src/pages/AuthenticationCenter/UserManager/index.tsx
View file @ 02e300f0
...@@ -89,7 +89,7 @@ const UserTableList: React.FC<{}> = (props: any) => { ...@@ -89,7 +89,7 @@ const UserTableList: React.FC<{}> = (props: any) => {
const handleGrantRoleForm = () => { const handleGrantRoleForm = () => {
return ( return (
<Modal title={l('pages.user.AssignRole')} visible={handleGrantRole} destroyOnClose={true} width={"1500px"} <Modal title={l('pages.user.AssignRole')} visible={handleGrantRole} destroyOnClose={true} width={"90%"}
onCancel={() => { onCancel={() => {
setHandleGrantRole(false); setHandleGrantRole(false);
}} }}
......
dlink-web/src/pages/Cluster/components/ClusterForm.tsx
View file @ 02e300f0
...@@ -18,8 +18,8 @@ ...@@ -18,8 +18,8 @@
*/ */
import React, {useEffect, useState} from 'react'; import React, {useState} from 'react';
import {Form, Button, Input, Modal, Select, Switch} from 'antd'; import {Button, Form, Input, Modal, Select, Switch} from 'antd';
import {ClusterTableListItem} from "@/pages/Cluster/data"; import {ClusterTableListItem} from "@/pages/Cluster/data";
import {RUN_MODE} from "@/components/Studio/conf"; import {RUN_MODE} from "@/components/Studio/conf";
...@@ -154,7 +154,7 @@ const ClusterForm: React.FC<ClusterFormProps> = (props) => { ...@@ -154,7 +154,7 @@ const ClusterForm: React.FC<ClusterFormProps> = (props) => {
return ( return (
<Modal <Modal
width={640} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id ? "修改集群" : "创建集群"} title={formVals.id ? "修改集群" : "创建集群"}
......
dlink-web/src/pages/Cluster/index.tsx
View file @ 02e300f0
...@@ -40,13 +40,12 @@ import { ...@@ -40,13 +40,12 @@ import {
import {showCluster, showSessionCluster} from "@/components/Studio/StudioEvent/DDL"; import {showCluster, showSessionCluster} from "@/components/Studio/StudioEvent/DDL";
import {RUN_MODE} from "@/components/Studio/conf"; import {RUN_MODE} from "@/components/Studio/conf";
import ClusterForm from "@/pages/Cluster/components/ClusterForm"; import ClusterForm from "@/pages/Cluster/components/ClusterForm";
import { useIntl } from 'umi'; import {useIntl} from 'umi';
const TextArea = Input.TextArea; const TextArea = Input.TextArea;
const url = '/api/cluster'; const url = '/api/cluster';
const ClusterTableList: React.FC<{}> = (props: any) => { const ClusterTableList: React.FC<{}> = (props: any) => {
const intl = useIntl(); const intl = useIntl();
const {dispatch} = props; const {dispatch} = props;
...@@ -195,7 +194,9 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -195,7 +194,9 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
hideInSearch: true, hideInSearch: true,
hideInTable: true, hideInTable: true,
renderFormItem: (item, {defaultRender, ...rest}, form) => { renderFormItem: (item, {defaultRender, ...rest}, form) => {
return <TextArea placeholder="添加 Flink 集群的 JobManager 的 RestApi 地址。当 HA 模式时，地址间用英文逗号分隔，例如：192.168.123.101:8081,192.168.123.102:8081,192.168.123.103:8081" allowClear autoSize={{ minRows: 3, maxRows: 10 }}/>; return <TextArea
placeholder="添加 Flink 集群的 JobManager 的 RestApi 地址。当 HA 模式时，地址间用英文逗号分隔，例如：192.168.123.101:8081,192.168.123.102:8081,192.168.123.103:8081"
allowClear autoSize={{minRows: 3, maxRows: 10}}/>;
}, },
}, },
{ {
...@@ -205,7 +206,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -205,7 +206,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
hideInForm: true, hideInForm: true,
hideInSearch: true, hideInSearch: true,
hideInTable: false, hideInTable: false,
},{ }, {
title: intl.formatMessage({id: 'global.table.version', defaultMessage: '版本',}), title: intl.formatMessage({id: 'global.table.version', defaultMessage: '版本',}),
sorter: true, sorter: true,
dataIndex: 'version', dataIndex: 'version',
...@@ -263,7 +264,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -263,7 +264,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
filterMultiple: false, filterMultiple: false,
valueEnum: { valueEnum: {
true: {text: intl.formatMessage({id: 'global.table.inUse', defaultMessage: '已启用',}), status: 'Success'}, true: {text: intl.formatMessage({id: 'global.table.inUse', defaultMessage: '已启用',}), status: 'Success'},
false:{text: intl.formatMessage({id: 'global.table.notUse', defaultMessage: '已禁用',}), status: 'Error'}, false: {text: intl.formatMessage({id: 'global.table.notUse', defaultMessage: '已禁用',}), status: 'Error'},
}, },
}, },
{ {
...@@ -284,8 +285,14 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -284,8 +285,14 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
], ],
filterMultiple: false, filterMultiple: false,
valueEnum: { valueEnum: {
true: {text: intl.formatMessage({id: 'global.table.registType.automatic', defaultMessage: '自动',}), status: 'Success'}, true: {
false: {text: intl.formatMessage({id: 'global.table.registType.manual', defaultMessage: '手动',}), status: 'Error'}, text: intl.formatMessage({id: 'global.table.registType.automatic', defaultMessage: '自动',}),
status: 'Success'
},
false: {
text: intl.formatMessage({id: 'global.table.registType.manual', defaultMessage: '手动',}),
status: 'Error'
},
}, },
}, },
{ {
...@@ -358,7 +365,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -358,7 +365,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<ClusterTableListItem> <ProTable<ClusterTableListItem>
headerTitle={intl.formatMessage({id: 'global.table.clusterManagement', defaultMessage: '集群管理',})} headerTitle={intl.formatMessage({id: 'global.table.clusterManagement', defaultMessage: '集群管理',})}
actionRef={actionRef} actionRef={actionRef}
...@@ -374,7 +381,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -374,7 +381,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
<HeartOutlined/> {intl.formatMessage({id: 'global.table.heartbeat', defaultMessage: '心跳',})} <HeartOutlined/> {intl.formatMessage({id: 'global.table.heartbeat', defaultMessage: '心跳',})}
</Button>, </Button>,
<Button type="primary" onClick={() => clearCluster()}> <Button type="primary" onClick={() => clearCluster()}>
<ClearOutlined /> {intl.formatMessage({id: 'global.table.recycle', defaultMessage: '回收',})} <ClearOutlined/> {intl.formatMessage({id: 'global.table.recycle', defaultMessage: '回收',})}
</Button>, </Button>,
]} ]}
request={(params, sorter, filter) => queryData(url, {...params, sorter, filter})} request={(params, sorter, filter) => queryData(url, {...params, sorter, filter})}
...@@ -419,7 +426,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -419,7 +426,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
okText: '确认', okText: '确认',
cancelText: '取消', cancelText: '取消',
onOk: async () => { onOk: async () => {
await updateEnabled(url+'/enable', selectedRowsState, true); await updateEnabled(url + '/enable', selectedRowsState, true);
setSelectedRows([]); setSelectedRows([]);
actionRef.current?.reloadAndRest?.(); actionRef.current?.reloadAndRest?.();
} }
...@@ -434,7 +441,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -434,7 +441,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
okText: '确认', okText: '确认',
cancelText: '取消', cancelText: '取消',
onOk: async () => { onOk: async () => {
await updateEnabled(url+'/enable', selectedRowsState, false); await updateEnabled(url + '/enable', selectedRowsState, false);
setSelectedRows([]); setSelectedRows([]);
actionRef.current?.reloadAndRest?.(); actionRef.current?.reloadAndRest?.();
} }
...@@ -507,7 +514,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => { ...@@ -507,7 +514,7 @@ const ClusterTableList: React.FC<{}> = (props: any) => {
)} )}
</Drawer> </Drawer>
</PageContainer> </PageContainer>
); );
}; };
export default ClusterTableList; export default ClusterTableList;
dlink-web/src/pages/ClusterConfiguration/components/ClusterConfigurationForm.tsx
View file @ 02e300f0
...@@ -376,8 +376,8 @@ const ClusterConfigurationForm: React.FC<ClusterConfigurationFormProps> = (props ...@@ -376,8 +376,8 @@ const ClusterConfigurationForm: React.FC<ClusterConfigurationFormProps> = (props
return ( return (
<Modal <Modal
width={1200} width={"60%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px', height: '600px', overflowY: 'auto'}}
destroyOnClose destroyOnClose
title={formVals.id ? "维护集群配置" : "创建集群配置"} title={formVals.id ? "维护集群配置" : "创建集群配置"}
visible={modalVisible} visible={modalVisible}
......
dlink-web/src/pages/ClusterConfiguration/index.tsx
View file @ 02e300f0
...@@ -19,11 +19,10 @@ ...@@ -19,11 +19,10 @@
import React, {useRef, useState} from "react"; import React, {useRef, useState} from "react";
import {DownOutlined, HeartOutlined, PlusOutlined, UserOutlined} from '@ant-design/icons'; import {DownOutlined, PlusOutlined} from '@ant-design/icons';
import {ActionType, ProColumns} from "@ant-design/pro-table"; import ProTable, {ActionType, ProColumns} from "@ant-design/pro-table";
import {Button, message, Input, Drawer, Modal, Dropdown, Menu} from 'antd'; import {Button, Drawer, Dropdown, Menu, Modal} from 'antd';
import {PageContainer, FooterToolbar} from '@ant-design/pro-layout'; import {FooterToolbar, PageContainer} from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions'; import ProDescriptions from '@ant-design/pro-descriptions';
import {ClusterConfigurationTableListItem} from "@/pages/ClusterConfiguration/data"; import {ClusterConfigurationTableListItem} from "@/pages/ClusterConfiguration/data";
import {handleAddOrUpdate, handleRemove, queryData, updateEnabled} from "@/components/Common/crud"; import {handleAddOrUpdate, handleRemove, queryData, updateEnabled} from "@/components/Common/crud";
...@@ -219,7 +218,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => { ...@@ -219,7 +218,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<ClusterConfigurationTableListItem> <ProTable<ClusterConfigurationTableListItem>
headerTitle="集群配置管理" headerTitle="集群配置管理"
actionRef={actionRef} actionRef={actionRef}
...@@ -336,7 +335,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => { ...@@ -336,7 +335,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => {
modalVisible={updateModalVisible} modalVisible={updateModalVisible}
values={formValues} values={formValues}
/> />
): null} ) : null}
<Drawer <Drawer
width={600} width={600}
visible={!!row} visible={!!row}
...@@ -360,7 +359,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => { ...@@ -360,7 +359,7 @@ const ClusterConfigurationTableList: React.FC<{}> = (props: any) => {
)} )}
</Drawer> </Drawer>
</PageContainer> </PageContainer>
); );
}; };
export default ClusterConfigurationTableList; export default ClusterConfigurationTableList;
dlink-web/src/pages/DataBase/components/DBForm.tsx
View file @ 02e300f0
...@@ -35,7 +35,7 @@ export type UpdateFormProps = { ...@@ -35,7 +35,7 @@ export type UpdateFormProps = {
values: Partial<DataBaseItem>; values: Partial<DataBaseItem>;
}; };
const data:any = [ const data: any = [
{ {
type: 'MySql', type: 'MySql',
}, },
...@@ -76,11 +76,11 @@ const DBForm: React.FC<UpdateFormProps> = (props) => { ...@@ -76,11 +76,11 @@ const DBForm: React.FC<UpdateFormProps> = (props) => {
const [dbType, setDbType] = useState<string>(); const [dbType, setDbType] = useState<string>();
const chooseOne = (item:DataBaseItem)=>{ const chooseOne = (item: DataBaseItem) => {
setDbType(item.type); setDbType(item.type);
}; };
const onSubmit = async (value:any)=>{ const onSubmit = async (value: any) => {
const success = await createOrModifyDatabase(value); const success = await createOrModifyDatabase(value);
if (success) { if (success) {
handleChooseDBModalVisible(); handleChooseDBModalVisible();
...@@ -89,25 +89,25 @@ const DBForm: React.FC<UpdateFormProps> = (props) => { ...@@ -89,25 +89,25 @@ const DBForm: React.FC<UpdateFormProps> = (props) => {
} }
}; };
const onTest = async (value:any)=>{ const onTest = async (value: any) => {
await testDatabaseConnect(value); await testDatabaseConnect(value);
}; };
return ( return (
<Modal <Modal
width={800} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
title={values.id?'编辑数据源':'创建数据源'} title={values.id ? '编辑数据源' : '创建数据源'}
visible={modalVisible} visible={modalVisible}
onCancel={() => { onCancel={() => {
setDbType(undefined); setDbType(undefined);
handleChooseDBModalVisible(); handleChooseDBModalVisible();
}} }}
maskClosable = {false} maskClosable={false}
destroyOnClose = {true} destroyOnClose={true}
footer={null} footer={null}
>{ >{
(!dbType&&!values.id)&&(<List (!dbType && !values.id) && (<List
grid={{ grid={{
gutter: 16, gutter: 16,
xs: 1, xs: 1,
...@@ -118,8 +118,10 @@ const DBForm: React.FC<UpdateFormProps> = (props) => { ...@@ -118,8 +118,10 @@ const DBForm: React.FC<UpdateFormProps> = (props) => {
xxl: 4, xxl: 4,
}} }}
dataSource={data} dataSource={data}
renderItem={(item:DataBaseItem) => ( renderItem={(item: DataBaseItem) => (
<List.Item onClick={()=>{chooseOne(item)}}> <List.Item onClick={() => {
chooseOne(item)
}}>
<Card> <Card>
<Image <Image
height={80} height={80}
...@@ -134,8 +136,8 @@ const DBForm: React.FC<UpdateFormProps> = (props) => { ...@@ -134,8 +136,8 @@ const DBForm: React.FC<UpdateFormProps> = (props) => {
} }
<DataBaseForm <DataBaseForm
onCancel={() => setDbType(undefined)} onCancel={() => setDbType(undefined)}
modalVisible={!!values.type||!!dbType} modalVisible={!!values.type || !!dbType}
type={(!values.type)?dbType:values.type} type={(!values.type) ? dbType : values.type}
values={values} values={values}
onSubmit={(value) => { onSubmit={(value) => {
onSubmit(value); onSubmit(value);
......
dlink-web/src/pages/DataBase/index.tsx
View file @ 02e300f0
...@@ -86,7 +86,7 @@ const DataBaseTableList: React.FC<{}> = (props: any) => { ...@@ -86,7 +86,7 @@ const DataBaseTableList: React.FC<{}> = (props: any) => {
}; };
return ( return (
<PageContainer> <PageContainer title={false}>
<ProList <ProList
actionRef={actionRef} actionRef={actionRef}
toolBarRender={() => { toolBarRender={() => {
......
dlink-web/src/pages/Document/components/DocumentForm.tsx
View file @ 02e300f0
...@@ -54,7 +54,7 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => { ...@@ -54,7 +54,7 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => {
fillValue: props.values.fillValue, fillValue: props.values.fillValue,
version: props.values.version, version: props.values.version,
likeNum: props.values.likeNum, likeNum: props.values.likeNum,
enabled: props.values.enabled?props.values.enabled:true, enabled: props.values.enabled ? props.values.enabled : true,
}); });
const { const {
...@@ -66,8 +66,8 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => { ...@@ -66,8 +66,8 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => {
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
setFormVals({...formVals,...fieldsValue}); setFormVals({...formVals, ...fieldsValue});
handleSubmit({...formVals,...fieldsValue}); handleSubmit({...formVals, ...fieldsValue});
}; };
const renderContent = (formVals) => { const renderContent = (formVals) => {
...@@ -165,7 +165,8 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => { ...@@ -165,7 +165,8 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => {
label="填充值" label="填充值"
rules={[{required: true, message: '请输入填充值！'}]} rules={[{required: true, message: '请输入填充值！'}]}
> >
<TextArea placeholder="请输入填充值,编辑器内使用名称触发提示 eg: 如果希望在函数LTRIM(parms)中输入参数 则语法为: LTRIM(${1:}) 此时的1代表第一个光标 如需多个 数字+1即可 tab键切换光标 ; 如不需要参数则直接输入期望填充值" <TextArea
placeholder="请输入填充值,编辑器内使用名称触发提示 eg: 如果希望在函数LTRIM(parms)中输入参数 则语法为: LTRIM(${1:}) 此时的1代表第一个光标 如需多个 数字+1即可 tab键切换光标 ; 如不需要参数则直接输入期望填充值"
allowClear allowClear
autoSize={{minRows: 3, maxRows: 10}}/> autoSize={{minRows: 3, maxRows: 10}}/>
</FormItem> </FormItem>
...@@ -174,7 +175,7 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => { ...@@ -174,7 +175,7 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => {
label="版本" label="版本"
rules={[{required: true, message: '请选择该文档所属版本！'}]} rules={[{required: true, message: '请选择该文档所属版本！'}]}
> >
<Select allowClear > <Select allowClear>
<Option value="1.11">Flink-1.11</Option> <Option value="1.11">Flink-1.11</Option>
<Option value="1.12">Flink-1.12</Option> <Option value="1.12">Flink-1.12</Option>
<Option value="1.13">Flink-1.13</Option> <Option value="1.13">Flink-1.13</Option>
...@@ -207,10 +208,10 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => { ...@@ -207,10 +208,10 @@ const DocumentForm: React.FC<DocumentFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护文档":"创建文档"} title={formVals.id ? "维护文档" : "创建文档"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/Document/index.tsx
View file @ 02e300f0
...@@ -140,58 +140,58 @@ const DocumentTableList: React.FC<{}> = (props: any) => { ...@@ -140,58 +140,58 @@ const DocumentTableList: React.FC<{}> = (props: any) => {
}, { }, {
text: 'Property', text: 'Property',
value: 'Property', value: 'Property',
},{ }, {
text: 'Event', text: 'Event',
value: 'Event', value: 'Event',
},{ }, {
text: 'Operator', text: 'Operator',
value: 'Operator', value: 'Operator',
},{ }, {
text: 'Unit', text: 'Unit',
value: 'Unit', value: 'Unit',
},{ }, {
text: 'Value', text: 'Value',
value: 'Value', value: 'Value',
},{ }, {
text: 'Constant', text: 'Constant',
value: 'Constant', value: 'Constant',
},{ }, {
text: 'Enum', text: 'Enum',
value: 'Enum', value: 'Enum',
},{ }, {
text: 'EnumMember', text: 'EnumMember',
value: 'EnumMember', value: 'EnumMember',
},{ }, {
text: 'Keyword', text: 'Keyword',
value: 'Keyword', value: 'Keyword',
},{ }, {
text: 'Text', text: 'Text',
value: 'Text', value: 'Text',
},{ }, {
text: 'Color', text: 'Color',
value: 'Color', value: 'Color',
},{ }, {
text: 'File', text: 'File',
value: 'File', value: 'File',
},{ }, {
text: 'Reference', text: 'Reference',
value: 'Reference', value: 'Reference',
},{ }, {
text: 'Customcolor', text: 'Customcolor',
value: 'Customcolor', value: 'Customcolor',
},{ }, {
text: 'Folder', text: 'Folder',
value: 'Folder', value: 'Folder',
},{ }, {
text: 'TypeParameter', text: 'TypeParameter',
value: 'TypeParameter', value: 'TypeParameter',
},{ }, {
text: 'User', text: 'User',
value: 'User', value: 'User',
},{ }, {
text: 'Issue', text: 'Issue',
value: 'Issue', value: 'Issue',
},{ }, {
text: 'Snippet', text: 'Snippet',
value: 'Snippet', value: 'Snippet',
}, },
...@@ -288,87 +288,87 @@ const DocumentTableList: React.FC<{}> = (props: any) => { ...@@ -288,87 +288,87 @@ const DocumentTableList: React.FC<{}> = (props: any) => {
{ {
text: 'Batch/Streaming', text: 'Batch/Streaming',
value: 'Batch/Streaming', value: 'Batch/Streaming',
},{ }, {
text: 'Batch', text: 'Batch',
value: 'Batch', value: 'Batch',
},{ }, {
text: 'Streaming', text: 'Streaming',
value: 'Streaming', value: 'Streaming',
},{ }, {
text: 'Other', text: 'Other',
value: 'Other', value: 'Other',
},{ }, {
text: '比较函数', text: '比较函数',
value: '比较函数', value: '比较函数',
},{ }, {
text: '逻辑函数', text: '逻辑函数',
value: '逻辑函数', value: '逻辑函数',
},{ }, {
text: '算术函数', text: '算术函数',
value: '算术函数', value: '算术函数',
},{ }, {
text: '字符串函数', text: '字符串函数',
value: '字符串函数', value: '字符串函数',
},{ }, {
text: '时间函数', text: '时间函数',
value: '时间函数', value: '时间函数',
},{ }, {
text: '类型转换函数功能', text: '类型转换函数功能',
value: '类型转换函数功能', value: '类型转换函数功能',
},{ }, {
text: '条件函数', text: '条件函数',
value: '条件函数', value: '条件函数',
},{ }, {
text: 'Collection 函数', text: 'Collection 函数',
value: 'Collection 函数', value: 'Collection 函数',
},{ }, {
text: 'Value Construction函数', text: 'Value Construction函数',
value: 'Value Construction函数', value: 'Value Construction函数',
},{ }, {
text: 'Value Access函数', text: 'Value Access函数',
value: 'Value Access函数', value: 'Value Access函数',
},{ }, {
text: '分组函数', text: '分组函数',
value: '分组函数', value: '分组函数',
},{ }, {
text: 'hash函数', text: 'hash函数',
value: 'hash函数', value: 'hash函数',
},{ }, {
text: '聚合函数', text: '聚合函数',
value: '聚合函数', value: '聚合函数',
},{ }, {
text: '列函数', text: '列函数',
value: '列函数', value: '列函数',
},{ }, {
text: '表值聚合函数', text: '表值聚合函数',
value: '表值聚合函数', value: '表值聚合函数',
},{ }, {
text: '其他函数', text: '其他函数',
value: '其他函数', value: '其他函数',
}, },
], ],
filterMultiple: false, filterMultiple: false,
valueEnum: { valueEnum: {
'Batch/Streaming' : {text: 'Batch/Streaming'}, 'Batch/Streaming': {text: 'Batch/Streaming'},
'Batch' : {text: 'Batch'}, 'Batch': {text: 'Batch'},
'Streaming' : {text: 'Streaming'}, 'Streaming': {text: 'Streaming'},
'Other' : {text: 'Other'}, 'Other': {text: 'Other'},
'比较函数' : {text: '比较函数'}, '比较函数': {text: '比较函数'},
'逻辑函数' : {text: '逻辑函数'}, '逻辑函数': {text: '逻辑函数'},
'算术函数' : {text: '算术函数'}, '算术函数': {text: '算术函数'},
'字符串函数' : {text: '字符串函数'}, '字符串函数': {text: '字符串函数'},
'时间函数' : {text: '时间函数'}, '时间函数': {text: '时间函数'},
'条件函数' : {text: '条件函数'}, '条件函数': {text: '条件函数'},
'类型转换函数功能' : {text: '类型转换函数功能'}, '类型转换函数功能': {text: '类型转换函数功能'},
'Collection 函数' : {text: 'Collection 函数'}, 'Collection 函数': {text: 'Collection 函数'},
'Value Construction函数' : {text: 'Value Construction函数'}, 'Value Construction函数': {text: 'Value Construction函数'},
'Value Access函数' : {text: 'Value Access函数'}, 'Value Access函数': {text: 'Value Access函数'},
'分组函数' : {text: '分组函数'}, '分组函数': {text: '分组函数'},
'hash函数' : {text: 'hash函数'}, 'hash函数': {text: 'hash函数'},
'聚合函数' : {text: '聚合函数'}, '聚合函数': {text: '聚合函数'},
'列函数' : {text: '列函数'}, '列函数': {text: '列函数'},
'表值聚合函数' : {text: '表值聚合函数'}, '表值聚合函数': {text: '表值聚合函数'},
'其他函数' : {text: '其他函数'}, '其他函数': {text: '其他函数'},
}, },
}, },
{ {
...@@ -473,7 +473,7 @@ const DocumentTableList: React.FC<{}> = (props: any) => { ...@@ -473,7 +473,7 @@ const DocumentTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<DocumentTableListItem> <ProTable<DocumentTableListItem>
headerTitle="文档管理" headerTitle="文档管理"
actionRef={actionRef} actionRef={actionRef}
......
dlink-web/src/pages/FragmentVariable/components/FragmentForm.tsx
View file @ 02e300f0
...@@ -38,7 +38,7 @@ const formLayout = { ...@@ -38,7 +38,7 @@ const formLayout = {
wrapperCol: {span: 13}, wrapperCol: {span: 13},
}; };
const FragmentForm : React.FC<FragmentFormProps> = (props:any) => { const FragmentForm: React.FC<FragmentFormProps> = (props: any) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const [formVals, setFormVals] = useState<Partial<FragmentVariableTableListItem>>({ const [formVals, setFormVals] = useState<Partial<FragmentVariableTableListItem>>({
...@@ -62,11 +62,11 @@ const FragmentForm : React.FC<FragmentFormProps> = (props:any) => { ...@@ -62,11 +62,11 @@ const FragmentForm : React.FC<FragmentFormProps> = (props:any) => {
const submitForm = async () => { const submitForm = async () => {
const fieldsValue = await form.validateFields(); const fieldsValue = await form.validateFields();
fieldsValue.id = formVals.id; fieldsValue.id = formVals.id;
setFormVals({...formVals,...fieldsValue}); setFormVals({...formVals, ...fieldsValue});
handleSubmit({...formVals,...fieldsValue}); handleSubmit({...formVals, ...fieldsValue});
}; };
const renderContent = (formVals : FragmentVariableTableListItem) => { const renderContent = (formVals: FragmentVariableTableListItem) => {
return ( return (
<> <>
<FormItem <FormItem
...@@ -120,10 +120,10 @@ const FragmentForm : React.FC<FragmentFormProps> = (props:any) => { ...@@ -120,10 +120,10 @@ const FragmentForm : React.FC<FragmentFormProps> = (props:any) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护全局变量":"新建全局变量"} title={formVals.id ? "维护全局变量" : "新建全局变量"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/FragmentVariable/index.tsx
View file @ 02e300f0
...@@ -183,7 +183,7 @@ const FragmentTableList: React.FC<{}> = (props: any) => { ...@@ -183,7 +183,7 @@ const FragmentTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<FragmentVariableTableListItem> <ProTable<FragmentVariableTableListItem>
headerTitle="全局变量列表" headerTitle="全局变量列表"
actionRef={actionRef} actionRef={actionRef}
......
dlink-web/src/pages/Jar/components/JarForm.tsx
View file @ 02e300f0
...@@ -18,8 +18,8 @@ ...@@ -18,8 +18,8 @@
*/ */
import React, {useEffect, useState} from 'react'; import React, {useState} from 'react';
import {Form, Button, Input, Modal, Select,Divider,Switch} from 'antd'; import {Button, Divider, Form, Input, Modal, Select, Switch} from 'antd';
import {JarTableListItem} from "@/pages/Jar/data"; import {JarTableListItem} from "@/pages/Jar/data";
export type JarFormProps = { export type JarFormProps = {
...@@ -42,12 +42,12 @@ const JarForm: React.FC<JarFormProps> = (props) => { ...@@ -42,12 +42,12 @@ const JarForm: React.FC<JarFormProps> = (props) => {
id: props.values.id, id: props.values.id,
name: props.values.name, name: props.values.name,
alias: props.values.alias, alias: props.values.alias,
type: props.values.type?props.values.type:'UserApp', type: props.values.type ? props.values.type : 'UserApp',
path: props.values.path, path: props.values.path,
mainClass: props.values.mainClass, mainClass: props.values.mainClass,
paras: props.values.paras, paras: props.values.paras,
note: props.values.note, note: props.values.note,
enabled: props.values.enabled?props.values.enabled:true, enabled: props.values.enabled ? props.values.enabled : true,
}); });
const { const {
...@@ -139,10 +139,10 @@ const JarForm: React.FC<JarFormProps> = (props) => { ...@@ -139,10 +139,10 @@ const JarForm: React.FC<JarFormProps> = (props) => {
return ( return (
<Modal <Modal
width={1200} width={"40%"}
bodyStyle={{padding: '32px 40px 48px'}} bodyStyle={{padding: '32px 40px 48px'}}
destroyOnClose destroyOnClose
title={formVals.id?"维护Jar配置":"创建Jar配置"} title={formVals.id ? "维护Jar配置" : "创建Jar配置"}
visible={modalVisible} visible={modalVisible}
footer={renderFooter()} footer={renderFooter()}
onCancel={() => handleModalVisible()} onCancel={() => handleModalVisible()}
......
dlink-web/src/pages/Jar/index.tsx
View file @ 02e300f0
...@@ -228,7 +228,7 @@ const JarTableList: React.FC<{}> = (props: any) => { ...@@ -228,7 +228,7 @@ const JarTableList: React.FC<{}> = (props: any) => {
]; ];
return ( return (
<PageContainer> <PageContainer title={false}>
<ProTable<JarTableListItem> <ProTable<JarTableListItem>
headerTitle="Jar 配置管理" headerTitle="Jar 配置管理"
actionRef={actionRef} actionRef={actionRef}
......
dlink-web/src/pages/SettingCenter/FlinkSettings/index.tsx
View file @ 02e300f0
...@@ -27,7 +27,7 @@ import {loadSettings} from "@/pages/SettingCenter/FlinkSettings/function"; ...@@ -27,7 +27,7 @@ import {loadSettings} from "@/pages/SettingCenter/FlinkSettings/function";
type SettingsProps = { type SettingsProps = {
dispatch:any; dispatch: any;
}; };
const Settings: React.FC<SettingsProps> = (props) => { const Settings: React.FC<SettingsProps> = (props) => {
...@@ -37,8 +37,8 @@ const Settings: React.FC<SettingsProps> = (props) => { ...@@ -37,8 +37,8 @@ const Settings: React.FC<SettingsProps> = (props) => {
return ( return (
<PageContainer> <PageContainer title={false}>
<FlinkConfigView /> <FlinkConfigView/>
</PageContainer> </PageContainer>
); );
}; };
......
dlink-web/src/pages/user/Login/index.tsx
View file @ 02e300f0
...@@ -123,7 +123,7 @@ const Login: React.FC = () => { ...@@ -123,7 +123,7 @@ const Login: React.FC = () => {
//const {code } = userLoginState; //const {code } = userLoginState;
const handleShowTenant = (item: API.LoginParams) => { const handleShowTenant = () => {
return <> return <>
<Modal title={intl.formatMessage({id: 'pages.login.chooseTenant'})} visible={chooseTenant} destroyOnClose={true} <Modal title={intl.formatMessage({id: 'pages.login.chooseTenant'})} visible={chooseTenant} destroyOnClose={true}
...@@ -291,7 +291,7 @@ const Login: React.FC = () => { ...@@ -291,7 +291,7 @@ const Login: React.FC = () => {
</div> </div>
</div> </div>
<Footer/> <Footer/>
{handleShowTenant(userParamsState)} {handleShowTenant()}
</div> </div>
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment