@zgfe/modules-dm 1.0.1

package/es/modules/dataCollection/tablePlus.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import './styles/index.less';
+interface DataType {
+    key: React.Key;
+    groupId?: number;
+    groupName?: string;
+    event_name: string;
+    alias_name: string;
+    insert_time: string;
+    last_insert_time: string;
+    event_hidden: number;
+    is_stop: number;
+    event_attrs: [];
+    event_id: number;
+    is_delete: number;
+    _groupId?: number;
+    mark_type: number;
+}
+interface queryPlanType {
+    unexpectedPropList: string[];
+    unexpectedEventList: string[];
+}
+interface TablePlusType {
+    tableHandleData: DataType[];
+    Refresh: Function;
+    eventActiveFilter: Function;
+    markTypeFilter: Function;
+    isOpen: number;
+    queryPlanData: queryPlanType;
+    eventAttrDataHandle: Function;
+    loading: boolean;
+}
+declare const TablePlus: React.FC<TablePlusType>;
+export default TablePlus;

package/es/modules/dataCollection/tablePlus.js

@@ -0,0 +1,598 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+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 React, { useState, useContext } from 'react';
+import './styles/index.less';
+import _ from 'lodash';
+
+var TablePlus = function TablePlus(props) {
+  var classPrefix = 'table-plus';
+  var tableHandleData = props.tableHandleData,
+      queryPlanData = props.queryPlanData,
+      isOpen = props.isOpen;
+
+  var _useContext = useContext(BizGlobalDataContext),
+      currentApp = _useContext.currentApp,
+      isDemo = _useContext.isDemo; // 别名foucs
+
+
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      aliasFocusData = _useState2[0],
+      setAliasFocusData = _useState2[1];
+
+  var aliasFocus = function aliasFocus(e) {
+    setAliasFocusData(e.currentTarget.value);
+  }; // 修改别名
+
+
+  var aliasNameBlur = function aliasNameBlur(e, record) {
+    if (aliasFocusData == e.currentTarget.value) return; // 失焦判断，内容无修改不请求接口
+
+    request(apis.updateEventInfo, {
+      method: 'post',
+      params: {
+        app_id: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+        alias_name: e.currentTarget.value,
+        event_id: record.event_id
+      }
+    }).then(function (res) {
+      if (res) {
+        message.success('修改成功');
+      }
+    }).catch(function (err) {
+      message.success('修改失败');
+    }).finally(function () {});
+  }; // 表格class处理
+
+
+  var rowClassNameHandle = function rowClassNameHandle(record, index) {
+    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 ? '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({}),
+      _useState8 = _slicedToArray(_useState7, 2),
+      eventNameData = _useState8[0],
+      setEventNameData = _useState8[1]; // 修改分组名
+
+
+  var eventNameEdit = function eventNameEdit() {
+    request(apis.upsertEventGroup, {
+      method: 'post',
+      data: {
+        eventGroupName: eventNameInput,
+        eventGroupId: eventNameData.groupId,
+        appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+        platform: 0
+      }
+    }).then(function (res) {
+      if (res) {
+        message.success('修改成功');
+        setEventNameShow(false);
+        props.Refresh();
+      }
+    }).catch(function (err) {
+      message.success('修改失败');
+    }).finally(function () {});
+  }; // 删除分组
+
+
+  var eventNameDel = function eventNameDel(eventGroupId) {
+    var deteleFlag = true;
+    tableHandleData.map(function (item) {
+      item._groupId == eventGroupId ? deteleFlag = false : null;
+    });
+    if (!deteleFlag) return message.error('分组内存在事件，无法删除');
+    Modal.confirm({
+      centered: true,
+      title: '是否确认删除？',
+      okText: '确认',
+      cancelText: '取消',
+      maskClosable: false,
+      onOk: function onOk() {
+        request(apis.deleteEventGroup, {
+          method: 'post',
+          data: {
+            appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+            eventGroupId: eventGroupId
+          }
+        }).then(function (res) {
+          if (res) {
+            message.success('删除成功');
+            props.Refresh();
+          }
+        }).catch(function (err) {
+          message.success('删除失败');
+        }).finally(function () {});
+      }
+    });
+  }; // 删除事件
+
+
+  var eventItemDel = function eventItemDel(event_id) {
+    Modal.confirm({
+      centered: true,
+      title: '是否确认删除？',
+      content: '删除后，将停止采集该事件数据，也将不在分析平台中显示！',
+      okText: '确认',
+      cancelText: '取消',
+      maskClosable: false,
+      onOk: function onOk() {
+        request(apis.deleteEventMeta, {
+          method: 'post',
+          params: {
+            app_id: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+            event_id: event_id
+          }
+        }).then(function (res) {
+          if (res) {
+            message.success('删除成功');
+            props.Refresh();
+          }
+        }).catch(function (err) {
+          message.success('删除失败');
+        }).finally(function () {});
+      }
+    });
+  }; // 修改：显示状态 | 采集状态 | 收藏&取消收藏
+
+
+  var eventHiddenChange = function eventHiddenChange(e, type, event_id) {
+    var _temp;
+
+    switch (type) {
+      case 'event_hidden':
+        _temp = {
+          hidden: e
+        };
+        break;
+
+      case 'is_stop':
+        _temp = {
+          is_stop: e
+        };
+        break;
+
+      case 'mark_type':
+        _temp = {
+          mark_type: e == null ? 1 : 0
+        };
+        break;
+    }
+
+    request(apis.updateEventInfo, {
+      method: 'post',
+      params: _objectSpread({
+        app_id: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+        event_id: event_id
+      }, _temp)
+    }).then(function (res) {
+      if (res) {
+        message.success('修改成功');
+        props.Refresh();
+      }
+    }).catch(function (err) {
+      message.success('修改失败');
+    }).finally(function () {});
+  }; // 复制事件名称
+
+
+  var copyEventName = function copyEventName(event_name) {
+    navigator.clipboard.writeText(event_name);
+    message.success('复制成功');
+  }; // 手否筛选收藏
+
+
+  var _useState9 = useState(false),
+      _useState10 = _slicedToArray(_useState9, 2),
+      markActive = _useState10[0],
+      setMarkActive = _useState10[1]; // 分组操作-勾选数据
+
+
+  var _useState11 = useState({}),
+      _useState12 = _slicedToArray(_useState11, 2),
+      groupCheckedData = _useState12[0],
+      setGroupCheckedData = _useState12[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;
+
+      _groupCheckedData[data._groupId].push(data.event_id);
+    } else {
+      _.remove(_groupCheckedData[data._groupId], function (x) {
+        return x === data.event_id;
+      });
+    }
+
+    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 {
+      return groupCheckedData[record._groupId] && groupCheckedData[record._groupId].indexOf(record.event_id) != -1;
+    }
+  }; // 移入到组、移出分组、复制到组
+
+
+  var groupHandle = function groupHandle(type, data, eventGroupId) {
+    // console.log('type', type, eventGroupId, data.groupId);
+    var _temp = {};
+    if (eventGroupId != undefined) _temp = {
+      eventGroupId: eventGroupId
+    };
+    request(apis.operateGroupRelations, {
+      method: 'post',
+      data: _objectSpread({
+        appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+        platform: 0,
+        hasPublicAttrView: true,
+        eventIds: groupCheckedData[data.groupId].join(','),
+        oldEventGroupId: data.groupId
+      }, _temp)
+    }).then(function (res) {
+      message.success('成功');
+
+      var _groupCheckedData = _.cloneDeep(groupCheckedData);
+
+      delete _groupCheckedData[eventGroupId];
+      setGroupCheckedData({});
+    }).catch(function (err) {
+      message.success('失败');
+    }).finally(function () {
+      props.Refresh();
+    });
+  };
+
+  var groupPopoverContent = function groupPopoverContent(data, type) {
+    var count = 0;
+    var element = tableHandleData.map(function (item, index) {
+      item.groupId != undefined ? count++ : null;
+      if (type == 'copy' && item.groupId == -1) return null; // 复制到组，移出未分组
+
+      return item.groupId != undefined && item.groupId != data.groupId ? /*#__PURE__*/React.createElement("div", {
+        onClick: function onClick() {
+          return groupHandle(type, data, item.groupId);
+        },
+        style: {
+          lineHeight: '30px',
+          cursor: 'pointer'
+        },
+        key: index
+      }, item.groupId == -1 ? '未分组' : item.groupName) : null;
+    }); // console.log(element, count);
+    // 复制分组时：除未分组外，如只有一个分组，则不展示复制分组
+
+    return count <= 2 && type == 'copy' ? null : element;
+  };
+
+  var columns = [{
+    title: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconFont, {
+      style: {
+        color: markActive ? '#fd9f41' : '#999',
+        marginRight: '4px'
+      },
+      onClick: function onClick() {
+        props.markTypeFilter(!markActive);
+        setMarkActive(!markActive);
+      },
+      type: markActive ? 'shoucang' : 'shoucang-kong'
+    }), "\u540D\u79F0"),
+    dataIndex: 'event_name',
+    key: 'event_name',
+    fixed: 'left',
+    width: 180,
+    render: function render(text, record, index) {
+      if (record.groupId) {
+        var _groupCheckedData$rec;
+
+        return /*#__PURE__*/React.createElement("div", {
+          className: "group-box"
+        }, /*#__PURE__*/React.createElement(IconFont, {
+          type: "left"
+        }), /*#__PURE__*/React.createElement("span", {
+          className: "group-text"
+        }, record.groupId == -1 ? '未分组' : record.groupName), ((_groupCheckedData$rec = groupCheckedData[record.groupId]) === null || _groupCheckedData$rec === void 0 ? void 0 : _groupCheckedData$rec.length) > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Popover, {
+          content: function content() {
+            return groupPopoverContent(record, 'move-in');
+          },
+          trigger: "click",
+          placement: "bottom"
+        }, /*#__PURE__*/React.createElement("span", {
+          className: "group-handle"
+        }, "\u79FB\u52A8\u5230\u7EC4")), record.groupId != -1 && /*#__PURE__*/React.createElement(React.Fragment, null, groupPopoverContent(record, 'copy') != null && /*#__PURE__*/React.createElement(Popover, {
+          content: function content() {
+            return groupPopoverContent(record, 'copy');
+          },
+          trigger: "click",
+          placement: "bottom"
+        }, /*#__PURE__*/React.createElement("span", {
+          className: "group-handle"
+        }, "\u590D\u5236\u5230\u7EC4")), /*#__PURE__*/React.createElement("span", {
+          className: "group-handle",
+          onClick: function onClick() {
+            return groupHandle('move-out', record);
+          }
+        }, "\u79FB\u51FA\u5206\u7EC4"))));
+      } else {
+        return /*#__PURE__*/React.createElement("div", {
+          className: "event_name"
+        }, /*#__PURE__*/React.createElement(Checkbox, {
+          checked: checkedItemHandle(record),
+          onChange: function onChange(e) {
+            return eventItemCheckbox(e, record);
+          }
+        }), /*#__PURE__*/React.createElement(IconFont, {
+          className: record.mark_type == 1 ? 'collect-icon-active' : 'collect-icon',
+          onClick: function onClick() {
+            return eventHiddenChange(record.mark_type, 'mark_type', record.event_id);
+          },
+          type: record.mark_type == 1 ? 'shoucang' : 'shoucang-kong'
+        }), /*#__PURE__*/React.createElement(Popover, {
+          content: text
+        }, /*#__PURE__*/React.createElement("span", {
+          className: "event_name-text"
+        }, text)), /*#__PURE__*/React.createElement(IconFont, {
+          className: "copy-text",
+          onClick: function onClick() {
+            return copyEventName(record.event_name);
+          },
+          type: "fuzhi"
+        }));
+      }
+    }
+  }, {
+    title: '别名',
+    dataIndex: 'alias_name',
+    key: 'alias_name',
+    width: 167,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement(Input, {
+        className: "alias_name",
+        placeholder: "\u7F16\u8F91\u522B\u540D",
+        defaultValue: record.alias_name,
+        onFocus: aliasFocus,
+        onBlur: function onBlur(e) {
+          aliasNameBlur(e, record);
+        }
+      });
+    }
+  }, {
+    title: '首次上报时间',
+    dataIndex: 'insert_time',
+    key: 'insert_time',
+    width: 187,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "insert_time"
+      }, text);
+    }
+  }, {
+    title: '末次上报时间',
+    dataIndex: 'last_insert_time',
+    key: 'last_insert_time',
+    width: 187,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement("div", null, record.insert_time);
+    }
+  }, {
+    title: /*#__PURE__*/React.createElement(Select, {
+      defaultValue: -1,
+      bordered: false,
+      style: {
+        width: 150
+      },
+      suffixIcon: /*#__PURE__*/React.createElement(IconFont, {
+        type: "paixu"
+      }),
+      onChange: function onChange(e) {
+        return props.eventActiveFilter(e, 'event_hidden');
+      },
+      options: [{
+        value: -1,
+        label: '所有显示状态'
+      }, {
+        value: 1,
+        label: '隐藏'
+      }, {
+        value: 0,
+        label: '显示'
+      }]
+    }),
+    dataIndex: 'event_hidden',
+    key: 'event_hidden',
+    width: 167,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement(Select, {
+        defaultValue: record.event_hidden,
+        style: {
+          width: 150
+        },
+        onChange: function onChange(e) {
+          return eventHiddenChange(e, 'event_hidden', record.event_id);
+        },
+        options: [{
+          value: 1,
+          label: '隐藏'
+        }, {
+          value: 0,
+          label: '显示'
+        }]
+      });
+    }
+  }, {
+    title: /*#__PURE__*/React.createElement(Select, {
+      defaultValue: -1,
+      bordered: false,
+      style: {
+        width: 150
+      },
+      suffixIcon: /*#__PURE__*/React.createElement(IconFont, {
+        type: "paixu"
+      }),
+      onChange: function onChange(e) {
+        return props.eventActiveFilter(e, 'is_stop');
+      },
+      options: [{
+        value: -1,
+        label: '所有采集状态'
+      }, {
+        value: 1,
+        label: '停止采集'
+      }, {
+        value: 0,
+        label: '采集中'
+      }]
+    }),
+    dataIndex: 'is_stop',
+    key: 'is_stop',
+    width: 167,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement(Select, {
+        defaultValue: record.is_stop,
+        style: {
+          width: 150
+        },
+        onChange: function onChange(e) {
+          return eventHiddenChange(e, 'is_stop', record.event_id);
+        },
+        options: [{
+          value: 1,
+          label: '停止采集'
+        }, {
+          value: 0,
+          label: '采集中'
+        }]
+      });
+    }
+  }, {
+    title: '事件属性',
+    dataIndex: 'event_attrs',
+    key: 'event_attrs',
+    width: 167,
+    render: function render(text, record, index) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "event_attrs"
+      }, record.event_attrs.length, /*#__PURE__*/React.createElement(IconFont, {
+        type: "bianji1",
+        onClick: function onClick() {
+          props.eventAttrDataHandle(record);
+        }
+      }));
+    }
+  }, {
+    title: '操作',
+    dataIndex: 'set',
+    key: 'set',
+    width: 80,
+    fixed: 'right',
+    render: function render(text, record, index) {
+      if (record.groupId) {
+        if (record.groupId == -1) return '';
+        return /*#__PURE__*/React.createElement("div", {
+          className: "edit-del"
+        }, /*#__PURE__*/React.createElement(IconFont, {
+          onClick: function onClick() {
+            setEventNameData({
+              groupName: record.groupName,
+              groupId: record.groupId
+            });
+            setEventNameShow(true);
+          },
+          type: "bianji"
+        }), /*#__PURE__*/React.createElement(IconFont, {
+          onClick: function onClick() {
+            return eventNameDel(record.groupId);
+          },
+          type: "shanchu"
+        }));
+      } else {
+        return /*#__PURE__*/React.createElement("div", {
+          className: "set",
+          onClick: function onClick() {
+            return eventItemDel(record.event_id);
+          }
+        }, "\u5220\u9664");
+      }
+    }
+  }];
+  return /*#__PURE__*/React.createElement("div", {
+    className: classPrefix
+  }, /*#__PURE__*/React.createElement(Table, {
+    className: "".concat(classPrefix, "-table"),
+    columns: columns,
+    rowKey: "key",
+    loading: props.loading,
+    dataSource: tableHandleData,
+    rowClassName: function rowClassName(record, index) {
+      return rowClassNameHandle(record, index);
+    },
+    scroll: {
+      x: 1300,
+      y: 550
+    },
+    pagination: false
+  }), /*#__PURE__*/React.createElement(Modal, {
+    title: "\u4FEE\u6539\u5206\u7EC4\u540D",
+    visible: eventNameShow,
+    onOk: eventNameEdit,
+    onCancel: function onCancel() {
+      return setEventNameShow(false);
+    }
+  }, /*#__PURE__*/React.createElement(Input, {
+    placeholder: "\u8BF7\u8F93\u5165\u5206\u7EC4\u540D",
+    onChange: function onChange(e) {
+      return setEventNameInput(e.currentTarget.value);
+    }
+  })));
+};
+
+export default TablePlus;

package/es/modules/dataManage/demo/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/modules/dataManage/demo/index.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { DataManage } from '@zgfe/modules-dm';
+import DemoWrapper from '../../../components/demo';
+export default (function () {
+  return /*#__PURE__*/React.createElement(DemoWrapper, null, /*#__PURE__*/React.createElement(DataManage, null));
+});

package/es/modules/dataManage/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './styles/index.less';
+declare const DataManage: React.FC;
+export default DataManage;