cbvirtua 1.0.55 → 1.0.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cbvirtua",
-  "version": "1.0.55",
+  "version": "1.0.57",
   "description": "",
   "main": "index.js",
   "scripts": {

package//346/226/260/345/273/272 /346/226/207/346/234/254/346/226/207/346/241/243.txt"

@@ -97,4 +97,244 @@ input.ui-input, .ui-input > input, [is="ui-input"] {
     font-size: var(--ui-font, 14px);
     outline: none;
     color: var(--ui-dark, #4c5161);
-    transition: border-color var(--ui-animate-time, .2s), background-color var(--ui-animate-time, .2s);
+    transition: border-color var(--ui-animate-time, .2s), background-color var(--ui-animate-time, .2s);
+
+
+import mitt from 'mitt'
+
+// 当前文件名 需要同步修改
+const CURRENT_FILE_NAME = 'useMitt'
+
+// 基础配置
+const defineOptions = {
+  // 是否禁用
+  logDisabled: false,
+  // 是否展开
+  logExpanded: false,
+  // console.group样式
+  logStyle: 'color: #fff; background: #51a2e4; font-size: 12px; padding: 4px; border-radius: 4px'
+}
+
+// uuid
+let idCounter = 0;
+const uniqueId = (prefix) => {
+  return prefix.toString() + ++idCounter;
+}
+
+// 操作时间 HH:mm:ss:ms
+const formatTime = (date = new Date()) => {
+  const hours = date.getHours().toString().padStart(2, '0');
+  const minutes = date.getMinutes().toString().padStart(2, '0');
+  const seconds = date.getSeconds().toString().padStart(2, '0');
+  const milliseconds = date.getMilliseconds().toString();
+
+  return `${hours}:${minutes}:${seconds}:${milliseconds}`;
+}
+
+// 获取堆栈
+const getStackTrace = () => {
+  let stackStr = ''
+  let stackArr = []
+  // 通过Error获取
+  try {
+    throw new Error('');
+  }
+  // catch掉才不会被博睿监控到
+  catch (error) {
+    stackStr = error.stack || '';
+  }
+  // 字符串信息分割为数组 并去掉空格
+  stackArr = stackStr.split('\n').map((line) => line.trim());
+  return stackArr.splice(stackArr[0] === 'Error' ? 2 : 1);
+}
+
+// 在堆栈信息数组中 匹配触发事件的函数
+const matchFnCaller = (stackTrace = []) => {
+  // 文件在src下的 且排除本文件 没有匹配的返回第0项
+  return stackTrace.find(item => item.includes('src') && !item.includes(CURRENT_FILE_NAME)) || stackTrace[0]
+}
+
+
+// 事件信息map结构 key: eventName value: { count: 触发次数, describe： 事件描述 }
+const eventMap = new Map()
+
+// 监听事件 配置logger
+const handleOnEvent = (eventName, value, options) => {
+  const stackTrace = getStackTrace()
+
+  // 匹配事件源 去掉 at 字符
+  const source =  matchFnCaller(stackTrace).substring(3)
+  const describe = eventMap.get(eventName).describe
+  const count = eventMap.get(eventName).count
+
+  const g = options.logExpanded ? console.group : console.groupCollapsed
+  g(`%cmittId => ${options.id}`, options.logStyle)
+  console.log('eventName:', eventName)
+  console.log('eventValue:', value)
+  console.log('eventDescribe:', describe)
+  console.log('eventSource:', source)
+  console.log('count:', count)
+  console.log('time:', formatTime())
+  console.groupEnd()
+}
+
+// 记录事件信息
+const markEventMap = (type, describe) => {
+  if (eventMap.has(type)) {
+    let event = eventMap.get(type)
+    eventMap.set(type, {
+      count: ++event.count,
+      describe
+    })
+  } else {
+    eventMap.set(type, {
+      count: 1,
+      describe
+    })
+  }
+  console.log('eventMap', eventMap)
+}
+// emit事件 记录事件信息
+const handleEmitEvent = (emitter) => {
+  const originEmit = emitter.emit
+  emitter.emit = (type, e, describe = '') => {
+    markEventMap(type, describe)
+    originEmit(type, e)
+  }
+}
+
+// 增加emitAsync方法
+// https://github.com/developit/mitt/discussions/157
+const emitAsync = async function(type, e, describe) {
+  // 记录事件信息
+  markEventMap(type, describe)
+
+  let handlers = this.all.get(type)
+  if (handlers) {
+    for (const f of handlers) {
+      await f(e)
+    }
+  }
+  handlers = this.all.get('*')
+  if (handlers) {
+    for (const f of handlers) {
+      await f(type, e)
+    }
+  }
+}
+const mittAsync = (all) => {
+  const instance = mitt(all)
+  instance.emitAsync = emitAsync
+  return instance
+}
+
+export default function useMitt(customOption) {
+  // 配置项
+  const options = Object.assign({
+    id: uniqueId('mitt-')
+  }, defineOptions, customOption)
+
+  // 实例化mitt
+  const emitter = mittAsync()
+
+  if (!options.disabled) {
+    // 监听所有事件，配置logger
+    emitter.on('*', (eventName, value) => handleOnEvent(eventName, value, options))
+    // 劫持emit，记录信息
+    handleEmitEvent(emitter)
+  }
+ 
+  return emitter
+}
+
+import useMitt from '@/hooks/useMitt'
+
+const emitter = useMitt({id: 'listEmitter', logExpanded: true})
+const handleClick = () => {
+        emitter.emitAsync('showModal', 'data', '此函数是激活confirm modal')
+          .then(() => {
+            console.log('confirm')	// resolve后打印
+          })
+          .catch(() => {
+            console.log('cancel')	// reject后打印
+          })
+      }
+emitter.on('showModal', () => {
+        return new Promise((resolve, reject) => {
+          Modal.confirm({
+            title: '确认是否XXX',
+            onOk() {
+              resolve()
+            },
+            onCancel() {
+              reject()
+            }
+          })
+        })
+      })
+import useMitt from '@/hooks/useMitt'
+const emitter = useMitt({ id: 'contract-edit', logExpanded: true })
+const handleClick = () => {
+        emitter.emit('click', 'data', '这是一个点击事件')
+      }
+export default function mitt(all){
+  //使用Map存储注册的事件
+  all = all || new Map();
+
+
+  return {
+    all,
+    on(type, handler, priority = 0, listener) {
+      const handlers = all!.get(type) || [];
+      handlers.push({handler, priority});
+      handlers.sort((a, b) => b.priority - a.priority);
+      all!.set(type, handlers);
+      if (listener) {
+        listener({type, handler, priority});
+      }
+    },
+    
+    off(type, handler) {
+      const handlers = all!.get(type);
+      if (handlers) {
+        if (handler) {
+          const index =  handlers.findIndex(item => item.handler === handler);
+          handlers.splice(index > -1 ? index : 0, 1);
+        }
+        else {
+          all!.set(type, []);
+        }
+      }
+    },
+    
+    emit(type, evt, listener) {
+      if (listener) {
+        listener({type, evt});
+      }
+      let handlers = all!.get(type);
+      if (handlers) {
+        handlers.slice().map(async (handler) => {
+            await handler(evt);
+          });
+      }
+    }
+  };
+}
+
+
+function eventListener({type, handler, priority}) {
+  console.log(`事件 ${type} 已注册，处理函数为 ${handler}，优先级为 ${priority}`);
+}
+
+
+function eventTriggerListener({type, evt}) {
+  console.log(`事件 ${type} 已触发，事件对象为 ${evt}`);
+}
+
+
+const bus = mitt();
+
+
+bus.on('click', () => console.log('点击事件已触发'), 1, eventListener);
+bus.emit('click', {target: '按钮'}, eventTriggerListener);
+