初始化

src/components/spreadsheet/SelectionOverlay.vue

@@ -0,0 +1,26 @@
+<script setup>
+import { computed, ref, reactive } from 'vue'
+
+const props = defineProps(['selection', 'layoutInfo', 'isEditing'])
+defineEmits(['fill-drag-start'])
+
+const fillPreview = ref(false)
+const fillPreviewRect = reactive({ w:0, h:0 })
+
+const style = computed(() => ({
+  top: props.layoutInfo.top + 'px',
+  left: props.layoutInfo.left + 'px',
+  width: props.layoutInfo.width + 'px',
+  height: props.layoutInfo.height + 'px',
+}))
+</script>
+
+<template>
+  <div class="pointer-events-none z-20 absolute border-2 border-green-500 bg-green-500/10 transition-all duration-75"
+       :style="style">
+    <div v-if="!isEditing"
+         class="pointer-events-auto cursor-crosshair absolute w-2 h-2 bg-green-500 border border-white -bottom-1.5 -right-1.5 z-50"
+         @mousedown.stop="$emit('fill-drag-start', $event)"
+    ></div>
+  </div>
+</template>