zy-asrs-master.git

			@@ -1,106 +1,66 @@
			import React, { useState, useRef, useEffect } from 'react';
			import { Col, Form, Input, Row, Checkbox, Slider, Select, Drawer, Space, Button, InputNumber, Switch } from 'antd';
			import { Col, Form, Input, Row, Checkbox, Slider, Select, Drawer, Space, Button, InputNumber, Card } from 'antd';
			import { FormattedMessage, useIntl, useModel } from '@umijs/max';
			import {
			BranchesOutlined,
			BorderOuterOutlined,
			} from '@ant-design/icons';
			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';
			import SubSpriteSettings from './subSettings';
			import MapSettings from './mapSettings';
			import ConfigSettings from './configSettings';

			const useStyles = createStyles(({ token, css }) => {

			})

			const SpriteSettings = (props) => {
			const Settings = (props) => {
			const intl = useIntl();
			const { styles } = useStyles();
			const { curSprite } = props;
			const [form] = Form.useForm();

			const [childrenDrawer, setChildrenDrawer] = useState(false);
			const [activeTabKey, setActiveTabKey] = useState('map');
			const [mapForm] = Form.useForm();
			const [configForm] = 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,

			copyDire: 'right',
			copyCount: 1,
			})
			}
			}, [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);
			})
			})
			if (activeTabKey === 'map') {
			mapForm.submit();
			}
			if (activeTabKey === 'config') {
			configForm.submit();
			}
			}

			const onFinishFailed = (errorInfo) => {
			const finishSettings = (values, fn) => {
			fn();
			}

			const contentList = {
			map: (
			<MapSettings
			refCurr={props.refCurr}
			curSprite={props.curSprite}
			setSpriteBySettings={props.setSpriteBySettings}
			onSubmit={finishSettings}
			mapForm={mapForm}
			/>
			),
			config: (
			<ConfigSettings
			refCurr={props.refCurr}
			curSprite={props.curSprite}
			setSpriteBySettings={props.setSpriteBySettings}
			onSubmit={finishSettings}
			configForm={configForm}
			/>
			),
			};

			return (
			@@ -117,341 +77,47 @@
			<Button onClick={handleCancel}>
			<FormattedMessage id='common.cancel' defaultMessage='取消' />
			</Button>
			<Button onClick={handleOk} type="primary">
			<Button hidden={activeTabKey === 'map' \|\| activeTabKey === 'config'} onClick={handleOk} type="primary">
			<FormattedMessage id='common.submit' defaultMessage='保存' />
			</Button>
			</Space>
			}
			>
			<Form
			form={form}
			onFieldsChange={formValuesChange}
			initialValues={{
			<Card
			hoverable
			bordered={false}
			type='inner'
			tabList={[
			{
			key: 'map',
			tab: intl.formatMessage({ id: 'map.settings.map.param', defaultMessage: '地图参数' }),
			icon: <BorderOuterOutlined />

			},
			{
			key: 'config',
			tab: intl.formatMessage({ id: 'map.settings.config.param', defaultMessage: '系统参数' }),
			icon: <BranchesOutlined />
			},
			]}
			activeTabKey={activeTabKey}
			onTabChange={(key) => {
			setActiveTabKey(key)
			}}
			onFinish={handleFinish}
			onFinishFailed={onFinishFailed}
			autoComplete="off"
			style={{
			maxWidth: 600,
			tabProps={{
			centered: true,
			size: 'large',
			type: "card",
			style: {
			}
			}}
			size='default' // small \| default \| large
			variant='filled' // outlined \| borderless \| filled
			labelWrap // label 换行
			disabled={false}
			layout='horizontal'
			>
			<Row gutter={[24, 16]}>
			{contentList[activeTabKey]}
			</Card>

			{/* */}
			<Col span={24}>
			<Row gutter={24}>
			<Col span={18}>
			<Form.Item
			label={intl.formatMessage({ id: 'map.settings.type', defaultMessage: '类型' })}
			labelCol={{ span: 4 }}
			>
			<span className="ant-form-text">China</span>
			</Form.Item>
			</Col>
			</Row>
			</Col>

			{/* position */}
			<Col span={24}>
			<Row gutter={24}>
			<Col span={18}>
			<Form.Item
			label={intl.formatMessage({ id: 'map.settings.position', defaultMessage: '坐标' })}
			labelCol={{ span: 4 }}
			>
			<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>
			</Row>
			</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>

			{/* copy */}
			<Col span={24}>
			<Row gutter={24}>
			<Col span={18}>
			<Form.Item
			label={intl.formatMessage({ id: 'map.settings.copy', defaultMessage: '复制' })}
			labelCol={{ span: 4 }}
			>
			<Space.Compact>
			<Form.Item
			noStyle
			name="copyDire"
			>
			<Select
			style={{ width: 80 }}
			options={[
			{ value: 'left', label: intl.formatMessage({ id: 'map.settings.left', defaultMessage: '左' }) },
			{ value: 'right', label: intl.formatMessage({ id: 'map.settings.right', defaultMessage: '右' }) },
			{ value: 'top', label: intl.formatMessage({ id: 'map.settings.top', defaultMessage: '上' }) },
			{ value: 'bottom', label: intl.formatMessage({ id: 'map.settings.bottom', defaultMessage: '下' }) },
			]}
			/>
			</Form.Item>
			<Form.Item
			name='copyCount'
			noStyle
			rules={[
			{
			required: true,
			},
			]}
			>
			<InputNumber
			addonBefore={<Space.Compact></Space.Compact>}
			style={{
			width: '50%',
			}}
			min={1}
			step={1}
			/>
			</Form.Item>
			<Form.Item>
			<Button
			onClick={() => {
			console.log(form.getFieldValue('x'));
			setChildrenDrawer(true);
			}}
			>
			<FormattedMessage id='common.execute' defaultMessage='执行' />
			</Button>
			<SubSpriteSettings
			open={childrenDrawer}
			refCurr={props.refCurr}
			values={{
			copyDire: form.getFieldValue('copyDire'),
			copyCount: form.getFieldValue('copyCount'),
			data: form.getFieldsValue()
			}}
			submit={() => {
			console.log(3)
			}}
			onClose={() => {
			setChildrenDrawer(false)
			}}
			/>
			</Form.Item>
			</Space.Compact>
			</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;
			export default Settings;