|
@@ -1,7 +1,7 @@
|
|
|
import { Modal, Button, Steps } from 'antd';
|
|
import { Modal, Button, Steps } from 'antd';
|
|
|
import { observer } from '@formily/react';
|
|
import { observer } from '@formily/react';
|
|
|
import { observable } from '@formily/reactive';
|
|
import { observable } from '@formily/reactive';
|
|
|
-import { useEffect, useRef } from 'react';
|
|
|
|
|
|
|
+import { useEffect, useRef, useState } from 'react';
|
|
|
import { onlyMessage } from '@/utils/util';
|
|
import { onlyMessage } from '@/utils/util';
|
|
|
import type { TriggerDevice, TriggerDeviceOptions } from '@/pages/rule-engine/Scene/typings';
|
|
import type { TriggerDevice, TriggerDeviceOptions } from '@/pages/rule-engine/Scene/typings';
|
|
|
import Product from './product';
|
|
import Product from './product';
|
|
@@ -11,6 +11,7 @@ import { numberToString } from '../components/TimingTrigger/whenOption';
|
|
|
import { timeUnitEnum } from '../components/TimingTrigger';
|
|
import { timeUnitEnum } from '../components/TimingTrigger';
|
|
|
|
|
|
|
|
interface AddProps {
|
|
interface AddProps {
|
|
|
|
|
+ options?: any;
|
|
|
value?: TriggerDevice;
|
|
value?: TriggerDevice;
|
|
|
onCancel?: () => void;
|
|
onCancel?: () => void;
|
|
|
onSave?: (data: TriggerDevice, options: any) => void;
|
|
onSave?: (data: TriggerDevice, options: any) => void;
|
|
@@ -30,9 +31,30 @@ export interface DeviceModelProps extends Partial<TriggerDevice> {
|
|
|
orgId: string;
|
|
orgId: string;
|
|
|
operation?: TriggerDeviceOptions;
|
|
operation?: TriggerDeviceOptions;
|
|
|
options: any;
|
|
options: any;
|
|
|
|
|
+ productPage: number;
|
|
|
|
|
+ productPageSize: number;
|
|
|
|
|
+ devicePage: number;
|
|
|
|
|
+ devicePageSize: number;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-export const DeviceModel = observable<DeviceModelProps>({
|
|
|
|
|
|
|
+const defaultModelData: Omit<DeviceModelProps, 'steps'> = {
|
|
|
|
|
+ stepNumber: 0,
|
|
|
|
|
+ productId: '',
|
|
|
|
|
+ productDetail: {},
|
|
|
|
|
+ deviceKeys: [],
|
|
|
|
|
+ orgId: '',
|
|
|
|
|
+ selector: 'custom',
|
|
|
|
|
+ metadata: {},
|
|
|
|
|
+ operation: {
|
|
|
|
|
+ operator: 'online',
|
|
|
|
|
+ },
|
|
|
|
|
+ options: {},
|
|
|
|
|
+ productPage: 0,
|
|
|
|
|
+ productPageSize: 0,
|
|
|
|
|
+ devicePage: 0,
|
|
|
|
|
+ devicePageSize: 0,
|
|
|
|
|
+};
|
|
|
|
|
+export const TriggerDeviceModel = observable<DeviceModelProps>({
|
|
|
steps: [
|
|
steps: [
|
|
|
{
|
|
{
|
|
|
key: 'product',
|
|
key: 'product',
|
|
@@ -47,42 +69,50 @@ export const DeviceModel = observable<DeviceModelProps>({
|
|
|
title: '触发类型',
|
|
title: '触发类型',
|
|
|
},
|
|
},
|
|
|
],
|
|
],
|
|
|
- stepNumber: 0,
|
|
|
|
|
- productId: '',
|
|
|
|
|
- productDetail: {},
|
|
|
|
|
- deviceKeys: [],
|
|
|
|
|
- orgId: '',
|
|
|
|
|
- selector: 'custom',
|
|
|
|
|
- metadata: {},
|
|
|
|
|
- operation: {
|
|
|
|
|
- operator: 'online',
|
|
|
|
|
- },
|
|
|
|
|
- options: {},
|
|
|
|
|
|
|
+ ...defaultModelData,
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
export default observer((props: AddProps) => {
|
|
export default observer((props: AddProps) => {
|
|
|
const typeRef = useRef<{ validateFields?: any; handleInit?: any }>();
|
|
const typeRef = useRef<{ validateFields?: any; handleInit?: any }>();
|
|
|
|
|
+ const [loading, setLoading] = useState(false);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
- DeviceModel.stepNumber = 0;
|
|
|
|
|
|
|
+ TriggerDeviceModel.stepNumber = 0;
|
|
|
|
|
+ return () => {
|
|
|
|
|
+ Object.keys(defaultModelData).forEach((key) => {
|
|
|
|
|
+ TriggerDeviceModel[key] = defaultModelData[key];
|
|
|
|
|
+ });
|
|
|
|
|
+ };
|
|
|
}, []);
|
|
}, []);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
if (props.value) {
|
|
if (props.value) {
|
|
|
- DeviceModel.selector = props.value.selector;
|
|
|
|
|
- DeviceModel.productId = props.value.productId;
|
|
|
|
|
- DeviceModel.selector = props.value.selector;
|
|
|
|
|
- DeviceModel.selectorValues = props.value.selectorValues;
|
|
|
|
|
- DeviceModel.operation = props.value.operation;
|
|
|
|
|
- DeviceModel.deviceKeys =
|
|
|
|
|
|
|
+ TriggerDeviceModel.selector = props.value.selector;
|
|
|
|
|
+ TriggerDeviceModel.productId = props.value.productId;
|
|
|
|
|
+ TriggerDeviceModel.selector = props.value.selector;
|
|
|
|
|
+ TriggerDeviceModel.selectorValues = props.value.selectorValues;
|
|
|
|
|
+ TriggerDeviceModel.operation = props.value.operation;
|
|
|
|
|
+ TriggerDeviceModel.deviceKeys =
|
|
|
props.value.selector === 'custom'
|
|
props.value.selector === 'custom'
|
|
|
? props.value.selectorValues?.map((item) => item.value) || []
|
|
? props.value.selectorValues?.map((item) => item.value) || []
|
|
|
: [];
|
|
: [];
|
|
|
}
|
|
}
|
|
|
}, [props.value]);
|
|
}, [props.value]);
|
|
|
|
|
|
|
|
|
|
+ useEffect(() => {
|
|
|
|
|
+ console.log('productPage', props.options);
|
|
|
|
|
+
|
|
|
|
|
+ if (props.options) {
|
|
|
|
|
+ TriggerDeviceModel.devicePage = props.options.devicePage;
|
|
|
|
|
+ TriggerDeviceModel.devicePageSize = props.options.devicePageSize;
|
|
|
|
|
+ TriggerDeviceModel.productPage = props.options.productPage;
|
|
|
|
|
+ TriggerDeviceModel.productPageSize = props.options.productPageSize;
|
|
|
|
|
+ }
|
|
|
|
|
+ setLoading(true);
|
|
|
|
|
+ }, [props.options]);
|
|
|
|
|
+
|
|
|
const prev = () => {
|
|
const prev = () => {
|
|
|
- DeviceModel.stepNumber -= 1;
|
|
|
|
|
|
|
+ TriggerDeviceModel.stepNumber -= 1;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const handleOptions = (data: TriggerDeviceOptions) => {
|
|
const handleOptions = (data: TriggerDeviceOptions) => {
|
|
@@ -96,15 +126,15 @@ export default observer((props: AddProps) => {
|
|
|
time: undefined,
|
|
time: undefined,
|
|
|
when: undefined,
|
|
when: undefined,
|
|
|
extraTime: undefined,
|
|
extraTime: undefined,
|
|
|
- action: DeviceModel.options.action,
|
|
|
|
|
|
|
+ action: TriggerDeviceModel.options.action,
|
|
|
};
|
|
};
|
|
|
- if (DeviceModel.selector === 'custom') {
|
|
|
|
|
- _options.name = DeviceModel.selectorValues?.map((item) => item.name).join(',');
|
|
|
|
|
- } else if (DeviceModel.selector === 'org') {
|
|
|
|
|
- _options.name = DeviceModel.selectorValues?.[0].name + '的';
|
|
|
|
|
- _options.productName = DeviceModel.productDetail.name; // 产品名称
|
|
|
|
|
|
|
+ if (TriggerDeviceModel.selector === 'custom') {
|
|
|
|
|
+ _options.name = TriggerDeviceModel.selectorValues?.map((item) => item.name).join(',');
|
|
|
|
|
+ } else if (TriggerDeviceModel.selector === 'org') {
|
|
|
|
|
+ _options.name = TriggerDeviceModel.selectorValues?.[0].name + '的';
|
|
|
|
|
+ _options.productName = TriggerDeviceModel.productDetail.name; // 产品名称
|
|
|
} else {
|
|
} else {
|
|
|
- _options.name = '所有的' + DeviceModel.productDetail.name;
|
|
|
|
|
|
|
+ _options.name = '所有的' + TriggerDeviceModel.productDetail.name;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
if (data.timer) {
|
|
if (data.timer) {
|
|
@@ -147,32 +177,39 @@ export default observer((props: AddProps) => {
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const next = async () => {
|
|
const next = async () => {
|
|
|
- if (DeviceModel.stepNumber === 0) {
|
|
|
|
|
- if (DeviceModel.productId) {
|
|
|
|
|
- DeviceModel.stepNumber = 1;
|
|
|
|
|
|
|
+ if (TriggerDeviceModel.stepNumber === 0) {
|
|
|
|
|
+ if (TriggerDeviceModel.productId) {
|
|
|
|
|
+ TriggerDeviceModel.stepNumber = 1;
|
|
|
} else {
|
|
} else {
|
|
|
onlyMessage('请选择产品', 'error');
|
|
onlyMessage('请选择产品', 'error');
|
|
|
}
|
|
}
|
|
|
- } else if (DeviceModel.stepNumber === 1) {
|
|
|
|
|
- if (DeviceModel.selector === 'custom' && !DeviceModel.selectorValues?.length) {
|
|
|
|
|
|
|
+ } else if (TriggerDeviceModel.stepNumber === 1) {
|
|
|
|
|
+ if (TriggerDeviceModel.selector === 'custom' && !TriggerDeviceModel.selectorValues?.length) {
|
|
|
onlyMessage('请选择设备', 'error');
|
|
onlyMessage('请选择设备', 'error');
|
|
|
return;
|
|
return;
|
|
|
- } else if (DeviceModel.selector === 'org' && !DeviceModel.selectorValues?.length) {
|
|
|
|
|
|
|
+ } else if (
|
|
|
|
|
+ TriggerDeviceModel.selector === 'org' &&
|
|
|
|
|
+ !TriggerDeviceModel.selectorValues?.length
|
|
|
|
|
+ ) {
|
|
|
onlyMessage('请选择部门', 'error');
|
|
onlyMessage('请选择部门', 'error');
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
- DeviceModel.stepNumber = 2;
|
|
|
|
|
- } else if (DeviceModel.stepNumber === 2) {
|
|
|
|
|
|
|
+ TriggerDeviceModel.stepNumber = 2;
|
|
|
|
|
+ } else if (TriggerDeviceModel.stepNumber === 2) {
|
|
|
// TODO 验证类型数据
|
|
// TODO 验证类型数据
|
|
|
const operationData = await typeRef.current?.validateFields();
|
|
const operationData = await typeRef.current?.validateFields();
|
|
|
if (operationData) {
|
|
if (operationData) {
|
|
|
const _options = handleOptions(operationData);
|
|
const _options = handleOptions(operationData);
|
|
|
|
|
+ _options.productPage = TriggerDeviceModel.productPage;
|
|
|
|
|
+ _options.productPageSize = TriggerDeviceModel.productPageSize;
|
|
|
|
|
+ _options.devicePage = TriggerDeviceModel.devicePage;
|
|
|
|
|
+ _options.devicePageSize = TriggerDeviceModel.devicePageSize;
|
|
|
props.onSave?.(
|
|
props.onSave?.(
|
|
|
{
|
|
{
|
|
|
operation: operationData,
|
|
operation: operationData,
|
|
|
- selectorValues: DeviceModel.selectorValues,
|
|
|
|
|
- selector: DeviceModel.selector!,
|
|
|
|
|
- productId: DeviceModel.productId,
|
|
|
|
|
|
|
+ selectorValues: TriggerDeviceModel.selectorValues,
|
|
|
|
|
+ selector: TriggerDeviceModel.selector!,
|
|
|
|
|
+ productId: TriggerDeviceModel.productId,
|
|
|
},
|
|
},
|
|
|
_options,
|
|
_options,
|
|
|
);
|
|
);
|
|
@@ -185,7 +222,7 @@ export default observer((props: AddProps) => {
|
|
|
case 'device':
|
|
case 'device':
|
|
|
return <Device />;
|
|
return <Device />;
|
|
|
case 'type':
|
|
case 'type':
|
|
|
- return <Type ref={typeRef} data={DeviceModel} />;
|
|
|
|
|
|
|
+ return <Type ref={typeRef} data={TriggerDeviceModel} />;
|
|
|
default:
|
|
default:
|
|
|
return <Product />;
|
|
return <Product />;
|
|
|
}
|
|
}
|
|
@@ -198,26 +235,26 @@ export default observer((props: AddProps) => {
|
|
|
width={800}
|
|
width={800}
|
|
|
onCancel={() => {
|
|
onCancel={() => {
|
|
|
props.onCancel?.();
|
|
props.onCancel?.();
|
|
|
- DeviceModel.stepNumber = 0;
|
|
|
|
|
|
|
+ TriggerDeviceModel.stepNumber = 0;
|
|
|
}}
|
|
}}
|
|
|
footer={
|
|
footer={
|
|
|
<div className="steps-action">
|
|
<div className="steps-action">
|
|
|
- {DeviceModel.stepNumber === 0 && (
|
|
|
|
|
|
|
+ {TriggerDeviceModel.stepNumber === 0 && (
|
|
|
<Button
|
|
<Button
|
|
|
onClick={() => {
|
|
onClick={() => {
|
|
|
props.onCancel?.();
|
|
props.onCancel?.();
|
|
|
- DeviceModel.stepNumber = 0;
|
|
|
|
|
|
|
+ TriggerDeviceModel.stepNumber = 0;
|
|
|
}}
|
|
}}
|
|
|
>
|
|
>
|
|
|
取消
|
|
取消
|
|
|
</Button>
|
|
</Button>
|
|
|
)}
|
|
)}
|
|
|
- {DeviceModel.stepNumber > 0 && (
|
|
|
|
|
|
|
+ {TriggerDeviceModel.stepNumber > 0 && (
|
|
|
<Button style={{ margin: '0 8px' }} onClick={() => prev()}>
|
|
<Button style={{ margin: '0 8px' }} onClick={() => prev()}>
|
|
|
上一步
|
|
上一步
|
|
|
</Button>
|
|
</Button>
|
|
|
)}
|
|
)}
|
|
|
- {DeviceModel.stepNumber < DeviceModel.steps.length - 1 && (
|
|
|
|
|
|
|
+ {TriggerDeviceModel.stepNumber < TriggerDeviceModel.steps.length - 1 && (
|
|
|
<Button
|
|
<Button
|
|
|
type="primary"
|
|
type="primary"
|
|
|
onClick={() => {
|
|
onClick={() => {
|
|
@@ -227,7 +264,7 @@ export default observer((props: AddProps) => {
|
|
|
下一步
|
|
下一步
|
|
|
</Button>
|
|
</Button>
|
|
|
)}
|
|
)}
|
|
|
- {DeviceModel.stepNumber === DeviceModel.steps.length - 1 && (
|
|
|
|
|
|
|
+ {TriggerDeviceModel.stepNumber === TriggerDeviceModel.steps.length - 1 && (
|
|
|
<Button
|
|
<Button
|
|
|
type="primary"
|
|
type="primary"
|
|
|
onClick={() => {
|
|
onClick={() => {
|
|
@@ -241,10 +278,10 @@ export default observer((props: AddProps) => {
|
|
|
}
|
|
}
|
|
|
>
|
|
>
|
|
|
<div className="steps-steps">
|
|
<div className="steps-steps">
|
|
|
- <Steps current={DeviceModel.stepNumber} items={DeviceModel.steps} />
|
|
|
|
|
|
|
+ <Steps current={TriggerDeviceModel.stepNumber} items={TriggerDeviceModel.steps} />
|
|
|
</div>
|
|
</div>
|
|
|
<div className="steps-content">
|
|
<div className="steps-content">
|
|
|
- {renderComponent(DeviceModel.steps[DeviceModel.stepNumber]?.key)}
|
|
|
|
|
|
|
+ {loading && renderComponent(TriggerDeviceModel.steps[TriggerDeviceModel.stepNumber]?.key)}
|
|
|
</div>
|
|
</div>
|
|
|
</Modal>
|
|
</Modal>
|
|
|
);
|
|
);
|