@zgfe/business-lib 1.0.0-beta.6 → 1.0.3

package/es/dialog/components/tab.js

@@ -10,40 +10,78 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+import { Dropdown, Radio, Space } from 'antd';
 import React, { useState } from 'react';
 import IconFont from '../../components/iconFont';
-import { chartTypes } from '../data/chart';
-import './style/tab.less';
+import './styles/tab.less';
 
 var BizTab = function BizTab(props) {
-  var _props$options = props.options,
-      options = _props$options === void 0 ? [] : _props$options,
-      value = props.value,
-      onChange = props.onChange;
+  var _props$value;
 
-  var _useState = useState(value),
+  var _useState = useState((_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.split(',')),
       _useState2 = _slicedToArray(_useState, 2),
       tab = _useState2[0],
       setTab = _useState2[1];
 
-  return /*#__PURE__*/React.createElement("div", {
-    className: "biz-tab-container"
-  }, chartTypes.map(function (item) {
-    var isDisabled = options.indexOf(item.label) === -1;
+  var classPrefix = 'biz-tab';
+
+  var ChildList = function ChildList(data) {
+    var _data$children;
+
     return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-drop")
+    }, /*#__PURE__*/React.createElement(Radio.Group, {
+      value: tab && tab[1]
+    }, /*#__PURE__*/React.createElement(Space, null, (_data$children = data.children) === null || _data$children === void 0 ? void 0 : _data$children.map(function (item) {
+      return /*#__PURE__*/React.createElement(Radio, {
+        key: item.value,
+        value: item.value,
+        onClick: function onClick() {
+          return onChange(data, item);
+        }
+      }, /*#__PURE__*/React.createElement(IconFont, {
+        className: "".concat(classPrefix, "-radio-icon"),
+        type: item.icon
+      }));
+    }))));
+  };
+
+  var onChange = function onChange(data, child) {
+    setTab([data.value, child.value]);
+    props.onChange && props.onChange("".concat(data.value, ",").concat(child.value));
+  };
+
+  var _onClick = function onClick(data) {
+    if (data.disabled || tab && tab[0] === data.value) return;
+    var item = [data.value];
+
+    if (data.children) {
+      item.push(data.children[0].value);
+    }
+
+    setTab(item);
+    props.onChange && props.onChange(item.join(','));
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: classPrefix
+  }, props.options.map(function (item) {
+    return /*#__PURE__*/React.createElement(Dropdown, {
       key: item.value,
-      className: "biz-tab-item ".concat(isDisabled ? 'disabled' : '', " ").concat(tab === item.value ? 'active' : ''),
+      placement: "top",
+      disabled: item.disabled || !item.children,
+      overlay: function overlay() {
+        return ChildList(item);
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(classPrefix, "-item ").concat(item.disabled ? 'disabled' : '', " ").concat(tab && tab[0] === item.value ? 'active' : ''),
       onClick: function onClick() {
-        if (isDisabled || tab === item.value) return;
-        setTab(function () {
-          return item.value;
-        });
-        onChange && onChange(item.value);
+        return _onClick(item);
       }
     }, /*#__PURE__*/React.createElement(IconFont, {
-      className: "biz-icon",
+      className: "".concat(classPrefix, "-icon"),
       type: item.icon
-    }), /*#__PURE__*/React.createElement("span", null, item.label));
+    }), /*#__PURE__*/React.createElement("span", null, item.label)));
   }));
 };
 

package/es/dialog/data/{chart.d.ts → data.d.ts}

@@ -9,3 +9,12 @@ export declare const typeMenus: {
     content: string;
     icon: string;
 }[];
+export declare const inputOptions: ({
+    label: string;
+    value: number;
+    title?: undefined;
+} | {
+    label: string;
+    value: number;
+    title: string;
+})[];

package/es/dialog/data/{chart.js → data.js}

@@ -59,4 +59,15 @@ export var typeMenus = [{
   title: '收入',
   content: '收入情况',
   icon: 'icon-fenshu'
+}];
+export var inputOptions = [{
+  label: '公开',
+  value: 1
+}, {
+  label: '指定人员明显',
+  value: 2,
+  title: '通过看板的共享功能指定可见成员'
+}, {
+  label: '仅自己可见',
+  value: 3
 }];

package/es/dialog/demo/index.d.ts

@@ -1,2 +1,25 @@
+export declare const chartTypes: ({
+    label: string;
+    value: string;
+    icon: string;
+    disabled?: undefined;
+    children?: undefined;
+} | {
+    label: string;
+    value: string;
+    icon: string;
+    disabled: boolean;
+    children?: undefined;
+} | {
+    label: string;
+    value: string;
+    icon: string;
+    children: {
+        label: string;
+        value: string;
+        icon: string;
+    }[];
+    disabled?: undefined;
+})[];
 declare const _default: () => JSX.Element;
 export default _default;

package/es/dialog/demo/index.js

@@ -29,7 +29,37 @@ var options = [{
   id: 33,
   name: '分分类三一'
 }];
-var chartTypes = ['趋势图', '汇总图', '地图'];
+export var chartTypes = [{
+  label: '趋势图',
+  value: 'line',
+  icon: 'icon-qushitu1'
+}, {
+  label: '汇总图',
+  value: 'bar',
+  icon: 'icon-huizongtu'
+}, {
+  label: '地图',
+  value: 'map',
+  icon: 'icon-ditu',
+  disabled: true
+}, {
+  label: '表格',
+  value: 'table',
+  icon: 'icon-biaoge',
+  children: [{
+    label: '趋势图',
+    value: 'line',
+    icon: 'icon-qushitu1'
+  }, {
+    label: '汇总图',
+    value: 'bar',
+    icon: 'icon-huizongtu'
+  }]
+}, {
+  label: '分数',
+  value: 'fraction',
+  icon: 'icon-fenshu'
+}];
 var fields = [{
   label: '分类',
   name: 'class',
@@ -46,7 +76,7 @@ var fields = [{
     message: '请选择分类'
   }],
   onChange: function onChange(val) {
-    console.log('select>>>', val);
+    console.log('value>>>', val);
   }
 }, {
   label: '名称',
@@ -91,7 +121,8 @@ var formData = {
     name: '分类一'
   },
   range: 'public',
-  show: 'dynamic'
+  show: 'dynamic',
+  chart: 'line'
 };
 export default (function () {
   var _useState = useState(false),

package/es/dialog/demo/index2.js

@@ -19,7 +19,16 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState } from 'react';
 import { BizDialog } from '@zgfe/business-lib';
 import { Button } from 'antd';
-var options = ['分类一', '分类二', '分类三'];
+var options = [{
+  label: '分类一',
+  value: 'class1'
+}, {
+  label: '分类二',
+  value: 'class2'
+}, {
+  label: '分类三',
+  value: 'class3'
+}];
 var fields = [{
   label: '场景分类',
   name: 'class',
@@ -57,7 +66,10 @@ var fields = [{
   }]
 }];
 var formData = {
-  test: 'test2'
+  test: {
+    label: '测试二',
+    value: 'test2'
+  }
 };
 export default (function () {
   var _useState = useState(false),

package/es/dialog/index.d.ts

@@ -1,100 +1,7 @@
 import { FormItemProps, ModalProps } from 'antd';
 import React from 'react';
-interface BizObjectDefaultProps {
-    [key: string]: any;
-}
-interface fieldNamesProps {
-    label: string;
-    value: string;
-}
-interface FieldProps {
-    /**
-     * @description       form.item名称
-     * @default           -
-     */
-    label?: string;
-    /**
-     * @description       form.item类型
-     * @default           input
-     */
-    type?: string;
-    /**
-     * @description       form.item 默认值
-     * @default           -
-     */
-    value?: string | number;
-    /**
-     * @description       form.item 依赖项及其值 {age:20}
-     * @default           -
-     */
-    dependenceFields?: BizObjectDefaultProps;
-    /**
-     * @description       提示
-     * @default           -
-     */
-    placeholder?: string;
-    /**
-     * @description       form.item 排列方向 'horizontal' | 'vertical'
-     * @default           horizontal
-     */
-    direction?: 'horizontal' | 'vertical';
-    /**
-     * @description       form.item 下拉内容
-     * @default           -
-     */
-    options?: Array<any>;
-    /**
-     * @description   扩展名称
-     * @default       -
-     */
-    extendName?: string;
-    /**
-     * @description   下拉框的自定义节点 label、value
-     * @default      { label: 'label', value: 'value' }
-     */
-    fieldNames?: fieldNamesProps;
-    /**
-     * @description       影响的表单项
-     * @default           -
-     */
-    children?: Array<string>;
-    /**
-     * @description   值发生改变
-     * @default         -
-     */
-    onChange?: () => void;
-}
-interface BizDialogProps {
-    /**
-     * @description       弹窗类型
-     * @default           input
-     */
-    layout?: 'horizontal' | 'vertical' | 'inline';
-    /**
-     * @description     弹窗表单字段
-     * @default         -
-     */
-    fields: Array<FieldProps & FormItemProps>;
-    /**
-     * @description     表单默认值，只有初始化以及重置时生效
-     * @default         -
-     */
-    initialValues?: object;
-    /**
-     * @description    是否显示必填标记
-     * @default         -
-     */
-    showMark?: boolean;
-    /**
-     * @description 	提交表单且数据验证成功后回调事件
-     * @default         -
-     */
-    onOk?: (data: object) => void;
-    /**
-     * @description 	取消
-     * @default         -
-     */
-    onCancel?: () => void;
-}
-declare const BizDialog: React.FC<ModalProps & BizDialogProps & FormItemProps>;
+import { DialogTypes } from './types';
+import './styles/index.less';
+export declare const classPrefix = "biz-dialog";
+declare const BizDialog: React.FC<ModalProps & DialogTypes.Props & FormItemProps>;
 export default BizDialog;

package/es/dialog/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["width", "initialValues", "fields", "visible", "showMark", "layout", "onOk", "onCancel"];
+var _excluded = ["width", "initialValues", "fields", "visible", "showMark", "layout"];
 
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 
@@ -32,26 +32,19 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-import { Form, Input, Modal, Radio, Space } from 'antd';
+import { Form, Modal } from 'antd';
 import React, { useEffect, useState } from 'react';
-import BizSelectToInput from './components/selectToInput';
-import { IconFont, BizSelect } from '..';
-import BizTab from './components/tab';
-import BizList from './components/list';
+import './styles/index.less';
+import ItemNode from './components/itemNode';
+export var classPrefix = 'biz-dialog';
 
 var BizDialog = function BizDialog(props) {
-  var _props$width = props.width,
-      width = _props$width === void 0 ? 520 : _props$width,
+  var width = props.width,
       initialValues = props.initialValues,
       fields = props.fields,
-      _props$visible = props.visible,
-      visible = _props$visible === void 0 ? false : _props$visible,
-      _props$showMark = props.showMark,
-      showMark = _props$showMark === void 0 ? false : _props$showMark,
-      _props$layout = props.layout,
-      layout = _props$layout === void 0 ? 'horizontal' : _props$layout,
-      _onOk = props.onOk,
-      _onCancel = props.onCancel,
+      visible = props.visible,
+      showMark = props.showMark,
+      layout = props.layout,
       res = _objectWithoutProperties(props, _excluded);
 
   var _Form$useForm = Form.useForm(),
@@ -63,78 +56,6 @@ var BizDialog = function BizDialog(props) {
       formFields = _useState2[0],
       setFormFields = _useState2[1];
 
-  var getFormItem = function getFormItem(_ref) {
-    var type = _ref.type,
-        label = _ref.label,
-        options = _ref.options,
-        placeholder = _ref.placeholder,
-        _ref$fieldNames = _ref.fieldNames,
-        fieldNames = _ref$fieldNames === void 0 ? {
-      label: 'label',
-      value: 'value'
-    } : _ref$fieldNames,
-        extendName = _ref.extendName,
-        direction = _ref.direction,
-        onChange = _ref.onChange;
-
-    if (type === 'selectToInput') {
-      return /*#__PURE__*/React.createElement(BizSelectToInput, {
-        name: label,
-        options: options,
-        fieldNames: fieldNames,
-        extendName: extendName,
-        onChange: onChange
-      });
-    } else if (type === 'select') {
-      return /*#__PURE__*/React.createElement(BizSelect, {
-        options: options,
-        name: label,
-        size: "middle",
-        onChange: onChange
-      });
-    } else if (type === 'input') {
-      return /*#__PURE__*/React.createElement(Input, {
-        className: "biz-input",
-        placeholder: placeholder || "\u8BF7\u8F93\u5165".concat(label),
-        autoComplete: "off",
-        allowClear: {
-          clearIcon: /*#__PURE__*/React.createElement(IconFont, {
-            className: "biz-icon",
-            type: 'icon-qingchu'
-          })
-        },
-        onChange: onChange
-      });
-    } else if (type === 'password') {
-      return /*#__PURE__*/React.createElement(Input.Password, {
-        className: "biz-input",
-        placeholder: placeholder || "\u8BF7\u8F93\u5165".concat(label),
-        onChange: onChange
-      });
-    } else if (type === 'tab') {
-      return /*#__PURE__*/React.createElement(BizTab, {
-        options: options,
-        onChange: onChange
-      });
-    } else if (type === 'radio') {
-      return /*#__PURE__*/React.createElement(Radio.Group, {
-        onChange: onChange
-      }, /*#__PURE__*/React.createElement(Space, {
-        direction: direction || 'horizontal'
-      }, options && options.map(function (item) {
-        return /*#__PURE__*/React.createElement(Radio, {
-          key: item[fieldNames.value],
-          value: item[fieldNames.value]
-        }, item[fieldNames.label]);
-      })));
-    } else if (type === 'list') {
-      return /*#__PURE__*/React.createElement(BizList, {
-        options: options && options.length > 0 ? options : undefined,
-        onChange: onChange
-      });
-    }
-  };
-
   useEffect(function () {
     if (visible) {
       form.resetFields();
@@ -145,6 +66,19 @@ var BizDialog = function BizDialog(props) {
       return _toConsumableArray(fields);
     });
   }, [fields]);
+
+  var onOk = function onOk() {
+    form.validateFields().then(function (values) {
+      props.onOk && props.onOk(values);
+    }).catch(function (info) {
+      console.log('Validate Failed:', info);
+    });
+  };
+
+  var onCancel = function onCancel() {
+    if (props.onCancel) props.onCancel();
+  };
+
   return /*#__PURE__*/React.createElement(Modal, _objectSpread(_objectSpread({
     width: width,
     centered: true,
@@ -160,25 +94,15 @@ var BizDialog = function BizDialog(props) {
     okText: "\u786E\u5B9A",
     closable: false
   }, res), {}, {
-    onCancel: function onCancel() {
-      return _onCancel && _onCancel();
-    },
-    onOk: function onOk() {
-      form.validateFields().then(function (values) {
-        _onOk && _onOk(values);
-      }).catch(function (info) {
-        console.log('Validate Failed:', info);
-      });
-    }
+    onCancel: onCancel,
+    onOk: onOk
   }), /*#__PURE__*/React.createElement(Form, {
-    className: "biz-dialog",
+    className: classPrefix,
     form: form,
-    name: "form_in_modal",
     requiredMark: showMark,
     initialValues: initialValues,
     layout: layout
-  }, formFields === null || formFields === void 0 ? void 0 : formFields.map(function (item, index) {
-    // 判断是否有依赖项，如果依赖项的值符合，则展示，否则不展示
+  }, formFields === null || formFields === void 0 ? void 0 : formFields.map(function (item) {
     if (item.dependenceFields && Object.keys(item.dependenceFields).length > 0) {
       var keys = Object.keys(item.dependenceFields);
       var dependenceFields = item.dependenceFields;
@@ -195,9 +119,18 @@ var BizDialog = function BizDialog(props) {
             for (_iterator.s(); !(_step = _iterator.n()).done;) {
               var key = _step.value;
 
-              if (prevValues[key] !== curValues[key]) {
-                flag = true;
-                break;
+              if (item.dependencekeys && item.dependencekeys[key]) {
+                var dKey = item.dependencekeys[key];
+
+                if (prevValues[key][dKey] !== curValues[key][dKey]) {
+                  flag = true;
+                  break;
+                }
+              } else {
+                if (prevValues[key] !== curValues[key]) {
+                  flag = true;
+                  break;
+                }
               }
             }
           } catch (err) {
@@ -208,8 +141,8 @@ var BizDialog = function BizDialog(props) {
 
           return flag;
         }
-      }, function (_ref2) {
-        var getFieldValue = _ref2.getFieldValue;
+      }, function (_ref) {
+        var getFieldValue = _ref.getFieldValue;
         var flag = true;
 
         var _iterator2 = _createForOfIteratorHelper(keys),
@@ -240,7 +173,10 @@ var BizDialog = function BizDialog(props) {
             offset: !item.label && layout === 'horizontal' ? 2 : 0
           },
           shouldUpdate: true
-        }, getFormItem(item)) : null;
+        }, /*#__PURE__*/React.createElement(ItemNode, {
+          field: item,
+          fieldNames: item.fieldNames
+        })) : null;
       });
     } else {
       return /*#__PURE__*/React.createElement(Form.Item, {
@@ -254,9 +190,18 @@ var BizDialog = function BizDialog(props) {
           offset: !item.label && layout === 'horizontal' ? 2 : 0
         },
         shouldUpdate: true
-      }, getFormItem(item));
+      }, /*#__PURE__*/React.createElement(ItemNode, {
+        field: item,
+        fieldNames: item.fieldNames
+      }));
     }
   })));
 };
 
+BizDialog.defaultProps = {
+  width: 520,
+  visible: false,
+  showMark: false,
+  layout: 'horizontal'
+};
 export default BizDialog;

package/es/dialog/styles/index.less

@@ -0,0 +1,11 @@
+@import '../../assets/styles/inner.less';
+
+.biz-dialog {
+  &-input.ant-input-affix-wrapper {
+    border-radius: @border-radius-small;
+  }
+
+  .ant-form-item-label > label {
+    height: @height-lg;
+  }
+}

package/es/dialog/types.d.ts

@@ -0,0 +1,77 @@
+import { FormItemProps } from 'antd';
+import { ReactNode } from 'react';
+import { BizSelectTypes } from '../select/types';
+export declare namespace TabTypes {
+    interface Props {
+        value?: string;
+        options: Array<TabItem>;
+        onChange?: (value: string) => void;
+    }
+    interface TabItemChild {
+        label: string;
+        value: string;
+        icon: string;
+        disabled?: boolean;
+    }
+    interface TabItem extends TabItemChild {
+        children?: Array<TabItemChild>;
+    }
+}
+export interface SelectInputProps {
+    name?: string;
+    extendName?: string;
+    value?: string;
+    onChange?: (value?: BizSelectTypes.Option | undefined) => void;
+}
+export interface ItemProps {
+    id: string | number;
+    title?: string;
+    content?: string;
+    icon?: string;
+}
+export interface ListProps {
+    value?: string | number;
+    options?: Array<ItemProps>;
+    onChange?: (value: string | number) => void;
+}
+export declare namespace DialogTypes {
+    export interface FieldOption {
+        label: string;
+        value: string;
+    }
+    interface Option {
+        [otherProp: string]: any;
+    }
+    export interface FieldProps {
+        label?: string;
+        type?: string;
+        value?: string | number;
+        dependenceFields?: {
+            [pro: string]: string;
+        };
+        dependencekeys?: {
+            [pro: string]: string;
+        };
+        placeholder?: string;
+        direction?: 'horizontal' | 'vertical';
+        options?: Option[];
+        extendName?: string;
+        fieldNames?: FieldOption;
+        children?: Array<string>;
+        multiple?: boolean;
+        selectType?: 'group' | 'normal';
+        enableSearch?: boolean;
+        overlayWidth?: number;
+        extra?: (option: Option) => ReactNode;
+        onChange?: (value?: any) => void;
+    }
+    export interface Props {
+        layout?: 'horizontal' | 'vertical' | 'inline';
+        fields: Array<FieldProps & FormItemProps>;
+        initialValues?: object;
+        showMark?: boolean;
+        onOk?: (data: object) => void;
+        onCancel?: () => void;
+    }
+    export {};
+}