@steedos/steedos-plugin-schema-builder 2.6.1-beta.7 → 2.6.2-beta.3

package/webapp/src/index.tsx

@@ -1,25 +0,0 @@
-import React from 'react'
-import WebPdmPage from './page'
-import Pdm from './pdm'
-import { Tree } from './tree'
-export * from './type'
-import DvaModel from './page/dva-model'
-import { ErdPage } from './g6/model'
-import './style.less'
-
-export {
-  DvaModel,
-  ErdPage
-}
-
-const useAppContext = () => ({
-  tabsRouteContext: {
-    current: '/',
-  },
-  shellContext: {
-    setState: () => ({}),
-  },
- })
-export default (props) => {
-    return <WebPdmPage ErdPage={ErdPage} Pdm={Pdm} Tree={Tree} useAppContext={useAppContext} {...props} />
-}

package/webapp/src/page/dva-model/index.tsx

@@ -1,70 +0,0 @@
-
-import {  arrangeShow, init, load , modelEdit, modelReducers, onExpand  } from './reducer'
-import { initStyle } from './style'
-export interface IDict<T> {
-  [name: string]: T
-}
-
-const fieldMap = (m) => ({
-  key: m.key,
-  name: m.name,
-  moduleKey: m.moduleKey,
-  fields: Object.entries(m.fields).map(([k, v]: [string, any]) => ({
-    type: v.type,
-    key: v.key,
-    name: v.name,
-    originalKey: v.originalKey,
-    required: v.required,
-
-    typeMeta: v.typeMeta && {
-      type: v.typeMeta.type,
-      relationModel: v.typeMeta.relationModel,
-    },
-  })),
-  originalKey: m.originalKey,
-  aggregateRoot: m.aggregateRoot,
-  belongAggregate: m.belongAggregate,
-  // aggregateRoot:  m.aggregateRoot,
-  aggregateModelKey: m.aggregateModelKey,
-  type: m.type,
-})
-
-export default (({
-  namespace,
-}) => {
-  const { style, colors } = initStyle({primaryColor: 'black'})
-  const state = {
-     modules: [],
-     models: [],
-     showModel: null,
-     lockMinZoom: false,
-     showInsertModel: null,
-     currentModel: null,
-     expandedKeys: [],
-     checkedKeys: [],
-     centerModel: null,
-     search: null,
-     layouting : false,
-     isArrangeLayout: false,
-     fieldMap,
-     showNameOrLabel: false,
-     config : {
-      style,
-      namespace: 'erd',
-      topHeight: 48,
-      colors,
-     },
-    }
-  return {
-    namespace,
-    state,
-    reducers: {
-      onExpand,
-      modelEdit,
-      ...modelReducers,
-      arrangeShow,
-      init,
-      load,
-    },
-  }
-})

package/webapp/src/page/dva-model/reducer/arrange.tsx

@@ -1,16 +0,0 @@
-const getLayerRootModel = (models, rootKey, roots = []) => {
-  const rootModel = models.find((a) => a.key === rootKey)
-  const rootsRes = rootModel ? [...roots, rootKey] : roots
-  const isRoot = (rootModel.aggregateModelKey && rootModel.aggregateModelKey !== rootKey)
-  const rootsResList = isRoot ? getLayerRootModel(models, rootModel.aggregateModelKey, rootsRes) : rootsRes
-  return rootsResList
- }
-
-export const arrangeShow = (ss, {model}) => {
-  // alert(model)
-  const roots = getLayerRootModel(ss.models, model, [])
-  // alert(JSON.stringify(roots))
-  const list = ss.models.filter((a) => (a.key === model ||  roots.indexOf(a.aggregateModelKey) >= 0)).map((a) => 'model-' + a.key)
-  return {...ss , checkedKeys: list, currentModel: model, isArrangeLayout: true}
-
-}

package/webapp/src/page/dva-model/reducer/index.tsx

@@ -1,7 +0,0 @@
-export * from './on-expand'
-export * from './arrange'
-import * as modelReducers from './model'
-export * from './init'
-export {
-  modelReducers,
-}

package/webapp/src/page/dva-model/reducer/init.tsx

@@ -1,61 +0,0 @@
-import Immer from 'immer'
-import { initStyle } from '../style'
-
-// const modules_name = 'modules'
-// const models_name = 'models'
-// const model_key = 'key'
-// const module_key = 'key'
-
-export const init = (ss, {
-  models,
-  modules,
-  currentModel,
-  primaryColor,
-}) => {
-  // tslint:disable-next-line: ban-comma-operator
-  return Immer(ss, (s) => {
-    s.currentModel = currentModel
-
-    if (models) {
-      s.models = models
-      s.checkedKeys = models.map((m) => 'model-' + m.key)
-    }
-
-    if (modules) {
-      s.modules = modules
-      s.expandedKeys = ['allmodels', ...modules.map((module) => 'module-' + module.key)]
-    }
-    if (primaryColor) {
-       const { style , colors } = initStyle({primaryColor})
-       s.config.style = style
-       s.config.colors = colors
-    }
-  })
-}
-
-export const load = (ss, {
-  models,
-  modules,
-  currentModel,
-  primaryColor,
-}) => {
-  // tslint:disable-next-line: ban-comma-operator
-  return Immer(ss, (s) => {
-    s.currentModel = currentModel
-
-    if (models) {
-      s.models = [...s.models, ...models]
-      s.checkedKeys = [...models.map((m) => 'model-' + m.key), ...s.checkedKeys]
-    }
-
-    if (modules) {
-      s.modules = [...s.modules, ...modules]
-      s.expandedKeys = [...s.expandedKeys, 'allmodels', ...modules.map((module) => 'module-' + module.key)]
-    }
-    if (primaryColor) {
-       const { style , colors } = initStyle({primaryColor})
-       s.config.style = style
-       s.config.colors = colors
-    }
-  })
-}

package/webapp/src/page/dva-model/reducer/model.tsx

@@ -1,126 +0,0 @@
-import _ from 'lodash'
-export const layouting = (sss, arg) => {
-  return { ...sss, layouting: arg.layouting }
-}
-
-export const setArrangeLayout = (sss, { isArrangeLayout }) => {
-  return { ...sss, isArrangeLayout }
-}
-
-export const openInsertModel = (ss) => {
-  return { ...ss, showInsertModel: 'new' }
-}
-export const centerModel = (ss, { model }) => {
-
-  if (!ss.checkedKeys.find((a) => a === model)) {
-    return { ...ss, currentModel: model, checkedKeys : [...ss.checkedKeys, model ], centerModel: model }
-  } else {
-  // alert(model)
-    return { ...ss, currentModel: model , centerModel: model }
-  }
-}
-export const currentModel = (ss, { model }) => {
-  //  return ss
-  //  alert(JSON.stringify(ss.checkedKeys))
-   if (!ss.checkedKeys.find((a) => a === model)) {
-    return { ...ss, currentModel: model, checkedKeys : [...ss.checkedKeys, model ] }
-  } else {
-    // alert(model)
-    return { ...ss, currentModel: model }
-  }
-}
-export const closeModel = (ss) => {
-  return { ...ss, showModel: null }
-}
-
-export const delModel = (ss, { model }) => {
-  // alert(model)
-  // if( model === ss.currentModel) {
-  //   return {  ...ss    }
-  // }
-  // return { ...ss, showModel: null }
-
-  const models = ss.models.filter((a) =>  (('model-' + a.key) !== model))
-  return {  ...ss , models , checkedKeys : ss.checkedKeys.filter((a) => a !== model), currentModel : undefined}
-
-}
-
-export const delModule = (ss, { model }) => {
-  // alert(model)
-  // if( model === ss.currentModel) {
-  //   return {  ...ss    }
-  // }
-  // return { ...ss, showModel: null }
-  const modules = ss.modules.filter((a) => ('module-' + a.key) !== model)
-  const models = ss.models.filter((a) =>  (('module-' + a.moduleKey) !== model))
-  return {  ...ss , models , modules,  checkedKeys : ss.checkedKeys.filter((a) => a !== model), currentModel : undefined}
-
-}
-
-export const closeInsertModel = (ss) => {
-  return { ...ss, showInsertModel: null }
-}
-
-export const onCheck = (ss, { checkKeys }) => {
-  if (checkKeys && checkKeys.find && checkKeys.find((ck) => ck === ss.currentModel)) {
-    return { ...ss,
-             checkedKeys: checkKeys,
-             currentModel: null,
-    }
-  } else return { ...ss,
-                  checkedKeys: checkKeys,
-  }
-}
-export const search = (ss, { text }) => {
-  return { ...ss,
-           search: text,
-           currentModel: null,
-  }
-}
-
-export const onCheckByModule = (ss, { checkKeys, moduleKey}) => {
-  const modelsElse = ss.models.filter((a) =>  !!moduleKey && ((a.moduleKey) !== moduleKey)).map(a=>'model-'+a.key)
-  const modelFIlterElse = _.intersection(ss.checkedKeys, modelsElse)
-  const checkedKeys = [...modelFIlterElse, ...checkKeys]
-  return { ...ss,
-    checkedKeys,
-    currentModel: checkedKeys.find(k => k === ss.currentModel) ? ss.currentModel : null,
-  }
-}
-
-export const onCheckByModuleAll = (ss, { moduleKey }) => {
-  const modelsElse = ss.models.filter((a) =>  !!moduleKey && ((a.moduleKey) !== moduleKey)).map(a=>'model-'+a.key)
-  const modelFIlterElse = _.intersection(ss.checkedKeys, modelsElse)
-  const modelsKeys = ss.models.filter((a) =>  !moduleKey || ((a.moduleKey) === moduleKey)).map(a=>'model-'+a.key)
-  const checkedKeys = [...modelFIlterElse, ...modelsKeys]
-  return { ...ss,
-    checkedKeys,
-    currentModel: checkedKeys.find(k => k === ss.currentModel) ? ss.currentModel : null,
-  }
-}
-
-export const onCheckByModuleAllCancle = (ss, { moduleKey }) => {
-  const modelsElse = ss.models.filter((a) =>  !!moduleKey && ((a.moduleKey) !== moduleKey)).map(a=>'model-'+a.key)
-  const modelFIlterElse = _.intersection(ss.checkedKeys, modelsElse)
-  // const modelsKeys = ss.models.filter((a) =>  !moduleKey || ((a.moduleKey) === moduleKey)).map(a=>'model-'+a.key)
-  const checkedKeys = [...modelFIlterElse]
-  return { ...ss,
-    checkedKeys,
-    currentModel: checkedKeys.find(k => k === ss.currentModel) ? ss.currentModel : null,
-  }
-}
-
-export const lockMinZoom = (ss, { lockMinZoom }) => {
-  //  alert(lockMinZoom)
-  return {
-    ...ss,
-    lockMinZoom
-  }
-}
-
-export const showNameOrLabel = (ss, {showNameOrLabel}) => {
-  return {
-    ...ss,
-    showNameOrLabel
-  }
-}

package/webapp/src/page/dva-model/reducer/on-expand.tsx

@@ -1,27 +0,0 @@
-import Immer from 'immer'
-
-export const onExpand  =  (ss, { expanded, node }) => {
-  const resData = Immer(ss, (s) => {
-    // tslint:disable-next-line: prefer-conditional-expression
-    if (expanded) {
-      s.expandedKeys = [...s.expandedKeys, node.props.eventKey]
-    } else {
-      s.expandedKeys = s.expandedKeys.filter((a) => a !== node.props.eventKey)
-    }
-  })
-  return resData
-}
-
-export const openModel = (ss) => {
-  return { ...ss,
-           showModel: ss.currentModel,
-  }
-}
-
-export const modelEdit  = (ss, {
-  model,
-}) => {
-  return { ...ss,
-           showModel: model,
-  }
-}

package/webapp/src/page/dva-model/style.tsx

@@ -1,88 +0,0 @@
-
-export  const initStyle = ({primaryColor}) => {
-   const colors = {
-    // blue : '#495D9E',
-
-    // get blue() {
-    //   const res = (window.SYS_backEndConfig && window.SYS_backEndConfig.STYLE_PRIMARY_COLOR)  || '#495D9E'
-    //   if (_styleConfigLazy) {
-    //   _styleConfigLazy.selected.node.stroke = res
-    //   _styleConfigLazy.default.edge.stroke = res
-    //  }
-    //   return res
-    // // #0083EE
-    // },
-    // blue : window.SYS_backEndConfig && window.SYS_backEndConfig.PRESET_CSS_URL  ? '#0083EE' : '#495D9E',
-    // #0083EE
-    blue: primaryColor,
-    white: '#FFFFFF',
-    head: 'rgba(7,10,26,0.06)',
-    black: 'black',
-  }
-
-   const style = {
-    naviWidth: 370,
-    default: {
-      node: {
-        fill: '#FFFFFF',
-        // shadowColor: 'rgba(0,0,0,0.06)',
-        shadowBlur: 15,
-        shadowOffsetX: 8,
-        shadowOffsetY: 8,
-        radius: 10,
-        // stroke: undefined,
-        lineWidth: 4 ,
-        opacity: 0.8,
-        stroke: 'black',
-      },
-      edge: {
-        lineWidth: 2,
-        size: 2,
-        lineAppendWidth: 4,
-        endArrow: {
-          path: 'M 6,0 L -6,-6 L -3,0 L -6,6 Z',
-          d: 4,
-        },
-        opacity: 0.2,
-        radius: 5,
-        labelCfg: {
-          autoRotate: true,   // 使文本随边旋转
-          style: {
-            fontSize: 34,
-          },
-        },
-        stroke: 'rgba(11,108,149)',
-      },
-    },
-    inactive: {
-      edge: {
-        stroke: 'red',
-      }
-    },
-    selected: {
-      node: {
-        stroke: 'rgba(11,108,149)',
-      },
-    },
-    active: {
-      edge: {
-        stroke: 'red',
-      }
-    },
-    noSelected: {
-      node: {
-        stroke: 'red',
-      },
-    },
-    isNoModule : {
-      node: {
-        opacity: 0.2,
-      },
-    },
-  }
-
-   return {
-    colors,
-    style,
-  }
-}

package/webapp/src/page/hooks/callback.tsx

@@ -1,54 +0,0 @@
-import { useCallback, useEffect, useRef } from 'react'
-import Stats from 'stats.js'
-export const useLoadData = ({
-  dispatch,
-  namespace,
-  getModels,
-  getModules,
-  primaryColor,
-}) => {
-  const loadData = useCallback(() => {
-    if (getModels && getModules) {
-      const fun = async () => {
-        const data = await getModels({})
-        const modules = await getModules({})
-        dispatch({
-          type: `${namespace}/init`,
-          modules: modules.res,
-          models: data.res,
-          primaryColor,
-        })
-      }
-
-      fun()
-    }
-  }, [dispatch, getModels, getModules])
-  return {
-    loadData,
-  }
-}
-export const useFpsHook = () => {
-  const fpsRef = useRef(null)
-  useEffect(() => {
-    if (fpsRef.current && window.SYS_backEndConfig && window.SYS_backEndConfig.ERD_FPS) {
-      const stats = new Stats() // alert(stats.dom)
-
-      stats.showPanel(0) // 0: fps, 1: ms, 2: mb, 3+: custom
-
-      fpsRef.current.appendChild(stats.dom)
-      stats.dom.style.position = 'relative'
-
-      function animate() {
-        stats.begin() // monitored code goes here
-
-        stats.end()
-        requestAnimationFrame(animate)
-      }
-
-      requestAnimationFrame(animate)
-    }
-  }, [])
-  return {
-    fpsRef,
-  }
-}

package/webapp/src/page/hooks/fullscreen.tsx

@@ -1,34 +0,0 @@
-
-import React, {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react'
-
-export const usefullScreen = (useAppContext) => {
-  const { shellContext, tabsRouteContext } = useAppContext()
-  const [layouted, setLayouted] = useState(false)
-  const [change, setChange] = useState(false)
-  useEffect(() => {
-    shellContext.setState({
-      fullScreen: true,
-    })
-    setLayouted(true)
-  }, [])
-  useEffect(() => {
-    shellContext.setState({
-      fullScreen: tabsRouteContext.current === '/model-map',
-    })
-    return () => {
-      shellContext.setState({
-        fullScreen: false,
-      })
-    }
-  }, [tabsRouteContext.current === '/model-map'])
-  return {
-    layouted,
-    change,
-  }
-}

package/webapp/src/page/hooks/pagehooks.tsx

@@ -1,127 +0,0 @@
-import { useDispatch, useSelector } from '../../hook'
-import React, {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react'
-// import { modelConfig } from '../config'
-import { createLinks, getNodes, layOutNodesByG6  } from '../util'
-import { usefullScreen } from './fullscreen'
-
-export const useLocalHooks = ({namespace, useAppContext}) => {
-  const graphRef = useRef(null)
-  // const { shellContext  } = useAppContext()
-  // const { loadData } =  useLoadData({dispatch , getTrantorMetaAllModels, getTrantorMetaModules})
-
-  const { layouted, change } = usefullScreen(useAppContext)
-  const {
-    models,
-    modules,
-    checkedKeys,
-    showModel,
-    currentModel,
-    showInsertModel,
-    search,
-    layouting,
-    isArrangeLayout,
-    fieldMap,
-    config: { topHeight, style, colors },
-  } = useSelector((s) => s[namespace])
-  const newModels = useMemo(() => models.map(fieldMap).map((a) => ({...a, isShow: (!search || a.name.indexOf(search) >= 0)})), [
-    models, search, checkedKeys,
-  ])
-
-  const [height] = useState(
-    document.documentElement.clientHeight ||
-      document.body.clientHeight - topHeight,
-  )
-  const [nodeState, setNodeState] = useState([])
-  const [edgeState, setEdgeState] = useState([])
-  const nodes = getNodes(newModels, checkedKeys, style)
-
-  const edgesRes = createLinks(
-      newModels,
-      nodes,
-      checkedKeys,
-      style,
-    )
-
-  const edges =
-  nodes.length >= 0 ? edgesRes.concat(nodes.filter((a) => !a.isSys).map((a) => ({
-      key:
-                  // 'model-' +
-                  a.id +
-                  '~' +
-                  +'~' +
-                  'model-SYS-CENTER-POINT',
-
-      source : a.id,
-      visible: false,
-      isSys : true,
-      style: {
-        visible: false,
-      },
-      target: 'model-SYS-CENTER-POINT',
-      type: 'console-line',
-
-    }))) :
-    edgesRes
-  const dispatch = useDispatch()
-  const setLayouting =  useCallback((layoutingSet) => {
-    dispatch({
-      type: `${namespace}/layouting`,
-      layouting: layoutingSet,
-    })
-  }, [])
-  useEffect(() => {
-      // alert(1)
-      setLayouting(true)
-      setImmediate(() => {
-        // layOutNodesByG6(nodes, edges, modules, setNodeState, setEdgeState, setLayouting, isArrangeLayout)
-        setEdgeState(edges)
-        setNodeState(nodes)
-       
-        setLayouting(false)
-       }, 10)
-  }, [newModels, checkedKeys, isArrangeLayout, search])
-
-  const graph = useMemo(() =>  ({
-    edges : edgeState,
-    nodes : nodeState,
-  }), [nodeState])
-
-  return {
-    height,
-    graph,
-    models: newModels,
-    checkedKeys,
-    graphRef,
-    showModel,
-    currentModel,
-    layouted,
-    change,
-    showInsertModel,
-    search,
-    modules,
-    layouting,
-    style,
-    colors,
-  }
-}
-
-// const createGroups = (modules) => {
-//   return modules.map((m) => {
-//     return {
-//       id: `module-${m.key}`,
-//       title: {
-//       text: m.name,
-//       fontSize: 35,
-//       stroke: '#444',
-//       offsetX: 0,
-//       offsetY: 0,
-//       },
-//     }
-//   })
-// }

package/webapp/src/page/hooks/resize.tsx

@@ -1,20 +0,0 @@
-
-import { useCallback, useEffect, useState } from 'react'
-
-export const useResizeUpdate = () => {
-
-  const [_, update] = useState(0)
-
-  const onResize = useCallback(() => {
-    // alert()
-    update(+new Date())
-  }, [])
-
-  useEffect(() => {
-    window.addEventListener('resize', onResize)
-    return (() => {
-        window.removeEventListener('resize', onResize)
-    })
-
-})
-}