UPDATE: VERSION-20260314
This commit is contained in:
@@ -1,22 +1,21 @@
|
||||
<template>
|
||||
<div class="w-full">
|
||||
<a-collapse v-model:activeKey="activeKey" :accordion="true">
|
||||
<a-collapse v-model:activeKey="activeKey" :accordion="true" class="platform-collapse">
|
||||
<a-collapse-panel key="1">
|
||||
<template #header>
|
||||
<span class="ks-model-builder-title-icon icon-model"></span>控制节点
|
||||
<span class="ks-model-builder-title-icon icon-model"></span>平台名称
|
||||
</template>
|
||||
<div class="w-full h-full">
|
||||
<a-row>
|
||||
<a-col v-for="nm in controlTemplates" :span="12">
|
||||
<a-col v-for="nm in templateData" :span="12">
|
||||
<div
|
||||
:key="nm.id"
|
||||
:data-type="nm.type"
|
||||
class="ks-model-drag-item"
|
||||
@dragend="handleDragEnd"
|
||||
@dragstart="handleDragStart($event, nm, 'control')"
|
||||
@dragstart="handleDragStart($event, nm)"
|
||||
>
|
||||
<img :alt="nm.name ?? ''" class="icon" src="@/assets/icons/model-4.svg" />
|
||||
<span class="desc">{{ nm.name }}</span>
|
||||
<img :alt="nm.description ?? nm.name ?? ''" class="icon" src="@/assets/icons/model-4.svg" />
|
||||
<span class="desc">{{ nm.description ?? nm.name }}</span>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
@@ -29,49 +28,29 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref } from 'vue';
|
||||
import type { NodeDragTemplate, NodeTemplate } from '../types';
|
||||
import { findNodeTemplates } from '../designer/api';
|
||||
import { safePreventDefault, safeStopPropagation } from '@/utils/event';
|
||||
import {findPlatformWithComponents} from './api'
|
||||
import {type PlatformWithComponents} from './types'
|
||||
|
||||
export default defineComponent({
|
||||
emits: ['drag-item-start', 'drag-item-end'],
|
||||
setup(_props, { emit }) {
|
||||
|
||||
const activeKey = ref<number>(1);
|
||||
const templateData = ref<NodeTemplate[]>([]);
|
||||
const templateData = ref<PlatformWithComponents[]>([]);
|
||||
const isDraggingOver = ref<boolean>(false);
|
||||
const draggedNodeData = ref<NodeDragTemplate | null>(null);
|
||||
// 控制节点
|
||||
const controlTemplates = ref<NodeTemplate[]>([]);
|
||||
// 条件节点
|
||||
const conditionTemplates = ref<NodeTemplate[]>([]);
|
||||
// 行为节点
|
||||
const actionsTemplates = ref<NodeTemplate[]>([]);
|
||||
const draggedNodeData = ref<PlatformWithComponents | null>(null);
|
||||
|
||||
const loadTress = () => {
|
||||
controlTemplates.value = [];
|
||||
conditionTemplates.value = [];
|
||||
actionsTemplates.value = [];
|
||||
|
||||
findNodeTemplates().then(r => {
|
||||
templateData.value = r.data;
|
||||
if (r.data) {
|
||||
r.data.forEach(tpl => {
|
||||
if (tpl.type === 'action') {
|
||||
actionsTemplates.value.push(tpl);
|
||||
} else if (tpl.type === 'parallel' || tpl.type === 'sequence' || tpl.type === 'select'|| tpl.type === 'root') {
|
||||
controlTemplates.value.push(tpl);
|
||||
} else {
|
||||
conditionTemplates.value.push(tpl);
|
||||
}
|
||||
});
|
||||
}
|
||||
templateData.value = []
|
||||
findPlatformWithComponents(1).then(r => {
|
||||
templateData.value = r.data ?? []
|
||||
});
|
||||
};
|
||||
|
||||
const handleDragStart = (e: DragEvent, nm: NodeTemplate, group: String) => {
|
||||
let dragNode: NodeDragTemplate = { ...nm, group: group };
|
||||
draggedNodeData.value = dragNode as NodeDragTemplate;
|
||||
const handleDragStart = (e: DragEvent, nm: PlatformWithComponents) => {
|
||||
let dragNode: PlatformWithComponents = { ...nm };
|
||||
draggedNodeData.value = dragNode as PlatformWithComponents;
|
||||
|
||||
if (e.dataTransfer) {
|
||||
e.dataTransfer.setData('text/plain', JSON.stringify(draggedNodeData.value));
|
||||
@@ -105,17 +84,21 @@ export default defineComponent({
|
||||
emit('drag-item-end', isDraggingOver.value, e);
|
||||
};
|
||||
|
||||
|
||||
const load = ()=> {
|
||||
findPlatformWithComponents(1).then(re=> {
|
||||
console.error(re);
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadTress();
|
||||
load();
|
||||
});
|
||||
|
||||
return {
|
||||
activeKey,
|
||||
|
||||
controlTemplates,
|
||||
conditionTemplates,
|
||||
actionsTemplates,
|
||||
|
||||
templateData,
|
||||
handleDragStart,
|
||||
handleDragEnd,
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user