vap1 0.1.6 → 0.1.7

package/components/TreeSelect/DTreeSelect.js

@@ -49,7 +49,6 @@ const _DTreeSelect = (props) => {
             const { node } = dataNode.data;
             const API = props.childApi + node[treeState.keyField];
             const children = yield (0, BaseTreeSelect_1.getData)(API, notCache);
-            console.log('dataNode', dataNode);
             const pathArr = dataNode.pos.split('-');
             pathArr.splice(0, 1);
             let nodePath = pathArr.map(i => `[${i}]`).join('.children');

package/components/Trees/COTree/COButton.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from 'react';
+import type { COSelectProps } from './COSelect';
+export declare const COButton: FC<COSelectProps>;

package/components/Trees/COTree/COButton.js

@@ -0,0 +1,121 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.COButton = void 0;
+const react_1 = __importStar(require("react"));
+const lodash_1 = __importDefault(require("lodash"));
+const index_1 = require("../../../index");
+const COTree_1 = require("./COTree");
+const utils_1 = require("../../../utils");
+const COTreeUtil_1 = require("./COTreeUtil");
+const COSelect_1 = require("./COSelect");
+const COButton = props => {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const orgCodeRender = (0, react_1.useMemo)(() => utils_1.Renders.ApiPostRender({
+        api: props.api || utils_1.GLOBAL.CONFIG.BASIC.ORG_API,
+        nameField: props.titleField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[1],
+        valueFiled: props.keyField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[0],
+        render: (info) => {
+            if (info.label)
+                return react_1.default.createElement("span", { title: info.label }, info.label);
+            return react_1.default.createElement("span", { title: info.value }, info.value);
+        }
+    }), []);
+    const convert = (0, react_1.useMemo)(() => {
+        if (props.dataType)
+            return props.dataType;
+        if (lodash_1.default.has(props, 'value')) {
+            if (lodash_1.default.isString(props.value))
+                return 'string';
+            if (lodash_1.default.isArray(props.value))
+                return 'array';
+            if (lodash_1.default.isPlainObject(props.value))
+                return 'object';
+        }
+        return 'string';
+    }, [props.dataType]);
+    const value = (0, react_1.useMemo)(() => {
+        switch (convert) {
+            case 'array':
+                return (props.value || []);
+            case 'object':
+                return (0, COTreeUtil_1.convertFormObject)(props.value);
+            default:
+                return (0, COTreeUtil_1.convertFormString)(props.value);
+        }
+    }, [props.value, convert]);
+    const buttonText = (0, react_1.useMemo)(() => {
+        if (value == null || value.length == 0) {
+            return '点击选择机构';
+        }
+        if (value.length == 1) {
+            return orgCodeRender(value[0].key);
+        }
+        return react_1.default.createElement("span", null,
+            orgCodeRender(value[0].key),
+            " \u7B49 ",
+            react_1.default.createElement("b", null, value.length),
+            "\u4E2A\u673A\u6784");
+    }, [value]);
+    const [tempValue, setTempValue] = (0, react_1.useState)(value);
+    // tagRender={() => {
+    //     
+    //         return orgCodeRender(selectValue[0].key) as any;
+    //     }
+    // }}
+    const onOk = () => {
+        setOpen(false);
+        switch (convert) {
+            case 'array':
+                props.onChange(tempValue);
+                return;
+            case 'object':
+                props.onChange((0, COTreeUtil_1.invertToObject)(tempValue));
+                return;
+            default:
+                props.onChange((0, COTreeUtil_1.invertToString)(tempValue));
+                return;
+        }
+    };
+    return react_1.default.createElement(index_1.Button.Group, null,
+        react_1.default.createElement(index_1.Button, { disabled: props.disabled, onClick: () => setOpen(true) }, buttonText),
+        value.length > 0 && react_1.default.createElement(index_1.Popover, { style: { width: 480 }, overlayClassName: 'co-button-content', content: react_1.default.createElement(COSelect_1.SelectedTable, Object.assign({}, props, { value: value })) },
+            react_1.default.createElement(index_1.Button, { icon: "unordered-list", type: "primary", style: { paddingRight: 0, paddingLeft: 4 } })),
+        react_1.default.createElement(index_1.Modal, { open: open, title: "\u8BF7\u9009\u62E9\u673A\u6784", bodyStyle: { maxHeight: 540, overflow: 'auto' }, width: 720, onCancel: () => setOpen(false), onOk: onOk },
+            react_1.default.createElement(index_1.Alert, { message: react_1.default.createElement(react_1.default.Fragment, null,
+                    "\u9009\u4E2D\u72B6\u6001\u8BF4\u660E \uFF1A ",
+                    (0, COTreeUtil_1.flagRender)(0, ' :'),
+                    " ",
+                    react_1.default.createElement("span", { style: { color: 'rgba(0,0,0,0.2)', marginLeft: 6, marginRight: 6 } }, "|"),
+                    (0, COTreeUtil_1.flagRender)(1, ' :'),
+                    " ",
+                    react_1.default.createElement("span", { style: { color: 'rgba(0,0,0,0.2)', marginLeft: 6, marginRight: 6 } }, "|"),
+                    (0, COTreeUtil_1.flagRender)(2, ' :')), type: "info", style: { margin: '12px 12px 0 12px' } }),
+            react_1.default.createElement(COTree_1.COTree, Object.assign({}, props, { value: tempValue, onChange: values => setTempValue(values), selectTip: true }))));
+};
+exports.COButton = COButton;

package/components/Trees/COTree/COSelect.d.ts

@@ -41,5 +41,6 @@ export type COSelectProps = Omit<COTreeProps, 'onChange' | 'value'> & {
     */
     width?: number;
 };
+export declare const SelectedTable: FC<COSelectProps>;
 export declare const COSelect: FC<COSelectProps>;
 export {};

package/components/Trees/COTree/COSelect.js

@@ -26,15 +26,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.COSelect = void 0;
+exports.COSelect = exports.SelectedTable = void 0;
 const react_1 = __importStar(require("react"));
 const lodash_1 = __importDefault(require("lodash"));
-const antd_1 = require("antd");
+const index_1 = require("../../../index");
 const Tables_1 = require("../../Tables");
 const COTree_1 = require("./COTree");
 const utils_1 = require("../../../utils");
 const COTreeUtil_1 = require("./COTreeUtil");
-const COSelect = props => {
+const SelectedTable = props => {
     const orgCodeRender = (0, react_1.useMemo)(() => utils_1.Renders.ApiPostRender({
         api: props.api || utils_1.GLOBAL.CONFIG.BASIC.ORG_API,
         nameField: props.titleField || utils_1.GLOBAL.CONFIG.BASIC.ORG_FIELDS[1],
@@ -45,6 +45,13 @@ const COSelect = props => {
             return react_1.default.createElement("span", { title: info.value }, info.value);
         }
     }), []);
+    return react_1.default.createElement(Tables_1.STable, { style: { width: 460 }, list: props.value || [], columns: [
+            { dataIndex: 'key', title: '机构名称', render: orgCodeRender },
+            { dataIndex: 'flag', title: '状态', render: (flag) => (0, COTreeUtil_1.flagRender)(flag), width: 100 },
+        ], pagination: false });
+};
+exports.SelectedTable = SelectedTable;
+const COSelect = props => {
     const convert = (0, react_1.useMemo)(() => {
         if (props.dataType)
             return props.dataType;
@@ -56,15 +63,15 @@ const COSelect = props => {
             if (lodash_1.default.isPlainObject(props.value))
                 return 'object';
         }
-        return 'array';
+        return 'string';
     }, [props.dataType]);
     const value = (0, react_1.useMemo)(() => {
         switch (convert) {
             case 'array':
-                return props.value;
+                return (props.value || []);
             case 'object':
                 return (0, COTreeUtil_1.convertFormObject)(props.value);
-            case 'string':
+            default:
                 return (0, COTreeUtil_1.convertFormString)(props.value);
         }
     }, [props.value, convert]);
@@ -79,29 +86,18 @@ const COSelect = props => {
             case 'object':
                 props.onChange((0, COTreeUtil_1.invertToObject)(value));
                 return;
-            case 'string':
+            default:
                 props.onChange((0, COTreeUtil_1.invertToString)(value));
                 return;
         }
     }, [convert]);
-    return react_1.default.createElement(antd_1.Input.Group, { compact: true, style: { width: props.width || '100%', display: 'flex' } },
-        react_1.default.createElement(antd_1.Select, { maxTagCount: 1, mode: "tags", disabled: props.disabled, maxTagPlaceholder: react_1.default.createElement(react_1.default.Fragment, null), showSearch: false, className: 'co-select', allowClear: props.allowClear, 
+    return react_1.default.createElement(index_1.Input.Group, { compact: true, style: { width: props.width || '100%', display: 'flex' } },
+        react_1.default.createElement(index_1.Select, { maxTagCount: 1, mode: "tags", disabled: props.disabled, maxTagPlaceholder: react_1.default.createElement(react_1.default.Fragment, null), showSearch: false, className: 'co-select', allowClear: props.allowClear, 
             // onClear={() => props.onChange([])}
-            placeholder: props.placeholder || '请选择机构', style: { flexGrow: 1 }, showAction: ["click"], 
-            // options={[]}
-            labelInValue: true, 
-            // open
-            // open={open}
-            // onDropdownVisibleChange={(open) => {
-            //     setOpen(open)
-            // }}
-            value: selectValue, dropdownStyle: { width: props.width || '100%', maxHeight: 360, overflow: 'auto' }, dropdownRender: () => react_1.default.createElement(COTree_1.COTree, Object.assign({}, props, { value: value, onChange: onChange })), getPopupContainer: (evt) => {
+            placeholder: props.placeholder || '请选择机构', style: { flexGrow: 1 }, showAction: ["click"], options: [], labelInValue: true, value: selectValue, dropdownStyle: { width: props.width || '100%', maxHeight: 360, overflow: 'auto' }, dropdownRender: () => react_1.default.createElement(COTree_1.COTree, Object.assign({}, props, { value: value, onChange: onChange })), getPopupContainer: (evt) => {
                 return evt.parentElement.parentElement;
             } }),
-        react_1.default.createElement(antd_1.Popover, { style: { width: 480 }, content: () => react_1.default.createElement(Tables_1.STable, { style: { width: 460 }, list: value || [], columns: [
-                    { dataIndex: 'key', title: '机构名称', render: orgCodeRender },
-                    { dataIndex: 'flag', title: '状态', render: COTreeUtil_1.flagRender, width: 100 },
-                ], pagination: false }) },
-            react_1.default.createElement(antd_1.Button, { disabled: value.length == 0, type: "primary" }, "\u67E5\u770B\u5DF2\u9009")));
+        react_1.default.createElement(index_1.Popover, { style: { width: 480 }, content: react_1.default.createElement(exports.SelectedTable, Object.assign({}, props, { value: value })) },
+            react_1.default.createElement(index_1.Button, { disabled: value.length == 0, type: "primary" }, "\u67E5\u770B\u5DF2\u9009")));
 };
 exports.COSelect = COSelect;

package/components/Trees/COTree/COTree.js

@@ -159,7 +159,7 @@ const COTree = (props) => {
         return react_1.default.createElement(antd_1.Spin, { style: { display: 'block', margin: '24px auto' } });
     let defaultExpandedKeys = (ALL === null || ALL === void 0 ? void 0 : ALL.length) == 1 ? [ALL[0][keyField]] : [];
     const onCheck = (checked, info) => {
-        const key = info.node.props.key;
+        const key = info.node.props.eventKey;
         if (HALF_CHECKED.has(key)) {
             // 本级变为1
             const arr = utils_1.ArrayUtil.update(props.value || [], { key, flag: 1 }, 'key');

package/components/Trees/COTree/COTreeUtil.d.ts

@@ -9,7 +9,7 @@ export type TreeFields = {
     parentField: string;
     checkField?: string;
 };
-export declare const flagRender: (flag: FLAG) => React.JSX.Element;
+export declare const flagRender: (flag: FLAG, split?: React.ReactNode) => React.JSX.Element;
 export declare const getTreeDataByLoaded: (all: any[], treeProps: COTreeProps, FIELDS: TreeFields) => [TreeProps, Set<string>, Set<string>, Set<string>];
 export declare const convertFormObject: (obj: PlainObject) => COTreeValueItem[];
 export declare const invertToObject: (items: COTreeValueItem[]) => PlainObject;

package/components/Trees/COTree/COTreeUtil.js

@@ -8,19 +8,22 @@ const react_1 = __importDefault(require("react"));
 const lodash_1 = __importDefault(require("lodash"));
 const utils_1 = require("../../../utils");
 const Icon_1 = require("../../_adapt/Icon");
-const flagRender = (flag) => {
+const flagRender = (flag, split = utils_1.Const.NONE) => {
     switch (flag) {
         case 0:
             return react_1.default.createElement("span", { className: 'co-tree-select-all' },
                 react_1.default.createElement(Icon_1.Icon, { type: "check-circle" }),
+                split,
                 react_1.default.createElement("small", null, "\u542B\u4E0B\u7EA7"));
         case 1:
             return react_1.default.createElement("span", { className: 'co-tree-not-include' },
                 react_1.default.createElement(Icon_1.Icon, { type: "switcher" }),
+                split,
                 react_1.default.createElement("small", null, "\u4E0D\u542B\u672C\u7EA7"));
         case 2:
             return react_1.default.createElement("span", { className: 'co-tree-select-only' },
                 react_1.default.createElement(Icon_1.Icon, { type: "symbol-check-on" }),
+                split,
                 react_1.default.createElement("small", null, "\u672C\u7EA7+\u6307\u5B9A\u4E0B\u7EA7"));
     }
     return utils_1.Const.NONE;

package/components/UForm/_FieldType.d.ts

@@ -5,4 +5,4 @@
 | text ||
  *
 */
-export declare const _FieldType: readonly ["text", "textarea", "password", "color", "number", "slider", "slider-range", "slider-range", "input-with-select", "select", "multi-select", "switch", "switch-checkbox", "radio", "radio-button", "radio-with-more", "checkbox", "checkbox-with-all", "icon", "stree-select", "dtree-select", "ftree-select", "date", "datetime", "month", "week", "time", "daterange", "datetimerange", "daterange-single", "datetimerange-single", "monthrange", "json-array", "json-table", "file", "multi-file", "img", "idcard", "ip", "ip4", "ip6", "phone", "telephone", "mobilephone", "port", "mac", "url", "email", "crontab", "organization", "role", "roles", "cems-org"];
+export declare const _FieldType: readonly ["text", "textarea", "password", "color", "number", "slider", "slider-range", "slider-range", "input-with-select", "select", "multi-select", "switch", "switch-checkbox", "radio", "radio-button", "radio-with-more", "checkbox", "checkbox-with-all", "icon", "stree-select", "dtree-select", "ftree-select", "date", "datetime", "month", "week", "time", "daterange", "datetimerange", "daterange-single", "datetimerange-single", "timerange", "monthrange", "json-array", "json-table", "file", "multi-file", "img", "idcard", "ip", "ip4", "ip6", "phone", "telephone", "mobilephone", "port", "mac", "url", "email", "crontab", "organization", "role", "roles", "cems-org-button"];

package/components/UForm/_FieldType.js

@@ -81,7 +81,7 @@ exports._FieldType = [
     'datetimerange',
     'daterange-single',
     'datetimerange-single',
-    // 'timerange',
+    'timerange',
     'monthrange',
     'json-array',
     'json-table',
@@ -104,5 +104,6 @@ exports._FieldType = [
     'role',
     'roles',
     // CEMS 专用
-    'cems-org',
+    // 'cems-org',
+    'cems-org-button',
 ];

package/components/_adapt/Drawer.js

@@ -1,15 +1,43 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Drawer = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const antd_1 = require("antd");
 const utils_1 = require("./utils");
 const Drawer = (props) => {
-    return react_1.default.createElement(antd_1.Drawer, Object.assign({}, (0, utils_1.convertProps)(props, ['visible', 'open'], ['afterVisibleChange', 'afterOpenChange']), { getContainer: () => document.getElementById('vap-app-content') }),
+    const className = (0, react_1.useMemo)(() => {
+        let clazz = [];
+        if (props.className)
+            clazz.push(props.className);
+        if (props.footer && react_1.default.isValidElement(props.footer))
+            clazz.push('ant-drawer-has-footer');
+        return clazz.join(' ');
+    }, [props.className, props.footer]);
+    return react_1.default.createElement(antd_1.Drawer, Object.assign({ getContainer: () => document.body }, (0, utils_1.convertProps)(props, ['visible', 'open'], ['afterVisibleChange', 'afterOpenChange']), { className: className }),
         props.children,
-        props.footer);
+        (props.footer && react_1.default.isValidElement(props.footer)) && react_1.default.createElement("div", { className: 'ant-drawer-footer' }, props.footer));
 };
 exports.Drawer = Drawer;

package/components/_adapt/Modal.js

@@ -48,7 +48,7 @@ class Modal extends react_1.Component {
             react_1.default.createElement(Button_1.Button, Object.assign({ onClick: evt => utils_1.PageUtil.stopEvent(evt, () => onCancel()) }, cancelButtonProps), cancelText || utils_1.i18n.ant('Modal.cancelText')));
     }
     render() {
-        return react_1.default.createElement(antd_1.Modal, Object.assign({}, this.props, { getContainer: () => document.getElementById('vap-app-content'), visible: this.props.open, footer: this.props.footer === null ? null : this.renderFooter() }));
+        return react_1.default.createElement(antd_1.Modal, Object.assign({ getContainer: () => document.body }, this.props, { visible: this.props.open, footer: this.props.footer === null ? null : this.renderFooter() }));
     }
 }
 exports.Modal = Modal;

package/components/_setup/UForm/UFormCOTree.js

@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const lodash_1 = __importDefault(require("lodash"));
 const _register_1 = require("../../UForm/_register");
-const COSelect_1 = require("../../Trees/COTree/COSelect");
+const COButton_1 = require("../../Trees/COTree/COButton");
 const _input_1 = require("../../UForm/_input");
 // CEMS ORG SELECT 
-(0, _register_1.registerFormField)('cems-org', (props) => {
+(0, _register_1.registerFormField)('cems-org-button', (props) => {
     const { field, disabled, value, onChange } = props;
     let params = {
         placeholder: (0, _input_1.getPlaceholder)(field, true),
@@ -19,5 +19,5 @@ const _input_1 = require("../../UForm/_input");
     };
     if (field.required || field.rules && lodash_1.default.find(field.rules, { required: true }))
         params.allowClear = false;
-    return react_1.default.createElement(COSelect_1.COSelect, Object.assign({ dataType: field.dataType || 'string' }, params, field.config, { value: value }));
+    return react_1.default.createElement(COButton_1.COButton, Object.assign({ dataType: field.dataType || 'string' }, params, field.config, { value: value }));
 });

package/components/_setup/UForm/UFormDate.js

@@ -188,62 +188,105 @@ const DatePickRender = (value, data, field, showTime) => {
             }
         } }));
 });
-// 1.5 版本暂无
-// registerFormField('timerange', (props: FormFieldProps) => {
-//     const { field, disabled, value, onChange } = props;
-//     const ptn = useMemo(() => field.field.split(','), [])
-//     const format = useMemo(() => {
-//         if (field.config?.format) return field.config.format;
-//         return GLOBAL.CONFIG.DATE.TIME_FORMAT
-//     }, [])
-//     if (ptn.length != 2) {
-//         console.error('daterange field must hava a start and end, eg: field:"startTime,endTime"')
-//         return <TimePicker value={value} onChange={(val) => onChange(val.format(format))} disabled={disabled} />
-//     }
-//     const [startField, endField] = ptn;
-//     let params: TimeRangePickerProps = { disabled, allowClear: true };
-//     if (field.required || field.rules && _.find(field.rules, { required: true })) params.allowClear = false;
-//     params.value = [undefined, undefined];
-//     if (value) {
-//         if (value[startField]) {
-//             let day = dayjs(value[startField], format);
-//             if (day.isValid()) params.value[0] = day;
-//         }
-//         if (value[endField]) {
-//             let day = dayjs(value[endField], format);
-//             if (day.isValid()) params.value[1] = day;
-//         }
-//     }
-//     return <TimePicker.RangePicker
-//         style={{ width: '80%' }}
-//         {...params}
-//         {...field.config}
-//         format={format}
-//         onChange={([start, end]) => {
-//             if (start && end) {
-//                 onChange({
-//                     [startField]: start.format(format),
-//                     [endField]: end.format(format),
-//                 })
-//             } else {
-//                 onChange({
-//                     [startField]: undefined,
-//                     [endField]: undefined,
-//                 })
-//             }
-//         }}
-//     />
-// }, {
-//     render: (value, data, field) => {
-//         const ptn = field.field.split(',');
-//         if (ptn.length != 2) return '';
-//         const [startField, endField] = ptn;
-//         if (data[startField] && data[endField]) {
-//             return `${data[startField]} - ${data[endField]}`
-//         }
-//         return '';
-//     }
-// });
+(0, _register_1.registerFormField)('timerange', (props) => {
+    const { field, disabled, value, onChange } = props;
+    const ptn = (0, react_1.useMemo)(() => field.field.split(','), []);
+    const format = (0, react_1.useMemo)(() => {
+        var _a;
+        if ((_a = field.config) === null || _a === void 0 ? void 0 : _a.format)
+            return field.config.format;
+        return utils_1.GLOBAL.CONFIG.DATE.TIME_FORMAT;
+    }, []);
+    if (ptn.length != 2) {
+        console.error('daterange field must hava a start and end, eg: field:"startTime,endTime"');
+        return react_1.default.createElement(antd_1.TimePicker, { value: value, onChange: (val) => onChange(val.format(format)), disabled: disabled });
+    }
+    const [startField, endField] = ptn;
+    let startProps = { disabled, format };
+    let endProps = { disabled, format };
+    if (field.required || field.rules && lodash_1.default.find(field.rules, { required: true })) {
+        startProps.allowClear = false;
+        endProps.allowClear = false;
+    }
+    if (value) {
+        if (value[startField]) {
+            let day = (0, dayjs_1.default)(value[startField], format);
+            if (day.isValid())
+                startProps.value = day;
+        }
+        if (value[endField]) {
+            let day = (0, dayjs_1.default)(value[endField], format);
+            if (day.isValid())
+                endProps.value = day;
+        }
+        if (!lodash_1.default.has(field, 'config.cross') || field.config.cross != true) {
+            if (endProps.value) {
+                startProps.hideDisabledOptions = true;
+                startProps.disabledHours = () => lodash_1.default.range(endProps.value.hour() + 1, 24);
+                startProps.disabledMinutes = (selectedHour) => {
+                    if (selectedHour == endProps.value.hour()) {
+                        return lodash_1.default.range(endProps.value.minute() + 1, 60);
+                    }
+                    return [];
+                };
+                startProps.disabledSeconds = (selectedHour, selectedMinute) => {
+                    if (selectedHour == endProps.value.hour() && selectedMinute == endProps.value.minute()) {
+                        return lodash_1.default.range(endProps.value.second() + 1, 60);
+                    }
+                    return [];
+                };
+            }
+            if (startProps.value) {
+                endProps.hideDisabledOptions = true;
+                endProps.disabledHours = () => lodash_1.default.range(0, startProps.value.hour());
+                endProps.disabledMinutes = (selectedHour) => {
+                    if (selectedHour == startProps.value.hour()) {
+                        return lodash_1.default.range(0, startProps.value.minute());
+                    }
+                    return [];
+                };
+                endProps.disabledSeconds = (selectedHour, selectedMinute) => {
+                    if (selectedHour == startProps.value.hour() && selectedMinute == startProps.value.minute()) {
+                        return lodash_1.default.range(0, startProps.value.second());
+                    }
+                    return [];
+                };
+            }
+        }
+    }
+    return react_1.default.createElement(antd_1.Input.Group, null,
+        react_1.default.createElement(antd_1.TimePicker, Object.assign({ style: { width: '40%' } }, startProps, { 
+            // {...field.config}
+            format: format, onChange: time => {
+                if (time == null) {
+                    onChange({ [startField]: null, [endField]: (value && value[endField]) ? value[endField] : null });
+                }
+                else {
+                    onChange({ [startField]: time.format(format), [endField]: (value && value[endField]) ? value[endField] : null });
+                }
+            } })),
+        react_1.default.createElement(antd_1.Button, { ghost: true, disabled: true, style: { border: 'none' } }, "~"),
+        react_1.default.createElement(antd_1.TimePicker, Object.assign({ style: { width: '40%' } }, endProps, { format: format, onChange: time => {
+                if (time == null) {
+                    onChange({ [startField]: (value && value[startField]) ? value[startField] : null, [endField]: null });
+                }
+                else {
+                    onChange({ [startField]: (value && value[startField]) ? value[startField] : null, [endField]: time.format(format) });
+                }
+            } })));
+}, {
+    isMultiple: true,
+    render: (value, data, field) => {
+        const ptn = field.field.split(',');
+        if (ptn.length != 2)
+            return '';
+        const [startField, endField] = ptn;
+        if (data[startField] && data[endField]) {
+            return `${data[startField]} - ${data[endField]}`;
+        }
+        return '';
+    }
+});
 const AntdRangePick = (props) => {
     const { field, disabled, value, onChange } = props;
     let ptn = field.field.split(',');
@@ -381,8 +424,3 @@ const RangePickRender = (value, data, field, showTime) => {
     breakCol: true,
     isMultiple: true
 });
-// registerFormField('monthrange', (props: FormFieldProps) => <AntdRangePick  {...props} isDate={true} />, {
-//     render: (value, data, field) => RangePickRender(value, data, field, false),
-//     breakCol: true,
-//     isMultiple: true
-// });

package/package.json

@@ -1 +1 @@
-{"name":"vap1","version":"0.1.6","description":"vap1, Both support MicroService and SAP FrameWork, Support IE>9","main":"index.js","author":"Xiang da","license":"ISC"}
+{"name":"vap1","version":"0.1.7","description":"vap1, Both support MicroService and SAP FrameWork, Support IE>9","main":"index.js","author":"Xiang da","license":"ISC"}

package/utils/Global.d.ts

@@ -159,6 +159,10 @@ export type GlobalSetting = {
          * 表单大小 ，说明： 1.5 版本无效
         */
         SIZE: any;
+        /**
+         * 使用 Drawer 代替 Modal，暂不支持
+        */
+        USE_DRAWER: boolean;
         /**
          * UFormModal 点击弹框外蒙层区域时，允许自动关闭
          * 默认是 true

package/utils/Global.js

@@ -85,6 +85,7 @@ const DEFAULT = {
     },
     FORM: {
         SIZE: 'small',
+        USE_DRAWER: false,
         maskClosable: false,
         ILLEGAL_CHAR_VALIDATE: true,
         ILLEGAL_CHAR_REGEXP: /[\'"#$?：!！？%￥&^*]/im,