@zgfe/business-lib 1.0.14 → 1.0.15-user.1

package/es/userCondition/conditions/textDesc.js

@@ -0,0 +1,197 @@
+import React, { useContext, useMemo } from 'react';
+import { BizUserConditionContext, classPrefix } from '..';
+import BizGlobalDataContext from '../../context';
+import { findEvent, findPropAndEnv, findTagFactory } from '../util';
+import { operatorMap } from './constants';
+import './styles/textDesc.less';
+
+var Text = function Text(props) {
+  var condition = props.condition,
+      showOrDesc = props.showOrDesc;
+
+  var _useContext = useContext(BizGlobalDataContext),
+      eventGroupList = _useContext.eventGroupList,
+      userPropList = _useContext.userPropList,
+      eventEnvList = _useContext.eventEnvList;
+
+  var _useContext2 = useContext(BizUserConditionContext),
+      userTagsData = _useContext2.userTagsData;
+
+  function render() {
+    if (condition.labels) {
+      return renderTags(condition);
+    }
+
+    if (condition.eventId === '-4') {
+      return renderPeriod({
+        before: '活跃于'
+      }, condition.runPeriod);
+    }
+
+    if (condition.eventId === '-3') {
+      return renderPeriod({
+        before: '新增于'
+      }, condition.runPeriod);
+    }
+
+    if (condition.eventId === undefined) {
+      return renderProps(condition.attrs[0], 'user');
+    }
+
+    if (condition.eventId) {
+      return renderEvent(condition);
+    }
+  }
+
+  function renderPeriod(label, period, isEvent) {
+    var _label$after;
+
+    var valuesDom = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, period.values[0]), /*#__PURE__*/React.createElement("span", null, (_label$after = label.after) !== null && _label$after !== void 0 ? _label$after : '天'));
+
+    if (period.operator === 'unlimited_time') {
+      return /*#__PURE__*/React.createElement("span", null, "\u5728\u4EFB\u610F\u65F6\u95F4\u5185");
+    }
+
+    if (period.operator === 'absolute') {
+      valuesDom = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+        className: "".concat(classPrefix, "-text-desc-value")
+      }, period.values[0]), /*#__PURE__*/React.createElement("span", null, "\u5230"), /*#__PURE__*/React.createElement("span", {
+        className: "".concat(classPrefix, "-text-desc-value")
+      }, period.values[1]));
+    }
+
+    return /*#__PURE__*/React.createElement("span", {
+      style: !isEvent ? {
+        backgroundColor: '#effcff',
+        padding: '6px 7px'
+      } : {}
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "label"
+    }, label.before), /*#__PURE__*/React.createElement("span", null, operatorMap[period.operator]), valuesDom);
+  }
+
+  function renderProps(attr, type) {
+    var data = null;
+
+    if (type === 'user') {
+      var _data;
+
+      data = findPropAndEnv(attr.attrName, userPropList !== null && userPropList !== void 0 ? userPropList : []);
+      return /*#__PURE__*/React.createElement("span", {
+        style: {
+          backgroundColor: '#effcff',
+          padding: '6px 7px'
+        }
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "".concat(classPrefix, "-text-desc-label")
+      }, (_data = data) === null || _data === void 0 ? void 0 : _data.label), /*#__PURE__*/React.createElement("span", {
+        className: "".concat(classPrefix, "-text-desc-operator")
+      }, operatorMap[attr.operator]), /*#__PURE__*/React.createElement("span", {
+        className: "".concat(classPrefix, "-text-desc-value")
+      }, attr.params.map(function (param, i) {
+        return /*#__PURE__*/React.createElement(React.Fragment, null, i > 0 ? /*#__PURE__*/React.createElement("span", null, "\u6216") : null, /*#__PURE__*/React.createElement("span", null, param));
+      })));
+    }
+  }
+
+  function renderEvent(condition) {
+    var event = findEvent(condition.eventId, eventGroupList !== null && eventGroupList !== void 0 ? eventGroupList : []);
+    if (!event) return null;
+    var periodLabel = {};
+
+    if (condition.runPeriod.operator === 'join_time') {
+      periodLabel.before = '在新增后';
+      periodLabel.after = '天内';
+    }
+
+    if (condition.runPeriod.operator === 'relative' || condition.runPeriod.operator === 'absolute') {
+      periodLabel.before = '在';
+    }
+
+    var period = renderPeriod(periodLabel, condition.runPeriod, true);
+    var runtimes = renderRuntimes(condition.runTimes);
+    var attrs = renderAttrs(event, condition.attrs);
+    return /*#__PURE__*/React.createElement("span", {
+      style: {
+        backgroundColor: '#fffeeb',
+        padding: '6px 7px'
+      }
+    }, period, /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-text-desc-value")
+    }, event.name), attrs, runtimes);
+  }
+
+  function renderAttrs(event, attrs) {
+    var attrsDom = [];
+    attrs.forEach(function (attr, i) {
+      var index = event.attrList.findIndex(function (item) {
+        return item.id === attr.attrId;
+      });
+      var label = '';
+
+      if (index >= 0) {
+        label = event === null || event === void 0 ? void 0 : event.attrList[index].label;
+      } else if (eventEnvList) {
+        var env = findPropAndEnv(attr.attrName, eventEnvList);
+        label = env ? env.label : '';
+      }
+
+      if (label) {
+        var dom = /*#__PURE__*/React.createElement("span", {
+          key: i
+        }, /*#__PURE__*/React.createElement("span", null, label), /*#__PURE__*/React.createElement("span", null, operatorMap[attr.operator]), /*#__PURE__*/React.createElement("span", null, attr.params.map(function (param, i) {
+          return /*#__PURE__*/React.createElement("span", {
+            key: i
+          }, i > 0 ? '或' : '', param);
+        })), /*#__PURE__*/React.createElement("span", null, i !== attrs.length - 1 ? '，' : ''));
+        attrsDom.push(dom);
+      }
+    });
+    if (!attrsDom.length) return null;
+    return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, "\uFF08"), attrsDom, /*#__PURE__*/React.createElement("span", null, "\uFF09"));
+  }
+
+  function renderRuntimes(runTimes) {
+    return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-text-desc-value")
+    }, "\u6B21\u6570"), /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-text-desc-value")
+    }, runTimes.operator), /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-text-desc-value")
+    }, runTimes.values[0]));
+  }
+
+  function renderTags(condition) {
+    var labels = condition.labels;
+    return /*#__PURE__*/React.createElement("span", {
+      style: {
+        backgroundColor: '#effcff',
+        padding: '6px 7px'
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "label"
+    }, /*#__PURE__*/React.createElement("b", null, "\u7528\u6237\u6807\u7B7E")), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("b", null, operatorMap[labels.operator])), /*#__PURE__*/React.createElement("span", {
+      className: "".concat(classPrefix, "-text-desc-value")
+    }, /*#__PURE__*/React.createElement("span", null, "("), labels.values.map(function (id, index) {
+      var tag = findTag(id);
+      return /*#__PURE__*/React.createElement("span", {
+        key: id
+      }, index >= 1 ? /*#__PURE__*/React.createElement("span", {
+        style: {
+          margin: '0 4px'
+        }
+      }, "\u6216") : null, /*#__PURE__*/React.createElement("span", null, tag && tag.labelName));
+    }), /*#__PURE__*/React.createElement("span", null, ")")));
+  }
+
+  var findTag = useMemo(function () {
+    return findTagFactory(userTagsData);
+  }, [userTagsData]);
+  return /*#__PURE__*/React.createElement("span", {
+    className: "".concat(classPrefix, "-text-desc")
+  }, showOrDesc ? /*#__PURE__*/React.createElement("span", {
+    className: "".concat(classPrefix, "-text-desc-or")
+  }, "\u6216\u8005") : null, render());
+};
+
+export default Text;

package/es/userCondition/demo/index.js

@@ -10,11 +10,162 @@ 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: [[{
+    attrs: [],
+    labels: {
+      operator: 'equal',
+      values: [77388914425856, 77383474429952, 77384417755136]
+    }
+  }], [{
+    attrs: [{
+      attrId: 114,
+      attrName: 'name',
+      category: 'custom',
+      operator: 'equal',
+      params: ['Safari', 'Microsoft Edge'],
+      attrType: 'cont-string'
+    }]
+  }]]
+};
 export default (function () {
   var _useState = useState({
     eventGroupList: [],
@@ -24,6 +175,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 +188,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<Pick<BizUserConditionT.PropsI, "textMode" | "openTagCondition" | "orConditionNum" | "eventAttrNum" | "userTagsData" | "isRealTime">>;
 export declare const classPrefix = "biz-user-condition";
 declare const BizUserCondition: React.FC<BizUserConditionT.PropsI>;
 export default BizUserCondition;

package/es/userCondition/index.js

@@ -24,15 +24,21 @@ import RelationLabel from './relationLabel';
 import OrConditions from './orConditions';
 import './styles/index.less';
 import { buildCondition } from './util';
+import _ from 'lodash';
 export var BizUserConditionContext = /*#__PURE__*/createContext({
   orConditionNum: 2,
-  eventAttrNum: 1
+  eventAttrNum: 1,
+  textMode: false,
+  openTagCondition: false,
+  userTagsData: []
 });
 export var classPrefix = 'biz-user-condition';
 
 var BizUserCondition = function BizUserCondition(props) {
   var andConditionNum = props.andConditionNum,
-      defaultValue = props.defaultValue;
+      defaultValue = props.defaultValue,
+      openTagCondition = props.openTagCondition,
+      userTagsData = props.userTagsData;
 
   var _useState = useState([]),
       _useState2 = _slicedToArray(_useState, 2),
@@ -44,7 +50,13 @@ 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];
@@ -55,7 +67,7 @@ var BizUserCondition = function BizUserCondition(props) {
 
   function initShowList() {
     var showList = [];
-    defaultValue.forEach(function (item) {
+    value.forEach(function (item) {
       showList.push({
         id: Math.random(),
         orConditions: item
@@ -112,7 +124,11 @@ var BizUserCondition = function BizUserCondition(props) {
   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
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: classPrefix
@@ -121,15 +137,16 @@ 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) {
-    return /*#__PURE__*/React.createElement(OrConditions, {
+    className: ["".concat(classPrefix, "-and-conditions-wrap"), props.textMode ? 'text-mode' : ''].join(' ')
+  }, showList.map(function (item, i) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OrConditions, {
+      showAndDesc: i > 0,
       orConditions: item.orConditions,
       key: item.id,
       onChange: function onChange(data) {
         _onChange(item.id, data);
       }
-    });
+    }));
   })) : null), /*#__PURE__*/React.createElement(ConditionTypeList, {
     show: value.length < andConditionNum,
     label: "\u4E14",
@@ -138,6 +155,10 @@ var BizUserCondition = function BizUserCondition(props) {
 };
 
 BizUserCondition.defaultProps = {
-  andConditionNum: 5
+  andConditionNum: 5,
+  textMode: false,
+  openTagCondition: false,
+  userTagsData: [],
+  isRealTime: false
 };
 export default BizUserCondition;