temp
This commit is contained in:
chndfang
parent
e0c6f4df7b
commit
6930e2952c
File diff suppressed because one or more lines are too long
@ -3,7 +3,8 @@
|
||||
"success": true,
|
||||
"data": {
|
||||
"id": "mock-scene-1",
|
||||
"label": "模拟场景A"
|
||||
"label": "模拟场景A",
|
||||
"json": "{\"robotGroups\":[{\"sid\":\"mock-scene-1\",\"id\":\"mock-robot-group\",\"label\":\"模拟机器人组\",\"robots\":[\"mock-robot-1\",\"mock-robot-2\"]}],\"robots\":[{\"id\":\"mock-robot-1\",\"label\":\"模拟机器人A\",\"brand\":\"模拟品牌A\",\"type\":1,\"ip\":\"127.0.1.1\",\"isConnected\":true,\"state\":4,\"canOrder\":true,\"canStop\":true,\"canControl\":true},{\"id\":\"mock-robot-2\",\"label\":\"模拟机器人B\",\"brand\":\"模拟品牌A\",\"type\":2,\"ip\":\"127.0.1.2\"}],\"points\":[{\"id\":\"776fa1bf\",\"name\":\"测试普通点\",\"x\":100,\"y\":100,\"type\":1,\"config\":{}},{\"id\":\"ea84ca\",\"name\":\"测试等待点\",\"x\":200,\"y\":100,\"type\":2,\"config\":{},\"actions\":[\"343a2f0\"]},{\"id\":\"083f10\",\"name\":\"测试避让点\",\"x\":300,\"y\":100,\"type\":3,\"config\":{}},{\"id\":\"3a350276\",\"name\":\"测试临时避让点\",\"x\":400,\"y\":100,\"type\":4,\"config\":{}},{\"id\":\"51b95527\",\"name\":\"测试电梯点\",\"x\":100,\"y\":300,\"type\":11,\"config\":{}},{\"id\":\"200e2898\",\"name\":\"测试自动门点\",\"x\":200,\"y\":300,\"type\":12,\"config\":{}},{\"id\":\"e94941e\",\"name\":\"测试充电点\",\"x\":300,\"y\":300,\"type\":13,\"config\":{},\"robots\":[\"mock-robot-1\"]},{\"id\":\"5bdd329\",\"name\":\"测试停靠点\",\"x\":400,\"y\":300,\"type\":14,\"config\":{},\"robots\":[]},{\"id\":\"343a2f0\",\"name\":\"测试动作点\",\"x\":500,\"y\":300,\"type\":15,\"config\":{}},{\"id\":\"b6c6cfb\",\"name\":\"测试禁行点\",\"x\":100,\"y\":500,\"type\":16,\"config\":{}}],\"routes\":[{\"id\":\"3de9971\",\"from\":\"776fa1bf\",\"to\":\"ea84ca\",\"type\":\"line\",\"pass\":1,\"config\":{}},{\"id\":\"4781a31f\",\"from\":\"ea84ca\",\"to\":\"083f10\",\"type\":\"line\",\"pass\":1,\"config\":{}},{\"id\":\"fc86102\",\"from\":\"083f10\",\"to\":\"3a350276\",\"type\":\"line\",\"pass\":0,\"config\":{}},{\"id\":\"6f33b86\",\"from\":\"3a350276\",\"to\":\"343a2f0\",\"type\":\"bezier3\",\"pass\":1,\"config\":{}},{\"id\":\"7a48284\",\"from\":\"200e2898\",\"to\":\"51b95527\",\"type\":\"line\",\"pass\":0,\"config\":{}},{\"id\":\"83bc37\",\"from\":\"e94941e\",\"to\":\"200e2898\",\"type\":\"line\",\"pass\":2,\"config\":{}},{\"id\":\"b52b5a\",\"from\":\"5bdd329\",\"to\":\"e94941e\",\"type\":\"line\",\"pass\":2,\"config\":{}},{\"id\":\"610d367\",\"from\":\"343a2f0\",\"to\":\"5bdd329\",\"type\":\"line\",\"pass\":2,\"config\":{}},{\"id\":\"142dbab5\",\"from\":\"51b95527\",\"to\":\"776fa1bf\",\"type\":\"bezier3\",\"pass\":10,\"config\":{},\"c1\":{\"x\":-50,\"y\":100},\"c2\":{\"x\":-10,\"y\":50}},{\"id\":\"a3ad044\",\"from\":\"51b95527\",\"to\":\"b6c6cfb\",\"type\":\"line\",\"pass\":10,\"config\":{}},{\"id\":\"71734a6\",\"from\":\"51b95527\",\"to\":\"b6c6cfb\",\"type\":\"line\",\"config\":{}}],\"areas\":[{\"id\":\"de62ae3\",\"name\":\"测试非互斥区\",\"x\":63,\"y\":67,\"w\":203,\"h\":325,\"type\":12,\"config\":{},\"points\":[\"776fa1bf\",\"ea84ca\",\"51b95527\",\"200e2898\"]},{\"id\":\"f236e4b\",\"name\":\"测试库区\",\"x\":281,\"y\":246,\"w\":292,\"h\":152,\"type\":1,\"config\":{},\"points\":[\"343a2f0\"]},{\"id\":\"1417882e\",\"name\":\"测试互斥区\",\"x\":275,\"y\":54,\"w\":178,\"h\":107,\"type\":11,\"config\":{},\"points\":[\"083f10\",\"3a350276\"],\"routes\":[]}],\"blocks\":[]}"
|
||||
},
|
||||
"message": "模拟提示"
|
||||
}
|
||||
|
||||
112
src/pages/movement-supervision.vue
Normal file
112
src/pages/movement-supervision.vue
Normal file
@ -0,0 +1,112 @@
|
||||
<script setup lang="ts">
|
||||
import { getSceneByGroupId, getSceneById } from '@api/scene';
|
||||
import { EditorService } from '@core/editor.service';
|
||||
import { computed, onMounted, provide, ref, shallowRef, watch } from 'vue';
|
||||
|
||||
const EDITOR_KEY = Symbol('editor-key');
|
||||
|
||||
type Props = {
|
||||
sid: string;
|
||||
id?: string;
|
||||
};
|
||||
const props = defineProps<Props>();
|
||||
|
||||
//#region 接口
|
||||
const readScene = async () => {
|
||||
const res = props.id ? await getSceneByGroupId(props.id, props.sid) : await getSceneById(props.sid);
|
||||
title.value = res?.label ?? '';
|
||||
editor.value?.load(res?.json);
|
||||
};
|
||||
//#endregion
|
||||
|
||||
const title = ref<string>('');
|
||||
watch(
|
||||
() => props.id,
|
||||
() => readScene(),
|
||||
{ immediate: true, flush: 'post' },
|
||||
);
|
||||
|
||||
const container = shallowRef<HTMLDivElement>();
|
||||
const editor = shallowRef<EditorService>();
|
||||
provide(EDITOR_KEY, editor);
|
||||
onMounted(() => {
|
||||
editor.value = new EditorService(container.value!);
|
||||
});
|
||||
|
||||
const show = ref<boolean>(true);
|
||||
const current = ref<{ type: 'robot' | 'point' | 'line' | 'area'; id: string }>();
|
||||
watch(
|
||||
() => editor.value?.selected.value[0],
|
||||
(v) => {
|
||||
const pen = editor.value?.getPenById(v);
|
||||
if (pen?.id) {
|
||||
current.value = { type: <'point' | 'line' | 'area'>pen.name, id: pen.id };
|
||||
return;
|
||||
}
|
||||
if (current.value?.type === 'robot') return;
|
||||
current.value = undefined;
|
||||
},
|
||||
);
|
||||
const isRobot = computed(() => current.value?.type === 'robot');
|
||||
const isPoint = computed(() => current.value?.type === 'point');
|
||||
const isRoute = computed(() => current.value?.type === 'line');
|
||||
const isArea = computed(() => current.value?.type === 'area');
|
||||
|
||||
const selectRobot = (id: string) => {
|
||||
current.value = { type: 'robot', id };
|
||||
editor.value?.inactive();
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-layout class="full">
|
||||
<a-layout-header class="p-16" style="height: 64px">
|
||||
<a-flex justify="space-between" align="center">
|
||||
<a-typography-text class="title">{{ title }}</a-typography-text>
|
||||
</a-flex>
|
||||
</a-layout-header>
|
||||
|
||||
<a-layout class="p-16">
|
||||
<a-layout-sider :width="320">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane key="1" :tab="$t('机器人')">
|
||||
<RobotGroups v-if="editor" :token="EDITOR_KEY" :sid="sid" :current="current?.id" @change="selectRobot" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" :tab="$t('库区')">
|
||||
<PenGroups v-if="editor" :token="EDITOR_KEY" :current="current?.id" only-area1 />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" :tab="$t('高级组')">
|
||||
<PenGroups v-if="editor" :token="EDITOR_KEY" :current="current?.id" />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-layout-sider>
|
||||
<a-layout-content>
|
||||
<div ref="container" class="editor-container full"></div>
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
</a-layout>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.editor-container {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.toolbar-container {
|
||||
position: fixed;
|
||||
bottom: 40px;
|
||||
left: 50%;
|
||||
z-index: 100;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.card-container {
|
||||
position: fixed;
|
||||
top: 80px;
|
||||
right: 64px;
|
||||
z-index: 100;
|
||||
width: 320px;
|
||||
height: calc(100% - 96px);
|
||||
overflow: visible;
|
||||
}
|
||||
</style>
|
||||
@ -20,6 +20,13 @@ export const ROUTES = Object.freeze<RouteRecordRaw[]>([
|
||||
props: true,
|
||||
component: () => import('@/group-editor.vue'),
|
||||
},
|
||||
|
||||
{
|
||||
name: '运行监控',
|
||||
path: '/movement-supervision/:sid/:id?',
|
||||
props: true,
|
||||
component: () => import('@/movement-supervision.vue'),
|
||||
},
|
||||
]);
|
||||
|
||||
export const router = createRouter({
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user