Initial commit

modeler/src/views/decision/builder/element.ts

@@ -33,7 +33,7 @@ export interface ElementParameter {
   templateType: NullableString,
 }
 
-export interface ElementPosition {
+export interface GraphPosition {
   x: number;
   y: number;
 }
@@ -48,18 +48,18 @@ export interface ElementVariable {
 
 export interface BaseElement {
   id: number;
-  key: string;
+  key: NullableString;
-  name: string;
+  name: NullableString;
-  type: string;
+  type: NullableString;
   width: number;
   height: number;
-  position: ElementPosition;
+  position: GraphPosition;
   category: NullableString;
   element?: DraggableElement;
   [key: string]: unknown;
 }
 
-export interface TaskNodeRect {
+export interface GraphTaskRect {
   width?: number;
   height?: number;
   x?: number;

modeler/src/views/decision/builder/hooks.ts

@@ -155,6 +155,7 @@ export const useGraphCanvas = (readonly: boolean = false): UseGraphCanvas => {
 
         if (!existingEdge) {
           sourceEdges.push({
+            id: sourceData.id,
             key: edge.id,
             source: sourceNode.id,
             sourceName: sourceData.name,

modeler/src/views/decision/builder/node.vue

@@ -17,56 +17,15 @@
       <!-- 节点内容区域 -->
       <div class="w-full">
         <div class="ks-designer-node-content">
-          <div
+          <div class="ks-designer-node-row">
-            v-for="(item, index) in element?.children || []"
-            :key="item.id || index"
-            class="ks-designer-node-row"
-          >
-            <div
-              :data-port="`in-${item.id || index}`"
-              :title="`入桩: ${item.name}`"
-              class="port port-in"
-              magnet="passive"
-            ></div>
-
-            <!-- child名称 -->
-            <div class="ks-designer-node-name">
-              {{ item.name }}
-            </div>
-
-            <!-- 右侧出桩：只能作为连线源 -->
-            <div
-              :data-port="`out-${item.id || index}`"
-              :title="`出桩: ${item.name}`"
-              class="port port-out"
-              magnet="active"
-            ></div>
-          </div>
-
-          <div v-if="!(element?.children && element?.children?.length > 0)" class="ks-designer-node-row">
             <div class="port port-in" data-port="in-0" magnet="passive"></div>
             <div class="ks-designer-node-name" v-if="element?.category !== 'component'">
               {{ element?.name ?? '-' }}
             </div>
-            <div class="ks-designer-node-name" v-else>
-              <p>隐藏纬度: {{ element?.parameters?.hiddenLatitude ?? '-' }}</p>
-              <p>激活函数: {{ element?.parameters?.activationFunction ?? '-' }}</p>
-            </div>
             <div class="port port-out" data-port="out-0" magnet="active"></div>
           </div>
         </div>
       </div>
-
-<!--      <div class="w-full" v-else>-->
-<!--        <div class="ks-designer-node-content">-->
-<!--        <div class="port port-in" data-port="in-0" magnet="passive"></div>-->
-<!--          <div class="ks-designer-node-name">-->
-<!--            <p>隐藏纬度: {{ element?.parameters?.hiddenLatitude ?? '-' }}</p>-->
-<!--            <p>激活函数: {{ element?.parameters?.activationFunction ?? '-' }}</p>-->
-<!--          </div>-->
-<!--        <div class="port port-out" data-port="out-0" magnet="active"></div>-->
-<!--        </div>-->
-<!--      </div>-->
     </a-card>
 
     <template #overlay>

modeler/src/views/decision/properties.vue

@@ -31,21 +31,15 @@
               <a-textarea size="small" v-model:value="currentElement.outputs" />
             </a-form-item>
 
-            <a-divider v-if="currentElement.settings && currentElement.settings.length > 0"/>
+            <a-divider v-if="currentElement.settings && currentElement.parameters.length > 0"/>
 
-            <a-form-item :label="setting.description" v-for="setting in currentElement.settings">
+            <a-form-item :label="setting.description" v-for="setting in currentElement.parameters">
-              <a-input-number size="small" style="width:100%;" v-if="setting.data_type === 'double'" v-model:value="setting.default_value" :placeholder="setting.description" />
+              <a-input-number size="small" style="width:100%;" v-if="setting.dataType === 'double'" v-model:value="setting.defaultValue" :placeholder="setting.description" />
-              <a-input v-else size="small" v-model:value="setting.default_value" :placeholder="setting.description" />
+              <a-input v-else size="small" v-model:value="setting.defaultValue" :placeholder="setting.description" />
             </a-form-item>
           </a-form>
         </a-tab-pane>
 
-<!--        <a-tab-pane key="2" tab="外观">-->
-
-<!--        </a-tab-pane>-->
-<!--        <a-tab-pane key="3" tab="系统">-->
-
-<!--        </a-tab-pane>-->
       </a-tabs>
 
       <a-tabs v-model:activeKey="activeBottomTabsKey" class="ks-model-builder-tabs parameters-tabs">

modeler/src/views/decision/utils/node.ts

@@ -8,22 +8,22 @@
  */
 
 import type { NodeTemplate } from '../types';
-import type { GraphTaskElement, TaskNodeRect } from '../builder/element';
+import type { GraphTaskElement, GraphTaskRect } from '../builder/element';
 import { generateKey } from '@/utils/strings';
 
 export const createGraphTaskElementFromTemplate = (
   template: NodeTemplate,
-  rect?: TaskNodeRect,
+  rect?: GraphTaskRect,
 ): GraphTaskElement => {
   let realRect = { width: 200, height: 100, x: 0, y: 0, ...rect || {} }
   console.info('rect',rect)
   return {
     id: 0,
     key: generateKey(template.type),
-    status: null,
+    type: 'task',
     template: template.id,
-    type: template.type,
     name: template.name,
+    category: template.type,
     description: template.description,
     position: {
       x: realRect.x ?? 0,
@@ -31,10 +31,9 @@ export const createGraphTaskElementFromTemplate = (
     },
     width: realRect.width,
     height: realRect.height,
-    // settings: JSON.parse(JSON.stringify(template.parameter_defs ?? [])),
     inputs: null,
     outputs: null,
-    parameters: {},
+    parameters: [],
     variables: [
       {
         key: generateKey('var_'),

modeler/types/components.d.ts

@@ -12,11 +12,8 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
-    AAvatar: typeof import('ant-design-vue/es')['Avatar']
     AButton: typeof import('ant-design-vue/es')['Button']
     ACard: typeof import('ant-design-vue/es')['Card']
-    ACarousel: typeof import('ant-design-vue/es')['Carousel']
-    ACheckbox: typeof import('ant-design-vue/es')['Checkbox']
     ACol: typeof import('ant-design-vue/es')['Col']
     ACollapse: typeof import('ant-design-vue/es')['Collapse']
     ACollapsePanel: typeof import('ant-design-vue/es')['CollapsePanel']
@@ -24,34 +21,20 @@ declare module 'vue' {
     ADropdown: typeof import('ant-design-vue/es')['Dropdown']
     AEmpty: typeof import('ant-design-vue/es')['Empty']
     AFlex: typeof import('ant-design-vue/es')['Flex']
-    AFloatButton: typeof import('ant-design-vue/es')['FloatButton']
     AForm: typeof import('ant-design-vue/es')['Form']
     AFormItem: typeof import('ant-design-vue/es')['FormItem']
-    AFormItemRest: typeof import('ant-design-vue/es')['FormItemRest']
     AInput: typeof import('ant-design-vue/es')['Input']
-    AInputGroup: typeof import('ant-design-vue/es')['InputGroup']
     AInputNumber: typeof import('ant-design-vue/es')['InputNumber']
     AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
-    AInputSearch: typeof import('ant-design-vue/es')['InputSearch']
     ALayout: typeof import('ant-design-vue/es')['Layout']
-    ALayoutContent: typeof import('ant-design-vue/es')['LayoutContent']
     ALayoutHeader: typeof import('ant-design-vue/es')['LayoutHeader']
-    ALayoutSider: typeof import('ant-design-vue/es')['LayoutSider']
     AList: typeof import('ant-design-vue/es')['List']
     AListItem: typeof import('ant-design-vue/es')['ListItem']
     AMenu: typeof import('ant-design-vue/es')['Menu']
     AMenuItem: typeof import('ant-design-vue/es')['MenuItem']
-    AModal: typeof import('ant-design-vue/es')['Modal']
     APopconfirm: typeof import('ant-design-vue/es')['Popconfirm']
-    APopover: typeof import('ant-design-vue/es')['Popover']
-    AProgress: typeof import('ant-design-vue/es')['Progress']
     ARow: typeof import('ant-design-vue/es')['Row']
-    ASelect: typeof import('ant-design-vue/es')['Select']
-    ASelectOption: typeof import('ant-design-vue/es')['SelectOption']
-    ASlider: typeof import('ant-design-vue/es')['Slider']
     ASpace: typeof import('ant-design-vue/es')['Space']
-    ASteps: typeof import('ant-design-vue/es')['Steps']
-    ASubMenu: typeof import('ant-design-vue/es')['SubMenu']
     ATable: typeof import('ant-design-vue/es')['Table']
     ATabPane: typeof import('ant-design-vue/es')['TabPane']
     ATabs: typeof import('ant-design-vue/es')['Tabs']
@@ -64,11 +47,8 @@ declare module 'vue' {
 
 // For TSX support
 declare global {
-  const AAvatar: typeof import('ant-design-vue/es')['Avatar']
   const AButton: typeof import('ant-design-vue/es')['Button']
   const ACard: typeof import('ant-design-vue/es')['Card']
-  const ACarousel: typeof import('ant-design-vue/es')['Carousel']
-  const ACheckbox: typeof import('ant-design-vue/es')['Checkbox']
   const ACol: typeof import('ant-design-vue/es')['Col']
   const ACollapse: typeof import('ant-design-vue/es')['Collapse']
   const ACollapsePanel: typeof import('ant-design-vue/es')['CollapsePanel']
@@ -76,34 +56,20 @@ declare global {
   const ADropdown: typeof import('ant-design-vue/es')['Dropdown']
   const AEmpty: typeof import('ant-design-vue/es')['Empty']
   const AFlex: typeof import('ant-design-vue/es')['Flex']
-  const AFloatButton: typeof import('ant-design-vue/es')['FloatButton']
   const AForm: typeof import('ant-design-vue/es')['Form']
   const AFormItem: typeof import('ant-design-vue/es')['FormItem']
-  const AFormItemRest: typeof import('ant-design-vue/es')['FormItemRest']
   const AInput: typeof import('ant-design-vue/es')['Input']
-  const AInputGroup: typeof import('ant-design-vue/es')['InputGroup']
   const AInputNumber: typeof import('ant-design-vue/es')['InputNumber']
   const AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
-  const AInputSearch: typeof import('ant-design-vue/es')['InputSearch']
   const ALayout: typeof import('ant-design-vue/es')['Layout']
-  const ALayoutContent: typeof import('ant-design-vue/es')['LayoutContent']
   const ALayoutHeader: typeof import('ant-design-vue/es')['LayoutHeader']
-  const ALayoutSider: typeof import('ant-design-vue/es')['LayoutSider']
   const AList: typeof import('ant-design-vue/es')['List']
   const AListItem: typeof import('ant-design-vue/es')['ListItem']
   const AMenu: typeof import('ant-design-vue/es')['Menu']
   const AMenuItem: typeof import('ant-design-vue/es')['MenuItem']
-  const AModal: typeof import('ant-design-vue/es')['Modal']
   const APopconfirm: typeof import('ant-design-vue/es')['Popconfirm']
-  const APopover: typeof import('ant-design-vue/es')['Popover']
-  const AProgress: typeof import('ant-design-vue/es')['Progress']
   const ARow: typeof import('ant-design-vue/es')['Row']
-  const ASelect: typeof import('ant-design-vue/es')['Select']
-  const ASelectOption: typeof import('ant-design-vue/es')['SelectOption']
-  const ASlider: typeof import('ant-design-vue/es')['Slider']
   const ASpace: typeof import('ant-design-vue/es')['Space']
-  const ASteps: typeof import('ant-design-vue/es')['Steps']
-  const ASubMenu: typeof import('ant-design-vue/es')['SubMenu']
   const ATable: typeof import('ant-design-vue/es')['Table']
   const ATabPane: typeof import('ant-design-vue/es')['TabPane']
   const ATabs: typeof import('ant-design-vue/es')['Tabs']