sun-form-v3 1.0.70 → 1.0.72

package/src/designer.js

@@ -1,342 +0,0 @@
-import XEUtils from "xe-utils"
-import Http from './http'
-import {
-    ElNotification
-} from 'element-plus'
-import {
-    reactive,
-    ref,
-    watch
-} from 'vue'
-/**
- * 设计器类，用于管理组件配置和交互
- * @class Designer
- * @param {Object} options 初始化选项，包含组件配置
- */
-class Designer {
-    constructor({
-        widgetConfig,
-        showMode = false
-    }) {
-        /**
-         * 渲染器模式
-         */
-        this.showMode = ref(showMode)
-        /**
-         * 反向响应式的组件配置对象
-         */
-        this.widgetConfig = reactive(widgetConfig);
-        /**
-         * XEUtils 工具库实例
-         */
-        this.$utils = XEUtils;
-        /**
-         * 组件映射表，用于快速查找组件
-         */
-        this.widgetMap = new Map();
-        /**
-         * Vue 实例映射表，用于快速查找 Vue 实例
-         */
-        this.vueInstanceMap = new Map();
-        /**
-         * 组件ID列表
-         */
-        this.widgetIds = [];
-        /**
-         * 当前选中的组件引用
-         */
-        this.chosenWidget = ref(null);
-        /**
-         * 操作历史列表
-         */
-        this.historyList = [];
-        /**
-         * 操作历史索引
-         */
-        this.historyIndex = ref(0);
-        /**
-         * 标记是否在操作历史中
-         */
-        this.isHistory = false;
-        /**
-         * Http服务实例，用于发起请求
-         */
-        this.$http = new Http({
-            baseUrl: "/api"
-        });
-        /**
-         * 根据组件配置构建组件映射表
-         */
-        this.buildWidgetMap(this.widgetConfig);
-        /**
-         * 监听组件配置的变化，重建组件映射表，并更新选中组件
-         */
-        watch(() => this.widgetConfig, (val) => {
-            this.rebuildWidgetMap();
-            this.chosenWidget.value = this.getWidgetById(this.widgetConfig.chosenId);
-        }, {
-            deep: true,
-            immediate: true
-        });
-        /**
-         * 监听组件列表的变化，记录操作历史
-         */
-        watch(() => this.widgetConfig.widgetList, (val) => {
-            if (!this.isHistory) {
-                this.historyList.push({
-                    widgetConfig: this.$utils.clone(this.widgetConfig, true),
-                    time: this.$utils.toDateString(new Date(), 'HH:mm:ss'),
-                    index: this.historyList.length
-                });
-                this.historyIndex.value = this.historyList.length - 1;
-            } else {
-                this.isHistory = false;
-            }
-        }, {
-            deep: true,
-            immediate: true
-        });
-    }
-    eventHandle({
-        value = null,
-        eventType,
-        widget,
-        tableItemData
-    }) {
-        if (!this.showMode) return;
-        if (widget.props[eventType]) {
-            let funcstr = widget.props[eventType]
-            let func = new Function('value', 'widget','self','app', funcstr);
-            func(value, widget, this.getVueInstance(widget.id), this)
-        }
-    }
-    /**
-     * 设置vue实例
-     */
-    setVueIncetance(id, vueInstance) {
-        this.vueInstanceMap.set(id, vueInstance);
-    }
-    /**
-     * 获取vue实例
-     */
-    getVueInstance(id) {
-        return this.vueInstanceMap.get(id);
-    }
-    /**
-     * 设置当前选中的组件
-     * @param {Object} chosenWidget 选中的组件对象
-     */
-    setChosenWidget(chosenWidget) {
-        this.chosenWidget.value = chosenWidget;
-    }
-    /**
-     * 根据组件的apiSet配置发起请求
-     * @param {Object} widget 当前组件对象
-     */
-    requestByApisetConfig(widget) {
-        let apiSet = widget.props.apiSet;
-        if (!apiSet || !apiSet.apiurl) {
-            return;
-        }
-        let params = {};
-        let headers = {};
-        let method = apiSet.method;
-        if (apiSet.contentType == "FormData") {
-            if (method == "post" || method == "put" || method == "patch") {
-                method += "FormData";
-            }
-        }
-        if (apiSet.params.length) {
-            apiSet.params.forEach(e => {
-                params[e.label] = e.value;
-            });
-        }
-        if (apiSet.headers.length) {
-            apiSet.headers.forEach(e => {
-                headers[e.label] = e.value;
-            });
-        }
-        if (apiSet.paramsFormat) {
-            let fun = new Function("params", "widget", "app", apiSet.paramsFormat);
-            let paramData = this.$utils.clone(params, true);
-            var funcData = fun(paramData, widget, this);
-            if (funcData && typeof this.$utils.isPlainObject(funcData)) {
-                params = funcData;
-            }
-        }
-        if (apiSet.headersFormat) {
-            let fun = new Function("headers", "widget", "app", apiSet.headersFormat);
-            let headerData = this.$utils.clone(headers, true);
-            var funcData = fun(headerData, widget, this);
-            if (funcData && typeof this.$utils.isPlainObject(funcData)) {
-                headers = funcData;
-            }
-        }
-        this.$http[method](apiSet.apiurl, params, headers)
-            .then(res => {
-                if (apiSet.successFormat) {
-                    let fun = new Function("res", "widget", "app", apiSet.successFormat);
-                    fun(res, widget, this);
-                }
-            })
-            .catch(err => {
-                if (apiSet.errorFormat) {
-                    let fun = new Function("error", "widget", "app", apiSet.errorFormat);
-                    fun(err, widget, this);
-                }
-            });
-    }
-    /**
-     * 根据ID获取组件
-     * @param {String} id 组件ID
-     * @returns {Object|null} 组件对象或null（如果未找到）
-     */
-    getWidgetById(id) {
-        return this.widgetMap.get(id);
-    }
-    /**
-     * 根据历史索引更新组件配置
-     * @param {Object} updates 更新的对象
-     */
-    updateByHistory(updates) {
-        this.isHistory = true;
-        this.$utils.destructuring(this.widgetConfig, updates);
-    }
-    /**
-     * 更新组件的属性
-     * @param {String} id 组件ID
-     * @param {Object} updates 更新的对象
-     * @param {Boolean} force 是否强制更新，即使存在相同的ID
-     */
-    updateWidget(id, updates, force) {
-        const widget = this.getWidgetById(id);
-        if (widget) {
-            console.log('widget', widget);
-            console.log('updates', updates);
-            if (widget.id !== updates.id) {
-                if (this.widgetIds.includes(updates.id) && !force) {
-                    ElNotification.warning('已经存在相同的id的组件，组件id不允许重复');
-                    return;
-                }
-            }
-            if (id === 'homepage') {
-                if (updates.id !== id) {
-                    ElNotification.warning('主页面的id不允许修改');
-                }
-                updates.id = updates.type = 'homepage';
-            }
-            this.$utils.destructuring(widget, updates);
-        } else {
-            console.warn(`Widget with id ${id} not found.`);
-        }
-    }
-    /**
-     * 重建组件映射表
-     */
-    rebuildWidgetMap() {
-        this.widgetMap.clear();
-        this.widgetIds = [];
-        this.buildWidgetMap(this.widgetConfig);
-    }
-    /**
-     * 递归构建组件映射表
-     * @param {Object} widget 当前组件对象
-     */
-    buildWidgetMap(widget) {
-        this.widgetMap.set(widget.id, widget);
-        this.widgetIds.push(widget.id);
-        if (widget.widgetList && widget.widgetList.length) {
-            widget.widgetList.forEach(widget => {
-                this.buildWidgetMap(widget);
-            });
-        }
-    }
-    /**
-     * 设置当前选中的组件ID
-     * @param {String} id 组件ID
-     */
-    setChosenId(id) {
-        this.widgetConfig.chosenId = id;
-    }
-    /**
-     * 获取当前选中的组件ID
-     * @returns {String} 当前选中的组件ID
-     */
-    getChosenId() {
-        return this.widgetConfig.chosenId;
-    }
-    /**
-     * 获取初始化的数据对象
-     * @param {Object} obj 初始数据对象
-     * @returns {Object} 处理后的初始数据对象
-     */
-    getChosenInitData(obj) {
-        obj = this.$utils.clone(obj, true);
-        obj.id = this.getUniqueId(obj.type);
-        this.setChosenId(obj.id);
-        let delkeyArr = ['isForm', 'canAddDataTableQuery', 'canAddDataTableList', 'addToPanel', 'active'];
-        let delkey = (key) => {
-            delete obj[key];
-        }
-        delkeyArr.forEach(e => {
-            delkey(e);
-        });
-        return obj;
-    }
-    /**
-     * 生成唯一的ID
-     * @param {String} prefix ID前缀
-     * @returns {String} 唯一的ID
-     */
-    getUniqueId(prefix) {
-        return prefix + '_' + Math.floor(new Date().getTime() % 100000) + "" + this.$utils.uniqueId();
-    }
-    /**
-     * 获取组件列表
-     * @returns {Array} 组件列表
-     */
-    getWidgetList() {
-        return this.widgetConfig.widgetList;
-    }
-    /**
-     * 获取组件配置
-     * @returns {Object} 组件配置对象
-     */
-    getWidgetConfig() {
-        return this.widgetConfig;
-    }
-    /**
-     * 更新组件配置
-     * @param {Object} config 新的组件配置
-     */
-    updateWidgetConfig(config) {
-        this.widgetConfig = config;
-    }
-    /**
-     * 根据组件ID查找其父组件
-     * @param {String} id 组件ID
-     * @returns {Object|null} 父组件对象或null（如果未找到）
-     */
-    getParentWidgetById(id) {
-        function recurse(items) {
-            for (const item of items) {
-                if (item.id === id) {
-                    let index = items.findIndex(e => e.id === id);
-                    return {
-                        widgetList: items,
-                        index: index
-                    };
-                }
-                if (item.widgetList && item.widgetList.length > 0) {
-                    const activeItem = recurse(item.widgetList);
-                    if (activeItem) {
-                        return activeItem;
-                    }
-                }
-            }
-            return null;
-        }
-        return recurse(this.widgetConfig.widgetList);
-    }
-}
-export default Designer;

package/src/http.js

@@ -1,293 +0,0 @@
-import axios from 'axios'
-// import qs from 'qs'
-import XEUtils from 'xe-utils'
-import {
-    ElNotification
-} from 'element-plus'
-/**
- * Http类用于封装HTTP请求
- * 提供了多种请求方法，如GET、POST、PUT、DELETE等
- * 支持设置基础URL、请求头、超时时间等选项
- * 可以自定义请求成功和失败的处理函数
- */
-class Http {
-    /**
-     * 构造函数初始化Http对象
-     * @param {Object} options 配置选项，包括baseUrl、headers、timeout、httpSuccessHandle、httpErrorHandle、httpBeforeSendHandle
-     */
-    constructor({
-        baseUrl = "",
-        headers = {},
-        timeout = 1000000,
-        httpSuccessHandle = null,
-        httpErrorHandle = null,
-        httpBeforeSendHandle = null
-    }) {
-        this.options = {
-            baseUrl,
-            headers,
-            timeout,
-            httpSuccessHandle,
-            httpErrorHandle,
-            httpBeforeSendHandle
-        }
-        // 定义不同Content-Type的headers
-        this.formDataHeader = {
-            'Content-Type': 'application/x-www-form-urlencoded'
-        }
-        this.formFileHeader = {
-            'Content-Type': 'multipart/form-data'
-        }
-        this.jsonHeader = {
-            'Content-Type': 'application/json'
-        }
-    }
-
-    /**
-     * 处理请求参数
-     * @param {any} data 请求参数
-     * @returns 处理后的请求参数
-     */
-    paramHandle(data) {
-        // 如果data是数组，直接返回
-        if (data instanceof Array) {
-            return data;
-        }
-        // 如果data不是对象，直接返回
-        if (typeof data !== 'object') {
-            return data
-        }
-        // 如果data存在，返回合并后的对象
-        if (data) {
-            return Object.assign({}, this.httpBeforeSendHandle ? this.httpBeforeSendHandle() || {} : {}, data)
-        } else {
-            // 如果data不存在，仅返回httpBeforeSendHandle处理的结果
-            return this.httpBeforeSendHandle()
-        }
-    }
-
-    /**
-     * 发送请求
-     * @param {Object} config 请求配置，包括url、method、params、data、headers等
-     * @returns 返回axios发送请求的Promise
-     */
-    send(config) {
-        // 创建axios实例
-        const api = axios.create({
-            baseURL: this.options.baseUrl,
-            timeout: this.options.timeout,
-            responseType: 'json'
-        })
-        // 请求拦截器，设置请求头
-        api.interceptors.request.use(
-            request => {
-                if (this.options.headers) {
-                    for (var key in this.options.headers) {
-                        request.headers[key] = headers[key]
-                    }
-                }
-                return request
-            }
-        )
-        // 响应拦截器，处理请求成功和失败的情况
-        api.interceptors.response.use(
-            response => {
-                if (this.options.httpSuccessHandle) {
-                    this.options.httpSuccessHandle(response.data)
-                }
-                return Promise.resolve(response.data)
-            },
-            error => {
-                if (this.options.httpErrorHandle) {
-                    this.options.httpErrorHandle(error)
-                }
-                ElNotification({
-                    title: '消息',
-                    message: '数据请求失败',
-                    type: 'error'
-                })
-                return Promise.reject(error)
-            }
-        )
-        // 发送请求
-        return api(config)
-    }
-
-    /**
-     * 发送GET请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送GET请求的Promise
-     */
-    get(url, data, headers) { //get请求
-        return this.send({
-            url: url,
-            method: 'get',
-            params: this.paramHandle(data),
-            headers: headers
-        })
-    }
-
-    /**
-     * 发送GET请求，返回Blob类型数据
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送GET请求的Promise
-     */
-    getBlob(url, data, headers) { //get请求
-        return this.send({
-            url: url,
-            method: 'get',
-            responseType: 'blob',
-            params: this.paramHandle(data),
-            headers: headers
-        })
-    }
-
-    /**
-     * 发送POST请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送POST请求的Promise
-     */
-    post(url, data, headers = {}) { //post请求
-        return this.send({
-            url: url,
-            method: 'post',
-            data: this.paramHandle(data),
-            headers: {
-                ...headers,
-                ...this.jsonHeader
-            }
-        })
-    }
-
-    /**
-     * 发送PUT请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送PUT请求的Promise
-     */
-    put(url, data, headers) { //put请求
-        return this.send({
-            url: url,
-            method: 'put',
-            data: this.paramHandle(data),
-            headers: headers
-        })
-    }
-
-    /**
-     * 发送PATCH请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送PATCH请求的Promise
-     */
-    patch(url, data, headers) { //patch请求
-        return this.send({
-            url: url,
-            method: 'patch',
-            data: this.paramHandle(data),
-            headers: headers
-        })
-    }
-
-    /**
-     * 发送DELETE请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送DELETE请求的Promise
-     */
-    delete(url, data, headers) { //delete请求
-        return this.send({
-            url: url,
-            method: 'delete',
-            params: this.paramHandle(data),
-            headers: headers
-        })
-    }
-
-    /**
-     * 发送使用FormData的POST请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送POST请求的Promise
-     */
-    postFormData(url, data, headers) { //formdata的post请求
-        return this.send({
-            url: url,
-            method: 'post',
-            data: XEUtils.serialize(this.paramHandle(data)),
-            headers: {
-                ...this.formDataHeader,
-                ...headers
-            }
-        })
-    }
-
-    /**
-     * 发送上传文件的POST请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送POST请求的Promise
-     */
-    postFile(url, data, headers) { //formdata的post请求
-        return this.send({
-            url: url,
-            method: 'post',
-            data: data,
-            headers: {
-                ...this.formDataHeader,
-                ...headers
-            }
-        })
-    }
-
-    /**
-     * 发送使用FormData的PUT请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送PUT请求的Promise
-     */
-    putFormData(url, data, headers) { //formdata的put请求
-        return this.send({
-            url: url,
-            method: 'put',
-            data: XEUtils.serialize(this.paramHandle(data)),
-            headers: {
-                ...this.formDataHeader,
-                ...headers
-            }
-        })
-    }
-
-    /**
-     * 发送使用FormData的PATCH请求
-     * @param {string} url 请求URL
-     * @param {any} data 请求参数
-     * @param {Object} headers 请求头
-     * @returns 返回发送PATCH请求的Promise
-     */
-    patchFormData(url, data, headers) { //formdata的patch请求
-        return this.send({
-            url: url,
-            method: 'patch',
-            data: XEUtils.serialize(this.paramHandle(data)),
-            headers: {
-                ...this.formDataHeader,
-                ...headers
-            }
-        })
-    }
-
-}
-export default Http

package/src/index.js

@@ -1,24 +0,0 @@
-import './assets/styles/element/index.scss'
-import './assets/styles/index.css'
-import designer from './components/aDesigner/index.vue'
-import sunForm from './components/aDesigner/show.vue'
-import compsCommon from './components/widgetCommonComps/index'
-import compsWidget from './components/widgetShowComps/index'
-const install = (app) => {
-    Object.entries({
-        ...compsCommon,
-        ...compsWidget,
-    }).forEach(([name, component]) => {
-        app.component(name, component);
-    });
-    app.component("designer", designer);
-    app.component("sunForm", sunForm);
-};
-console.log(compsCommon);
-export {
-    designer,
-    sunForm,
-};
-export default {
-    install
-};

package/src/index2.js

@@ -1,23 +0,0 @@
-import './assets/styles/element/index.scss'
-import './assets/styles/index.css'
-import widgetShowComps from './components/widgetShowComps/index'
-import widgetCommonComps from './components/widgetCommonComps/index'
-import widgetConfigComps from './components/widgetConfigComps/index'
-import designer from './components/aDesigner/index.vue'
-designer.install = function (app) {
-    app.use(widgetShowComps)
-    app.use(widgetCommonComps)
-    app.use(widgetConfigComps)
-};
-let comps = [designer]
-const install = (app) => {
-    app.use(widgetShowComps)
-    app.use(widgetCommonComps)
-    app.use(widgetConfigComps)
-    comps.forEach(item => {
-        app.component(item.name, item)
-    })
-};
-export default {
-    install
-};

package/src/main.js

@@ -1,19 +0,0 @@
-import {
-    createApp
-} from 'vue'
-import App from './App.vue'
-import comps from './index2'
-import ElementPlus from 'element-plus'
-import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
-import VxeUITable from 'vxe-table'
-import 'vxe-table/lib/style.css'
-import XEUtils from 'xe-utils'
-import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-const app = createApp(App)
-app.use(ElementPlus)
-app.use(VxeUITable)
-app.use(comps)
-for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
-    app.component(key, component)
-}
-app.mount('#app')