<template>
  <Button
    type="primary"
    size="small"
    :touchable="!disabled"
    :text="props.modelValue ? `${FormatUtils.formatCoordinates(props.modelValue[0], props.modelValue[1])}` : '请选择经纬度'"
    @click="openPicker"
  />
</template>

<script setup lang="ts">
import { FormatUtils } from '@imengyu/imengyu-utils';
import type { PickerLonlatProps } from './PickerLonlat';
import Button from '@/components/basic/Button.vue';

const props = defineProps<PickerLonlatProps & {
  modelValue: number[],
}>()

const emit = defineEmits(['update:modelValue', 'change']);

function openPicker() {
  if (props.disabled)
    return;
  uni.chooseLocation({
    latitude: props.modelValue?.[0] || props.defaultLongLat?.[0],
    longitude: props.modelValue?.[1] || props.defaultLongLat?.[1],
    success: (res) => {
      console.log(res);
      emit('change', [res.latitude, res.longitude]);
      emit('update:modelValue', [res.latitude, res.longitude]);
    },
  });
}

</script>
