<template>
|
<view class="bluetooth-connection-page">
|
<cu-custom bgColor="bg-white" :isBack="true">
|
<block slot="backText">
|
</block>
|
<block slot="content">蓝牙连接</block>
|
</cu-custom>
|
<scroll-view scroll-y="true" style="height: 100vh;">
|
<view class="page-content">
|
<view v-for="(item,index) in myBluetoothes" :key="item.deviceId" class="bluetooth-btn" @tap="onConnect(item.deviceId)">
|
<view class="blue-btn-id">{{item.deviceId}}</view>
|
<view class="blue-btn-name">{{item.name}}</view>
|
</view>
|
<button v-if="myBluetoothes.length!==0" type="primary" @tap="research" style="width: 100%;">重新搜索</button>
|
</view>
|
</scroll-view>
|
</view>
|
</template>
|
|
<script>
|
import BluePrint from './bluePrint.js'
|
export default {
|
name:'bluetoothConnectionPage',
|
data(){
|
return {
|
initAgain:false,
|
myBluetoothes:[]
|
}
|
},
|
onLoad(option) {
|
if (option.again==='1') {
|
this.initAgain = true
|
} else {
|
this.initAgain = false
|
}
|
},
|
onReady(){
|
this.search(this.initAgain)
|
},
|
methods:{
|
search(re=false){
|
let methodName = 'getBlueToothes'
|
if (re) methodName = 'reGetBlueToothes'
|
BluePrint[methodName](this.$store).then((res)=>{
|
this.myBluetoothes = res
|
}).catch((err)=>{
|
if (typeof err !== 'string'){
|
err = '获取蓝牙设备列表失败'
|
}
|
BluePrint.alert(err)
|
})
|
},
|
research(){
|
this.myBluetoothes = [];
|
this.search(true)
|
},
|
onConnect(id){
|
BluePrint.connect(this.$store,id).then(()=>{
|
uni.navigateBack()
|
}).catch((err)=>{
|
if (typeof err !== 'string'){
|
err = '连接蓝牙设备失败'
|
}
|
BluePrint.alert(err)
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.bluetooth-connection-page{
|
.page-content{
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
padding: 30upx 30upx 0 30upx;
|
.bluetooth-btn{
|
box-sizing: border-box;
|
width: 100%;
|
margin-bottom: 30upx;
|
border: 1px solid #F18201;
|
background-color: #f8c07f;
|
color: #fff;
|
border-radius: 20upx;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
padding: 20upx;
|
font-size: 30upx;
|
.blue-btn-id,.blue-btn-name{
|
word-wrap: break-word;
|
word-break: break-all;
|
white-space: pre-wrap;
|
text-align: center;
|
}
|
.blue-btn-name{
|
font-size: 1.5em;
|
font-weight: bold;
|
}
|
}
|
}
|
}
|
</style>
|
