<template>
    <div
      :style="{
        width: 1280,
        height: 720,
        backgroundColor: '#007788',
      }"
    >
      <!-- 带缺口的矩形 -->
      <DashPath
        :points="[
          { x: 200, y: 0 }, // 右上角
          { x: 200, y: 100 }, // 右边中点（缺口处）
          { x: 150, y: 100 }, // 缺口上边
          { x: 150, y: 150 }, // 缺口左边
          { x: 0, y: 150 }, // 左下角
          { x: 0, y: 0 }, // 左上角
        ]"
        :dash="[5, 5]"
        color="#FF0000"
        :lineWidth="2"
        :layout="{
          left: 150,
          top: 150,
          width: 250,
          height: 200,
        }"
      />
    </div>
  </template>
  
  <script setup>
  import DashPath from "./DashPath.vue";
  </script>
  