inl-ui 0.0.37 → 0.0.39

package/src/pageComponent/views/boardScreen/room.tsx

@@ -1,180 +1,180 @@
-import { defineComponent, PropType, ref, watch } from "vue";
-import Card1Outer from "@/pageComponent/components/boardScreen/Card1Outer";
-import PowerCut from "@/pageComponent/components/boardScreen/PowerCut";
-import PowerSupply from "@/pageComponent/components/boardScreen/PowerSupply";
-
-const props = {
-  roomData: {
-    type: Object as PropType<any>,
-  },
-  powerData: {
-    type: Array as PropType<Array<any>>,
-    default: [],
-  },
-};
-
-// const tabConfig = [
-//   {
-//     name: "待停电",
-//     key: "powersupply_off_execute",
-//     componentName: "power-cut",
-//   },
-//   {
-//     name: "待送电",
-//     key: "powersupply_on_execute",
-//     componentName: "power-supply",
-//   },
-// ];
-
-export default defineComponent({
-  name: "Room",
-  components: {
-    Card1Outer,
-    PowerCut,
-    PowerSupply,
-  },
-  props,
-  setup(this, _props, _ctx) {
-    const roomData = ref<any>({});
-    const powerData = ref<Array<any>>([]);
-    const roomChange = () => {
-      _ctx.emit("roomChange");
-    };
-    // const rowChange = () => {
-    //   _ctx.emit("rowChange");
-    // };
-    watch(
-      () => _props.roomData,
-      (e) => {
-        if (e) {
-          roomData.value = e;
-        }
-      },
-      {
-        immediate: true,
-        deep: true,
-      }
-    );
-    watch(
-      () => _props.powerData,
-      (e) => {
-        if (e) {
-          powerData.value = e;
-        }
-      },
-      {
-        immediate: true,
-        deep: true,
-      }
-    );
-    return () => (
-      <div class="room">
-        <div class="room-header">
-          <card1-outer
-            v-slots={{
-              header: () => (
-                <div class="select-header">
-                  <div class="select-active-bar">
-                    <div class="select-item">
-                      <a-select
-                        v-model={[roomData.value.roomValue, "value"]}
-                        dropdownClassName="screen-select"
-                        bordered={false}
-                        onChange={roomChange}
-                        style={{ width: "70%" }}
-                        v-slots={{
-                          suffixIcon: () => <caret-down-outlined />,
-                        }}
-                      >
-                        {roomData.value.roomOptions?.map((item) => (
-                          <a-select-option value={item.roomId}>
-                            {item.name}
-                          </a-select-option>
-                        ))}
-                      </a-select>
-                    </div>
-                    {/* <div class="select-item">
-                      <a-select
-                        v-model={[roomData.value.rowValue, "value"]}
-                        dropdownClassName="screen-select"
-                        onChange={rowChange}
-                      >
-                        {roomData.value.rowOptions?.map((item) => (
-                          <a-select-option value={item.value}>
-                            {item.name}
-                          </a-select-option>
-                        ))}
-                      </a-select>
-                    </div> */}
-                  </div>
-                </div>
-              ),
-            }}
-          ></card1-outer>
-        </div>
-        {powerData.value.length > 0 && (
-          <div class="room-content">
-            <div class="room-content-panel">
-              {powerData.value.map((item) => (
-                <div
-                  class={[
-                    "room-content-panel-item",
-                    roomData.value.rowValue === item.row
-                      ? "room-content-panel-item-active"
-                      : "",
-                  ]}
-                  onClick={() => {
-                    roomData.value.rowValue = item.row;
-                    _ctx.emit("rowChange");
-                  }}
-                >
-                  <div class="room-content-panel-item-title">
-                    第{item.row}排/配电柜{item.cabinetListDtos.length}列:
-                    控制回路 共{item.loopTotal}个
-                  </div>
-                  <div class="room-content-panel-item-content">
-                    <div class="room-content-panel-item-content-state">
-                      <div class="room-content-panel-item-content-state-col">
-                        <span class="green"></span>
-                        分闸
-                      </div>
-                      {item.openTotal}
-                    </div>
-                    <div class="room-content-panel-item-content-state">
-                      <img
-                        src="/micro-assets/platform-web/breakBrakePadlock.png"
-                        alt=""
-                      />
-                      {item.lockTotal}
-                    </div>
-                    <div class="room-content-panel-item-content-state">
-                      <div class="room-content-panel-item-content-state-col">
-                        <span class="white"></span>
-                        断连
-                      </div>
-                      {item.disconnectionTotal}
-                    </div>
-                    <div class="room-content-panel-item-content-state">
-                      <div class="room-content-panel-item-content-state-col">
-                        <span class="red"></span>
-                        合闸
-                      </div>
-                      {item.closeTotal}
-                    </div>
-                    <div class="room-content-panel-item-content-state">
-                      <div class="room-content-panel-item-content-state-col">
-                        <span class="grey"></span>
-                        备用
-                      </div>
-                      {item.reserveTotal}
-                    </div>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </div>
-        )}
-      </div>
-    );
-  },
-});
+import { defineComponent, PropType, ref, watch } from "vue";
+import Card1Outer from "@/pageComponent/components/boardScreen/Card1Outer";
+import PowerCut from "@/pageComponent/components/boardScreen/PowerCut";
+import PowerSupply from "@/pageComponent/components/boardScreen/PowerSupply";
+
+const props = {
+  roomData: {
+    type: Object as PropType<any>,
+  },
+  powerData: {
+    type: Array as PropType<Array<any>>,
+    default: [],
+  },
+};
+
+// const tabConfig = [
+//   {
+//     name: "待停电",
+//     key: "powersupply_off_execute",
+//     componentName: "power-cut",
+//   },
+//   {
+//     name: "待送电",
+//     key: "powersupply_on_execute",
+//     componentName: "power-supply",
+//   },
+// ];
+
+export default defineComponent({
+  name: "Room",
+  components: {
+    Card1Outer,
+    PowerCut,
+    PowerSupply,
+  },
+  props,
+  setup(this, _props, _ctx) {
+    const roomData = ref<any>({});
+    const powerData = ref<Array<any>>([]);
+    const roomChange = () => {
+      _ctx.emit("roomChange");
+    };
+    // const rowChange = () => {
+    //   _ctx.emit("rowChange");
+    // };
+    watch(
+      () => _props.roomData,
+      (e) => {
+        if (e) {
+          roomData.value = e;
+        }
+      },
+      {
+        immediate: true,
+        deep: true,
+      }
+    );
+    watch(
+      () => _props.powerData,
+      (e) => {
+        if (e) {
+          powerData.value = e;
+        }
+      },
+      {
+        immediate: true,
+        deep: true,
+      }
+    );
+    return () => (
+      <div class="room">
+        <div class="room-header">
+          <card1-outer
+            v-slots={{
+              header: () => (
+                <div class="select-header">
+                  <div class="select-active-bar">
+                    <div class="select-item">
+                      <a-select
+                        v-model={[roomData.value.roomValue, "value"]}
+                        dropdownClassName="screen-select"
+                        bordered={false}
+                        onChange={roomChange}
+                        style={{ width: "70%" }}
+                        v-slots={{
+                          suffixIcon: () => <caret-down-outlined />,
+                        }}
+                      >
+                        {roomData.value.roomOptions?.map((item) => (
+                          <a-select-option value={item.roomId}>
+                            {item.name}
+                          </a-select-option>
+                        ))}
+                      </a-select>
+                    </div>
+                    {/* <div class="select-item">
+                      <a-select
+                        v-model={[roomData.value.rowValue, "value"]}
+                        dropdownClassName="screen-select"
+                        onChange={rowChange}
+                      >
+                        {roomData.value.rowOptions?.map((item) => (
+                          <a-select-option value={item.value}>
+                            {item.name}
+                          </a-select-option>
+                        ))}
+                      </a-select>
+                    </div> */}
+                  </div>
+                </div>
+              ),
+            }}
+          ></card1-outer>
+        </div>
+        {powerData.value.length > 0 && (
+          <div class="room-content">
+            <div class="room-content-panel">
+              {powerData.value.map((item) => (
+                <div
+                  class={[
+                    "room-content-panel-item",
+                    roomData.value.rowValue === item.row
+                      ? "room-content-panel-item-active"
+                      : "",
+                  ]}
+                  onClick={() => {
+                    roomData.value.rowValue = item.row;
+                    _ctx.emit("rowChange");
+                  }}
+                >
+                  <div class="room-content-panel-item-title">
+                    第{item.row}排/配电柜{item.cabinetListDtos.length}列:
+                    控制回路 共{item.loopTotal}个
+                  </div>
+                  <div class="room-content-panel-item-content">
+                    <div class="room-content-panel-item-content-state">
+                      <div class="room-content-panel-item-content-state-col">
+                        <span class="green"></span>
+                        分闸
+                      </div>
+                      {item.openTotal}
+                    </div>
+                    <div class="room-content-panel-item-content-state">
+                      <img
+                        src="/micro-assets/platform-web/breakBrakePadlock.png"
+                        alt=""
+                      />
+                      {item.lockTotal}
+                    </div>
+                    <div class="room-content-panel-item-content-state">
+                      <div class="room-content-panel-item-content-state-col">
+                        <span class="white"></span>
+                        断连
+                      </div>
+                      {item.disconnectionTotal}
+                    </div>
+                    <div class="room-content-panel-item-content-state">
+                      <div class="room-content-panel-item-content-state-col">
+                        <span class="red"></span>
+                        合闸
+                      </div>
+                      {item.closeTotal}
+                    </div>
+                    <div class="room-content-panel-item-content-state">
+                      <div class="room-content-panel-item-content-state-col">
+                        <span class="grey"></span>
+                        备用
+                      </div>
+                      {item.reserveTotal}
+                    </div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  },
+});

package/src/pageComponent/views/boardScreen/tupu.tsx

@@ -1,143 +1,143 @@
-import {
-  defineComponent,
-  PropType,
-  ref,
-  getCurrentInstance,
-  computed,
-  watch,
-  nextTick,
-  onMounted,
-} from "vue";
-import renderCabinet from "@/pageComponent/components/pss-cabinet/cabinetRender";
-import Card2Outer from "@/pageComponent/components/boardScreen/Card2Outer";
-import PopBox from "@/pageComponent/components/boardScreen/PopBox";
-
-const props = {
-  tupuData: {
-    type: Object as PropType<any>,
-  },
-  tupuState: String,
-  setCamera: Boolean,
-};
-
-export default defineComponent({
-  components: {
-    Card2Outer,
-    PopBox,
-  },
-  props,
-  setup(this, _props, _ctx) {
-    const visible = ref(false);
-    const loopInfo = ref<any>({});
-    const point = ref({
-      x: 0,
-      y: 0,
-    });
-    let cabinet: any | null;
-    const { proxy } = getCurrentInstance() as any;
-    const tupuId = computed(() => {
-      return `tupu-canvas-${proxy._.uid}`;
-    });
-    watch(
-      () => _props.tupuData,
-      (e) => {
-        visible.value = false;
-
-        nextTick(() => {
-          const obj = {
-            data: _props.tupuData,
-            renderState: _props.tupuState as any,
-          };
-          if (!cabinet) {
-            cabinet = new renderCabinet({
-              domId: tupuId.value,
-              ...obj,
-            });
-          } else {
-            cabinet.setData(obj.data, obj.renderState);
-          }
-
-          if (_props.setCamera) {
-            if (_props.tupuState === "group") {
-              cabinet.moveCamera(
-                [-808.2474023763542, 878.9056431567024, 429.75276695939766],
-                [
-                  21.279428160225734, -0.000017447926552449644,
-                  -237.51014124864875,
-                ],
-                true
-              );
-            } else {
-              cabinet.moveCamera(
-                [-7.724165160503688, 164.98333183431518, 664.9434884712],
-                [-10.705888481503514, 156.74101560047455, -269.40426442260787],
-                true
-              );
-            }
-          }
-        });
-      },
-      {
-        deep: true,
-        immediate: true,
-      }
-    );
-    watch(
-      () => visible.value,
-      (e) => {
-        if (!visible.value) {
-          loopInfo.value = {};
-        }
-      }
-    );
-    onMounted(() => {
-      init();
-    });
-    const init = () => {
-      new ht.DataModel();
-      (window as any).cabinetLoopClick = loopClick;
-      (window as any).rowClick = rowClick;
-
-      nextTick(() => {
-        const tupuCanvas = document.getElementById(tupuId.value);
-
-        tupuCanvas!.onmousedown = () => {
-          visible.value = false;
-        };
-
-        tupuCanvas!.onwheel = () => {
-          visible.value = false;
-        };
-      });
-    };
-    const rowClick = (rowId: string) => {
-      rowId = rowId.match(/\d+/)?.[0] || "";
-      visible.value = false;
-      _ctx.emit("rowClick", Number(rowId));
-    };
-
-    const loopClick = (event: MouseEvent, loopId: any) => {
-      const info = JSON.parse(loopId);
-      const { x, y } = event;
-
-      point.value = {
-        x,
-        y,
-      };
-      visible.value = true;
-      loopInfo.value = info;
-    };
-    return () => (
-      <div class="tupu">
-        <div class="tupu-3d-content">
-          <div id={tupuId.value} class="tupu-canvas"></div>
-        </div>
-        <pop-box
-          v-model={[visible.value, "visible"]}
-          loopInfo={loopInfo.value}
-          point={point.value}
-        />
-      </div>
-    );
-  },
-});
+import {
+  defineComponent,
+  PropType,
+  ref,
+  getCurrentInstance,
+  computed,
+  watch,
+  nextTick,
+  onMounted,
+} from "vue";
+import renderCabinet from "@/pageComponent/components/pss-cabinet/cabinetRender";
+import Card2Outer from "@/pageComponent/components/boardScreen/Card2Outer";
+import PopBox from "@/pageComponent/components/boardScreen/PopBox";
+
+const props = {
+  tupuData: {
+    type: Object as PropType<any>,
+  },
+  tupuState: String,
+  setCamera: Boolean,
+};
+
+export default defineComponent({
+  components: {
+    Card2Outer,
+    PopBox,
+  },
+  props,
+  setup(this, _props, _ctx) {
+    const visible = ref(false);
+    const loopInfo = ref<any>({});
+    const point = ref({
+      x: 0,
+      y: 0,
+    });
+    let cabinet: any | null;
+    const { proxy } = getCurrentInstance() as any;
+    const tupuId = computed(() => {
+      return `tupu-canvas-${proxy._.uid}`;
+    });
+    watch(
+      () => _props.tupuData,
+      (e) => {
+        visible.value = false;
+
+        nextTick(() => {
+          const obj = {
+            data: _props.tupuData,
+            renderState: _props.tupuState as any,
+          };
+          if (!cabinet) {
+            cabinet = new renderCabinet({
+              domId: tupuId.value,
+              ...obj,
+            });
+          } else {
+            cabinet.setData(obj.data, obj.renderState);
+          }
+
+          if (_props.setCamera) {
+            if (_props.tupuState === "group") {
+              cabinet.moveCamera(
+                [-808.2474023763542, 878.9056431567024, 429.75276695939766],
+                [
+                  21.279428160225734, -0.000017447926552449644,
+                  -237.51014124864875,
+                ],
+                true
+              );
+            } else {
+              cabinet.moveCamera(
+                [-7.724165160503688, 164.98333183431518, 664.9434884712],
+                [-10.705888481503514, 156.74101560047455, -269.40426442260787],
+                true
+              );
+            }
+          }
+        });
+      },
+      {
+        deep: true,
+        immediate: true,
+      }
+    );
+    watch(
+      () => visible.value,
+      (e) => {
+        if (!visible.value) {
+          loopInfo.value = {};
+        }
+      }
+    );
+    onMounted(() => {
+      init();
+    });
+    const init = () => {
+      new ht.DataModel();
+      (window as any).cabinetLoopClick = loopClick;
+      (window as any).rowClick = rowClick;
+
+      nextTick(() => {
+        const tupuCanvas = document.getElementById(tupuId.value);
+
+        tupuCanvas!.onmousedown = () => {
+          visible.value = false;
+        };
+
+        tupuCanvas!.onwheel = () => {
+          visible.value = false;
+        };
+      });
+    };
+    const rowClick = (rowId: string) => {
+      rowId = rowId.match(/\d+/)?.[0] || "";
+      visible.value = false;
+      _ctx.emit("rowClick", Number(rowId));
+    };
+
+    const loopClick = (event: MouseEvent, loopId: any) => {
+      const info = JSON.parse(loopId);
+      const { x, y } = event;
+
+      point.value = {
+        x,
+        y,
+      };
+      visible.value = true;
+      loopInfo.value = info;
+    };
+    return () => (
+      <div class="tupu">
+        <div class="tupu-3d-content">
+          <div id={tupuId.value} class="tupu-canvas"></div>
+        </div>
+        <pop-box
+          v-model={[visible.value, "visible"]}
+          loopInfo={loopInfo.value}
+          point={point.value}
+        />
+      </div>
+    );
+  },
+});