EditScrollElement.vue 825 B

123456789101112131415161718192021222324252627282930313233
  1. <template>
  2. <edit-interaction-base v-bind="{ data }" @change="updateData">
  3. <div class="flex items-center mt-3 space-x-2">
  4. <ui-input
  5. :model-value="data.scrollX || 0"
  6. type="number"
  7. label="Scroll horizontal"
  8. @change="updateData({ scrollX: +$event })"
  9. />
  10. <ui-input
  11. :model-value="data.scrollY || 0"
  12. type="number"
  13. label="Scroll vertical"
  14. @change="updateData({ scrollY: +$event })"
  15. />
  16. </div>
  17. </edit-interaction-base>
  18. </template>
  19. <script setup>
  20. import EditInteractionBase from './EditInteractionBase.vue';
  21. const props = defineProps({
  22. data: {
  23. type: Object,
  24. default: () => ({}),
  25. },
  26. });
  27. const emit = defineEmits(['update:data']);
  28. function updateData(value) {
  29. emit('update:data', { ...props.data, ...value });
  30. }
  31. </script>