Showing
21 changed files
with
727 additions
and
385 deletions
... | ... | @@ -34,7 +34,7 @@ div td.mxWindowTitle { |
34 | 34 | } |
35 | 35 | .geEditor input, .geEditor select, |
36 | 36 | .geEditor textarea, .geEditor button { |
37 | - font-size: inherit; | |
37 | + font-size: inherit; | |
38 | 38 | } |
39 | 39 | .geMenubarContainer, .geToolbarContainer, .geHsplit, |
40 | 40 | .geVsplit, .mxWindowTitle, .geSidebarContainer, |
... | ... | @@ -84,7 +84,7 @@ html > body > div > div.geToolbarContainer.geSimpleMainMenu .geToolbarContainer{ |
84 | 84 | cursor:default !important; |
85 | 85 | } |
86 | 86 | .geBackgroundPage { |
87 | - box-shadow:0px 0px 2px 1px #d1d1d1; | |
87 | + box-shadow:0px 0px 2px 1px #d1d1d1; | |
88 | 88 | } |
89 | 89 | .geSidebarContainer a, .geMenubarContainer a, .geToolbar a { |
90 | 90 | color:#000000; |
... | ... | @@ -217,11 +217,11 @@ a.geStatus .geStatusMessage { |
217 | 217 | padding:4px 6px 4px 6px; |
218 | 218 | font-size:12px; |
219 | 219 | background: -webkit-linear-gradient(top,#dff0d8 0,#c8e5bc 100%); |
220 | - background: -o-linear-gradient(top,#dff0d8 0,#c8e5bc 100%); | |
221 | - background: -webkit-gradient(linear,left top,left bottom,from(#dff0d8),to(#c8e5bc)); | |
222 | - background: linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%); | |
223 | - background-repeat: repeat-x; | |
224 | - border:1px solid #b2dba1; | |
220 | + background: -o-linear-gradient(top,#dff0d8 0,#c8e5bc 100%); | |
221 | + background: -webkit-gradient(linear,left top,left bottom,from(#dff0d8),to(#c8e5bc)); | |
222 | + background: linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%); | |
223 | + background-repeat: repeat-x; | |
224 | + border:1px solid #b2dba1; | |
225 | 225 | border-radius:3px; |
226 | 226 | color:#3c763d !important; |
227 | 227 | } |
... | ... | @@ -237,15 +237,15 @@ a.geStatus .geStatusMessage { |
237 | 237 | -moz-box-shadow: 2px 2px 3px 0px #ddd; |
238 | 238 | box-shadow: 2px 2px 3px 0px #ddd; |
239 | 239 | } |
240 | -.geEditor input, .geEditor button, .geEditor select, .geColorBtn { | |
240 | +.geEditor input, .geEditor button:not([class^="ant"]), .geEditor select, .geColorBtn { | |
241 | 241 | border: 1px solid #d8d8d8; |
242 | 242 | border-radius: 4px; |
243 | 243 | } |
244 | -.geEditor button, .geEditor select, .geColorBtn { | |
244 | +.geEditor button:not([class*="ant-"]), .geEditor select, .geColorBtn { | |
245 | 245 | background:#eee; |
246 | 246 | } |
247 | -.geEditor button:hover:not([disabled], .geBigButton, .geShareBtn), | |
248 | -.geEditor select:hover:not([disabled]), .geColorBtn:hover:not([disabled]) { | |
247 | +.geEditor button:hover:not([class*="ant-"], [disabled], .geBigButton, .geShareBtn), | |
248 | +.geEditor select:hover:not([class*="ant-"], [disabled]), .geColorBtn:hover:not([disabled], [class*="ant-"]) { | |
249 | 249 | background:#e5e5e5; |
250 | 250 | } |
251 | 251 | .geColorDropper { |
... | ... | @@ -979,9 +979,9 @@ table.mxPopupMenu tr { |
979 | 979 | font-size:4pt; |
980 | 980 | } |
981 | 981 | html td.mxWindowTitle { |
982 | - color:rgb(112, 112, 112); | |
982 | + color:rgb(112, 112, 112); | |
983 | 983 | background:#f1f3f4; |
984 | - padding:4px; | |
984 | + padding:4px; | |
985 | 985 | } |
986 | 986 | table.geProperties { |
987 | 987 | table-layout:fixed; |
... | ... | @@ -996,46 +996,46 @@ table.geProperties tr td { |
996 | 996 | border: 1px solid #4472C4; |
997 | 997 | } |
998 | 998 | .gePropHeader>.gePropHeaderCell { |
999 | - border-top: 0; | |
1000 | - border-bottom: 0; | |
1001 | - text-align: left; | |
999 | + border-top: 0; | |
1000 | + border-bottom: 0; | |
1001 | + text-align: left; | |
1002 | 1002 | width: 50%; |
1003 | 1003 | } |
1004 | 1004 | .gePropHeader>.gePropHeaderCell:first-child { |
1005 | - border-left: none; | |
1005 | + border-left: none; | |
1006 | 1006 | } |
1007 | 1007 | .gePropHeader>.gePropHeaderCell:last-child { |
1008 | - border-right: none; | |
1008 | + border-right: none; | |
1009 | 1009 | } |
1010 | 1010 | .gePropHeader { |
1011 | - background: #e5e5e5; | |
1012 | - color: black; | |
1011 | + background: #e5e5e5; | |
1012 | + color: black; | |
1013 | 1013 | } |
1014 | 1014 | .gePropRowCell { |
1015 | - border-left: 1px solid #f3f3f3; | |
1015 | + border-left: 1px solid #f3f3f3; | |
1016 | 1016 | white-space:nowrap; |
1017 | 1017 | text-overflow:ellipsis; |
1018 | 1018 | overflow:hidden; |
1019 | - max-width: 50%; | |
1019 | + max-width: 50%; | |
1020 | 1020 | } |
1021 | 1021 | .gePropRow>.gePropRowCell { |
1022 | - background: #fff; | |
1022 | + background: #fff; | |
1023 | 1023 | } |
1024 | 1024 | .gePropRowAlt>.gePropRowCell { |
1025 | - background: #fcfcfc; | |
1025 | + background: #fcfcfc; | |
1026 | 1026 | } |
1027 | 1027 | .gePropRowDark>.gePropRowCell { |
1028 | - background: #fff; | |
1029 | - color: #305496; | |
1030 | - font-weight: bold; | |
1028 | + background: #fff; | |
1029 | + color: #305496; | |
1030 | + font-weight: bold; | |
1031 | 1031 | } |
1032 | 1032 | .gePropRowDarkAlt>.gePropRowCell { |
1033 | - background: #D9E1F2; | |
1034 | - color: #305496; | |
1035 | - font-weight: bold; | |
1033 | + background: #D9E1F2; | |
1034 | + color: #305496; | |
1035 | + font-weight: bold; | |
1036 | 1036 | } |
1037 | 1037 | .gePropEditor input:invalid { |
1038 | - border: 1px solid red; | |
1038 | + border: 1px solid red; | |
1039 | 1039 | } |
1040 | 1040 | /* Templates dialog css */ |
1041 | 1041 | .geTemplateDlg { |
... | ... | @@ -1043,8 +1043,8 @@ table.geProperties tr td { |
1043 | 1043 | height: 100%; |
1044 | 1044 | } |
1045 | 1045 | .geTemplateDlg ::-webkit-scrollbar { |
1046 | - width:12px; | |
1047 | - height:12px; | |
1046 | + width:12px; | |
1047 | + height:12px; | |
1048 | 1048 | } |
1049 | 1049 | .geTemplateDlg ::-webkit-scrollbar-track { |
1050 | 1050 | background:whiteSmoke; |
... | ... | @@ -1052,7 +1052,7 @@ table.geProperties tr td { |
1052 | 1052 | } |
1053 | 1053 | .geTemplateDlg ::-webkit-scrollbar-thumb { |
1054 | 1054 | background:#c5c5c5; |
1055 | - border-radius:10px; | |
1055 | + border-radius:10px; | |
1056 | 1056 | border:whiteSmoke solid 3px; |
1057 | 1057 | } |
1058 | 1058 | .geTemplateDlg ::-webkit-scrollbar-thumb:hover { |
... | ... | @@ -1072,8 +1072,8 @@ table.geProperties tr td { |
1072 | 1072 | margin: 14px 14px 14px 20px; |
1073 | 1073 | } |
1074 | 1074 | .geTempDlgSearchBox { |
1075 | - color:#888888; | |
1076 | - background:url("/images/icon-search.svg") no-repeat; | |
1075 | + color:#888888; | |
1076 | + background:url("/images/icon-search.svg") no-repeat; | |
1077 | 1077 | background-color: #FFFFFF; |
1078 | 1078 | background-position: 15px; |
1079 | 1079 | height: 40px; |
... | ... | @@ -1081,14 +1081,14 @@ table.geProperties tr td { |
1081 | 1081 | max-width: 400px; |
1082 | 1082 | border: 1px solid #CCCCCC; |
1083 | 1083 | border-radius: 3px; |
1084 | - float:right; | |
1085 | - font-family:Arial,Helvetica,sans-serif; | |
1086 | - font-size:15px; | |
1087 | - line-height:36px; | |
1088 | - margin: 11px 36px 0 0; | |
1089 | - outline:medium none; | |
1090 | - padding:0 0 0 36px; | |
1091 | - text-shadow:1px 1px 0 white; | |
1084 | + float:right; | |
1085 | + font-family:Arial,Helvetica,sans-serif; | |
1086 | + font-size:15px; | |
1087 | + line-height:36px; | |
1088 | + margin: 11px 36px 0 0; | |
1089 | + outline:medium none; | |
1090 | + padding:0 0 0 36px; | |
1091 | + text-shadow:1px 1px 0 white; | |
1092 | 1092 | } |
1093 | 1093 | .geTemplatesList { |
1094 | 1094 | box-sizing: border-box; |
... | ... | @@ -1129,37 +1129,37 @@ table.geProperties tr td { |
1129 | 1129 | .geTempDlgCreateBtn, .geTempDlgOpenBtn { |
1130 | 1130 | display: inline-block; |
1131 | 1131 | width: 67px; |
1132 | - border-radius: 3px; | |
1133 | - background-color: #3D72AD; | |
1134 | - padding: 6px; | |
1135 | - text-align: center; | |
1136 | - color: #fff; | |
1137 | - cursor: pointer; | |
1138 | - margin-left: 5px; | |
1132 | + border-radius: 3px; | |
1133 | + background-color: #3D72AD; | |
1134 | + padding: 6px; | |
1135 | + text-align: center; | |
1136 | + color: #fff; | |
1137 | + cursor: pointer; | |
1138 | + margin-left: 5px; | |
1139 | 1139 | } |
1140 | 1140 | .geTempDlgCancelBtn { |
1141 | 1141 | display: inline-block; |
1142 | 1142 | width: 67px; |
1143 | - padding: 6px; | |
1144 | - text-align: center; | |
1145 | - color: #3D72AD; | |
1146 | - cursor: pointer; | |
1143 | + padding: 6px; | |
1144 | + text-align: center; | |
1145 | + color: #3D72AD; | |
1146 | + cursor: pointer; | |
1147 | 1147 | } |
1148 | 1148 | .geTempDlgCancelBtn:active, .geTempDlgCreateBtn:active, |
1149 | 1149 | .geTempDlgOpenBtn:active, .geTempDlgShowAllBtn:active { |
1150 | 1150 | transform: translateY(2px); |
1151 | 1151 | } |
1152 | 1152 | .geTempDlgBtnDisabled { |
1153 | - background-color: #9fbddd; | |
1153 | + background-color: #9fbddd; | |
1154 | 1154 | } |
1155 | 1155 | .geTempDlgBtnDisabled:active { |
1156 | - transform: translateY(0px); | |
1156 | + transform: translateY(0px); | |
1157 | 1157 | } |
1158 | 1158 | |
1159 | 1159 | .geTempDlgBtnBusy { |
1160 | 1160 | background-image: url(/images/aui-wait.gif); |
1161 | - background-repeat: no-repeat; | |
1162 | - background-position: 62px 7px; | |
1161 | + background-repeat: no-repeat; | |
1162 | + background-position: 62px 7px; | |
1163 | 1163 | } |
1164 | 1164 | |
1165 | 1165 | .geTempDlgBack { |
... | ... | @@ -1284,7 +1284,7 @@ table.geProperties tr td { |
1284 | 1284 | |
1285 | 1285 | .geTempDlgDiagramsListHeader { |
1286 | 1286 | width: 100%; |
1287 | - height: 45px; | |
1287 | + height: 45px; | |
1288 | 1288 | padding: 18px 20px 0 11px; |
1289 | 1289 | box-sizing: border-box; |
1290 | 1290 | } |
... | ... | @@ -1341,7 +1341,7 @@ table.geProperties tr td { |
1341 | 1341 | width: 13px; |
1342 | 1342 | } |
1343 | 1343 | .geTempDlgSpacer { |
1344 | - display: inline-block; | |
1344 | + display: inline-block; | |
1345 | 1345 | width: 10px; |
1346 | 1346 | } |
1347 | 1347 | |
... | ... | @@ -1350,8 +1350,8 @@ table.geProperties tr td { |
1350 | 1350 | white-space: nowrap; |
1351 | 1351 | font-size: 13px; |
1352 | 1352 | padding: 0px 20px 20px 10px; |
1353 | - box-sizing: border-box; | |
1354 | - border-spacing: 0; | |
1353 | + box-sizing: border-box; | |
1354 | + border-spacing: 0; | |
1355 | 1355 | } |
1356 | 1356 | |
1357 | 1357 | .geTempDlgDiagramsListGrid tr { |
... | ... | @@ -1421,21 +1421,21 @@ table.geProperties tr td { |
1421 | 1421 | |
1422 | 1422 | .geTempDlgDiagramTileImgLoading { |
1423 | 1423 | background-image: url(/images/aui-wait.gif); |
1424 | - background-repeat: no-repeat; | |
1425 | - background-position: center; | |
1424 | + background-repeat: no-repeat; | |
1425 | + background-position: center; | |
1426 | 1426 | } |
1427 | 1427 | |
1428 | 1428 | .geTempDlgDiagramTileImgError { |
1429 | 1429 | background-image: url(/images/broken.png); |
1430 | - background-repeat: no-repeat; | |
1431 | - background-position: center; | |
1432 | - background-color: #be3730; | |
1430 | + background-repeat: no-repeat; | |
1431 | + background-position: center; | |
1432 | + background-color: #be3730; | |
1433 | 1433 | } |
1434 | 1434 | |
1435 | 1435 | .geTempDlgDiagramTileImg img{ |
1436 | 1436 | max-width: 117px; |
1437 | - max-height: 117px; | |
1438 | - cursor: pointer; | |
1437 | + max-height: 117px; | |
1438 | + cursor: pointer; | |
1439 | 1439 | } |
1440 | 1440 | |
1441 | 1441 | .geTempDlgDiagramTileActive > .geTempDlgDiagramTileImg{ |
... | ... | @@ -1469,33 +1469,33 @@ table.geProperties tr td { |
1469 | 1469 | |
1470 | 1470 | .geTempDlgDiagramPreviewBox { |
1471 | 1471 | position: absolute; |
1472 | - top: 3%; | |
1473 | - left: 10%; | |
1474 | - width: 80%; | |
1475 | - height: 94%; | |
1476 | - background: white; | |
1477 | - border: 4px solid #3D72AD; | |
1478 | - border-radius: 6px; | |
1479 | - box-sizing: border-box; | |
1472 | + top: 3%; | |
1473 | + left: 10%; | |
1474 | + width: 80%; | |
1475 | + height: 94%; | |
1476 | + background: white; | |
1477 | + border: 4px solid #3D72AD; | |
1478 | + border-radius: 6px; | |
1479 | + box-sizing: border-box; | |
1480 | 1480 | display:table-cell; |
1481 | 1481 | vertical-align:middle; |
1482 | 1482 | text-align:center; |
1483 | - z-index: 2; | |
1483 | + z-index: 2; | |
1484 | 1484 | } |
1485 | 1485 | |
1486 | 1486 | .geTempDlgDialogMask { |
1487 | 1487 | position: absolute; |
1488 | - top: 0; | |
1489 | - left: 0; | |
1490 | - width: 100%; | |
1491 | - height: 100%; | |
1492 | - z-index: 1; | |
1488 | + top: 0; | |
1489 | + left: 0; | |
1490 | + width: 100%; | |
1491 | + height: 100%; | |
1492 | + z-index: 1; | |
1493 | 1493 | } |
1494 | 1494 | |
1495 | 1495 | .geTempDlgDiagramPreviewBox img { |
1496 | 1496 | max-width: 95%; |
1497 | - max-height: 95%; | |
1498 | - vertical-align: middle; | |
1497 | + max-height: 95%; | |
1498 | + vertical-align: middle; | |
1499 | 1499 | } |
1500 | 1500 | |
1501 | 1501 | .geTempDlgPreviewCloseBtn { |
... | ... | @@ -1511,25 +1511,25 @@ table.geProperties tr td { |
1511 | 1511 | |
1512 | 1512 | .geTempDlgLinkToDiagramBtn { |
1513 | 1513 | color: #555; |
1514 | - margin: 0 10px 0 10px; | |
1515 | - height: 27px; | |
1516 | - font-size: 14px; | |
1514 | + margin: 0 10px 0 10px; | |
1515 | + height: 27px; | |
1516 | + font-size: 14px; | |
1517 | 1517 | } |
1518 | 1518 | |
1519 | 1519 | .geTempDlgErrMsg { |
1520 | 1520 | display: none; |
1521 | 1521 | color: red; |
1522 | - position: absolute; | |
1523 | - width: 100%; | |
1524 | - text-align: center; | |
1522 | + position: absolute; | |
1523 | + width: 100%; | |
1524 | + text-align: center; | |
1525 | 1525 | } |
1526 | 1526 | |
1527 | 1527 | .geTempDlgImportCat { |
1528 | 1528 | font-weight: bold; |
1529 | - background: #f9f9f9; | |
1530 | - padding: 5px 0px; | |
1531 | - padding: 10px; | |
1532 | - margin: 10px 10px 0px 0px; | |
1529 | + background: #f9f9f9; | |
1530 | + padding: 5px 0px; | |
1531 | + padding: 10px; | |
1532 | + margin: 10px 10px 0px 0px; | |
1533 | 1533 | } |
1534 | 1534 | /* Comments CSS */ |
1535 | 1535 | .geCommentsWin { |
... | ... | @@ -1613,37 +1613,37 @@ table.geProperties tr td { |
1613 | 1613 | } |
1614 | 1614 | |
1615 | 1615 | .geCommentDate::first-letter { |
1616 | - text-transform: uppercase; | |
1616 | + text-transform: uppercase; | |
1617 | 1617 | } |
1618 | 1618 | |
1619 | 1619 | .geCommentTxt { |
1620 | 1620 | font-size: 14px; |
1621 | - padding-top: 5px; | |
1622 | - white-space: normal; | |
1623 | - min-height: 12px; | |
1621 | + padding-top: 5px; | |
1622 | + white-space: normal; | |
1623 | + min-height: 12px; | |
1624 | 1624 | } |
1625 | 1625 | |
1626 | 1626 | .geCommentEditTxtArea { |
1627 | - margin-top: 5px; | |
1628 | - font-size: 14px !important; | |
1629 | - min-height: 12px; | |
1630 | - max-width: 100%; | |
1631 | - min-width: 100%; | |
1627 | + margin-top: 5px; | |
1628 | + font-size: 14px !important; | |
1629 | + min-height: 12px; | |
1630 | + max-width: 100%; | |
1631 | + min-width: 100%; | |
1632 | 1632 | width: 100%; |
1633 | - box-sizing: border-box; | |
1633 | + box-sizing: border-box; | |
1634 | 1634 | } |
1635 | 1635 | |
1636 | 1636 | .geCommentEditBtns { |
1637 | 1637 | width: 100%; |
1638 | - box-sizing: border-box; | |
1639 | - padding-top: 5px; | |
1640 | - height: 20px; | |
1638 | + box-sizing: border-box; | |
1639 | + padding-top: 5px; | |
1640 | + height: 20px; | |
1641 | 1641 | } |
1642 | 1642 | |
1643 | 1643 | .geCommentEditBtn { |
1644 | 1644 | padding: 3px 8px 3px 8px !important; |
1645 | - float: right !important; | |
1646 | - margin-left: 5px; | |
1645 | + float: right !important; | |
1646 | + margin-left: 5px; | |
1647 | 1647 | } |
1648 | 1648 | |
1649 | 1649 | .geCommentActions { |
... | ... | @@ -1659,7 +1659,7 @@ table.geProperties tr td { |
1659 | 1659 | |
1660 | 1660 | .geCommentAction { |
1661 | 1661 | display: inline-block; |
1662 | - padding: 0; | |
1662 | + padding: 0; | |
1663 | 1663 | } |
1664 | 1664 | |
1665 | 1665 | .geCommentAction:before { |
... | ... | @@ -1684,8 +1684,8 @@ table.geProperties tr td { |
1684 | 1684 | |
1685 | 1685 | .geCheckedBtn { |
1686 | 1686 | background-color: #ccc; |
1687 | - border-top: 1px solid black !important; | |
1688 | - border-left: 1px solid black !important; | |
1687 | + border-top: 1px solid black !important; | |
1688 | + border-left: 1px solid black !important; | |
1689 | 1689 | } |
1690 | 1690 | |
1691 | 1691 | .geCommentBusyImg { |
... | ... | @@ -1739,8 +1739,8 @@ table.geProperties tr td { |
1739 | 1739 | .geStripedTable |
1740 | 1740 | { |
1741 | 1741 | border-collapse: collapse; |
1742 | - width: 100%; | |
1743 | - table-layout: fixed; | |
1742 | + width: 100%; | |
1743 | + table-layout: fixed; | |
1744 | 1744 | } |
1745 | 1745 | |
1746 | 1746 | .geStripedTable td, .geStripedTable th |
... | ... | @@ -1758,9 +1758,9 @@ table.geProperties tr td { |
1758 | 1758 | .geStripedTable tr:hover {background-color: #ddd;} |
1759 | 1759 | |
1760 | 1760 | .geStripedTable th { |
1761 | - padding-top: 4px; | |
1762 | - padding-bottom: 4px; | |
1763 | - background-color: #bbb; | |
1761 | + padding-top: 4px; | |
1762 | + padding-bottom: 4px; | |
1763 | + background-color: #bbb; | |
1764 | 1764 | } |
1765 | 1765 | |
1766 | 1766 | .geNotification-box { |
... | ... | @@ -1771,316 +1771,316 @@ table.geProperties tr td { |
1771 | 1771 | width: 20px; |
1772 | 1772 | } |
1773 | 1773 | .geNotification-bell { |
1774 | - animation: geBellAnim 1s 1s both; | |
1774 | + animation: geBellAnim 1s 1s both; | |
1775 | 1775 | } |
1776 | 1776 | .geNotification-bell * { |
1777 | - display: block; | |
1778 | - margin: 0 auto; | |
1779 | - background-color: #656565; | |
1777 | + display: block; | |
1778 | + margin: 0 auto; | |
1779 | + background-color: #656565; | |
1780 | 1780 | } |
1781 | 1781 | |
1782 | 1782 | .geBell-top { |
1783 | - width: 2px; | |
1784 | - height: 2px; | |
1785 | - border-radius: 1px 1px 0 0; | |
1783 | + width: 2px; | |
1784 | + height: 2px; | |
1785 | + border-radius: 1px 1px 0 0; | |
1786 | 1786 | } |
1787 | 1787 | .geBell-middle { |
1788 | - width: 12px; | |
1789 | - height: 12px; | |
1790 | - margin-top: -1px; | |
1791 | - border-radius: 7px 7px 0 0; | |
1788 | + width: 12px; | |
1789 | + height: 12px; | |
1790 | + margin-top: -1px; | |
1791 | + border-radius: 7px 7px 0 0; | |
1792 | 1792 | } |
1793 | 1793 | .geBell-bottom { |
1794 | - position: relative; | |
1795 | - z-index: 0; | |
1796 | - width: 16px; | |
1797 | - height: 1px; | |
1794 | + position: relative; | |
1795 | + z-index: 0; | |
1796 | + width: 16px; | |
1797 | + height: 1px; | |
1798 | 1798 | } |
1799 | 1799 | .geBell-bottom::before, |
1800 | 1800 | .geBell-bottom::after { |
1801 | - content: ''; | |
1802 | - position: absolute; | |
1803 | - top: -4px; | |
1801 | + content: ''; | |
1802 | + position: absolute; | |
1803 | + top: -4px; | |
1804 | 1804 | } |
1805 | 1805 | .geBell-bottom::before { |
1806 | - left: 1px; | |
1807 | - border-bottom-width: 4px; | |
1808 | - border-right: 0 solid transparent; | |
1809 | - border-left: 4px solid transparent; | |
1806 | + left: 1px; | |
1807 | + border-bottom-width: 4px; | |
1808 | + border-right: 0 solid transparent; | |
1809 | + border-left: 4px solid transparent; | |
1810 | 1810 | } |
1811 | 1811 | .geBell-bottom::after { |
1812 | - right: 1px; | |
1813 | - border-bottom-width: 4px; | |
1814 | - border-right: 4px solid transparent; | |
1815 | - border-left: 0 solid transparent; | |
1812 | + right: 1px; | |
1813 | + border-bottom-width: 4px; | |
1814 | + border-right: 4px solid transparent; | |
1815 | + border-left: 0 solid transparent; | |
1816 | 1816 | } |
1817 | 1817 | .geBell-rad { |
1818 | - width: 3px; | |
1819 | - height: 2px; | |
1820 | - margin-top: 0.5px; | |
1821 | - border-radius: 0 0 2px 2px; | |
1822 | - animation: geRadAnim 1s 2s both; | |
1818 | + width: 3px; | |
1819 | + height: 2px; | |
1820 | + margin-top: 0.5px; | |
1821 | + border-radius: 0 0 2px 2px; | |
1822 | + animation: geRadAnim 1s 2s both; | |
1823 | 1823 | } |
1824 | 1824 | .geNotification-count { |
1825 | - position: absolute; | |
1826 | - z-index: 1; | |
1827 | - top: -5px; | |
1828 | - right: -4px; | |
1829 | - width: 13px; | |
1830 | - height: 13px; | |
1831 | - line-height: 13px; | |
1832 | - font-size: 8px; | |
1833 | - border-radius: 50%; | |
1834 | - background-color: #ff4927; | |
1835 | - color: #FFF; | |
1836 | - animation: geZoomAnim 1s 1s both; | |
1825 | + position: absolute; | |
1826 | + z-index: 1; | |
1827 | + top: -5px; | |
1828 | + right: -4px; | |
1829 | + width: 13px; | |
1830 | + height: 13px; | |
1831 | + line-height: 13px; | |
1832 | + font-size: 8px; | |
1833 | + border-radius: 50%; | |
1834 | + background-color: #ff4927; | |
1835 | + color: #FFF; | |
1836 | + animation: geZoomAnim 1s 1s both; | |
1837 | 1837 | } |
1838 | 1838 | @keyframes geBellAnim { |
1839 | - 0% { transform: rotate(0); } | |
1840 | - 10% { transform: rotate(30deg); } | |
1841 | - 20% { transform: rotate(0); } | |
1842 | - 80% { transform: rotate(0); } | |
1843 | - 90% { transform: rotate(-30deg); } | |
1844 | - 100% { transform: rotate(0); } | |
1839 | + 0% { transform: rotate(0); } | |
1840 | + 10% { transform: rotate(30deg); } | |
1841 | + 20% { transform: rotate(0); } | |
1842 | + 80% { transform: rotate(0); } | |
1843 | + 90% { transform: rotate(-30deg); } | |
1844 | + 100% { transform: rotate(0); } | |
1845 | 1845 | } |
1846 | 1846 | @keyframes geRadAnim { |
1847 | - 0% { transform: translateX(0); } | |
1848 | - 10% { transform: translateX(5px); } | |
1849 | - 20% { transform: translateX(0); } | |
1850 | - 80% { transform: translateX(0); } | |
1851 | - 90% { transform: translateX(-5px); } | |
1852 | - 100% { transform: translateX(0); } | |
1847 | + 0% { transform: translateX(0); } | |
1848 | + 10% { transform: translateX(5px); } | |
1849 | + 20% { transform: translateX(0); } | |
1850 | + 80% { transform: translateX(0); } | |
1851 | + 90% { transform: translateX(-5px); } | |
1852 | + 100% { transform: translateX(0); } | |
1853 | 1853 | } |
1854 | 1854 | @keyframes geZoomAnim { |
1855 | - 0% { opacity: 0; transform: scale(0); } | |
1856 | - 50% { opacity: 1; transform: scale(1); } | |
1857 | - 100% { opacity: 1; } | |
1855 | + 0% { opacity: 0; transform: scale(0); } | |
1856 | + 50% { opacity: 1; transform: scale(1); } | |
1857 | + 100% { opacity: 1; } | |
1858 | 1858 | } |
1859 | 1859 | |
1860 | 1860 | .geNotifPanel { |
1861 | - height: 300px; | |
1862 | - width: 300px; | |
1863 | - background: #fff; | |
1864 | - border-radius: 3px; | |
1865 | - overflow: hidden; | |
1866 | - -webkit-box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3); | |
1867 | - box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3); | |
1868 | - -webkit-transition: all .5s ease-in-out; | |
1869 | - transition: all .5s ease-in-out; | |
1870 | - position: absolute; | |
1871 | - right: 100px; | |
1872 | - top: 42px; | |
1873 | - z-index: 150; | |
1861 | + height: 300px; | |
1862 | + width: 300px; | |
1863 | + background: #fff; | |
1864 | + border-radius: 3px; | |
1865 | + overflow: hidden; | |
1866 | + -webkit-box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3); | |
1867 | + box-shadow: 10px 10px 15px 0 rgba(0, 0, 0, 0.3); | |
1868 | + -webkit-transition: all .5s ease-in-out; | |
1869 | + transition: all .5s ease-in-out; | |
1870 | + position: absolute; | |
1871 | + right: 100px; | |
1872 | + top: 42px; | |
1873 | + z-index: 150; | |
1874 | 1874 | } |
1875 | 1875 | .geNotifPanel .header { |
1876 | - background: #cecece; | |
1877 | - color: #707070; | |
1878 | - font-size: 15px; | |
1876 | + background: #cecece; | |
1877 | + color: #707070; | |
1878 | + font-size: 15px; | |
1879 | 1879 | } |
1880 | 1880 | .geNotifPanel .header .title { |
1881 | - display: block; | |
1882 | - text-align: center; | |
1883 | - line-height: 30px; | |
1884 | - font-weight: 600; | |
1881 | + display: block; | |
1882 | + text-align: center; | |
1883 | + line-height: 30px; | |
1884 | + font-weight: 600; | |
1885 | 1885 | } |
1886 | 1886 | .geNotifPanel .header .closeBtn { |
1887 | - position: absolute; | |
1888 | - line-height: 30px; | |
1889 | - cursor: pointer; | |
1890 | - right: 15px; | |
1891 | - top: 0; | |
1887 | + position: absolute; | |
1888 | + line-height: 30px; | |
1889 | + cursor: pointer; | |
1890 | + right: 15px; | |
1891 | + top: 0; | |
1892 | 1892 | } |
1893 | 1893 | .geNotifPanel .notifications { |
1894 | - position: relative; | |
1895 | - height: 270px; | |
1896 | - overflow-x: hidden; | |
1897 | - overflow-y: auto; | |
1894 | + position: relative; | |
1895 | + height: 270px; | |
1896 | + overflow-x: hidden; | |
1897 | + overflow-y: auto; | |
1898 | 1898 | } |
1899 | 1899 | .geNotifPanel .notifications .line { |
1900 | - position: absolute; | |
1901 | - top: 0; | |
1902 | - left: 27px; | |
1903 | - height: 100%; | |
1904 | - width: 3px; | |
1905 | - background: #EBEBEB; | |
1900 | + position: absolute; | |
1901 | + top: 0; | |
1902 | + left: 27px; | |
1903 | + height: 100%; | |
1904 | + width: 3px; | |
1905 | + background: #EBEBEB; | |
1906 | 1906 | } |
1907 | 1907 | .geNotifPanel .notifications .notification { |
1908 | - position: relative; | |
1909 | - z-index: 2; | |
1910 | - margin: 25px 20px 25px 43px; | |
1908 | + position: relative; | |
1909 | + z-index: 2; | |
1910 | + margin: 25px 20px 25px 43px; | |
1911 | 1911 | } |
1912 | 1912 | .geNotifPanel .notifications .notification:nth-child(n+1) { |
1913 | - animation: geHere-am-i 0.5s ease-out 0.4s; | |
1914 | - animation-fill-mode: both; | |
1913 | + animation: geHere-am-i 0.5s ease-out 0.4s; | |
1914 | + animation-fill-mode: both; | |
1915 | 1915 | } |
1916 | 1916 | .geNotifPanel .notifications .notification:hover { |
1917 | - color: #1B95E0; | |
1918 | - cursor: pointer; | |
1917 | + color: #1B95E0; | |
1918 | + cursor: pointer; | |
1919 | 1919 | } |
1920 | 1920 | .geNotifPanel .notifications .notification .circle { |
1921 | - -webkit-box-sizing: border-box; | |
1922 | - box-sizing: border-box; | |
1923 | - position: absolute; | |
1924 | - height: 11px; | |
1925 | - width: 11px; | |
1926 | - background: #fff; | |
1927 | - border: 2px solid #1B95E0; | |
1928 | - -webkit-box-shadow: 0 0 0 3px #fff; | |
1929 | - box-shadow: 0 0 0 3px #fff; | |
1930 | - border-radius: 6px; | |
1931 | - top: 0; | |
1932 | - left: -20px; | |
1921 | + -webkit-box-sizing: border-box; | |
1922 | + box-sizing: border-box; | |
1923 | + position: absolute; | |
1924 | + height: 11px; | |
1925 | + width: 11px; | |
1926 | + background: #fff; | |
1927 | + border: 2px solid #1B95E0; | |
1928 | + -webkit-box-shadow: 0 0 0 3px #fff; | |
1929 | + box-shadow: 0 0 0 3px #fff; | |
1930 | + border-radius: 6px; | |
1931 | + top: 0; | |
1932 | + left: -20px; | |
1933 | 1933 | } |
1934 | 1934 | |
1935 | 1935 | .geNotifPanel .notifications .notification .circle.active { |
1936 | - background: #1B95E0; | |
1936 | + background: #1B95E0; | |
1937 | 1937 | } |
1938 | 1938 | |
1939 | 1939 | .geNotifPanel .notifications .notification .time { |
1940 | - display: block; | |
1941 | - font-size: 11px; | |
1942 | - line-height: 11px; | |
1943 | - margin-bottom: 2px; | |
1940 | + display: block; | |
1941 | + font-size: 11px; | |
1942 | + line-height: 11px; | |
1943 | + margin-bottom: 2px; | |
1944 | 1944 | } |
1945 | 1945 | .geNotifPanel .notifications .notification p { |
1946 | - font-size: 15px; | |
1947 | - line-height: 20px; | |
1948 | - margin: 0; | |
1946 | + font-size: 15px; | |
1947 | + line-height: 20px; | |
1948 | + margin: 0; | |
1949 | 1949 | } |
1950 | 1950 | .geNotifPanel .notifications .notification p b { |
1951 | - font-weight: 600; | |
1951 | + font-weight: 600; | |
1952 | 1952 | } |
1953 | 1953 | @-webkit-keyframes geHere-am-i { |
1954 | - from { | |
1955 | - -webkit-transform: translate3d(0, 50px, 0); | |
1956 | - transform: translate3d(0, 50px, 0); | |
1957 | - opacity: 0; | |
1958 | - } | |
1959 | - to { | |
1960 | - -webkit-transform: translate3d(0, 0, 0); | |
1961 | - transform: translate3d(0, 0, 0); | |
1962 | - opacity: 1; | |
1963 | - } | |
1954 | + from { | |
1955 | + -webkit-transform: translate3d(0, 50px, 0); | |
1956 | + transform: translate3d(0, 50px, 0); | |
1957 | + opacity: 0; | |
1958 | + } | |
1959 | + to { | |
1960 | + -webkit-transform: translate3d(0, 0, 0); | |
1961 | + transform: translate3d(0, 0, 0); | |
1962 | + opacity: 1; | |
1963 | + } | |
1964 | 1964 | } |
1965 | 1965 | |
1966 | 1966 | @keyframes geHere-am-i { |
1967 | - from { | |
1968 | - -webkit-transform: translate3d(0, 50px, 0); | |
1969 | - transform: translate3d(0, 50px, 0); | |
1970 | - opacity: 0; | |
1971 | - } | |
1972 | - to { | |
1973 | - -webkit-transform: translate3d(0, 0, 0); | |
1974 | - transform: translate3d(0, 0, 0); | |
1975 | - opacity: 1; | |
1976 | - } | |
1967 | + from { | |
1968 | + -webkit-transform: translate3d(0, 50px, 0); | |
1969 | + transform: translate3d(0, 50px, 0); | |
1970 | + opacity: 0; | |
1971 | + } | |
1972 | + to { | |
1973 | + -webkit-transform: translate3d(0, 0, 0); | |
1974 | + transform: translate3d(0, 0, 0); | |
1975 | + opacity: 1; | |
1976 | + } | |
1977 | 1977 | } |
1978 | 1978 | |
1979 | 1979 | .geTempTree { |
1980 | - margin: 0; | |
1981 | - padding: 0; | |
1980 | + margin: 0; | |
1981 | + padding: 0; | |
1982 | 1982 | } |
1983 | 1983 | |
1984 | 1984 | .geTempTree, .geTempTreeActive, .geTempTreeNested { |
1985 | - list-style-type: none; | |
1986 | - transition: all 0.5s; | |
1985 | + list-style-type: none; | |
1986 | + transition: all 0.5s; | |
1987 | 1987 | } |
1988 | 1988 | |
1989 | 1989 | .geTempTreeCaret { |
1990 | - box-sizing: border-box; | |
1991 | - cursor: pointer; | |
1992 | - user-select: none; | |
1993 | - padding: 6px; | |
1994 | - width: 100%; | |
1995 | - transition: all 0.5s; | |
1990 | + box-sizing: border-box; | |
1991 | + cursor: pointer; | |
1992 | + user-select: none; | |
1993 | + padding: 6px; | |
1994 | + width: 100%; | |
1995 | + transition: all 0.5s; | |
1996 | 1996 | } |
1997 | 1997 | |
1998 | 1998 | .geTempTreeCaret::before { |
1999 | - content: "\25B6"; | |
2000 | - display: inline-block; | |
2001 | - font-size: 10px; | |
2002 | - margin-right: 6px; | |
1999 | + content: "\25B6"; | |
2000 | + display: inline-block; | |
2001 | + font-size: 10px; | |
2002 | + margin-right: 6px; | |
2003 | 2003 | } |
2004 | 2004 | |
2005 | 2005 | .geTempTreeCaret-down::before { |
2006 | - transform: rotate(90deg); | |
2006 | + transform: rotate(90deg); | |
2007 | 2007 | } |
2008 | 2008 | |
2009 | 2009 | .geTempTreeNested { |
2010 | - height: 0; | |
2011 | - opacity: 0; | |
2010 | + height: 0; | |
2011 | + opacity: 0; | |
2012 | 2012 | } |
2013 | 2013 | |
2014 | 2014 | .geTempTreeActive { |
2015 | - height: 100%; | |
2016 | - opacity: 1; | |
2015 | + height: 100%; | |
2016 | + opacity: 1; | |
2017 | 2017 | } |
2018 | 2018 | |
2019 | 2019 | .geTempTreeActive, .geTempTreeNested { |
2020 | - padding-left: 15px; | |
2020 | + padding-left: 15px; | |
2021 | 2021 | } |
2022 | 2022 | |
2023 | 2023 | .geTempTreeActive > li, .geTempTreeNested > li { |
2024 | - box-sizing: border-box; | |
2025 | - padding: 3px; | |
2026 | - width: 100%; | |
2027 | - cursor: pointer; | |
2028 | - user-select: none; | |
2029 | - transition: all 0.5s; | |
2024 | + box-sizing: border-box; | |
2025 | + padding: 3px; | |
2026 | + width: 100%; | |
2027 | + cursor: pointer; | |
2028 | + user-select: none; | |
2029 | + transition: all 0.5s; | |
2030 | 2030 | } |
2031 | 2031 | |
2032 | 2032 | /*Electron Window Controls*/ |
2033 | 2033 | #geWindow-controls { |
2034 | - display: grid; | |
2035 | - grid-template-columns: repeat(3, 30px); | |
2036 | - position: absolute; | |
2037 | - top: 2px; | |
2038 | - right: 3px; | |
2039 | - height: 22px; | |
2040 | - -webkit-app-region: no-drag; | |
2034 | + display: grid; | |
2035 | + grid-template-columns: repeat(3, 30px); | |
2036 | + position: absolute; | |
2037 | + top: 2px; | |
2038 | + right: 3px; | |
2039 | + height: 22px; | |
2040 | + -webkit-app-region: no-drag; | |
2041 | 2041 | } |
2042 | 2042 | |
2043 | 2043 | #geWindow-controls .button { |
2044 | - grid-row: 1 / span 1; | |
2045 | - display: flex; | |
2046 | - justify-content: center; | |
2047 | - align-items: center; | |
2048 | - width: 100%; | |
2049 | - height: 100%; | |
2050 | - user-select: none; | |
2044 | + grid-row: 1 / span 1; | |
2045 | + display: flex; | |
2046 | + justify-content: center; | |
2047 | + align-items: center; | |
2048 | + width: 100%; | |
2049 | + height: 100%; | |
2050 | + user-select: none; | |
2051 | 2051 | } |
2052 | 2052 | #min-button { |
2053 | - grid-column: 1; | |
2053 | + grid-column: 1; | |
2054 | 2054 | } |
2055 | 2055 | #max-button, #restore-button { |
2056 | - grid-column: 2; | |
2056 | + grid-column: 2; | |
2057 | 2057 | } |
2058 | 2058 | #close-button { |
2059 | - grid-column: 3; | |
2059 | + grid-column: 3; | |
2060 | 2060 | } |
2061 | 2061 | #geWindow-controls .button.dark:hover { |
2062 | - background: rgba(255,255,255,0.1); | |
2062 | + background: rgba(255,255,255,0.1); | |
2063 | 2063 | } |
2064 | 2064 | #geWindow-controls .button.dark:active { |
2065 | - background: rgba(255,255,255,0.2); | |
2065 | + background: rgba(255,255,255,0.2); | |
2066 | 2066 | } |
2067 | 2067 | |
2068 | 2068 | #geWindow-controls .button.white:hover { |
2069 | - background: rgba(0,0,0,0.1); | |
2069 | + background: rgba(0,0,0,0.1); | |
2070 | 2070 | } |
2071 | 2071 | #geWindow-controls .button.white:active { |
2072 | - background: rgba(0,0,0,0.2); | |
2072 | + background: rgba(0,0,0,0.2); | |
2073 | 2073 | } |
2074 | 2074 | |
2075 | 2075 | #close-button:hover { |
2076 | - background: #E81123 !important; | |
2076 | + background: #E81123 !important; | |
2077 | 2077 | } |
2078 | 2078 | #close-button:active { |
2079 | - background: #F1707A !important; | |
2079 | + background: #F1707A !important; | |
2080 | 2080 | } |
2081 | 2081 | |
2082 | 2082 | #restore-button { |
2083 | - display: none !important; | |
2083 | + display: none !important; | |
2084 | 2084 | } |
2085 | 2085 | /* |
2086 | 2086 | .geMaximized #titlebar { |
... | ... | @@ -2089,13 +2089,13 @@ table.geProperties tr td { |
2089 | 2089 | } |
2090 | 2090 | */ |
2091 | 2091 | .geMaximized #restore-button { |
2092 | - display: flex !important; | |
2092 | + display: flex !important; | |
2093 | 2093 | } |
2094 | 2094 | |
2095 | 2095 | .geMaximized #max-button { |
2096 | - display: none; | |
2096 | + display: none; | |
2097 | 2097 | } |
2098 | 2098 | [draggable="true"] { |
2099 | - transform: translate(0, 0); | |
2100 | - z-index: 0; | |
2099 | + transform: translate(0, 0); | |
2100 | + z-index: 0; | |
2101 | 2101 | } | ... | ... |
... | ... | @@ -125,7 +125,7 @@ export const getDeviceActiveTime = (entityId: string) => { |
125 | 125 | |
126 | 126 | // 获取设备详情 |
127 | 127 | export const getDeviceInfo = (deviceId: string) => { |
128 | - return defHttp.get( | |
128 | + return defHttp.get<DeviceItemType>( | |
129 | 129 | { |
130 | 130 | url: isShareMode() ? `${Api.GET_DEVICE_DETAIL}public/${deviceId}` : `${Api.GET_DEVICE_DETAIL}${deviceId}`, |
131 | 131 | }, | ... | ... |
1 | 1 | import type { ThingsModelItemType } from '@/api/device/model' |
2 | 2 | import type { ImageSelectorDataType } from '@/core/Library/components/ImageSelector' |
3 | 3 | import type { CommandWayEnum } from '@/enums/commandEnum' |
4 | -import type { ActTypeEnum, AggregateTypeEnum, CommandDeliveryWayEnum, DeviceTypeEnum, EventActionTypeEnum, EventTypeEnum, SocketSubscriberEnum, TransportTypeEnum } from '@/enums/datasource' | |
4 | +import type { ActRangListItemTypeEnum, ActTypeEnum, AggregateTypeEnum, CommandDeliveryWayEnum, DeviceTypeEnum, EventActionTypeEnum, EventTypeEnum, SocketSubscriberEnum, TransportTypeEnum } from '@/enums/datasource' | |
5 | 5 | |
6 | 6 | export enum DeleteNodeDataTypeEnum { |
7 | 7 | DATASOURCE = 'DATASOURCE', |
... | ... | @@ -147,11 +147,11 @@ export interface NodeDataEventJsonType { |
147 | 147 | [EventTypeEnum.SINGLE]: SingleClickEventDataType |
148 | 148 | [EventTypeEnum.DOWN]: MouseDownEventDataType |
149 | 149 | [EventTypeEnum.UP]: MouseUpEventDataType |
150 | - [EventTypeEnum.OPERATION_PASSWORD]: { password: string } | any | |
150 | + [EventTypeEnum.OPERATION_PASSWORD]: { password: string; value: string; checked: boolean } | |
151 | 151 | } |
152 | 152 | |
153 | 153 | export interface RangeItemType { |
154 | - type?: string | |
154 | + type?: ActRangListItemTypeEnum | |
155 | 155 | min?: number |
156 | 156 | max?: number |
157 | 157 | statusValue?: number | ... | ... |
1 | +import { ActRangListItemTypeEnum, VariableImageSourceEnum } from '@/enums/datasource' | |
2 | + | |
1 | 3 | export { default as SingleClickSetting } from './index.vue' |
4 | + | |
5 | +export function getInitStatusSettingDefaultValue() { | |
6 | + return [ | |
7 | + { | |
8 | + type: ActRangListItemTypeEnum.OPEN, | |
9 | + statusValue: 1, | |
10 | + imageInfo: { | |
11 | + path: new URL('/public/webapp/images/thingskit/switch-on.svg', import.meta.url).href, | |
12 | + imageSource: VariableImageSourceEnum.LOCAL, | |
13 | + libKey: 'light', | |
14 | + }, | |
15 | + }, | |
16 | + { | |
17 | + type: ActRangListItemTypeEnum.CLOSE, | |
18 | + statusValue: 0, | |
19 | + imageInfo: { | |
20 | + path: new URL('/public/webapp/images/thingskit/switch-off.svg', import.meta.url).href, | |
21 | + imageSource: VariableImageSourceEnum.LOCAL, | |
22 | + libKey: 'light', | |
23 | + }, | |
24 | + }, | |
25 | + ] | |
26 | +} | ... | ... |
... | ... | @@ -6,10 +6,10 @@ import { isNullOrUnDef } from '@wry-smile/utils-is' |
6 | 6 | import type { ComponentExposeType } from '../../..' |
7 | 7 | import { usePublicFormContext } from '../../../usePublicFormContext' |
8 | 8 | import { tableColumns } from './config' |
9 | +import { getInitStatusSettingDefaultValue } from '.' | |
9 | 10 | import { BasicTable, useTable } from '@/components/Table' |
10 | 11 | import { buildUUID } from '@/utils/uuid' |
11 | 12 | import { ImageSelector } from '@/core/Library/components/ImageSelector' |
12 | -import { ActRangListItemTypeEnum, VariableImageSourceEnum } from '@/enums/datasource' | |
13 | 13 | import type { RangeItemType, StatusActDataType } from '@/api/node/model' |
14 | 14 | import { useMessage } from '@/hooks/web/useMessage' |
15 | 15 | interface IDataSource extends Partial<RangeItemType> { |
... | ... | @@ -33,28 +33,7 @@ const [registerTable] = useTable({ |
33 | 33 | const validateTable = ref<boolean>(false) |
34 | 34 | |
35 | 35 | function getInitTableRecord(): IDataSource[] { |
36 | - return [ | |
37 | - { | |
38 | - uuid: buildUUID(), | |
39 | - type: ActRangListItemTypeEnum.OPEN, | |
40 | - statusValue: 1, | |
41 | - imageInfo: { | |
42 | - path: new URL('/public/webapp/images/thingskit/switch-on.svg', import.meta.url).href, | |
43 | - imageSource: VariableImageSourceEnum.LOCAL, | |
44 | - libKey: 'light', | |
45 | - }, | |
46 | - }, | |
47 | - { | |
48 | - uuid: buildUUID(), | |
49 | - type: ActRangListItemTypeEnum.CLOSE, | |
50 | - statusValue: 0, | |
51 | - imageInfo: { | |
52 | - path: new URL('/public/webapp/images/thingskit/switch-off.svg', import.meta.url).href, | |
53 | - imageSource: VariableImageSourceEnum.LOCAL, | |
54 | - libKey: 'light', | |
55 | - }, | |
56 | - }, | |
57 | - ] | |
36 | + return getInitStatusSettingDefaultValue().map(item => ({ ...item, uuid: buildUUID() })) | |
58 | 37 | } |
59 | 38 | |
60 | 39 | const getFieldsValue = () => { |
... | ... | @@ -87,7 +66,7 @@ const validate = async () => { |
87 | 66 | const { dataSourceJson } = unref(getNodeData)! |
88 | 67 | const { deviceId, attr } = dataSourceJson || {} |
89 | 68 | if (!(deviceId || attr)) { |
90 | - createMessage.warning('请绑定数据源~') | |
69 | + createMessage.warning('请绑定数据源') | |
91 | 70 | return Promise.reject(new Error('请绑定数据源')) |
92 | 71 | } |
93 | 72 | ... | ... |
... | ... | @@ -10,18 +10,21 @@ import { usePublicFormContext } from '../../usePublicFormContext' |
10 | 10 | import type { DynamicEffectItemType } from './config' |
11 | 11 | import { getDynamicEffectItem as getEffectItem } from './config' |
12 | 12 | import { useModal } from '@/components/Modal' |
13 | -import type { ActTypeEnum } from '@/enums/datasource' | |
13 | +import { ActTypeEnum } from '@/enums/datasource' | |
14 | +import { ControlComponentEnum } from '@/core/Library/packages/Control' | |
14 | 15 | |
15 | 16 | const props = defineProps<{ |
16 | 17 | formSetting?: PublicFormSettingType |
17 | 18 | beforeClick: () => Promise<any> |
18 | 19 | }>() |
19 | 20 | |
21 | +const { getCellInfo } = usePublicFormContext() | |
22 | + | |
20 | 23 | const [register, { openModal }] = useModal() |
21 | 24 | |
22 | 25 | const getEffectItemSetting = computed(() => getEffectItem(props.formSetting)) |
23 | 26 | |
24 | -const checkStatus = reactive<Partial<Record<ActTypeEnum, boolean>>>(unref(getEffectItemSetting).map(item => item.key).reduce((prev, next) => ({ ...prev, [next]: false }), {} as Partial<Record<ActTypeEnum, boolean>>)) | |
27 | +const checkStatus = reactive<Partial<Record<ActTypeEnum, boolean>>>(unref(getEffectItemSetting).map(item => item.key).reduce((prev, next) => ({ ...prev, [next]: next === ActTypeEnum.STATUS_SETTING }), {} as Partial<Record<ActTypeEnum, boolean>>)) | |
25 | 28 | |
26 | 29 | const { getNodeData } = usePublicFormContext() |
27 | 30 | |
... | ... | @@ -44,7 +47,7 @@ const setFieldsValue = (record: Partial<Record<ActTypeEnum, boolean>>) => { |
44 | 47 | |
45 | 48 | const getDisabledStatus = (key: ActTypeEnum) => { |
46 | 49 | const data = unref(getNodeData)?.actJson[key] |
47 | - return !data | |
50 | + return unref(getCellInfo).componentKey === ControlComponentEnum.SWITCH || !data | |
48 | 51 | } |
49 | 52 | |
50 | 53 | defineExpose<ComponentExposeType>({ | ... | ... |
1 | +<script setup lang="ts"> | |
2 | +import { Modal } from 'ant-design-vue' | |
3 | +import { nextTick, ref, unref } from 'vue' | |
4 | +import type { FormSchema } from '@/components/Form' | |
5 | +import { BasicForm, useForm } from '@/components/Form' | |
6 | +import { ComponentEnum, FormLayoutEnum } from '@/components/Form/src/enum' | |
7 | + | |
8 | +const resolveFn = ref<Fn>() | |
9 | + | |
10 | +const visible = ref(false) | |
11 | + | |
12 | +const password = ref() | |
13 | + | |
14 | +const [register, { getFieldsValue, resetFields, validate, setProps }] = useForm({ | |
15 | + layout: FormLayoutEnum.VERTICAL, | |
16 | + showActionButtonGroup: false, | |
17 | +}) | |
18 | + | |
19 | +enum FormFieldsEnum { | |
20 | + ATTR_VALUE = 'attrValue', | |
21 | + PASSWORD = 'password', | |
22 | +} | |
23 | + | |
24 | +const createFormSchemas = (title?: string, password?: string): FormSchema[] => { | |
25 | + const schemas: FormSchema[] = [ | |
26 | + { | |
27 | + field: FormFieldsEnum.ATTR_VALUE, | |
28 | + label: title || '属性值', | |
29 | + component: ComponentEnum.INPUT, | |
30 | + required: true, | |
31 | + }, | |
32 | + ] | |
33 | + | |
34 | + if (password) { | |
35 | + schemas.unshift({ | |
36 | + field: FormFieldsEnum.PASSWORD, | |
37 | + label: '操作密码', | |
38 | + component: ComponentEnum.INPUT_PAWSSWORD, | |
39 | + required: true, | |
40 | + rules: [ | |
41 | + { | |
42 | + validator(_rule, value) { | |
43 | + if (value !== password) return Promise.reject(new Error('操作密码不正确')) | |
44 | + return Promise.resolve() | |
45 | + }, | |
46 | + }, | |
47 | + ], | |
48 | + }) | |
49 | + } | |
50 | + | |
51 | + return schemas | |
52 | +} | |
53 | + | |
54 | +const open = async ({ title, operationPassword }: Partial<Record<'operationPassword' | 'title', string>>) => { | |
55 | + visible.value = true | |
56 | + password.value = operationPassword | |
57 | + return new Promise((resolve) => { | |
58 | + resolveFn.value = resolve | |
59 | + nextTick(() => { | |
60 | + setProps({ schemas: createFormSchemas(title, operationPassword) }) | |
61 | + }) | |
62 | + }) | |
63 | +} | |
64 | + | |
65 | +const handleOk = async () => { | |
66 | + await validate() | |
67 | + const value = getFieldsValue() | |
68 | + unref(resolveFn)?.(value[FormFieldsEnum.ATTR_VALUE]) | |
69 | + visible.value = false | |
70 | + resetFields() | |
71 | +} | |
72 | + | |
73 | +defineExpose({ open }) | |
74 | +</script> | |
75 | + | |
76 | +<template> | |
77 | + <Modal v-model:open="visible" title="属性下发" ok-text="确认" :width="400" cancel-text="取消" @ok="handleOk"> | |
78 | + <!-- <section> | |
79 | + <FormItem label="操作密码" :label-col="{ span: 24 }"> | |
80 | + <Input v-model:value="value" placeholder="请输入下发值" /> | |
81 | + </FormItem> | |
82 | + <FormItem :label="fieldTitle" :label-col="{ span: 24 }"> | |
83 | + <Input v-model:value="value" placeholder="请输入下发值" /> | |
84 | + </FormItem> | |
85 | + </section> --> | |
86 | + | |
87 | + <BasicForm @register="register" /> | |
88 | + </Modal> | |
89 | +</template> | ... | ... |
1 | +<script setup lang="ts"> | |
2 | +import { Modal } from 'ant-design-vue' | |
3 | +import { nextTick, ref, unref } from 'vue' | |
4 | +import { BasicForm, type FormSchema, useForm } from '@/components/Form' | |
5 | +import { ComponentEnum, FormLayoutEnum } from '@/components/Form/src/enum' | |
6 | + | |
7 | +const resolveFn = ref<Fn>() | |
8 | + | |
9 | +const visible = ref(false) | |
10 | + | |
11 | +const [register, { resetFields, validate, setProps }] = useForm({ | |
12 | + showActionButtonGroup: false, | |
13 | + layout: FormLayoutEnum.VERTICAL, | |
14 | +}) | |
15 | + | |
16 | +const createFormSchemas = (password: string): FormSchema[] => { | |
17 | + return [ | |
18 | + { | |
19 | + field: 'password', | |
20 | + component: ComponentEnum.INPUT_PAWSSWORD, | |
21 | + label: '', | |
22 | + required: true, | |
23 | + rules: [{ | |
24 | + validator(_rule, value) { | |
25 | + if (value !== password) return Promise.reject(new Error('操作密码不正确')) | |
26 | + return Promise.resolve() | |
27 | + }, | |
28 | + }], | |
29 | + componentProps: { | |
30 | + placeholder: '请输入操作密码', | |
31 | + }, | |
32 | + }, | |
33 | + ] | |
34 | +} | |
35 | + | |
36 | +const open = async (pwd: string) => { | |
37 | + visible.value = true | |
38 | + return new Promise((resolve) => { | |
39 | + resolveFn.value = resolve | |
40 | + | |
41 | + nextTick(() => { | |
42 | + setProps({ schemas: createFormSchemas(pwd) }) | |
43 | + }) | |
44 | + }) | |
45 | +} | |
46 | + | |
47 | +const handlerOk = async () => { | |
48 | + await validate() | |
49 | + unref(resolveFn)?.(true) | |
50 | + resetFields() | |
51 | + visible.value = false | |
52 | +} | |
53 | + | |
54 | +defineExpose({ open }) | |
55 | +</script> | |
56 | + | |
57 | +<template> | |
58 | + <Modal | |
59 | + v-model:open="visible" :width="300" ok-text="确认" cancel-text="取消" | |
60 | + title="操作密码" | |
61 | + @ok="handlerOk" | |
62 | + > | |
63 | + <BasicForm @register="register" /> | |
64 | + </Modal> | |
65 | +</template> | ... | ... |
src/core/Library/components/PublicForm/components/DataEvents/CommandDeliveryModal/ConfirmModal.vue
0 → 100644
1 | +<script setup lang="ts"> | |
2 | +import { Icon } from '@iconify/vue' | |
3 | +import { Modal } from 'ant-design-vue' | |
4 | +import { ref, unref } from 'vue' | |
5 | + | |
6 | +const visible = ref(false) | |
7 | + | |
8 | +const resolveFn = ref<Fn>() | |
9 | + | |
10 | +const rejectFn = ref<Fn>() | |
11 | + | |
12 | +const open = async () => { | |
13 | + visible.value = true | |
14 | + return new Promise((resolve, reject) => { | |
15 | + resolveFn.value = resolve | |
16 | + rejectFn.value = reject | |
17 | + }) | |
18 | +} | |
19 | + | |
20 | +const handleOk = () => { | |
21 | + unref(resolveFn)?.() | |
22 | + visible.value = false | |
23 | +} | |
24 | + | |
25 | +const handleCancel = () => { | |
26 | + unref(rejectFn)?.() | |
27 | + visible.value = false | |
28 | +} | |
29 | + | |
30 | +defineExpose({ open }) | |
31 | +</script> | |
32 | + | |
33 | +<template> | |
34 | + <Modal v-model:open="visible" :width="400" ok-text="确认" cancel-text="取消" @ok="handleOk" @cancel="handleCancel"> | |
35 | + <template #title> | |
36 | + <div class="flex"> | |
37 | + <span><Icon icon="ant-design:exclamation-circle-filled" class="text-yellow-300 text-xl" /></span> | |
38 | + <span class="font-bold ml-2">提示</span> | |
39 | + </div> | |
40 | + </template> | |
41 | + <div class="ml-5"> | |
42 | + 是否确认此操作? | |
43 | + </div> | |
44 | + </Modal> | |
45 | +</template> | ... | ... |
1 | 1 | export { default as CommandDeliveryModal } from './index.vue' |
2 | +export { default as CommandDeliveryConfirmModal } from './CommandDeliveryConfirmModal.vue' | |
3 | +export { default as ConfirmModal } from './ConfirmModal.vue' | |
4 | +export { default as AttributeDeliverModal } from './AttributeDeliverModal.vue' | ... | ... |
... | ... | @@ -91,7 +91,6 @@ const getDeviceDetail = async (deviceId: string) => { |
91 | 91 | } |
92 | 92 | |
93 | 93 | const open = async (_data: SingleClickEventDataType) => { |
94 | - console.warn(_data, 'data') | |
95 | 94 | const { operationPassword } = _data || {} |
96 | 95 | dataSourceJson.value = _data.deviceInfo |
97 | 96 | isPasswordInfo.value = operationPassword || {} | ... | ... |
1 | 1 | import { unref } from 'vue' |
2 | +import type { DefaultOptionType } from 'ant-design-vue/es/select' | |
2 | 3 | import { usePublicFormContext } from '../../../usePublicFormContext' |
3 | 4 | import { getThingsModelServices } from '@/api/device' |
4 | 5 | import { type FormSchema } from '@/components/Form' |
... | ... | @@ -64,14 +65,14 @@ export const getFormSchemas = (event: EventTypeEnum): FormSchema[] => { |
64 | 65 | defaultValue: EventActionTypeEnum.OPEN_LINK, |
65 | 66 | required: true, |
66 | 67 | componentProps: ({ formActionType }) => { |
67 | - const options = [ | |
68 | - { label: EventActionTypeNameEnum.OPEN_LINK, value: EventActionTypeEnum.OPEN_LINK, disbaled: false }, | |
69 | - { label: EventActionTypeNameEnum.OPEN_PAGE, value: EventActionTypeEnum.OPEN_PAGE, disbaled: false }, | |
68 | + const options: DefaultOptionType[] = [ | |
69 | + { label: EventActionTypeNameEnum.OPEN_LINK, value: EventActionTypeEnum.OPEN_LINK }, | |
70 | + { label: EventActionTypeNameEnum.OPEN_PAGE, value: EventActionTypeEnum.OPEN_PAGE }, | |
70 | 71 | |
71 | - ] as any | |
72 | + ] | |
72 | 73 | |
73 | 74 | if (unref(getCellInfo).category.toUpperCase() === PackageCategoryEnum.CONTROL) |
74 | - options.push({ label: EventActionTypeNameEnum.PARAMS_SETTING, value: EventActionTypeEnum.PARAMS_SETTING, disabled: !deviceProfileId }) | |
75 | + options.push({ label: EventActionTypeNameEnum.PARAMS_SETTING, value: EventActionTypeEnum.PARAMS_SETTING, disabled: !deviceProfileId }, { label: EventActionTypeNameEnum.ATTRIBUTE_DELIVERY, value: EventActionTypeEnum.ATTRIBUTE_DELIVERY }) | |
75 | 76 | |
76 | 77 | return { |
77 | 78 | options, |
... | ... | @@ -169,7 +170,7 @@ export const getFormSchemas = (event: EventTypeEnum): FormSchema[] => { |
169 | 170 | label: FormFieldsNameEnum.WAY, |
170 | 171 | component: ComponentEnum.RADIO_GROUP, |
171 | 172 | required: true, |
172 | - ifShow: ({ model }) => transportType !== TransportTypeEnum.TCP && model[FormFieldsEnum.ACTION_TYPE] === EventActionTypeEnum.PARAMS_SETTING && model[FormFieldsEnum.COMMAND_WAY] === CommandDeliveryWayEnum.CUSTOM, | |
173 | + ifShow: ({ model }) => (transportType !== TransportTypeEnum.TCP && model[FormFieldsEnum.ACTION_TYPE] === EventActionTypeEnum.PARAMS_SETTING && model[FormFieldsEnum.COMMAND_WAY] === CommandDeliveryWayEnum.CUSTOM) || model[FormFieldsEnum.ACTION_TYPE] === EventActionTypeEnum.ATTRIBUTE_DELIVERY, | |
173 | 174 | defaultValue: CommandWayEnum.ONE_WAY, |
174 | 175 | componentProps: () => { |
175 | 176 | return { | ... | ... |
... | ... | @@ -4,10 +4,12 @@ import { computed, onMounted, reactive, ref, toRaw, unref } from 'vue' |
4 | 4 | import { useNodeData } from '../../hook/useNodeData' |
5 | 5 | import type { ConfigComponentProps } from '../../types' |
6 | 6 | import { useSavePageContent } from '../../hook/useSavePageContent' |
7 | +import { ControlComponentEnum } from '../../packages/Control' | |
7 | 8 | import { DataSourceForm } from './components/DataSourceForm' |
8 | 9 | import { DataEffects } from './components/DataEffects' |
9 | 10 | import { DataEvents } from './components/DataEvents' |
10 | 11 | import { createPublicFormContext } from './usePublicFormContext' |
12 | +import { getInitStatusSettingDefaultValue } from './components/DataEffects/StatusSetting' | |
11 | 13 | import type { ActTypeEnum, EventTypeEnum } from '@/enums/datasource' |
12 | 14 | import { useMessage } from '@/hooks/web/useMessage' |
13 | 15 | import type { NodeDataActJsonType, NodeDataEventJsonType } from '@/api/node/model' |
... | ... | @@ -64,11 +66,18 @@ const getEventJson = (): NodeDataEventJsonType => { |
64 | 66 | const getActJson = (): NodeDataActJsonType => { |
65 | 67 | const { actJson } = toRaw(unref(getNodeData)) || {} |
66 | 68 | |
67 | - if (!actJson) return {} as any | |
69 | + if (!actJson) return {} as NodeDataActJsonType | |
70 | + | |
71 | + if (unref(getCellInfo).componentKey === ControlComponentEnum.SWITCH && !actJson.STATUS_SETTING) { | |
72 | + actJson.STATUS_SETTING = { | |
73 | + enable: true, | |
74 | + rangeList: getInitStatusSettingDefaultValue(), | |
75 | + } | |
76 | + } | |
68 | 77 | |
69 | 78 | const status = unref(dataActElRef)?.getFieldsValue() as Record<ActTypeEnum, boolean> |
70 | 79 | |
71 | - if (!status) return {} as any | |
80 | + if (!status) return {} as NodeDataActJsonType | |
72 | 81 | |
73 | 82 | Object.keys(status).forEach((key) => { |
74 | 83 | if (actJson[key as ActTypeEnum]) |
... | ... | @@ -103,7 +112,7 @@ const handleSave = async () => { |
103 | 112 | if (contentDataStore.getIsTemplate)// 判断组态是不是模板 |
104 | 113 | dataSourceJson = { ...value, deviceProfileId: value?.deviceProfileTemplateId, deviceId: null } |
105 | 114 | await saveNodeAllData({ dataSourceJson, eventJson: { ...eventJson, OPERATION_PASSWORD: unref(getCellInfo).category === PackageCategoryEnum.CONTROL ? operationPassword : undefined }, actJson }) |
106 | - createMessage.success('操作成功~') | |
115 | + createMessage.success('操作成功') | |
107 | 116 | savePageContent() |
108 | 117 | } |
109 | 118 | finally { |
... | ... | @@ -159,14 +168,20 @@ createPublicFormContext(nodeDataActinType) |
159 | 168 | <Divider orientation="left"> |
160 | 169 | 数据源 |
161 | 170 | </Divider> |
162 | - <DataSourceForm ref="dataSourceElRef" :component-key="getComponentKey" @field-value-change="handleDataSourceChange" /> | |
171 | + <DataSourceForm | |
172 | + ref="dataSourceElRef" :component-key="getComponentKey" | |
173 | + @field-value-change="handleDataSourceChange" | |
174 | + /> | |
163 | 175 | </div> |
164 | 176 | <div v-if="getFormSetting && getFormSetting.eventSetting !== false"> |
165 | 177 | <Divider orientation="left"> |
166 | 178 | 数据交互 |
167 | 179 | </Divider> |
168 | 180 | <DataEvents ref="dataEventsElRef" :before-click="handleBeforeOpenEventOrActModal" :form-setting="getFormSetting" /> |
169 | - <div v-if="getCellInfo.category === PackageCategoryEnum.CONTROL" class="flex flex-col justify-center passwordInput" :class="getFormSetting?.actSetting === false && 'mb-4'"> | |
181 | + <div | |
182 | + v-if="getCellInfo.category === PackageCategoryEnum.CONTROL" class="flex flex-col justify-center passwordInput" | |
183 | + :class="getFormSetting?.actSetting === false && 'mb-4'" | |
184 | + > | |
170 | 185 | <Checkbox v-model:checked="operationPassword.checked" :disabled="getSetPasswordStatus"> |
171 | 186 | <div class="flex"> |
172 | 187 | {{ operationPassword.label }} |
... | ... | @@ -175,7 +190,10 @@ createPublicFormContext(nodeDataActinType) |
175 | 190 | </Checkbox> |
176 | 191 | <Form> |
177 | 192 | <FormItem :validate-status="getValidateStatus(operationPassword.value)"> |
178 | - <InputPassword v-model:value="operationPassword.value" class="mt-1" :disabled="!operationPassword.checked" placeholder="请输入操作密码" /> | |
193 | + <InputPassword | |
194 | + v-model:value="operationPassword.value" class="mt-1" :disabled="!operationPassword.checked" | |
195 | + placeholder="请输入操作密码" | |
196 | + /> | |
179 | 197 | </FormItem> |
180 | 198 | </Form> |
181 | 199 | </div> |
... | ... | @@ -200,9 +218,10 @@ createPublicFormContext(nodeDataActinType) |
200 | 218 | @apply text-sm; |
201 | 219 | } |
202 | 220 | } |
203 | -.passwordInput{ | |
204 | - :deep(.ant-form-item){ | |
205 | - margin:0 !important | |
221 | + | |
222 | +.passwordInput { | |
223 | + :deep(.ant-form-item) { | |
224 | + margin: 0 !important | |
206 | 225 | } |
207 | 226 | } |
208 | 227 | </style> | ... | ... |
1 | 1 | import { h, render } from 'vue' |
2 | -import { doCommandDelivery, getDeviceActive } from '@/api/device' | |
2 | +import { ControlComponentEnum } from '../packages/Control' | |
3 | +import { doCommandDelivery, getDeviceActive, getDeviceInfo } from '@/api/device' | |
3 | 4 | import type { MouseUpEventDataType, NodeDataDataSourceJsonType, NodeDataEventJsonType, SingleClickEventDataType } from '@/api/node/model' |
4 | 5 | import { CommandWayEnum } from '@/enums/commandEnum' |
5 | -import { EventActionTypeEnum } from '@/enums/datasource' | |
6 | +import { ActRangListItemTypeEnum, EventActionTypeEnum, TransportTypeEnum } from '@/enums/datasource' | |
6 | 7 | import { useMessage } from '@/hooks/web/useMessage' |
7 | -import { CommandDeliveryModal } from '@/core/Library/components/PublicForm/components/DataEvents/CommandDeliveryModal' | |
8 | +import { AttributeDeliverModal, CommandDeliveryConfirmModal, CommandDeliveryModal, ConfirmModal } from '@/core/Library/components/PublicForm/components/DataEvents/CommandDeliveryModal' | |
9 | +import type { MxCell } from '@/fitCore/types' | |
10 | +import { NodeUtils } from '@/hooks/business/useNodeUtils' | |
11 | +import { useContentDataStoreWithOut } from '@/store/modules/contentData' | |
12 | +import type { RpcCommandType } from '@/api/device/model' | |
8 | 13 | |
9 | -export function useNodeEvent(eventJson: NodeDataEventJsonType, dataSourceJson: NodeDataDataSourceJsonType) { | |
14 | +export function useNodeEvent(eventJson: NodeDataEventJsonType, dataSourceJson: NodeDataDataSourceJsonType, cell: MxCell) { | |
10 | 15 | const { createMessage } = useMessage() |
11 | 16 | |
12 | 17 | const handlerCommandDelivery = async (data: MouseUpEventDataType) => { |
... | ... | @@ -34,7 +39,7 @@ export function useNodeEvent(eventJson: NodeDataEventJsonType, dataSourceJson: N |
34 | 39 | persistent: true, |
35 | 40 | }, |
36 | 41 | }) |
37 | - createMessage.success('下发成功~') | |
42 | + createMessage.success('下发成功') | |
38 | 43 | }) |
39 | 44 | } |
40 | 45 | |
... | ... | @@ -66,6 +71,65 @@ export function useNodeEvent(eventJson: NodeDataEventJsonType, dataSourceJson: N |
66 | 71 | (instance.component?.exposed as InstanceType<typeof CommandDeliveryModal>)?.open({ ..._data, deviceInfo, operationPassword: eventJson?.OPERATION_PASSWORD }) |
67 | 72 | } |
68 | 73 | |
74 | + const handleAttributeDelivery = async (data: SingleClickEventDataType) => { | |
75 | + try { | |
76 | + const nodeUtils = new NodeUtils() | |
77 | + const { way = CommandWayEnum.ONE_WAY } = data | |
78 | + const { attr, deviceId, attrInfo } = dataSourceJson | |
79 | + const { transportType, alias, name: deviceName } = await getDeviceInfo(dataSourceJson.deviceId) || {}// 设备信息 | |
80 | + const contentDataStore = useContentDataStoreWithOut() | |
81 | + const currentData = contentDataStore.contentData.find(item => item.id === cell.getId()) | |
82 | + if (!currentData) return | |
83 | + const { actJson, eventJson } = currentData | |
84 | + const { value: operationPassword, checked: operationPasswordEnable } = eventJson.OPERATION_PASSWORD | |
85 | + | |
86 | + const command: RpcCommandType = { | |
87 | + additionalInfo: { cmdType: 'API' }, | |
88 | + method: 'methodThingskit', | |
89 | + params: {}, | |
90 | + persistent: true, | |
91 | + } | |
92 | + if (nodeUtils.getNodeComponentKey(cell) === ControlComponentEnum.SWITCH) { | |
93 | + const { rangeList } = actJson.STATUS_SETTING | |
94 | + const status = cell.getAttribute('SWITCH_STATUS') | |
95 | + const res = rangeList.find(item => item.type === (status === ActRangListItemTypeEnum.OPEN ? ActRangListItemTypeEnum.CLOSE : ActRangListItemTypeEnum.OPEN)) | |
96 | + if (!res) return | |
97 | + const { statusValue } = res | |
98 | + command.params = transportType === TransportTypeEnum.TCP | |
99 | + ? statusValue! | |
100 | + : { | |
101 | + [attr]: statusValue, | |
102 | + } | |
103 | + | |
104 | + if (operationPasswordEnable) { | |
105 | + const instance = h(CommandDeliveryConfirmModal) | |
106 | + render(instance, document.body) | |
107 | + await (instance.component?.exposed as InstanceType<typeof CommandDeliveryConfirmModal>)?.open(operationPassword) | |
108 | + } | |
109 | + else { | |
110 | + const instance = h(ConfirmModal) | |
111 | + render(instance, document.body) | |
112 | + await (instance.component?.exposed as InstanceType<typeof ConfirmModal>)?.open() | |
113 | + } | |
114 | + | |
115 | + await doCommandDelivery({ way, command, deviceId }) | |
116 | + createMessage.success('命令下发成功') | |
117 | + } | |
118 | + else { | |
119 | + const instance = h(AttributeDeliverModal) | |
120 | + render(instance, document.body) | |
121 | + const value = await (instance.component?.exposed as InstanceType<typeof AttributeDeliverModal>)?.open({ title: `${alias || deviceName}-${attrInfo.name}`, operationPassword }) as string | |
122 | + | |
123 | + command.params = transportType === TransportTypeEnum.TCP ? value : { [attr]: value } | |
124 | + await doCommandDelivery({ way, command, deviceId }) | |
125 | + createMessage.success('命令下发成功') | |
126 | + } | |
127 | + } | |
128 | + catch (error) { | |
129 | + console.error(error) | |
130 | + } | |
131 | + } | |
132 | + | |
69 | 133 | const handlerMouseClickEvent = (data: SingleClickEventDataType) => { |
70 | 134 | const { actionType, enable } = data |
71 | 135 | if (!enable) return |
... | ... | @@ -75,6 +139,8 @@ export function useNodeEvent(eventJson: NodeDataEventJsonType, dataSourceJson: N |
75 | 139 | handleSwitchPage(data) |
76 | 140 | else if (actionType === EventActionTypeEnum.PARAMS_SETTING) |
77 | 141 | handleParamsSetting(data) |
142 | + else if (actionType === EventActionTypeEnum.ATTRIBUTE_DELIVERY) | |
143 | + handleAttributeDelivery(data) | |
78 | 144 | } |
79 | 145 | |
80 | 146 | const handlerMouseDown = async () => { | ... | ... |
src/core/Library/hook/useOnEventTrigger.ts
0 → 100644
1 | +import type { RenderComponentExposeType } from '../types' | |
2 | +import type { DoubleClickEventDataType, MouseDownEventDataType, MouseUpEventDataType, NodeDataType, SingleClickEventDataType } from '@/api/node/model' | |
3 | +import { EventTypeEnum } from '@/enums/datasource' | |
4 | + | |
5 | +interface UseOnEventTriggerParamsType { | |
6 | + onMouseDown?: (eventData: MouseDownEventDataType, nodeData: NodeDataType) => any | |
7 | + onMouseUp?: (eventData: MouseUpEventDataType, nodeData: NodeDataType) => any | |
8 | + onClick?: (eventData: SingleClickEventDataType, nodeData: NodeDataType) => any | |
9 | + onDbClick?: (eventData: DoubleClickEventDataType, nodeData: NodeDataType) => any | |
10 | +} | |
11 | +export function useOnEventTrigger(params: UseOnEventTriggerParamsType) { | |
12 | + const onEventTrigger: RenderComponentExposeType['onEventTrigger'] = (eventName: EventTypeEnum, nodeData: NodeDataType) => { | |
13 | + if (!nodeData.eventJson[eventName].enable) return | |
14 | + | |
15 | + if (eventName === EventTypeEnum.SINGLE) | |
16 | + params.onClick?.(nodeData.eventJson[eventName], nodeData) | |
17 | + else if (eventName === EventTypeEnum.DOUBLE) | |
18 | + params.onDbClick?.(nodeData.eventJson[eventName], nodeData) | |
19 | + else if (eventName === EventTypeEnum.DOWN) | |
20 | + params.onMouseDown?.(nodeData.eventJson[eventName], nodeData) | |
21 | + else if (eventName === EventTypeEnum.UP) | |
22 | + params.onMouseDown?.(nodeData.eventJson[eventName], nodeData) | |
23 | + } | |
24 | + | |
25 | + return { | |
26 | + onEventTrigger, | |
27 | + } | |
28 | +} | ... | ... |
1 | 1 | <script lang="ts" setup> |
2 | -import { ref } from 'vue' | |
3 | -import type { RenderComponentExposeType } from '@/core/Library/types' | |
2 | +import { computed, ref, unref } from 'vue' | |
3 | +import type { RenderComponentExposeType, RenderComponentProps } from '@/core/Library/types' | |
4 | 4 | import { useLatestMessageValue } from '@/core/Library/hook/useLatestMessageValue' |
5 | 5 | import { NodeUtils } from '@/hooks/business/useNodeUtils' |
6 | -import { getMeetTheConditionsRange } from '@/core/Library/utils' | |
7 | -import { ActTypeEnum, VariableImageSourceEnum } from '@/enums/datasource' | |
6 | +import { VariableImageSourceEnum } from '@/enums/datasource' | |
8 | 7 | import { useOnMessage } from '@/core/Library/hook/useOnMessage' |
9 | 8 | import type { CommandSource } from '@/core/websocket/processor' |
10 | 9 | import type { SubscriptionUpdateMsg } from '@/core/websocket/type/message' |
11 | -import type { StatusActDataType } from '@/api/node/model' | |
10 | +import { useContentDataStoreWithOut } from '@/store/modules/contentData' | |
11 | +const props = defineProps<RenderComponentProps>() | |
12 | 12 | |
13 | 13 | const imgUrl = ref(new URL('/public/webapp/images/thingskit/switch-on.svg', import.meta.url).href) |
14 | 14 | |
15 | 15 | const isNonstandard = ref(false) |
16 | -const onReceiveActMessage = (commandSource: CommandSource, message: SubscriptionUpdateMsg) => { | |
17 | - const { node, type, data } = commandSource | |
18 | 16 | |
19 | - if (type !== ActTypeEnum.STATUS_SETTING) return | |
17 | +const contentDataStore = useContentDataStoreWithOut() | |
18 | +const getCurrentData = computed(() => contentDataStore.getCurrentNodeDataById(props.config)) | |
20 | 19 | |
20 | +const onReceiveDataSourceMessage = (_commandSource: CommandSource, message: SubscriptionUpdateMsg) => { | |
21 | + const { id: node, actJson, dataSourceJson } = unref(getCurrentData)! | |
22 | + const { attr } = dataSourceJson | |
23 | + const { rangeList } = actJson.STATUS_SETTING | |
21 | 24 | const nodeUtils = new NodeUtils() |
22 | 25 | const cell = nodeUtils.getCellById(node) |
23 | 26 | if (!cell) return |
24 | - const { attr, rangeList } = data as StatusActDataType | |
25 | - const { latestValue } = useLatestMessageValue(message.data, attr) | |
26 | - const { flag, record } = getMeetTheConditionsRange(rangeList.map(item => ({ ...item, max: item.statusValue, min: item.statusValue })), latestValue) | |
27 | + const { latestValue } = useLatestMessageValue(message.data, attr!) | |
28 | + const flag = rangeList.find(item => item.statusValue?.toString() === latestValue?.toString()) | |
29 | + | |
27 | 30 | if (flag) { |
28 | 31 | isNonstandard.value = false |
29 | - const { imageInfo } = record! | |
32 | + const { imageInfo, type } = flag! | |
30 | 33 | const { path, imageSource, libPath } = imageInfo || {} |
31 | 34 | imgUrl.value = imageSource === VariableImageSourceEnum.GALLERY ? libPath! : path! |
35 | + if (!cell) return | |
36 | + cell.setAttribute('SWITCH_STATUS', type!) | |
32 | 37 | } |
33 | 38 | else { |
34 | 39 | isNonstandard.value = true |
35 | 40 | } |
36 | 41 | } |
37 | 42 | |
38 | -const { onMessage } = useOnMessage({ onReceiveActMessage }) | |
43 | +const { onMessage } = useOnMessage({ onReceiveDataSourceMessage }) | |
39 | 44 | |
40 | 45 | defineExpose<RenderComponentExposeType>({ |
41 | 46 | onMessage, | ... | ... |
... | ... | @@ -6,6 +6,7 @@ import type { CommandSource, LightboxModeWebsocketService } from '@/core/websock |
6 | 6 | import type { SubscriptionUpdateMsg } from '@/core/websocket/type/message' |
7 | 7 | import type { TelemetrySubscriber } from '@/core/websocket/telemetry' |
8 | 8 | import type { NodeDataType } from '@/api/node/model' |
9 | +import type { EventTypeEnum } from '@/enums/datasource' | |
9 | 10 | |
10 | 11 | export interface FetchComponentFileType { |
11 | 12 | key: string |
... | ... | @@ -107,5 +108,6 @@ export interface ConfigPresetOptionsType { |
107 | 108 | } |
108 | 109 | |
109 | 110 | export interface RenderComponentExposeType { |
110 | - onMessage(commandSource: CommandSource, message: SubscriptionUpdateMsg): void | |
111 | + onMessage?(commandSource: CommandSource, message: SubscriptionUpdateMsg): void | |
112 | + onEventTrigger?(eventName: EventTypeEnum, nodeData: NodeDataType): void | |
111 | 113 | } | ... | ... |
1 | +import type { App } from 'vue' | |
1 | 2 | import type { LightboxModeWebsocketService } from '.' |
3 | +import type { RenderComponentExposeType } from '@/core/Library/types' | |
2 | 4 | import { useNodeEvent } from '@/core/Library/hook/useNodeEvent' |
3 | 5 | import { EventTypeEnum } from '@/enums/datasource' |
4 | 6 | import type { MxState } from '@/fitCore/types' |
7 | +import { getAppInstanceId } from '@/utils/draw' | |
5 | 8 | |
6 | 9 | interface MxEvent { |
7 | 10 | state: MxState |
... | ... | @@ -65,8 +68,16 @@ export class EventHandler { |
65 | 68 | const id = cell.getId() |
66 | 69 | |
67 | 70 | const node = this.service.dataSource.find(item => item.id === id) |
71 | + | |
68 | 72 | if (node && node.eventJson) { |
69 | - const { handlerMouseDown, handlerMouseClick, handlerMouseDoubleClick, handlerMouseUp } = useNodeEvent(node.eventJson, node.dataSourceJson) | |
73 | + const instanceId = getAppInstanceId(cell) | |
74 | + const instance = window?.VueInstanceMap?.[instanceId] as App | |
75 | + if (instance && (instance._instance?.exposed as RenderComponentExposeType)?.onEventTrigger) { | |
76 | + (instance._instance?.exposed as RenderComponentExposeType)?.onEventTrigger?.(eventName, node) | |
77 | + return | |
78 | + } | |
79 | + | |
80 | + const { handlerMouseDown, handlerMouseClick, handlerMouseDoubleClick, handlerMouseUp } = useNodeEvent(node.eventJson, node.dataSourceJson, cell) | |
70 | 81 | switch (eventName) { |
71 | 82 | case EventTypeEnum.DOWN: |
72 | 83 | handlerMouseDown() | ... | ... |
... | ... | @@ -220,6 +220,7 @@ export enum EventActionTypeEnum { |
220 | 220 | OPEN_PAGE = 'OPEN_PAGE', |
221 | 221 | ASSIGN_VARIABLE = 'ASSIGN_VARIABLE', |
222 | 222 | PARAMS_SETTING = 'PARAMS_SETTING', |
223 | + ATTRIBUTE_DELIVERY = 'ATTRIBUTE_DELIVERY', | |
223 | 224 | } |
224 | 225 | |
225 | 226 | export enum EventActionTypeNameEnum { |
... | ... | @@ -227,6 +228,7 @@ export enum EventActionTypeNameEnum { |
227 | 228 | OPEN_PAGE = '打开页面', |
228 | 229 | ASSIGN_VARIABLE = '变量赋值', |
229 | 230 | PARAMS_SETTING = '参数设置', |
231 | + ATTRIBUTE_DELIVERY = '属性下发', | |
230 | 232 | } |
231 | 233 | |
232 | 234 | export enum ContentDataFieldsEnum { | ... | ... |