index.vue 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
  1. <template>
  2. <view class="content"style="background: white">
  3. <view class="text-area">
  4. <u--form style="width: 100%;"
  5. labelPosition="left"
  6. ref="uForm"
  7. >
  8. <u-form-item
  9. label="WIFI名称"
  10. borderBottom
  11. labelWidth="auto"
  12. @click="openChooseWifi"
  13. ref="item1"
  14. >
  15. <u--input
  16. v-model="SSID"
  17. disabled
  18. disabledColor="#ffffff"
  19. placeholder="请选择wifi"
  20. border="none"
  21. ></u--input>
  22. <u-icon
  23. slot="right"
  24. name="arrow-right"
  25. ></u-icon>
  26. </u-form-item>
  27. <u-form-item
  28. label="密码"
  29. borderBottom
  30. ref="item1"
  31. >
  32. <u--input
  33. v-model="password"
  34. border="none"
  35. ></u--input>
  36. </u-form-item>
  37. </u--form>
  38. </view>
  39. <view style="margin:10px">
  40. <u-button text="开始配网" @click="doConnect" size="small" type="primary"></u-button>
  41. </view>
  42. <u-picker @cancel="showWiftList=false" @confirm="chooseWifi" :show="showWiftList" :columns="wifiList"></u-picker>
  43. </view>
  44. </template>
  45. <script>
  46. export default {
  47. data(){
  48. return{
  49. showWiftList:false,
  50. wifiList: [
  51. []
  52. ],
  53. SSID:"",
  54. password:""
  55. }
  56. },
  57. onLoad: function() {
  58. this.openWifi();
  59. },
  60. methods:{
  61. getAuth(){
  62. wx.getSetting({
  63. success(res) {
  64. if (!res.authSetting['scope.userLocation']) {
  65. wx.authorize({
  66. scope: 'scope.userLocation',
  67. success () {
  68. // 用户已经同意小程序使用录音功能,后续调用 wx.startRecord 接口不会弹窗询问
  69. }
  70. })
  71. }
  72. }
  73. })
  74. },
  75. chooseWifi(e){
  76. this.SSID = e.value[0];
  77. this.showWiftList= false;
  78. },
  79. openChooseWifi(){
  80. if(this.wifiList[0].length == 0){
  81. this.getWifiList();
  82. }else{
  83. this.showWiftList = true;
  84. }
  85. },
  86. openWifi(){
  87. let self = this;
  88. // #ifdef MP-WEIXIN
  89. wx.startWifi({
  90. success(res) {
  91. console.log(res);
  92. // self.getWifiList();
  93. },
  94. fail(res) {
  95. console.log(res)
  96. uni.showToast({
  97. title: '请打开WIFI',
  98. icon: 'none',
  99. duration: 3000
  100. });
  101. },
  102. })
  103. // #endif
  104. },
  105. getWifi(){
  106. // #ifdef MP-WEIXIN
  107. var that = this
  108. wx.getConnectedWifi({
  109. success(res) {
  110. console.log(res)
  111. that.BSSID = res.wifi.BSSID
  112. that.WIFIName = res.wifi.SSID
  113. },
  114. fail(res) {
  115. console.log(res)
  116. //报错的相关处理
  117. },
  118. })
  119. // #endif
  120. },
  121. getWifiList(){
  122. // #ifdef MP-WEIXIN
  123. var that = this
  124. uni.showLoading();
  125. wx.getWifiList({
  126. success(res) {
  127. console.log(res)
  128. wx.onGetWifiList(function(res) {
  129. that.showWiftList = true;
  130. uni.hideLoading();
  131. console.log("获取wifi列表");
  132. that.wifiList = [[]];
  133. console.log(res.wifiList); //在这里提取列表数据
  134. //通过遍历将WIFI名字存入集合,以便下卡框等组件使用
  135. for (var i = 0; i < res.wifiList.length; i++) {
  136. that.wifiList[0].push(res.wifiList[i].SSID)
  137. }
  138. })
  139. },
  140. fail(res) {
  141. console.log(res)
  142. uni.showToast({
  143. title: '获取wifi失败,请检查wifi',
  144. icon: 'none',
  145. duration: 2000
  146. });
  147. },
  148. })
  149. // #endif
  150. },
  151. doConnect(){
  152. // #ifdef MP-WEIXIN
  153. const airkiss = requirePlugin('airkiss');
  154. if (this.SSID != '' && this.password != '') {
  155. console.log(airkiss)
  156. uni.showLoading({
  157. title: '配网中请稍后..'
  158. });
  159. airkiss.startAirkiss(this.SSID, this.password, function(res) {
  160. console.log(res)
  161. switch (res.code) {
  162. case 0:
  163. uni.hideLoading();
  164. uni.showModal({
  165. title: '初始化失败',
  166. content: res.result,
  167. showCancel: false,
  168. confirmText: '收到',
  169. })
  170. break;
  171. case 1:
  172. uni.hideLoading();
  173. uni.showModal({
  174. title: '配网成功',
  175. content: '设备IP:' + res.ip + '\r\n 设备Mac:' + res.bssid,
  176. showCancel: false,
  177. confirmText: '好的',
  178. })
  179. break;
  180. case 2:
  181. uni.hideLoading();
  182. uni.showModal({
  183. title: '配网失败',
  184. content: '请检查密码是否正确',
  185. showCancel: false,
  186. confirmText: '收到',
  187. })
  188. break;
  189. default:
  190. uni.hideLoading();
  191. break;
  192. }
  193. })
  194. } else {
  195. uni.showToast({
  196. title: '请选择WIFI并输入密码',
  197. icon: 'none',
  198. duration: 3000
  199. });
  200. }
  201. // #endif
  202. }
  203. }
  204. }
  205. </script>
  206. <style>
  207. .content {
  208. display: flex;
  209. flex-direction: column;
  210. align-items: center;
  211. justify-content: center;
  212. }
  213. .text-area {
  214. display: flex;
  215. justify-content: center;
  216. background: white;
  217. width: 100%;
  218. height: 100%;
  219. }
  220. .title {
  221. font-size: 36rpx;
  222. color: #8f8f94;
  223. }
  224. </style>