@zgfe/modules-attribution 1.0.5 → 1.1.0

package/{dist/esm → es}/modules/home/index.js

@@ -1,38 +1,26 @@
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 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) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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 = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+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 React, { useContext, useEffect, useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { Spin } from 'antd';
-import { BizGlobalDataContext } from '@zgfe/business-lib';
-import "./styles/index.less";
-import { AttributionContext } from "../../types";
-import EditTitle from "../../components/title";
-import { getInitDate, initTarget } from "../../constants/initData";
-import { transferEventSearchData } from "../../utils/transfer";
-import InsightContent from "../content";
-var classPrefix = 'insight-container';
-var ModuleAttribution = function ModuleAttribution(props) {
+import './styles/index.less';
+import { AttributableContext } from '../../types';
+import EditTitle from '../../components/title';
+import { getInitDate, initTarget } from '../../constants/initData';
+import AttributionContent from '../content';
+var classPrefix = 'attribution-container';
+var AttributionHome = function AttributionHome(props) {
   var _props$defaultValue;
-  // 属性
-  var _useContext = useContext(BizGlobalDataContext),
-    userPropList = _useContext.userPropList,
-    eventGroupList = _useContext.eventGroupList,
-    eventEnvList = _useContext.eventEnvList,
-    userGroupList = _useContext.userGroupList;
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     searchData = _useState2[0],
     setSearchData = _useState2[1];
-  // 初始状态
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
     loading = _useState4[0],
@@ -41,7 +29,6 @@ var ModuleAttribution = function ModuleAttribution(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     pageLoading = _useState6[0],
     setPageLoading = _useState6[1];
-  // 指标标题
   var _useState7 = useState(),
     _useState8 = _slicedToArray(_useState7, 2),
     title = _useState8[0],
@@ -54,23 +41,20 @@ var ModuleAttribution = function ModuleAttribution(props) {
     _useState12 = _slicedToArray(_useState11, 2),
     elementId = _useState12[0],
     setElementId = _useState12[1];
-  var _useState13 = useState(),
+  var _useState13 = useState(false),
     _useState14 = _slicedToArray(_useState13, 2),
-    showList = _useState14[0],
-    setShowList = _useState14[1];
-  var _useState15 = useState(false),
+    searching = _useState14[0],
+    setSearching = _useState14[1];
+  var _useState15 = useState(true),
     _useState16 = _slicedToArray(_useState15, 2),
-    searching = _useState16[0],
-    setSearching = _useState16[1];
+    buttonDisable = _useState16[0],
+    setButtonDisable = _useState16[1];
   var attributionRef = useRef(null);
-  // 初始化
   useEffect(function () {
     setPageLoading(true);
-    // 设置初始值
     if (!props.defaultValue) {
       initSearch();
     } else {
-      setShowList(props.defaultValue.chosen_data);
       setPanelId(props.defaultValue.panelId);
       setElementId(props.defaultValue.id);
       setTitle(props.defaultValue.name);
@@ -78,54 +62,32 @@ var ModuleAttribution = function ModuleAttribution(props) {
       if (!initData) {
         initSearch();
       } else {
-        // 老事件分析数据
-        if (initData.module) {
-          initData = transferEventSearchData(initData, userPropList, eventGroupList, eventEnvList);
-        }
-        var chartType = initData.chartType ? initData.chartType.split(',')[0] : 'line';
-        if (!initData.userGroup || !initData.targets) {
-          setSearchData(function (data) {
-            return _objectSpread(_objectSpread(_objectSpread({}, data), initData), {}, {
-              chartType: chartType
-            });
-          });
-        } else {
-          setSearchData(_objectSpread(_objectSpread({}, initData), {}, {
-            chartType: chartType
-          }));
-        }
+        setSearchData(_objectSpread({}, initData));
       }
     }
     setTimeout(function () {
       setPageLoading(false);
     }, 0);
   }, []);
-
-  // 查询条件初始化
   var initSearch = function initSearch() {
     setSearchData({
-      targets: initTarget,
-      userGroup: (userGroupList === null || userGroupList === void 0 ? void 0 : userGroupList.length) > 0 ? [userGroupList[0].id] : [0],
-      time: getInitDate(props.includeToday),
-      chartType: 'line'
+      targetFilters: initTarget,
+      sourceFilters: initTarget,
+      time: getInitDate(props.includeToday)
     });
   };
-
-  // 改变loading
   var changeLoading = function changeLoading(flag) {
     setLoading(flag);
   };
-
-  // 保存
   var onSave = function onSave() {
     if (attributionRef) {
+      attributionRef.current.onGetSearchData();
       attributionRef.current.savePanel();
     }
   };
-
-  // 另存为
   var onSaveAs = function onSaveAs() {
     if (attributionRef) {
+      attributionRef.current.onGetSearchData();
       attributionRef.current.saveAsPanel();
     }
   };
@@ -135,19 +97,18 @@ var ModuleAttribution = function ModuleAttribution(props) {
   return /*#__PURE__*/React.createElement(Spin, {
     spinning: loading,
     wrapperClassName: classPrefix
-  }, /*#__PURE__*/React.createElement(AttributionContext.Provider, {
+  }, /*#__PURE__*/React.createElement(AttributableContext.Provider, {
     value: {
       panelId: panelId,
       elementId: elementId,
       panelName: title,
       searching: searching,
+      buttonDisable: buttonDisable,
+      setButtonDisable: setButtonDisable,
       includeToday: props.includeToday,
-      defaultSearch: props.defaultValue,
-      enableAddScene: !props.defaultValue,
-      enableGenerateReport: props.enableGenerateReport,
+      enableAddScene: !props.defaultValue || props.defaultValue.source === 'attribution',
       changeLoading: changeLoading,
-      afterEditTarget: props.afterEditTarget,
-      onUserDrill: props.onUserDrill
+      afterEditTarget: props.afterEditTarget
     }
   }, panelId && /*#__PURE__*/React.createElement(EditTitle, {
     title: title,
@@ -155,18 +116,19 @@ var ModuleAttribution = function ModuleAttribution(props) {
     onSave: onSave,
     onSaveAs: onSaveAs,
     onEditTitle: setTitle
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-content ").concat(panelId ? classPrefix + 'content2' : '')
-  }, /*#__PURE__*/React.createElement(InsightContent, {
+  }), !panelId && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-header-title")
+  }, "\u5F52\u56E0"), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-content ").concat(panelId ? classPrefix + '-content2' : '')
+  }, /*#__PURE__*/React.createElement(AttributionContent, {
     ref: attributionRef,
     value: searchData,
-    show: showList,
     onSearching: function onSearching(val) {
       return setSearching(val);
     }
   }))));
 };
-ModuleAttribution.defaultProps = {
+AttributionHome.defaultProps = {
   includeToday: true
 };
-export default ModuleAttribution;
+export default AttributionHome;

package/es/modules/home/styles/index.less

@@ -0,0 +1,68 @@
+.attribution-container {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #fff;
+  .ant-spin-container {
+    width: 100%;
+    height: 100%;
+  }
+  &-header-title {
+    height: 48px;
+    padding: 0px 24px;
+    color: #021429;
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 48px;
+  }
+  &-content {
+    width: 100%;
+    height: 100%;
+    // overflow: auto;
+    overflow-x: hidden;
+    background: #fff;
+    border-top: 1px solid #eaeaea;
+    .attribution-content {
+      &-top-content {
+        background: #fafafb;
+        padding: 16px 24px;
+        &-box{
+          padding: 24px;
+          background: #fff;
+          border: 1px solid #ECEDF0;
+          border-radius: 8px;
+        }
+      }
+      &-bottom-content-box {
+        min-height: 382px;
+        padding: 24px;
+        background: #fff;
+        &-times {
+          display: flex;
+          justify-content: space-between;
+        }
+      }
+    }
+  }
+
+  &-content2 {
+    height: calc(100% - 64px);
+  }
+
+  .biz-event-select.border .biz-event-select-handle {
+    padding: 0;
+    border: none;
+  }
+
+  .biz-select-option:not(.biz-select-option-multiple),
+  .biz-attr-select-option {
+    &.active {
+      // background: @primary-color !important;
+    }
+  }
+
+  // 设置下拉框最大高度
+  .biz-select-overlay {
+    max-height: 300px;
+  }
+}

package/{dist/esm → es}/modules/home/types.d.ts

@@ -1,19 +1,16 @@
-import { SearchValue } from '../../types';
 export declare namespace AttributionProps {
     interface Props {
         defaultValue?: Value;
         includeToday?: boolean;
-        enableGenerateReport?: boolean;
         afterEditTarget?: (type: string, value?: any) => void;
-        onUserDrill?: (data: any, searchData: SearchValue) => void;
     }
     interface Value {
         panelId?: number;
         panelType?: 'edit' | 'add';
+        source?: string;
         name?: string;
         id?: number;
         data?: any;
-        chosen_data?: string[];
         [props: string]: any;
     }
 }

package/es/modules/searchPanel/components/attributableEvents.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SearchPanelTypes } from '../types';
+declare const AttributableEvents: React.FC<SearchPanelTypes.PanelProp>;
+export default AttributableEvents;

package/es/modules/searchPanel/components/attributableEvents.js

@@ -0,0 +1,290 @@
+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 React, { useEffect, useRef, useState, useContext } from 'react';
+import { BizAttributeSelector, BizAttrConditionGroup, BizEventSelector, IconFont } from '@zgfe/business-lib';
+import { AttributableContext } from '../../../types';
+import _ from 'lodash';
+import { Tooltip, message } from 'antd';
+var AttributableEvents = function AttributableEvents(props) {
+  var value = props.value,
+    fieldsLength = props.fieldsLength,
+    setMincePropCount = props.setMincePropCount,
+    mincePropCount = props.mincePropCount,
+    attrSourceCount = props.attrSourceCount,
+    setAttrSourceCount = props.setAttrSourceCount,
+    formData = props.formData,
+    eventIdList = props.eventIdList,
+    onDelete = props.onDelete;
+  var _useContext = useContext(AttributableContext),
+    setButtonDisable = _useContext.setButtonDisable;
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    ReasonData = _useState2[0],
+    setReasonData = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    attrSelectShow = _useState4[0],
+    setAttrSelectShow = _useState4[1];
+  var _useState5 = useState(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    filters = _useState6[0],
+    setFilters = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    count = _useState8[0],
+    setCount = _useState8[1];
+  var _useState9 = useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    countLoading = _useState10[0],
+    setCountLoading = _useState10[1];
+  var _useState11 = useState(false),
+    _useState12 = _slicedToArray(_useState11, 2),
+    isAdd = _useState12[0],
+    setIsAdd = _useState12[1];
+  var conditionRef = useRef(null);
+  var _useState13 = useState(-1),
+    _useState14 = _slicedToArray(_useState13, 2),
+    eventId = _useState14[0],
+    setEventId = _useState14[1];
+  var _useState15 = useState(),
+    _useState16 = _slicedToArray(_useState15, 2),
+    minceAttr = _useState16[0],
+    setMinceAttr = _useState16[1];
+  var bizEventSelectorDefaultValue = {};
+  if (value && value.eventId && value.eventId != -100) {
+    bizEventSelectorDefaultValue = {
+      event: {
+        id: value.eventId,
+        name: value.eventName
+      }
+    };
+  }
+  var _useState17 = useState(),
+    _useState18 = _slicedToArray(_useState17, 2),
+    bizAttributeSelectorValue = _useState18[0],
+    setBizAttributeSelectorValue = _useState18[1];
+  useEffect(function () {
+    if (value) {
+      var _value$filters;
+      setReasonData({
+        event: {
+          id: value.eventId,
+          name: value.eventName
+        }
+      });
+      setFilters(value.filters);
+      setMinceAttr(value.attributionSubdivision);
+      if (eventIdList && eventIdList.length >= 0) {
+        setEventId(eventIdList[0]);
+      }
+      if (value.attributionSubdivision && value.attributionSubdivision.conditions) {
+        setBizAttributeSelectorValue({
+          id: value.attributionSubdivision.conditions.attrId,
+          propCategory: value.attributionSubdivision.conditions.propCategory,
+          name: value.attributionSubdivision.conditions.attrName,
+          category: value.attributionSubdivision.conditions.category
+        });
+        setAttrSelectShow(true);
+      }
+      if ((_value$filters = value.filters) === null || _value$filters === void 0 ? void 0 : _value$filters.conditions) {
+        setCount(value.filters.conditions.length);
+      }
+    }
+  }, []);
+  useEffect(function () {
+    setCountLoading(false);
+    if (ReasonData) {
+      handleCount('add', attrSourceCount, setAttrSourceCount, count);
+    }
+  }, [count]);
+  var onEventDelete = function onEventDelete() {
+    if (formData && formData.sourceFilters.length <= 1) {
+      setReasonData(undefined);
+      setAttrSelectShow(false);
+      setFilters(undefined);
+      setIsAdd(false);
+      setBizAttributeSelectorValue(undefined);
+      onChangeHandle(undefined, undefined, undefined);
+      return;
+    }
+    if (ReasonData) {
+      handleCount('delete', attrSourceCount, setAttrSourceCount);
+      handleCount('delete', mincePropCount, setMincePropCount);
+    }
+    onDelete();
+  };
+  var handleCount = function handleCount(type, _attrCount, _setAttrCount, count) {
+    if (ReasonData && ReasonData.event) {
+      var __attrCount = _.cloneDeep(_attrCount);
+      if (type === 'add' && count) {
+        __attrCount[ReasonData.event.id] = count;
+      } else {
+        delete __attrCount[ReasonData.event.id];
+      }
+      _setAttrCount(__attrCount);
+    }
+  };
+  var onChangeFilters = function onChangeFilters(data) {
+    setFilters(data);
+    onChangeHandle(ReasonData, data, minceAttr);
+  };
+  var onAdd = function onAdd() {
+    if (notClickable) {
+      message.error('请先选择待归因事件');
+      return;
+    }
+    if (count >= 5) {
+      message.error('最多可添加5条属性筛选');
+      return;
+    }
+    if (countLoading) {
+      return;
+    }
+    setCountLoading(true);
+    setIsAdd(true);
+    setTimeout(function () {
+      conditionRef.current.add();
+    }, 0);
+  };
+  var onMinceProp = function onMinceProp() {
+    if (notClickable) {
+      message.error('请先选择待归因事件');
+      return;
+    }
+    if (attrSelectShow) {
+      return;
+    }
+    setAttrSelectShow(true);
+    setButtonDisable(true);
+    handleCount('add', mincePropCount, setMincePropCount, 1);
+  };
+  var onChangeReason = function onChangeReason(reason) {
+    setReasonData(reason);
+    if (reason && reason.event) {
+      var _reason$event;
+      setEventId(reason === null || reason === void 0 ? void 0 : (_reason$event = reason.event) === null || _reason$event === void 0 ? void 0 : _reason$event.id);
+    }
+    setFilters(undefined);
+    setBizAttributeSelectorValue(undefined);
+    setIsAdd(false);
+    setCount(0);
+    onChangeHandle(reason, undefined, undefined);
+  };
+  var onChangeAttr = function onChangeAttr(attr) {
+    if (attr === undefined) {
+      handleCount('delete', mincePropCount, setMincePropCount);
+    } else {
+      setBizAttributeSelectorValue({
+        id: attr.id,
+        propCategory: attr.propCategory,
+        name: attr.name,
+        category: attr.category
+      });
+    }
+    var _minceAttr = attr === undefined ? undefined : {
+      relation: "and",
+      conditions: {
+        propCategory: attr.propCategory,
+        type: attr.type,
+        attrId: attr.id,
+        attrName: attr.name,
+        category: attr.category
+      }
+    };
+    setMinceAttr(_minceAttr);
+    onChangeHandle(ReasonData, filters, _minceAttr);
+  };
+  var onChangeHandle = function onChangeHandle(reason, filterData, minceAttr) {
+    if (props.onChange) {
+      var _reason$event2;
+      if (!reason || !reason.event || !((_reason$event2 = reason.event) === null || _reason$event2 === void 0 ? void 0 : _reason$event2.id)) {
+        props.onChange(undefined);
+        return;
+      }
+      ;
+      var event = reason.event;
+      var data = {
+        eventId: event === null || event === void 0 ? void 0 : event.id,
+        eventName: (event === null || event === void 0 ? void 0 : event.alias) || (event === null || event === void 0 ? void 0 : event.name),
+        filters: filterData,
+        attributionSubdivision: minceAttr
+      };
+      props.onChange(data);
+    }
+  };
+  var _useState19 = useState(null),
+    _useState20 = _slicedToArray(_useState19, 2),
+    notClickable = _useState20[0],
+    setNotClickable = _useState20[1];
+  useEffect(function () {
+    var _ReasonData$event;
+    if (ReasonData === undefined || (ReasonData === null || ReasonData === void 0 ? void 0 : (_ReasonData$event = ReasonData.event) === null || _ReasonData$event === void 0 ? void 0 : _ReasonData$event.id) === -100 && Object.keys(bizEventSelectorDefaultValue).length <= 0) {
+      setNotClickable(true);
+    } else {
+      setNotClickable(false);
+    }
+  }, [ReasonData]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "attributable-events-box"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "select-and-attr"
+  }, /*#__PURE__*/React.createElement(BizEventSelector, {
+    showAllEvent: false,
+    showBuiltInTarget: false,
+    popupContainer: false,
+    defaultSelectAble: false,
+    onChange: onChangeReason,
+    value: bizEventSelectorDefaultValue,
+    selectList: eventIdList,
+    placeholder: "\u8BF7\u9009\u62E9\u4E8B\u4EF6"
+  }), attrSelectShow && /*#__PURE__*/React.createElement(BizAttributeSelector, {
+    enableEventProp: true,
+    enableUserProp: true,
+    enableEnvProp: true,
+    eventIdList: [eventId],
+    value: bizAttributeSelectorValue,
+    enableDelete: true,
+    onChange: onChangeAttr,
+    onDelete: function onDelete() {
+      setAttrSelectShow(false);
+      onChangeAttr(undefined);
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "button-box"
+  }, (notClickable === false || fieldsLength && fieldsLength > 1) && /*#__PURE__*/React.createElement(IconFont, {
+    type: "qingchu",
+    onClick: onEventDelete
+  }), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "top",
+    title: '添加属性细分'
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(attrSelectShow || notClickable ? 'disable' : ''),
+    type: "tianjia2",
+    onClick: onMinceProp
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "top",
+    title: '添加属性筛选'
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(count >= 5 || notClickable ? 'disable' : ''),
+    type: "shaixuan",
+    onClick: function onClick() {
+      return onAdd();
+    }
+  })))), /*#__PURE__*/React.createElement("div", null, (filters || isAdd) && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(count > 0 ? 'attr-box-show' : '')
+  }, /*#__PURE__*/React.createElement(BizAttrConditionGroup, {
+    ref: conditionRef,
+    value: filters,
+    onlyAnd: true,
+    enableEventProp: true,
+    enableDelete: true,
+    eventIdList: [eventId],
+    onChange: onChangeFilters,
+    onConditionsCount: setCount
+  }))));
+};
+export default AttributableEvents;

package/{dist/esm/modules/leftPanel → es/modules/searchPanel}/components/globalAttribute.d.ts

@@ -1,8 +1,10 @@
+import { AttrConditionTypes } from '@zgfe/business-lib';
 import React from 'react';
 declare const GlobalAttribute: React.FC<{
-    value?: any;
+    value?: AttrConditionTypes.GroupValue;
     max?: number;
     eventIdList?: number[];
+    setAttrGlobalCount: Function;
     onChange?: (val: any) => void;
 }>;
 export default GlobalAttribute;