vap1 0.6.9 → 0.7.1

package/cems/index.d.ts

@@ -156,11 +156,14 @@ interface BuiltInAssetUtils {
     formatColumns: FormatColumns;
     formatCols: FormatCols;
 }
-import type { CheckIPRangeIntersect, CheckIpRange, CheckIpPort, Uuid, CompareVersion, ConvertObjectToArray, ConvertArrayToObject, UseDForm, ComponentLibraryType, RegisterComponent } from './policy/utils';
+import type { CheckIPRangeIntersect, CheckIpRange, CheckIpPort, Uuid, CompareVersion, ConvertObjectToArray, ConvertArrayToObject, UseDForm, ComponentLibraryType, CustomLibraryType, RegisterComponent, RegisterCustomComponent, CustomComponent } from './policy/utils';
+export type { CustomComponent };
 interface BuiltInPolicyUtils {
     useDForm: UseDForm;
     ComponentLibrary: ComponentLibraryType;
+    CustomLibrary: CustomLibraryType;
     registerComponent: RegisterComponent;
+    registerCustomComponent: RegisterCustomComponent;
     checkIPRangeIntersect: CheckIPRangeIntersect;
     checkIpRange: CheckIpRange;
     checkIpPort: CheckIpPort;
@@ -244,4 +247,6 @@ export declare const convertObjectToArray: ConvertObjectToArray;
 export declare const convertArrayToObject: ConvertArrayToObject;
 export declare const useDForm: UseDForm;
 export declare const ComponentLibrary: ComponentLibraryType;
+export declare const CustomLibrary: CustomLibraryType;
 export declare const registerComponent: RegisterComponent;
+export declare const registerCustomComponent: RegisterCustomComponent;

package/cems/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DRadio = exports.DLabel = exports.DInput = exports.DDynamicTreeSelect = exports.DDynamicSelect = exports.DDatePicker = exports.DColorPicker = exports.DCheckboxGroup = exports.DCheckbox = exports.DButton = exports.DApiTable = exports.DForm = exports.CForm = exports.formatCols = exports.formatColumns = exports.useDApiGlobal = exports.useDApi = exports.useDModals = exports.getReload = exports.AjaxPostData = exports.Patch = exports.DivWidth = exports.Sensitive = exports.DModalInfo = exports.DInfo = exports.DModalTable = exports.DTable = exports.CUpload = exports.ChartPie = exports.ChartBar = exports.ChartBase = exports.isOpenInCemsProject = exports.getUUIDFor16 = exports.getApiData = exports.callWhereWhileFunc = exports.regExpTest = exports.convertOptions = exports.initSchema = exports.rsa = exports.aes = exports.md5 = exports.validator = exports.getOrgFlagByTreeIconNum = exports.getTreeIconNumByOrgFlag = exports.CustomPagination = exports.AsyncSelect = exports.EasyuiTree = exports.CardTable = exports.UTILS = exports.COMPONENTS = void 0;
-exports.registerComponent = exports.ComponentLibrary = exports.useDForm = exports.convertArrayToObject = exports.convertObjectToArray = exports.compareVersion = exports.uuid = exports.checkIpPort = exports.checkIpRange = exports.checkIPRangeIntersect = exports.DDrawer = exports.DIcon = exports.DDiv = exports.DCol = exports.DUpload = exports.DTree = exports.DTimePicker = exports.DPTable = exports.DTab = exports.DSwitch = exports.DSlider = exports.DSelect = exports.DSCTable = void 0;
+exports.registerCustomComponent = exports.registerComponent = exports.CustomLibrary = exports.ComponentLibrary = exports.useDForm = exports.convertArrayToObject = exports.convertObjectToArray = exports.compareVersion = exports.uuid = exports.checkIpPort = exports.checkIpRange = exports.checkIPRangeIntersect = exports.DDrawer = exports.DIcon = exports.DDiv = exports.DCol = exports.DUpload = exports.DTree = exports.DTimePicker = exports.DPTable = exports.DTab = exports.DSwitch = exports.DSlider = exports.DSelect = exports.DSCTable = void 0;
 /**
  * 说明,如需要使用 `vap2/deps/cems`  请确保是 CEMS 应用/模块
 */
@@ -86,4 +86,6 @@ exports.convertObjectToArray = exports.UTILS['convertObjectToArray'];
 exports.convertArrayToObject = exports.UTILS['convertArrayToObject'];
 exports.useDForm = exports.UTILS['useDForm'];
 exports.ComponentLibrary = exports.UTILS['ComponentLibrary'];
+exports.CustomLibrary = exports.UTILS['CustomLibrary'];
 exports.registerComponent = exports.UTILS['registerComponent'];
+exports.registerCustomComponent = exports.UTILS['registerCustomComponent'];

package/cems/policy/utils.d.ts

@@ -1,6 +1,7 @@
 import type { ComponentType } from './types';
 import type { DFormContext, DFormContextProps } from './DForm';
 import type { PlainObject } from '../../basetype';
+import type { ForwardRefExoticComponent, RefAttributes } from 'react';
 export type ComponentLibraryType = Record<string, ComponentType>;
 export type RegisterComponent = (component: ComponentType) => void;
 export type CheckIPRangeIntersect = (start: string, end: string, start1?: string, end1?: string) => boolean;
@@ -11,3 +12,38 @@ export type CompareVersion = (policyUseVersion: string, newVersion: string) => b
 export type ConvertObjectToArray = (oJson: any, idAlias?: string) => Array<any>;
 export type ConvertArrayToObject = (aJson: any, idAlias?: string, reIndex?: boolean) => PlainObject;
 export type UseDForm = (props?: DFormContextProps) => DFormContext;
+type CustomComponentPorps = {
+    type?: string;
+    config: PlainObject;
+    data: PlainObject;
+    editMode?: boolean;
+    compareMode?: boolean;
+    useAgentType?: string;
+    [key: string]: any;
+};
+type CustomComponentRef = {
+    /**
+     * 返回 flase 验证失败
+     * 返回 对象 = 表单数据
+    */
+    submit: () => PlainObject | false;
+};
+export type CustomComponent = ForwardRefExoticComponent<CustomComponentPorps & RefAttributes<CustomComponentRef>>;
+/**
+ * 自定义组件的定义
+ */
+export type CustomType = {
+    type: string;
+    component: CustomComponent;
+};
+/**
+ * 自定义组件库定义
+ */
+export type CustomLibraryType = Record<string, CustomType>;
+/**
+ * 自定义组件库注册
+ * @param component
+ * @returns
+ */
+export type RegisterCustomComponent = (component: CustomType) => void;
+export {};

package/components/_adapt/ColorPicker.d.ts

@@ -1,34 +1,26 @@
-import type { FC, ReactNode, PropsWithChildren, CSSProperties } from 'react';
-import type { PopoverProps } from 'antd/es/popover';
+import type { FC, ReactNode, PropsWithChildren } from 'react';
+import type { PopoverProps } from './Popover';
 interface PresetsItem {
     label: ReactNode;
     colors: string[];
 }
 /**
- * 说明 1.5 版本
- *      仅支持 value/onChange/className/style 属性
- *      仅支持 hex 值，格式为 #ffffff 不支持其它任何格式
- *
- * 后续会支持 presets ，
- * 其它属性均不支持（升2.0后支持）
+ * 说明1.5版本仅支持HEX
 */
 type ColorFormat = 'hex';
 export type ColorPickerProps = {
-    value?: string;
-    defaultValue?: string;
-    placeholder?: string;
-    onChange?: (hex: string) => void;
-    style?: CSSProperties;
-    className?: string;
     allowClear?: boolean;
     arrow?: boolean;
     size?: 'large' | 'middle' | 'small';
     placement?: PopoverProps['placement'];
+    value?: string;
+    defaultValue?: string;
     defaultFormat?: ColorFormat;
     format?: ColorFormat;
     disabled?: boolean;
     disabledAlpha?: boolean;
     destroyTooltipOnHide?: boolean;
+    onChange?: (value: any, hex: string) => void;
     presets?: PresetsItem[];
     showText?: boolean;
 };

package/components/_adapt/ColorPicker.js

@@ -59,113 +59,90 @@ var __read = (this && this.__read) || function (o, n) {
     }
     return ar;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ColorPicker = void 0;
 var react_1 = __importStar(require("react"));
-var antd_1 = require("antd");
+var lodash_1 = __importDefault(require("lodash"));
+var Popover_1 = require("./Popover");
+var Icon_1 = require("./Icon");
 var react_color_1 = require("react-color");
 var hooks_1 = require("../../hooks");
-var ColorSelector = function (_a) {
-    var value = _a.value, onChange = _a.onChange;
-    return react_1.default.createElement(react_color_1.SketchPicker, { width: "256px", 
-        // presets={presets}
-        disableAlpha: true, color: value, onChange: function (val) { return onChange(val.hex); } });
-};
-var REG_COLOR = /^#[0-9A-Fa-f]{6}$/;
+var utils_1 = require("../../utils");
 var ColorPicker = function (props) {
-    var value = props.value, defaultValue = props.defaultValue, onChange = props.onChange, placeholder = props.placeholder, style = props.style, className = props.className;
-    var isFristMount = (0, hooks_1.useFirstMountState)();
     var _a = __read((0, hooks_1.useToggle)(), 2), open = _a[0], show = _a[1];
-    var _b = __read((0, react_1.useState)(function () {
-        if (value && REG_COLOR.test(value))
-            return value;
-        if (defaultValue && REG_COLOR.test(defaultValue))
-            return defaultValue;
-        return undefined;
-    }), 2), colorValue = _b[0], setColorValue = _b[1];
-    (0, react_1.useEffect)(function () {
-        if (isFristMount)
-            return;
-        if (typeof onChange != 'function')
-            return;
-        onChange(colorValue);
-    }, [colorValue]);
-    return react_1.default.createElement(antd_1.Popover, { arrowPointAtCenter: true, overlayClassName: 'v-color-picker', content: react_1.default.createElement(ColorSelector, { value: colorValue, onChange: setColorValue }), visible: open, onVisibleChange: function (open) {
-            if (!open)
-                show(false);
-        } },
-        react_1.default.createElement("span", { className: className, style: __assign({ cursor: 'pointer', display: 'flex', justifyContent: 'start', alignItems: 'center', gap: 6, color: colorValue, width: 108 }, style), onClick: show }, colorValue ? react_1.default.createElement(react_1.Fragment, null,
-            react_1.default.createElement("i", { style: { display: 'block', backgroundColor: colorValue, border: '1px solid #000', width: 12, height: 12, } }),
-            react_1.default.createElement("span", null, colorValue)) : (placeholder || '点击设置颜色')));
-    // const spanRef = useRef<HTMLSpanElement>()
-    // const [value, setValue] = useState(props.value || props.defaultValue);
-    // const content = useMemo(() => {
-    //     // if (props.children) return props.children;
-    //     return <Fragment><i style={{ backgroundColor: value }}></i> <strong>{(props.showText && value != null) ? <span>{value}</span> : Const.NONE}</strong></Fragment>
-    // }, [value]);
-    // const popoverProps = useMemo<PopoverProps>(() => {
-    //     const popoverProps: PopoverProps = {
-    //         placement: 'bottomLeft',
-    //         arrow: true,
-    //         overlayClassName: 'v-color-picker',
-    //         defaultOpen: false,
-    //         trigger: 'click',
-    //         getTooltipContainer: () => spanRef.current
-    //     }
-    //     if (_.has(props, 'placement')) popoverProps.placement = props.placement;
-    //     if (_.has(props, 'arrow')) popoverProps.arrow = props.arrow;
-    //     return popoverProps;
-    // }, [])
-    // const spanProps = useMemo<HTMLProps<HTMLSpanElement>>(() => {
-    //     const spanProps: HTMLProps<HTMLSpanElement> = { className: 'v-color-picker-brick', }
-    //     if (props.size) spanProps.className = spanProps.className + ' v-color-picker-brick-' + props.size;
-    //     return spanProps;
-    // }, [props.disabled, props.value]);
-    // const colorProps = useMemo<SketchPickerProps>(() => {
-    //     const colorProps: SketchPickerProps = {
-    //         disableAlpha: false,
-    //         onChangeComplete: (color, evt) => {
-    //             PageUtil.stopEvent(evt);
-    //             setValue(color.hex)
-    //             if (_.isFunction(props.onChange)) {
-    //                 props.onChange(color, color.hex)
-    //             }
-    //         }
-    //     };
-    //     if (props.presets) {
-    //         let colors = [];
-    //         props.presets.map(item => {
-    //             item.colors.map(color => colors.push(color))
-    //             // return {
-    //             //     color: item.colors,
-    //             //     title: item.label,
-    //             // }
-    //         })
-    //         colorProps.presetColors = colors;
-    //     }
-    //     if (props.disabledAlpha) colorProps.disableAlpha = true;
-    //     return colorProps;
-    // }, []);
-    // const clearColor = () => {
-    //     setValue(null);
-    //     props.onChange(null, null);
-    // }
-    // return <Fragment>
-    //     <span {...spanProps} ref={spanRef} onClick={evt => PageUtil.stopEvent(evt, show)}>
-    //         {content}
-    //         {value != null && props.allowClear && <Icon type='close' onClick={clearColor} />}
-    //     </span>
-    //     &nbsp;
-    //     <Popover
-    //         open={open}
-    //         {...popoverProps}
-    //         onOpenChange={(isOpen) => {
-    //             if (!isOpen) {
-    //                 show(false)
-    //             }
-    //         }}
-    //         content={<SketchPicker {...colorProps} color={value} />}>
-    //     </Popover>
-    // </Fragment>
+    var spanRef = (0, react_1.useRef)();
+    var _b = __read((0, react_1.useState)(props.value || props.defaultValue), 2), value = _b[0], setValue = _b[1];
+    var content = (0, react_1.useMemo)(function () {
+        if (props.children)
+            return props.children;
+        return react_1.default.createElement(react_1.Fragment, null,
+            react_1.default.createElement("i", { style: { backgroundColor: value } }),
+            " ",
+            react_1.default.createElement("strong", null, (props.showText && value != null) ? react_1.default.createElement("span", null, value) : utils_1.Const.NONE));
+    }, [value]);
+    var popoverProps = (0, react_1.useMemo)(function () {
+        var popoverProps = {
+            placement: 'bottomLeft',
+            arrow: true,
+            overlayClassName: 'v-color-picker',
+            defaultOpen: false,
+            trigger: 'click',
+            getTooltipContainer: function () { return spanRef.current; }
+        };
+        if (lodash_1.default.has(props, 'placement'))
+            popoverProps.placement = props.placement;
+        if (lodash_1.default.has(props, 'arrow'))
+            popoverProps.arrow = props.arrow;
+        return popoverProps;
+    }, []);
+    var spanProps = (0, react_1.useMemo)(function () {
+        var spanProps = { className: 'v-color-picker-brick', };
+        if (props.size)
+            spanProps.className = spanProps.className + ' v-color-picker-brick-' + props.size;
+        return spanProps;
+    }, [props.disabled, props.value]);
+    var colorProps = (0, react_1.useMemo)(function () {
+        var colorProps = {
+            disableAlpha: false,
+            onChangeComplete: function (color, evt) {
+                utils_1.PageUtil.stopEvent(evt);
+                setValue(color.hex);
+                if (lodash_1.default.isFunction(props.onChange)) {
+                    props.onChange(color, color.hex);
+                }
+            }
+        };
+        if (props.presets) {
+            var colors_1 = [];
+            props.presets.map(function (item) {
+                item.colors.map(function (color) { return colors_1.push(color); });
+                // return {
+                //     color: item.colors,
+                //     title: item.label,
+                // }
+            });
+            colorProps.presetColors = colors_1;
+        }
+        if (props.disabledAlpha)
+            colorProps.disableAlpha = true;
+        return colorProps;
+    }, []);
+    var clearColor = function () {
+        setValue(null);
+        props.onChange(null, null);
+    };
+    return react_1.default.createElement(react_1.Fragment, null,
+        react_1.default.createElement("span", __assign({}, spanProps, { ref: spanRef, onClick: function (evt) { return utils_1.PageUtil.stopEvent(evt, show); } }),
+            content,
+            value != null && props.allowClear && react_1.default.createElement(Icon_1.Icon, { type: 'close', onClick: clearColor })),
+        "\u00A0",
+        react_1.default.createElement(Popover_1.Popover, __assign({ open: open }, popoverProps, { onOpenChange: function (isOpen) {
+                if (!isOpen) {
+                    show(false);
+                }
+            }, content: react_1.default.createElement(react_color_1.SketchPicker, __assign({}, colorProps, { color: value })) })));
 };
 exports.ColorPicker = ColorPicker;

package/package.json

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