fixed the stmt and text

This commit is contained in:
Thomas 2022-04-10 00:11:49 -05:00
parent cc19c90e19
commit 567f2386bb
2 changed files with 21 additions and 7 deletions

View File

@ -6,19 +6,28 @@ const props = defineProps<{value: RichTextBox}>();
const emit = defineEmits<{ const emit = defineEmits<{
(eventName: 'move', x: number,y:number): void, (eventName: 'move', x: number,y:number): void,
(eventName: 'edit',): void,
(eventName: 'remove',): void,
}>() }>()
function onControlledDrag(e) { function onControlledDrag(e: {event: MouseEvent, data: {x: number, y: number}}) {
// const x = e.x;
// const y = e.y;
const { x, y } = e.data; const { x, y } = e.data;
props.value.x = x; props.value.x = x;
props.value.y = y; props.value.y = y;
console.log(e) console.log(e)
} }
function onControlledDragStop(e) { function onControlledDragStop(e: {event: MouseEvent, data: {x: number, y: number}}) {
// console.log(typeof(e))
const { x, y } = e.data; const { x, y } = e.data;
// const x = e.x;
// const y = e.y;
console.log(self) console.log(self)
emit('move', [x, y]); emit('move', x, y);
onControlledDrag(e); onControlledDrag(e);
} }
@ -41,7 +50,9 @@ function onControlledDragStop(e) {
<q-menu cover auto-close> <q-menu cover auto-close>
<q-list> <q-list>
<q-item clickable> <q-item clickable>
<q-item-section @click="() => $emit('edit')" <q-item-section @click="() => $emit('edit')">
<q-icon name="edit" />
<q-item-label>Edit</q-item-label>
>Edit</q-item-section >Edit</q-item-section
> >
</q-item> </q-item>

View File

@ -32,8 +32,10 @@ const variableListingColumns = [
}, },
] ]
const stmOnControlledDragStop = (stmt: MathStatement) => (e: MouseEvent) => { const stmOnControlledDragStop = (stmt: MathStatement) => (e: {event: MouseEvent, data: {x: number, y: number}}) => {
const { x, y } = e; console.log(e)
console.log("moved stm5", stmt)
const { x, y } = e.data;
stmt.x = x; stmt.x = x;
stmt.y = y; stmt.y = y;
} }
@ -253,7 +255,8 @@ const removeRichTextBox = (id: number) => {
<Draggable <Draggable
:grid="[stepX, stepY]" :grid="[stepX, stepY]"
:position="{ x: statement.x, y: statement.y }" :position="{ x: statement.x, y: statement.y }"
@stop="stmOnControlledDragStop(statement)" :default-position="{ x: statement.x, y: statement.y }"
@stop="(e: {event: MouseEvent, data: {x: number, y: number}}) => stmOnControlledDragStop(statement)(e)"
> >
<div> <div>
<Statement <Statement