icarys-fc-vant 1.0.15 → 1.0.17

package/src/core/src/handler/index.js

@@ -0,0 +1,143 @@
+import Api from '../frame/api';
+import Render from '../render';
+import extend from '../../../utils/lib/extend';
+import {funcProxy, invoke} from '../frame/util';
+import useInject from './inject';
+import usePage from './page';
+import useRender from './render';
+import useLoader from './loader';
+import useInput from './input';
+import useContext from './context';
+import useLifecycle from './lifecycle';
+import useEffect from './effect';
+import {reactive} from 'vue';
+import is from '../../../utils/lib/type';
+import {deepCopy} from '../../../utils/lib/deepextend';
+
+
+export default function Handler(fc) {
+    funcProxy(this, {
+        options() {
+            return fc.options.value || {};
+        },
+        bus() {
+            return fc.bus;
+        },
+        preview() {
+            if (fc.vm.props.preview != null) {
+                return fc.vm.props.preview;
+            } else if (fc.vm.setupState.parent && fc.vm.setupState.parent.props.preview != null) {
+                return fc.vm.setupState.parent.props.preview;
+            }
+            return fc.options.value.preview || false;
+        }
+    })
+    extend(this, {
+        fc,
+        vm: fc.vm,
+        watching: false,
+        loading: false,
+        reloading: false,
+        noWatchFn: null,
+        deferSyncFn: null,
+        isMounted: false,
+        formData: reactive({}),
+        subRuleData: reactive({}),
+        subForm: {},
+        form: reactive({}),
+        appendData: {},
+        ignoreFields: [],
+        providers: {},
+        cycleLoad: null,
+        loadedId: 1,
+        nextTick: null,
+        changeStatus: false,
+        pageEnd: true,
+        nextReload: () => {
+            this.lifecycle('reload');
+        }
+    });
+
+    this.initData(fc.rules);
+
+    this.$manager = new fc.manager(this);
+    this.$render = new Render(this);
+    this.api = fc.extendApiFn.reduce((api, fn) => {
+        const extendApi = invoke(() => fn(api, this));
+        if (extendApi && extendApi !== api) {
+            extend(api, extendApi);
+        }
+        return api;
+    }, Api(this));
+}
+
+extend(Handler.prototype, {
+    initData(rules) {
+        extend(this, {
+            ctxs: {},
+            fieldCtx: {},
+            nameCtx: {},
+            sort: [],
+            rules,
+        });
+    },
+    init() {
+        this.updateAppendData();
+        this.useProvider();
+        this.usePage();
+        this.loadRule();
+        this.$manager.__init();
+        this.lifecycle('created');
+    },
+    updateAppendData() {
+        this.appendData = {...deepCopy(this.options.formData || {}), ...(this.fc.vm.props.modelValue || {}), ...this.appendData};
+    },
+    isBreakWatch() {
+        return this.loading || this.noWatchFn || this.reloading;
+    },
+    globalBeforeFetch(opt) {
+        return new Promise((resolve, reject) => {
+            const source = this.options.beforeFetch && invoke(() => this.options.beforeFetch(opt, {api: this.api}));
+            if (source && is.Function(source.then)) {
+                source.then(resolve).catch(reject);
+            } else {
+                resolve();
+            }
+        });
+    },
+    beforeFetch(opt) {
+        return new Promise((resolve, reject) => {
+            const res = opt && opt.beforeFetch && invoke(() => opt.beforeFetch(opt, {api: this.api}));
+            if (res && is.Function(res.then)) {
+                res.then(resolve).catch(reject);
+            } else if (res === false) {
+                reject();
+            } else {
+                resolve();
+            }
+        }).then(() => {
+            return this.globalBeforeFetch(opt);
+        });
+    },
+    beforeSubmit(formData) {
+        return new Promise((resolve, reject) => {
+            const res = this.options.beforeSubmit && invoke(() => this.options.beforeSubmit(formData, {api: this.api}));
+            if (res && is.Function(res.then)) {
+                res.then(resolve).catch(reject);
+            } else if (res === false) {
+                reject();
+            } else {
+                resolve();
+            }
+        });
+    }
+})
+
+useInject(Handler);
+usePage(Handler);
+useRender(Handler);
+useLoader(Handler);
+useInput(Handler);
+useContext(Handler);
+useLifecycle(Handler);
+useEffect(Handler);

package/src/core/src/handler/inject.js

@@ -0,0 +1,199 @@
+import extend from '../../../utils/lib/extend';
+import is, {hasProperty} from '../../../utils/lib/type';
+import toLine from '../../../utils/lib/toline';
+import {deepGet, extractVar, invoke, parseFn, parseTemplateToTree} from '../frame/util';
+import toCase from '../../../utils/lib/tocase';
+
+
+export default function useInject(Handler) {
+    extend(Handler.prototype, {
+        parseInjectEvent(rule, on) {
+            const inject = rule.inject || this.options.injectEvent;
+            return this.parseEventLst(rule, on, inject);
+        },
+        parseEventLst(rule, data, inject, deep) {
+            Object.keys(data).forEach(k => {
+                const fn = this.parseEvent(rule, data[k], inject, deep);
+                if (fn) {
+                    data[k] = fn;
+                }
+            });
+            return data;
+        },
+        parseEvent(rule, fn, inject, deep) {
+            if (is.Function(fn) && ((inject !== false && !is.Undef(inject)) || fn.__inject)) {
+                return this.inject(rule, fn, inject)
+            } else if (!deep && Array.isArray(fn) && fn[0] && (is.String(fn[0]) || is.Function(fn[0]))) {
+                return this.parseEventLst(rule, fn, inject, true);
+            } else if (is.String(fn)) {
+                const val = parseFn(fn);
+                if (val && fn !== val) {
+                    return val.__inject ? this.parseEvent(rule, val, inject, true) : val;
+                }
+            }
+        },
+        parseEmit(ctx) {
+            let event = {}, rule = ctx.rule, {emitPrefix, field, name, inject} = rule;
+            let emit = rule.emit || [];
+            if (is.trueArray(emit)) {
+                emit.forEach(eventName => {
+                    if (!eventName) return;
+                    let eventInject;
+                    let emitKey = emitPrefix || field || name;
+                    if (is.Object(eventName)) {
+                        eventInject = eventName.inject;
+                        eventName = eventName.name;
+                        emitKey = eventName.prefix || emitKey;
+                    }
+                    if (emitKey) {
+                        const fieldKey = toLine(`${emitKey}-${eventName}`);
+                        const fn = (...arg) => {
+                            if (this.vm.emitsOptions && !this.vm.emitsOptions[fieldKey]) {
+                                this.vm.emitsOptions[fieldKey] = null;
+                            }
+                            this.vm.emit(fieldKey, ...arg);
+                            this.vm.emit('emit-event', fieldKey, ...arg);
+                            this.bus.$emit(fieldKey, ...arg);
+                        };
+                        fn.__emit = true;
+
+                        if (!eventInject && inject === false) {
+                            event[toCase(eventName)] = fn;
+                        } else {
+                            let _inject = eventInject || inject || this.options.injectEvent;
+                            event[toCase(eventName)] = is.Undef(_inject) ? fn : this.inject(rule, fn, _inject);
+                        }
+                    }
+
+                });
+            }
+            ctx.computed.on = event;
+            return event;
+        },
+        getInjectData(self, inject) {
+            const $api = self.__fc__ && self.__fc__.$api;
+            const vm = (self.__fc__ && self.__fc__.$handle.vm) || this.vm;
+            const {option, rule} = vm.props;
+            return {
+                $f: $api || this.api,
+                api: $api || this.api,
+                rule,
+                self: self.__origin__,
+                option,
+                inject
+            };
+        },
+        inject(self, _fn, inject) {
+            if (_fn.__origin) {
+                if (this.watching && !this.loading)
+                    return _fn;
+                _fn = _fn.__origin;
+            }
+
+            const h = this;
+
+            const fn = function (...args) {
+                const data = h.getInjectData(self, inject);
+                data.args = [...args];
+                args.unshift(data);
+                return _fn.apply(this, args);
+            };
+            fn.__origin = _fn;
+            fn.__json = _fn.__json;
+            return fn;
+        },
+        loadStrVar(str, get, group) {
+            if (str && typeof str === 'string' && str.indexOf('{{') > -1 && str.indexOf('}}') > -1) {
+                const tmp = str;
+                const vars = extractVar(str);
+
+                const getValue = (field) => {
+                    let flag = false;
+                    let val;
+                    if (group && field.indexOf('$form.') === 0) {
+                        const _split = field.split('.');
+                        _split.shift();
+                        if (hasProperty(group.value, _split[0])) {
+                            flag = true;
+                            val = get ? get({
+                                id: '$form.' + _split[0] + '_' + group.rule.__fc__.id,
+                                getValue: () => {
+                                    return deepGet(group.value, _split);
+                                }
+                            }) : deepGet(group.value, _split);
+                        }
+                    }
+                    if (!flag) {
+                        val = get ? get(field) : this.fc.getLoadData(field)
+                    }
+                    return val;
+                }
+
+                const treeToVal = (tree) => {
+                    const fields = [];
+                    tree.forEach(item => {
+                        if (item.key) {
+                            fields.push(item.key);
+                        } else if (item.children) {
+                            fields.push(treeToVal(item.children));
+                        }
+                    })
+                    let flag = false;
+                    fields.forEach((field, idx) => {
+                        if (field != null && (field.indexOf('\'') === 0 || field.indexOf('"') === 0)) {
+                            fields[idx] = field.slice(1, -1)
+                            flag = true;
+                        }
+                    })
+                    if (fields.length === 1 && (flag || !isNaN(Number(fields[0])))) {
+                        return fields[0];
+                    }
+                    return getValue(fields.join('.'));
+                }
+
+                let lastVal;
+                vars.forEach(v => {
+                    const split = v.split('||');
+                    const field = split[0].trim();
+                    if (field) {
+                        const def = (split[1] || '').trim();
+                        const tree = parseTemplateToTree(field);
+                        let val = invoke(() => treeToVal(tree));
+                        if ((val == null || val === '') && split.length > 1) {
+                            val = def;
+                        }
+                        lastVal = val;
+                        str = str.replaceAll(`{{${v}}}`, val == null ? '' : val);
+                    }
+                })
+                if (vars.length === 1 && tmp === `{{${vars[0]}}}`) {
+                    return lastVal;
+                }
+            }
+            return str;
+        },
+        loadFetchVar(options, get, rule) {
+            let group;
+            if (rule && rule.__fc__) {
+                group = rule.__fc__.getParentGroup();
+            }
+            const loadVal = str => {
+                return this.loadStrVar(str, get, group ? {rule, value: (this.subRuleData[group.id] || {})} : null);
+            }
+
+            options.action = loadVal(options.action || '');
+
+            ['headers', 'data', 'query'].forEach(key => {
+                if (options[key]) {
+                    const data = Array.isArray(options[key]) ? [] : {};
+                    Object.keys(options[key]).forEach(k => {
+                        data[loadVal(k)] = loadVal(options[key][k]);
+                    });
+                    options[key] = data;
+                }
+            });
+
+            return options;
+        }
+    })
+}

package/src/core/src/handler/input.js

@@ -0,0 +1,199 @@
+import extend from '../../../utils/lib/extend';
+import {$set} from '../../../utils/lib/modify';
+import is, {hasProperty} from '../../../utils/lib/type';
+import {invoke} from '../frame/util';
+import {nextTick, reactive, toRef} from 'vue';
+
+export default function useInput(Handler) {
+    extend(Handler.prototype, {
+        setValue(ctx, value, formValue, setFlag) {
+            if (ctx.deleted) return;
+            ctx.rule.value = value;
+            this.changeStatus = true;
+            this.nextRefresh();
+            this.$render.clearCache(ctx);
+            this.setFormData(ctx, formValue);
+            this.syncValue();
+            this.valueChange(ctx, value);
+            this.vm.emit('change', ctx.field, value, ctx.origin, this.api, setFlag || false);
+            this.effect(ctx, 'value');
+            this.targetHook(ctx, 'value', {value});
+            this.emitEvent('change', ctx.field, value, {
+                rule: ctx.origin,
+                api: this.api,
+                setFlag: setFlag || false
+            })
+            if (setFlag) {
+                nextTick(() => {
+                    nextTick(() => {
+                        nextTick(() => {
+                            this.api.clearValidateState(ctx.id);
+                        });
+                    });
+                });
+            }
+            this.$manager.fieldChange(ctx, value, formValue, setFlag);
+        },
+        onInput(ctx, value) {
+            let val;
+            if (ctx.input && (this.isQuote(ctx, val = ctx.parser.toValue(value, ctx)) || this.isChange(ctx, value))) {
+                this.setValue(ctx, val, value);
+            }
+        },
+        onUpdateValue(ctx, data) {
+            this.deferSyncValue(() => {
+                const group = ctx.getParentGroup();
+                const subForm = group ? this.subRuleData[group.id] : null;
+                const subData = {};
+                Object.keys(data || {}).forEach(k => {
+                    if (subForm && hasProperty(subForm, k)) {
+                        subData[k] = data[k];
+                    } else if (hasProperty(this.api.form, k)) {
+                        this.api.form[k] = data[k];
+                    } else if (this.api.top !== this.api && hasProperty(this.api.top.form, k)) {
+                        this.api.top.form[k] = data[k];
+                    }
+                });
+                if (Object.keys(subData).length) {
+                    this.api.setChildrenFormData(group.rule, subData);
+                }
+            })
+        },
+        onBaseInput(ctx, value) {
+            this.setFormData(ctx, value);
+            ctx.modelValue = value;
+            this.nextRefresh();
+            this.$render.clearCache(ctx);
+        },
+        setFormData(ctx, value) {
+            ctx.modelValue = value;
+            const group = ctx.getParentGroup();
+            if (group) {
+                if (!this.subRuleData[group.id]) {
+                    this.subRuleData[group.id] = {};
+                }
+                this.subRuleData[group.id][ctx.field] = ctx.rule.value;
+            }
+            $set(this.formData, ctx.id, value);
+        },
+        rmSubRuleData(ctx) {
+            const group = ctx.getParentGroup();
+            if (group && this.subRuleData[group.id]) {
+                delete this.subRuleData[group.id][ctx.field];
+            }
+        },
+        getFormData(ctx) {
+            return this.formData[ctx.id];
+        },
+        syncForm() {
+            const data = reactive({});
+            const fields = this.fields();
+            const ignoreFields = [];
+            if (this.options.appendValue !== false) {
+                Object.keys(this.appendData).reduce((initial, field) => {
+                    if (fields.indexOf(field) === -1) {
+                        initial[field] = toRef(this.appendData, field);
+                    }
+                    return initial;
+                }, data);
+            }
+            fields.reduce((initial, field) => {
+                let ctx = (this.fieldCtx[field] || []).filter(ctx => !this.isIgnore(ctx))[0];
+                if (!ctx) {
+                    ctx = this.fieldCtx[field][0];
+                    ignoreFields.push(field);
+                }
+                initial[field] = toRef(ctx.rule, 'value');
+                return initial;
+            }, data);
+            this.form = data;
+            this.ignoreFields = ignoreFields;
+            this.syncValue();
+        },
+        isIgnore(ctx) {
+            return ctx.rule.ignore === true || ((ctx.rule.ignore === 'hidden' || this.options.ignoreHiddenFields) && ctx.hasHidden());
+        },
+        appendValue(rule) {
+            if ((!rule.field || !hasProperty(this.appendData, rule.field)) && (!is.Undef(rule.value) || !this.options.forceCoverValue)) {
+                return;
+            }
+            rule.value = this.appendData[rule.field];
+            delete this.appendData[rule.field];
+        },
+        addSubForm(ctx, subForm) {
+            this.subForm[ctx.id] = subForm;
+        },
+        deferSyncValue(fn, sync) {
+            if (!this.deferSyncFn) {
+                this.deferSyncFn = fn;
+            }
+            if (!this.deferSyncFn.sync) {
+                this.deferSyncFn.sync = sync;
+            }
+            invoke(fn);
+            if (this.deferSyncFn === fn) {
+                this.deferSyncFn = null;
+                if (fn.sync) {
+                    this.syncForm();
+                }
+            }
+        },
+        syncValue() {
+            if (this.deferSyncFn) {
+                return this.deferSyncFn.sync = true;
+            }
+            const data = {};
+            Object.keys(this.form).forEach(k => {
+                if (this.ignoreFields.indexOf(k) === -1) {
+                    data[k] = this.form[k];
+                }
+            });
+            this.vm.setupState.updateValue(data);
+        },
+        isChange(ctx, value) {
+            return JSON.stringify(this.getFormData(ctx), strFn) !== JSON.stringify(value, strFn);
+        },
+        isQuote(ctx, value) {
+            return (value instanceof Function || is.Object(value) || Array.isArray(value)) && value === ctx.rule.value;
+        },
+        refreshUpdate(ctx, val, origin, field) {
+            if (is.Function(ctx.rule.update)) {
+                const state = invoke(() => ctx.rule.update(val, ctx.origin, this.api, {
+                    origin: origin || 'change',
+                    linkField: field
+                }));
+                if (state === undefined) return;
+                ctx.rule.hidden = state === true;
+            }
+        },
+        valueChange(ctx, val) {
+            this.refreshRule(ctx, val);
+            this.bus.$emit('change-' + ctx.field, val);
+        },
+        refreshRule(ctx, val, origin, field) {
+            if (this.refreshControl(ctx)) {
+                this.$render.clearCacheAll();
+                this.loadRule();
+                this.bus.$emit('update', this.api);
+                this.refresh();
+            }
+            this.refreshUpdate(ctx, val, origin, field);
+        },
+        appendLink(ctx) {
+            const link = ctx.rule.link;
+            is.trueArray(link) && link.forEach(field => {
+                const fn = () => this.refreshRule(ctx, ctx.rule.value, 'link', field);
+
+                this.bus.$on('change-' + field, fn);
+                ctx.linkOn.push(() => this.bus.$off('change-' + field, fn));
+            });
+        },
+        fields() {
+            return Object.keys(this.fieldCtx);
+        },
+    });
+}
+
+function strFn(key, val) {
+    return typeof val === 'function' ? '' + val : val;
+}

package/src/core/src/handler/lifecycle.js

@@ -0,0 +1,55 @@
+import extend from '../../../utils/lib/extend';
+import is from '../../../utils/lib/type';
+import {invoke, parseFn} from '../frame/util';
+import toCase from '../../../utils/lib/tocase';
+import {upper} from '../../../utils/lib/toline';
+
+
+export default function useLifecycle(Handler) {
+    extend(Handler.prototype, {
+        mounted() {
+            const _mounted = () => {
+                this.isMounted = true;
+                this.lifecycle('mounted');
+            }
+            if (this.pageEnd) {
+                _mounted();
+            } else {
+                this.bus.$once('page-end', _mounted);
+            }
+        },
+        lifecycle(name) {
+            this.fc.targetFormDriver(name, this.api, this.fc);
+            this.vm.emit(name, this.api);
+            this.emitEvent(name, this.api);
+        },
+        emitEvent(name, ...args) {
+            const _fn = this.options[name] || this.options[toCase('on-' + name)];
+            if (_fn) {
+                const fn = parseFn(_fn);
+                is.Function(fn) && invoke(() => fn(...args));
+            }
+            this.bus.$emit(name, ...args);
+        },
+        targetHook(ctx, name, args) {
+            let hook = ctx.prop?.hook?.[name];
+
+            let run = (on, p) => {
+                if (on) {
+                    on = Array.isArray(on) ? on : [on];
+                    on.forEach(fn => {
+                        invoke(() => fn({args: Object.values(args || {}), ...args || {}, self: ctx.rule, rule: ctx.rule, parent: p?.rule, $f: this.api, api: this.api, option: this.vm.props.option}));
+                    });
+                }
+            }
+            run(hook);
+            let deepName = 'deep' + upper(name);
+            let parent = ctx.parent;
+            while (parent) {
+                let deepHook = parent.prop?.hook?.[deepName];
+                run(deepHook, parent);
+                parent = parent.parent;
+            }
+        }
+    })
+}