| ... | ... | @@ -68,17 +68,19 @@ | 
| 68 | 68 | <div class="w-3/4" style="margin-left: 40px"> | 
| 69 | 69 | <!-- 报警严重程度 --> | 
| 70 | 70 | <div style="margin-left: 10px; margin-top: 20px" | 
| 71 |  | -                      ><BasicForm @register="registerFormCreateAlarm" /> | 
| 72 |  | -                      <div | 
| 73 |  | -                        v-for="(i8, index8) in getStepThreeEditStatus ? createAlarmArray : []" | 
| 74 |  | -                        :key="index8" | 
| 75 |  | -                        style="position: relative" | 
| 76 |  | -                      > | 
| 77 |  | -                        <p | 
| 78 |  | -                          style="position: absolute; top: -6vh; left: 6.5vw" | 
| 79 |  | -                          v-if="index8 == createIndex" | 
| 80 |  | -                          >{{ formatAlarmFunc(i8) }}</p | 
|  | 71 | +                      ><BasicForm v-if="childItem" @register="registerFormCreateAlarm" /> | 
|  | 72 | +                      <div> | 
|  | 73 | +                        <div | 
|  | 74 | +                          v-for="(i8, index8) in getStepThreeEditStatus ? createAlarmArray : []" | 
|  | 75 | +                          :key="index8" | 
|  | 76 | +                          style="position: relative" | 
| 81 | 77 | > | 
|  | 78 | +                          <p | 
|  | 79 | +                            style="position: absolute; top: -10.2vh; left: 6.5vw; z-index: 1" | 
|  | 80 | +                            v-if="index8 == createIndex" | 
|  | 81 | +                            >{{ formatAlarmFunc(i8) }}</p | 
|  | 82 | +                          > | 
|  | 83 | +                        </div> | 
| 82 | 84 | </div> | 
| 83 | 85 | </div> | 
| 84 | 86 | <!-- 报警严重程度 --> | 
| ... | ... | @@ -92,7 +94,6 @@ | 
| 92 | 94 | @click="handleOpenAlaramRuleConditions" | 
| 93 | 95 | >添加</Button | 
| 94 | 96 | > | 
| 95 |  | - | 
| 96 | 97 | <template | 
| 97 | 98 | v-for="(v2, index2) in getStepThreeEditStatus | 
| 98 | 99 | ? getFilterStepThreeEditArr | 
| ... | ... | @@ -106,6 +107,14 @@ | 
| 106 | 107 | >报警规则条件:{{ openRuleConditionComp(v2) }}</p | 
| 107 | 108 | > | 
| 108 | 109 | </template> | 
|  | 110 | +                        <template | 
|  | 111 | +                          v-for="(vi, indexi) in isEditDataAndValue ? getEditDataAndValue : []" | 
|  | 112 | +                          :key="indexi" | 
|  | 113 | +                        > | 
|  | 114 | +                          <p v-if="indexi == createIndex && isEditDataAndValue" | 
|  | 115 | +                            >报警规则条件:{{ isEditDataAndValueFunc(vi) }}</p | 
|  | 116 | +                          > | 
|  | 117 | +                        </template> | 
| 109 | 118 | </div> | 
| 110 | 119 | <div style="white-space: wrap; margin-top: 25px" class="mt-4 ml-4" | 
| 111 | 120 | >报警启用规则: | 
| ... | ... | @@ -143,13 +152,14 @@ | 
| 143 | 152 | <BasicForm @register="registerFormChangeDetail" /> | 
| 144 | 153 | </div> | 
| 145 | 154 | <div | 
|  | 155 | +                            style="position: relative" | 
| 146 | 156 | v-for="(i7, index7) in getStepThreeEditStatus | 
| 147 | 157 | ? detailDetailModelArray | 
| 148 | 158 | : []" | 
| 149 | 159 | :key="index7" | 
| 150 | 160 | > | 
| 151 | 161 | <p | 
| 152 |  | -                              style="margin-top: 1.5vh; margin-left: 5.6vw" | 
|  | 162 | +                              style="position: absolute; top: -2.3vh; left: 5.68vw" | 
| 153 | 163 | v-if="index7 == createIndex" | 
| 154 | 164 | >{{ i7 }}</p | 
| 155 | 165 | > | 
| ... | ... | @@ -164,7 +174,7 @@ | 
| 164 | 174 | </div> | 
| 165 | 175 | <div | 
| 166 | 176 | class="remove-type" | 
| 167 |  | -                      style="display: inline-block; position: relative; top: -257px; left: 757px" | 
|  | 177 | +                      style="display: inline-block; position: relative; top: -33vh; left: 39.4vw" | 
| 168 | 178 | > | 
| 169 | 179 | <img | 
| 170 | 180 | v-if="isAddRuleStatus" | 
| ... | ... | @@ -216,7 +226,7 @@ | 
| 216 | 226 | /> | 
| 217 | 227 | </div> | 
| 218 | 228 | <div class="aic mb-1" style="border: 1px solid #bfbfbf"> | 
| 219 |  | -                <div class="w-3/4" style="margin-left: 40px"> | 
|  | 229 | +                <div class="w-3/4 aic-class" style="margin-left: 40px"> | 
| 220 | 230 | <div style="margin-left: 5px"> | 
| 221 | 231 | <div style="color: #f5594e" class="mt-4 ml-4" | 
| 222 | 232 | >报警规则条件: | 
| ... | ... | @@ -327,6 +337,7 @@ | 
| 327 | 337 | step3CreateAlarm, | 
| 328 | 338 | dashboardFormScheme, | 
| 329 | 339 | isWhereType, | 
|  | 340 | +    isLostFocux, | 
| 330 | 341 | formChangeDetailSchema, | 
| 331 | 342 | } from './data'; | 
| 332 | 343 | import { PlusCircleOutlined } from '@ant-design/icons-vue'; | 
| ... | ... | @@ -335,8 +346,8 @@ | 
| 335 | 346 | import EnableRule from './cpns/enablerule/index.vue'; | 
| 336 | 347 | import AlarmRuleConditions from './cpns/alarmruleconditions/index.vue'; | 
| 337 | 348 | import { Button } from '/@/components/Button'; | 
| 338 |  | - | 
| 339 | 349 | export const isWhereTypeValueDisabled = ref(false); | 
|  | 350 | + | 
| 340 | 351 | export default defineComponent({ | 
| 341 | 352 | components: { | 
| 342 | 353 | BasicForm, | 
| ... | ... | @@ -466,20 +477,20 @@ | 
| 466 | 477 | let fliterClearTempRuleConditionTempArr = ref<[]>([]); | 
| 467 | 478 | let fliterClearTempOpenRuleTempArr = ref<[]>([]); | 
| 468 | 479 | const getStepThreeEditStatus: any = ref(false); | 
|  | 480 | +      const isEditDataAndValue = ref(false); | 
| 469 | 481 | const getStepThreeEditArr = ref<[]>([]); | 
| 470 | 482 | const getFilterStepThreeEditArr = ref<[]>([]); | 
| 471 | 483 | const getFilterStepThreeEditClearArr = ref<[]>([]); | 
| 472 | 484 | const getFilterStepThreeClearDetailEditArr = ref<[]>([]); | 
| 473 | 485 | let getIsShowAddRule = true; | 
| 474 |  | - | 
| 475 | 486 | const detailDetailModelArray = ref<[]>([]); | 
| 476 | 487 | const createAlarmArray = ref<[]>([]); | 
|  | 488 | +      const isLostFocuxStatus = ref(true); | 
|  | 489 | +      const getEditDataAndValue = ref<[]>([]); | 
| 477 | 490 |  | 
| 478 |  | -      // getIsShowAddRule.value = props.isShowAddRule; | 
| 479 |  | -      // console.log(getIsShowAddRule.value); | 
| 480 | 491 | setTimeout(() => { | 
| 481 | 492 | getIsShowAddRule = props.isShowAddRule; | 
| 482 |  | -      }, 100); | 
|  | 493 | +      }, 10); | 
| 483 | 494 |  | 
| 484 | 495 | const log = (e) => { | 
| 485 | 496 | console.log(e); | 
| ... | ... | @@ -550,11 +561,7 @@ | 
| 550 | 561 | //详情模板 | 
| 551 | 562 | const [ | 
| 552 | 563 | registerFormChangeDetail, | 
| 553 |  | -        { | 
| 554 |  | -          getFieldsValue: getRegisterFormChangeDetail, | 
| 555 |  | -          resetFields: resetRegisterFormChangeDetail, | 
| 556 |  | -          // setFieldsValue: setCreateRegisterFormChangeDetail, | 
| 557 |  | -        }, | 
|  | 564 | +        { getFieldsValue: getRegisterFormChangeDetail, resetFields: resetRegisterFormChangeDetail }, | 
| 558 | 565 | ] = useForm({ | 
| 559 | 566 | labelWidth: 120, | 
| 560 | 567 | schemas: formChangeDetailSchema, | 
| ... | ... | @@ -611,7 +618,7 @@ | 
| 611 | 618 | resetRegisterFormClearChangeDetailFunc(); | 
| 612 | 619 | resetAllTemplateFunc(); | 
| 613 | 620 | resetRegisterFormCreateAlarmFunc(); | 
| 614 |  | -        }, 100); | 
|  | 621 | +        }, 10); | 
| 615 | 622 | }; | 
| 616 | 623 | //重置报警启用规则-报警规则条件 | 
| 617 | 624 | const resetAllTemplateFunc = () => { | 
| ... | ... | @@ -656,55 +663,33 @@ | 
| 656 | 663 | const setTransmitAlarmFormFunc = (v) => { | 
| 657 | 664 | setTransmitAlarmFunc(v); | 
| 658 | 665 | }; | 
| 659 |  | -      const setRegisterFormCreateAlarmFunc = (v) => { | 
| 660 |  | -        setRegisterFormCreateAlarm(v); | 
|  | 666 | +      const setRegisterFormCreateAlarmFunc = async () => { | 
|  | 667 | +        setRegisterFormCreateAlarm({ | 
|  | 668 | +          default: '', | 
|  | 669 | +        }); | 
| 661 | 670 | }; | 
| 662 |  | - | 
| 663 |  | -      const optionsAlaram = [ | 
| 664 |  | -        { | 
| 665 |  | -          value: 'CRITICAL', | 
| 666 |  | -          label: '危险', | 
| 667 |  | -        }, | 
| 668 |  | -        { | 
| 669 |  | -          value: 'MAJOR', | 
| 670 |  | -          label: '重要', | 
| 671 |  | -        }, | 
| 672 |  | -        { | 
| 673 |  | -          value: 'MINOR', | 
| 674 |  | -          label: '次要', | 
| 675 |  | -        }, | 
| 676 |  | -        { | 
| 677 |  | -          value: 'WARNING', | 
| 678 |  | -          label: '警告', | 
| 679 |  | -        }, | 
| 680 |  | -        { | 
| 681 |  | -          value: 'INDETERMINATE', | 
| 682 |  | -          label: '不确定', | 
| 683 |  | -        }, | 
| 684 |  | -      ]; | 
| 685 | 671 | const openRuleComp = (v1) => { | 
| 686 |  | -        let newOpenRuleComp = null; | 
| 687 |  | -        optionsAlaram.forEach((f) => { | 
| 688 |  | -          if ( | 
| 689 |  | -            f.value === v1?.MAJOR || | 
| 690 |  | -            v1?.MINOR || | 
| 691 |  | -            v1?.INDETERMINATE || | 
| 692 |  | -            v1?.CRITICAL || | 
| 693 |  | -            v1?.WARNING | 
| 694 |  | -          ) { | 
| 695 |  | -            newOpenRuleComp = | 
| 696 |  | -              v1?.MAJOR || | 
| 697 |  | -              v1?.MINOR || | 
| 698 |  | -              v1?.INDETERMINATE || | 
| 699 |  | -              v1?.CRITICAL || | 
| 700 |  | -              v1?.WARNING?.schedule?.type; | 
|  | 672 | +        let openSchemObj = {}; | 
|  | 673 | +        for (let i in v1) { | 
|  | 674 | +          if (i == 'CRITICAL') { | 
|  | 675 | +            openSchemObj = v1[i]; | 
|  | 676 | +          } else if (i == 'MAJOR') { | 
|  | 677 | +            openSchemObj = v1[i]; | 
|  | 678 | +          } else if (i == 'MINOR') { | 
|  | 679 | +            openSchemObj = v1[i]; | 
|  | 680 | +          } else if (i == 'WARNING') { | 
|  | 681 | +            openSchemObj = v1[i]; | 
|  | 682 | +          } else if (i == 'INDETERMINATE') { | 
|  | 683 | +            openSchemObj = v1[i]; | 
| 701 | 684 | } | 
| 702 |  | -        }); | 
| 703 |  | -        return newOpenRuleComp?.schedule?.type == 'ANY_TIME' | 
| 704 |  | -          ? '始终启用' | 
| 705 |  | -          : newOpenRuleComp?.schedule?.type == 'SPECIFIC_TIME' | 
| 706 |  | -          ? '定时启用' | 
| 707 |  | -          : '自定义启用'; | 
|  | 685 | +        } | 
|  | 686 | +        let formatSchemeMap = | 
|  | 687 | +          openSchemObj?.schedule.type == 'ANY_TIME' | 
|  | 688 | +            ? '始终启用' | 
|  | 689 | +            : openSchemObj?.schedule.type == 'SPECIFIC_TIME' | 
|  | 690 | +            ? '定时启用' | 
|  | 691 | +            : '自定义启用'; | 
|  | 692 | +        return formatSchemeMap; | 
| 708 | 693 | }; | 
| 709 | 694 | //清除报警规则 | 
| 710 | 695 | const openClearRuleConditionComp = (v4) => { | 
| ... | ... | @@ -781,6 +766,7 @@ | 
| 781 | 766 | getFilterStepThreeEditArr.value = []; | 
| 782 | 767 | getFilterStepThreeEditClearArr.value = []; | 
| 783 | 768 | getStepThreeEditStatus.value = v.isEditStatus; | 
|  | 769 | +          isEditDataAndValue.value = v.isEditStatus; | 
| 784 | 770 | getStepThreeEditArr.value = v.stepThreeData; | 
| 785 | 771 | if (getFilterStepThreeEditClearArr.value.length == 0) { | 
| 786 | 772 | getFilterStepThreeEditClearArr.value.push(v.stepThreeClearData as never); | 
| ... | ... | @@ -916,7 +902,9 @@ | 
| 916 | 902 | isWhereTypeValueDisabled.value = true; | 
| 917 | 903 | } | 
| 918 | 904 | }); | 
| 919 |  | - | 
|  | 905 | +      watch(isLostFocux, (nV) => { | 
|  | 906 | +        isLostFocuxStatus.value = nV; | 
|  | 907 | +      }); | 
| 920 | 908 | //报警规则 | 
| 921 | 909 | //启用规则 | 
| 922 | 910 | const getAllFieldsEnabFunc = (v) => { | 
| ... | ... | @@ -930,6 +918,34 @@ | 
| 930 | 918 | fliterTempRuleConditionTempArr.value.push({ | 
| 931 | 919 | condition: addNewRuleTem.condition.condition, | 
| 932 | 920 | }); | 
|  | 921 | +        if (isEditDataAndValue.value == true) { | 
|  | 922 | +          getEditDataAndValue.value.push({ | 
|  | 923 | +            condition: addNewRuleTem.condition.condition, | 
|  | 924 | +          }); | 
|  | 925 | +        } | 
|  | 926 | +      }; | 
|  | 927 | +      //格式化编辑 | 
|  | 928 | +      const isEditDataAndValueFunc = (v) => { | 
|  | 929 | +        let formatMap = v.condition.map((f) => { | 
|  | 930 | +          return f.predicate.operation == 'EQUAL' | 
|  | 931 | +            ? f.key.key + '等于' + f.predicate.value.defaultValue | 
|  | 932 | +            : f.predicate.operation == 'STARTS_WITH' | 
|  | 933 | +            ? f.key.key + '开始于' + f.predicate.value.defaultValue | 
|  | 934 | +            : f.predicate.operation == 'ENDS_WITH' | 
|  | 935 | +            ? f.key.key + '结束于' + f.predicate.value.defaultValue | 
|  | 936 | +            : f.predicate.operation == 'NOT_CONTAINS' | 
|  | 937 | +            ? f.key.key + '不包含' + f.predicate.value.defaultValue | 
|  | 938 | +            : f.predicate.operation == 'NOT_EQUAL' | 
|  | 939 | +            ? f.key.key + '不等于' + f.predicate.value.defaultValue | 
|  | 940 | +            : f.predicate.operation == 'GREATER' | 
|  | 941 | +            ? f.key.key + '大于' + f.predicate.value.defaultValue | 
|  | 942 | +            : f.predicate.operation == 'LESS' | 
|  | 943 | +            ? f.key.key + '小于' + f.predicate.value.defaultValue | 
|  | 944 | +            : f.predicate.operation == 'GREATER_OR_EQUAL' | 
|  | 945 | +            ? f.key.key + '大于或等于' + f.predicate.value.defaultValue | 
|  | 946 | +            : f.key.key + '小于或等于' + f.predicate.value.defaultValue; | 
|  | 947 | +        }); | 
|  | 948 | +        return formatMap; | 
| 933 | 949 | }; | 
| 934 | 950 | //格式化新增 | 
| 935 | 951 | const formatAddRuleFunc = (v) => { | 
| ... | ... | @@ -996,7 +1012,7 @@ | 
| 996 | 1012 | function generateUUID() { | 
| 997 | 1013 | let d = new Date().getTime(); | 
| 998 | 1014 | if (window.performance && typeof window.performance.now === 'function') { | 
| 999 |  | -          d += performance.now(); //use high-precision timer if available | 
|  | 1015 | +          d += performance.now(); | 
| 1000 | 1016 | } | 
| 1001 | 1017 | let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { | 
| 1002 | 1018 | let r = (d + Math.random() * 16) % 16 | 0; | 
| ... | ... | @@ -1043,20 +1059,17 @@ | 
| 1043 | 1059 | openModal1(true); | 
| 1044 | 1060 | setTimeout(() => { | 
| 1045 | 1061 | proxy.$refs.getChildData1.resetDataFunc(); | 
| 1046 |  | -          }, 1000); | 
| 1047 |  | -        }, 50); | 
|  | 1062 | +          }, 10); | 
|  | 1063 | +        }, 10); | 
| 1048 | 1064 | }; | 
| 1049 | 1065 | const handleOpenEnableRule = () => { | 
| 1050 |  | -        // if (getStepThreeEditStatus.value == true) { | 
| 1051 |  | -        //   getStepThreeEditStatus.value = !getStepThreeEditStatus.value; | 
| 1052 |  | -        // } | 
| 1053 | 1066 | isRuleAlarmRuleConditions.value = 2; | 
| 1054 | 1067 | setTimeout(() => { | 
| 1055 | 1068 | openModal2(true); | 
| 1056 | 1069 | setTimeout(() => { | 
| 1057 | 1070 | proxy.$refs.getChildData2.resetDataFunc(); | 
| 1058 |  | -          }, 1000); | 
| 1059 |  | -        }, 50); | 
|  | 1071 | +          }, 10); | 
|  | 1072 | +        }, 10); | 
| 1060 | 1073 | }; | 
| 1061 | 1074 | const handleOpenAlaramRuleConditions = () => { | 
| 1062 | 1075 | isRuleAlarmRuleConditions.value = 3; | 
| ... | ... | @@ -1065,11 +1078,11 @@ | 
| 1065 | 1078 | try { | 
| 1066 | 1079 | setTimeout(() => { | 
| 1067 | 1080 | proxy.$refs.getChildData3.resetDataFunc(); | 
| 1068 |  | -            }, 1000); | 
|  | 1081 | +            }, 10); | 
| 1069 | 1082 | } catch (e) { | 
| 1070 | 1083 | return e; | 
| 1071 | 1084 | } | 
| 1072 |  | -        }, 500); | 
|  | 1085 | +        }, 10); | 
| 1073 | 1086 | }; | 
| 1074 | 1087 | const handleOpenClearDetailTemplate = () => { | 
| 1075 | 1088 | isRuleAlarmRuleConditions.value = 4; | 
| ... | ... | @@ -1078,29 +1091,23 @@ | 
| 1078 | 1091 | try { | 
| 1079 | 1092 | setTimeout(() => { | 
| 1080 | 1093 | proxy.$refs.getChildData1.resetDataFunc(); | 
| 1081 |  | -            }, 1000); | 
|  | 1094 | +            }, 10); | 
| 1082 | 1095 | } catch (e) { | 
| 1083 | 1096 | return e; | 
| 1084 | 1097 | } | 
| 1085 |  | -        }, 500); | 
|  | 1098 | +        }, 10); | 
| 1086 | 1099 | }; | 
| 1087 | 1100 | const handleOpenClearEnableRule = () => { | 
| 1088 | 1101 | isRuleAlarmRuleConditions.value = 5; | 
| 1089 | 1102 | setTimeout(() => { | 
| 1090 | 1103 | openModal5(true); | 
| 1091 |  | -          setTimeout(() => { | 
| 1092 |  | -            // proxy.$refs.getChildData2.resetDataFunc(); | 
| 1093 |  | -          }, 1000); | 
| 1094 |  | -        }, 50); | 
|  | 1104 | +        }, 10); | 
| 1095 | 1105 | }; | 
| 1096 | 1106 | const handleOpenClearAlaramRuleConditions = () => { | 
| 1097 | 1107 | isRuleAlarmRuleConditions.value = 6; | 
| 1098 | 1108 | setTimeout(() => { | 
| 1099 | 1109 | openModal6(true); | 
| 1100 |  | -          setTimeout(() => { | 
| 1101 |  | -            // proxy.$refs.getChildData3.resetDataFunc(); | 
| 1102 |  | -          }, 1000); | 
| 1103 |  | -        }, 50); | 
|  | 1110 | +        }, 10); | 
| 1104 | 1111 | }; | 
| 1105 | 1112 |  | 
| 1106 | 1113 | return { | 
| ... | ... | @@ -1182,6 +1189,10 @@ | 
| 1182 | 1189 | deleteCondition, | 
| 1183 | 1190 | setCreateRegisterFormChangeDetailFunc, | 
| 1184 | 1191 | detailDetailModelArray, | 
|  | 1192 | +        isLostFocuxStatus, | 
|  | 1193 | +        isEditDataAndValue, | 
|  | 1194 | +        getEditDataAndValue, | 
|  | 1195 | +        isEditDataAndValueFunc, | 
| 1185 | 1196 | }; | 
| 1186 | 1197 | }, | 
| 1187 | 1198 | }); | 
| ... | ... | @@ -1203,9 +1214,15 @@ | 
| 1203 | 1214 | align-items: center; | 
| 1204 | 1215 | border-radius: 10px; | 
| 1205 | 1216 | margin-top: 15px; | 
|  | 1217 | +    .aic-class { | 
|  | 1218 | +      position: relative; | 
|  | 1219 | +    } | 
| 1206 | 1220 | } | 
| 1207 | 1221 |  | 
| 1208 | 1222 | :deep(.vben-collapse-container__header) { | 
| 1209 | 1223 | border: none; | 
| 1210 | 1224 | } | 
|  | 1225 | +  :deep .ant-select-selection-placeholder { | 
|  | 1226 | +    display: none; | 
|  | 1227 | +  } | 
| 1211 | 1228 | </style> | 
... | ... |  |