| | |
| | | </div> |
| | | <div class="row"> |
| | | <div class="drone-control-direction"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_Q)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_Q)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <UndoOutlined/> |
| | | </template> |
| | | <span class="word">Q</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_W)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_W)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <UpOutlined/> |
| | | </template> |
| | | <span class="word">W</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_E)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_E)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <RedoOutlined/> |
| | | </template> |
| | | <span class="word">E</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_UP)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_UP)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <ArrowUpOutlined/> |
| | | </template> |
| | | </Button> |
| | | <br/> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_A)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_A)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <LeftOutlined/> |
| | | </template> |
| | | <span class="word">A</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_S)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_S)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <DownOutlined/> |
| | | </template> |
| | | <span class="word">S</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_D)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_D)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <RightOutlined/> |
| | | </template> |
| | | <span class="word">D</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_DOWN)" @onmouseup="onMouseUp"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_DOWN)" @mouseup="onMouseUp"> |
| | | <template #icon> |
| | | <ArrowDownOutlined/> |
| | | </template> |