50 lines
1.3 KiB
Vue
50 lines
1.3 KiB
Vue
<template>
|
||
<div>
|
||
<div class="flex justify-evenly w-full px-8 my-8">
|
||
<n-input v-model:value="qq" type="text" placeholder="请输入qq号" @keyup.enter="submit" @input="inputChange"></n-input>
|
||
<n-button class="w-32 ml-8" type="primary" size="medium" @click="submit">确认</n-button>
|
||
</div>
|
||
<div class="px-8" v-if="isSuccess">
|
||
<div class="mb-2">手机号: <span class="text-pp-400">{{ result.phone }}</span></div>
|
||
<div class="diqu">手机号地区: <span class="text-pp-400">{{ result.phonediqu }}</span></div>
|
||
</div>
|
||
<div class=" text-center text-[red]" v-else>
|
||
该qq号不存在或未绑定手机号!
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
//mark import
|
||
|
||
//mark data
|
||
const qq = ref('');
|
||
const result = ref({});
|
||
const isSuccess = ref(true);
|
||
//mark method
|
||
function inputChange() {
|
||
//只接受数字
|
||
qq.value = qq.value.replace(/\D/g, '');
|
||
|
||
}
|
||
async function submit() {
|
||
if (qq.value.length == 0) {
|
||
return;
|
||
}
|
||
const res = await $http.mix.qq2phone(qq.value);
|
||
console.log(res);
|
||
|
||
if (res.status == 200) {
|
||
result.value = res;
|
||
isSuccess.value = true;
|
||
|
||
} else {
|
||
isSuccess.value = false;
|
||
}
|
||
}
|
||
//mark 周期、内置函数等
|
||
|
||
|
||
</script>
|
||
|
||
<style scoped></style> |