144 lines
3.3 KiB
Vue
144 lines
3.3 KiB
Vue
|
<template>
|
|||
|
|
<div>
|
|||
|
|
<br>
|
|||
|
|
<div style="max-width: 350px;margin: 0 auto;">
|
|||
|
|
|
|||
|
|
|
|||
|
|
<input type="text" placeholder="请输入QQ账号" v-model="qq" class="mh_liti" style="width:80%;height:2.5em;margin: 1em auto;padding:2px 2px 2px 1em;box-sizing: border-box;">
|
|||
|
|
<button style="width:80%;height:2.5em;margin: 1em auto;box-sizing: border-box;" @click="search" :disabled="wait">{{btnTitle}}</button>
|
|||
|
|
</div>
|
|||
|
|
<view class="content">
|
|||
|
|
|
|||
|
|
<div class="item" v-for="(item,index) in datas" :key="index">
|
|||
|
|
<info-from-q-q-vue :qq="item['qq']" :tel="item['tel']" :wb="item['id']" :address="item['address']" :url="'https://q1.qlogo.cn/g?b=qq&nk='+item['qq']+'&s=640'"></info-from-q-q-vue>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<p style="text-align: center;color: darkgray;">批量查询业务请联系哔哩哔哩萌狼蓝天</p>
|
|||
|
|
<p style="text-align: center;color: darkgray;">查询失效请联系萌狼蓝天进行维护</p>
|
|||
|
|
<p style="text-align: center;color: darkgray;">返回结果为无则是未查询到</p>
|
|||
|
|
<p style="text-align: center;color: darkgray;">最后一次更新：2023-08-05</p>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import InfoFromQQVue from '../info/InfoFromQQ/InfoFromQQ.vue'
|
|||
|
|
export default {
|
|||
|
|
components:{
|
|||
|
|
InfoFromQQVue,
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
qq: '',
|
|||
|
|
that:this,
|
|||
|
|
datas:[],
|
|||
|
|
wait:false,
|
|||
|
|
btnTitle:'查询'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
// console.log(this)
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
search(){
|
|||
|
|
this.wait=true
|
|||
|
|
this.btnTitle="查询中"
|
|||
|
|
console.log(this.qq)
|
|||
|
|
if(this.qq===""){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '请输入正确的QQ号',
|
|||
|
|
//将值设置为 success 或者直接不用写icon这个参数
|
|||
|
|
icon: 'none',
|
|||
|
|
//显示持续时间为 2秒
|
|||
|
|
duration: 2000
|
|||
|
|
})
|
|||
|
|
this.wait=false
|
|||
|
|
this.btnTitle="查询"
|
|||
|
|
return false
|
|||
|
|
}else{
|
|||
|
|
console.log(this.qq)
|
|||
|
|
}
|
|||
|
|
uni.request({
|
|||
|
|
url:'http://124.71.108.214:2312//apis/info/qq',
|
|||
|
|
method:"POST",
|
|||
|
|
'headers': {
|
|||
|
|
'content-type': 'application/x-www-form-urlencoded'
|
|||
|
|
},
|
|||
|
|
data:{
|
|||
|
|
"qq":this.qq
|
|||
|
|
},
|
|||
|
|
success: (res) => {
|
|||
|
|
this.datas=[]
|
|||
|
|
console.log("success:",res["data"])
|
|||
|
|
let data = res["data"]
|
|||
|
|
console.log("获取数据",data)
|
|||
|
|
console.log("code",data["code"])
|
|||
|
|
if(data["code"]===1){
|
|||
|
|
let result = data["data"]
|
|||
|
|
//有两种情况，一种是只有一个需要查询，一种是多个查询
|
|||
|
|
if(this.qq.includes("/")){
|
|||
|
|
// 此时是一个列表
|
|||
|
|
this.datas = result
|
|||
|
|
}else{
|
|||
|
|
// 此时是一个字典
|
|||
|
|
this.datas.push(result)
|
|||
|
|
}
|
|||
|
|
console.log("最终数据：",this.datas)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
fail: (err) => {
|
|||
|
|
console.log("err：",err)
|
|||
|
|
},
|
|||
|
|
complete: () => {
|
|||
|
|
this.wait=false
|
|||
|
|
this.btnTitle="查询"
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
var options = {
|
|||
|
|
'method': 'POST',
|
|||
|
|
'url': 'http://api.mllt.cc/apis/info/qq?qq='+this.qq,
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.content {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: ow- reverse;/*主轴*/
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
.item{
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
/*
|
|||
|
|
.logo {
|
|||
|
|
height: 200rpx;
|
|||
|
|
width: 200rpx;
|
|||
|
|
margin-top: 200rpx;
|
|||
|
|
margin-left: auto;
|
|||
|
|
margin-right: auto;
|
|||
|
|
margin-bottom: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text-area {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
color: #8f8f94;
|
|||
|
|
} */
|
|||
|
|
</style>
|