@zgfe/modules-dm 1.0.33 → 1.0.34-heyh.11

package/es/modules/dataCollection/components/sortableComponnet.js

@@ -0,0 +1,109 @@
+import { BizGlobalDataContext } from '@zgfe/business-lib';
+import { Checkbox, Tooltip } from 'antd';
+import request from '../../../utils/ajax';
+import apis from '../../../constants/api';
+import React, { useContext } from 'react';
+import { getAppID, eventChecked } from '../../../utils';
+import { arrayMoveImmutable } from 'array-move';
+import _ from 'lodash';
+import { SortableContainer, SortableElement } from 'react-sortable-hoc';
+var SortableComponnet = function SortableComponnet(props) {
+  var classPrefix = 'sortable-componnet';
+  var _useContext = useContext(BizGlobalDataContext),
+    currentApp = _useContext.currentApp;
+  var componnetData = props.componnetData,
+    componnetIndex = props.componnetIndex,
+    groupId = props.groupId,
+    groupingData = props.groupingData,
+    setGroupingData = props.setGroupingData;
+  // 需要拖动的元素的容器
+  var SortableItem = SortableElement(function (data) {
+    var _data$value = data.value,
+      item = _data$value.item,
+      index = _data$value.index;
+    var name = item.alias_name ? item.alias_name : item.event_name;
+    return /*#__PURE__*/React.createElement(Tooltip, {
+      title: "".concat(item.owner === 'zg_vtl' ? '虚拟事件' : '元事件', " | ").concat(name),
+      key: index
+    }, /*#__PURE__*/React.createElement(Checkbox, {
+      className: "checkbox-item ".concat(item.event_hidden ? 'event-hidden' : '', " column-").concat(groupId),
+      checked: item.checked,
+      key: index,
+      onChange: function onChange() {
+        return onChangeItem(groupId, item.event_id);
+      }
+    }, name));
+  });
+  // 不可拖动的元素（未分组数据）
+  var SortableItemNotDrag = function SortableItemNotDrag(data) {
+    var item = data.item,
+      index = data.index;
+    var name = item.alias_name ? item.alias_name : item.event_name;
+    return /*#__PURE__*/React.createElement(Tooltip, {
+      title: "".concat(item.owner === 'zg_vtl' ? '虚拟事件' : '元事件', " | ").concat(name),
+      key: index
+    }, /*#__PURE__*/React.createElement(Checkbox, {
+      className: "checkbox-item ".concat(item.event_hidden ? 'event-hidden' : '', " column-").concat(groupId),
+      checked: item.checked,
+      key: index,
+      onChange: function onChange() {
+        return onChangeItem(groupId, item.event_id);
+      }
+    }, name));
+  };
+  // 整个元素排序的容器
+  var SortableList = SortableContainer(function () {
+    return /*#__PURE__*/React.createElement("div", {
+      key: componnetIndex
+    }, componnetData.map(function (item, index) {
+      if (groupId !== -1) {
+        return /*#__PURE__*/React.createElement(SortableItem, {
+          key: "item-".concat(index),
+          index: index,
+          value: {
+            item: item,
+            index: index
+          }
+        });
+      } else {
+        return SortableItemNotDrag({
+          item: item,
+          index: index
+        });
+      }
+    }));
+  });
+  var onChangeItem = function onChangeItem(groupId, eventId) {
+    setGroupingData(_.cloneDeep(eventChecked(groupId, eventId, groupingData)));
+  };
+  var onSortEnd = function onSortEnd(data) {
+    var oldIndex = data.oldIndex,
+      newIndex = data.newIndex;
+    var eventList = arrayMoveImmutable(componnetData, oldIndex, newIndex);
+    var ids = [];
+    eventList.map(function (item) {
+      ids.push(item.event_id);
+    });
+    groupingData.map(function (item) {
+      if (item.groupId === groupId) {
+        item.eventList = eventList;
+      }
+    });
+    setGroupingData(_.cloneDeep(groupingData));
+    request(apis.orderEvent, {
+      method: 'post',
+      data: {
+        appId: getAppID(currentApp),
+        groupId: groupId,
+        ids: ids.join(',')
+      }
+    }).then(function () {});
+  };
+  return /*#__PURE__*/React.createElement(SortableList, {
+    distance: 5,
+    axis: 'xy',
+    helperClass: "".concat(classPrefix, "-sortableList"),
+    onSortEnd: onSortEnd
+  });
+};
+export default SortableComponnet;

package/es/modules/dataCollection/{tablePlus.d.ts → components/tablePlus.d.ts}

@@ -1,5 +1,5 @@
 import React from 'react';
-import './styles/index.less';
+import '../styles/index.less';
 interface DataType {
     key: React.Key;
     groupId?: number;
@@ -15,6 +15,7 @@ interface DataType {
     is_delete: number;
     _groupId?: number;
     mark_type: number;
+    owner: string;
 }
 interface queryPlanType {
     unexpectedPropList: string[];

package/es/modules/dataCollection/{tablePlus.js → components/tablePlus.js}

@@ -12,14 +12,13 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { BizGlobalDataContext, IconFont } from '@zgfe/business-lib';
 import { Input, Table, Select, message, Modal, Popover, Checkbox } from 'antd';
-import request from '../../utils/ajax';
-import apis from '../../constants/api';
-var Option = Select.Option;
+import request from '../../../utils/ajax';
+import apis from '../../../constants/api';
 import React, { useEffect, useState, useContext } from 'react';
-import './styles/index.less';
+import '../styles/index.less';
 import _ from 'lodash';
-import { getAppID, getTableScroll } from '../../utils';
-import { DmContext } from '../../store';
+import { getAppID, getTableScroll } from '../../../utils';
+import { DmContext } from '../../../store';
 var TablePlus = function TablePlus(props) {
   var classPrefix = 'table-plus';
   var tableHandleData = props.tableHandleData,
@@ -31,58 +30,64 @@ var TablePlus = function TablePlus(props) {
     authority = _useContext.authority;
   var _useContext2 = useContext(DmContext),
     state = _useContext2.state;
-  // 别名foucs
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    aliasFocusData = _useState2[0],
-    setAliasFocusData = _useState2[1];
-  var aliasFocus = function aliasFocus(e) {
-    setAliasFocusData(e.currentTarget.value);
+  // 表格class处理
+  var rowClassNameHandle = function rowClassNameHandle(record) {
+    if (record.groupId != undefined) {
+      return 'group-row';
+    } else {
+      var _queryPlanData$unexpe;
+      return (queryPlanData === null || queryPlanData === void 0 ? void 0 : (_queryPlanData$unexpe = queryPlanData.unexpectedEventList) === null || _queryPlanData$unexpe === void 0 ? void 0 : _queryPlanData$unexpe.indexOf(record.event_name)) != -1 && isOpen == 1 && record.owner != 'zg_abp' ? 'error-row' : '';
+    }
   };
-  // 修改别名
-  var aliasNameBlur = function aliasNameBlur(e, record) {
-    var value = e.currentTarget.value;
-    if (aliasFocusData == value) return; // 失焦判断，内容无修改不请求接口
+  // 修改事件别名
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    aliasNameShow = _useState2[0],
+    setaliasNameShow = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    aliasNameInput = _useState4[0],
+    setAliasNameInput = _useState4[1];
+  var _useState5 = useState(-1),
+    _useState6 = _slicedToArray(_useState5, 2),
+    aliasNameId = _useState6[0],
+    setAliasNameId = _useState6[1];
+  // 修改事件别名
+  var aliasNameEdit = function aliasNameEdit() {
+    if (eventNameInput.length > 20) {
+      message.error('名称不可超过20字符');
+      return;
+    }
     request(apis.updateEventInfo, {
       method: 'post',
-      params: {
-        app_id: getAppID(currentApp),
-        alias_name: value,
-        event_id: record.event_id
+      data: {
+        appId: getAppID(currentApp),
+        aliasName: aliasNameInput,
+        eventId: aliasNameId
       }
     }).then(function (res) {
       if (res) {
         message.success('修改成功');
         props.Refresh();
-        state.updateEventMetas && state.updateEventMetas(); // 更新store
       }
-    }).catch(function (err) {}).finally(function () {
-      setAliasFocusData('');
+    }).finally(function () {
+      setaliasNameShow(false);
     });
   };
-  // 表格class处理
-  var rowClassNameHandle = function rowClassNameHandle(record) {
-    if (record.groupId != undefined) {
-      return 'group-row';
-    } else {
-      var _queryPlanData$unexpe;
-      return (queryPlanData === null || queryPlanData === void 0 ? void 0 : (_queryPlanData$unexpe = queryPlanData.unexpectedEventList) === null || _queryPlanData$unexpe === void 0 ? void 0 : _queryPlanData$unexpe.indexOf(record.event_name)) != -1 && isOpen == 1 && record.owner != 'zg_abp' ? 'error-row' : '';
-    }
-  };
   // 控制修改分组名弹框 显示隐藏
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    eventNameShow = _useState4[0],
-    setEventNameShow = _useState4[1];
-  // 修改分组名数据
-  var _useState5 = useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    eventNameInput = _useState6[0],
-    setEventNameInput = _useState6[1];
-  var _useState7 = useState({}),
+  var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    eventNameData = _useState8[0],
-    setEventNameData = _useState8[1];
+    eventNameShow = _useState8[0],
+    setEventNameShow = _useState8[1];
+  // 修改分组名数据
+  var _useState9 = useState(''),
+    _useState10 = _slicedToArray(_useState9, 2),
+    eventNameInput = _useState10[0],
+    setEventNameInput = _useState10[1];
+  var _useState11 = useState({}),
+    _useState12 = _slicedToArray(_useState11, 2),
+    eventNameData = _useState12[0],
+    setEventNameData = _useState12[1];
   // 修改分组名
   var eventNameEdit = function eventNameEdit() {
     if (eventNameInput.length > 20) {
@@ -101,10 +106,9 @@ var TablePlus = function TablePlus(props) {
       if (res.code == '00') {
         message.success('修改成功');
         props.Refresh();
+        setEventNameShow(false);
         state.updateEventMetas && state.updateEventMetas(); // 更新store
       }
-    }).catch(function (err) {}).finally(function () {
-      setEventNameShow(false);
     });
   };
   // 删除分组
@@ -133,32 +137,56 @@ var TablePlus = function TablePlus(props) {
             props.Refresh();
             state.updateEventMetas && state.updateEventMetas(); // 更新store
           }
-        }).catch(function (err) {}).finally(function () {});
+        });
       }
     });
   };
   // 删除事件
-  var eventItemDel = function eventItemDel(event_id) {
+  var eventItemDel = function eventItemDel(record) {
+    if (record.owner !== 'zg_abp') {
+      if (record.owner === 'zg') {
+        request(apis.checkEventStatus, {
+          method: 'get',
+          params: {
+            appId: getAppID(currentApp),
+            eventId: record.event_id
+          }
+        }).then(function (res) {
+          // 该事件在虚拟事件中有使用
+          if (res.data === 1) {
+            eventDelModal(record.event_id, '检测到该事件在虚拟事件中使用');
+          } else {
+            eventDelModal(record.event_id, '删除后，将停止采集该事件数据，也将不在分析平台中显示！');
+          }
+        });
+      } else {
+        eventDelModal(record.event_id, '删除后，将停止采集该事件数据，也将不在分析平台中显示！');
+      }
+    } else {
+      message.error('内置事件无法删除');
+    }
+  };
+  var eventDelModal = function eventDelModal(eventId, text) {
     Modal.confirm({
       centered: true,
       title: '是否确认删除？',
-      content: '删除后，将停止采集该事件数据，也将不在分析平台中显示！',
+      content: text,
       okText: '确认',
       cancelText: '取消',
       maskClosable: false,
       onOk: function onOk() {
         request(apis.deleteEventMeta, {
           method: 'post',
-          params: {
-            app_id: getAppID(currentApp),
-            event_id: event_id
+          data: {
+            appId: getAppID(currentApp),
+            eventId: eventId
           }
         }).then(function (res) {
           if (res) {
             message.success('删除成功');
             props.Refresh();
           }
-        }).catch(function (err) {}).finally(function () {});
+        });
       }
     });
   };
@@ -173,26 +201,26 @@ var TablePlus = function TablePlus(props) {
         break;
       case 'is_stop':
         _temp = {
-          is_stop: e
+          isStop: e
         };
         break;
       case 'mark_type':
         _temp = {
-          mark_type: e == null ? 1 : 0
+          markType: e == null ? 1 : 0
         };
         break;
     }
     request(apis.updateEventInfo, {
       method: 'post',
       params: _objectSpread({
-        app_id: getAppID(currentApp),
-        event_id: record.event_id
+        appId: getAppID(currentApp),
+        eventId: record.event_id
       }, _temp)
-    }).then(function (res) {
+    }).then(function () {
       message.success('修改成功');
       props.Refresh();
       state.updateEventMetas && state.updateEventMetas(); // 更新store
-    }).catch(function (err) {}).finally(function () {});
+    });
   };
   // 复制事件名称
   var copyEventName = function copyEventName(event_name) {
@@ -211,17 +239,16 @@ var TablePlus = function TablePlus(props) {
     }
   };
   // 手否筛选收藏
-  var _useState9 = useState(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    markActive = _useState10[0],
-    setMarkActive = _useState10[1];
+  var _useState13 = useState(false),
+    _useState14 = _slicedToArray(_useState13, 2),
+    markActive = _useState14[0],
+    setMarkActive = _useState14[1];
   // 分组操作-勾选数据
-  var _useState11 = useState({}),
-    _useState12 = _slicedToArray(_useState11, 2),
-    groupCheckedData = _useState12[0],
-    setGroupCheckedData = _useState12[1];
+  var _useState15 = useState({}),
+    _useState16 = _slicedToArray(_useState15, 2),
+    groupCheckedData = _useState16[0],
+    setGroupCheckedData = _useState16[1];
   var eventItemCheckbox = function eventItemCheckbox(e, data) {
-    // console.log(e.target.checked, data._groupId, data.event_id);
     var _groupCheckedData = _.cloneDeep(groupCheckedData);
     if (e.target.checked) {
       _groupCheckedData[data._groupId] == undefined ? _groupCheckedData[data._groupId] = [] : null;
@@ -233,12 +260,8 @@ var TablePlus = function TablePlus(props) {
     }
     setGroupCheckedData(_groupCheckedData);
   };
-  // useEffect(() => {
-  //   console.log('groupCheckedData', groupCheckedData);
-  // }, [groupCheckedData]);
   // 判断每一行的选中
   var checkedItemHandle = function checkedItemHandle(record) {
-    // console.log(record.event_id, record._groupId, groupCheckedData);
     if (Object.keys(groupCheckedData).length <= 0) {
       return false;
     } else {
@@ -247,7 +270,6 @@ var TablePlus = function TablePlus(props) {
   };
   // 移入到组、移出分组、复制到组
   var groupHandle = function groupHandle(type, data, eventGroupId) {
-    // console.log('type', type, eventGroupId, data.groupId);
     var _temp = {};
     if (eventGroupId != undefined) _temp = {
       eventGroupId: eventGroupId
@@ -271,7 +293,7 @@ var TablePlus = function TablePlus(props) {
         setGroupCheckedData({});
         state.updateEventMetas && state.updateEventMetas(); // 更新store
       }
-    }).catch(function (err) {}).finally(function () {
+    }).finally(function () {
       props.Refresh();
     });
   };
@@ -308,7 +330,7 @@ var TablePlus = function TablePlus(props) {
     key: 'event_name',
     fixed: 'left',
     width: 180,
-    render: function render(text, record, index) {
+    render: function render(text, record) {
       if (record.groupId) {
         var _groupCheckedData$rec;
         return /*#__PURE__*/React.createElement("div", {
@@ -377,46 +399,36 @@ var TablePlus = function TablePlus(props) {
     dataIndex: 'alias_name',
     key: 'alias_name',
     width: 167,
-    render: function render(text, record, index) {
-      if (!record.alias_name) {
-        return /*#__PURE__*/React.createElement(Input, {
-          className: "alias_name",
-          placeholder: "\u7F16\u8F91\u522B\u540D",
-          disabled: isDemo,
-          defaultValue: record.alias_name,
-          onFocus: aliasFocus,
-          onBlur: function onBlur(e) {
-            aliasNameBlur(e, record);
-          }
-        });
-      } else {
-        return /*#__PURE__*/React.createElement(Popover, {
-          content: /*#__PURE__*/React.createElement("div", {
-            style: {
-              width: '200px',
-              wordBreak: 'break-all'
-            }
-          }, record.alias_name),
-          trigger: "hover",
-          placement: "top"
-        }, /*#__PURE__*/React.createElement(Input, {
-          className: "alias_name",
-          placeholder: "\u7F16\u8F91\u522B\u540D",
-          disabled: isDemo,
-          defaultValue: record.alias_name,
-          onFocus: aliasFocus,
-          onBlur: function onBlur(e) {
-            aliasNameBlur(e, record);
+    render: function render(_, record) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "alias_name"
+      }, /*#__PURE__*/React.createElement(Popover, {
+        content: /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: '200px',
+            wordBreak: 'break-all'
           }
-        }));
-      }
+        }, record.alias_name),
+        trigger: "hover",
+        placement: "top"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: 'alias_name_text'
+      }, record.alias_name)), /*#__PURE__*/React.createElement(IconFont, {
+        className: "edit-alias-name",
+        onClick: function onClick() {
+          setAliasNameInput(record.alias_name);
+          setAliasNameId(record.event_id);
+          setaliasNameShow(true);
+        },
+        type: "zhongmingming"
+      }));
     }
   }, {
     title: '首次上报时间',
     dataIndex: 'insert_time',
     key: 'insert_time',
     width: 187,
-    render: function render(text, record, index) {
+    render: function render(text) {
       return /*#__PURE__*/React.createElement("div", {
         className: "insert_time"
       }, text);
@@ -426,7 +438,7 @@ var TablePlus = function TablePlus(props) {
     dataIndex: 'last_insert_time',
     key: 'last_insert_time',
     width: 187,
-    render: function render(text, record, index) {
+    render: function render(_, record) {
       return /*#__PURE__*/React.createElement("div", null, record.last_insert_time);
     }
   }, {
@@ -454,7 +466,7 @@ var TablePlus = function TablePlus(props) {
     dataIndex: 'event_hidden',
     key: 'event_hidden',
     width: 167,
-    render: function render(text, record, index) {
+    render: function render(_, record) {
       return /*#__PURE__*/React.createElement(Select, {
         defaultValue: record.event_hidden,
         style: {
@@ -499,7 +511,7 @@ var TablePlus = function TablePlus(props) {
     dataIndex: 'is_stop',
     key: 'is_stop',
     width: 167,
-    render: function render(text, record, index) {
+    render: function render(_, record) {
       return /*#__PURE__*/React.createElement(Select, {
         defaultValue: record.is_stop,
         style: {
@@ -523,7 +535,7 @@ var TablePlus = function TablePlus(props) {
     dataIndex: 'event_attrs',
     key: 'event_attrs',
     width: 167,
-    render: function render(text, record, index) {
+    render: function render(_, record) {
       return /*#__PURE__*/React.createElement("div", {
         className: "event_attrs"
       }, record.event_attrs.length, /*#__PURE__*/React.createElement(IconFont, {
@@ -541,9 +553,9 @@ var TablePlus = function TablePlus(props) {
     title: '操作',
     dataIndex: 'set',
     key: 'set',
-    width: 80,
+    width: 110,
     fixed: 'right',
-    render: function render(text, record, index) {
+    render: function render(_, record) {
       if (record.groupId) {
         if (record.groupId == -1) return '';
         return /*#__PURE__*/React.createElement("div", {
@@ -580,35 +592,16 @@ var TablePlus = function TablePlus(props) {
               message.error('无修改权限');
               return;
             }
-            record.owner != 'zg_abp' ? eventItemDel(record.event_id) : message.error('内置事件无法删除');
+            eventItemDel(record);
           }
         }, "\u5220\u9664");
       }
     }
   }];
-  // const [isMore, setIsMore] = useState(true); // 是否还有数据
-  // const [pageNumber, setPageNumber] = useState(1); // 页码
-  // let scrollRef: any;
-  // const onScrollCapture = (e:any) => {
-  //   // scrollTop会有小数点导致等式不成立，解决方案：四舍五入
-  //   if (
-  //     Math.round(scrollRef.scrollTop) + scrollRef.clientHeight == scrollRef.scrollHeight
-  //   ) {
-  //     if (Math.ceil(props.total / 10) == pageNumber) {
-  //       setIsMore(false);
-  //       return false;
-  //     }
-  //     // getList(page + 1);
-  //     setPageNumber(pageNumber + 1);
-  //   }
-  // };
-  // useEffect(() => {
-  //   pageNumber != 1 && props.pageSizeChange(pageNumber);
-  // }, [pageNumber]);
-  var _useState13 = useState(''),
-    _useState14 = _slicedToArray(_useState13, 2),
-    scrollY = _useState14[0],
-    setScrollY = _useState14[1];
+  var _useState17 = useState(''),
+    _useState18 = _slicedToArray(_useState17, 2),
+    scrollY = _useState18[0],
+    setScrollY = _useState18[1];
   //页面加载完成后才能获取到对应的元素及其位置
   useEffect(function () {
     var _Y = getTableScroll(102);
@@ -620,7 +613,6 @@ var TablePlus = function TablePlus(props) {
   }, /*#__PURE__*/React.createElement(Table, {
     className: "".concat(classPrefix, "-table"),
     id: "tablePlus",
-    // style={{ minHeight: '640px' }}
     columns: columns,
     rowKey: "key",
     loading: props.loading,
@@ -652,6 +644,24 @@ var TablePlus = function TablePlus(props) {
     onChange: function onChange(e) {
       return setEventNameInput(e.currentTarget.value);
     }
+  })), /*#__PURE__*/React.createElement(Modal, {
+    title: "\u4FEE\u6539\u4E8B\u4EF6\u522B\u540D",
+    bodyStyle: {
+      padding: '0 24px 24px 24px'
+    },
+    destroyOnClose: true,
+    open: aliasNameShow,
+    getContainer: false,
+    onOk: aliasNameEdit,
+    onCancel: function onCancel() {
+      return setaliasNameShow(false);
+    }
+  }, /*#__PURE__*/React.createElement(Input, {
+    placeholder: "\u8BF7\u8F93\u5165\u4E8B\u4EF6\u522B\u540D",
+    value: aliasNameInput,
+    onChange: function onChange(e) {
+      return setAliasNameInput(e.currentTarget.value);
+    }
   })));
 };
 export default TablePlus;

package/es/modules/dataCollection/components/virtualTablePlus.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import '../styles/index.less';
+import { TablePlusType } from '../types';
+declare const VirtualTablePlus: React.FC<TablePlusType>;
+export default VirtualTablePlus;