From ac2518b326fd3d742180fa96b3121bbe3b230178 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期一, 25 三月 2024 09:10:32 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/pages/map/batch/index.jsx | 224 ++++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 219 insertions(+), 5 deletions(-)
diff --git a/zy-asrs-flow/src/pages/map/batch/index.jsx b/zy-asrs-flow/src/pages/map/batch/index.jsx
index c85ade5..31771f8 100644
--- a/zy-asrs-flow/src/pages/map/batch/index.jsx
+++ b/zy-asrs-flow/src/pages/map/batch/index.jsx
@@ -1,22 +1,54 @@
import React, { useState, useRef, useEffect } from 'react';
-import { Drawer, Space, Button } from 'antd';
+import { Drawer, Space, Button, Card, Select, InputNumber, Input, Result, Form } from 'antd';
+import {
+ ProCard,
+ ProForm,
+ ProFormCheckbox,
+ ProFormDatePicker,
+ ProFormDateRangePicker,
+ ProFormSelect,
+ ProFormText,
+ ProFormTextArea,
+ StepsForm,
+} from '@ant-design/pro-components';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
import { createStyles } from 'antd-style';
import * as Utils from '../utils'
+import ShowJson from '../drawer/showJson';
const useStyles = createStyles(({ token, css }) => {
return {
}
})
+const waitTime = (time = 100) => {
+ return new Promise((resolve) => {
+ setTimeout(() => {
+ resolve(true);
+ }, time);
+ });
+};
+
const BatchDrawer = (props) => {
const intl = useIntl();
const { styles } = useStyles();
const { batchSprites } = props;
+ const [form] = Form.useForm();
+ const [currentStep, setCurrentStep] = useState(0);
+
+ const resetForm = () => {
+ form.resetFields();
+ setCurrentStep(0);
+ };
useEffect(() => {
console.log(batchSprites);
- }, []);
+ resetForm();
+ }, [props]);
+
+ useEffect(() => {
+ console.log(currentStep);
+ }, [currentStep]);
const handleCancel = () => {
props.onCancel();
@@ -32,7 +64,7 @@
mask={false}
width={600}
style={{
- opacity: .8
+ opacity: 1
}}
extra={
<Space>
@@ -42,8 +74,190 @@
</Space>
}
>
- {batchSprites?.length}
- </Drawer>
+ <Card
+ className='drawer-card'
+ hoverable
+ bordered={false}
+ type='inner'
+ style={{
+ height: '100%'
+ }}
+ >
+ <StepsForm
+ form={form}
+ current={currentStep}
+ onCurrentChange={setCurrentStep}
+ onFinish={async () => {
+ await waitTime(1000);
+ message.success('鎻愪氦鎴愬姛');
+ }}
+ formProps={{
+ validateMessages: {
+ required: '姝ら」涓哄繀濉」',
+ },
+ variant: 'filled',
+ layout: 'horizontal',
+ labelCol: {
+ span: 4,
+ },
+ wrapperCol: {
+ span: 20,
+ },
+ labelWrap: true
+ }}
+ submitter={{
+ render: (props, dom) => {
+ return props.step === 2 ? [] : dom;
+ },
+ }}
+ >
+ {/************************* first ****************************/}
+ <StepsForm.StepForm
+ name="base"
+ title="閫夋嫨璐ф灦"
+ onFinish={() => {
+ return true;
+ }}
+ >
+ <ProForm.Item
+ >
+ <ShowJson
+ data={
+ batchSprites?.filter(item => {
+ return item.data?.type === Utils.SENSOR_TYPE.SHELF
+ }).map(item => {
+ return item.data?.no;
+ })
+ }
+ height='500px'
+ jsonType={0}
+ />
+ </ProForm.Item>
+ </StepsForm.StepForm>
+ {/************************* second ****************************/}
+ <StepsForm.StepForm
+ name="checkbox"
+ title="璁剧疆鍙傛暟"
+ onFinish={(values) => {
+ console.log(values);
+ return true;
+ }}
+ >
+ <ProForm.Item
+ name='shelfType'
+ label={intl.formatMessage({ id: 'map.settings.shelf.type', defaultMessage: '绫诲瀷' })}
+ rules={[
+ {
+ required: true,
+ },
+ ]}
+ >
+ <Select
+ style={{ width: 120 }}
+ options={[
+ {
+ label: intl.formatMessage({ id: 'map.settings.shelf.store', defaultMessage: '搴撲綅' }),
+ value: 0
+ },
+ {
+ label: intl.formatMessage({ id: 'map.settings.shelf.track', defaultMessage: '杞ㄩ亾' }),
+ value: 3
+ },
+ {
+ label: intl.formatMessage({ id: 'map.settings.shelf.diable', defaultMessage: '绂佺敤' }),
+ value: 1
+ },
+ ]}
+ defaultValue={0}
+ />
+ </ProForm.Item>
+ <ProForm.Item
+ label={intl.formatMessage({ id: 'map.settings.shelf.space', defaultMessage: '闂磋窛' })}
+ >
+ <Space.Compact>
+ <ProForm.Item
+ name='top'
+ noStyle
+ >
+ <InputNumber
+ addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.top' defaultMessage='涓�' /></Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </ProForm.Item>
+ <ProForm.Item
+ name='bottom'
+ noStyle
+ >
+ <InputNumber
+ addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.bottom' defaultMessage='涓�' /></Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </ProForm.Item>
+ </Space.Compact>
+ </ProForm.Item>
+ <ProForm.Item
+ label={' '}
+ >
+ <Space.Compact>
+ <ProForm.Item
+ name='left'
+ noStyle
+ >
+ <InputNumber
+ addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.left' defaultMessage='宸�' /></Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </ProForm.Item>
+ <ProForm.Item
+ name='right'
+ noStyle
+ >
+ <InputNumber
+ addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.right' defaultMessage='鍙�' /></Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </ProForm.Item>
+ </Space.Compact>
+ </ProForm.Item>
+ <ProForm.Item
+ name='value'
+ label={intl.formatMessage({ id: 'map.settings.shelf.value', defaultMessage: '鍦板浘鍊�' })}
+ >
+ <Input
+ style={{
+ width: '50%',
+ }}
+ />
+ </ProForm.Item>
+ </StepsForm.StepForm>
+ {/************************* third ****************************/}
+ <StepsForm.StepForm
+ name="time"
+ title="缁撴灉"
+ submitter={false}
+ >
+ <Result
+ status="success"
+ title="Successfully Purchased Cloud Server ECS!"
+ subTitle="Order number: 2017182818828182881 Cloud server configuration takes 1-5 minutes, please wait."
+ extra={[
+ <Button type="primary" key="console">
+ Go Console
+ </Button>,
+ ]}
+ />
+ </StepsForm.StepForm>
+ </StepsForm >
+ </Card >
+ </Drawer >
</>
)
}
--
Gitblit v1.9.1