<template>
  <div class="view-box">
    <div id="toolbar">组件插槽</div>
    <div class="container"  :style="style">
      <VueDragResizeRotate :parent="true">
        <p>基本组件内插入表单</p>
        <form>
          <input type="text" name="input" value="Hello" />
          <button type="submit">Submit</button>
        </form>
      </VueDragResizeRotate>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      style: {
        position: "relative",
        backgroundColor: "#808080",
        background:
          "linear-gradient(-90deg, rgba(0, 0, 0, .1) 1px, transparent 1px), linear-gradient(rgba(0, 0, 0, .1) 1px, transparent 1px)",
        backgroundSize: "20px 20px, 20px 20px",
        height: "100%",
        width: "100%"
      }
    };
  }
};
</script>