LiteSun commented on a change in pull request #1157:
URL: https://github.com/apache/apisix-dashboard/pull/1157#discussion_r550255156
##########
File path: web/src/pages/Route/components/Step1/MetaView.tsx
##########
@@ -14,21 +14,88 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
import Form from 'antd/es/form';
-import { Input, Switch, Select, Button, Tag } from 'antd';
+import { Input, Switch, Select, Button, Tag, AutoComplete } from 'antd';
import { useIntl } from 'umi';
import { PanelSection } from '@api7-dashboard/ui';
import { FORM_ITEM_WITHOUT_LABEL } from '@/pages/Route/constants';
import LabelsDrawer from './LabelsDrawer';
-
-const DEFAULT_VERSION_LABEL_PREFIX = 'version:';
+import { fetchLabelList } from '../../service';
const MetaView: React.FC<RouteModule.Step1PassProps> = ({ disabled, form,
isEdit, onChange }) => {
const { formatMessage } = useIntl();
const [visible, setVisible] = useState(false);
- const [showVersionManager, setShowVersionManager] = useState(false);
+ const [labelList, setLabelList] = useState<RouteModule.LabelList>({});
+
+ useEffect(() => {
+ // TODO: use a better state name
+ fetchLabelList().then(setLabelList);
+ }, []);
+
+ const NormalLabelComponent = () => {
+ const field = 'custom_normal_labels';
+ const title = 'Label Manager';
+
+ return (
+ <React.Fragment>
+ <Form.Item label={formatMessage({ id: 'component.global.labels' })}
name={field}>
+ <Select
+ mode="tags"
+ style={{ width: '100%' }}
+ placeholder="--"
+ disabled={disabled}
+ open={false}
+ bordered={false}
+ tagRender={(props) => {
+ const { value, closable, onClose } = props;
+ return (
+ <Tag closable={closable && !disabled} onClose={onClose}
style={{ marginRight: 3 }}>
+ {value}
+ </Tag>
+ );
+ }}
+ />
+ </Form.Item>
+ <Form.Item {...FORM_ITEM_WITHOUT_LABEL}>
+ <Button type="dashed" disabled={disabled} onClick={() =>
setVisible(true)}>
+ {formatMessage({ id: 'component.global.manage' })}
+ </Button>
+ </Form.Item>
+ {visible && (
+ <Form.Item shouldUpdate noStyle>
+ {() => {
+ const labels = form.getFieldValue(field) || [];
+ return (
+ <LabelsDrawer
+ title={title}
+ actionName={field}
+ dataSource={labels}
+ disabled={disabled || false}
+ onChange={onChange}
+ onClose={() => setVisible(false)}
+ />
+ );
+ }}
+ </Form.Item>
+ )}
+ </React.Fragment>
+ );
+ };
+
+ const VersionLabelComponent = () => {
+ return (
+ <React.Fragment>
+ <Form.Item label="版本" name="custom_version_selected_label">
Review comment:
i18n
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
