floraachy
/
console
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

command globalization

This commit is contained in:
liugq 2021-11-28 21:25:29 +08:00
parent fe10f329ab
commit c0da75ae11
10 changed files with 180 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web/src/components/kibana/console/components/CommonCommandModal.tsx
View File

@ -2,6 +2,7 @@
import React, { useState, useCallback } from "react"; import React, { useState, useCallback } from "react";
import { Modal, Form, Input, Tag } from "antd"; import { Modal, Form, Input, Tag } from "antd";
import { PlusOutlined } from "@ant-design/icons"; import { PlusOutlined } from "@ant-design/icons";
import { formatMessage } from "umi/locale";
interface ITagGeneratorProps { interface ITagGeneratorProps {
value?: Array<string>; value?: Array<string>;
@ -61,7 +62,7 @@ export const TagGenerator = ({ value = [], onChange }: ITagGeneratorProps) => {
)} )}
{!inputVisible && ( {!inputVisible && (
<Tag onClick={showInput} style={{ padding: "4px 6px", fontSize: 16 }}> <Tag onClick={showInput} style={{ padding: "4px 6px", fontSize: 16 }}>
<PlusOutlined /> 新建标签 <PlusOutlined /> {formatMessage({ id: "command.btn.newtag" })}
</Tag> </Tag>
)} )}
</div> </div>
@ -86,21 +87,21 @@ const CommonCommandModal = Form.create()((props: ICommonCommandModalProps) => {
return ( return (
<Modal <Modal
title="保存常用命令" title={formatMessage({ id: "command.manage.save.title" })}
visible={true} visible={true}
onCancel={props.onClose} onCancel={props.onClose}
onOk={handleConfirm} onOk={handleConfirm}
zIndex={1003} zIndex={1003}
cancelText="取消" cancelText={formatMessage({ id: "form.button.cancel" })}
okText="确认" okText={formatMessage({ id: "form.button.save" })}
> >
<Form layout="vertical"> <Form layout="vertical">
<Form.Item label="标题"> <Form.Item label={formatMessage({ id: "command.table.field.name" })}>
{form.getFieldDecorator("title", { {form.getFieldDecorator("title", {
rules: [{ required: true, message: "请输入标题" }], rules: [{ required: true, message: "请输入标题" }],
})(<Input />)} })(<Input />)}
</Form.Item> </Form.Item>
<Form.Item label="标签"> <Form.Item label={formatMessage({ id: "command.table.field.tag" })}>
{form.getFieldDecorator("tag")(<TagGenerator />)} {form.getFieldDecorator("tag")(<TagGenerator />)}
</Form.Item> </Form.Item>
</Form> </Form>

93
web/src/components/kibana/console/components/ConsoleMenu.tsx
View File

@ -30,14 +30,20 @@
* GitHub history for details. * GitHub history for details.
*/ */
import React, { Component } from 'react'; import React, { Component } from "react";
import { EuiIcon, EuiContextMenuPanel, EuiContextMenuItem, EuiPopover } from '@elastic/eui'; import {
import { ESRequestParams } from '../entities/es_request'; EuiIcon,
import {notification} from 'antd'; EuiContextMenuPanel,
EuiContextMenuItem,
EuiPopover,
} from "@elastic/eui";
import { ESRequestParams } from "../entities/es_request";
import { notification } from "antd";
import CommonCommandModal from './CommonCommandModal'; import CommonCommandModal from "./CommonCommandModal";
import {saveCommonCommand} from '../modules/es'; import { saveCommonCommand } from "../modules/es";
import {pushCommand} from '../modules/mappings/mappings'; import { pushCommand } from "../modules/mappings/mappings";
import { formatMessage } from "umi/locale";
interface Props { interface Props {
getCurl: () => Promise<string>; getCurl: () => Promise<string>;
@ -57,7 +63,7 @@ export default class ConsoleMenu extends Component<Props, State> {
super(props); super(props);
this.state = { this.state = {
curlCode: '', curlCode: "",
isPopoverOpen: false, isPopoverOpen: false,
modalVisible: false, modalVisible: false,
}; };
@ -74,14 +80,14 @@ export default class ConsoleMenu extends Component<Props, State> {
try { try {
await this.copyText(this.state.curlCode); await this.copyText(this.state.curlCode);
notification.open({ notification.open({
message: 'Request copied as cURL', message: "Request copied as cURL",
placement: 'bottomRight' placement: "bottomRight",
}); });
} catch (e) { } catch (e) {
notification.error({ notification.error({
message: 'Could not copy request as cURL', message: "Could not copy request as cURL",
placement: 'bottomRight' placement: "bottomRight",
}); });
} }
} }
@ -90,7 +96,7 @@ export default class ConsoleMenu extends Component<Props, State> {
await window.navigator.clipboard.writeText(text); await window.navigator.clipboard.writeText(text);
return; return;
} }
throw new Error('Could not copy to clipboard!'); throw new Error("Could not copy to clipboard!");
} }
onButtonClick = () => { onButtonClick = () => {
@ -111,7 +117,7 @@ export default class ConsoleMenu extends Component<Props, State> {
if (!documentation) { if (!documentation) {
return; return;
} }
window.open(documentation, '_blank'); window.open(documentation, "_blank");
}; };
autoIndent = (event: React.MouseEvent) => { autoIndent = (event: React.MouseEvent) => {
@ -122,7 +128,7 @@ export default class ConsoleMenu extends Component<Props, State> {
saveAsCommonCommand = () => { saveAsCommonCommand = () => {
this.setState({ this.setState({
isPopoverOpen: false, isPopoverOpen: false,
modalVisible: true modalVisible: true,
}); });
}; };
@ -137,14 +143,14 @@ export default class ConsoleMenu extends Component<Props, State> {
requests, requests,
}; };
const result = await (await saveCommonCommand(reqBody))?.json(); const result = await (await saveCommonCommand(reqBody))?.json();
if(result.error){ if (result.error) {
notification.error({ notification.error({
message: result.error message: result.error,
}); });
}else{ } else {
this.handleClose(); this.handleClose();
notification.success({ notification.success({
message:'保存成功' message: "保存成功",
}); });
pushCommand(result); pushCommand(result);
} }
@ -152,40 +158,36 @@ export default class ConsoleMenu extends Component<Props, State> {
render() { render() {
const button = ( const button = (
<button <button className="euiButtonIcon--primary" onClick={this.onButtonClick}>
className="euiButtonIcon--primary"
onClick={this.onButtonClick}
>
<EuiIcon type="wrench" /> <EuiIcon type="wrench" />
</button> </button>
); );
const items = [ const items = [
<EuiContextMenuItem <EuiContextMenuItem key="Auto indent" onClick={this.autoIndent}>
key="Auto indent" {formatMessage({ id: "console.menu.auto_indent" })}
onClick={this.autoIndent}
>
自动缩进
</EuiContextMenuItem>, </EuiContextMenuItem>,
<EuiContextMenuItem <EuiContextMenuItem
key="Save as common command" key="Save as common command"
onClick={this.saveAsCommonCommand} onClick={this.saveAsCommonCommand}
> >
保存为常用命令 {formatMessage({ id: "console.menu.save_as_command" })}
</EuiContextMenuItem>, </EuiContextMenuItem>,
]; ];
if(window.navigator?.clipboard){ if (window.navigator?.clipboard) {
items.unshift(<EuiContextMenuItem items.unshift(
key="Copy as cURL" <EuiContextMenuItem
id="ConCopyAsCurl" key="Copy as cURL"
disabled={!window.navigator?.clipboard} id="ConCopyAsCurl"
onClick={() => { disabled={!window.navigator?.clipboard}
this.closePopover(); onClick={() => {
this.copyAsCurl(); this.closePopover();
}} this.copyAsCurl();
> }}
复制为curl命令 >
</EuiContextMenuItem>) {formatMessage({ id: "console.menu.copy_as_curl" })}
</EuiContextMenuItem>
);
} }
return ( return (
@ -200,7 +202,12 @@ export default class ConsoleMenu extends Component<Props, State> {
> >
<EuiContextMenuPanel items={items} /> <EuiContextMenuPanel items={items} />
</EuiPopover> </EuiPopover>
{this.state.modalVisible && <CommonCommandModal onClose={this.handleClose} onConfirm={this.handleConfirm} />} {this.state.modalVisible && (
<CommonCommandModal
onClose={this.handleClose}
onConfirm={this.handleConfirm}
/>
)}
</span> </span>
); );
} }

6
web/src/locales/en-US.js
View File

@ -1,6 +1,7 @@
import alert from "./en-US/alert"; import alert from "./en-US/alert";
import console from "./en-US/console"; import console from "./en-US/console";
import cluster from "./en-US/cluster"; import cluster from "./en-US/cluster";
import command from "./en-US/command";
export default { export default {
"navBar.lang": "Languages", "navBar.lang": "Languages",
@ -77,9 +78,13 @@ export default {
"form.button.cancel": "Cancel", "form.button.cancel": "Cancel",
"form.button.collapse": "Collapse", "form.button.collapse": "Collapse",
"form.button.advanced": "Advanced", "form.button.advanced": "Advanced",
"form.button.regist": "Regist",
"table.field.operation": "Operation", "table.field.operation": "Operation",
"form.button.next": "Next", "form.button.next": "Next",
"form.button.pre": "Previous", "form.button.pre": "Previous",
"form.button.goback": "Back",
"form.button.reset": "Reset",
"form.label.search-keyword": "Keyword",
"component.globalHeader.search": "Search", "component.globalHeader.search": "Search",
"component.globalHeader.search.example1": "Search example 1", "component.globalHeader.search.example1": "Search example 1",
@ -422,4 +427,5 @@ export default {
...alert, ...alert,
...console, ...console,
...cluster, ...cluster,
...command,
}; };

8
web/src/locales/en-US/cluster.js
View File

@ -1,9 +1,11 @@
export default { export default {
"cluster.manage.title": "CLUSTERS", "cluster.manage.title": "CLUSTERS",
"cluster.manage.description": "cluster.manage.description":
"集群管理可以帮助您快速接入不同版本的 Elasticsearch 集群，以及删除和修改集群配置。", "Cluster management can help you quickly access different versions of Elasticsearch clusters, as well as delete and modify cluster configurations.",
"cluster.manage.label.cluster_name": "Cluster Name", "cluster.manage.label.cluster_name": "Cluster Name",
"cluster.manage.label.cluster_host": "Cluster Host",
"cluster.manage.btn.regist": "Regist Cluster", "cluster.manage.btn.regist": "Regist Cluster",
"cluster.manage.btn.try_connect": "Try Connect",
"cluster.manage.table.column.name": "Name", "cluster.manage.table.column.name": "Name",
"cluster.manage.table.column.health": "Health", "cluster.manage.table.column.health": "Health",
"cluster.manage.table.column.version": "Version", "cluster.manage.table.column.version": "Version",
@ -15,7 +17,9 @@ export default {
"cluster.manage.monitored.on": "ON", "cluster.manage.monitored.on": "ON",
"cluster.manage.monitored.off": "OFF", "cluster.manage.monitored.off": "OFF",
"cluster.regist.title": "REGIST CLUSTER", "cluster.regist.title": "REGIST CLUSTER",
"cluster.regist.description": "输入集群地址和身份验证信息分步创建集群。", "cluster.edit.title": "EDIT CLUSTER",
"cluster.regist.description":
"Enter the cluster address and authentication information to create a cluster step by step.",
"cluster.regist.step.connect.title": "Connect", "cluster.regist.step.connect.title": "Connect",
"cluster.regist.step.confirm.title": "Confirm", "cluster.regist.step.confirm.title": "Confirm",
"cluster.regist.step.complete.title": "Complete", "cluster.regist.step.complete.title": "Complete",

14
web/src/locales/en-US/command.js Normal file
View File

@ -0,0 +1,14 @@
export default {
"command.table.field.name": "Name",
"command.table.field.tag": "Tag",
"command.table.field.content": "Content",
"command.manage.edit.title": "Command",
"command.btn.newtag": "Add New Tag",
"command.manage.save.title": "Save As Command",
"command.manage.title": "COMMANDS",
"command.manage.description":
"Commonly used commands can help you save frequently used requests and load them quickly through the LOAD command in the development tool.",
"console.menu.copy_as_curl": "Copy As Curl",
"console.menu.auto_indent": "Auto Indent",
"console.menu.save_as_command": "Save As Command",
};

6
web/src/locales/zh-CN.js
View File

@ -1,6 +1,7 @@
import alert from "./zh-CN/alert"; import alert from "./zh-CN/alert";
import console from "./zh-CN/console"; import console from "./zh-CN/console";
import cluster from "./zh-CN/cluster"; import cluster from "./zh-CN/cluster";
import command from "./zh-CN/command";
export default { export default {
"navBar.lang": "语言", "navBar.lang": "语言",
@ -83,9 +84,13 @@ export default {
"form.button.cancel": "取消", "form.button.cancel": "取消",
"form.button.collapse": "收起", "form.button.collapse": "收起",
"form.button.advanced": "高级", "form.button.advanced": "高级",
"form.button.regist": "注册",
"table.field.operation": "操作", "table.field.operation": "操作",
"form.button.next": "下一步", "form.button.next": "下一步",
"form.button.pre": "上一步", "form.button.pre": "上一步",
"form.button.goback": "返回",
"form.button.reset": "重置",
"form.label.search-keyword": "观检测",
"component.globalHeader.search": "站内搜索", "component.globalHeader.search": "站内搜索",
"component.globalHeader.search.example1": "搜索提示一", "component.globalHeader.search.example1": "搜索提示一",
@ -420,4 +425,5 @@ export default {
...alert, ...alert,
...console, ...console,
...cluster, ...cluster,
...command,
}; };

5
web/src/locales/zh-CN/cluster.js
View File

@ -4,17 +4,20 @@ export default {
"集群管理可以帮助您快速接入不同版本的 Elasticsearch 集群，以及删除和修改集群配置。", "集群管理可以帮助您快速接入不同版本的 Elasticsearch 集群，以及删除和修改集群配置。",
"cluster.manage.label.cluster_name": "集群名称", "cluster.manage.label.cluster_name": "集群名称",
"cluster.manage.btn.regist": "注册集群", "cluster.manage.btn.regist": "注册集群",
"cluster.manage.btn.try_connect": "测试连接",
"cluster.manage.table.column.name": "集群名称", "cluster.manage.table.column.name": "集群名称",
"cluster.manage.table.column.health": "集群状态", "cluster.manage.table.column.health": "集群状态",
"cluster.manage.table.column.version": "程序版本", "cluster.manage.table.column.version": "程序版本",
"cluster.manage.table.column.node_count": "节点数", "cluster.manage.table.column.node_count": "节点数",
"cluster.manage.table.column.endpoint": "集群地址", "cluster.manage.table.column.endpoint": "集群地址",
"cluster.manage.table.column.monitored": "监控启用状态", "cluster.manage.label.cluster_host": "集群主机",
"cluster.manage.table.column.monitored": "监控启用",
"cluster.manage.table.column.operation": "操作", "cluster.manage.table.column.operation": "操作",
"cluster.manage.table.column.description": "描述", "cluster.manage.table.column.description": "描述",
"cluster.manage.monitored.on": "启用", "cluster.manage.monitored.on": "启用",
"cluster.manage.monitored.off": "关闭", "cluster.manage.monitored.off": "关闭",
"cluster.regist.title": "集群注册", "cluster.regist.title": "集群注册",
"cluster.edit.title": "修改集群配置",
"cluster.regist.description": "输入集群地址和身份验证信息分步创建集群。", "cluster.regist.description": "输入集群地址和身份验证信息分步创建集群。",
"cluster.regist.step.connect.title": "连接", "cluster.regist.step.connect.title": "连接",
"cluster.regist.step.confirm.title": "确认", "cluster.regist.step.confirm.title": "确认",

14
web/src/locales/zh-CN/command.js Normal file
View File

@ -0,0 +1,14 @@
export default {
"command.table.field.name": "名称",
"command.table.field.tag": "标签",
"command.table.field.content": "内容",
"command.manage.edit.title": "常用命令",
"command.btn.newtag": "新建标签",
"command.manage.save.title": "保存为常用命令",
"command.manage.title": "常用命令管理",
"command.manage.description":
"常用命令可以帮助您保存常用的请求，并且在开发工具里面通过 LOAD 命令快速地加载。",
"console.menu.copy_as_curl": "复制为Curl命令",
"console.menu.auto_indent": "自动缩进",
"console.menu.save_as_command": "保存为常用命令",
};

68
web/src/pages/System/Cluster/Form.js
View File

@ -16,6 +16,7 @@ import styles from "./Form.less";
import { connect } from "dva"; import { connect } from "dva";
import NewCluster from "./Step"; import NewCluster from "./Step";
import PageHeaderWrapper from "@/components/PageHeaderWrapper"; import PageHeaderWrapper from "@/components/PageHeaderWrapper";
import { formatMessage } from "umi/locale";
@Form.create() @Form.create()
@connect(({ clusterConfig }) => ({ @connect(({ clusterConfig }) => ({
@ -176,7 +177,12 @@ class ClusterForm extends React.Component {
return ( return (
<PageHeaderWrapper> <PageHeaderWrapper>
<Card <Card
title={editMode === "NEW" ? "注册集群" : "修改集群配置"} title={formatMessage({
id:
editMode === "NEW"
? "cluster.regist.title"
: "cluster.edit.title",
})}
extra={[ extra={[
<Button <Button
type="primary" type="primary"
@ -184,13 +190,19 @@ class ClusterForm extends React.Component {
router.push("/system/cluster"); router.push("/system/cluster");
}} }}
> >
返回 {formatMessage({
id: "form.button.goback",
})}
</Button>, </Button>,
]} ]}
> >
<Spin spinning={this.state.isLoading}> <Spin spinning={this.state.isLoading}>
<Form {...formItemLayout}> <Form {...formItemLayout}>
<Form.Item label="集群名称"> <Form.Item
label={formatMessage({
id: "cluster.manage.label.cluster_name",
})}
>
{getFieldDecorator("name", { {getFieldDecorator("name", {
initialValue: editValue.name, initialValue: editValue.name,
rules: [ rules: [
@ -201,7 +213,11 @@ class ClusterForm extends React.Component {
], ],
})(<Input autoComplete="off" placeholder="cluster-name" />)} })(<Input autoComplete="off" placeholder="cluster-name" />)}
</Form.Item> </Form.Item>
<Form.Item label="集群地址"> <Form.Item
label={formatMessage({
id: "cluster.manage.label.cluster_host",
})}
>
{getFieldDecorator("host", { {getFieldDecorator("host", {
initialValue: editValue.host, initialValue: editValue.host,
rules: [ rules: [
@ -234,7 +250,11 @@ class ClusterForm extends React.Component {
/> />
)} )}
</Form.Item> </Form.Item>
<Form.Item label="是否需要身份验证"> <Form.Item
label={formatMessage({
id: "cluster.regist.step.connect.label.auth",
})}
>
<Switch <Switch
defaultChecked={this.state.needAuth} defaultChecked={this.state.needAuth}
onChange={this.handleAuthChange} onChange={this.handleAuthChange}
@ -244,13 +264,22 @@ class ClusterForm extends React.Component {
</Form.Item> </Form.Item>
{this.state.needAuth === true ? ( {this.state.needAuth === true ? (
<div> <div>
<Form.Item label="用户名"> <Form.Item
label={formatMessage({
id: "cluster.regist.step.connect.label.username",
})}
>
{getFieldDecorator("username", { {getFieldDecorator("username", {
initialValue: editValue.basic_auth?.username, initialValue: editValue.basic_auth?.username,
rules: [], rules: [],
})(<Input autoComplete="off" />)} })(<Input autoComplete="off" />)}
</Form.Item> </Form.Item>
<Form.Item label="密码" hasFeedback> <Form.Item
label={formatMessage({
id: "cluster.regist.step.connect.label.password",
})}
hasFeedback
>
{getFieldDecorator("password", { {getFieldDecorator("password", {
initialValue: editValue.basic_auth?.password, initialValue: editValue.basic_auth?.password,
rules: [], rules: [],
@ -265,10 +294,14 @@ class ClusterForm extends React.Component {
initialValue: editValue.order || 0, initialValue: editValue.order || 0,
})(<InputNumber />)} })(<InputNumber />)}
</Form.Item> */} </Form.Item> */}
<Form.Item label="描述"> <Form.Item
label={formatMessage({
id: "cluster.manage.table.column.description",
})}
>
{getFieldDecorator("description", { {getFieldDecorator("description", {
initialValue: editValue.description, initialValue: editValue.description,
})(<Input.TextArea placeholder="集群应用描述" />)} })(<Input.TextArea placeholder="Cluster Descirption" />)}
</Form.Item> </Form.Item>
{/* <Form.Item label="是否启用"> {/* <Form.Item label="是否启用">
{getFieldDecorator('enabled', { {getFieldDecorator('enabled', {
@ -279,7 +312,11 @@ class ClusterForm extends React.Component {
unCheckedChildren={<Icon type="close" />} unCheckedChildren={<Icon type="close" />}
/>)} />)}
</Form.Item> */} </Form.Item> */}
<Form.Item label="启用监控"> <Form.Item
label={formatMessage({
id: "cluster.manage.table.column.monitored",
})}
>
{getFieldDecorator("monitored", { {getFieldDecorator("monitored", {
valuePropName: "checked", valuePropName: "checked",
initialValue: initialValue:
@ -295,10 +332,17 @@ class ClusterForm extends React.Component {
</Form.Item> </Form.Item>
<Form.Item {...tailFormItemLayout}> <Form.Item {...tailFormItemLayout}>
<Button type="primary" onClick={this.handleSubmit}> <Button type="primary" onClick={this.handleSubmit}>
{editMode === "NEW" ? "注册" : "保存"} {formatMessage({
id:
editMode === "NEW"
? "form.button.regist"
: "form.button.save",
})}
</Button> </Button>
<Button style={{ marginLeft: 15 }} onClick={this.tryConnect}> <Button style={{ marginLeft: 15 }} onClick={this.tryConnect}>
测试连接 {formatMessage({
id: "cluster.manage.btn.try_connect",
})}
</Button> </Button>
</Form.Item> </Form.Item>
</Form> </Form>

35
web/src/pages/System/Command/Index.js
View File

@ -44,10 +44,7 @@ const { TabPane } = Tabs;
const content = ( const content = (
<div className={styles.pageHeaderContent}> <div className={styles.pageHeaderContent}>
<p> <p>{formatMessage({ id: "command.manage.description" })}</p>
常用命令可以帮助您保存常用的请求，并且在开发工具里面通过 LOAD
命令快速地加载。
</p>
</div> </div>
); );
@ -75,7 +72,7 @@ class Index extends PureComponent {
}; };
columns = [ columns = [
{ {
title: "名称", title: formatMessage({ id: "command.table.field.name" }),
dataIndex: "title", dataIndex: "title",
render: (text, record) => ( render: (text, record) => (
<a <a
@ -91,21 +88,21 @@ class Index extends PureComponent {
), ),
}, },
{ {
title: "标签", title: formatMessage({ id: "command.table.field.tag" }),
dataIndex: "tag", dataIndex: "tag",
render: (val) => { render: (val) => {
return (val || []).join(","); return (val || []).join(",");
}, },
}, },
{ {
title: "操作", title: formatMessage({ id: "table.field.operation" }),
render: (text, record) => ( render: (text, record) => (
<Fragment> <Fragment>
<Popconfirm <Popconfirm
title="Sure to delete?" title="Sure to delete?"
onConfirm={() => this.handleDeleteClick(record.id)} onConfirm={() => this.handleDeleteClick(record.id)}
> >
<a>删除</a> <a>{formatMessage({ id: "form.button.delete" })}</a>
</Popconfirm> </Popconfirm>
</Fragment> </Fragment>
), ),
@ -268,7 +265,7 @@ class Index extends PureComponent {
return ( return (
<PageHeaderWrapper <PageHeaderWrapper
title="常用命令管理" title={formatMessage({ id: "command.manage.title" })}
content={content} content={content}
extraContent={extraContent} extraContent={extraContent}
> >
@ -278,22 +275,24 @@ class Index extends PureComponent {
<Form onSubmit={this.handleSearch} layout="inline"> <Form onSubmit={this.handleSearch} layout="inline">
<Row gutter={{ md: 8, lg: 24, xl: 48 }}> <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
<Col md={8} sm={24}> <Col md={8} sm={24}>
<FormItem label="关键词"> <FormItem
label={formatMessage({ id: "form.label.search-keyword" })}
>
{getFieldDecorator("keyword")( {getFieldDecorator("keyword")(
<Input placeholder="请输入" /> <Input placeholder="Input keyword to search" />
)} )}
</FormItem> </FormItem>
</Col> </Col>
<Col md={8} sm={24}> <Col md={8} sm={24}>
<span className={styles.submitButtons}> <span className={styles.submitButtons}>
<Button type="primary" htmlType="submit"> <Button type="primary" htmlType="submit">
查询 {formatMessage({ id: "form.button.search" })}
</Button> </Button>
<Button <Button
style={{ marginLeft: 8 }} style={{ marginLeft: 8 }}
onClick={this.handleFormReset} onClick={this.handleFormReset}
> >
重置 {formatMessage({ id: "form.button.reset" })}
</Button> </Button>
</span> </span>
</Col> </Col>
@ -326,7 +325,7 @@ class Index extends PureComponent {
</Card> </Card>
<Drawer <Drawer
// title={editingCommand.title} // title={editingCommand.title}
title="常用命令" title={formatMessage({ id: "command.manage.edit.title" })}
visible={drawerVisible} visible={drawerVisible}
onClose={() => { onClose={() => {
this.setState({ this.setState({
@ -339,7 +338,7 @@ class Index extends PureComponent {
<div <div
style={{ display: "flex", alignItems: "center", marginBottom: 15 }} style={{ display: "flex", alignItems: "center", marginBottom: 15 }}
> >
<div>标题：</div> <div>{formatMessage({ id: "command.table.field.name" })}：</div>
<div> <div>
<Input <Input
value={editingCommand.title} value={editingCommand.title}
@ -351,7 +350,7 @@ class Index extends PureComponent {
<div <div
style={{ display: "flex", alignItems: "center", marginBottom: 15 }} style={{ display: "flex", alignItems: "center", marginBottom: 15 }}
> >
<div>标签：</div> <div>{formatMessage({ id: "command.table.field.tag" })}：</div>
<div> <div>
<TagGenerator <TagGenerator
value={editingCommand.tag || []} value={editingCommand.tag || []}
@ -360,7 +359,7 @@ class Index extends PureComponent {
{/* <Input style={{ width: 250 }} /> */} {/* <Input style={{ width: 250 }} /> */}
</div> </div>
</div> </div>
<div>内容：</div> <div>{formatMessage({ id: "command.table.field.content" })}：</div>
<div style={{ border: "1px solid rgb(232, 232, 232)" }}> <div style={{ border: "1px solid rgb(232, 232, 232)" }}>
<EuiCodeBlock language="json" style={{ height: 300 }} isCopyable> <EuiCodeBlock language="json" style={{ height: 300 }} isCopyable>
{this.buildRawCommonCommandRequest(editingCommand)} {this.buildRawCommonCommandRequest(editingCommand)}
@ -385,7 +384,7 @@ class Index extends PureComponent {
</div> </div>
<div style={{ marginTop: 15, textAlign: "right" }}> <div style={{ marginTop: 15, textAlign: "right" }}>
<Button type="primary" onClick={this.handleSaveClick}> <Button type="primary" onClick={this.handleSaveClick}>
保存 {formatMessage({ id: "form.button.save" })}
</Button> </Button>
</div> </div>
</Drawer> </Drawer>