File size: 1,288 Bytes
9954ac1 6a6e173 7edcc96 9954ac1 7edcc96 9954ac1 6a6e173 9954ac1 d81ec6c 9954ac1 d81ec6c 9954ac1 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | <template>
<button
:class="`${props.class} bg-gray-200 bg-opacity-50`"
:disabled="promptsArray.length === 0 || responseMessage === waitingString"
v-if="promptsArray.length === 0 || responseMessage === waitingString"
data-testid="submit-button-disabled"
aria-disabled="true"
>{{ responseMessage === waitingString ? responseMessage : '🚫 Empty prompt (disabled)' }}
</button>
<button
:class="`${props.class} bg-blue-300 whitespace-no-wrap overflow-hidden truncate`"
@click="sendMLRequest(map, promptsArray, currentBaseMapName)"
v-else
data-testid="submit-button"
aria-label="Send ML request"
>
<span v-if="responseMessage && responseMessage !== '-'">{{ responseMessage }}</span>
<span v-else>🔍 send ML request</span>
</button>
</template>
<script setup lang="ts">
import {Map as LMap} from 'leaflet';
import type { IPointPrompt, IRectanglePrompt, SourceTileType } from '@/components/types'
const props = defineProps<{
class: string,
currentBaseMapName: string,
promptsArray: Array<IPointPrompt | IRectanglePrompt>,
responseMessage: string,
map: LMap,
sendMLRequest: (map: LMap, prompts: Array<IPointPrompt | IRectanglePrompt>, sourceType: SourceTileType) => Promise<void>,
waitingString: string
}>()
</script> |