leiting-bim 2.1.35 → 2.1.37

package/plugins/theme-chalk/src/marker.less

@@ -0,0 +1,107 @@
+@import './mixins/mixins.less';
+
+// 封装组件 BEM mixin
+.mark-default-bem(@componentName) {
+  // 拼接 blockSuffix，例如 '-icon'
+
+  // 调用 .b()，传入拼接后的名称
+  .b(~'@{componentName}', {
+    position: relative;
+  });
+  .be(~'@{componentName}',name, {
+      width: max-content;
+      transform: translate(-50%, -100% - 4px);
+      left: 50%;
+      position: absolute;
+      top: 0px;
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 15px;
+      padding: 4px 15px;
+      font-size: 16px;
+      color: #fff;
+      white-space: pre-wrap;
+  });
+  .be(~'@{componentName}',custom, {
+    position: absolute
+  });
+  .be(~'@{componentName}',img, {
+    -webkit-user-drag: none;
+    -khtml-user-drag: none;
+    -moz-user-drag: none;
+    -o-user-drag: none;
+  });
+}
+
+.mark-default-bem(marker-default);
+
+// 封装组件 BEM mixin
+.mark-html-bem(@componentName) {
+  // 拼接 blockSuffix，例如 '-icon'
+
+  // 调用 .b()，传入拼接后的名称
+  .b(~'@{componentName}', {
+    position: relative;
+  });
+  .be(~'@{componentName}',custom, {
+    position: absolute
+  });
+  .be(~'@{componentName}',img, {
+    -webkit-user-drag: none;
+    -khtml-user-drag: none;
+    -moz-user-drag: none;
+    -o-user-drag: none;
+  });
+}
+
+.mark-html-bem(marker-html);
+
+.mark-text-bem(@componentName) {
+  // 拼接 blockSuffix，例如 '-icon'
+
+  // 调用 .b()，传入拼接后的名称
+  .b(~'@{componentName}', {
+    position: relative;
+  });
+  .be(~'@{componentName}',name, {
+      width: max-content;
+      text-align: center;
+      color: #fff;
+      z-index: 1;
+      white-space: pre-wrap;
+  });
+}
+
+.mark-text-bem(marker-text);
+
+.mark-bubble-bem(@componentName) {
+  // 拼接 blockSuffix，例如 '-icon'
+
+  // 调用 .b()，传入拼接后的名称
+  .b(~'@{componentName}', {
+    position: relative;
+    pointer-events: none;
+    width: 0;
+    height: 0
+  });
+  .be(~'@{componentName}',name, {
+      width: max-content;
+      min-width: 60px;
+      min-height: 20px;
+      text-align: center;
+      color: #fff;
+      z-index: 1;
+      white-space: pre-wrap;
+      pointer-events: auto;
+  });
+  .be(~'@{componentName}',line, {
+     width: 100px;
+      height: 30px;
+      background-color: pink;
+      position: absolute;
+      left: 0;
+      top: 0;
+      pointer-events: auto;
+  });
+}
+
+.mark-bubble-bem(marker-bubble);

package/plugins/theme-chalk/src/markerManage.less

@@ -0,0 +1,25 @@
+@import './mixins/mixins.less';
+
+// 封装组件 BEM mixin
+.mark-manage-bem(@componentName) {
+  // 拼接 blockSuffix，例如 '-icon'
+
+  // 调用 .b()，传入拼接后的名称
+  .b(~'@{componentName}', {
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+  });
+  .be(~'@{componentName}',container, {
+    width: 100%;
+    height: 100%;
+    border: 1px solid #ccc;
+    position: absolute;
+    top: 0;
+    left: 0;
+    pointer-events: none;
+    overflow: hidden;
+  });
+}
+
+.mark-manage-bem(marker-manage);

package/plugins/theme-chalk/src/measurement.less

@@ -0,0 +1,106 @@
+@import './mixins/mixins.less';
+
+.measurement-bem(@componentName) {
+  .b(~'@{componentName}', {
+    position: absolute;
+    top: 115px;
+    left: 20px;
+    width: 200px;
+    padding: 16px;
+    background: rgba(0, 0, 0, 0.5);
+    border: 1px solid #424242;
+    border-radius: 4px;
+    backdrop-filter: blur(5px);
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+    z-index: 999;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
+    transition: all 0.3s ease;
+    max-height: 600px;
+    overflow-y: auto;
+    box-sizing: border-box;
+
+    // Scrollbar styling
+    &::-webkit-scrollbar {
+      width: 4px;
+    }
+    &::-webkit-scrollbar-thumb {
+      background: rgba(255, 255, 255, 0.2);
+      border-radius: 2px;
+    }
+    &::-webkit-scrollbar-track {
+      background: transparent;
+    }
+  });
+
+  .be(~'@{componentName}', btn, {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    width: 100%;
+    padding: 8px 12px;
+    color: #fff;
+    cursor: pointer;
+    font-size: 14px;
+    transition: all 0.2s;
+    border-radius: 4px;
+    margin-bottom: 2px;
+    user-select: none;
+    box-sizing: border-box;
+
+    &:hover {
+      background: rgba(255, 255, 255, 0.1);
+    }
+
+    &.active {
+      background: rgba(255, 255, 255, 0.2);
+      color: #fff;
+      font-weight: 500;
+    }
+  });
+
+  .be(~'@{componentName}', icon, {
+    width: 24px;
+    height: 24px;
+    margin-right: 12px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: contain;
+    }
+  });
+
+  .be(~'@{componentName}', container, {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+    z-index: 100;
+    overflow: hidden;
+  });
+
+  &.is-small {
+    width: 150px;
+    padding: 10px;
+
+    .be(~'@{componentName}', btn, {
+      padding: 4px 8px;
+      font-size: 12px;
+    });
+
+    .be(~'@{componentName}', icon, {
+      width: 16px;
+      height: 16px;
+      margin-right: 8px;
+    });
+  }
+}
+
+.measurement-bem(measurement-box);

package/plugins/theme-chalk/src/mixins/config.less

@@ -0,0 +1,4 @@
+@namespace: cx; // 对应 $namespace
+@state-prefix: -; // 对应 $state-prefix
+@modifier-separator: --; // 对应 $modifier-separator
+@element-separator: __; // 对应 $element-separator

package/plugins/theme-chalk/src/mixins/mixins.less

@@ -0,0 +1,64 @@
+@import './config.less';  
+
+
+// ----------------- 基础 BEM -----------------
+.b(@block, @rules) {
+  .@{namespace}-@{block} {
+    @rules();
+  }
+}
+
+.e(@element, @rules) when (length(@element) > 0) {
+  &@{element-separator}@{element} {
+    @rules();
+  }
+}
+
+.m(@modifier, @rules) when (length(@modifier) > 0) {
+  &@{modifier-separator}@{modifier} {
+    @rules();
+  }
+}
+
+// ----------------- 组合 BEM -----------------
+.be(@block, @element, @rules) when (length(@block) > 0) and (length(@element) > 0) {
+  .@{namespace}-@{block} {
+    &@{element-separator}@{element} {
+      @rules();
+    }
+  }
+}
+
+.bm(@block, @modifier, @rules) when (length(@block) > 0) and (length(@modifier) > 0) {
+  .@{namespace}-@{block} {
+    &@{modifier-separator}@{modifier} {
+      @rules();
+    }
+  }
+}
+
+.em(@element, @modifier, @rules) when (length(@element) > 0) and (length(@modifier) > 0) {
+  &@{element-separator}@{element} {
+    &@{modifier-separator}@{modifier} {
+      @rules();
+    }
+  }
+}
+
+.bem(@block, @element, @modifier, @rules)
+  when (length(@block) > 0) and (length(@element) > 0) and (length(@modifier) > 0) {
+  .@{namespace}-@{block} {
+    &@{element-separator}@{element} {
+      &@{modifier-separator}@{modifier} {
+        @rules();
+      }
+    }
+  }
+}
+
+// ----------------- 状态 -----------------
+.is(@state, @rules) when (length(@state) > 0) {
+  &.@{state-prefix}@{state} {
+    @rules();
+  }
+}

package/plugins/theme-chalk/src/pathRoam.less

@@ -0,0 +1,198 @@
+@import './mixins/mixins.less';
+
+.path-roam-bem(@componentName) {
+  .b(~'@{componentName}', {
+    position: absolute;
+    top: 20px;
+    left: 20px;
+    width: 280px;
+    background: rgba(30, 30, 30, 0.85);
+    backdrop-filter: blur(12px);
+    -webkit-backdrop-filter: blur(12px);
+    color: #e0e0e0;
+    border-radius: 12px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    z-index: 100;
+    font-family: system-ui, -apple-system, sans-serif;
+  });
+
+  .be(~'@{componentName}', header, {
+    padding: 12px 16px;
+    background: rgba(255, 255, 255, 0.05);
+    font-weight: 600;
+    font-size: 16px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  });
+
+  .be(~'@{componentName}', content, {
+    padding: 12px;
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    max-height: 80vh;
+    overflow-y: auto;
+  });
+
+  .be(~'@{componentName}', section, {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  });
+
+  .be(~'@{componentName}', title, {
+    font-size: 12px;
+    text-transform: uppercase;
+    color: #9ca3af;
+    letter-spacing: 0.5px;
+    font-weight: 600;
+  });
+
+  .be(~'@{componentName}', row, {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+  });
+
+  .be(~'@{componentName}', grid-2, {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 8px;
+    align-items: center;
+  });
+
+  .be(~'@{componentName}', group, {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+
+    label {
+      font-size: 12px;
+      color: #9ca3af;
+    }
+
+    input[type='number'],
+    input[type='text'] {
+      width: 100%;
+      padding: 6px 10px;
+      background: rgba(0, 0, 0, 0.3);
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      border-radius: 6px;
+      color: #e0e0e0;
+      font-size: 13px;
+      outline: none;
+      box-sizing: border-box;
+
+      &:focus {
+        border-color: #3b82f6;
+      }
+    }
+  });
+
+  .be(~'@{componentName}', checkbox, {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    cursor: pointer;
+    font-size: 13px;
+  });
+
+  .be(~'@{componentName}', btn, {
+    padding: 6px 12px;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(255, 255, 255, 0.05);
+    color: #e0e0e0;
+    border-radius: 6px;
+    cursor: pointer;
+    font-size: 13px;
+    transition: all 0.2s;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 6px;
+
+    &:hover {
+      background: rgba(255, 255, 255, 0.1);
+      border-color: rgba(255, 255, 255, 0.2);
+    }
+
+    &:active {
+      transform: translateY(1px);
+    }
+
+    &.primary {
+      background: #3b82f6;
+      border-color: transparent;
+      color: white;
+      &:hover { background: #2563eb; }
+    }
+
+    &.danger {
+      color: #ef4444;
+      border-color: rgba(239, 68, 68, 0.3);
+      &:hover { background: rgba(239, 68, 68, 0.1); }
+    }
+    
+    &.icon {
+        font-size: 16px;
+        padding: 6px 0;
+    }
+
+    &.mini {
+      width: 32px;
+      padding: 0;
+      justify-content: center;
+    }
+  });
+
+  .be(~'@{componentName}', route-row, {
+    display: flex;
+    gap: 8px;
+    margin-bottom: 8px;
+  });
+
+  .be(~'@{componentName}', select, {
+    flex: 1;
+    padding: 4px 8px;
+    background: rgba(0, 0, 0, 0.3);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: 6px;
+    color: #e0e0e0;
+    font-size: 13px;
+    outline: none;
+    cursor: pointer;
+
+    option {
+      background: #1e1e1e;
+      color: #e0e0e0;
+    }
+
+    &:focus {
+      border-color: #3b82f6;
+    }
+  });
+
+  .be(~'@{componentName}', status, {
+    padding: 10px 16px;
+    background: rgba(0, 0, 0, 0.3);
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    font-size: 12px;
+    color: #9ca3af;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    span.value {
+      color: #3b82f6;
+      font-weight: 600;
+    }
+  });
+}
+
+.path-roam-bem(path-roam-box);

package/plugins/utils/create.ts

@@ -0,0 +1,45 @@
+// block 代码块   element 元素 modifier 装饰 state 状态
+function _bem(prefixName: string, blockSuffix: string, element: string, modifier: string) {
+  if (blockSuffix) {
+    prefixName += `-${blockSuffix}`;
+  }
+  if (element) {
+    prefixName += `__${element}`;
+  }
+  if (modifier) {
+    prefixName += `--${modifier}`;
+  }
+  return prefixName;
+}
+
+function createBEM(prefixName: string) {
+  const b = (blockSuffix: string = '') => _bem(prefixName, blockSuffix, '', '');
+  const e = (element: string = '') => (element ? _bem(prefixName, '', element, '') : '');
+  const m = (modifier: string = '') => (modifier ? _bem(prefixName, '', '', modifier) : '');
+  const be = (blockSuffix: string = '', element: string = '') =>
+    blockSuffix && element ? _bem(prefixName, blockSuffix, element, '') : '';
+  const bm = (blockSuffix: string = '', modifier: string = '') =>
+    blockSuffix && modifier ? _bem(prefixName, blockSuffix, '', modifier) : '';
+  const em = (element: string = '', modifier: string = '') =>
+    element && modifier ? _bem(prefixName, '', element, modifier) : '';
+  const bem = (blockSuffix: string = '', element: string = '', modifier: string = '') =>
+    blockSuffix && element && modifier ? _bem(prefixName, blockSuffix, element, modifier) : '';
+  const is = (name: string, state: string | boolean) => (state ? `is-${name}` : '');
+  return {
+    b,
+    e,
+    m,
+    be,
+    bm,
+    em,
+    bem,
+    is,
+  };
+}
+
+export const prefix = 'cx';
+export function createNamespace(name: string) {
+  const prefixName = `${prefix}-${name}`;
+  return createBEM(prefixName);
+}
+

package/plugins/utils/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "@report-components/utils",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

package/plugins/utils/uuid.ts

@@ -0,0 +1,43 @@
+const hexList: string[] = [];
+for (let i = 0; i <= 15; i++) {
+  hexList[i] = i.toString(16);
+}
+
+export function buildUUID() {
+  // return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+  //   const r = (Math.random() * 16) | 0,
+  //     v = c == 'x' ? r : (r & 0x3) | 0x8;
+  //   return v.toString(16);
+  // });
+  let guid = '';
+  for (let i = 1; i <= 32; i++) {
+    const n = Math.floor(Math.random() * 16.0).toString(16);
+    guid += n;
+    if (i == 8 || i == 12 || i == 16 || i == 20) guid += '-';
+  }
+  return guid;
+}
+
+// export function buildUUID(): string {
+//   let uuid = '';
+//   for (let i = 1; i <= 36; i++) {
+//     if (i === 9 || i === 14 || i === 19 || i === 24) {
+//       uuid += '-';
+//     } else if (i === 15) {
+//       uuid += 4;
+//     } else if (i === 20) {
+//       uuid += hexList[(Math.random() * 4) | 8];
+//     } else {
+//       uuid += hexList[(Math.random() * 16) | 0];
+//     }
+//   }
+//   return uuid.replace(/-/g, '');
+// }
+
+let unique = 0;
+export function buildShortUUID(prefix = ''): string {
+  const time = Date.now();
+  const random = Math.floor(Math.random() * 1000000000);
+  unique++;
+  return prefix + '_' + random + unique + String(time);
+}

package/plugins/utils/with-install.ts

@@ -0,0 +1,10 @@
+import type { Plugin, App } from "vue";
+
+export type SFCWithInstall<T> = T & Plugin;
+export function withInstall<T>(comp: T) {
+  (comp as SFCWithInstall<T>).install = function (app: App) {
+    const { name } = comp as unknown as { name: string };
+    app.component(name, comp as SFCWithInstall<T>); //将组件注册成全局的
+  };
+  return comp as SFCWithInstall<T>;
+}