scan.vue 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192
  1. <script>
  2. import ble_store from "@/store/bluetooth";
  3. import Dialog from "../../../../static/vant/dialog/dialog";
  4. import Toast from "../../../../static/vant/toast/toast";
  5. let $this;
  6. export default {
  7. name: "ConnectionScan",
  8. created() {
  9. $this = this;
  10. },
  11. methods: {
  12. /**
  13. * 扫描二维码连接脑机
  14. */
  15. openScan() {
  16. // 微信异步获取系统信息
  17. wx.getSystemInfoAsync({
  18. success(res) {
  19. // 蓝牙的系统开关 boolean
  20. if (!res.bluetoothEnabled) {
  21. Dialog.alert({
  22. title: '蓝牙功能未开启',
  23. message: '请打开蓝牙,允许水母星球使用蓝牙服务',
  24. }).then(() => {
  25. // 跳转系统蓝牙设置页
  26. wx.openSystemBluetoothSetting()
  27. });
  28. }
  29. // 地理位置的系统开关 boolean
  30. else if (!res.locationEnabled) {
  31. // 如果是苹果系统则直接打开扫描
  32. if (res.system.indexOf("iOS") !== -1) {
  33. $this.scanBluetooth();
  34. } else {
  35. Dialog.alert({
  36. title: '位置信息未开启',
  37. message: '当前无位置访问权限,请在设置中,允许水母星球使用位置服务',
  38. }).then(() => {
  39. });
  40. }
  41. }
  42. // 允许微信使用定位的开关 boolean
  43. else if (!res.locationAuthorized) {
  44. Dialog.alert({
  45. title: '位置权限未开启',
  46. message: '当前无位置访问权限,请在手机[设置]应用中,允许[微信]使用位置服务',
  47. }).then(() => {
  48. // 跳转系统微信授权管理页
  49. wx.openAppAuthorizeSetting()
  50. });
  51. }
  52. // 已允许权限
  53. else {
  54. $this.scanBluetooth();
  55. }
  56. },
  57. });
  58. },
  59. /**
  60. * 扫描连接蓝牙
  61. */
  62. scanBluetooth() {
  63. // 调起微信客户端扫码界面进行扫码
  64. wx.scanCode({
  65. // 是否只能从相机扫码
  66. onlyFromCamera: true,
  67. // barCode:一维码, qrCode:二维码
  68. scanType: ["barCode", "qrCode"],
  69. success: (scan) => {
  70. console.log(scan.result)
  71. if (scan.result) {
  72. let url = decodeURIComponent(scan.result);
  73. let $code = "";
  74. if (scan.scanType === "QR_CODE") {
  75. // 二维码
  76. $code = url.substring(url.indexOf("AI"));
  77. } else {
  78. // 一维码
  79. $code = scan.result.toUpperCase();
  80. }
  81. ble_store.setters.setDeviceSn($code);
  82. console.log("扫码得到头环SN码:", $code);
  83. // 检查微信蓝牙权限
  84. this.openWechatBluetooth();
  85. }
  86. },
  87. fail(err) {
  88. console.log(err["errMsg"])
  89. setTimeout(() => {
  90. Toast.fail({
  91. message: err["errMsg"],
  92. });
  93. }, 3000);
  94. },
  95. });
  96. },
  97. /**
  98. * 检查微信蓝牙权限
  99. */
  100. openWechatBluetooth: function () {
  101. // 获取系统信息
  102. wx.getSystemInfo({
  103. success(res) {
  104. // 判断ios
  105. if (res.platform === "ios") {
  106. // 初始化蓝牙模块。iOS上开启主机central/从机peripheral(外围设备)模式时需分别调用一次,并指定对应的 mode
  107. wx.openBluetoothAdapter({
  108. // 判断主机模式蓝牙是否打开
  109. mode: "central",
  110. success(res) {
  111. // 正常
  112. if (res["errMsg"] === "openBluetoothAdapter:ok") {
  113. // 判断从机模式蓝牙是否打开
  114. wx.openBluetoothAdapter({
  115. // 判断从机模式蓝牙是否打开
  116. mode: "peripheral",
  117. success(res) {
  118. if (res["errMsg"] === "openBluetoothAdapter:ok") {
  119. $this.setScanStatus(1);
  120. }
  121. },
  122. fail(err) {
  123. setTimeout(() => {
  124. Toast.fail({
  125. message: $this.$connection.connectionError(err["errCode"]),
  126. });
  127. }, 3000);
  128. },
  129. });
  130. }
  131. },
  132. fail(err) {
  133. setTimeout(() => {
  134. Toast.fail({
  135. message: $this.$connection.connectionError(err["errCode"]),
  136. });
  137. }, 3000);
  138. },
  139. });
  140. } else {
  141. // 安卓手机
  142. wx.openBluetoothAdapter({
  143. mode: "peripheral",
  144. success(res) {
  145. // 正常
  146. if (res["errMsg"] === "openBluetoothAdapter:ok") {
  147. $this.setScanStatus(1);
  148. }
  149. },
  150. fail(err) {
  151. setTimeout(() => {
  152. Toast.fail({
  153. message: err["errMsg"],
  154. });
  155. }, 3000);
  156. },
  157. });
  158. }
  159. },
  160. });
  161. },
  162. /**
  163. * 修改扫码状态
  164. * @param $status 0未,1扫码成功
  165. */
  166. setScanStatus($status = 0) {
  167. $this.$emit("scanStatus", $status);
  168. },
  169. },
  170. };
  171. </script>
  172. <template>
  173. <div>
  174. <van-row>
  175. <van-col span="11" class="text-gray text-sm left" offset="1">
  176. <view>1.打开手机蓝牙和位置信息</view>
  177. <view>2.长按脑机侧面按钮启动脑机</view>
  178. <view>3.点击扫码开始连接</view>
  179. </van-col>
  180. <van-col span="8" offset="2">
  181. <img src="https://img.shuimuai.com/lanyashuimu.png" class="connect_img" alt=""/>
  182. </van-col>
  183. </van-row>
  184. <button class="cu-btn lg cu-btn-primary text-white text-center scan_button margin-tb" @click="openScan">扫码连接脑机</button>
  185. <van-toast id="van-toast"/>
  186. <van-dialog id="van-dialog"/>
  187. </div>
  188. </template>
  189. <style scoped></style>