Просмотр исходного кода

添加告警开关和延时告警功能,移除多余的显示逻辑

valentichu 4 месяцев назад
Родитель
Сommit
8b34d0283e
2 измененных файлов с 81 добавлено и 40 удалено
  1. 80 3
      src/pages/Alarm/components/complex.jsx
  2. 1 37
      src/pages/Alarm/components/easy.jsx

+ 80 - 3
src/pages/Alarm/components/complex.jsx

@@ -5,7 +5,7 @@ import React, {
   forwardRef,
   useImperativeHandle,
 } from "react";
-import { Form, Input, Select, message } from "antd";
+import { Form, Input, Select, Switch, Checkbox, App } from "antd";
 import { Modal, Button, Table, Radio } from "antd";
 import Formular from "./components/Formular";
 import API2 from "../../../api/alarm";
@@ -33,7 +33,10 @@ function TranslateText(arr) {
 }
 
 const Complex = (props, ref) => {
+  const { message } = App.useApp();
   const { editId, groupList = [], showList, formula } = props;
+  const [status, setStatus] = useState(2);
+  const [dateTime, setDateTime] = useState(null);
 
   const [form] = Form.useForm();
   const formuRef = useRef();
@@ -70,7 +73,10 @@ const Complex = (props, ref) => {
     async function run() {
       if (alarmId && alarmId != -1) {
         const { state, data } = await API2.detailAlarm(Number(alarmId));
+        setStatus(data.defer_seconds > 0 ? 1 : 2);
+        setDateTime(data.defer_seconds);
         form.setFieldsValue({
+          status: data.status === 1,
           name: data.name,
           alarm_level: data.alarm_level,
           group_id: data.group_id,
@@ -102,8 +108,9 @@ const Complex = (props, ref) => {
         is_complex: true,
         type: 1,
         sub_type: 12,
-        status: 1,
+        status: value.status ? 1 : 2,
         defer_unit: 2,
+        defer_seconds: Number(dateTime) ?? 0,
       };
 
       const { state, data, state_info } = await API2.addRule(obj);
@@ -383,6 +390,76 @@ const Complex = (props, ref) => {
                   </Select>
                 </Form.Item>
 
+                <Form.Item
+                  label={TranslateText(["告警开关", "Enable"])}
+                  name="status"
+                >
+                  <Switch size={"small"} />
+                </Form.Item>
+
+                <Form.Item
+                  name={"defer_seconds"}
+                  label={TranslateText(["延时告警", "Delayed alarm"])}
+                >
+                  <div>
+                    <div
+                      style={{
+                        display: "flex",
+                        gap: 8,
+                        alignItems: "center",
+                      }}
+                    >
+                      <Checkbox
+                        checked={status === 1}
+                        onChange={(e) => {
+                          setStatus(e.target.checked ? 1 : 2);
+                          if (e.target.checked) {
+                            setDateTime(null);
+                          } else {
+                            setDateTime(0);
+                          }
+                        }}
+                      ></Checkbox>
+                      <span
+                        style={{
+                          color: "var(--dt-text-color1)",
+                          fontWeight: 400,
+                          fontSize: 14,
+                        }}
+                      >
+                        {TranslateText(["持续", "Alarm after"])}
+                      </span>
+                      <Input
+                        disabled={status !== 1}
+                        value={dateTime}
+                        onChange={(e) => {
+                          console.log(e.target.value);
+                          setDateTime(e.target.value?.replace(/\D/g, ""));
+                        }}
+                        placeholder={TranslateText(["请输入", "Please input"])}
+                        style={{ width: 100 }}
+                      />
+                      <span
+                        style={{
+                          color: "var(--dt-text-color1)",
+                          fontWeight: 400,
+                          fontSize: 14,
+                        }}
+                      >
+                        {TranslateText(["分钟", "minutes"])}{" "}
+                        {TranslateText(["后报警", "of duration"])}
+                      </span>
+                    </div>
+                    {dateTime !== null &&
+                      ["", undefined, null].indexOf(dateTime) !== -1 &&
+                      status === 1 && (
+                        <div style={{ color: "var(--dt-error-color1)" }}>
+                          请输入数字
+                        </div>
+                      )}
+                  </div>
+                </Form.Item>
+
                 <Form.Item
                   label={TranslateText(["条件符号", "Symbol"])}
                   // name="symb"
@@ -404,7 +481,7 @@ const Complex = (props, ref) => {
                       {">"}
                     </Button>
                     <Button type="primary" onClick={symbClick}>
-                      =
+                      ==
                     </Button>
                     <Button type="primary" onClick={symbClick}>{`<`}</Button>
                     <Button type="primary" onClick={symbClick}>

+ 1 - 37
src/pages/Alarm/components/easy.jsx

@@ -59,7 +59,6 @@ const Easy = (props, ref) => {
   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 () => {
@@ -814,24 +813,7 @@ const Easy = (props, ref) => {
         <Form.Item label={TranslateText(["告警开关", "Enable"])} name="status">
           <Switch size={"small"} />
         </Form.Item>
-
-        {!showMore && (
-          <Form.Item
-            label={
-              <Button
-                type="link"
-                onClick={() => {
-                  setShowMore(true);
-                }}
-                style={{ marginLeft: -16 }}
-              >
-                {TranslateText(["更多", "More"])}
-                <DownOutlined></DownOutlined>
-              </Button>
-            }
-          ></Form.Item>
-        )}
-
+        
         <Form.Item
           label={TranslateText(["单位", "Unit"])}
           name="unit"
@@ -841,7 +823,6 @@ const Easy = (props, ref) => {
               message: TranslateText(["请输入单位", "Please input"]),
             },
           ]}
-          style={!showMore ? { display: "none" } : null}
         >
           <Input
             placeholder={TranslateText(["请输入", "Please input"])}
@@ -852,7 +833,6 @@ const Easy = (props, ref) => {
         <Form.Item
           label={TranslateText(["告警组", "Group"])}
           name={"group_id"}
-          style={!showMore ? { display: "none" } : null}
         >
           <Select
             style={{ width: 200 }}
@@ -878,7 +858,6 @@ const Easy = (props, ref) => {
           name={isDisabled ? "" : "defer_seconds"}
           disabled={isDisabled}
           label={TranslateText(["延时告警", "Delayed alarm"])}
-          style={!showMore ? { display: "none" } : null}
         >
           <div>
             <div
@@ -942,21 +921,6 @@ const Easy = (props, ref) => {
               )}
           </div>
         </Form.Item>
-
-        {showMore && (
-          <Form.Item
-            label={
-              <Button
-                type="link"
-                onClick={() => {
-                  setShowMore(false);
-                }}
-              >
-                收起<UpOutlined></UpOutlined>
-              </Button>
-            }
-          ></Form.Item>
-        )}
       </Form>
     </div>
   );