index.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413
  1. <template>
  2. <scroll-view class="main-container" scroll-y="true"
  3. :refresher-enabled="false">
  4. <view v-for="(item, index) in deviceListDataShow" :key="item.id" class="list-item" hover-class="list-item-hover"
  5. hover-start-time="0" hover-stay-time="100" @click="listViewTap(item.id)">
  6. <image v-if="item.manufacturer==='eciot'" src="/static/img/ecble.png" class="list-item-img"></image>
  7. <image v-else src="/static/img/ble.png" class="list-item-img"></image>
  8. <text class="list-item-name">{{item.name}}</text>
  9. <image v-if="item.rssi >= -41" src="/static/img/s5.png" mode="aspectFit" class="list-item-rssi-img"></image>
  10. <image v-else-if="item.rssi >= -55" src="/static/img/s4.png" mode="aspectFit" class="list-item-rssi-img"></image>
  11. <image v-else-if="item.rssi >= -65" src="/static/img/s3.png" mode="aspectFit" class="list-item-rssi-img"></image>
  12. <image v-else-if="item.rssi >= -75" src="/static/img/s2.png" mode="aspectFit" class="list-item-rssi-img"></image>
  13. <image v-else="item.rssi < -75" src="/static/img/s1.png" mode="aspectFit" class="list-item-rssi-img"></image>
  14. <text class="list-item-rssi">{{item.rssi}}</text>
  15. <view class="list-item-line"></view>
  16. </view>
  17. <u-modal :show="showPwd" :confirmText="i18('确认')" :cancelText="i18('取消')" @confirm="inputPwd" @cancel="cancel" :showCancelButton="true" :title="$t('buletooth.pwdinput')" >
  18. <view class="slot-content">
  19. <view>
  20. <u--input
  21. type="number"
  22. :placeholder="$t('buletooth.pwdtip')"
  23. border="surround"
  24. v-model="pwd"
  25. ></u--input>
  26. </view>
  27. <view style="margin:10px;text-decoration: underline;margin-bottom: 0px" @click="forgetPwd">
  28. {{i18('忘记密码')}}?
  29. </view>
  30. </view>
  31. </u-modal>
  32. <u-popup :show="showSendData" >
  33. <view class="slot-content">
  34. <view>
  35. <u--input
  36. :placeholder="i18('请输入值')"
  37. border="surround"
  38. v-model="sendData"
  39. ></u--input>
  40. </view>
  41. <view style="margin:10px;text-decoration: underline;margin-bottom: 0px" @click="sendLanyaData">
  42. <u-button>发送</u-button>
  43. </view>
  44. </view>
  45. </u-popup>
  46. <view v-if="deviceListDataShow.length==0" class="notice"> - {{ $t('buletooth.nodevice') }} -</view>
  47. <view class="gap"></view>
  48. </scroll-view>
  49. </template>
  50. <script>
  51. // #ifdef APP
  52. import ecUI from '@/utils/ecUI.js'
  53. import ecBLE from '@/utils/ecBLE/ecBLE.js'
  54. // #endif
  55. // #ifdef MP
  56. const ecUI = require('@/utils/ecUI.js')
  57. const ecBLE = require('@/utils/ecBLE/ecBLE.js')
  58. // #endif
  59. import i18 from '@/utils/i18.js'
  60. import UButton from "../../../uni_modules/uview-ui/components/u-button/u-button";
  61. import UPopup from "../../../uni_modules/uview-ui/components/u-popup/u-popup";
  62. let ctx
  63. let deviceListData = []
  64. export default {
  65. components: {UPopup, UButton},
  66. data() {
  67. return {
  68. showPwd:false,
  69. rightPwd:"",
  70. pwd:"",
  71. timer:"",
  72. buleid:"",
  73. deviceListDataShow: [],
  74. showTimer:null,
  75. connected:false,
  76. uuid:"",
  77. showDeviceNo:false,
  78. inputDeviceNo:"",
  79. commonCode:"",
  80. showSendData:false,
  81. sendData:"",
  82. }
  83. },
  84. onLoad() {
  85. uni.setNavigationBarTitle({
  86. title: "蓝牙控制"
  87. })
  88. ecUI.showLoading("正在初始化蓝牙模块")
  89. ctx = this
  90. clearInterval(this.timer);
  91. this.timer = setInterval(() => {
  92. ctx.deviceListDataShow = JSON.parse(JSON.stringify(deviceListData))
  93. }, 800)
  94. console.log(this.commonCode)
  95. },
  96. onUnload(){
  97. ecBLE.stopBluetoothDevicesDiscovery();
  98. ecBLE.closeBLEConnection()
  99. },
  100. onShow() {
  101. if(this.showTimer!= null){
  102. clearTimeout(this.showTimer);
  103. }
  104. this.showTimer = setTimeout(() => {
  105. ctx.openBluetoothAdapter()
  106. }, 100)
  107. },
  108. methods: {
  109. sendLanyaData(){
  110. this.$modal.showToast("正在发送");
  111. this.sendBlueData(this.sendData);
  112. },
  113. i18(text){
  114. return text;
  115. },
  116. cancel(){
  117. this.showPwd = false;
  118. uni.navigateBack({
  119. });
  120. },
  121. resetPwd(){
  122. let self = this;
  123. if(!this.inputDeviceNo){
  124. self.$modal.showToast("请输入序列号");
  125. return;
  126. }
  127. let uuidRight = false;
  128. if(this.inputDeviceNo == this.commonCode || this.uuid == this.inputDeviceNo){
  129. uuidRight = true;
  130. }
  131. if(!uuidRight){
  132. self.$modal.showToast("序列号有误");
  133. return;
  134. }
  135. if(uuidRight){
  136. this.$modal.confirm("密码将被重置为123456").then(res=>{
  137. setPwd("123456")
  138. self.$modal.showToast("密码修改成功");
  139. this.rightPwd = "123456";
  140. self.loginSuccess();
  141. });
  142. }
  143. },
  144. getBeijingTime() {
  145. const date = new Date();
  146. const utcTime = date.getTime() + (date.getTimezoneOffset() * 60 * 1000);
  147. const beijingTime = new Date(utcTime + (8 * 60 * 60 * 1000));
  148. return beijingTime;
  149. },
  150. generateUniqueNumber(date) {
  151. let dateString = date.toISOString().slice(0, 10).replace(/-/g, '');
  152. console.log(dateString)
  153. let hash = w_md5.hex_md5_32(dateString);
  154. console.log(hash);//32位小写
  155. let str = "";
  156. for (let i = 0; i < 6; i++) {
  157. const c = hash.charCodeAt(i);
  158. str = str+""+c+""
  159. }
  160. return str.substr(0,6);
  161. },
  162. goBack(){
  163. uni.navigateBack({
  164. });
  165. },
  166. $t(title){
  167. return title;
  168. },
  169. inputPwd(){
  170. if(!this.pwd ){
  171. this.$modal.showToast(this.$t('buletooth.errpwd'));
  172. }else{
  173. if(this.rightPwd && this.rightPwd === this.pwd){
  174. this.loginSuccess();
  175. }else{
  176. this.$modal.showToast(this.$t('buletooth.errpwd'));
  177. }
  178. }
  179. },
  180. loginSuccess(){
  181. this.showPwd = false;
  182. this.showDeviceNo = false;
  183. uni.setStorageSync("pwd",this.rightPwd);
  184. uni.setStorageSync('blueid', this.buleid);
  185. this.pwd = "";
  186. ecBLE.stopBluetoothDevicesDiscovery();
  187. uni.navigateTo({
  188. url: '/pages/weitiandi/bluetooth/status'
  189. });
  190. },
  191. getLocalPwd(){
  192. let pwd = uni.getStorageSync("pwd");
  193. return pwd;
  194. },
  195. sendBlueData(tempSendData){
  196. let data = tempSendData
  197. .replace(/\s*/g, '')
  198. .replace(/\n/g, '')
  199. .replace(/\r/g, '')
  200. console.log("写入数据:"+data);
  201. ecBLE.writeBLECharacteristicValue(data, false)
  202. },
  203. listViewTap(id){
  204. let self = this;
  205. ecUI.showLoading(this.$t('buletooth.connecting'))
  206. ecBLE.onBLEConnectionStateChange(res => {
  207. console.log(res);
  208. if (res.ok) {
  209. self.connected = true;
  210. ecUI.hideLoading()
  211. self.showSendData = true;
  212. ecBLE.stopBluetoothDevicesDiscovery();
  213. //
  214. } else {
  215. ecUI.hideLoading()
  216. ecUI.showModal(
  217. this.$t('buletooth.tip'),
  218. 'error,errCode=' + res.errCode + ',errMsg=' + res.errMsg
  219. )
  220. }
  221. });
  222. //receive data
  223. ecBLE.onBLECharacteristicValueChange((str, strHex) => {
  224. console.log("数据来了")
  225. let isCheckRevHex = true;
  226. let data =
  227. (isCheckRevHex ? strHex.replace(/[0-9a-fA-F]{2}/g, ' $&') : str)
  228. console.log(data)
  229. self.$modal.closeLoading();
  230. data = parseDataObj(data);
  231. console.log(data);
  232. let type = data.type;
  233. if(type == 253){
  234. self.messageCallback(data)
  235. }else{
  236. let pwd = data.real_data;
  237. let localPwd = self.getLocalPwd()
  238. console.log(pwd);
  239. console.log("localPwd:"+localPwd)
  240. self.rightPwd = pwd;
  241. if(pwd != localPwd){
  242. self.showInputPwd();
  243. }else{
  244. self.loginSuccess();
  245. }
  246. }
  247. })
  248. self.connected = false;
  249. ecBLE.createBLEConnection(id);
  250. setTimeout(function (){
  251. if(!self.connected){
  252. self.$modal.showToast(i18('连接失败'));
  253. self.startBluetoothDevicesDiscovery()
  254. }
  255. },10000);
  256. },
  257. showInputPwd(){
  258. this.showPwd = true;
  259. },
  260. messageCallback(data){
  261. let self = this;
  262. console.log(data);
  263. let type = data.type;
  264. let real_data = data.real_data;
  265. if(type == 253){
  266. self.$modal.closeLoading();
  267. self.uuid = real_data.substr(0,6);
  268. }
  269. self.$forceUpdate();
  270. console.log('收到服务器内容:' + JSON.stringify(data));
  271. },
  272. forgetPwd(){
  273. this.$modal.loading("正在读取设备ID");
  274. getUUID()
  275. this.showDeviceNo = true;
  276. },
  277. openBluetoothAdapter() {
  278. let self = this;
  279. ecBLE.onBluetoothAdapterStateChange(res => {
  280. ecUI.hideLoading()
  281. if (res.ok) {
  282. ctx.startBluetoothDevicesDiscovery()
  283. } else {
  284. ecUI.showModal(
  285. this.$t('buletooth.tip'),
  286. `Bluetooth adapter error | ${res.errCode} | ${res.errMsg}`,
  287. () => {
  288. }
  289. )
  290. }
  291. })
  292. ecBLE.openBluetoothAdapter()
  293. },
  294. startBluetoothDevicesDiscovery() {
  295. ecBLE.stopBluetoothDevicesDiscovery();
  296. console.log('start search')
  297. ecBLE.onBluetoothDeviceFound(res => {
  298. let isRight = true;
  299. // if(res.name.startsWith('BT_') || res.name.startsWith('FC41D')){
  300. // isRight = true;
  301. // }
  302. if(!isRight){
  303. return;
  304. }
  305. for (const item of deviceListData) {
  306. if (item.id === res.id) {
  307. item.name = res.name
  308. item.rssi = res.rssi
  309. return
  310. }
  311. }
  312. let manufacturer = ''
  313. if (res.name.length === 11 && res.name.startsWith('@')) {
  314. manufacturer = 'eciot'
  315. }
  316. if (res.name.length === 15 && res.name.startsWith('BT_')) {
  317. manufacturer = 'eciot'
  318. }
  319. manufacturer = 'eciot'
  320. deviceListData.push({
  321. id: res.id,
  322. name: res.name,
  323. rssi: res.rssi,
  324. manufacturer,
  325. })
  326. })
  327. ecBLE.startBluetoothDevicesDiscovery()
  328. },
  329. }
  330. }
  331. </script>
  332. <style>
  333. .main-container {
  334. height: 100vh;
  335. }
  336. .list-item {
  337. height: 57px;
  338. position: relative;
  339. }
  340. .list-item-hover {
  341. background-color: #e5e4e9;
  342. }
  343. .list-item-img {
  344. position: absolute;
  345. width: 36px;
  346. height: 36px;
  347. left: 20px;
  348. top: 10px;
  349. }
  350. .list-item-name {
  351. position: absolute;
  352. font-size: 22px;
  353. left: 76px;
  354. top: 0px;
  355. line-height: 56px;
  356. }
  357. .list-item-rssi-img {
  358. position: absolute;
  359. width: 20px;
  360. height: 20px;
  361. right: 20px;
  362. top: 13px;
  363. }
  364. .list-item-rssi {
  365. position: absolute;
  366. width: 40px;
  367. height: 20px;
  368. right: 10px;
  369. top: 33px;
  370. font-size: 12px;
  371. font-weight: bold;
  372. display: flex;
  373. justify-content: center;
  374. }
  375. .list-item-line {
  376. position: absolute;
  377. height: 1px;
  378. width: 100vw;
  379. left: 20px;
  380. top: 56px;
  381. background-color: #c6c6c8;
  382. }
  383. .notice {
  384. display: flex;
  385. justify-content: center;
  386. align-items: center;
  387. margin-top: 10px;
  388. font-size: 13px;
  389. color: #909399;
  390. }
  391. .gap {
  392. height: 57px;
  393. }
  394. </style>