vue2-client 1.17.3 → 1.17.4

package/src/utils/lowcode/lowcodeUtils.js

@@ -1,373 +1,373 @@
-// eslint-disable-next-line no-unused-vars
-import * as registeredConfig from './registerComponentForEditor'
-import { nanoid } from 'nanoid'
-
-// 随机id去除特定字符
-export function nanoidWithoutSymbol (size, without = '_') {
-  let result = nanoid(size)
-  while (result.includes(without)) {
-    result = nanoid(size)
-  }
-  return result
-}
-
-// 根据id获取组件定义的配置（在ForEditor中注册的配置）
-export function getEditorConfigById (componentId, config) {
-  if (config.page) {
-    config = config.page
-  }
-  const target = getComponentConfig(componentId, config)
-  return getEditorConfigByType(target.type)
-}
-
-// 根据类型获取组件定义的配置（在ForEditor中注册的配置）
-export function getEditorConfigByType (componentType) {
-  let result
-  const registeredConfigKeys = Object.keys(registeredConfig)
-  registeredConfigKeys.forEach(key => {
-    if (registeredConfig[key].type === componentType) {
-      result = registeredConfig[key]
-    }
-  })
-  return JSON.parse(JSON.stringify(result))
-}
-
-// 根据组件的id获取页面容器
-export function getPageByComponentID (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getPageByComponentID(id, item)
-          if (result) {
-            return result
-          }
-        }
-        if (item.id === id) {
-          return page
-        }
-      }
-    }
-  }
-}
-
-// 根据组件id获取当前行
-export function getRowByComponentId (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getRowByComponentId(id, item)
-          if (result) {
-            return result
-          }
-        }
-        if (item.id === id) {
-          return row
-        }
-      }
-    }
-  }
-}
-
-// 解析页面容器类型为中文
-export function resolvePageType (type) {
-  switch (type) {
-    case 'page':
-      return '页面'
-    case 'modal':
-      return '弹框'
-    case 'draw':
-      return '抽屉'
-  }
-}
-
-// 根据id获取配置
-export function getComponentConfig (componentId, config) {
-  if (config.page) {
-    config = config.page
-  }
-
-  for (let i = 0; i < config.length; i++) {
-    for (let j = 0; j < config[i].body.length; j++) {
-      const row = config[i].body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.id === componentId) {
-          return item
-        }
-        if (item.type === 'container_page') {
-          const result = getComponentConfig(componentId, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据ID获取页面容器
-export function getPageConfigById (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    if (page.id === id) {
-      return page
-    }
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getPageConfigById(id, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 获取容器页面外层容器
-export function getContainerPageOuterByContainerPageId (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    if (page.id === id) {
-      return config
-    }
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getContainerPageOuterByContainerPageId(id, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据组件ID获取行
-export function getRowConfigByComponentId (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    for (let j = 0; j < config.page[i].body.length; j++) {
-      const row = config.page[i].body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.id === id) {
-          return row
-        }
-        if (item.type === 'container_page') {
-          const result = getRowConfigByComponentId(id, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据容器页面ID获取外侧行
-export function getContainerPageRow (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    if (page.id === id) {
-      return true
-    }
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getContainerPageRow(id, item)
-          if (result) {
-            return row
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据组件ID获取组件在行中index
-export function getComponentInRowIndex (id, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    for (let j = 0; j < config.page[i].body.length; j++) {
-      const row = config.page[i].body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.id === id) {
-          return k
-        }
-        if (item.type === 'container_page') {
-          const result = getComponentInRowIndex(id, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据行ID获取行
-export function getRowConfigById (id, config) {
-  const lastIndex = id.lastIndexOf('_')
-  const rowIndex = id.substring(lastIndex + 1)
-  const pageId = id.substring(0, lastIndex)
-  const page = getPageConfigById(pageId, config)
-  let result = page.body[rowIndex]
-  if (result === undefined) {
-    config.page.forEach(page => {
-      page.body.forEach(row => {
-        row.body.forEach(item => {
-          if (item.type === 'container_page') {
-            result = getRowConfigById(id, item)
-            if (result) {
-              return result
-            }
-          }
-        })
-      })
-    })
-  } else {
-    return result
-  }
-}
-
-// 根据id获取配置，根据id的长度自动判断类型
-export function getConfig (id, config) {
-  let result
-  if ((id.startsWith('page') && id.length <= 11) || (id.startsWith('container_page') && id.length <= 17)) {
-    // page
-    result = getPageConfigById(id, config)
-  } else if ((id.startsWith('page') && id.length > 11) || (id.startsWith('container_page') && id.length > 17)) {
-    // row
-    result = getRowConfigById(id, config)
-  } else {
-    // component
-    result = getComponentConfig(id, config)
-  }
-  return result
-}
-
-// 取消选择所有容器
-export function unCheckAll (config) {
-  config.page.forEach(page => {
-    page.body.forEach(row => {
-      row.body.forEach(item => {
-        if (item.type !== 'container_page') {
-          item.selected = false
-        } else {
-          unCheckAll(item)
-        }
-      })
-    })
-  })
-}
-
-// 取消选择所有容器
-export function checkRowAll (row, config = undefined) {
-  if (config) {
-    unCheckAll(config)
-  }
-  row.body.forEach(item => {
-    if (item.type === 'container') {
-      item.selected = true
-    } else if (item.type === 'container_page') {
-      item.page.forEach(page => {
-        page.body.forEach(subRow => {
-          checkRowAll(subRow)
-        })
-      })
-    }
-  })
-}
-
-// 根据组件id获取它的name，如果没有name则返回id
-export function getComponentNameById (id, config) {
-  const targetConfig = getComponentConfig(id, config)
-  if (targetConfig.name) {
-    return targetConfig.name
-  } else {
-    return targetConfig.id
-  }
-}
-
-// 重新随机容器下所有子项目的ID
-export function reRandomComponentId (config) {
-  config.page.forEach(page => {
-    const pagePrefix = getIdPrefix(page.id)
-    const pageNewId = pagePrefix + '_' + nanoidWithoutSymbol(2)
-    page.id = pageNewId
-    for (let i = 0; i < page.body.length; i++) {
-      const row = page.body[i]
-      row.id = pageNewId + '_' + i
-      row.body.forEach(item => {
-        const itemPrefix = getIdPrefix(item.id)
-        item.id = itemPrefix + '_' + nanoidWithoutSymbol(6)
-      })
-    }
-  })
-  return config
-}
-
-// 获取id前传
-export function getIdPrefix (id) {
-  const lastIndex = id.lastIndexOf('_')
-  return id.substring(0, lastIndex)
-}
-
-// 根据rowID获取row
-export function getRowByRowId (pageId, rowIndex, config) {
-  for (let i = 0; i < config.page.length; i++) {
-    const page = config.page[i]
-    if (page.id === pageId) {
-      return page.body[rowIndex]
-    }
-    for (let j = 0; j < page.body.length; j++) {
-      const row = page.body[j]
-      for (let k = 0; k < row.body.length; k++) {
-        const item = row.body[k]
-        if (item.type === 'container_page') {
-          const result = getRowByRowId(pageId, rowIndex, item)
-          if (result) {
-            return result
-          }
-        }
-      }
-    }
-  }
-}
-
-// 根据行id，返回pageId和rowIndex
-export function getPageIdAndRowIndexByRowId (rowId) {
-  const lastIndex = rowId.lastIndexOf('_')
-  const pageId = rowId.substring(0, lastIndex)
-  const rowIndex = rowId.substring(lastIndex + 1)
-  return {
-    pageId: pageId,
-    rowIndex: rowIndex
-  }
-}
-
-// 返回一个容器
-export function newContainer (span = 24, selected = false) {
-  return {
-    type: 'container',
-    selected: selected,
-    span: span,
-    id: 'container_' + nanoidWithoutSymbol(6)
-  }
-}
+// eslint-disable-next-line no-unused-vars
+import * as registeredConfig from './registerComponentForEditor'
+import { nanoid } from 'nanoid'
+
+// 随机id去除特定字符
+export function nanoidWithoutSymbol (size, without = '_') {
+  let result = nanoid(size)
+  while (result.includes(without)) {
+    result = nanoid(size)
+  }
+  return result
+}
+
+// 根据id获取组件定义的配置（在ForEditor中注册的配置）
+export function getEditorConfigById (componentId, config) {
+  if (config.page) {
+    config = config.page
+  }
+  const target = getComponentConfig(componentId, config)
+  return getEditorConfigByType(target.type)
+}
+
+// 根据类型获取组件定义的配置（在ForEditor中注册的配置）
+export function getEditorConfigByType (componentType) {
+  let result
+  const registeredConfigKeys = Object.keys(registeredConfig)
+  registeredConfigKeys.forEach(key => {
+    if (registeredConfig[key].type === componentType) {
+      result = registeredConfig[key]
+    }
+  })
+  return JSON.parse(JSON.stringify(result))
+}
+
+// 根据组件的id获取页面容器
+export function getPageByComponentID (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getPageByComponentID(id, item)
+          if (result) {
+            return result
+          }
+        }
+        if (item.id === id) {
+          return page
+        }
+      }
+    }
+  }
+}
+
+// 根据组件id获取当前行
+export function getRowByComponentId (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getRowByComponentId(id, item)
+          if (result) {
+            return result
+          }
+        }
+        if (item.id === id) {
+          return row
+        }
+      }
+    }
+  }
+}
+
+// 解析页面容器类型为中文
+export function resolvePageType (type) {
+  switch (type) {
+    case 'page':
+      return '页面'
+    case 'modal':
+      return '弹框'
+    case 'draw':
+      return '抽屉'
+  }
+}
+
+// 根据id获取配置
+export function getComponentConfig (componentId, config) {
+  if (config.page) {
+    config = config.page
+  }
+
+  for (let i = 0; i < config.length; i++) {
+    for (let j = 0; j < config[i].body.length; j++) {
+      const row = config[i].body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.id === componentId) {
+          return item
+        }
+        if (item.type === 'container_page') {
+          const result = getComponentConfig(componentId, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据ID获取页面容器
+export function getPageConfigById (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    if (page.id === id) {
+      return page
+    }
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getPageConfigById(id, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 获取容器页面外层容器
+export function getContainerPageOuterByContainerPageId (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    if (page.id === id) {
+      return config
+    }
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getContainerPageOuterByContainerPageId(id, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据组件ID获取行
+export function getRowConfigByComponentId (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    for (let j = 0; j < config.page[i].body.length; j++) {
+      const row = config.page[i].body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.id === id) {
+          return row
+        }
+        if (item.type === 'container_page') {
+          const result = getRowConfigByComponentId(id, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据容器页面ID获取外侧行
+export function getContainerPageRow (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    if (page.id === id) {
+      return true
+    }
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getContainerPageRow(id, item)
+          if (result) {
+            return row
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据组件ID获取组件在行中index
+export function getComponentInRowIndex (id, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    for (let j = 0; j < config.page[i].body.length; j++) {
+      const row = config.page[i].body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.id === id) {
+          return k
+        }
+        if (item.type === 'container_page') {
+          const result = getComponentInRowIndex(id, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据行ID获取行
+export function getRowConfigById (id, config) {
+  const lastIndex = id.lastIndexOf('_')
+  const rowIndex = id.substring(lastIndex + 1)
+  const pageId = id.substring(0, lastIndex)
+  const page = getPageConfigById(pageId, config)
+  let result = page.body[rowIndex]
+  if (result === undefined) {
+    config.page.forEach(page => {
+      page.body.forEach(row => {
+        row.body.forEach(item => {
+          if (item.type === 'container_page') {
+            result = getRowConfigById(id, item)
+            if (result) {
+              return result
+            }
+          }
+        })
+      })
+    })
+  } else {
+    return result
+  }
+}
+
+// 根据id获取配置，根据id的长度自动判断类型
+export function getConfig (id, config) {
+  let result
+  if ((id.startsWith('page') && id.length <= 11) || (id.startsWith('container_page') && id.length <= 17)) {
+    // page
+    result = getPageConfigById(id, config)
+  } else if ((id.startsWith('page') && id.length > 11) || (id.startsWith('container_page') && id.length > 17)) {
+    // row
+    result = getRowConfigById(id, config)
+  } else {
+    // component
+    result = getComponentConfig(id, config)
+  }
+  return result
+}
+
+// 取消选择所有容器
+export function unCheckAll (config) {
+  config.page.forEach(page => {
+    page.body.forEach(row => {
+      row.body.forEach(item => {
+        if (item.type !== 'container_page') {
+          item.selected = false
+        } else {
+          unCheckAll(item)
+        }
+      })
+    })
+  })
+}
+
+// 取消选择所有容器
+export function checkRowAll (row, config = undefined) {
+  if (config) {
+    unCheckAll(config)
+  }
+  row.body.forEach(item => {
+    if (item.type === 'container') {
+      item.selected = true
+    } else if (item.type === 'container_page') {
+      item.page.forEach(page => {
+        page.body.forEach(subRow => {
+          checkRowAll(subRow)
+        })
+      })
+    }
+  })
+}
+
+// 根据组件id获取它的name，如果没有name则返回id
+export function getComponentNameById (id, config) {
+  const targetConfig = getComponentConfig(id, config)
+  if (targetConfig.name) {
+    return targetConfig.name
+  } else {
+    return targetConfig.id
+  }
+}
+
+// 重新随机容器下所有子项目的ID
+export function reRandomComponentId (config) {
+  config.page.forEach(page => {
+    const pagePrefix = getIdPrefix(page.id)
+    const pageNewId = pagePrefix + '_' + nanoidWithoutSymbol(2)
+    page.id = pageNewId
+    for (let i = 0; i < page.body.length; i++) {
+      const row = page.body[i]
+      row.id = pageNewId + '_' + i
+      row.body.forEach(item => {
+        const itemPrefix = getIdPrefix(item.id)
+        item.id = itemPrefix + '_' + nanoidWithoutSymbol(6)
+      })
+    }
+  })
+  return config
+}
+
+// 获取id前传
+export function getIdPrefix (id) {
+  const lastIndex = id.lastIndexOf('_')
+  return id.substring(0, lastIndex)
+}
+
+// 根据rowID获取row
+export function getRowByRowId (pageId, rowIndex, config) {
+  for (let i = 0; i < config.page.length; i++) {
+    const page = config.page[i]
+    if (page.id === pageId) {
+      return page.body[rowIndex]
+    }
+    for (let j = 0; j < page.body.length; j++) {
+      const row = page.body[j]
+      for (let k = 0; k < row.body.length; k++) {
+        const item = row.body[k]
+        if (item.type === 'container_page') {
+          const result = getRowByRowId(pageId, rowIndex, item)
+          if (result) {
+            return result
+          }
+        }
+      }
+    }
+  }
+}
+
+// 根据行id，返回pageId和rowIndex
+export function getPageIdAndRowIndexByRowId (rowId) {
+  const lastIndex = rowId.lastIndexOf('_')
+  const pageId = rowId.substring(0, lastIndex)
+  const rowIndex = rowId.substring(lastIndex + 1)
+  return {
+    pageId: pageId,
+    rowIndex: rowIndex
+  }
+}
+
+// 返回一个容器
+export function newContainer (span = 24, selected = false) {
+  return {
+    type: 'container',
+    selected: selected,
+    span: span,
+    id: 'container_' + nanoidWithoutSymbol(6)
+  }
+}