From a554a78015cb8bd0b9f1e65a4ac478b42f73f5f9 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期五, 08 三月 2024 16:04:45 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/pages/map/components/settings.jsx | 370 ++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 370 insertions(+), 0 deletions(-)
diff --git a/zy-asrs-flow/src/pages/map/components/settings.jsx b/zy-asrs-flow/src/pages/map/components/settings.jsx
index e69de29..39d30d5 100644
--- a/zy-asrs-flow/src/pages/map/components/settings.jsx
+++ b/zy-asrs-flow/src/pages/map/components/settings.jsx
@@ -0,0 +1,370 @@
+import React, { useState, useRef, useEffect } from 'react';
+import { Col, Form, Input, Row, Checkbox, Slider, Select, Drawer, Space, Button, InputNumber, Switch } from 'antd';
+import { FormattedMessage, useIntl, useModel } from '@umijs/max';
+import { createStyles } from 'antd-style';
+import './index.css';
+import * as Utils from '../utils'
+import * as PIXI from 'pixi.js';
+import moment from 'moment';
+import Http from '@/utils/http';
+
+const useStyles = createStyles(({ token, css }) => {
+
+})
+
+const SpriteSettings = (props) => {
+ const intl = useIntl();
+ const { styles } = useStyles();
+ const { curSprite } = props;
+ const [form] = Form.useForm();
+
+ useEffect(() => {
+
+ }, []);
+
+ useEffect(() => {
+ form.resetFields();
+ if (curSprite) {
+ form.setFieldsValue({
+ x: curSprite.position.x,
+ y: curSprite.position.y,
+ scale: Math.max(curSprite.scale.x, curSprite.scale.y),
+ scaleSlider: Math.max(curSprite.scale.x, curSprite.scale.y),
+ rotation: curSprite.rotation * 180 / Math.PI,
+ rotationSlider: curSprite.rotation * 180 / Math.PI,
+ })
+ }
+ }, [form, props])
+
+ const handleCancel = () => {
+ props.onCancel();
+ };
+
+ const handleOk = () => {
+ form.submit();
+ }
+
+ const handleFinish = async (values) => {
+ props.onSubmit({ ...values });
+ }
+
+ const formValuesChange = (changeList) => {
+ if (changeList && changeList.length > 0) {
+ changeList.forEach(change => {
+ const { name: nameList, value } = change;
+ nameList.forEach(name => {
+ switch (name) {
+ case 'x':
+ curSprite.position.x = value;
+ break;
+ case 'y':
+ curSprite.position.x = value;
+ break;
+ case 'scaleSlider':
+ form.setFieldsValue({
+ scale: value
+ })
+ curSprite.scale.set(value);
+ break;
+ case 'scale':
+ form.setFieldsValue({
+ scaleSlider: value
+ })
+ curSprite.scale.set(value);
+ break;
+ case 'rotationSlider':
+ form.setFieldsValue({
+ rotation: value
+ })
+ curSprite.rotation = value * Math.PI / 180;
+ break;
+ case 'rotation':
+ form.setFieldsValue({
+ rotationSlider: value
+ })
+ curSprite.rotation = value * Math.PI / 180;
+ break;
+ default:
+ break;
+ }
+ Utils.removeSelectedEffect();
+ Utils.showSelectedEffect(curSprite);
+ })
+ })
+ }
+ }
+
+ const onFinishFailed = (errorInfo) => {
+ };
+
+ return (
+ <>
+ <Drawer
+ open={props.open}
+ onClose={handleCancel}
+ getContainer={props.refCurr}
+ rootStyle={{ position: "absolute" }}
+ mask={false}
+ width={570}
+ extra={
+ <Space>
+ <Button onClick={handleCancel}>
+ <FormattedMessage id='common.cancel' defaultMessage='鍙栨秷' />
+ </Button>
+ <Button onClick={handleOk} type="primary">
+ <FormattedMessage id='common.submit' defaultMessage='淇濆瓨' />
+ </Button>
+ </Space>
+ }
+ >
+ <Form
+ form={form}
+ onFieldsChange={formValuesChange}
+ initialValues={{
+ }}
+ onFinish={handleFinish}
+ onFinishFailed={onFinishFailed}
+ autoComplete="off"
+ style={{
+ maxWidth: 600,
+ }}
+ size='default' // small | default | large
+ variant='filled' // outlined | borderless | filled
+ labelWrap // label 鎹㈣
+ disabled={false}
+ layout='horizontal'
+ >
+ <Row gutter={[24, 16]}>
+
+ {/* */}
+ <Col span={24}>
+ <Form.Item
+ label={intl.formatMessage({ id: 'map.settings.type', defaultMessage: '绫诲瀷' })}
+ labelCol={{ span: 2 }}
+ >
+ <span className="ant-form-text">China</span>
+ </Form.Item>
+ </Col>
+
+ {/* position */}
+ <Col span={24}>
+ <Form.Item
+ label={intl.formatMessage({ id: 'map.settings.position', defaultMessage: '鍧愭爣' })}
+ >
+ <Space.Compact>
+ <Form.Item
+ name='x'
+ noStyle
+ rules={[
+ {
+ required: true,
+ },
+ ]}
+ >
+ <InputNumber
+ addonBefore={<Space.Compact>x</Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </Form.Item>
+ <Form.Item
+ name='y'
+ noStyle
+ rules={[
+ {
+ required: true,
+ },
+ ]}
+ >
+ <InputNumber
+ addonBefore={<Space.Compact>y</Space.Compact>}
+ style={{
+ width: '50%',
+ }}
+ />
+ </Form.Item>
+ </Space.Compact>
+ </Form.Item>
+ </Col>
+
+ {/* scale */}
+ <Col span={24}>
+ <Row gutter={24}>
+ <Col span={18}>
+ <Form.Item
+ label={intl.formatMessage({ id: 'map.settings.scale', defaultMessage: '缂╂斁' })}
+ name="scaleSlider"
+ labelCol={{ span: 4 }}
+ >
+ <Slider
+ min={0.1}
+ max={10}
+ step={0.1}
+ marks={{
+ 0.1: '0.1',
+ 1: '1',
+ 10: '10',
+ }}
+ />
+ </Form.Item>
+ </Col>
+ <Col span={6}>
+ <Form.Item
+ name="scale"
+ labelCol={{ span: 4 }}
+ >
+ <InputNumber
+ changeOnWheel
+ min={0.1} max={10} defaultValue={1} step={0.1}
+ rules={[
+ {
+ required: true,
+ },
+ ]}
+ />
+ </Form.Item>
+ </Col>
+ </Row>
+ </Col>
+
+ {/* rotation */}
+ <Col span={24}>
+ <Row gutter={24}>
+ <Col span={18}>
+ <Form.Item
+ label={intl.formatMessage({ id: 'map.settings.rotation', defaultMessage: '瑙掑害' })}
+ name="rotationSlider"
+ labelCol={{ span: 4 }}
+ >
+ <Slider
+ min={0}
+ max={360}
+ step={1}
+ marks={{
+ 0: '0掳',
+ 90: '90掳',
+ 180: '180掳',
+ 270: '270掳',
+ 360: '360掳',
+ }}
+ />
+ </Form.Item>
+ </Col>
+ <Col span={6}>
+ <Form.Item
+ name="rotation"
+ labelCol={{ span: 4 }}
+ >
+ <InputNumber
+ changeOnWheel
+ min={0} max={360} defaultValue={0}
+ rules={[
+ {
+ required: true,
+ },
+ ]}
+ />
+ </Form.Item>
+ </Col>
+ </Row>
+ </Col>
+
+
+ {/* <Col span={12}>
+ <Form.Item
+ label="Username"
+ name="username"
+ hasFeedback
+ validateTrigger="onBlur"
+ validateDebounce={1000}
+ rules={[
+ {
+ required: false,
+ }
+ ]}
+ >
+ <Input disabled={false} />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item
+ label="Switch"
+ valuePropName="checked"
+ >
+ <Switch />
+ </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: false,
+ 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: false,
+ 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: false,
+ message: 'Please input your phone number!',
+ },
+ ]}
+ >
+ <Input
+ addonBefore={prefixSelector}
+ style={{
+ width: '100%',
+ }}
+ />
+ </Form.Item>
+ </Col> */}
+
+
+
+ </Row>
+ </Form>
+ </Drawer>
+ </>
+ )
+}
+
+export default SpriteSettings;
\ No newline at end of file
--
Gitblit v1.9.1