@steedos/steedos-plugin-schema-builder 2.5.13 → 2.5.14-beta.10

package/webapp/src/page/model-navi/style.scss

@@ -1,111 +0,0 @@
-
-.console-g6-page {
-  background-color: #fff;
-  display: flex ;
-  flex:1;
-  flex-direction: row;
-  overflow: hidden;
-  height: 100%;
-  .g6-graph {
-    // width: calc(100% - 250px)
-    // padding-left: 16px;
-    margin-right: 16px;
-    flex:1;
-    width:0;
-    height: 100%;
-    .ant-spin-nested-loading {
-      height: 100%;
-      .ant-spin-container {
-        height:  100%;
-      }
-    }
-  }
-
-  .g6-info {
-    width: 50px;
-  }
-
-  .g6-modelnavi {
-    width: 270px;
-    margin-bottom: 16px;
-    height: 100%;
-
-    
-
-
-    .console-models-tree {
-      overflow: hidden;
-      display: flex ;
-      flex-direction: column;
-      padding-bottom: 78px;
-
-      height: 100%;
-      margin-right: 25px;
-     
-      .header {
-        height: 56px;
-      }
-
-      .navitree-warp {
-        flex: 1;
-        // overflow-y: scroll;
-        display: flex;
-        flex-direction:column;
-        // margin-top: 8px;
-        // margin-bottom: 24px;
-        height: 100%;
-        margin-left: 10px;
-        border: 1px solid rgba(0, 0, 0, 0.1);
-      }
-      .console-erd-search {
-        margin-top: 3px;
-        // height:35px;
-        margin-bottom: 4px;
-      //  float: right;
-        // margin-right: 30px;
-        margin-left: 10px;
-        display: flex;
-        .console-erd-add {
-          font-size: 20px;
-          // margin-right: 25px;
-          color: rgba(0,0,0,0.40);
-          cursor: pointer;
-            margin-left: 5px;
-        }
-      }
-      // .header {
-      //   // height: 50px;
-      //   // border-bottom:1px solid rgba(0, 0, 0, 0.1);
-      // }
-
-
-      .console-models-tree-tree{
-         flex:1;
-        //  overflow: hidden;
-         padding-right: 5px;
-         .ant-tree-treenode {
-           width: 100%;
-         }
-
-         .ant-tree-node-selected {
-            .tree-node-title {
-              color: white;
-              background-color: rgba(11,108,149,1);
-            }
-            background-color:rgba(11,108,149,1);
-         }
-       
-        //  div.ant-tree-treenode:hover {
-        //   background-color: red;
-        // }
-      }
-
-
-
-   }
-
-  }
-
-}
-
-

package/webapp/src/page/util/index.tsx

@@ -1,234 +0,0 @@
-// import { styleConfig ,  styleConfigLazy } from '../config'
-import { layOutNodes as _layOutNodes, layOutNodesByG6 as _layOutNodesByG6 } from './layout-nodes'
-
-export const layOutNodes = _layOutNodes
-export const layOutNodesByG6 = _layOutNodesByG6
-
-const showLable = (node) => {
-  // return !node.name || node.name === node.originalKey
-  //   ? node.originalKey
-  //   : `${node.name} (${node.originalKey})`
-  return node.name || node.originalKey
-}
-
-const eq = (fun) => {
-  return fun()
-}
-
-const fields = (node, models) => {
-  const list = node.fields.map((field) => {
-    // const field = node.fields[k]
-    const isForeign = field.typeMeta && field.typeMeta.type === 'Relation'
-    const relationModel = eq(() => {
-      if (isForeign && field.typeMeta.relationModel) {
-        const m = models.find((a) => a.key === field.typeMeta.relationModel)
-        // if (m) return m.name || m.originalKey
-        return m || { name: field.typeMeta.relationModel }
-      }
-
-      return ''
-    })
-    return {
-      ...field,
-      key: field.key,
-      label: showLable(field),
-      type: field.type,
-      originalKey: field.originalKey,
-      isForeign,
-      relationModelKey: relationModel && relationModel.key,
-      relationModel: isForeign && relationModel ? relationModel.name || relationModel.originalKey : '',
-    }
-  })
-  return list
-}
-
-export const updateLayout = (graph, groups) => {
-  const nodes = graph.getNodes().filter((a) => !a.isSys).map((n) => {
-    const model = n.getModel()
-    return {
-      data: model.data,
-      config: model.config,
-      id: model.id,
-    }
-  })
-  const edges = graph.getEdges().map((edge) => {
-    const { source, target, fieldIndex, fieldsLength } = edge.getModel()
-    return {
-      source,
-      target,
-      fieldIndex,
-      fieldsLength,
-    }
-  })
-  console.log(nodes)
-  return layOutNodes(nodes, edges, groups)
-}
-
-const createSysNode = () => {
-
-  return  {
-    id: 'model-SYS-CENTER-POINT',
-    type: 'circle',
-    isSys: true,
-    isKeySharp: true,
-    size:  10,
-  }
-
-}
-
-export const getNodes = (models, checkedKeys styleConfig) => {
-  // const _key = stateConfig.model_keys.key
-  const nodeRes = models
-    .filter(
-      (model) => (checkedKeys.indexOf('model-' + model.key) >= 0 && !model.delete && model.isShow),
-    )
-    .map((model, i) => {
-      return {
-        id: 'model-' + model.key,
-        hide: checkedKeys.indexOf('model-' + model.key) === -1,
-        // groupId: `module-${model.moduleKey}`,
-        config: {
-          width: 300,
-          headerHeight: 48,
-          fieldHeight: 32,
-          labelSize: 14 ,
-          hide: checkedKeys.indexOf('model-' + model.key) === -1,
-          styleConfig,
-        },
-        data: {
-          moduleKey: `module-${model.moduleKey}`,
-          label: showLable(model),
-          fields: fields(model, models),
-          key: model.key,
-          name: model.name || model.key,
-          tag: 'aggregate',
-          aggregateRoot:  model.aggregateRoot,
-          aggregateModelKey: model.aggregateModelKey,
-          belongAggregate: model.belongAggregate,
-          nodeSize:  ((48 +  getLength(model.fields.length) * 48) / 6) *
-          6  / 6,
-        },
-        type: 'console-model-Node',
-        isKeySharp: true,
-        size:   ((48 +  getLength(model.fields.length) * 48) / 6) *
-        6 ,
-      }
-    })
-
-  return nodeRes.length > 0 ? nodeRes.concat([createSysNode()]) : nodeRes
-
-  // })
-}
-
-const getLength  = (length) => {
-  return length >= 20 ? length : 20
- }
-
-const noInCheckedKeys = (checkedKeys, sourceModel, targetModel) => {
-   return checkedKeys.indexOf(sourceModel) === -1 || checkedKeys.indexOf(targetModel) === -1
- }
-
- const Relation = {
-  ToOne: '1:1',
-  ToMany: '1:n',
-  lookup:'查找'
-}
-
-export const createLinks = (models, nodes, checkedKeys, styleConfig) => {
-  const links = models.reduce((pre, model) => {
-     if (!nodes.find((a) => a.id === 'model-' + model.key)) return pre
-     const { aggregateRoot , aggregateModelKey , belongAggregate  } = model
-     const hasArrangeLink = (aggregateModelKey) && (aggregateModelKey !== model.key)
-     const arrangeModel = aggregateModelKey
-     const arrangeLink = (
-       hasArrangeLink &&
-       nodes.find((a) => a.id === 'model-' + arrangeModel) &&
-       !noInCheckedKeys(checkedKeys, ('model-' + arrangeModel), ('model-' + model.key)))  ? [
-       {
-        key: 'model-' + model.key + '~' + +'~' + 'model-' + arrangeModel,
-        target: 'model-' + model.key,
-        source: 'model-' + arrangeModel,
-        arrangeLink: true,
-        style : {
-          lineDash: [18, 20],    // 虚线边
-          lineWidth: 3,
-        },
-      }] : []
-
-     const fieldLinks = Object.keys(model.fields)
-      .map((k) => model.fields[k])
-      .reduce((fPre, field, i) => {
-        const isRelation =   field.typeMeta && field.typeMeta.type === 'Relation'
-        const { originalKey } = field
-        if (isRelation && !(field.typeMeta.relationModel === 'base_User' && (['createdBy', 'updatedBy'].indexOf(originalKey) >= 0))) {
-          const sourceModelNode = null
-          const targetModelNode = null
-          const sourceModel = sourceModelNode
-            ? sourceModelNode.getModel()
-            : nodes.find((a) => a.id === 'model-' + model.key)
-          const targetModel = targetModelNode
-            ? targetModelNode.getModel()
-            : nodes.find(
-                (a) => a.id === 'model-' + field.typeMeta.relationModel,
-              )
-          if (!sourceModel || !targetModel) return fPre
-          if (
-            checkedKeys.indexOf(sourceModel.id) === -1 ||
-            checkedKeys.indexOf(targetModel.id) === -1
-          )
-            return fPre
-          const isTo = targetModel.x > sourceModel.x
-          const l = Object.keys(model.fields).length
-          const sourceAnchor = !isTo ? (i + 2) : (2 + i + l)
-          const targetAnchor = (isTo ? 0 : 1)
-          return [
-            ...fPre,
-            {
-              key:
-                'model-' +
-                model.key +
-                '~' +
-                +'~' +
-                'model-' +
-                field.typeMeta.relationModel,
-              source: 'model-' + model.key,
-              target: 'model-' + field.typeMeta.relationModel,
-              sourceAnchor,
-              // targetAnchor: sourceAnchor,
-              // targetAnchor:  model.key === field.typeMeta.relationModel ? (sourceAnchor - 1) : undefined,
-               targetAnchor:  model.key === field.typeMeta.relationModel ? (sourceAnchor - 1) : targetAnchor,
-               self : model.key === field.typeMeta.relationModel,
-              // targetAnchor,
-              fieldIndex: i,
-              fieldsLength: l,
-              // data: field,
-              tooltip: `<div>从 <span class='text'>${sourceModel?.data?.label}</span> 到 <span class='text'>${targetModel?.data?.label}</span> ${Relation[field.type]||field.type} 关系</div>`
-
-              type:
-                model.key === field.typeMeta.relationModel
-                  ? 'loop'
-                  :
-                  'console-line',
-              // color: 'black',
-              style: styleConfig.default.edge,
-              styleConfig,
-              // label: model.key === field.typeMeta.relationModel ? undefined : field.type,
-              // labelAutoRotate: true,
-              loopCfg: {
-                // position: 'top',
-                clockwise: true, // dist: 200,
-                dist: 100,
-              },
-            },
-          ]
-        } else return fPre
-      }, [])
-
-     return [
-      ...pre,
-      ...arrangeLink,
-      ...fieldLinks,
-    ]
-  }, [])
-  return links
-}

package/webapp/src/page/util/layout-nodes/index.tsx

@@ -1,185 +0,0 @@
-import G6 from '@antv/g6'
-import dagre from 'dagre'
-
-const setNodeXY = (nodesDict, node) => {
-  const { id } = node
-
-  if (nodesDict[id]) {
-    node.x = nodesDict[id].x
-    node.y = nodesDict[id].y
-    return true
-  } 
-  return false
-}
-
-const getLength  = (length) => {
-  return length >= 20 ? length : 20
- }
-
-export const layOutNodesByG6 = (nodes: any[], edges: any[], groups: any[], setNodeState, setEdgeState, setLayouting, isArrangeLayout) => {
-  // layOutNodesByG6Force(nodes , edges, [])
-  if (isArrangeLayout) {
-     layOutNodesByG6Force(nodes, edges.filter((a) => a.arrangeLink) , [])
-     if (setNodeState) {
-      setEdgeState(edges.filter((a) => !a.isSys))
-      setNodeState([...nodes])
-      if (setLayouting) setLayouting(false)
-    }
-  } else {
-  const subgraphLayout = new G6.Layout.force({
-    // center: [500, 450],
-    // nodeSize: 700,
-    // nodeStrength: -30,
-    // linkDistance:200,
-    nodeSpacing: -180 ,
-    preventOverlap: true,
-    onLayoutEnd: () => {
-      alert('onLayoutEnd')
-      if (setNodeState) {
-        setEdgeState(edges)
-        setNodeState([...nodes])
-        if (setLayouting) setLayouting(false)
-      }
-
-       },
-    // workerEnabled: false,
-    workerEnabled: true,
-  })
-
-  // 初始化布局，灌入子图数据
-  subgraphLayout.init({
-    nodes,
-    edges,
-  })
-
-  // 执行布局
-  subgraphLayout.execute()
-  console.log([nodes, edges])
-
-  // const graphString = sessionStorage.getItem('console-erd-graph')
-  // // alert('force layout')
-  // const nodesDict = graphString && JSON.parse(graphString)
-  // nodes.forEach((node) => {
-  //   if (nodesDict) {
-  //      setNodeXY(nodesDict, node)
-  //   }
-  // })
-
-  // 图实例根据数据更新节点位置
-  // graph.positionsAnimate()
-  return [nodes, edges]
-}
- }
-
-export const layOutNodesByG6Force  = (nodes: any[], edges: any[], groups: any[]) => {
-  const subgraphLayout = new G6.Layout.dagre({
-    // center: [500, 450],
-    workerEnabled: true,
-  })
-
-  // 初始化布局，灌入子图数据
-  subgraphLayout.init({
-    nodes,
-    edges,
-  })
-
-  // 执行布局
-  subgraphLayout.execute()
-
-  const graphString = sessionStorage.getItem('console-erd-graph')
-  alert(graphString)
-  const nodesDict = graphString && JSON.parse(graphString)
-  nodes.forEach((node) => {
-    if (nodesDict) {
-       setNodeXY(nodesDict, node)
-    }
-  })
-
-  // 图实例根据数据更新节点位置
-  // graph.positionsAnimate()
-  return [nodes, edges]
- }
-
-export const layOutNodes = (nodes: any[], edges: any[], groups: any[]) => {
-  // alert(nodes.length)
-  let g = new dagre.graphlib.Graph()
-  g.setGraph({
-    // ranker: 'network-simplex',
-    // acyclicer: undefined,
-    // rankdir: 'LR',
-    // align: 'UL',
-    // ranksep: 500,
-  })
-  g.setDefaultEdgeLabel((v, w) => ({
-    label: v + '~' + w,
-  }))
-  nodes.filter((a) => !a.isSys).forEach((node) => {
-    const { config, data } = node
-    g.setNode(node.id, {
-      label: node.id,
-      width: (config.width / 6) * 6,
-      height:
-        ((config.headerHeight +  getLength(data.fields.length) * config.fieldHeight) / 6) *
-        6,
-    })
-  })
-  edges.forEach((edge) => {
-    g.setEdge(edge.source, edge.target)
-  })
-
-  // groups.forEach((group) => {
-
-  //   const gNodes = nodes.filter((a) => a.moduleKey === group.key)
-  //   if (gNodes.length > 1) {
-  //     gNodes.forEach((n, i) => {
-  //       if (i < (gNodes.length - 1)) {
-  //       // g.setEdge(gNodes[i].id, gNodes[i + 1].id)
-  //       g.setEdge(gNodes[0].id, n.id)
-  //       }
-  //     })
-  //   }
-
-  // })
-  dagre.layout(g)
-  const graphString = sessionStorage.getItem('console-erd-graph')
-  const nodesDict = graphString && JSON.parse(graphString)
-  nodes.forEach((node) => {
-    if (nodesDict) {
-      
-      const isStorage = setNodeXY(nodesDict, node)
-      if (isStorage) return
-    }
-
-    node.x = g.node(node.id).x
-    node.y = g.node(node.id).y
-  }) 
-  
-  
-  // -------
-
-  // edges.forEach((edge) => {
-  //   const { source, target, fieldIndex, fieldsLength } = edge
-  //   const i = fieldIndex
-  //   const l = fieldsLength
-  //   const sourceModel = nodes.find((a) => a.id === source)
-  //   const targetModel = nodes.find((a) => a.id === target)
-  //   const isTo = sourceModel && targetModel && targetModel.x > sourceModel.x //  const l = sourceModel.data.fields.length
-  //   if (sourceModel !== targetModel) {
-  //      edge.sourceAnchor = !isTo ? (i + 2) : (2 + i + l)
-  //      // edge.targetAnchor = isTo ? 0 : 1
-  //      edge.targetAnchor  = undefined
-  //   }
-  //   // const { points } = g.edge({v: sourceModel.id , w: targetModel.id })
-  //   // edge.controlPoints = points
-  //   // edge.controlPoints = g.edge(edge)
-  // })
-
-//   g.edges().forEach((e) => {
-//     console.log('Edge ' + e.v + ' -> ' + e.w + ': ' + JSON.stringify(g.edge(e)))
-// })
-
-  return {
-    nodes: nodes.reduce((pre, item) => ({ ...pre, [item.id]: item }), {}),
-    edges,
-  }
-}

package/webapp/src/pdm/index.tsx

@@ -1,50 +0,0 @@
-import { InboxOutline } from '@ant-design/icons'
-import { message, Upload } from 'antd'
-import { useDispatch } from '../hook'
-import React from 'react'
-const PdmToJson = require('./pdm-json')
-import { ConvertTo } from './util'
-
-export default ({children}) => {
-  const dispatch =  useDispatch()
-
-  const props = {
-    name: 'file',
-    multiple: true,
-    transformFile(file) {
-      return new Promise((resolve) => {
-        const reader = new FileReader()
-        reader.readAsText(file)
-        reader.onload =  async (a) => {
-          // alert(a.target.result)
-          const aa = await PdmToJson(a.target.result)
-          console.log(aa)
-          const erds = ConvertTo(aa)
-          console.log(erds)
-          dispatch({
-            type: `${'erd'}/load`,
-            ...erds,
-          })
-        }
-      })
-    },
-    onChange(info) {
-      const { status } = info.file
-      if (status !== 'uploading') {
-        console.log(info.file, info.fileList)
-     }
-      if (status === 'done') {
-        message.success(`${info.file.name} file uploaded successfully.`)
-     } else if (status === 'error') {
-        message.error(`${info.file.name} file upload failed.`)
-     }
-    },
-  }
-
-  return   (
-  <Upload {...props}>
-  {children}
-</Upload>
- )
-}
-