From 9118eae00f6760ead481bde717675d679d6ed13a Mon Sep 17 00:00:00 2001
From: joylink_zhaoerwei <Bob_Engineer@163.com>
Date: Tue, 29 Aug 2023 14:50:54 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=B8=80=E9=94=AE=E7=94=9F?=
 =?UTF-8?q?=E6=88=90=E7=BB=A7=E7=94=B5=E5=99=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../properties/RelayCabinetProperty.vue       | 108 +++++++++++++++---
 src/graphics/relayCabinet/RelayCabinet.ts     |   2 -
 .../relayCabinet/RelayCabinetDrawAssistant.ts |  30 ++++-
 3 files changed, 124 insertions(+), 16 deletions(-)

diff --git a/src/components/draw-app/properties/RelayCabinetProperty.vue b/src/components/draw-app/properties/RelayCabinetProperty.vue
index c57facd..2024fe7 100644
--- a/src/components/draw-app/properties/RelayCabinetProperty.vue
+++ b/src/components/draw-app/properties/RelayCabinetProperty.vue
@@ -8,10 +8,18 @@
       label="继电器柜"
       lazy-rules
     />
+    <q-input
+      outlined
+      v-model.number="horizontalRelayCabinet"
+      @blur="changeHorizontalRelayCabinet"
+      label="继电器柜水平间距"
+      type="number"
+      lazy-rules
+    />
     <q-input
       outlined
       v-model.number="horizontalSpace"
-      @blur="changehorizontalSpace"
+      @blur="changeHorizontalSpace"
       label="继电器水平间距"
       type="number"
       lazy-rules
@@ -24,20 +32,27 @@
       type="number"
       lazy-rules
     />
+    <q-btn color="primary" label="一键生成继电器" @click="oneClickRelay" />
   </q-form>
 </template>
 
 <script setup lang="ts">
 import { RelayCabinetData } from 'src/drawApp/relayCabinetGraphics/RelayCabinetInteraction';
+import { RelayData } from 'src/drawApp/relayCabinetGraphics/RelayInteraction';
 import { Relay } from 'src/graphics/relay/Relay';
-import { RelayCabinet } from 'src/graphics/relayCabinet/RelayCabinet';
+import {
+  RelayCabinet,
+  relayCabinetConsts,
+} from 'src/graphics/relayCabinet/RelayCabinet';
+import { GraphicCreateOperation, GraphicIdGenerator } from 'src/jl-graphic';
 import { useRelayCabinetStore } from 'src/stores/relayCabinet-store';
 import { onMounted, reactive, ref, watch } from 'vue';
 
 const relayCabinetStore = useRelayCabinetStore();
 const relayCabinetModel = reactive(new RelayCabinetData());
-const horizontalSpace = ref(50);
-const verticalSpace = ref(50);
+const horizontalRelayCabinet = ref(300);
+const horizontalSpace = ref(45);
+const verticalSpace = ref(48);
 
 relayCabinetStore.$subscribe;
 watch(
@@ -76,12 +91,44 @@ function containBoth(relayCabinet: RelayCabinet, relay: Relay) {
   }
   return false;
 }
-function changehorizontalSpace() {
-  const RelayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
-  if (RelayCabinet) {
-    const relays = RelayCabinet.queryStore
+function changeHorizontalRelayCabinet() {
+  const relayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
+  const relayCabinets = relayCabinet.queryStore.queryByType<RelayCabinet>(
+    RelayCabinet.Type
+  );
+  const vertical = [...new Set(relayCabinets.map((g) => g.y))].sort(
+    (a, b) => a - b
+  );
+  const verticalRelayCabinet: RelayCabinet[][] = [];
+  vertical.forEach((sameY, index) => {
+    relayCabinets.forEach((relayCabinet) => {
+      if (relayCabinet.y == sameY) {
+        if (verticalRelayCabinet[index] == undefined) {
+          verticalRelayCabinet[index] = [relayCabinet];
+        } else {
+          verticalRelayCabinet[index].push(relayCabinet);
+        }
+      }
+    });
+  });
+  verticalRelayCabinet.forEach((relayCabinets) => {
+    for (let i = 1; i < relayCabinets.length; i++) {
+      if (
+        relayCabinets[i].x - relayCabinets[i - 1].x !==
+        horizontalRelayCabinet.value
+      ) {
+        relayCabinets[i].x =
+          relayCabinets[i - 1].x + horizontalRelayCabinet.value;
+      }
+    }
+  });
+}
+function changeHorizontalSpace() {
+  const relayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
+  if (relayCabinet) {
+    const relays = relayCabinet.queryStore
       .queryByType<Relay>(Relay.Type)
-      .filter((g) => containBoth(RelayCabinet, g));
+      .filter((g) => containBoth(relayCabinet, g));
     const vertical = [...new Set(relays.map((g) => g.y))].sort((a, b) => a - b);
     const verticalRelay: Relay[][] = [];
     vertical.forEach((sameY, index) => {
@@ -105,11 +152,11 @@ function changehorizontalSpace() {
   }
 }
 function changeVerticalSpace() {
-  const RelayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
-  if (RelayCabinet) {
-    const relays = RelayCabinet.queryStore
+  const relayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
+  if (relayCabinet) {
+    const relays = relayCabinet.queryStore
       .queryByType<Relay>(Relay.Type)
-      .filter((g) => containBoth(RelayCabinet, g));
+      .filter((g) => containBoth(relayCabinet, g));
     const horizontal = [...new Set(relays.map((g) => g.x))].sort(
       (a, b) => a - b
     );
@@ -134,4 +181,39 @@ function changeVerticalSpace() {
     });
   }
 }
+function oneClickRelay() {
+  const relayCabinet = relayCabinetStore.selectedGraphic as RelayCabinet;
+  const containRelays = relayCabinet.queryStore
+    .queryByType<Relay>(Relay.Type)
+    .filter((g) => containBoth(relayCabinet, g));
+  if (!containRelays.length) {
+    const numRows = 3;
+    const numCols = 6;
+    const relays: Relay[][] = new Array(numRows);
+    for (let i = 0; i < numRows; i++) {
+      relays[i] = new Array(numCols);
+      for (let j = 0; j < numCols; j++) {
+        const relay = new Relay();
+        relay.loadData(new RelayData());
+        relay.id = GraphicIdGenerator.next();
+        relay.position.set(
+          relayCabinet.x -
+            relayCabinetConsts.width / 2 +
+            30 +
+            i * horizontalSpace.value,
+          relayCabinet.y -
+            relayCabinetConsts.height / 2 +
+            30 +
+            j * verticalSpace.value
+        );
+        relays[i][j] = relay;
+      }
+    }
+    const app = relayCabinetStore.getDrawApp();
+    app.addGraphics(...relays.flat());
+    app.opRecord.record(
+      new GraphicCreateOperation(relayCabinetStore.getDrawApp(), relays.flat())
+    );
+  }
+}
 </script>
diff --git a/src/graphics/relayCabinet/RelayCabinet.ts b/src/graphics/relayCabinet/RelayCabinet.ts
index 67a02db..2c8fb0e 100644
--- a/src/graphics/relayCabinet/RelayCabinet.ts
+++ b/src/graphics/relayCabinet/RelayCabinet.ts
@@ -53,14 +53,12 @@ export class RelayCabinet extends JlGraphic {
         relayCabinetConsts.lineWidth,
         new Color(relayCabinetConsts.lineColor)
       );
-    relayCabinetGraphic.beginFill(relayCabinetConsts.lineColor, 0.00001);
     relayCabinetGraphic.drawRect(
       0,
       0,
       relayCabinetConsts.width,
       relayCabinetConsts.height
     );
-    relayCabinetGraphic.endFill;
     const rectP = new Rectangle(
       0,
       0,
diff --git a/src/graphics/relayCabinet/RelayCabinetDrawAssistant.ts b/src/graphics/relayCabinet/RelayCabinetDrawAssistant.ts
index ec337d8..8464230 100644
--- a/src/graphics/relayCabinet/RelayCabinetDrawAssistant.ts
+++ b/src/graphics/relayCabinet/RelayCabinetDrawAssistant.ts
@@ -1,4 +1,4 @@
-import { FederatedPointerEvent, Point } from 'pixi.js';
+import { FederatedPointerEvent, IHitArea, Point } from 'pixi.js';
 import {
   AbsorbableLine,
   AbsorbablePosition,
@@ -6,12 +6,14 @@ import {
   GraphicInteractionPlugin,
   JlDrawApp,
   JlGraphic,
+  linePoint,
 } from 'src/jl-graphic';
 
 import {
   IRelayCabinetData,
   RelayCabinet,
   RelayCabinetTemplate,
+  relayCabinetConsts,
 } from './RelayCabinet';
 
 export interface IRelayCabinetDrawOptions {
@@ -78,6 +80,31 @@ function buildAbsorbablePositions(
   return aps;
 }
 
+//碰撞检测
+export class RectGraphicHitArea implements IHitArea {
+  rect: RelayCabinet;
+  constructor(rect: RelayCabinet) {
+    this.rect = rect;
+  }
+  contains(x: number, y: number): boolean {
+    let contains = false;
+    const tolerance = relayCabinetConsts.lineWidth;
+    const p1 = new Point(0, 0);
+    const p2 = new Point(p1.x + relayCabinetConsts.width, p1.y);
+    const p3 = new Point(
+      p1.x + relayCabinetConsts.width,
+      p1.y + relayCabinetConsts.height
+    );
+    const p4 = new Point(p1.x, p1.y + relayCabinetConsts.height);
+    const p = new Point(x, y);
+    contains = contains || linePoint(p1, p2, p, tolerance);
+    contains = contains || linePoint(p2, p3, p, tolerance);
+    contains = contains || linePoint(p3, p4, p, tolerance);
+    contains = contains || linePoint(p4, p1, p, tolerance);
+    return contains;
+  }
+}
+
 export class relayCabinetInteraction extends GraphicInteractionPlugin<RelayCabinet> {
   static Name = 'relayCabinet_transform';
   constructor(app: JlDrawApp) {
@@ -97,6 +124,7 @@ export class relayCabinetInteraction extends GraphicInteractionPlugin<RelayCabin
     g.labelGraphic.eventMode = 'static';
     g.labelGraphic.selectable = true;
     g.labelGraphic.draggable = true;
+    g.relayCabinetGraphic.hitArea = new RectGraphicHitArea(g);
     g.on('transformstart', this.move, this);
   }
   unbind(g: RelayCabinet): void {