vap1 0.6.7 → 0.6.9

package/components/Tables/VTable.js

@@ -248,7 +248,7 @@ var VTableRoot = (0, react_1.forwardRef)(function (props, ref) {
         };
     }, [selectedRowKeys, param]);
     var boxBaseProps = (0, react_1.useMemo)(function () {
-        var boxProps = lodash_1.default.pick(props, ['selectBar', 'style', 'className', 'default', 'mode']);
+        var boxProps = lodash_1.default.pick(props, ['selectBar', 'style', 'className', 'default', 'defaultParam', 'mode']);
         if (props.actionBar) {
             if (lodash_1.default.isArray(props.actionBar)) {
                 if (props.actionBar.length) {

package/components/_adapt/ColorPicker.d.ts

@@ -1,26 +1,34 @@
-import type { FC, ReactNode, PropsWithChildren } from 'react';
-import type { PopoverProps } from './Popover';
+import type { FC, ReactNode, PropsWithChildren, CSSProperties } from 'react';
+import type { PopoverProps } from 'antd/es/popover';
 interface PresetsItem {
     label: ReactNode;
     colors: string[];
 }
 /**
- * 说明1.5版本仅支持HEX
+ * 说明 1.5 版本
+ *      仅支持 value/onChange/className/style 属性
+ *      仅支持 hex 值，格式为 #ffffff 不支持其它任何格式
+ *
+ * 后续会支持 presets ，
+ * 其它属性均不支持（升2.0后支持）
 */
 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,90 +59,113 @@ 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 lodash_1 = __importDefault(require("lodash"));
-var Popover_1 = require("./Popover");
-var Icon_1 = require("./Icon");
+var antd_1 = require("antd");
 var react_color_1 = require("react-color");
 var hooks_1 = require("../../hooks");
-var utils_1 = require("../../utils");
+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 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 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 })) })));
+    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>
 };
 exports.ColorPicker = ColorPicker;

package/deps/editor/tools/_TxtButton.js

@@ -217,7 +217,7 @@ var Color = function (_a) {
         style.color = value;
         style.fontWeight = 'bold';
     }
-    return react_1.default.createElement(index_1.ColorPicker, __assign({}, colorProps, { disabled: isDisabled, value: value, onChange: function (val, hex) { return setValue(editor, cmd, hex); } }),
+    return react_1.default.createElement(index_1.ColorPicker, __assign({}, colorProps, { disabled: isDisabled, value: value, onChange: function (hex) { return setValue(editor, cmd, hex); } }),
         react_1.default.createElement("span", { className: clazz.join(' '), style: style }));
 };
 exports.Color = Color;
@@ -235,7 +235,7 @@ var BgColor = function (_a) {
     if (value) {
         style.backgroundColor = value;
     }
-    return react_1.default.createElement(index_1.ColorPicker, __assign({}, colorProps, { disabled: isDisabled, value: value, onChange: function (val, hex) { return setValue(editor, cmd, hex); } }),
+    return react_1.default.createElement(index_1.ColorPicker, __assign({}, colorProps, { disabled: isDisabled, value: value, onChange: function (hex) { return setValue(editor, cmd, hex); } }),
         react_1.default.createElement("span", { className: clazz.join(' '), style: style }));
 };
 exports.BgColor = BgColor;

package/package.json

@@ -1 +1 @@
-{"name":"vap1","version":"0.6.7","description":"vap1, Both support MicroService and SAP FrameWork, Support IE>9","main":"index.js","author":"Xiang da","license":"ISC"}
+{"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"}

package/utils/VAP.d.ts

@@ -1,3 +1,4 @@
+type VapLoadFn = () => void;
 /**
  * VAP 是系统配置工具类，用于读取 xxx_conf 表的配置
 */
@@ -32,11 +33,15 @@ export type VAP = {
      * 获取浮点数配置
     */
     getFloat: (key: string, defaultValue?: number) => number;
+    /**
+     * 初始化后调用方式
+    */
+    ready: (fn: VapLoadFn) => void;
 };
 declare const _VAP: VAP;
 export declare const _SET: (key: string, text: string) => void;
 /**
  * 初始化，仅在入口脚本里面使用
 */
-export declare const _INIT: (confs: Record<string, string>[]) => void[];
+export declare const _INIT: (confs: Record<string, string>[]) => void;
 export default _VAP;

package/utils/VAP.js

@@ -45,8 +45,18 @@ var _Support_1 = require("./_Support");
 var Ajax_1 = require("./Ajax");
 var Global_1 = require("./Global");
 var StringUtil_1 = require("./StringUtil");
+var _VAP_LOAD_FN = (0, _Support_1.globalDefault)('_VAP_LOAD_FN', { loaded: false, fns: [] });
 var defaultVAP = function () {
     return {
+        // loaded:false,
+        ready: function (fn) {
+            if (_VAP_LOAD_FN.loaded) {
+                fn();
+            }
+            else {
+                _VAP_LOAD_FN.fns.push(fn);
+            }
+        },
         KEYMAP: new Map(),
         system_version: '',
         has: function (key) { return _VAP.KEYMAP.has(key); },
@@ -96,13 +106,23 @@ exports._SET = _SET;
 /**
  * 初始化，仅在入口脚本里面使用
 */
-var _INIT = function (confs) { return (confs || []).map(function (item) {
-    var value = lodash_1.default.trim(item.confValue);
-    if (value)
-        _VAP.KEYMAP.set(item.confId, value);
-    if (item.confId == 'system_version') {
-        _VAP.system_version = value;
+var _INIT = function (confs) {
+    (confs || []).map(function (item) {
+        var value = lodash_1.default.trim(item.confValue);
+        if (value)
+            _VAP.KEYMAP.set(item.confId, value);
+        if (item.confId == 'system_version') {
+            _VAP.system_version = value;
+        }
+    });
+    _VAP_LOAD_FN.loaded = true;
+    // console.log('load', _VAP_LOAD_FN.fns)
+    while (_VAP_LOAD_FN.fns.length > 0) {
+        var fn = _VAP_LOAD_FN.fns.shift();
+        if (typeof fn == 'function') {
+            fn();
+        }
     }
-}); };
+};
 exports._INIT = _INIT;
 exports.default = _VAP;