@zgfe/business-lib 1.0.18 → 1.0.19

package/es/userCondition/demo/index.js

@@ -10,11 +10,221 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import eventData from '../../mock/event';
 import envData from '../../mock/env';
 import userData from '../../mock/user';
 import { BizUserCondition, BizGlobalDataContext, convertAttributeData } from '@zgfe/business-lib';
+var getTagList = Promise.resolve([{
+  appId: 51,
+  createTime: '2022-07-05T13:48:51',
+  del: 0,
+  id: 286,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '行为标签',
+  labelId: 66284406603776,
+  labelName: 'test8（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:48:51'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:47:38',
+  del: 0,
+  id: 285,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '预测标签',
+  labelId: 66283215683584,
+  labelName: 'test7（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:47:38'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:47:10',
+  del: 0,
+  id: 284,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '其他标签',
+  labelId: 66282747314176,
+  labelName: 'test6（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:47:10'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:44:20',
+  del: 0,
+  id: 283,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '其他标签',
+  labelId: 66279963361280,
+  labelName: 'test5（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:44:20'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:43:08',
+  del: 0,
+  id: 282,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '活跃标签',
+  labelId: 66278784057344,
+  labelName: 'test3（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:43:08'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:42:44',
+  del: 0,
+  id: 281,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '其他标签',
+  labelId: 66278393724928,
+  labelName: 'test2（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:42:44'
+}, {
+  appId: 51,
+  createTime: '2022-07-05T13:42:30',
+  del: 0,
+  id: 280,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '预测标签',
+  labelId: 66278158696448,
+  labelName: 'test1（新增）',
+  labelStatus: 1,
+  updateTime: '2022-07-05T13:42:30'
+}, {
+  appId: 51,
+  createTime: '2022-06-21T15:04:24',
+  del: 0,
+  id: 277,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '活跃标签',
+  labelId: 46540583010304,
+  labelName: '匿名用户',
+  labelStatus: 0,
+  updateTime: '2022-06-21T15:04:24'
+}, {
+  appId: 51,
+  createTime: '2022-06-10T11:10:52',
+  del: 0,
+  id: 197,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '活跃标签',
+  labelId: 77384417755136,
+  labelName: '手动更新1',
+  labelStatus: 0,
+  updateTime: '2022-06-10T11:32:31'
+}, {
+  appId: 51,
+  createTime: '2022-06-10T11:10:36',
+  del: 0,
+  id: 196,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '活跃标签',
+  labelId: 77383474429952,
+  labelName: '自动更新修改',
+  labelStatus: 0,
+  updateTime: '2022-06-10T11:11:13'
+}, {
+  appId: 51,
+  createTime: '2022-06-10T10:49:57',
+  del: 0,
+  id: 191,
+  isInner: 0,
+  isStartup: 0,
+  labelGroup: '基本标签',
+  labelId: 77388914425856,
+  labelName: '一般价值',
+  labelStatus: 0,
+  updateTime: '2022-06-10T10:49:57'
+}]);
+var data = {
+  json: [[{
+    eventId: '-4',
+    attrs: [],
+    runPeriod: {
+      operator: 'relative',
+      values: ['30', '1']
+    },
+    runTimes: {
+      operator: '>=',
+      values: ['1']
+    }
+  }, {
+    eventId: '-3',
+    attrs: [],
+    runPeriod: {
+      operator: 'absolute',
+      values: ['2022-07-13', '2022-07-19']
+    },
+    runTimes: {
+      operator: '>=',
+      values: ['1']
+    }
+  }], [{
+    attrs: [{
+      attrId: 0,
+      attrName: 'zg_id',
+      operator: '>',
+      params: ['20'],
+      attrType: 'cont-num',
+      category: 'fixed'
+    }]
+  }, {
+    attrs: [{
+      attrId: 0,
+      attrName: 'app_user_id',
+      operator: 'equal',
+      params: ['20'],
+      attrType: 'cont-string',
+      category: 'fixed'
+    }]
+  }], [{
+    attrs: [{
+      attrId: 0,
+      attrName: 'duration',
+      operator: 'not equal',
+      params: [1198800, '1'],
+      attrType: 'cont-num',
+      category: 'fixed'
+    }]
+  }, {
+    eventId: 24143017,
+    runTimes: {
+      operator: '>=',
+      values: ['1']
+    },
+    attrs: [{
+      attrId: 0,
+      attrName: 'resolution_l',
+      category: 'fixed',
+      operator: '>',
+      params: ['10'],
+      attrType: 'cont-num'
+    }, {
+      attrId: 30183430,
+      attrName: '扫码场景描述',
+      category: 'custom',
+      operator: 'equal',
+      params: ['Microsoft Edge', 'Safari', 'Apple WebKit'],
+      attrType: 'cont-string'
+    }],
+    runPeriod: {
+      operator: 'relative',
+      values: ['30', '0']
+    }
+  }]]
+};
 export default (function () {
   var _useState = useState({
     eventGroupList: [],
@@ -24,6 +234,11 @@ export default (function () {
       _useState2 = _slicedToArray(_useState, 2),
       setStore = _useState2[1];
 
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      userTagsData = _useState4[0],
+      setUserTagsData = _useState4[1];
+
   var newStore = convertAttributeData({
     eventList: eventData,
     userPropList: userData,
@@ -32,42 +247,55 @@ export default (function () {
   useEffect(function () {
     setStore(newStore);
   }, []);
+  useEffect(function () {
+    var tagsMap = {};
+    getTagList.then(function (list) {
+      var data = [];
+      list.forEach(function (item) {
+        var labelGroup = item.labelGroup;
+
+        if (tagsMap[labelGroup]) {
+          tagsMap[labelGroup].push(item);
+        } else {
+          tagsMap[labelGroup] = [item];
+          data.push({
+            labelGroup: labelGroup,
+            children: tagsMap[labelGroup]
+          });
+        }
+      });
+      setUserTagsData(data);
+    });
+  }, []);
+  var defaultValue = useMemo(function () {
+    return data.json;
+  }, [data]);
 
-  function onChange(data) {
-    console.log(JSON.stringify(data));
+  function onChange(value) {
+    console.log(JSON.stringify(value));
   }
 
-  var defaultValue = [[{
-    eventId: 7086293,
-    runTimes: {
-      operator: '>=',
-      values: ['1']
-    },
-    attrs: [{
-      attrId: 30183425,
-      operator: '=',
-      params: ['Apple WebKit', 'Unknown'],
-      attrType: 'cont-string'
-    }, {
-      attrId: 5461057,
-      operator: '>',
-      params: ['123'],
-      attrType: 'cont-num'
-    }],
-    runPeriod: {
-      operator: 'relative',
-      values: ['30', '0']
-    }
-  }]];
+  var descDom = /*#__PURE__*/React.createElement(BizUserCondition, {
+    defaultValue: defaultValue,
+    onChange: onChange,
+    eventAttrNum: 3,
+    openTagCondition: true,
+    userTagsData: userTagsData,
+    isRealTime: true
+  });
   return /*#__PURE__*/React.createElement(BizGlobalDataContext.Provider, {
     value: {
       eventGroupList: newStore.eventGroupList,
       userPropList: newStore.userPropList,
-      eventEnvList: newStore.envPropList
+      eventEnvList: newStore.envPropList,
+      currentApp: {
+        appId: 160,
+        platform: 0
+      }
     }
-  }, /*#__PURE__*/React.createElement(BizUserCondition, {
-    defaultValue: defaultValue,
-    onChange: onChange,
-    eventAttrNum: 3
-  }));
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'inline-block'
+    }
+  }, descDom));
 });

package/es/userCondition/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { BizUserConditionT } from './types';
 import './styles/index.less';
-export declare const BizUserConditionContext: React.Context<Pick<BizUserConditionT.PropsI, "eventAttrNum" | "orConditionNum">>;
+export declare const BizUserConditionContext: React.Context<BizUserConditionT.GlobalContext>;
 export declare const classPrefix = "biz-user-condition";
 declare const BizUserCondition: React.FC<BizUserConditionT.PropsI>;
 export default BizUserCondition;

package/es/userCondition/index.js

@@ -18,21 +18,34 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { createContext, useEffect, useState } from 'react';
+import React, { createContext, useContext, useEffect, useMemo, useState } from 'react';
 import ConditionTypeList from './conditionTypeList';
 import RelationLabel from './relationLabel';
 import OrConditions from './orConditions';
 import './styles/index.less';
 import { buildCondition } from './util';
+import _ from 'lodash';
+import BizGlobalDataContext from '../context';
 export var BizUserConditionContext = /*#__PURE__*/createContext({
   orConditionNum: 2,
-  eventAttrNum: 1
+  eventAttrNum: 1,
+  textMode: false,
+  openTagCondition: false,
+  userTagsData: [],
+  envNameList: [],
+  userPropsMap: {}
 });
 export var classPrefix = 'biz-user-condition';
 
 var BizUserCondition = function BizUserCondition(props) {
+  var _useContext = useContext(BizGlobalDataContext),
+      eventEnvList = _useContext.eventEnvList,
+      userPropList = _useContext.userPropList;
+
   var andConditionNum = props.andConditionNum,
-      defaultValue = props.defaultValue;
+      defaultValue = props.defaultValue,
+      openTagCondition = props.openTagCondition,
+      userTagsData = props.userTagsData;
 
   var _useState = useState([]),
       _useState2 = _slicedToArray(_useState, 2),
@@ -44,18 +57,36 @@ var BizUserCondition = function BizUserCondition(props) {
       dataList = _useState4[0],
       setDataList = _useState4[1];
 
-  var _useState5 = useState(defaultValue || []),
+  var _useState5 = useState(function () {
+    if (defaultValue) {
+      return _.cloneDeep(defaultValue);
+    }
+
+    return [];
+  }),
       _useState6 = _slicedToArray(_useState5, 2),
       value = _useState6[0],
       setValue = _useState6[1];
 
+  var envNameList = useMemo(function () {
+    return eventEnvList ? eventEnvList.map(function (env) {
+      return env.name;
+    }) : [];
+  }, [eventEnvList]);
+  var userPropsMap = useMemo(function () {
+    if (!userPropList) return {};
+    return userPropList.reduce(function (pre, curr) {
+      pre[curr.name] = curr;
+      return pre;
+    }, {});
+  }, [userPropList]);
   useEffect(function () {
     initShowList();
   }, []);
 
   function initShowList() {
     var showList = [];
-    defaultValue.forEach(function (item) {
+    value.forEach(function (item) {
       showList.push({
         id: Math.random(),
         orConditions: item
@@ -106,13 +137,19 @@ var BizUserCondition = function BizUserCondition(props) {
 
     setValue(newValue);
     setDataList(newDataList);
-    props.onChange(newValue);
+    props.onChange && props.onChange(newValue);
   }
 
   return /*#__PURE__*/React.createElement(BizUserConditionContext.Provider, {
     value: {
       orConditionNum: props.orConditionNum || 2,
-      eventAttrNum: props.eventAttrNum || 1
+      eventAttrNum: props.eventAttrNum || 1,
+      textMode: props.textMode,
+      openTagCondition: openTagCondition,
+      userTagsData: userTagsData !== null && userTagsData !== void 0 ? userTagsData : [],
+      isRealTime: props.isRealTime,
+      envNameList: envNameList,
+      userPropsMap: userPropsMap
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: classPrefix
@@ -121,9 +158,10 @@ var BizUserCondition = function BizUserCondition(props) {
   }, /*#__PURE__*/React.createElement(RelationLabel, {
     show: value.length >= 2
   }, "\u4E14"), showList.length ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-and-conditions-wrap")
-  }, showList.map(function (item) {
+    className: ["".concat(classPrefix, "-and-conditions-wrap"), props.textMode ? 'text-mode' : ''].join(' ')
+  }, showList.map(function (item, i) {
     return /*#__PURE__*/React.createElement(OrConditions, {
+      showAndDesc: i > 0,
       orConditions: item.orConditions,
       key: item.id,
       onChange: function onChange(data) {
@@ -138,6 +176,10 @@ var BizUserCondition = function BizUserCondition(props) {
 };
 
 BizUserCondition.defaultProps = {
-  andConditionNum: 5
+  andConditionNum: 5,
+  textMode: false,
+  openTagCondition: false,
+  userTagsData: [],
+  isRealTime: false
 };
 export default BizUserCondition;

package/es/userCondition/orConditions.js

@@ -29,27 +29,26 @@ import { buildCondition } from './util';
 import ConditionWrap from './conditionWrap';
 import PropCondition from './conditions/propCondition';
 import EventCondition from './conditions/eventCondition';
+import TagsCondition from './conditions/tagsCondition';
 import { classPrefix } from '.';
+import Text from './conditions/textDesc';
 
 var OrConditions = function OrConditions(props) {
   var _useContext = useContext(BizUserConditionContext),
-      orConditionNum = _useContext.orConditionNum;
+      orConditionNum = _useContext.orConditionNum,
+      textMode = _useContext.textMode,
+      openTagCondition = _useContext.openTagCondition;
 
-  var orConditions = props.orConditions;
+  var orConditions = props.orConditions,
+      showAndDesc = props.showAndDesc;
 
   var _useState = useState([]),
       _useState2 = _slicedToArray(_useState, 2),
       showList = _useState2[0],
       setShowList = _useState2[1];
 
-  var _useState3 = useState(orConditions),
-      _useState4 = _slicedToArray(_useState3, 2),
-      value = _useState4[0],
-      setValue = _useState4[1];
-
   useEffect(function () {
     if (orConditions) {
-      setValue(orConditions);
       initShowList();
     }
   }, [orConditions]);
@@ -72,8 +71,9 @@ var OrConditions = function OrConditions(props) {
       id: Math.random(),
       condition: condition
     };
-    var newValue = [].concat(_toConsumableArray(value), [condition]);
-    setValue(newValue);
+    var newValue = showList.map(function (item) {
+      return item.condition;
+    }).concat([condition]);
     setShowList([].concat(_toConsumableArray(showList), [newData]));
     props.onChange(newValue);
   }
@@ -117,6 +117,31 @@ var OrConditions = function OrConditions(props) {
     props.onChange(newValue);
   }
 
+  function onChangeTags(id, newTags) {
+    changeData('tag', id, newTags);
+  }
+
+  function changeData(type, id, newData) {
+    var newValue = [];
+    showList.forEach(function (data) {
+      if (id === data.id) {
+        if (type === 'period') {
+          data.condition.runPeriod = newData;
+        } else if (type === 'attr') {
+          data.condition.attrs = newData;
+        } else if (type === 'event') {
+          data.condition = newData;
+        } else if (type === 'tag') {
+          data.condition.labels = newData;
+        }
+      }
+
+      newValue.push(data.condition);
+    });
+    setShowList(_toConsumableArray(showList));
+    props.onChange(newValue);
+  }
+
   function onDelete(id) {
     var index = showList.findIndex(function (item) {
       return item.id === id;
@@ -129,34 +154,52 @@ var OrConditions = function OrConditions(props) {
     var newValue = newList.map(function (item) {
       return item.condition;
     });
-    setValue(newValue);
     props.onChange(newValue);
   }
 
-  function renderCondition(data) {
+  if (textMode) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, textMode && showAndDesc ? /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-and-desc")
+    }, "\u4E14") : null, /*#__PURE__*/React.createElement("span", null, "("), showList.map(function (item, i) {
+      return renderCondition(item, i);
+    }), /*#__PURE__*/React.createElement("span", null, ")"));
+  }
+
+  function renderCondition(data, i) {
     var condition = data.condition,
         id = data.id;
     var conditionDom = null;
 
-    if (condition.eventId === undefined) {
+    if (textMode) {
+      return /*#__PURE__*/React.createElement(Text, {
+        showOrDesc: i > 0,
+        key: id,
+        condition: condition
+      });
+    }
+
+    if (condition.labels) {
+      if (!openTagCondition) return null;
+      conditionDom = /*#__PURE__*/React.createElement(TagsCondition, {
+        labels: condition.labels,
+        dataId: id,
+        onChange: onChangeTags
+      });
+    } else if (condition.eventId === undefined) {
       conditionDom = /*#__PURE__*/React.createElement(PropCondition, {
         label: "\u5C5E\u6027",
         attrs: condition.attrs,
         dataId: id,
         onChange: onChangeAttrs
       });
-    }
-
-    if (condition.eventId === '-3') {
+    } else if (condition.eventId === '-3') {
       conditionDom = /*#__PURE__*/React.createElement(PeriodCondition, {
         label: "\u65B0\u589E\u4E8E",
         dataId: id,
         onChange: onChangeRunPeriod,
         runPeriod: condition.runPeriod
       });
-    }
-
-    if (condition.eventId === '-4') {
+    } else if (condition.eventId === '-4') {
       conditionDom = /*#__PURE__*/React.createElement(PeriodCondition, {
         label: "\u6D3B\u8DC3\u4E8E",
         isRealTime: true,
@@ -164,14 +207,12 @@ var OrConditions = function OrConditions(props) {
         onChange: onChangeRunPeriod,
         runPeriod: condition.runPeriod
       });
-    }
-
-    if (util.isNumber(condition.eventId)) {
-      conditionDom = /*#__PURE__*/React.createElement(EventCondition, {
+    } else if (util.isNumber(condition.eventId)) {
+      conditionDom = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EventCondition, {
         dataId: id,
         onChange: onChangeEvent,
         condition: condition
-      });
+      }));
     }
 
     return /*#__PURE__*/React.createElement(ConditionWrap, {
@@ -183,15 +224,15 @@ var OrConditions = function OrConditions(props) {
   }
 
   return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-or")
+    className: ["".concat(classPrefix, "-or"),, textMode ? 'text-mode' : ''].join(' ')
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-or-content")
+    className: ["".concat(classPrefix, "-or-content")].join(' ')
   }, /*#__PURE__*/React.createElement(RelationLabel, {
     show: showList.length >= 2
   }, "\u6216"), /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-conditions")
-  }, showList.map(function (item) {
-    return renderCondition(item);
+  }, showList.map(function (item, i) {
+    return renderCondition(item, i);
   }))), /*#__PURE__*/React.createElement(ConditionTypeList, {
     label: "\u6216",
     onAdd: onAdd,

package/es/userCondition/relationLabel.js

@@ -1,7 +1,12 @@
-import React from 'react';
+import React, { useContext } from 'react';
+import { BizUserConditionContext } from '.';
 import './styles/relationLabel.less';
 
 var RelationLabel = function RelationLabel(props) {
+  var _useContext = useContext(BizUserConditionContext),
+      textMode = _useContext.textMode;
+
+  if (textMode) return null;
   return /*#__PURE__*/React.createElement("div", {
     className: "biz-user-condition-relation"
   }, props.show ? /*#__PURE__*/React.createElement("div", {

package/es/userCondition/styles/conditionTypeList.less

@@ -13,7 +13,7 @@
     list-style: none;
     .condition-type {
       padding: @padding-xss 12px;
-      border: 1px solid @border-color-base;
+      background-color: @background-color-base;
       border-radius: @border-radius-large;
       cursor: pointer;
       &:nth-child(n + 2) {

package/es/userCondition/styles/conditionWrap.less

@@ -8,6 +8,9 @@
     flex: 1;
   }
   .biz-user-condition-item-delete {
+    display: flex;
+    align-items: center;
+    height: 40px;
     margin-left: @margin-lg;
     cursor: pointer;
   }

package/es/userCondition/styles/index.less

@@ -1,13 +1,33 @@
 @import '../../assets/styles/variable.less';
 .biz-user-condition {
+  width: 100%;
+  min-width: 0;
   &-conditions-content {
     display: flex;
     .biz-user-condition-and-conditions-wrap {
       flex: 1;
-      margin-bottom: @margin-md;
+      margin-bottom: @margin-lg;
+      &.text-mode {
+        display: flex;
+        flex-wrap: wrap;
+        min-width: 0;
+        margin-bottom: 0;
+        line-height: 32px;
+        border: none;
+        .biz-user-condition-and-desc {
+          margin: 0 @margin-xs;
+        }
+      }
     }
     .biz-user-condition-and-conditions-empty {
       margin-bottom: 0;
     }
+    .biz-select-handle-input-multiple {
+      min-height: 40px;
+      padding: calc(@margin-xs - 2px) @margin-xs calc(@margin-xs - 2px) @margin-sm;
+      .biz-select-handle-holder {
+        line-height: 28px;
+      }
+    }
   }
 }