From 33f665d5fd93ac5eac6885b765b8b6b2c5cce0d1 Mon Sep 17 00:00:00 2001
From: xudan <staysky25@outlook.com>
Date: Tue, 1 Jul 2025 14:38:21 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E7=BA=A6=E6=9D=9F?=
 =?UTF-8?q?=E5=8C=BA=E7=B1=BB=E5=9E=8B=E5=8F=8A=E6=9C=80=E5=A4=A7=E5=8F=AF?=
 =?UTF-8?q?=E5=AE=B9=E7=BA=B3AMR=E6=95=B0=E9=85=8D=E7=BD=AE=EF=BC=8C?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=9C=BA=E6=99=AF=E7=BC=96=E8=BE=91=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apis/map/constant.ts                |   2 ++
 src/apis/map/type.ts                    |   1 +
 src/apis/scene/type.ts                  |   1 +
 src/assets/icons/_icon.scss             |   3 ++
 src/assets/icons/dark/area13-active.png | Bin 0 -> 660 bytes
 src/assets/icons/dark/area13-detail.png | Bin 0 -> 590 bytes
 src/assets/icons/dark/area13.png        | Bin 0 -> 578 bytes
 src/assets/themes/editor-dark.json      |   2 ++
 src/components/card/area-edit-card.vue  |  17 +++++++++++-
 src/components/editor-toolbar.vue       |  11 +++++++-
 src/pages/movement-supervision.vue      |  35 ++++++++++++++++++++++--
 src/pages/scene-editor.vue              |   9 +++---
 src/services/editor.service.ts          |  11 ++++++--
 13 files changed, 81 insertions(+), 11 deletions(-)
 create mode 100644 src/assets/icons/dark/area13-active.png
 create mode 100644 src/assets/icons/dark/area13-detail.png
 create mode 100644 src/assets/icons/dark/area13.png

diff --git a/src/apis/map/constant.ts b/src/apis/map/constant.ts
index ebe87ad..d1c83a8 100644
--- a/src/apis/map/constant.ts
+++ b/src/apis/map/constant.ts
@@ -102,6 +102,8 @@ export enum MapAreaType {
   互斥区 = 11,
   /** 非互斥区 - 可以同时有多个机器人进入的区域 */
   非互斥区,
+  /** 约束区 - 机器人运动受到特定约束的区域 */
+  约束区,
 }
 
 /**
diff --git a/src/apis/map/type.ts b/src/apis/map/type.ts
index f251b67..ea507f2 100644
--- a/src/apis/map/type.ts
+++ b/src/apis/map/type.ts
@@ -43,6 +43,7 @@ export interface MapAreaInfo {
   type: MapAreaType; // 区域类型
   points?: Array<string>; // 绑定点位id集合
   routes?: Array<string>; // 绑定线路id集合
+  maxAmr?: number; // 最大可容纳AMR数
 }
 //#endregion
 
diff --git a/src/apis/scene/type.ts b/src/apis/scene/type.ts
index 687f710..eb5bebd 100644
--- a/src/apis/scene/type.ts
+++ b/src/apis/scene/type.ts
@@ -64,6 +64,7 @@ export interface StandardSceneArea {
   type: number; // 区域类型
   points?: Array<string>; // 绑定点位id集合
   routes?: Array<string>; // 绑定线路id集合
+  maxAmr?: number; // 最大可容纳AMR数
   config?: object; // 其它属性配置（可按需增加）
   properties?: unknown; // 附加数据（前端不做任何处理）
 }
diff --git a/src/assets/icons/_icon.scss b/src/assets/icons/_icon.scss
index ecb71af..0ef79b5 100644
--- a/src/assets/icons/_icon.scss
+++ b/src/assets/icons/_icon.scss
@@ -8,6 +8,9 @@ $icons: (
   area12-active,
   area12-detail,
   area12,
+  area13-active,
+  area13-detail,
+  area13,
   battery_charge,
   battery,
   connect_off,
diff --git a/src/assets/icons/dark/area13-active.png b/src/assets/icons/dark/area13-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..c6dbdfd1002018620466da120ffc8ca99b700f99
GIT binary patch
literal 660
zcmV;F0&D$=P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px%PDw;TRA@u(nX!`7Fc5}!<G6sN5QF4N>AV4yP;n1HNzGAFGPE?8YiOaR;%KSq
z4;m=p4bEl8)(tK)M-eB>h>0^oaqMwo*$K#<XV%hw+LeE47vabsJaYfR0dyU~tq};r
zkj-YZ7Xa`G0PX<*YuVWp0Dd6iha^cZw#{7#FdB`*#bR+uL}ANL7fy$Wk>`0Q)9Exa
z4GIB-5LbudeD1J<7z_sYqbO35Sw9;9LWol$dVdHjU*N;JlyXuEz&XEM<^3N!m4oy7
ze3GW=M)+((uF`lyL{GJOK1(T2ssMiK8@Au?kBf58rt|sO3L?w0D{Zb+N_nRWfOG>X
zWv5!fIWP5R!?~&t+E{sgjw*ll1_*-S;c~frf{4Em@lzbfU&|ot+FJ(@LcAuTyDO(}
zq?9kq0P5OX2jHB)Gxp5$GJqZI?e2jc9I6ZK07`$OE&@_k?HQLsE`<zb?dC6(D<}Zm
zwt1XD#A{vA8xt}^L2WXqvDb>;7y#$|jqTOfZeQ0)lDtyyjR6Ef@PLROYv&$YQMl>#
zdLQFB{?;hKHgBDfIUzH0qiWNbspL|~rI1UZ<G)g_6<VERas@5Xjk@-B?*p1b-_jLy
z8$ezAs=wmibs<~liG1Au65y}mZkA=^wky;77I)3^`i19t=WSQ08DpXE`)5RSTDQEe
z8VF~$b9<NZ5%HPXFWcC}j4|f>{`W&{F(pYdHo^bRCSOju>X)e&PiJjb0QfQ-4&R#1
uz4i5Tms~ugZ#r!sHL(y5povx7XN=#fR!&c{;;+R30000<MNUMnLSTYmHZp(!

literal 0
HcmV?d00001

diff --git a/src/assets/icons/dark/area13-detail.png b/src/assets/icons/dark/area13-detail.png
new file mode 100644
index 0000000000000000000000000000000000000000..ecb5c796027abc0af35d1d156beefa9cd9d72965
GIT binary patch
literal 590
zcmV-U0<ryxP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px%2uVaiRA@u(nZ0fkQ4oc{BOxU;P=x|Pm4X5q%0x62NO=P2sGv)i=b)o=Nrj&v
zQi>Fj;)>D|6^*4tf{HY;g{6r`@>-kq{%GyJ>$SPltu(uL&ive&og+3}wBhy>0jxWM
zg%L2bUEnqF9C!lkv~27I_zest4U5js1z={6f%m|pmW?ht?gr>f`kPfK0`R#*#wRvA
zh;Nd{X%Gtl%<Ls_)Dh2T&A5~_r~>c-c$QM~{PP#x1FeafdHNm#?$AU=lKNEujxz<@
zYuot5z!?Zn=R_uwzE%M^xu+m~Y0d392bo!^J$W_oe*rMFr@#x~AMi`kRawNA&<`5{
zGkXI(oEbfpbY20Vu6}R;?=m%WRso={egsf@3z=D6kJi<X5r`2;7xfY;7gK0EQYh6y
z9|WF_ZqpsTu~{h7aRXyu-qD)`@D>Q|{lqb2Nf-XmBmf`U_5uId4=GdNr=;sf0Tfxh
z#I+bZaif1^F#=N6_#Hd(c68!+3(Y*RM9~MYfpmwSchHiE)zuFUAnDLPX3RTi34pr#
zVF84kDOwpNx(J|4%Uvg0KGj|B=B?KUdF)6?@2|36_nrJfNaI%c_Gy+c%iB&nnfI}a
z6qBT07JLy$=In^4QkO`+?|DQ^DbYRS%U%I{Yob~I03+asB&S^$Br^3Y6l5c>#t1ax
c#uYwt2ZM9^K;?M>kN^Mx07*qoM6N<$f^rN3tN;K2

literal 0
HcmV?d00001

diff --git a/src/assets/icons/dark/area13.png b/src/assets/icons/dark/area13.png
new file mode 100644
index 0000000000000000000000000000000000000000..7e28911059771e29d9fe6813bfa823bf64cd7093
GIT binary patch
literal 578
zcmV-I0=@l-P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px${7FPXRA@u(S*=pTKoI^u2?~Z6pl<*Y6ny|B8c;|Ei=h}SSX8M+;{gK_-T+>p
zLsgMWcP7_K(<Iki@7ko?nl#hB-1qHI_OeSfT-b2@hy<4H!9ov+$OeFO00#he0O<W9
zWdPt4K#$}@(Z;z1L}VMlGXTBTLB0XBN$Pb%iU@qw2)qHT;CD%?XT~x`KtxUebn9UD
z91PbaJ2nCuIvV#zdZQnmJokkpnS`-|Jx=ZOLb7cm@RLc{)}p~1fC&i=XCniWn>GS6
zp)m4UNK4zEEh43O@^avR5fG7m07n3R0X&g>E3>MDepnBP$PIw41oV*Pg@r&>{on-d
zGdXi+Ay8F65-5EOiAYt8R@ILlh#p8MwL{3o5L%58N>$Kx+xcbA|NH5R?(Hm;skn1u
zv@Rc4be{xn0fe@`Vb&*ksW(0e>;X7ToqMcibW|7ucqIAml|T^~hu31P#9qJ1q6bLZ
z@jF)H)u_brEtFWmA?btXK)OPYD`<(ws_F+PU@G)lx`LJvsHz{9fa7st=4IZ_LNo8^
zS<!_+<D0wL_PUODv@bt39r0}JiN__K=_>#_uP`!GdtH0-y0DINnw^*Bb*FWh_ff|Y
z6UkQAs;fEVGc1#NnT~jtIc9wwO^oic!##s>snZu9NfrtCu;M(=XuJph0E->^KqjF~
QhyVZp07*qoM6N<$f?g8)=l}o!

literal 0
HcmV?d00001

diff --git a/src/assets/themes/editor-dark.json b/src/assets/themes/editor-dark.json
index b775110..edfdc90 100644
--- a/src/assets/themes/editor-dark.json
+++ b/src/assets/themes/editor-dark.json
@@ -28,6 +28,8 @@
     "fill-11": "#FF9A9A33",
     "stroke-12": "#0DBB8A99",
     "fill-12": "#0DBB8A33",
+    "stroke-13": "#e61e4aad",
+    "fill-13": "#e61e4a33",
     "strokeActive": "#FCC947"
   },
   "robot": {
diff --git a/src/components/card/area-edit-card.vue b/src/components/card/area-edit-card.vue
index effc01e..b5e68a2 100644
--- a/src/components/card/area-edit-card.vue
+++ b/src/components/card/area-edit-card.vue
@@ -65,6 +65,21 @@ const routes = computed<string[]>(
           </a-input>
         </a-col>
       </a-row>
+      <a-row v-if="area.type === MapAreaType.约束区" :gutter="[8, 8]">
+        <a-col :span="24">
+          <a-typography-text>{{ $t('最大可容纳AMR数') }}:</a-typography-text>
+        </a-col>
+        <a-col :span="24">
+          <a-input-number
+            class="full"
+            :placeholder="$t('请输入数量')"
+            :min="0"
+            :max="99"
+            :value="pen.area?.maxAmr"
+            @change="editor.updateArea(id, { maxAmr: $event as number })"
+          />
+        </a-col>
+      </a-row>
 
       <a-row :gutter="[8, 8]">
         <a-col :span="24">
@@ -108,7 +123,7 @@ const routes = computed<string[]>(
         </a-collapse-panel>
 
         <a-collapse-panel
-          v-if="[MapAreaType.互斥区, MapAreaType.非互斥区].includes(area.type)"
+          v-if="[MapAreaType.互斥区, MapAreaType.非互斥区, MapAreaType.约束区].includes(area.type)"
           :header="$t('绑定站点')"
         >
           <template #extra>
diff --git a/src/components/editor-toolbar.vue b/src/components/editor-toolbar.vue
index 4969dfb..d0f1c38 100644
--- a/src/components/editor-toolbar.vue
+++ b/src/components/editor-toolbar.vue
@@ -42,7 +42,7 @@ const canDelete = computed<boolean>(() => editor.value.current.value?.name === '
 
 <template>
   <a-space class="toolbar" :size="0">
-    <a-button
+    <!-- <a-button
       class="icon-btn tool-btn"
       :class="{ active: mode === MapAreaType.库区 }"
       size="large"
@@ -50,6 +50,15 @@ const canDelete = computed<boolean>(() => editor.value.current.value?.name === '
       @click="mode = MapAreaType.库区"
     >
       <i class="icon" :class="mode === MapAreaType.库区 ? 'area1-active' : 'area1'" />
+    </a-button> -->
+    <a-button
+      class="icon-btn tool-btn"
+      :class="{ active: mode === MapAreaType.约束区 }"
+      size="large"
+      :title="$t('添加约束区')"
+      @click="mode = MapAreaType.约束区"
+    >
+      <i class="icon" :class="mode === MapAreaType.约束区 ? 'area1-active' : 'area1'" />
     </a-button>
     <a-button
       class="icon-btn tool-btn ml-12"
diff --git a/src/pages/movement-supervision.vue b/src/pages/movement-supervision.vue
index 1555d36..00531ed 100644
--- a/src/pages/movement-supervision.vue
+++ b/src/pages/movement-supervision.vue
@@ -2,6 +2,8 @@
 import type { RobotRealtimeInfo } from '@api/robot';
 import { getSceneByGroupId, getSceneById, monitorSceneById } from '@api/scene';
 import { EditorService } from '@core/editor.service';
+import { useViewState } from '@core/useViewState';
+import { message } from 'ant-design-vue';
 import { isNil } from 'lodash-es';
 import { computed, onMounted, onUnmounted, provide, ref, shallowRef, watch } from 'vue';
 
@@ -52,6 +54,8 @@ onMounted(async () => {
   await readScene();
   await editor.value?.initRobots();
   await monitorScene();
+  // 自动恢复视图状态
+  await handleRestoreViewState();
 });
 onUnmounted(() => {
   client.value?.close();
@@ -80,6 +84,32 @@ const selectRobot = (id: string) => {
   current.value = { type: 'robot', id };
   editor.value?.inactive();
 };
+
+// 视图状态管理
+const { saveViewState, restoreViewState, isSaving } = useViewState();
+
+// 保存当前视图状态
+const handleSaveViewState = async () => {
+  if (!editor.value) return;
+
+  try {
+    await saveViewState(editor.value, props.sid, props.id);
+    message.success('视图状态保存成功');
+  } catch {
+    message.error('视图状态保存失败');
+  }
+};
+
+// 恢复视图状态
+const handleRestoreViewState = async () => {
+  if (!editor.value) return;
+
+  const restored = await restoreViewState(editor.value, props.sid, props.id);
+  if (!restored) {
+    // 如果没有保存的状态，使用默认的centerView
+    editor.value.centerView();
+  }
+};
 </script>
 
 <template>
@@ -87,6 +117,7 @@ const selectRobot = (id: string) => {
     <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-button type="primary" :loading="isSaving" @click="handleSaveViewState"> 保存比例 </a-button> -->
       </a-flex>
     </a-layout-header>
 
@@ -96,9 +127,9 @@ const selectRobot = (id: string) => {
           <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('库区')">
+          <!-- <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> -->
           <a-tab-pane key="3" :tab="$t('高级组')">
             <PenGroups v-if="editor" :token="EDITOR_KEY" :current="current?.id" />
           </a-tab-pane>
diff --git a/src/pages/scene-editor.vue b/src/pages/scene-editor.vue
index 74f5c1e..9bfe6ac 100644
--- a/src/pages/scene-editor.vue
+++ b/src/pages/scene-editor.vue
@@ -29,13 +29,13 @@ const saveScene = async () => {
   if (!json) return Promise.reject('无法获取场景数据');
   const res = await saveSceneById(props.id, json);
   if (!res) return Promise.reject('保存失败');
-  
+
   // 保存成功后重置历史记录状态，表示当前场景已保存
   if (editor.value?.store) {
     editor.value.store.historyIndex = undefined;
     editor.value.store.histories = [];
   }
-  
+
   message.success(t('场景保存成功'));
   return Promise.resolve();
 };
@@ -47,7 +47,6 @@ const pushScene = async () => {
   return Promise.resolve();
 };
 
-
 //#endregion
 
 const title = ref<string>('');
@@ -162,9 +161,9 @@ const selectRobot = (id: string) => {
               show-group-edit
             />
           </a-tab-pane>
-          <a-tab-pane key="2" :tab="$t('库区')">
+          <!-- <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> -->
           <a-tab-pane key="3" :tab="$t('高级组')">
             <PenGroups v-if="editor" :token="EDITOR_KEY" :current="current?.id" />
           </a-tab-pane>
diff --git a/src/services/editor.service.ts b/src/services/editor.service.ts
index 1d4d9a4..d2d245e 100644
--- a/src/services/editor.service.ts
+++ b/src/services/editor.service.ts
@@ -225,7 +225,7 @@ export class EditorService extends Meta2d {
   #mapSceneArea(pen: MapPen): StandardSceneArea | null {
     if (!pen.id || isEmpty(pen.area)) return null;
     const { id, label, desc, properties } = pen;
-    const { type, points, routes } = pen.area;
+    const { type, points, routes, maxAmr } = pen.area;
     const { x, y, width, height } = this.getPenRect(pen);
     // 进行坐标转换：左上角原点 -> 中心点原点，同时应用ratio缩放
     const transformedCoords = this.#transformCoordinate(x, y);
@@ -244,7 +244,7 @@ export class EditorService extends Meta2d {
     if (MapAreaType.库区 === type) {
       area.points = points?.filter((v) => this.getPenById(v)?.point?.type === MapPointType.动作点);
     }
-    if ([MapAreaType.互斥区, MapAreaType.非互斥区].includes(type)) {
+    if ([MapAreaType.互斥区, MapAreaType.非互斥区, MapAreaType.约束区].includes(type)) {
       area.points = points?.filter((v) => {
         const { point } = this.getPenById(v) ?? {};
         if (isNil(point)) return false;
@@ -255,6 +255,9 @@ export class EditorService extends Meta2d {
     if (MapAreaType.互斥区 === type) {
       area.routes = routes?.filter((v) => !isEmpty(this.getPenById(v)?.area));
     }
+    if (MapAreaType.约束区 === type) {
+      area.maxAmr = maxAmr;
+    }
     return area;
   }
   //#endregion
@@ -777,6 +780,10 @@ export class EditorService extends Meta2d {
         case MapAreaType.非互斥区:
           selected?.filter(({ point }) => point?.type).forEach(({ id }) => points.push(id!));
           break;
+        case MapAreaType.约束区:
+          selected?.filter(({ point }) => point?.type).forEach(({ id }) => points.push(id!));
+          break;
+
         default:
           break;
       }