<script lang="ts" setup>
const props = defineProps({
  modelValue: String,
  placeholder: {
    type: String,
    default: '请扫描或输入车辆编号',
  },
})
const emit = defineEmits(['update:modelValue', 'scan-change'])

const inputCodeValue = ref(props.modelValue)

function onScan() {
  uni.scanCode({
    onlyFromCamera: true, // 只能扫码
    scanType: ['qrCode'],
    success(res) {
      const { result } = res
      // console.log('扫码结果', result)
      emit('scan-change', result)
    },
    fail(err) {
      console.log('扫码失败', err)
    },
  })
}

watch(() => props.modelValue, (newVal) => {
  inputCodeValue.value = newVal
})
watch(inputCodeValue, (newVal) => {
  emit('update:modelValue', newVal)
})
</script>

<template>
  <uv-input
    v-model="inputCodeValue"
    :placeholder="props.placeholder"
  >
    <template #suffix>
      <uv-icon size="22" name="scan" @click="onScan" />
    </template>
  </uv-input>
</template>

<style lang="scss" scoped>
//
</style>
