@zgfe/business-lib 1.1.66 → 1.1.67-beta.3

package/es/select/handle.js

@@ -66,6 +66,12 @@ var SelectHandle = /*#__PURE__*/React.forwardRef(function (props, ref) {
       props.onVisible && props.onVisible();
     }
   }, [focus]);
+  var onClick = function onClick(e) {
+    e.stopPropagation();
+    if (props.disable) return;
+    setFocus(true);
+    inputRef.current.focus();
+  };
   var searchInputWidth = useMemo(function () {
     if (textRef.current && searchValue) {
       textRef.current.innerText = searchValue;
@@ -111,7 +117,8 @@ var SelectHandle = /*#__PURE__*/React.forwardRef(function (props, ref) {
         className: "".concat(classPrefix, "-tag-label")
       }, item[labelField])));
     }) : !focus ? /*#__PURE__*/React.createElement("span", {
-      className: "".concat(classPrefix, "-holder")
+      className: "".concat(classPrefix, "-holder"),
+      onClick: onClick
     }, placeholder || '请选择') : '', /*#__PURE__*/React.createElement(Input, {
       ref: inputRef,
       autoFocus: focus,
@@ -136,7 +143,7 @@ var SelectHandle = /*#__PURE__*/React.forwardRef(function (props, ref) {
     className: "".concat(classPrefix, "-content")
   }, showSelectIcon && ((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.icon) && /*#__PURE__*/React.createElement("span", {
     className: "".concat(classPrefix, "-icon")
-  }, props.value.icon), props.label || props.value && props.value[labelField] || /*#__PURE__*/React.createElement("span", {
+  }, props.value.icon), props.children || props.label || props.value && props.value[labelField] || /*#__PURE__*/React.createElement("span", {
     className: "".concat(classPrefix, "-holder")
   }, placeholder || '请选择')), /*#__PURE__*/React.createElement(IconFont, {
     className: "".concat(classPrefix, "-expand-icon"),

package/es/select/styles/handle.less

@@ -125,6 +125,7 @@
   &-expand-icon {
     width: 14px;
     margin-left: 5px;
+    color: @text-color-secondary;
   }
 
   &-tooltip {

package/es/select/types.d.ts

@@ -71,6 +71,7 @@ export declare namespace BizSelectTypes {
 }
 export interface HandlerTypes {
     label?: string;
+    children?: ReactNode;
     placeholder?: string;
     value?: BizSelectTypes.Option | BizSelectTypes.Option[];
     multiple?: boolean;

package/es/targetConditionGroup/components/targetDimension.js

@@ -129,8 +129,6 @@ var BizTargetDimension = function BizTargetDimension(props) {
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-dimension")
   }, /*#__PURE__*/React.createElement(SelectHandle, {
-    theme: "secondary",
-    border: false,
     label: "".concat(dimensionParent ? dimensionParent.label : '').concat(dimension === null || dimension === void 0 ? void 0 : dimension.label)
   })));
 };

package/es/targetConditionGroup/demo/group.js

@@ -41,6 +41,10 @@ export default (function () {
     _useState6 = _slicedToArray(_useState5, 2),
     enableAdd = _useState6[0],
     setEnableAdd = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    enableDelete = _useState8[0],
+    setEnableDelete = _useState8[1];
   var _Form$useForm = Form.useForm(),
     _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
     form = _Form$useForm2[0];
@@ -55,6 +59,7 @@ export default (function () {
   useEffect(function () {
     var flag = true,
       show = true;
+    console.log(target.targets, target.targets.length > 1);
     if ((target === null || target === void 0 ? void 0 : target.targets) && target.targets.length > 0) {
       if (target.targets[0] && target.targets[0].eventId === -100) {
         flag = false;
@@ -63,6 +68,7 @@ export default (function () {
         show = false;
       }
     }
+    setEnableDelete(target.targets.length > 1);
     setShowOverview(show);
     setEnableAdd(flag);
   }, [target === null || target === void 0 ? void 0 : target.targets]);
@@ -87,14 +93,9 @@ export default (function () {
       return /*#__PURE__*/React.createElement(Form.Item, _objectSpread(_objectSpread({}, field), {}, {
         key: field.key
       }), /*#__PURE__*/React.createElement(BizTargetCondition, {
+        enableDelete: enableDelete,
         onDelete: function onDelete() {
-          if (fields.length > 1) {
-            remove(field.name);
-          } else {
-            form.setFieldsValue({
-              targets: [initValue]
-            });
-          }
+          remove(field.name);
         }
       }, /*#__PURE__*/React.createElement(BizEventSelector, {
         showAllEvent: showOverview,

package/es/targetConditionGroup/demo/index.js

@@ -47,6 +47,7 @@ export default (function () {
     }
   }, /*#__PURE__*/React.createElement(BizTargetCondition, {
     defaultValue: target,
+    onlyAnd: true,
     onChange: onChange,
     max: 3
   }, /*#__PURE__*/React.createElement(BizEventSelector, {

package/es/targetConditionGroup/index.js

@@ -14,11 +14,11 @@ import React, { useContext, useEffect, useRef, useState } from 'react';
 import BizTargetSelector from '../targetSelector';
 import BizTargetDimension from './components/targetDimension';
 import './styles/index.less';
-import BizConditionGroup from '../attrConditions/group';
-import { Skeleton } from 'antd';
+import { Skeleton, Tooltip } from 'antd';
 import _ from 'lodash';
 import BizGlobalDataContext from '../context';
 import { BuiltinIndicators } from '../constants/common';
+import { BizAttrConditionGroup, IconFont } from '..';
 export var classPrefix = 'biz-target';
 var BizTargetCondition = function BizTargetCondition(props) {
   var _targetData$value2, _targetData$value2$gr, _targetData$value3, _targetData$value3$ev, _targetData$value4, _targetData$value4$ev, _targetData$value5, _targetData$value5$ev, _targetData$value6, _targetData$value6$ev, _targetData$value7, _targetData$value7$ev;
@@ -44,7 +44,7 @@ var BizTargetCondition = function BizTargetCondition(props) {
     _useState8 = _slicedToArray(_useState7, 2),
     enableAdd = _useState8[0],
     setEnableAdd = _useState8[1];
-  var _useState9 = useState(true),
+  var _useState9 = useState(props.enableDelete),
     _useState10 = _slicedToArray(_useState9, 2),
     enableDelete = _useState10[0],
     setEnableDelete = _useState10[1];
@@ -90,7 +90,9 @@ var BizTargetCondition = function BizTargetCondition(props) {
         canAdd = count < max;
       }
       setEnableAdd(canAdd);
-      setEnableDelete(canDelete);
+      if (props.enableDelete !== undefined) {
+        setEnableDelete(canDelete);
+      }
     } else {
       setEnableAdd(false);
     }
@@ -212,12 +214,14 @@ var BizTargetCondition = function BizTargetCondition(props) {
     }
   };
   var onAdd = function onAdd() {
+    if (!enableAdd) return;
     setIsAdd(true);
     setTimeout(function () {
       conditionRef.current.add();
     }, 0);
   };
   var onDelete = function onDelete() {
+    if (!(props.enableDelete !== undefined ? props.enableDelete : enableDelete)) return;
     if (props.onDelete) props.onDelete();
   };
   return /*#__PURE__*/React.createElement("div", {
@@ -232,16 +236,22 @@ var BizTargetCondition = function BizTargetCondition(props) {
     className: "".concat(classPrefix, "-content")
   }, /*#__PURE__*/React.createElement(BizTargetSelector, {
     value: targetData,
-    enableAdd: enableAdd,
-    enableDelete: enableDelete,
-    onAdd: onAdd,
-    onDelete: onDelete,
     onChange: onChangeTarget
   }, props.children), (targetData === null || targetData === void 0 ? void 0 : (_targetData$value2 = targetData.value) === null || _targetData$value2 === void 0 ? void 0 : (_targetData$value2$gr = _targetData$value2.group) === null || _targetData$value2$gr === void 0 ? void 0 : _targetData$value2$gr.id) === -2 || (targetData === null || targetData === void 0 ? void 0 : (_targetData$value3 = targetData.value) === null || _targetData$value3 === void 0 ? void 0 : (_targetData$value3$ev = _targetData$value3.event) === null || _targetData$value3$ev === void 0 ? void 0 : _targetData$value3$ev.isBuiltIn) ? null : /*#__PURE__*/React.createElement(BizTargetDimension, {
     eventId: (targetData === null || targetData === void 0 ? void 0 : (_targetData$value4 = targetData.value) === null || _targetData$value4 === void 0 ? void 0 : (_targetData$value4$ev = _targetData$value4.event) === null || _targetData$value4$ev === void 0 ? void 0 : _targetData$value4$ev.id) ? targetData === null || targetData === void 0 ? void 0 : (_targetData$value5 = targetData.value) === null || _targetData$value5 === void 0 ? void 0 : (_targetData$value5$ev = _targetData$value5.event) === null || _targetData$value5$ev === void 0 ? void 0 : _targetData$value5$ev.id : undefined,
     value: dimension,
     onChange: onChangeDimension
-  })), (filters || isAdd) && /*#__PURE__*/React.createElement(BizConditionGroup, {
+  }), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "\u6DFB\u52A0\u5C5E\u6027\u7B5B\u9009"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(classPrefix, "-icon ").concat(!enableAdd ? 'disabled' : ''),
+    type: "shaixuan",
+    onClick: onAdd
+  })), /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(classPrefix, "-icon delete ").concat(!(props.enableDelete !== undefined ? props.enableDelete : enableDelete) ? 'disabled' : ''),
+    type: "qingchu",
+    onClick: onDelete
+  })), (filters || isAdd) && /*#__PURE__*/React.createElement(BizAttrConditionGroup, {
     ref: conditionRef,
     value: filters,
     onlyAnd: props.onlyAnd,

package/es/targetConditionGroup/styles/index.less

@@ -3,25 +3,50 @@
 .biz-target {
   &-content {
     display: flex;
+    align-items: center;
   }
 
   .biz-target-select {
-    flex: 1;
+    min-width: 160px;
+    max-width: calc(100% - 208px);
+    &:hover {
+      .biz-event-select {
+        max-width: calc(100% - 18px);
+      }
+    }
+    .biz-event-select {
+      max-width: 100%;
+    }
+    .biz-select-handle-content {
+      max-width: calc(100% - 19px);
+    }
   }
 
-  .biz-condition {
-    margin-top: 8px;
+  .biz-attr-condition-group {
+    margin-top: 12px;
   }
 
   &-dimension {
-    width: 114px;
-    margin-left: 8px;
-    .__select-handle();
+    width: 100px;
+    margin-left: 16px;
   }
   &-dropmenu,
   &-submenu {
     width: 120px;
   }
+
+  &-icon {
+    margin-left: 16px;
+    .__icon();
+
+    &.shaixuan {
+      font-size: 20px !important;
+    }
+
+    &.delete {
+      font-size: 16px !important;
+    }
+  }
   .biz-event-select.focus {
     box-shadow: none;
   }

package/es/targetConditionGroup/types.d.ts

@@ -28,6 +28,7 @@ export declare namespace TargetConditionTypes {
         max?: number;
         children: ReactNode;
         onlyAnd?: boolean;
+        enableDelete?: boolean;
         onChange?: (value: Value) => void;
         onDelete?: (value?: Value) => void;
     }

package/es/targetSelector/index.js

@@ -6,15 +6,11 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useEffect, useState } from 'react';
 import BizEventNameEditBox from './editBox';
-import { Dropdown } from 'antd';
 import './styles/index.less';
 import BizTargetOptionIcon from './optionIcon';
-import BizTargetOptionMenu from './optionMenu';
 export var classPrefix = 'biz-target-select';
 var BizTargetSelector = function BizTargetSelector(props) {
   var _targetData$event;
-  var enableAdd = props.enableAdd,
-    enableDelete = props.enableDelete;
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     alias = _useState2[0],
@@ -27,10 +23,6 @@ var BizTargetSelector = function BizTargetSelector(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     showEditModal = _useState6[0],
     setShowEditModal = _useState6[1];
-  var _useState7 = useState(false),
-    _useState8 = _slicedToArray(_useState7, 2),
-    visible = _useState8[0],
-    setVisible = _useState8[1];
   useEffect(function () {
     if (!props.defaultValue) return;
     setAlias(props.defaultValue.alias || '');
@@ -41,26 +33,6 @@ var BizTargetSelector = function BizTargetSelector(props) {
     setAlias(props.value.alias || '');
     setTargetData(props.value.value || undefined);
   }, [props.value]);
-  var onClickIcon = function onClickIcon(name) {
-    setVisible(false);
-    if (name === 'edit') {
-      setShowEditModal(true);
-    } else if (name === 'add') {
-      if (props.onAdd && enableAdd) {
-        props.onAdd({
-          alias: alias,
-          value: targetData
-        });
-      }
-    } else if (name === 'delete') {
-      if (props.onDelete && enableDelete) {
-        props.onDelete({
-          alias: alias,
-          value: targetData
-        });
-      }
-    }
-  };
   var onCancelEdit = function onCancelEdit() {
     setShowEditModal(false);
   };
@@ -79,13 +51,10 @@ var BizTargetSelector = function BizTargetSelector(props) {
       value: value
     });
   };
-  var onOpenChange = function onOpenChange(flag) {
-    setVisible(flag);
-  };
-  var _useState9 = useState(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    focus = _useState10[0],
-    setFocus = _useState10[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    focus = _useState8[0],
+    setFocus = _useState8[1];
   var onVisibleChange = function onVisibleChange(flag) {
     setFocus(flag);
   };
@@ -96,45 +65,18 @@ var BizTargetSelector = function BizTargetSelector(props) {
     value: targetData,
     onChange: onChange,
     onVisibleChange: onVisibleChange
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(classPrefix, "-option-list")
-  }, /*#__PURE__*/React.createElement(BizTargetOptionIcon, {
-    name: "add",
-    icon: "shaixuan",
-    title: "\u6DFB\u52A0\u7B5B\u9009",
-    enabled: enableAdd,
-    onClick: onClickIcon
   }), /*#__PURE__*/React.createElement(BizTargetOptionIcon, {
-    name: "delete",
-    icon: "qingchu",
-    title: "\u5220\u9664",
-    enabled: enableDelete,
-    onClick: onClickIcon
-  }), targetData && /*#__PURE__*/React.createElement(Dropdown, {
-    open: visible,
-    onOpenChange: onOpenChange,
-    dropdownRender: function dropdownRender() {
-      return /*#__PURE__*/React.createElement(BizTargetOptionMenu, {
-        onClick: onClickIcon,
-        enableAdd: enableAdd,
-        enableDelete: enableDelete
-      });
-    },
-    trigger: ['click']
-  }, /*#__PURE__*/React.createElement(BizTargetOptionIcon, {
-    name: "more",
-    icon: "gengduocaozuo1",
-    title: "\u7F16\u8F91\u522B\u540D\u3001\u7B5B\u9009\u3001\u5220\u9664",
-    enabled: true
-  }))), showEditModal && /*#__PURE__*/React.createElement(BizEventNameEditBox, {
+    name: "add",
+    icon: "bianji-tianchong",
+    title: "\u7F16\u8F91\u522B\u540D",
+    onClick: function onClick() {
+      return setShowEditModal(true);
+    }
+  }), showEditModal && /*#__PURE__*/React.createElement(BizEventNameEditBox, {
     defaultValue: alias,
     disabled: targetData === null || targetData === void 0 ? void 0 : (_targetData$event = targetData.event) === null || _targetData$event === void 0 ? void 0 : _targetData$event.name,
     onCancel: onCancelEdit,
     onChange: onChangeAlias
   }));
 };
-BizTargetSelector.defaultProps = {
-  enableAdd: true,
-  enableDelete: true
-};
 export default BizTargetSelector;

package/es/targetSelector/optionIcon.js

@@ -17,4 +17,7 @@ var BizTargetOptionIcon = function BizTargetOptionIcon(props) {
     onClick: onClick
   }));
 };
+BizTargetOptionIcon.defaultProps = {
+  enabled: true
+};
 export default BizTargetOptionIcon;

package/es/targetSelector/styles/index.less

@@ -3,11 +3,33 @@
 .biz-target-select {
   position: relative;
   display: flex;
+  align-items: center;
+  height: 32px;
+  padding: 0;
+  line-height: 32px;
+  background-color: @background-color-base;
+  border-color: @background-color-base;
   .__select-handle();
 
+  &:hover {
+    border-color: @primary-color;
+    .biz-target-select-option-icon {
+      display: inline-block;
+    }
+  }
+  &:focus {
+    background-color: #fff;
+    .biz-select-handle-input {
+      background-color: #fff;
+    }
+  }
+
+  .biz-select-handle-input.middle {
+    height: 30px;
+    line-height: 30px;
+  }
   .biz-event-select {
     flex: 1;
-    width: 0;
   }
 
   .biz-event-select-handle {
@@ -16,22 +38,14 @@
     border: none;
   }
 
-  &:hover {
-    .biz-target-select-option-icon {
-      display: inline-block;
-    }
-  }
-
-  &-option-list {
-    display: flex;
-  }
-
   &-option-icon {
     display: none;
     flex: none;
-    width: @icon-width;
+    width: 16px;
+    height: @height-sm;
+    margin-right: 4px;
     color: @text-color-secondary;
-    line-height: @height-base;
+    line-height: @height-sm;
     text-align: center;
     border-radius: @border-radius-small;
 

package/es/userGroup/index.js

@@ -7,9 +7,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useContext, useEffect, useState } from 'react';
 import './styles/index.less';
 import BizSelect from '../select';
-import BizTargetOptionIcon from '../targetSelector/optionIcon';
 import { Skeleton } from 'antd';
 import BizGlobalDataContext from '../context';
+import { IconFont } from '..';
 var BizUserGroup = function BizUserGroup(props) {
   var enableDelete = props.enableDelete,
     keyField = props.keyField,
@@ -60,19 +60,15 @@ var BizUserGroup = function BizUserGroup(props) {
     options: props.options || userGroupList,
     keyField: keyField,
     labelField: labelField,
-    theme: "secondary",
-    border: false,
     disableItemList: props.disableItemList,
     onChange: onChange,
     minDropdownWidth: 284,
     onVisibleChange: onVisibleChange
-  }), /*#__PURE__*/React.createElement(BizTargetOptionIcon, {
-    name: "delete",
-    icon: "qingchu",
-    title: "\u5220\u9664",
-    enabled: enableDelete,
+  }), enableDelete ? /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(classPrefix, "-icon delete ").concat(!enableDelete ? 'disabled' : ''),
+    type: "qingchu",
     onClick: onClickDelete
-  })));
+  }) : null));
 };
 BizUserGroup.defaultProps = {
   keyField: 'id',

package/es/userGroup/styles/index.less

@@ -3,17 +3,16 @@
 .biz-user {
   position: relative;
   display: flex;
-  .__select-handle();
+  align-items: center;
+
   .biz-select-handle {
-    flex: 1;
-    width: 100%;
-    padding: 0;
-    border: none;
-    border-radius: 0;
+    min-width: 208px;
+    max-width: calc(100% - 56px);
   }
-  &:hover {
-    .biz-target-select-option-icon {
-      display: inline-block;
-    }
+
+  &-icon {
+    .__icon();
+    margin-left: 16px;
+    font-size: 16px !important;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zgfe/business-lib",
-  "version": "1.1.66",
+  "version": "1.1.67-beta.3",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -60,5 +60,5 @@
     "react": "^16.12.0 || ^17.0.0",
     "yorkie": "^2.0.0"
   },
-  "gitHead": "fbe4dd859dc6a6384b8ccd4f20a6199f0e4f88a2"
+  "gitHead": "60b424a819cbf1465a05510288a93b9cda0b67d0"
 }