From c36194702d8ea381849ae50ad576d79dc4ea0d45 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期五, 08 三月 2024 11:03:46 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/pages/map/components/settings.jsx | 224 +++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 157 insertions(+), 67 deletions(-)
diff --git a/zy-asrs-flow/src/pages/map/components/settings.jsx b/zy-asrs-flow/src/pages/map/components/settings.jsx
index b1fe434..d4f44e1 100644
--- a/zy-asrs-flow/src/pages/map/components/settings.jsx
+++ b/zy-asrs-flow/src/pages/map/components/settings.jsx
@@ -1,16 +1,6 @@
import React, { useState, useRef, useEffect } from 'react';
-import {
- ProForm,
- ProFormDigit,
- ProFormText,
- ProFormSelect,
- ProFormDateTimePicker,
- ProFormTextArea,
- ProFormSlider,
- ProFormSwitch,
-} from '@ant-design/pro-components';
import moment from 'moment';
-import { Col, Form, Modal, Row, Checkbox, Image, Tree, Drawer, Space, Button, Card, Divider } from 'antd';
+import { Col, Form, Input, Row, Checkbox, Slider, Select, Drawer, Space, Button, InputNumber, Switch } from 'antd';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
import * as PIXI from 'pixi.js';
import { createStyles } from 'antd-style';
@@ -50,9 +40,32 @@
props.onSubmit({ ...values });
}
- const formValuesChange = (changeValues) => {
- console.log(changeValues);
+ const formValuesChange = (value) => {
+ switch (value) {
+ case 'male':
+ break;
+ default:
+ break;
+ }
}
+
+ const onFinishFailed = (errorInfo) => {
+ };
+
+
+
+ const prefixSelector = (
+ <Form.Item name="prefix" noStyle>
+ <Select
+ style={{
+ width: 70,
+ }}
+ >
+ <Option value="86">+86</Option>
+ <Option value="87">+87</Option>
+ </Select>
+ </Form.Item>
+ );
return (
<>
@@ -74,63 +87,140 @@
</Space>
}
>
- <ProForm
+ <Form
form={form}
- submitter={false}
+ onFieldsChange={formValuesChange}
+ initialValues={{
+ }}
onFinish={handleFinish}
- layout="horizontal"
- grid={true}
- onValuesChange={formValuesChange}
+ onFinishFailed={onFinishFailed}
+ autoComplete="off"
+ style={{
+ maxWidth: 600,
+ }}
+ size='default' // small | default | large
+ variant='filled' // outlined | borderless | filled
+ labelWrap // label 鎹㈣
+ disabled={false}
>
- {/*
- // position
- // scale
- // rotation
- // copy
- */}
- <ProForm.Group>
- <ProFormText
- name="name"
- label="鍚嶇О"
- colProps={{ md: 12, xl: 12 }}
- />
- <ProFormDigit
- label="InputNumber"
- name="input-number"
- min={1}
- max={10}
- colProps={{ md: 12, xl: 12 }}
- />
- </ProForm.Group>
- <ProForm.Group>
- <ProFormSlider
- name="slider"
- label="Slider"
- width="lg"
- marks={{
- 0: 'A',
- 20: 'B',
- 40: 'C',
- 60: 'D',
- 80: 'E',
- 100: 'F',
- }}
- colProps={{ md: 12, xl: 12 }}
- />
- <ProFormSwitch
- name="switch"
- label="Switch"
- colProps={{ md: 12, xl: 12 }}
- />
- </ProForm.Group>
- <ProForm.Group>
- <ProFormTextArea
- name="memo"
- label="澶囨敞"
- colProps={{ md: 24, xl: 24 }}
- />
- </ProForm.Group>
- </ProForm>
+ <Row gutter={24}>
+ <Col span={6}>
+ <Form.Item label="Plain Text">
+ <span className="ant-form-text">China</span>
+ </Form.Item>
+ </Col>
+ <Col span={12}>
+ <Form.Item
+ label="Username"
+ name="username"
+ hasFeedback
+ validateTrigger="onBlur"
+ validateDebounce={1000}
+ rules={[
+ {
+ required: true,
+ }
+ ]}
+ >
+ <Input disabled={false} />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item
+ label="InputNumber"
+ >
+ <InputNumber />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item
+ label="Switch"
+ valuePropName="checked"
+ >
+ <Switch />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item name="slider" label="Slider">
+ <Slider
+ marks={{
+ 0: 'A',
+ 20: 'B',
+ 40: 'C',
+ 60: 'D',
+ 80: 'E',
+ 100: 'F',
+ }}
+ />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item label="Memo">
+ <Input.TextArea />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item label="Address">
+ <Space.Compact>
+ <Form.Item
+ name={['address', 'province']}
+ noStyle
+ rules={[
+ {
+ required: true,
+ message: 'Province is required',
+ },
+ ]}
+ >
+ <Select placeholder="Select province">
+ <Option value="Zhejiang">Zhejiang</Option>
+ <Option value="Jiangsu">Jiangsu</Option>
+ </Select>
+ </Form.Item>
+ <Form.Item
+ name={['address', 'street']}
+ noStyle
+ rules={[
+ {
+ required: true,
+ message: 'Street is required',
+ },
+ ]}
+ >
+ <Input
+ style={{
+ width: '50%',
+ }}
+ placeholder="Input street"
+ />
+ </Form.Item>
+ </Space.Compact>
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item
+ name="phone"
+ label="Phone Number"
+ rules={[
+ {
+ required: true,
+ message: 'Please input your phone number!',
+ },
+ ]}
+ >
+ <Input
+ addonBefore={prefixSelector}
+ style={{
+ width: '100%',
+ }}
+ />
+ </Form.Item>
+ </Col>
+
+
+
+ </Row>
+ </Form>
</Drawer>
</>
)
--
Gitblit v1.9.1