logic-helper/src/utils/event.js

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

// 服务端事件
export const ServerEvents = ['read', 'write', 'remove', 'rename', 'getAll'];

export const KeyboardEvents = ['ctl-c', 'ctl-v', 'ctl-s', 'ctl-z', 'ctl-y'];
export const AllEvents = [ ...ServerEvents, ...KeyboardEvents, 'custom-event','running'];

// 自测用的
const eventMap = {}


class Event {
    constructor(allEvents) {
        this.$listeners = {};
        this.$cahceLastest = {};
        this.ALL_MY_EVENTS = allEvents;
        allEvents.forEach((ev) => {
            this.$listeners[ev] = [];
        });
        document.addEventListener('keydown', (e) => {
            if (e.ctrlKey) {
                if (e.key == 'c') {
                    this.$emit('ctl-c', e, {refer:'keydown'})
                } else if (e.key == 'v') {
                    this.$emit('ctl-v', e, {refer:'keydown'})
                } else if (e.key == 's') {
                    this.$emit('ctl-s', e, {refer:'keydown'})
                } else if (e.key == 'z') {
                    this.$emit('ctl-z', e, {refer:'keydown'})
                } else if (e.key == 'y') {
                    this.$emit('ctl-y', e, {refer:'keydown'})
                }
            } else {
                console.log(e)
            }
        });
    }
    $emit(event, data, option = {}) {
        if (!option.refer) {
            console.error('event.$emit: 请输入refer');
        }
        this.$cahceLastest[event] = {
            event,
            data,
            option
        };
        if (this.$listeners[event]) {
            this.$listeners[event].forEach(({
                fn,
                option
            }) => {
                if (typeof option.filter === 'function' && option.filter(event, data, option)===false) {
                    return
                }
                fn(this.$cahceLastest[event]);
            });
        }
        return this;
    }
    $on(...args) {
        let event, fn, option = {}
        if (args.length == 1) {
            event = this.ALL_MY_EVENTS;
            fn = args[0];
        } else if (args.length == 2) {
            if (typeof args[0] == 'function') {
                event = this.ALL_MY_EVENTS;
                fn = args[0];
                option = Object.assign(option, args[1]);
            } else {
                event = args[0];
                fn = args[1];
            }
        } else if (args.length == 3) {
            event = args[0];
            fn = args[1];
            option = Object.assign(option, args[2]);
        }
        if (typeof event !== 'string' && !Array.isArray(event)) {
            console.error('$on error 1 >>>', args)
            throw new Error('event name must be a string|array');
        }
        if (typeof fn !== 'function') {
            throw new Error('event handler must be a function');
        }
        if (!option.refer) {
            console.error('$on error 2>>>', event, fn, option)
            console.error('event.$on: 请输入refer');
        }

        if (Array.isArray(event)) {
            event.forEach((ev) => {
                this.$on(ev, fn, option);
            });
            return this
        }
        this.$listeners[event] = this.$listeners[event] || [];
        if (!this.$listeners[event].find(val => val.fn == fn)) {
            if (fn.id && this.$listeners[event].find((v) => v.fn.id == fn.id)) {
                return;
            }
            this.$listeners[event].push({
                fn,
                option
            });
        }
        if (option.immediate) {
            fn && fn(this.$cahceLastest[event]);
        }
        return this;
    }
    $remove(event, fn, option = {}) {
        if (!option.refer) {
            console.error('event.$remove: 请输入refer');
        }
        if (typeof fn == 'function') {
            this.$listeners[event] = this.$listeners[event].filter((item) => {
                return item !== fn && (fn.id ? item.id !== fn.id : true);
            });
        }

        return this;
    }
}
const eventBus = new Event(AllEvents);
const allIps = {}
export class EventHelper {
    constructor(ip, options = {}) {
        this.ip = ip;
        this.fns = []
        allIps[ip] = options

        this.options = {
            ...options,
            refer: ip
        };
        if (!ip) {
            throw new Error('ip must be specified');
        }
    }
    $dispose() {
        delete allIps[this.ip];
        AllEvents.forEach((ev) => {
            this.fns.forEach((fn) => {
                eventBus.$remove(ev,fn)
            })
        })
    }
    $on(...args) {
        args.forEach(item => {
            if (typeof item == 'function' && this.fns.indexOf(item) == -1) {
                this.fns.push(item);
            }
        })
        if (args.length == 1) {
            args = [args[0], this.options];
        } else if (args.length == 2) {
            if (typeof args[1] == 'function') {
                args = [args[0], args[1], this.options];
            } else if (typeof args[1] == 'object') {
                args[1] = Object.assign({}, this.options, args[1]);
            }
        } else if (args.length == 3) {
            args[2] = Object.assign({}, this.options, args[2]);
        }
        eventBus.$on(...args)
        return this
    }
    $emit(...args) {
        args[2] = {
            ...this.options,
            ...args[2],
        }
        eventBus.$emit(...args)
        return this
    }
}