ibsp-fg-page 4.0.2

package/src/utils/index.js

@@ -0,0 +1,558 @@
+import { v4 as getUuid4 } from 'uuid';
+
+
+/**
+ *  Get ugetUuid
+ * @returns {string} ugetUuid
+ */
+export const getUuid = () => getUuid4()
+  .split('-')[0];
+
+
+/**
+ * 获取指定路径下的组件信息, 异步获取
+ * @param {*} moduleFiles  目录路径, 使用 import.meta.glob('./components/*\/option.js') 获取
+ * @returns
+ */
+export const getComponents = async (moduleFiles) => {
+  /**
+   *  获取模块函数
+   */
+  const getModule = async (moduleFiles) => {
+    return Object.keys(moduleFiles)
+      .map(async (key) => {
+        const res = await moduleFiles[key]();
+        const { default: d, ...more } = res
+        return { path: key, modules: d, ...more };
+      });
+  };
+  return Promise.all(await getModule(moduleFiles));
+};
+
+
+/**
+ *  处理数据, 将容器/组件的属性列表转换为对象数据
+ * @param {Array} propsList  属性列表
+ * @param {Object} options ................................
+ * @param {Boolean} [options.initDefaultConfig] 初始化默认配置
+ * @param {Object} [options.builtinComponents] ................................
+ */
+export const treePropsToData = (propsList, options = {}) => {
+  const {
+    initDefaultConfig = false,
+    builtinComponents = {}
+  } = options
+  const resData = {}
+  if (propsList && !Array.isArray(propsList)) {
+    return propsList
+  }
+  if (!propsList.length) {
+    return resData
+  }
+  for (let i = 0, j = propsList.length; i < j; i++) {
+
+    const item = propsList[i]
+
+    if (initDefaultConfig) {
+      if (item?.defaultConfig) {
+        if (item?.children) {
+          item.children = item?.defaultConfig
+        } else if (item?.tabChildren) {
+          item.tabChildren = item?.defaultConfig
+        }
+      }
+    }
+
+    if (!item.componentProps && item.props) {
+      item.componentProps = item.props
+    }
+
+    if (!item.componentType && item.type) {
+      item.componentType = item.type
+    }
+    if (!item.componentEvent && item.event) {
+      item.componentEvent = item.event
+    }
+
+    // 处理有children子项的数据
+    if (item.children && item.children.length) {
+      resData[item.key] = treePropsToData(item.children, options)
+      continue
+    }
+    if (item.tabChildren) {
+      resData[item.key] = treePropsToData(item.tabChildren, options)
+      continue
+    }
+
+    if (item?.builtinComponentType) {
+      //
+      resData[item.key] = builtinComponents[item?.builtinComponentType]?.configValue?.() || {}
+      continue
+    }
+
+    if (item.componentProps?.expression) {
+      resData[item.key] = {
+        value: resData[item.key] ?? item.value,
+        expression: []
+      }
+    } else {
+    // 处理有slots子项的数据
+      resData[item.key] = item.value
+    }
+
+  }
+  return resData
+}
+
+/**
+ *  将对象数据转换为配置项
+ * @param data 对象数据
+ * @param {Array} originalProps 原始配置项
+ * @param {Boolean} isFillOriginalConfig 是否填充原始配置项
+ */
+export const objDataToConfigs = (data, originalProps, isFillOriginalConfig = true) => {
+  if (!originalProps || !originalProps.length) {
+    return data
+  }
+  /**
+   *  处理配置项
+   * @param {Array} propsList  配置项列表
+   * @param {Object} currentData 当前数据
+   */
+  const loophandleProps = (propsList, currentData) => {
+    return propsList.map(item => {
+      const value = currentData[item.key]
+      if (value === undefined || value === null) {
+        return isFillOriginalConfig ? item : null
+      }
+      const res = {
+        ...item,
+        value
+      }
+      if (item.children && item.children.length) {
+        res.children = loophandleProps(item.children, currentData[item.key]) || []
+      }
+      return res
+    }).filter(Boolean)
+  }
+  return loophandleProps(originalProps, data)
+}
+
+
+/**
+ * 将组件配置项转换为数据
+ * @param {Array} configList 组件配置项
+ */
+export const componentDataConfigToData = (configList) => {
+  if (!Array.isArray(configList) || !configList?.length) {
+    return []
+  }
+  return configList.map(item => {
+    return {
+      ...item,
+      baseComponentFields: {},
+      baseConfig: treePropsToData(item.baseConfig),
+      children: item.children.map(i => {
+        return {
+          ...i,
+          components: treePropsToData(i.components)
+        }
+      })
+    }
+  })
+
+}
+/**
+ *  将数据转换为组件配置项
+ * @param {Array} data 接口数据
+ * @param {Array} originalConfig 原始配置项
+ */
+export const componentDataToConfig = (data, originalConfig) => {
+
+  if (!Array.isArray(data) || !data?.length) {
+    return originalConfig
+  }
+
+  const dataMap = data.reduce((pre, cur) => {
+    pre[cur.key] = cur
+    return pre
+  }, {})
+
+  for (let i = 0, j = originalConfig.length; i < j; i++) {
+    const originalItem = originalConfig[i]
+    const currentItem = dataMap[originalItem.key]
+    if (!currentItem) {
+      data.splice(i, 0, originalItem)
+      continue
+    }
+    const baseComponentFields = originalItem.baseComponentFields
+    currentItem.baseComponentFields = baseComponentFields
+    currentItem.baseConfig = objDataToConfigs(currentItem.baseConfig, originalItem.baseConfig)
+    currentItem.children = currentItem.children.map(item => {
+      return {
+        ...item,
+        components: objDataToConfigs(item.components, baseComponentFields)
+      }
+    })
+  }
+  return data
+}
+
+
+/** */
+export const dataBusAgent = ()=>{
+  let eventCallback = {}
+  return {
+    /** */
+    on: (name, callback) => {
+      eventCallback[name] = callback
+    },
+    /** */
+    emit: (name, data) => {
+      eventCallback[name]?.(data)
+    }
+  }
+}
+
+
+/**
+ * 获取配置项的属性
+ * @param {String} attrName 查询的属性名， 这里的属性名是由多个属性名组成的，
+ *  例如： 'baseConfig styleConfig' 代表查询 baseConfig 下面 styleConfig 的属性, 主要类型为config配置项后面的属性名必须是chlildren下面的
+ * @param {'config', 'configValue'} attrType 属性类型
+ * @param {'props', 'slots'} attrCategory 属性分类
+ *
+ *
+ */
+export const getConfigAttr = ({
+  queryAttrName,
+  attrType = 'config',
+  attrCategory = 'props',
+  activeComponent,
+  isGetParent = false
+})=>{
+
+  if (attrCategory.includes(['props', 'data'])) {
+    return new Error(attrCategory + '属性分类暂不支持')
+  }
+  const attrNames = queryAttrName.split(' ')
+  const attrNameLen = attrNames.length
+  if (attrType === 'config') {
+    const componentConfigList = activeComponent?.componentConfig?.[attrCategory]
+
+
+    /**
+     *  递归查找属性名
+     */
+    const findConfigAttrName = (configList, attrNames, i, attrNameLen) => {
+
+      for (let index = 0, len = configList?.length; index < len; index++) {
+        const item = configList[index];
+        if (item.key === attrNames[i]) {
+          if (i === attrNameLen - 1) {
+            return isGetParent ? configList : item
+          }
+          return findConfigAttrName(item.children, attrNames, i + 1, attrNameLen)
+        }
+        if (item?.children?.length) {
+          const res = findConfigAttrName(item.children, attrNames, i, attrNameLen)
+          if (res) {
+            return res
+          }
+        }
+        if (item?.tabChildren?.length) {
+          const res = findConfigAttrName(item.tabChildren, attrNames, i, attrNameLen)
+          if (res) {
+            return res
+          }
+        }
+      }
+    }
+
+    return findConfigAttrName(componentConfigList, attrNames, 0, attrNameLen)
+
+
+  }
+  if (attrType === 'configValue') {
+    const componentValue = activeComponent?.componentValue?.[attrCategory]
+    /**
+     * 查找属性值
+    */
+    const findConfigValueAttrName = (configValue, attrNames, i, attrNameLen) => {
+
+      const keys = Object.keys(configValue)
+      for (let index = 0, len = keys?.length; index < len; index++) {
+        const key = keys[index];
+        if (key === attrNames[i]) {
+          if (i === attrNameLen - 1) {
+            if (isGetParent) {
+              return configValue
+            }
+            return configValue[key]
+          }
+          return findConfigValueAttrName(configValue[key], attrNames, i + 1, attrNameLen)
+        }
+
+        if ((typeof configValue[key] === 'object') && configValue[key] !== null) {
+          const res = findConfigValueAttrName(configValue[key], attrNames, i, attrNameLen)
+          if (res) {
+            return res
+          }
+        }
+      }
+
+    }
+    return findConfigValueAttrName(componentValue, attrNames, 0, attrNameLen)
+
+  }
+
+  return
+
+}
+
+/**
+ *  获取组件的属性值
+ * @param {*} component
+ * @param {*} attrName
+ * @param {*} isGetParent
+ */
+export const getConfigValue = (configValues, attrName, isGetParent = false) => {
+
+
+  // const componentValue = component?.componentValue?.[attrCategory]
+  // /**
+  //  * 查找属性值
+  // */
+  // const findConfigValueAttrName = (configValue, attrNames, i, attrNameLen) => {
+
+  //   const keys = Object.keys(configValue)
+  //   for (let index = 0, len = keys?.length; index < len; index++) {
+  //     const key = keys[index];
+  //     if (key === attrNames[i]) {
+  //       if (i === attrNameLen - 1) {
+  //         if (isGetParent) {
+  //           return configValue
+  //         }
+  //         return configValue[key]
+  //       }
+  //       return findConfigValueAttrName(configValue[key], attrNames, i + 1, attrNameLen)
+  //     }
+
+  //     if ((typeof configValue[key] === 'object') && configValue[key] !== null) {
+  //       const res = findConfigValueAttrName(configValue[key], attrNames, i, attrNameLen)
+  //       if (res) {
+  //         return res
+  //       }
+  //     }
+  //   }
+
+  // }
+  // return findConfigValueAttrName(componentValue, attrNames, 0, attrNameLen)
+
+
+}
+
+
+/**
+ *  将树形结构的配置项转换为扁平化的数据
+ * @param {*} configList
+ * @returns
+ */
+export const treePropsToFlatData = (configList)=>{
+  if (!configList?.length) {
+    return
+  }
+
+  const resData = {
+    basis: {}
+  }
+
+  /** */
+  const loop = (configList, rowData = {}) => {
+
+    for (let i = 0, j = configList.length; i < j; i++) {
+
+      const item = configList[i]
+
+      // 处理有children子项的数据
+      if (item?.children?.length) {
+        if (resData[item.key]) {
+          throw new Error('配置项的key值重复:' + item.key)
+        }
+        resData[item.key] = loop(item.children)
+        continue
+      }
+      // tabChildren
+      if (item.tabChildren?.length) {
+        if (resData[item.key]) {
+          throw new Error('配置项的key值重复:' + item.key)
+        }
+        resData[item.key] = loop(item.tabChildren)
+        continue
+      }
+
+      rowData[item.key] = item.value
+    }
+    return rowData
+
+  }
+
+
+  for (let i = 0, j = configList.length; i < j; i++) {
+
+    const item = configList[i]
+
+    // 处理有children子项的数据
+    if (item?.children?.length) {
+      resData[item.key] = loop(item.children)
+      continue
+    }
+    // tabChildren
+    if (item.tabChildren?.length) {
+      resData[item.key] = loop(item.tabChildren)
+      continue
+    }
+
+    resData.basis[item.key] = item.value
+  }
+
+  return resData
+
+
+}
+
+
+/**  */
+export const getRegExpValue = (value, regExp = /#{(.*?)}/)=>{
+  if (typeof value !== 'string') {
+    return value
+  }
+  if (!(regExp.test(value))) {
+    return value
+  }
+  return value.match(regExp)[1]
+}
+
+/**
+ *
+ * @returns Windows | MacOS | Android | Windows Phone | iOS | Unknown
+ */
+export const detectOS = ()=> {
+  const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+  const platform = navigator.platform.toLowerCase();
+  if (/windows phone/i.test(userAgent)) {
+    return 'Windows Phone';
+  }
+  if (/windows/i.test(userAgent)) {
+    return 'Windows';
+  }
+  if (/macintosh|mac os x/i.test(userAgent) || platform.includes('mac')) {
+    return 'MacOS';
+  }
+  if (/iphone|ipad|ipod/i.test(userAgent) || platform.includes('iphone') || platform.includes('ipad') || platform.includes('ipod')) {
+    return 'iOS';
+  }
+  if (/android/i.test(userAgent)) {
+    return 'Android';
+  }
+  return 'Unknown';
+}
+
+/**
+ * 检查剪贴板权限
+ * @returns {Promise<{hasWritePermission: boolean,
+ *  hasReadPermission: boolean
+ * }>}
+ */
+export async function checkClipboardPermissions() {
+  try {
+    const writePermission = await navigator.permissions.query({ name: 'clipboard-write' });
+    const readPermission = await navigator.permissions.query({ name: 'clipboard-read' });
+
+    const hasWritePermission = writePermission.state === 'granted';
+    const hasReadPermission = readPermission.state === 'granted';
+    return hasReadPermission && hasWritePermission;
+  } catch (error) {
+    console.error('Error checking clipboard permissions:', error);
+    return false
+  }
+}
+
+/**
+ * 获取地址栏参数
+ */
+export function getWindowQuery (w) {
+  const _window = w || window;
+  const arr1 = decodeURI(_window.location.toString()).split('?');
+  const obj = {}
+  if (arr1.length > 1) {
+    const arr2 = arr1[1].split('&');
+    for (const element of arr2) {
+      const [key, value] = element.split('=') || [];
+      obj[key] = decodeURIComponent(value)
+    }
+  }
+  return obj
+}
+
+export function getUrlParameter(template) {
+  // 获取当前页面的 URL 路径
+  const urlPath = window.location.pathname;
+
+  // 构造正则表达式用于匹配参数
+  const paramNames = [];
+  const regexPath = template.replace(/:([^/]+)/g, (_, paramName) => {
+    paramNames.push(paramName);
+    return '([^/]+)';
+  });
+
+  // 使用正则表达式匹配 URL 路径
+  const regex = new RegExp(`^${regexPath}(?:/([^/]+))*$`);
+  const match = urlPath.match(regex);
+
+  // 如果没有匹配到，返回 null
+  if (!match) return null;
+
+  // 提取匹配到的参数值
+  const params = {};
+  paramNames.forEach((name, index) => {
+    params[name] = match[index + 1];
+  });
+
+  return params;
+}
+
+
+// 判断是否为移动端
+export function isMobile() {
+  const userAgentInfo = navigator.userAgent
+  const Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod']
+  const getArr = Agents.filter(i => userAgentInfo.includes(i))
+  return !!getArr.length
+}
+
+
+export function toTreeData(data, _fun, options = {
+  id: 'id',
+  pid: 'pid',
+  children: 'children'
+}) {
+  if (!data?.length) {
+    return []
+  }
+  const fun = typeof _fun === 'function' ? _fun : (item) => item
+
+  const { id = 'id', pid = 'pid', children = 'children' } = options || {}
+
+  let cloneData = JSON.parse(JSON.stringify(data.map(item => fun({ ...item }))));
+  return cloneData.filter((father)=>{
+    let branchArr = cloneData.filter((child)=>{
+      return father[id] === child[pid]
+    });
+    if (branchArr.length > 0) {
+      father[children] = branchArr;
+    }
+    return !father[pid];
+  });
+
+}

package/src/utils/request.js

@@ -0,0 +1,82 @@
+import axios from 'axios';
+import { v4 as uId4 } from 'uuid';
+import { ElMessage, ElMessageBox } from 'element-plus';
+
+import useEnv from '@/hooks/useEnv';
+import { emitGlobalEvent } from '@/models/useGlobalEvents';
+
+const request = axios.create({
+  baseURL: useEnv('IBSP_APP_BASE_API'),
+  timeout: 1000 * 60
+});
+
+const mode = useEnv('IBSP_APP_MODE')
+
+// 请求拦截器
+request.interceptors.request.use(
+  config => {
+    // 在发送请求之前做些什么
+    config.headers['X-Token'] = localStorage.getItem('ibsp_token');
+    config.headers['Web-Trace-Id'] = uId4()
+    return config;
+  },
+  error => {
+    emitGlobalEvent('requestError', error)
+    // 对请求错误做些什么
+    return Promise.reject(error);
+  }
+);
+let isConfirming = false;
+const loginConfirmation = () => {
+  if (isConfirming) return;
+  isConfirming = true;
+  // if (['/builtin/windowLogin', '/builtin/mobileLogin'].includes(window.location.pathname)) {
+  //   return;
+  // }
+  emitGlobalEvent('loginExpired')
+  // ElMessageBox.alert('登录已过期，请重新登录', '提示', {
+  //   confirmButtonText: '确定',
+  //   callback: (res) => {
+  //     // 跳转平台登录页
+  //     // 这里临时添加一个登录页, 用于开发测试, 后期需要删除
+  //     isConfirming = false;
+  //     if (res === 'confirm') {
+  //       emitGlobalEvent('loginExpired')
+  //     }
+  //   }
+  // });
+}
+
+
+// 响应拦截器
+request.interceptors.response.use(
+  response => {
+    // 对响应数据做点什么
+    if (response.data.code === 20000) {
+      return response.data;
+    } else if ([401, 402, 40001, 40002].includes(response.data.code)) {
+      emitGlobalEvent('validateError', response)
+      emitGlobalEvent('responseError', response)
+      if (mode !== 'temp') {
+        loginConfirmation();
+      }
+      throw new Error('登录过期');
+    } else {
+      if (response.config.headers['Ibsp-Error-Catch'] === false) {
+        return response.data;
+      }
+      // 统一消息提示
+      emitGlobalEvent('responseError', response)
+      ElMessage.error(`错误状态码: ${response.data.code} \n 错误信息: ${response.data.message?.length > 200 ? response.data.message?.slice(0, 300) + '...' : response.data.message}`);
+      console.error(`错误状态码: ${response.data.code} \n 错误信息: ${response.data.message?.length > 200 ? response.data.message?.slice(0, 300) + '...' : response.data.message}}`);
+      return Promise.reject(response.data);
+    }
+  },
+  error => {
+    emitGlobalEvent('responseError', error)
+    ElMessage.error(error.message);
+    return Promise.reject(error);
+  }
+);
+
+export default request;

package/src/utils/toolFuns.ts

@@ -0,0 +1,11 @@
+
+/**
+ *  处理px类型的值
+ * @param val  传入的值
+ * @returns  返回值
+ */
+export const transformPXType = (val:unknown)=>{
+  return (typeof val === 'number' || !isNaN(val as number)) ? `${val}px` : val
+}
+
+