import React, { useEffect, useState, forwardRef, useImperativeHandle, } from "react"; import { Form, Input, Select, message, Switch, Space, Col } from "antd"; import { Modal, Button, Radio } from "antd"; import styles from "./easy.module.less"; import API2 from "../../../api/alarm"; import { useMemoizedFn } from "ahooks"; import { DownOutlined, UpOutlined } from "@ant-design/icons"; function TranslateText(arr) { const dtLanguage = localStorage.getItem("dtLanguage"); if (!Array.isArray(arr)) { return arr; } if (arr.length < 2 && arr.length > 0) { return arr?.[0]; } if (dtLanguage === "en") { return arr?.[1]; } return arr?.[0]; } const Easy = (props, ref) => { const { editId, groupList = [], pointId = null } = props; const [form] = Form.useForm(); // const [alarmId, setAlarmId] = useState(searchParams.get('alarm_id')) // const [token, setToken] = useState(searchParams.get('token')) // const [apiUrl, setApiUrl] = useState(decodeURIComponent(searchParams.get('api_url')) + '/') const [data, setData] = useState(); const [deferUnit, setDeferUnit] = useState(); const [status, setStatus] = useState(2); const [dateTime, setDateTime] = useState(null); const [subType, setSubType] = useState(); const [isDisabled, setIsDisabled] = useState(true); const [loading, setLoading] = useState(false); const [ahhEnable, setAhhEnable] = useState(false); const [ahEnable, setAhEnable] = useState(false); const [alEnable, setAlEnable] = useState(false); const [allEnable, setAllEnable] = useState(false); const [showMore, setShowMore] = useState(false); const [alarmId, setAlarmId] = useState(-1); const onModalOk = useMemoizedFn(async () => { const isNull = (val, bool) => { if (bool) { return Number(val); } else { return ["", undefined, null].indexOf(val) === -1 ? Number(val) : -9999; } }; const isBool = (bool) => { return bool ? bool : false; }; if (alarmId == -1) { let bool = false; if (["", undefined, null].indexOf(dateTime) !== -1 && status === 1) { setDateTime(undefined); bool = true; } const value = await form.validateFields(); if (bool) { return; } if ( (value?.ahh_enable && value?.ahh_value === "-9999") || (value?.ah_enable && value?.ah_value === "-9999") || (value?.al_enable && value?.al_value === "-9999") || (value?.all_enable && value?.all_value === "-9999") ) { message.error(`${ value?.ahh_enable && value?.ahh_value === "-9999" ? "上上限;" : "" } ${value?.ah_enable && value?.ah_value === "-9999" ? "上限;" : ""} ${value?.al_enable && value?.al_value === "-9999" ? "下限;" : ""} ${value?.all_enable && value?.all_value === "-9999" ? "下下限;" : ""} 禁止输入-9999`); return; } setLoading(true); let details = {}; if (value?.sub_type === 13) { details = { alarm_value: isNull(value?.alarm_value), }; } else { details = { ahh_value: isNull(value?.ahh_value, isBool(value?.ahh_enable)), ahh_enable: isBool(value?.ahh_enable), ah_value: isNull(value?.ah_value, isBool(value?.ah_enable)), ah_enable: isBool(value?.ah_enable), al_value: isNull(value?.al_value, isBool(value?.al_enable)), al_enable: isBool(value?.al_enable), all_value: isNull(value?.all_value, isBool(value?.all_enable)), all_enable: isBool(value?.all_enable), }; } delete value.alarm_value; delete value?.ahh_value; delete value?.ahh_enable; delete value?.ah_value; delete value?.ah_enable; delete value?.al_value; delete value?.al_enable; delete value?.all_value; delete value?.all_enable; const obj = { ...value, point_name: value?.point_name?.split("<==>")[0], threshold_high: value.threshold_high?.toString().trim() ? Number(value.threshold_high?.toString().trim()) : null, threshold_low: value.threshold_low?.toString().trim() ? Number(value.threshold_low?.toString().trim()) : null, ext_notify_list: [], high_enabled: value.threshold_high?.toString().trim() ? true : false, low_enabled: value.threshold_low?.toString().trim() ? true : false, status: value.status ? 1 : 2, defer_unit: deferUnit, defer_seconds: Number(dateTime) ?? 0, type: 1, sub_type: value?.sub_type, group_id: value?.group_id ?? 0, details, }; API2.addRule(obj) .then((res) => { if (res?.state === 0) { form.resetFields(); message.success("保存成功"); props.onConfirm(); } else { message.error(res?.state_info); } }) .finally(() => { setLoading(false); }); } else { let bool = false; if (["", undefined, null].indexOf(dateTime) !== -1 && status === 1) { setDateTime(undefined); bool = true; } const value = await form.validateFields(); if (bool) { return; } if ( (value?.ahh_enable && value?.ahh_value === "-9999") || (value?.ah_enable && value?.ah_value === "-9999") || (value?.al_enable && value?.al_value === "-9999") || (value?.all_enable && value?.all_value === "-9999") ) { message.error(`${ value?.ahh_enable && value?.ahh_value === "-9999" ? "上上限;" : "" } ${value?.ah_enable && value?.ah_value === "-9999" ? "上限;" : ""} ${value?.al_enable && value?.al_value === "-9999" ? "下限;" : ""} ${value?.all_enable && value?.all_value === "-9999" ? "下下限;" : ""} 禁止输入-9999`); return; } setLoading(true); let details = {}; if (value?.sub_type === 13) { console.log(value?.alarm_value); details = { alarm_value: isNull(value?.alarm_value), }; } else { details = { ahh_value: isNull(value?.ahh_value, isBool(value?.ahh_enable)), ahh_enable: isBool(value?.ahh_enable), ah_value: isNull(value?.ah_value, isBool(value?.ah_enable)), ah_enable: isBool(value?.ah_enable), al_value: isNull(value?.al_value, isBool(value?.al_enable)), al_enable: isBool(value?.al_enable), all_value: isNull(value?.all_value, isBool(value?.all_enable)), all_enable: isBool(value?.all_enable), }; } delete value.alarm_value; delete value?.ahh_value; delete value?.ahh_enable; delete value?.ah_value; delete value?.ah_enable; delete value?.al_value; delete value?.al_enable; delete value?.all_value; delete value?.all_enable; delete data?.Details; const obj = { ...data, ...value, point_name: value?.point_name?.split("<==>")[0], threshold_high: value.threshold_high?.toString().trim() ? Number(value.threshold_high?.toString().trim()) : null, threshold_low: value.threshold_low?.toString().trim() ? Number(value.threshold_low?.toString().trim()) : null, high_enabled: value.threshold_high?.toString().trim() ? true : false, low_enabled: value.threshold_low?.toString().trim() ? true : false, defer_unit: deferUnit, defer_seconds: dateTime ? Number(dateTime) : 0, type: 1, sub_type: value?.sub_type, group_id: value?.group_id ?? 0, details, status: value.status === true ? 1 : 2, }; API2.editRule(obj) .then((res) => { if (res?.state === 0) { form.resetFields(); message.success("保存成功"); props.onConfirm(); } else { message.error(res?.state_info); } }) .finally(() => { setLoading(false); }); } }); useImperativeHandle(ref, () => { return { ok: onModalOk, }; }); useEffect(() => { onSearch(""); }, []); useEffect(() => { async function run() { if (alarmId && alarmId !== -1) { const { state, data } = await API2.detailAlarm(Number(alarmId)); setData(data); setDeferUnit(data?.defer_unit); setStatus(data.defer_seconds > 0 ? 1 : 2); setDateTime(data?.defer_seconds); } } run(); }, [alarmId]); useEffect(() => { async function run() { if (editId && editId !== -1) { setAlarmId(editId); } else if (pointId && pointId !== -1) { const res = await API2.getRuleIdByPointId(pointId); setAlarmId(res?.data?.[0]?.id ?? -1); } } run(); }, [editId, pointId]); useEffect(() => { const run = async () => { if (data) { setSubType(data.sub_type); setDeferUnit(data?.defer_unit); setStatus(data.defer_seconds > 0 ? 1 : 2); setDateTime(data.defer_seconds); setIsDisabled(false); setAllEnable(data?.Details.all_enable); setAlEnable(data?.Details.al_enable); setAhEnable(data?.Details.ah_enable); setAhhEnable(data?.Details.ahh_enable); form.setFieldsValue({ status: data.status === 1, threshold_high: data.threshold_high, threshold_low: data.threshold_low, point_name: data.point_name, point_id: data.point_id, name: data.name, unit: data.unit, alarm_level: data.alarm_level, sub_type: data.sub_type, group_id: data.group_id, defer_unit: data.defer_unit ? data.defer_unit : undefined, defer_seconds: data.defer_seconds, ...(data.sub_type === 13 ? { alarm_value: data?.Details.alarm_value, } : { ahh_value: data?.Details.ahh_value !== -9999 ? data?.Details.ahh_value : null, ahh_enable: data?.Details.ahh_enable, ah_value: data?.Details.ah_value !== -9999 ? data?.Details.ah_value : null, ah_enable: data?.Details.ah_enable, al_value: data?.Details.al_value !== -9999 ? data?.Details.al_value : null, al_enable: data?.Details.al_enable, all_value: data?.Details.all_value !== -9999 ? data?.Details.all_value : null, all_enable: data?.Details.all_enable, }), }); } else { form.setFieldsValue({ alarm_level: 1, sub_type: 14, point_id: props.pointId ?? "", status: true, }); setAllEnable(true); setAlEnable(true); setAhEnable(true); setAhhEnable(true); form.setFieldsValue({ ahh_enable: true, ah_enable: true, al_enable: true, all_enable: true, }); setSubType(14); if (props.pointId) { const res = await API2.searchPoint({ key_word: props.pointId ?? "", count: 50, type: 1, no_child: true, }); form.setFieldsValue({ point_name: res?.data?.[0]?.name, defer_unit: res?.data?.[0]?.defer_unit, }); if (!form.getFieldValue("name")) { form.setFieldsValue({ name: res?.data?.[0]?.name, }); } setDeferUnit(res?.data?.[0]?.defer_unit); } } }; run(); }, [data, props.pointId]); const onChange = (e) => { // console.log(`selected ${e}`); console.log(e); setIsDisabled(false); setDeferUnit(Number(e.value.split("<==>")[1])); form.setFieldsValue({ name: e.value.split("<==>")[0], point_id: e.key, unit: e.value.split("<==>")[3], }); }; const [pointList, setPointList] = useState([]); const onSearch = async (value) => { const res = await API2.searchPoint({ key_word: value ?? "", count: 50, type: 1, no_child: true, }); if (res.state === 0) { setPointList(res.data || []); return; } setPointList([]); }; const onModalCancel = () => { props.onConfirm(); form.resetFields(); }; const onValuesChange = (changedValues, allValues) => { console.log(changedValues, allValues, "changedValues, allValues"); if (changedValues.hasOwnProperty("sub_type")) { setSubType(changedValues?.sub_type); if ( changedValues?.sub_type === 14 && allValues.hasOwnProperty("ahh_enable") === false && allValues.hasOwnProperty("ah_enable") === false && allValues.hasOwnProperty("al_enable") === false && allValues.hasOwnProperty("all_enable") === false ) { setAllEnable(true); setAlEnable(true); setAhEnable(true); setAhhEnable(true); form.setFieldsValue({ ahh_enable: true, ah_enable: true, al_enable: true, all_enable: true, }); } } if (changedValues.hasOwnProperty("all_enable")) { setAllEnable(changedValues?.all_enable); } if (changedValues.hasOwnProperty("al_enable")) { setAlEnable(changedValues?.al_enable); } if (changedValues.hasOwnProperty("ah_enable")) { setAhEnable(changedValues?.ah_enable); } if (changedValues.hasOwnProperty("ahh_enable")) { setAhhEnable(changedValues?.ahh_enable); } }; return (
限值报警 离散报警 e.value} > {subType === 13 && ( ({ validator(rule, value) { let regPos = /^(([^0][0-9]+|0)\.([0-9])$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9])$)|^(([1-9]+)$)/; let regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; if (regPos.test(value) || regNeg.test(value)) { //if中是正则表达是,判断是否是6位数字 return Promise.resolve(); } else { if (!Boolean(value)) return Promise.resolve(); return Promise.reject("只能输入整数、小数或负数"); //如果违反规则,就会给出提示 } }, }), ]} > )} {subType === 14 && ( <> ({ validator(rule, value) { let regPos = /^(([^0][0-9]+|0)\.([0-9])$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9])$)|^(([1-9]+)$)/; let regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; if (regPos.test(value) || regNeg.test(value)) { //if中是正则表达是,判断是否是6位数字 return Promise.resolve(); } else { if (!Boolean(value)) return Promise.resolve(); return Promise.reject("只能输入整数、小数或负数"); //如果违反规则,就会给出提示 } }, }), ]} > ({ validator(rule, value) { let regPos = /^(([^0][0-9]+|0)\.([0-9])$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9])$)|^(([1-9]+)$)/; let regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; if (regPos.test(value) || regNeg.test(value)) { //if中是正则表达是,判断是否是6位数字 return Promise.resolve(); } else { if (!Boolean(value)) return Promise.resolve(); return Promise.reject("只能输入整数、小数或负数"); //如果违反规则,就会给出提示 } }, }), ]} > ({ validator(rule, value) { let regPos = /^(([^0][0-9]+|0)\.([0-9])$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9])$)|^(([1-9]+)$)/; let regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; if (regPos.test(value) || regNeg.test(value)) { //if中是正则表达是,判断是否是6位数字 return Promise.resolve(); } else { if (!Boolean(value)) return Promise.resolve(); return Promise.reject("只能输入整数、小数或负数"); //如果违反规则,就会给出提示 } }, }), ]} > ({ validator(rule, value) { let regPos = /^(([^0][0-9]+|0)\.([0-9])$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9])$)|^(([1-9]+)$)/; let regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; if (regPos.test(value) || regNeg.test(value)) { //if中是正则表达是,判断是否是6位数字 return Promise.resolve(); } else { if (!Boolean(value)) return Promise.resolve(); return Promise.reject("只能输入整数、小数或负数"); //如果违反规则,就会给出提示 } }, }), ]} > )} {!showMore && ( { setShowMore(true); }} > 更多 } > )} {showMore && ( <> { console.log(e.target.value); setDateTime(e.target.value?.replace(/\D/g, "")); }} placeholder={TranslateText(["请输入", "Please input"])} style={{ width: 100 }} /> {deferUnit === 1 ? TranslateText(["秒", "seconds"]) : TranslateText(["分钟", "minutes"])}{" "} {TranslateText(["后报警", "of duration"])} {dateTime !== null && ["", undefined, null].indexOf(dateTime) !== -1 && status === 1 && !isDisabled && (
请输入数字
)}
)} {showMore && ( { setShowMore(false); }} > 收起 } > )}
); }; export default forwardRef(Easy);