@zgfe/business-lib 1.0.24-alpha.6 → 1.0.24-tags4.0

package/es/userCondition/conditions/tagsCondition.js

@@ -16,13 +16,13 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useContext, useState } from 'react';
+import React, { useContext, useMemo, useState } from 'react';
 import { BizUserConditionContext, classPrefix } from '..';
 import BizSelect from '../../select';
 import { operatorMap } from './constants';
 import BizUserTagsSelect from '../../userTagsSelector';
 import './styles/tagsCondition.less';
-import { findTagFactory } from '../util';
+import { buildSelectLayer, buildTagsGroup } from '../util';
 var options = [{
   value: 'equal',
   text: '是'
@@ -45,6 +45,10 @@ var TagsCondition = function TagsCondition(props) {
       _useState2 = _slicedToArray(_useState, 1),
       defaultValues = _useState2[0];
 
+  var tagGroupList = useMemo(function () {
+    return buildTagsGroup(userTagsData || []);
+  }, [userTagsData]);
+
   function onOperatorChange(operator) {
     onChange(dataId, _objectSpread(_objectSpread({}, labels), {}, {
       operator: operator.value
@@ -52,8 +56,9 @@ var TagsCondition = function TagsCondition(props) {
   }
 
   function onTagsChange(data) {
+    console.log(data);
     var values = data.map(function (item) {
-      return item[1].labelId;
+      return item[2].layerLabelId;
     });
     onChange(dataId, _objectSpread(_objectSpread({}, labels), {}, {
       values: values
@@ -62,12 +67,12 @@ var TagsCondition = function TagsCondition(props) {
 
   function buildDefaultValues() {
     var values = [];
-    var findTag = findTagFactory(userTagsData);
+    var findTag = buildSelectLayer(userTagsData);
     labels.values.forEach(function (id) {
-      var tag = findTag(id);
+      var selectValue = findTag(id);
 
-      if (tag) {
-        values.push([tag.labelGroup, tag]);
+      if (selectValue) {
+        values.push(selectValue);
       }
     });
     return values;
@@ -92,11 +97,11 @@ var TagsCondition = function TagsCondition(props) {
     className: "".concat(classPrefix, "-tags-condition-value")
   }, /*#__PURE__*/React.createElement(BizUserTagsSelect, {
     defaultValue: defaultValues,
-    data: userTagsData,
-    childFields: ['children'],
-    keyFields: ['labelGroup', 'labelId'],
-    labelFields: ['labelGroup', 'labelName'],
-    valueFields: ['labelGroup', 'labelId'],
+    data: tagGroupList,
+    childFields: ['children', 'layers'],
+    keyFields: ['labelGroup', 'id', 'layerLabelId'],
+    labelFields: ['labelGroup', 'labelName', 'layerLabelName'],
+    valueFields: ['labelGroup', 'labelName', 'layerLabelId'],
     onChange: onTagsChange,
     destroyPopupOnHide: true
   })), /*#__PURE__*/React.createElement("div", {

package/es/userCondition/conditions/textDesc.js

@@ -7,7 +7,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import React, { useContext, useMemo } from 'react';
 import { BizUserConditionContext, classPrefix } from '..';
 import BizGlobalDataContext from '../../context';
-import { findEvent, findPropAndEnv, findTagFactory } from '../util';
+import { findEvent, findPropAndEnv, buildSelectLayer } from '../util';
 import { durationHandler, operatorMap } from './constants';
 import './styles/textDesc.less';
 
@@ -181,7 +181,7 @@ var Text = function Text(props) {
         style: {
           margin: '0 4px'
         }
-      }, "\u6216") : null, /*#__PURE__*/React.createElement("span", null, tag && tag.labelName));
+      }, "\u6216") : null, /*#__PURE__*/React.createElement("span", null, tag && tag[1].labelName + '：' + tag[2].layerLabelName));
     }), /*#__PURE__*/React.createElement("span", null, ")")));
   }
 
@@ -231,7 +231,7 @@ var Text = function Text(props) {
   }
 
   var findTag = useMemo(function () {
-    return findTagFactory(userTagsData);
+    return buildSelectLayer(userTagsData);
   }, [userTagsData]);
   return /*#__PURE__*/React.createElement("span", {
     className: "".concat(classPrefix, "-text-desc")

package/es/userCondition/demo/index.js

@@ -15,216 +15,8 @@ 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']
-    }
-  }]]
-};
+import { conditions, tagList } from './mockData';
+var getTagList = Promise.resolve(tagList);
 export default (function () {
   var _useState = useState({
     eventGroupList: [],
@@ -248,34 +40,20 @@ export default (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);
+      setUserTagsData(list);
     });
   }, []);
   var defaultValue = useMemo(function () {
-    return data.json;
-  }, [data]);
+    return conditions;
+  }, [conditions]);
 
   function onChange(value) {
     console.log(JSON.stringify(value));
   }
 
   var descDom = /*#__PURE__*/React.createElement(BizUserCondition, {
+    textMode: true,
     defaultValue: defaultValue,
     onChange: onChange,
     eventAttrNum: 3,

package/es/userCondition/demo/mockData.d.ts

@@ -0,0 +1,33 @@
+export declare const tagList: {
+    dataStatus: number;
+    id: number;
+    labelGroup: string;
+    labelName: string;
+    labelRemark: string;
+    labelType: number;
+    layers: {
+        layerCondition: {
+            eventId: string;
+            runPeriod: {
+                values: string[];
+                operator: string;
+            };
+            runTimes: {
+                values: string[];
+                operator: string;
+            };
+            attrs: never[];
+        }[][];
+        layerLabelId: number;
+        layerLabelName: string;
+        layerRemark: string;
+        sequence: number;
+    }[];
+}[];
+export declare const conditions: {
+    attrs: never[];
+    labels: {
+        operator: string;
+        values: number[];
+    };
+}[][];

package/es/userCondition/demo/mockData.js

@@ -0,0 +1,208 @@
+export var tagList = [{
+  dataStatus: 1,
+  id: 30,
+  labelGroup: '预测标签',
+  labelName: 'test3',
+  labelRemark: '',
+  labelType: 0,
+  layers: [{
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498373,
+    layerLabelName: '分层6',
+    layerRemark: '',
+    sequence: 6
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498372,
+    layerLabelName: '分层5',
+    layerRemark: '',
+    sequence: 5
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498371,
+    layerLabelName: '分层4',
+    layerRemark: '',
+    sequence: 4
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498370,
+    layerLabelName: '分层3',
+    layerRemark: '',
+    sequence: 3
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498369,
+    layerLabelName: '分层2',
+    layerRemark: '',
+    sequence: 2
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130079277498368,
+    layerLabelName: '分层1',
+    layerRemark: '',
+    sequence: 1
+  }]
+}, {
+  dataStatus: 1,
+  id: 29,
+  labelGroup: '活跃标签',
+  labelName: 'test2',
+  labelRemark: '',
+  labelType: 0,
+  layers: [{
+    layerCondition: [[{
+      eventId: '-4',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130078364041218,
+    layerLabelName: '分层3',
+    layerRemark: '',
+    sequence: 3
+  }, {
+    layerCondition: [[{
+      eventId: '-4',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130078364041217,
+    layerLabelName: '分层2',
+    layerRemark: '',
+    sequence: 2
+  }, {
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130078364041216,
+    layerLabelName: '分层1',
+    layerRemark: '',
+    sequence: 1
+  }]
+}, {
+  dataStatus: 1,
+  id: 28,
+  labelGroup: '基本标签',
+  labelName: 'test1',
+  labelRemark: '',
+  labelType: 0,
+  layers: [{
+    layerCondition: [[{
+      eventId: '-3',
+      runPeriod: {
+        values: ['30', '0'],
+        operator: 'relative'
+      },
+      runTimes: {
+        values: ['1'],
+        operator: '>='
+      },
+      attrs: []
+    }]],
+    layerLabelId: 130003289636864,
+    layerLabelName: '分层1',
+    layerRemark: '',
+    sequence: 1
+  }]
+}];
+export var conditions = [[{
+  attrs: [],
+  labels: {
+    operator: 'equal',
+    values: [130003289636864, 130078364041218, 130078364041217, 130078364041216]
+  }
+}, {
+  attrs: [],
+  labels: {
+    operator: 'not equal',
+    values: [130078364041218, 130078364041217]
+  }
+}]];

package/es/userCondition/types.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
 import { UserProp } from '../attributeSelector/types';
-import { TagI } from './../userTagsSelector/types';
 export declare type Unpacked<T, U extends keyof T> = Required<T> extends {
     [key in U]: infer R;
 } ? R : never;
@@ -30,8 +29,27 @@ export declare namespace BizUserConditionT {
         isRealTime?: boolean;
     }
     interface UserTagsDataI {
+        appId: number;
+        createTime: string;
+        updateTime: string;
+        del: number;
         labelGroup: string;
-        children: TagI[];
+        id: number;
+        labelName: string;
+        labelStatus: number;
+        labelType: number;
+        remark: string;
+        creator: string;
+        userAmount: number;
+        layerNum: number;
+        endProcessTime: string;
+        layers: {
+            layerLabelId: number;
+            layerLabelName: string;
+            layerRemark: string;
+            layerCondition: any[][];
+            sequence: number;
+        }[];
     }
     interface AttrCondition {
         attrId: number;

package/es/userCondition/util.d.ts

@@ -4,4 +4,23 @@ export declare function buildCondition(type: BizUserConditionT.ConditionType): B
 export declare function transformNumberOperate(key: string, output?: boolean): string;
 export declare function findEvent(eventId: number, eventGroupList: Unpacked<GlobalContextProps, 'eventGroupList'>): import("../attributeSelector/types").AnalysisEvent | null;
 export declare function findPropAndEnv(name: string, list: Unpacked<GlobalContextProps, 'userPropList' | 'eventEnvList'>): import("../attributeSelector/types").UserProp | import("../attributeSelector/types").EnvProp | null;
-export declare function findTagFactory(data: BizUserConditionT.UserTagsDataI[]): (id: number) => import("../userTagsSelector/types").TagI | null;
+export declare function buildSelectLayer(data: BizUserConditionT.UserTagsDataI[]): (layerLabelId: number) => ({
+    labelGroup: string;
+    labelName?: undefined;
+    layerLabelId?: undefined;
+    layerLabelName?: undefined;
+} | {
+    labelName: string;
+    labelGroup?: undefined;
+    layerLabelId?: undefined;
+    layerLabelName?: undefined;
+} | {
+    layerLabelId: number;
+    layerLabelName: string;
+    labelGroup?: undefined;
+    labelName?: undefined;
+})[] | null;
+export declare function buildTagsGroup(list: BizUserConditionT.UserTagsDataI[]): {
+    labelGroup: string;
+    children: BizUserConditionT.UserTagsDataI[];
+}[];

package/es/userCondition/util.js

@@ -1,3 +1,9 @@
+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; }
+
 export function buildCondition(type) {
   switch (type) {
     case 'add':
@@ -99,17 +105,44 @@ export function findPropAndEnv(name, list) {
 
   return null;
 }
-export function findTagFactory(data) {
-  return function (id) {
+export function buildSelectLayer(data) {
+  return function (layerLabelId) {
     var i = -1;
     var j = data.findIndex(function (item) {
-      i = item.children.findIndex(function (tag) {
-        return tag.labelId === id;
+      i = item.layers.findIndex(function (layer) {
+        return layer.layerLabelId === layerLabelId;
       });
       if (i < 0) return false;
       return true;
     });
     if (j < 0) return null;
-    return data[j].children[i];
+    return [{
+      labelGroup: data[j].labelGroup
+    }, {
+      labelName: data[j].labelName
+    }, {
+      layerLabelId: data[j].layers[i].layerLabelId,
+      layerLabelName: data[j].layers[i].layerLabelName
+    }];
   };
+}
+export function buildTagsGroup(list) {
+  var groupOrder = ['基本标签', '活跃标签', '行为标签', '预测标签', '其他标签'];
+  var groupsMap = {};
+  var options = [];
+  list.forEach(function (label) {
+    if (Object.hasOwn(groupsMap, label.labelGroup)) {
+      groupsMap[label.labelGroup].children.push(_objectSpread({}, label));
+    } else {
+      var group = {
+        labelGroup: label.labelGroup,
+        children: [_objectSpread({}, label)]
+      };
+      groupsMap[label.labelGroup] = group;
+    }
+  });
+  groupOrder.map(function (group) {
+    groupsMap[group] && options.push(groupsMap[group]);
+  });
+  return options;
 }

package/es/userTagsSelector/cascaderOverlay.js

@@ -1,3 +1,7 @@
+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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -6,6 +10,8 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
+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."); }
@@ -18,49 +24,77 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React from 'react';
+import React, { useRef } from 'react';
 import { useState } from 'react';
 import { classPrefix } from '.';
 import './styles/cascaderOverlay.less';
 import Groups from './groups/index';
 import MultipleCheckPanel from './multipleCheckPanel';
-import { getFieldFactory } from './util';
+import { filterFactory, getFieldFactory } from './util';
 import _ from 'lodash';
+import Search from './components/search';
 
 var CascaderOverlay = function CascaderOverlay(props) {
-  var data = props.data,
-      currentValue = props.currentValue,
+  var currentValue = props.currentValue,
       labelFields = props.labelFields,
       keyFields = props.keyFields,
       valueFields = props.valueFields,
       childFields = props.childFields;
+  var timer = useRef(null);
 
-  var _useState = useState(function () {
-    var initPath = [];
-    var curr = data[0];
-    var getChildField = getFieldFactory(childFields);
-
-    while (curr) {
-      initPath.push(curr);
-      curr = curr[getChildField()];
-    }
-
-    initPath.pop();
-    return initPath;
-  }),
+  var _useState = useState(props.data || []),
       _useState2 = _slicedToArray(_useState, 2),
-      currentPath = _useState2[0],
-      setCurrentPath = _useState2[1];
+      data = _useState2[0],
+      setData = _useState2[1];
+
+  var _useState3 = useState(initPath(data)),
+      _useState4 = _slicedToArray(_useState3, 2),
+      currentPath = _useState4[0],
+      setCurrentPath = _useState4[1];
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      highlightText = _useState6[0],
+      setHighlightText = _useState6[1];
+
+  function initPath(data) {
+    return function () {
+      var path = [];
+      var curr = data[0];
+      var getChildField = getFieldFactory(childFields);
+
+      while (curr) {
+        path.push(curr);
+        var childField = getChildField();
+
+        if (_.isArray(curr[childField])) {
+          curr = curr[childField].length ? curr[childField][0] : null;
+        } else {
+          curr = curr[childField];
+        }
+      }
+
+      path.pop();
+      return path;
+    };
+  }
 
   function onActive(data, level) {
     var currIndex = level;
     var getChildField = getFieldFactory(childFields.slice(currIndex).length ? childFields.slice(currIndex) : childFields.slice(-1));
     var curr = data;
-    var newPath = currentPath.slice();
+    var newPath = currentPath.slice(0, level + 1);
 
     while (curr) {
       newPath[currIndex] = curr;
-      curr = curr[getChildField()];
+      var childField = getChildField();
+
+      if (_.isArray(curr[childField])) {
+        curr = curr[childField].length ? curr[childField][0] : null;
+      } else {
+        curr = curr[childField];
+      }
+
       currIndex++;
     }
 
@@ -70,8 +104,13 @@ var CascaderOverlay = function CascaderOverlay(props) {
 
   function onCheck(data) {
     var getVabelField = getFieldFactory(valueFields);
+    var getLabelField = getFieldFactory(labelFields);
     var newValue = currentPath.map(function (item) {
-      return item[getVabelField()];
+      var _ref;
+
+      var labelField = getLabelField();
+      var valueField = getVabelField();
+      return _ref = {}, _defineProperty(_ref, labelField, item[labelField]), _defineProperty(_ref, valueField, item[valueField]), _ref;
     }).concat(data);
     props.onChange([].concat(_toConsumableArray(currentValue), [newValue]));
   }
@@ -85,30 +124,81 @@ var CascaderOverlay = function CascaderOverlay(props) {
     props.onChange(newValues);
   }
 
+  function onSearch(val) {
+    timer.current && clearTimeout(timer.current);
+    timer.current = setTimeout(function () {
+      var _labelFields$, _props$data;
+
+      var res = [];
+      var filter = filterFactory((_labelFields$ = labelFields[1]) !== null && _labelFields$ !== void 0 ? _labelFields$ : labelFields[0], val);
+      (_props$data = props.data) === null || _props$data === void 0 ? void 0 : _props$data.forEach(function (item) {
+        var searchList = item[childFields[0]].filter(filter);
+
+        if (searchList.length) {
+          res.push(_objectSpread(_objectSpread({}, item), {}, _defineProperty({}, childFields[0], item[childFields[0]].filter(filter))));
+        }
+      });
+      setData(res);
+      setCurrentPath(initPath(res));
+      setHighlightText(val);
+    }, 300);
+  }
+
+  function render() {
+    if (!data.length) return /*#__PURE__*/React.createElement("div", {
+      style: {
+        padding: 8,
+        width: 596
+      }
+    }, "\u6682\u65E0\u6570\u636E");
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-overlay-groups")
+    }, /*#__PURE__*/React.createElement(Groups, {
+      key: 0,
+      currentValue: currentValue,
+      valueField: valueFields[0],
+      keyField: keyFields[0],
+      childField: childFields[0],
+      labelField: labelFields[0],
+      data: data,
+      onActive: onActive,
+      level: 0
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-overlay-groups")
+    }, /*#__PURE__*/React.createElement(Groups, {
+      currentValue: currentValue,
+      valueField: valueFields[1],
+      keyField: keyFields[1],
+      childField: childFields[1],
+      labelField: labelFields[1],
+      data: currentPath[0] ? currentPath[0][childFields[0]] : [],
+      onActive: onActive,
+      highlightText: highlightText,
+      level: 1
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-overlay-selections")
+    }, /*#__PURE__*/React.createElement(MultipleCheckPanel, {
+      valueField: valueFields[2],
+      onCheck: onCheck,
+      onUncheck: onUncheck,
+      currentValue: currentValue,
+      level: 2,
+      labelField: labelFields[2],
+      data: currentPath[1] ? currentPath[1][childFields[1]] : []
+    })));
+  }
+
   return /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-overlay")
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-overlay-groups")
-  }, /*#__PURE__*/React.createElement(Groups, {
-    currentValue: currentValue,
-    valueField: valueFields[0],
-    keyField: keyFields[0],
-    childField: childFields[0],
-    labelField: labelFields[0],
-    data: data,
-    onActive: onActive,
-    level: 0
+    className: "".concat(classPrefix, "-overlay-search")
+  }, /*#__PURE__*/React.createElement(Search, {
+    show: true,
+    onChange: onSearch,
+    placeholder: "\u641C\u7D22\u6807\u7B7E\u540D\u79F0"
   })), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-overlay-selections")
-  }, /*#__PURE__*/React.createElement(MultipleCheckPanel, {
-    valueField: valueFields[1],
-    onCheck: onCheck,
-    onUncheck: onUncheck,
-    currentValue: currentValue,
-    level: 1,
-    labelField: labelFields[1],
-    data: currentPath[0][childFields[0]]
-  })));
+    className: "".concat(classPrefix, "-overlay-panel")
+  }, render()));
 };
 
 export default CascaderOverlay;

package/es/userTagsSelector/demo/index.js

@@ -18,11 +18,18 @@ var data = [{
 }];
 var defaultValue = [];
 data.forEach(function (item) {
-  item.children = Array(100 * Math.random() >> 0).fill(1).map(function (_child, _index) {
+  item.children = Array(10 * Math.random() >> 0).fill(1).map(function (_child, _index) {
     var id = Math.random();
     var tag = {
       id: id,
-      labelName: '标签' + id + id + id + id
+      labelName: '标签' + id + id + id + id,
+      layers: Array(5 * Math.random() >> 0).fill(1).map(function (_item, i) {
+        var layer = {
+          layerLabelId: Math.random(),
+          layerLabelName: '分层' + i
+        };
+        return layer;
+      })
     };
 
     if (id < 0.6 && defaultValue.length < 20) {
@@ -38,11 +45,11 @@ export default (function () {
   }
 
   return /*#__PURE__*/React.createElement(BizUserTagsSelect, {
-    childFields: ['children'],
+    childFields: ['children', 'layers'],
     data: data,
-    keyFields: ['labelGroup', 'id'],
-    labelFields: ['labelGroup', 'labelName'],
-    valueFields: ['labelGroup', 'labelId'],
+    keyFields: ['labelGroup', 'id', 'id'],
+    labelFields: ['labelGroup', 'labelName', 'layerLabelName'],
+    valueFields: ['labelGroup', 'labelName', 'id'],
     onChange: onChange
   });
 });

package/es/userTagsSelector/groups/groupOption.js

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react';
 import { Badge } from 'antd';
 import { classPrefix } from '..';
-import theme from '../../assets/theme.js';
+import { theme } from '../../assets/theme.js';
 import './styles/option.less';
 import { util } from '../../utils';
 var GroupOption = /*#__PURE__*/forwardRef(function (props, ref) {

package/es/userTagsSelector/groups/index.js

@@ -1,3 +1,5 @@
+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."); }
@@ -10,7 +12,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import VirtualList from 'rc-virtual-list';
 import { classPrefix } from '../';
 import GroupOption from './groupOption';
@@ -33,11 +35,21 @@ var Groups = function Groups(props) {
       searchValue = _useState2[0],
       setSearchValue = _useState2[1];
 
-  var _useState3 = useState(data[0][valueField]),
+  var _useState3 = useState(data.length ? data[0][valueField] : null),
       _useState4 = _slicedToArray(_useState3, 2),
       active = _useState4[0],
       setActive = _useState4[1];
 
+  var searchFilter = useMemo(function () {
+    return filterFactory(labelField, searchValue);
+  }, [labelField, searchValue]);
+  var isChecked = useMemo(function () {
+    return isCheckedFactory(currentValue, level);
+  }, [currentValue, level]);
+  useEffect(function () {
+    if (data.length) setActive(data[0][valueField]);
+  }, [data]);
+
   function _onClick(i) {
     setActive(data[i][valueField]);
     props.onActive(data[i], level);
@@ -47,12 +59,6 @@ var Groups = function Groups(props) {
     setSearchValue(val);
   }
 
-  var searchFilter = useMemo(function () {
-    return filterFactory(labelField, searchValue);
-  }, [labelField, searchValue]);
-  var isChecked = useMemo(function () {
-    return isCheckedFactory(currentValue, level);
-  }, [currentValue, level]);
   if (!data.length) return /*#__PURE__*/React.createElement("span", null, "\u6682\u65E0\u6570\u636E");
   return /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-groups-panel")
@@ -61,19 +67,21 @@ var Groups = function Groups(props) {
     onChange: onSearch
   }), /*#__PURE__*/React.createElement(VirtualList, {
     data: searchable ? data.filter(searchFilter) : data,
-    height: 408,
+    height: 360,
     itemKey: keyField
   }, function (item, index) {
+    var _isChecked, _props$highlightText;
+
     return /*#__PURE__*/React.createElement(GroupOption, {
       onClick: function onClick() {
         return _onClick(index);
       },
       actived: item[valueField] === active,
-      checked: isChecked(item[valueField]),
+      checked: isChecked((_isChecked = {}, _defineProperty(_isChecked, valueField, item[valueField]), _defineProperty(_isChecked, labelField, item[labelField]), _isChecked)),
       count: item[childField].length,
       label: item[labelField],
       value: item[valueField],
-      highlightText: searchValue
+      highlightText: (_props$highlightText = props.highlightText) !== null && _props$highlightText !== void 0 ? _props$highlightText : searchValue
     });
   }));
 };

package/es/userTagsSelector/groups/styles/option.less

@@ -37,7 +37,7 @@
       }
     }
     &.active {
-      color: #fff;
+      color: #fff !important;
       background: @primary-color;
       .biz-user-tags-selector-group-option-count {
         .ant-badge-count {
@@ -45,6 +45,11 @@
           background: @primary-color;
         }
       }
+      .biz-user-tags-selector-group-option-label {
+        * {
+          color: #fff !important;
+        }
+      }
     }
   }
 }

package/es/userTagsSelector/index.js

@@ -1,3 +1,9 @@
+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."); }
@@ -40,7 +46,14 @@ var UserTagsSelect = function UserTagsSelect(props) {
 
   var handleValue = useMemo(function () {
     return currentValue.map(function (item) {
-      return item.slice().pop();
+      var last = item[item.length - 1];
+      var pre = item[item.length - 2];
+
+      var res = _objectSpread(_objectSpread({}, last), {}, {
+        handleText: "".concat(pre[labelFields[labelFields.length - 2]], "\uFF1A").concat(last[labelFields[labelFields.length - 1]])
+      });
+
+      return res;
     });
   }, [currentValue]);
 
@@ -51,7 +64,8 @@ var UserTagsSelect = function UserTagsSelect(props) {
   function onDelete(data) {
     var current = currentValue.slice();
     var index = current.findIndex(function (item) {
-      return _.isEqual(item.slice().pop(), data);
+      var keyField = keyFields[keyFields.length - 1];
+      return _.isEqual(item.slice().pop()[keyField], data[keyField]);
     });
     current.splice(index, 1);
     props.onChange && props.onChange(current);
@@ -97,7 +111,7 @@ var UserTagsSelect = function UserTagsSelect(props) {
   }, /*#__PURE__*/React.createElement(SelectHandle, {
     border: false,
     value: handleValue,
-    labelField: labelFields[labelFields.length - 1],
+    labelField: "handleText",
     multiple: true,
     size: "middle",
     placeholder: "\u9009\u62E9\u6807\u7B7E",

package/es/userTagsSelector/multipleCheckPanel/index.js

@@ -13,7 +13,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useMemo, useState } from 'react';
 import { classPrefix } from '..';
 import VirtualList from 'rc-virtual-list';
-import Search from '../components/search';
 import CheckOption from './checkOption';
 import { filterFactory, isCheckedFactory } from '../util';
 
@@ -24,13 +23,8 @@ var MultipleCheckPanel = function MultipleCheckPanel(props) {
       currentValue = props.currentValue;
 
   var _useState = useState(''),
-      _useState2 = _slicedToArray(_useState, 2),
-      searchValue = _useState2[0],
-      setSearchValue = _useState2[1];
-
-  function onSearch(val) {
-    setSearchValue(val);
-  }
+      _useState2 = _slicedToArray(_useState, 1),
+      searchValue = _useState2[0];
 
   var searchFilter = useMemo(function () {
     return filterFactory(labelField, searchValue);
@@ -50,15 +44,11 @@ var MultipleCheckPanel = function MultipleCheckPanel(props) {
   if (!data.length) return /*#__PURE__*/React.createElement("span", null, "\u6682\u65E0\u6570\u636E");
   return /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-check-panel")
-  }, /*#__PURE__*/React.createElement(Search, {
-    show: true,
-    onChange: onSearch,
-    placeholder: "\u641C\u7D22\u6807\u7B7E\u540D\u79F0"
-  }), /*#__PURE__*/React.createElement(VirtualList, {
+  }, /*#__PURE__*/React.createElement(VirtualList, {
     data: data.filter(searchFilter),
     itemHeight: 48,
     itemKey: labelField,
-    height: 361
+    height: 360
   }, function (item, index) {
     var checked = isChecked(item);
     return /*#__PURE__*/React.createElement(CheckOption, {

package/es/userTagsSelector/styles/cascaderOverlay.less

@@ -1,19 +1,24 @@
 @import '../../assets/styles/inner.less';
 .biz-user-tags-selector {
   &-overlay {
-    display: flex;
-    width: 651px;
     max-height: 425px;
     background-color: #fff;
     border-radius: @border-radius-normal;
     box-shadow: @box-shadow-base;
+    &-search {
+      height: 48px;
+      padding: @margin-xs @margin-xs 0;
+    }
+    &-panel {
+      display: flex;
+    }
     &-groups {
-      width: 192px;
+      width: 204px;
       padding: @margin-xs;
       border-right: 1px solid @border-color-base;
     }
     &-selections {
-      flex: 1;
+      width: 204px;
       min-width: 0;
       padding: @padding-xs;
     }

package/es/userTagsSelector/types.d.ts

@@ -29,6 +29,7 @@ export declare namespace UserTagsSelectorTypes {
         searchable?: boolean;
         level: number;
         currentValue: any[];
+        highlightText?: string;
     }
     interface GroupOption {
         actived: boolean;
@@ -55,13 +56,3 @@ export declare namespace UserTagsSelectorTypes {
         disabled: boolean;
     }
 }
-export interface TagI {
-    appId: number;
-    createTime: string;
-    updateTime: string;
-    del: number;
-    labelGroup: string;
-    labelId: number;
-    labelName: string;
-    labelStatus: number;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zgfe/business-lib",
-  "version": "1.0.24-alpha.6",
+  "version": "1.0.24-tags4.0",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -58,5 +58,5 @@
     "react": "^16.12.0 || ^17.0.0",
     "yorkie": "^2.0.0"
   },
-  "gitHead": "d99caf4139172b185ba551415e7226615c8215d2"
+  "gitHead": "20ecccabf92786b84ed14a56dd75d8ac2fdea6b2"
 }