win-chart 1.0.0

package/src/utils/tree.ts

@@ -0,0 +1,145 @@
+export interface ITreeNode {
+  [key: string]: any;
+  children?: ITreeNode[];
+}
+
+/**
+ * 树形递归查找
+ * @param tree
+ * @param fn
+ * @returns
+ */
+export function treeFind<T extends ITreeNode>(
+  tree: T[],
+  fn: (item: T) => boolean,
+): T | undefined {
+  if (Array.isArray(tree)) {
+    for (const item of tree) {
+      if (fn(item)) {
+        return item;
+      }
+
+      if (item.children) {
+        const res = treeFind(item.children as any, fn);
+        if (res) {
+          return res;
+        }
+      }
+    }
+  }
+
+  return undefined;
+}
+
+/**
+ * 树型转平面结构
+ * @param tree
+ * @returns
+ */
+export function treeFlatToArr<T extends ITreeNode>(tree: T[]) {
+  const outArr: T[] = [];
+
+  const treeFlat = (tree: ITreeNode[], outArr: ITreeNode[]) => {
+    for (const item of tree) {
+      outArr.push(item);
+      if (item.children) {
+        treeFlat(item.children, outArr);
+      }
+    }
+  };
+
+  treeFlat(tree, outArr);
+
+  return outArr;
+}
+
+/**
+ * 查找某个节点 value 值集合
+ * @param tree
+ * @param key
+ * @returns
+ */
+export function getChildrenValueList<T extends ITreeNode>(
+  tree: T[],
+  key: string,
+) {
+  const item = treeFind(tree, (item) => item.value === key);
+  if (item) {
+    const childrenArrList = treeFlatToArr([item]);
+    return childrenArrList.map((item) => item.value);
+  }
+
+  return [];
+}
+
+/**
+ * 获取树型结构中某个字段值集合
+ * @param {*} arr
+ * @param {*} key
+ */
+export function getListValueByKey<T extends ITreeNode>(arr: T[], key: string) {
+  const data = arr.map((item) => {
+    let tempArr: T[] = [];
+    if (item.children) {
+      tempArr = getListValueByKey(item.children, key);
+    }
+    return [item[key], ...tempArr];
+  });
+
+  return data.flat();
+}
+
+/**
+ * 树型映射
+ * @param tree
+ * @param fn
+ * @returns
+ */
+export function treeMap<T extends ITreeNode>(
+  tree: T[],
+  fn: (tree: T) => ITreeNode,
+) {
+  if (Array.isArray(tree)) {
+    return tree.map((item) => {
+      const newItem = fn(item);
+      if (item.children) {
+        newItem.children = treeMap(item.children as any, fn);
+      }
+      return newItem as T;
+    });
+  }
+
+  return [];
+}
+
+/**
+ * 数组转换成下拉列表
+ * @param {*} list 源数据
+ * @param {*} labelIndex label索引
+ * @param {*} valueIndex value索引
+ * @returns  [{ label:'xxx', value:'xxx', key:'xxx', children:[] }]
+ */
+export function addTreeListProps<T extends ITreeNode>(
+  list: T[],
+  labelIndex: string,
+  valueIndex: string,
+) {
+  if (Array.isArray(list)) {
+    return list.map((item) => {
+      const temp = {
+        ...item,
+        label: item[labelIndex],
+        value: item[valueIndex],
+        key: item[valueIndex],
+      };
+      if (item.children) {
+        temp.children = addTreeListProps(item.children, labelIndex, valueIndex);
+      } else {
+        delete temp.children;
+      }
+      return temp;
+    });
+  }
+
+  return [];
+}

package/src/utils/url.ts

@@ -0,0 +1,40 @@
+import qs from 'qs';
+
+/**
+ * 获取地址栏参数
+ * @returns
+ */
+export const getSearchParams = () => {
+  const search = (str: string) => qs.parse(str, { ignoreQueryPrefix: true });
+
+  return {
+    ...search(globalThis.location.search),
+    ...search(globalThis.location.hash.split('?')[1]),
+  } as Record<string, string | undefined>;
+};
+
+/**
+ * 拼接 Query
+ * @param url
+ * @param searchObj
+ * @returns
+ */
+export const handleAddQuery = (
+  url: string,
+  searchObj: { [p: string]: any },
+) => {
+  const query = Object.entries(searchObj)
+    .filter((item) => ![null, undefined].includes(item[1]))
+    .map((item) => item.join('='))
+    .join('&');
+
+  return url.includes('?') ? `${url}&${query}` : `${url}?${query}`;
+};
+
+/**
+ * 获取外部链接跳转处理
+ * @param url
+ * @returns
+ */
+export const getHandleOpenLink = (url?: string | null) => () =>
+  !!url && globalThis.open(url);

package/src/utils/util.ts

@@ -0,0 +1,99 @@
+import dayjs from 'dayjs';
+import { IKeyValueItem, IListItem, IResponse, OperateType } from 'src/types';
+
+/**
+ * 过滤接口返回内容
+ * @param {*} res
+ * @returns
+ */
+export function handleResult<T>({ success, data, errorMsg }: IResponse<T>): T {
+  if (!success) {
+    throw new Error(errorMsg);
+  }
+
+  return data;
+}
+
+/**
+ * 获取值列表值
+ * @param list
+ * @param value
+ * @returns
+ */
+export function getListLabel<T>(list: IListItem<T>[], value?: T) {
+  return list.find((item) => item.value === value)?.label;
+}
+
+/**
+ * 格式化日期 时间
+ * @param {String} value 时间戳
+ * @returns {String}
+ */
+export const formatDate = (value?: any) => {
+  if (!value) {
+    return '- -';
+  }
+  return dayjs(value).format('YYYY-MM-DD');
+};
+/**
+ * 删除对象中的空值
+ * @param {}
+ * @returns {}
+ */
+export const getTidyObject = (obj = {}) => {
+  return (
+    Object.entries(obj)
+      // .filter((item) => !!item[1] || item[1] === false)
+      .filter((item) => item[1] !== undefined && item[1] !== null)
+      .reduce((pre, cur) => {
+        const [k, v] = cur;
+        // @ts-ignore
+        pre[k] = v;
+        return pre;
+      }, {})
+  );
+};
+
+/**
+ * 生成随机的莫兰迪色
+ * @returns
+ */
+export function generateRandomMorandiColor() {
+  const hue = Math.floor(Math.random() * 300) + 330; // 生成330-360之间的色调
+  const saturation = Math.floor(Math.random() * 10) + 40; // 生成40-50之间的饱和度
+  const lightness = Math.floor(Math.random() * 10) + 80; // 生成80-90之间的亮度
+
+  // 转换为HSL颜色格式字符串
+  const color = 'hsl(' + hue + ', ' + saturation + '%, ' + lightness + '%)';
+  return color;
+}
+
+/**
+ * data 转 from Data
+ * @param obj
+ * @returns
+ */
+export function objectToFormData(obj: IKeyValueItem) {
+  const formData = new FormData();
+
+  for (const key in obj) {
+    if (Object.hasOwn(obj, key)) {
+      formData.append(key, obj[key]);
+    }
+  }
+
+  return formData;
+}
+
+export const getOperateTitle = (type: OperateType) => {
+  switch (type) {
+    case OperateType.ADD:
+      return '新增';
+    case OperateType.EDIT:
+      return '编辑';
+    case OperateType.VIEW:
+      return '查看';
+    default:
+      return '';
+  }
+};

package/src/utils/workbench.ts

@@ -0,0 +1,25 @@
+import { ResponsiveProps } from '@/components/ResponsiveReactGridLayout';
+
+export const defaultResponsiveProps: ResponsiveProps = {
+  isResizable: false,
+  verticalCompact: true,
+  preventCollision: false,
+  cols: { lg: 6, md: 6, sm: 6, xs: 6, xxs: 2 },
+  margin: [16, 16],
+  rowHeight: 128,
+};
+
+export const CardSelectorDs = [
+  {
+    label: '指标类型',
+    value: 'INDICATOR',
+  },
+  {
+    label: '图表类型',
+    value: 'CHART',
+  },
+  {
+    label: '自定义卡片',
+    value: 'CUSTOM',
+  },
+];

package/tsconfig.json

@@ -0,0 +1,33 @@
+{
+  "compileOnSave": false,
+  "buildOnSave": false,
+  "compilerOptions": {
+    "experimentalDecorators": true,
+    "baseUrl": ".",
+    "outDir": "build",
+    "module": "esnext",
+    "target": "es2019",
+    "jsx": "react-jsx",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "allowSyntheticDefaultImports": true,
+    "lib": ["ES2022", "dom"],
+    "sourceMap": true,
+    "allowJs": true,
+    "rootDir": "./",
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitReturns": false,
+    "noImplicitThis": true,
+    "noImplicitAny": false,
+    "importHelpers": true,
+    "strictNullChecks": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "types": ["node"],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "build", "public"]
+}