@zgfe/modules-settings 2.1.0-zhongyuan.8 → 3.0.0-zhongyuan-set.0

package/es/modules/pointMap/styles/tree.less

@@ -1,156 +1,174 @@
-.setting-point-map-tree {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  padding: 16px 24px;
-  overflow: hidden;
-  background-color: #fff;
-  border-radius: 8px;
-  &-select {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    height: 32px;
-    &-box {
-      &-txt {
-        margin-right: 8px;
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
-      display: flex;
-      gap: 8px;
-      align-items: center;
-      .transform180 {
-        display: inline-block;
-        transform: rotateX(180deg);
-      }
-    }
-  }
-  &-search {
-    position: relative;
-    display: grid;
-    grid-gap: 16px;
-    grid-template-columns: 88px 1fr 20px;
-    align-items: center;
-    margin-top: 16px;
-    &-selectType {
-      width: 100px;
-    }
-    .qrcode-img {
-      display: inline-flex;
-      flex-direction: column;
-      align-items: center;
-      width: 200px;
-      height: 200px;
-      padding: 20px;
-      > div {
-        text-align: center;
-        > :nth-child(2) {
-          color: #9aa1a9;
-          font-size: 12px;
-        }
-      }
-      img {
-        width: 144px;
-        height: 144px;
-        margin-top: 10px;
-      }
-    }
-    .ant-popover-placement-bottom .ant-popover-arrow {
-      left: 84%;
-    }
-    .loading {
-      .ant-spin-nested-loading {
-        padding-top: 138px;
-      }
-    }
-    // .ant-select-selector {
-    //   padding-left: 40px !important;
-    // }
-    // .ant-select-selection-search-input {
-    //   padding-left: 30px !important;
-    // }
-    &-popup {
-      .ant-select-item {
-        height: 32px !important;
-        padding: 4px 12px !important;
-      }
-    }
-    .sousuo {
-      position: absolute;
-      top: 6px;
-      left: 16px;
-      display: none;
-    }
-  }
-  &-tree {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    margin: 16px 0 0;
-    overflow: hidden;
-    .gengduocaozuo1 {
-      color: #354354;
-    }
-    .gengduocaozuo1:hover {
-      color: #165dff;
-    }
-    .ant-tree-switcher {
-      color: #354354;
-    }
-    .ant-tree,
-    .ant-tree-list,
-    .ant-tree-list-holder {
-      height: 100%;
-    }
-    .ant-tree-list-holder {
-      overflow-x: hidden;
-      overflow-y: auto;
-    }
-    .ant-tree-node-content-wrapper {
-      width: calc(100% - 200px);
-    }
-    .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
-      background-color: #e8efff;
-    }
-    .ant-tree-switcher {
-      line-height: 32px;
-    }
-    &-item {
-      display: flex;
-      flex: 1 0;
-      gap: 10px;
-      align-items: center;
-      justify-content: space-between;
-      height: 32px;
-      padding: 0px 4px;
-      border-radius: 4px;
-      &-title {
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        &-name {
-          margin-right: 10px;
-        }
-      }
-    }
-    .ant-tree-title {
-      display: block;
-    }
-  }
-  &-empty {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    .ant-empty-normal {
-      margin: 16px 0;
-    }
-    .zengjia:before {
-      margin-right: 8px;
-    }
-  }
-}
+.setting-point-map-tree {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  padding: 16px 24px;
+  overflow: hidden;
+  background-color: #fff;
+  border-radius: 8px;
+  &-select {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    height: 32px;
+    &-box {
+      &-txt {
+        margin-right: 8px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+      display: flex;
+      gap: 8px;
+      align-items: center;
+      .transform180 {
+        display: inline-block;
+        transform: rotateX(180deg);
+      }
+    }
+  }
+  &-search {
+    position: relative;
+    display: grid;
+    grid-gap: 16px;
+    grid-template-columns: 88px 1fr 20px;
+    align-items: center;
+    margin-top: 16px;
+    &-selectType {
+      width: 100px;
+    }
+    .qrcode-img {
+      display: inline-flex;
+      flex-direction: column;
+      align-items: center;
+      width: 200px;
+      height: 240px;
+      padding: 20px;
+      > div {
+        text-align: center;
+        > :nth-child(2) {
+          color: #9aa1a9;
+          font-size: 12px;
+        }
+      }
+      img {
+        width: 144px;
+        height: 144px;
+        margin-top: 10px;
+      }
+    }
+    .ant-popover-placement-bottom .ant-popover-arrow {
+      left: 84%;
+    }
+    .loading {
+      .ant-spin-nested-loading {
+        padding-top: 138px;
+      }
+    }
+    // .ant-select-selector {
+    //   padding-left: 40px !important;
+    // }
+    // .ant-select-selection-search-input {
+    //   padding-left: 30px !important;
+    // }
+    &-popup {
+      .ant-select-item {
+        height: 32px !important;
+        padding: 4px 12px !important;
+      }
+    }
+    .sousuo {
+      position: absolute;
+      top: 6px;
+      left: 16px;
+      display: none;
+    }
+  }
+  &-tree {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    margin: 16px 0 0;
+    overflow: hidden;
+    .gengduocaozuo1 {
+      color: #354354;
+      transform: translateY(4px);
+    }
+    .gengduocaozuo1:hover {
+      color: #165dff;
+    }
+    .ant-tree-switcher {
+      color: #354354;
+    }
+    .ant-tree,
+    .ant-tree-list,
+    .ant-tree-list-holder {
+      height: 100%;
+    }
+    .ant-tree-list-holder {
+      overflow-x: hidden;
+      overflow-y: auto;
+    }
+    .ant-tree-node-content-wrapper {
+      width: calc(100% - 200px);
+    }
+    .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
+      background-color: #e8efff;
+    }
+    .ant-tree-switcher {
+      line-height: 32px;
+    }
+    &-item {
+      display: flex;
+      flex: 1 0;
+      gap: 10px;
+      align-items: center;
+      justify-content: space-between;
+      height: 32px;
+      padding: 0px 4px;
+      border-radius: 4px;
+      &-title {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        &-name {
+          margin-right: 10px;
+        }
+      }
+      &-iconList {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        display: none;
+        justify-content: space-around;
+        width: 85px;
+        font-size: 16px;
+        background: #ffffff;
+        .anticon:hover {
+          color: #165dff;
+        }
+      }
+      &:hover &-iconList {
+        display: flex;
+      }
+    }
+    .ant-tree-title {
+      display: block;
+    }
+  }
+  &-empty {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    .ant-empty-normal {
+      margin: 16px 0;
+    }
+    .zengjia:before {
+      margin-right: 8px;
+    }
+  }
+}

package/es/modules/pointMap/tree.js

@@ -16,7 +16,7 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import { Button, Dropdown, Empty, Input, message, Modal, Select, Tree, Popover, Spin, Tag, Checkbox } from 'antd';
-import { QuestionCircleOutlined, EnvironmentOutlined } from '@ant-design/icons';
+import { QuestionCircleOutlined, EnvironmentOutlined, PlusCircleOutlined, MinusCircleOutlined, EditOutlined } from '@ant-design/icons';
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import './styles/tree.less';
 import { BizDialog, BizGlobalDataContext, IconFont } from '@zgfe/business-lib';
@@ -45,6 +45,7 @@ var formatTreeData = function formatTreeData(list, storey) {
     }
     return listTemp;
   }
+  return [];
 };
 var formatTreeArr = function formatTreeArr(list, arrTemp, parentName) {
   var listTemp = JSON.parse(JSON.stringify(list));
@@ -73,6 +74,7 @@ var formatTreeArr = function formatTreeArr(list, arrTemp, parentName) {
     }
     return arrTemp;
   }
+  return [];
 };
 var pageNum = 1;
 var pointMap = function pointMap(props) {
@@ -100,7 +102,8 @@ var pointMap = function pointMap(props) {
   var _useContext = useContext(BizGlobalDataContext),
     currentApp = _useContext.currentApp,
     route = _useContext.route,
-    authority = _useContext.authority;
+    authority = _useContext.authority,
+    showProdDownload = _useContext.showProdDownload;
   var _useState11 = useState([]),
     _useState12 = _slicedToArray(_useState11, 2),
     pointVersionList = _useState12[0],
@@ -193,6 +196,7 @@ var pointMap = function pointMap(props) {
     });
   };
   var getPointTree = function getPointTree() {
+    var fn = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {};
     request(apis.getPointTree, {
       method: 'post',
       data: {
@@ -201,7 +205,7 @@ var pointMap = function pointMap(props) {
       }
     }).then(function (res) {
       if (res && res.code === '100000') {
-        pageNum = ((res === null || res === void 0 ? void 0 : res.data.length) || 0) + 1;
+        pageNum = (res.data ? res.data.length : 0) + 1;
         setTreeData(formatTreeData((res === null || res === void 0 ? void 0 : res.data) || []));
         setTreeArr(formatTreeArr((res === null || res === void 0 ? void 0 : res.data) || [], [], '') || []);
         if (!selectedKeys) {
@@ -213,6 +217,7 @@ var pointMap = function pointMap(props) {
           // props.onChangePage(res?.data ? { ...res?.data[0], currentPointVersion } : undefined);
         }
         setChangeNameId(undefined);
+        fn();
       }
     }).catch(function (err) {
       console.log(err);
@@ -227,11 +232,12 @@ var pointMap = function pointMap(props) {
         appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId
       }
     }).then(function (res) {
-      if (res.code == 100000) {
+      if (res && res.code == 100000) {
         setPointList(res.data.map(function (res) {
           return {
             label: res.labelName,
-            value: res.id
+            value: res.id,
+            labelType: 1
           };
         }));
       }
@@ -367,9 +373,7 @@ var pointMap = function pointMap(props) {
     }
   };
   var titleRender = function titleRender(nodeData) {
-    var onItemClick = function onItemClick(_ref) {
-      var key = _ref.key;
-      console.log(key, 'key');
+    var onItemClick = function onItemClick(key) {
       switch (key) {
         case '0':
           if (nodeData.storey >= 20) {
@@ -402,16 +406,83 @@ var pointMap = function pointMap(props) {
     };
     //位置标签list
     var color = ['magenta', 'red', 'volcano', 'orange', 'gold', 'lime', 'green', 'cyan', 'blue', 'geekblue', 'purple'];
-    var pointContent = /*#__PURE__*/React.createElement(React.Fragment, null, nodeData.labels.map(function (res, index) {
+    var pointContent = /*#__PURE__*/React.createElement(React.Fragment, null, nodeData.labels && nodeData.labels.map(function (res, index) {
       return /*#__PURE__*/React.createElement(Tag, {
         key: index,
         color: color[index]
       }, res.labelName);
     }));
-    var pointIds = nodeData.labels.map(function (res) {
+    var pointIds = nodeData.labels && nodeData.labels.map(function (res) {
       return res.id;
-    });
-    return /*#__PURE__*/React.createElement("div", {
+    }) || [];
+    var menu = {
+      items: [{
+        label: '添加子页面',
+        icon: /*#__PURE__*/React.createElement(IconFont, {
+          type: "tianjia3"
+        }),
+        key: '0'
+      }, {
+        label: '上方添加页面',
+        icon: /*#__PURE__*/React.createElement(IconFont, {
+          type: "shangfangtianjia"
+        }),
+        key: '1'
+      }, {
+        label: '下方添加页面',
+        icon: /*#__PURE__*/React.createElement(IconFont, {
+          type: "xiafangtianjia"
+        }),
+        key: '2'
+      }, {
+        label: '选择位置标签',
+        icon: /*#__PURE__*/React.createElement(EnvironmentOutlined, null),
+        key: '5',
+        children: pointList.map(function (res) {
+          return {
+            key: '5' + res.value,
+            label: (/*#__PURE__*/React.createElement(Checkbox, {
+              defaultChecked: pointIds.indexOf(res.value) != -1,
+              onChange: function onChange(e) {
+                onChangeTag(e, nodeData, res);
+              },
+              onClick: function onClick(e) {
+                e.stopPropagation();
+              }
+            }, res.label)),
+            disabled: true
+          };
+        })
+      }, {
+        type: 'divider'
+      }, {
+        label: '重命名',
+        icon: /*#__PURE__*/React.createElement(IconFont, {
+          type: "bianji1"
+        }),
+        key: '3'
+      }, {
+        type: 'divider'
+      }, {
+        label: '删除',
+        icon: /*#__PURE__*/React.createElement(IconFont, {
+          type: "shanchu2"
+        }),
+        key: '4'
+      }],
+      onClick: function onClick(item) {
+        item.domEvent.stopPropagation();
+        onItemClick(item.key);
+      }
+    };
+    return /*#__PURE__*/React.createElement(Dropdown, {
+      disabled: !authority[1724922805],
+      menu: menu,
+      overlayStyle: {
+        width: 156
+      },
+      trigger: ['contextMenu']
+    }, /*#__PURE__*/React.createElement("div", {
       className: "".concat(classPrefix, "-tree-item")
     }, changeNameId === nodeData.id ? (/*#__PURE__*/React.createElement(Input, {
       style: {
@@ -461,90 +532,66 @@ var pointMap = function pointMap(props) {
       placement: "topLeft",
       title: "\u4F4D\u7F6E\u6807\u7B7E",
       content: pointContent
-    }, pointContent)))), /*#__PURE__*/React.createElement(Dropdown, {
+    }, pointContent)))), /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-tree-item-iconList")
+    }, /*#__PURE__*/React.createElement(EditOutlined, {
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        onItemClick('3');
+      }
+    }), /*#__PURE__*/React.createElement(MinusCircleOutlined, {
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        onItemClick('4');
+      }
+    }), /*#__PURE__*/React.createElement(PlusCircleOutlined, {
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        onItemClick('2');
+      }
+    }), /*#__PURE__*/React.createElement(Dropdown, {
       disabled: !authority[1724922805],
-      placement: 'bottomRight',
-      menu: {
-        items: [{
-          label: '添加子页面',
-          icon: /*#__PURE__*/React.createElement(IconFont, {
-            type: "tianjia3"
-          }),
-          key: '0'
-        }, {
-          label: '上方添加页面',
-          icon: /*#__PURE__*/React.createElement(IconFont, {
-            type: "shangfangtianjia"
-          }),
-          key: '1'
-        }, {
-          label: '下方添加页面',
-          icon: /*#__PURE__*/React.createElement(IconFont, {
-            type: "xiafangtianjia"
-          }),
-          key: '2'
-        }, {
-          label: '选择位置标签',
-          icon: /*#__PURE__*/React.createElement(EnvironmentOutlined, null),
-          key: '5',
-          children: pointList.map(function (res) {
-            return {
-              key: '5' + res.value,
-              label: (/*#__PURE__*/React.createElement(Checkbox, {
-                defaultChecked: pointIds.indexOf(res.value) != -1,
-                onChange: function onChange(e) {
-                  onChangeTag(e, nodeData.id, res.value);
-                }
-              }, res.label)),
-              disabled: true
-            };
-          })
-        }, {
-          type: 'divider'
-        }, {
-          label: '重命名',
-          icon: /*#__PURE__*/React.createElement(IconFont, {
-            type: "bianji1"
-          }),
-          key: '3'
-        }, {
-          type: 'divider'
-        }, {
-          label: '删除',
-          icon: /*#__PURE__*/React.createElement(IconFont, {
-            type: "shanchu2"
-          }),
-          key: '4'
-        }],
-        onClick: onItemClick
-      },
+      menu: menu,
       overlayStyle: {
         width: 156
       },
       trigger: ['click']
     }, /*#__PURE__*/React.createElement(IconFont, {
+      type: "gengduocaozuo1",
       onClick: function onClick(e) {
         e.stopPropagation();
-      },
-      type: "gengduocaozuo1"
-    })));
+      }
+    })))));
   };
-  var onChangeTag = function onChangeTag(e, nodeId, value) {
-    labelRelation(e.target.checked, nodeId, value);
+  var onChangeTag = function onChangeTag(e, node, option) {
+    labelRelation(e.target.checked, node, option);
   };
   //绑定和解绑标签
-  var labelRelation = function labelRelation(checked, nodeId, tagId) {
+  var labelRelation = function labelRelation(checked, node, option) {
     request(checked ? apis.dict.addLabelRelation : apis.dict.delLabelRelation, {
       method: 'post',
       data: {
-        id: tagId,
+        id: option.value,
         appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
         labelType: 1,
-        eventId: nodeId
+        eventId: node.id
       }
     }).then(function (res) {
       if ((res === null || res === void 0 ? void 0 : res.code) == '100000') {
-        getPointTree();
+        getPointTree(function () {
+          var labels = node.labels;
+          if (checked) {
+            labels.push(option);
+          } else {
+            labels = labels.filter(function (res) {
+              return res.id != option.value;
+            });
+          }
+          node.labels = labels;
+          props.onChangePage(_objectSpread(_objectSpread({}, node), {}, {
+            currentPointVersion: currentPointVersion
+          }));
+        });
       }
     });
   };
@@ -607,8 +654,8 @@ var pointMap = function pointMap(props) {
           key: item
         };
       }),
-      onClick: function onClick(_ref2) {
-        var key = _ref2.key;
+      onClick: function onClick(_ref) {
+        var key = _ref.key;
         setIsOpen(false);
         setValue('');
         setSelectedKeys(undefined);
@@ -647,7 +694,7 @@ var pointMap = function pointMap(props) {
   })))), /*#__PURE__*/React.createElement("a", {
     className: "".concat(classPrefix, "-select-box"),
     onClick: downloadHelpFile
-  }, /*#__PURE__*/React.createElement(QuestionCircleOutlined, null), "\u5E2E\u52A9"), /*#__PURE__*/React.createElement("a", {
+  }, /*#__PURE__*/React.createElement(QuestionCircleOutlined, null), "\u5E2E\u52A9"), showProdDownload && (/*#__PURE__*/React.createElement("a", {
     className: "".concat(classPrefix, "-select-box"),
     onClick: function onClick() {
       if (!authority[1724922774]) {
@@ -658,7 +705,7 @@ var pointMap = function pointMap(props) {
     }
   }, /*#__PURE__*/React.createElement(IconFont, {
     type: "xiazai1"
-  }), "\u5BFC\u5165\u9875\u9762")), /*#__PURE__*/React.createElement("div", {
+  }), "\u5BFC\u5165\u9875\u9762"))), /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-search")
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
     className: "".concat(classPrefix, "-search-selectType"),
@@ -698,7 +745,11 @@ var pointMap = function pointMap(props) {
     open: qrCodeShareShow,
     content: /*#__PURE__*/React.createElement("div", {
       className: "".concat(qrCodeLoading ? 'loading' : '', " qrcode-img")
-    }, /*#__PURE__*/React.createElement("div", null, "\u624B\u673A\u626B\u7801\u67E5\u770B\u57CB\u70B9\u5730\u56FE"), /*#__PURE__*/React.createElement(Spin, {
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontSize: '14px'
+      }
+    }, "\u624B\u673A\u626B\u7801\u67E5\u770B\u81EA\u5B9A\u4E49\u57CB\u70B9\u5730\u56FE"), /*#__PURE__*/React.createElement(Spin, {
       spinning: qrCodeLoading
     }, qrCodeShare && /*#__PURE__*/React.createElement("img", {
       src: qrCodeShare