index.vue 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. <template>
  2. <view class="content">
  3. <view class="banner">
  4. <uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
  5. <swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
  6. <swiper-item v-for="(item, index) in data" :key="index">
  7. <view class="swiper-item" @click="clickBannerItem(item)">
  8. <image :src="imgUrl+item.image" mode="aspectFill" :draggable="false" />
  9. </view>
  10. </swiper-item>
  11. </swiper>
  12. </uni-swiper-dot>
  13. </view>
  14. <view class="container">
  15. <view class="item" @click="buleTeeth">
  16. <image :src = "imgUrl+'/index/bluetooth.png'"/>
  17. <view class="item-text">{{i18('蓝牙连接')}}</view>
  18. </view>
  19. <view class="item" @click="scan">
  20. <image :src = "imgUrl+'/index/scan.png'"/>
  21. <view class="item-text">{{i18('扫码绑定')}}</view>
  22. </view>
  23. <view class="item" @click="devicelist">
  24. <image :src = "imgUrl+'/index/device-2.png'"/>
  25. <view class="item-text">{{i18('设备列表')}}</view>
  26. </view>
  27. </view>
  28. </view>
  29. </template>
  30. <script>
  31. import { getDeviceInfoFromQrcode,bindDevice } from '@/api/device/device.js'
  32. import i18 from '@/utils/i18.js'
  33. export default {
  34. data:function(){
  35. return {
  36. current: 0,
  37. swiperDotIndex: 0,
  38. data: [{
  39. image: '/index/banner-index.png'
  40. }
  41. ]
  42. }
  43. },
  44. computed: {
  45. imgUrl() {
  46. return getApp().globalData.config.imgUrl;
  47. }
  48. },
  49. onLoad: function() {
  50. },
  51. onShow(){
  52. uni.setNavigationBarTitle({
  53. title: this.$t('page.worktai')
  54. })
  55. },
  56. methods:{
  57. devicelist(){
  58. uni.navigateTo({
  59. url: '/pages/weitiandi/deviceList'
  60. });
  61. },
  62. i18(text){
  63. return i18(text)
  64. },
  65. buleTeeth(){
  66. uni.navigateTo({
  67. url: '/pages/bluetooth/index/index'
  68. });
  69. },
  70. toBind(qrcode){
  71. bindDevice(qrcode).then(res=>{
  72. let data = res.data;
  73. if(data != null){
  74. let imei = res.data.imei;
  75. let ccid = res.data.ccid;
  76. let qrcode = res.data.qrcode;
  77. let uuid = res.data.uuid;
  78. this.$modal.showToast("绑定成功");
  79. }else{
  80. this.$modal.showToast("绑定失败");
  81. }
  82. })
  83. },
  84. scan(){
  85. let self = this;
  86. uni.scanCode({
  87. success: function (res) {
  88. console.log('条码类型:' + res.scanType);
  89. console.log('条码内容:' + res.result);
  90. getDeviceInfoFromQrcode(res.result).then(res=>{
  91. if(res.data != null){
  92. let imei = res.data.imei;
  93. let ccid = res.data.ccid;
  94. let qrcode = res.data.qrcode;
  95. let uuid = res.data.userId;
  96. if(uuid){
  97. self.$modal.showToast("该设备已被绑定");
  98. }else{
  99. self.$modal.confirm("确认绑定该设备?").then(res=>{
  100. self.toBind(qrcode)
  101. })
  102. }
  103. // uni.navigateTo({
  104. // url: '/pages/weitiandi/device/status?qrcode='+qrcode+'&id='+imei+'&ccid='+ccid
  105. // });
  106. }else{
  107. self.$modal.showToast("找不到设备,请联系管理员");
  108. }
  109. });
  110. }
  111. });
  112. },
  113. scan2(){
  114. let self = this;
  115. getDeviceInfoFromQrcode("http://wetiandi.com/app/index.php?i=1&j=1&c=entry&m=wdl_shopping&do=wepay&sn=GD1B342399").then(res=>{
  116. if(res.data != null){
  117. let imei = res.data.imei;
  118. let ccid = res.data.ccid;
  119. let qrcode = res.data.qrcode;
  120. let uuid = res.data.userId;
  121. if(uuid){
  122. self.$modal.showToast("该设备已被绑定");
  123. }else{
  124. self.$modal.confirm("确认绑定该设备?").then(res=>{
  125. self.toBind(qrcode)
  126. })
  127. }
  128. // uni.navigateTo({
  129. // url: '/pages/weitiandi/device/status?qrcode='+qrcode+'&id='+imei+'&ccid='+ccid
  130. // });
  131. }else{
  132. self.$modal.showToast("找不到设备,请联系管理员");
  133. }
  134. });
  135. }
  136. }
  137. }
  138. </script>
  139. <style>
  140. .content {
  141. background: rgb(249, 252, 255);
  142. inset: 0;
  143. position: absolute;
  144. }
  145. .swiper {
  146. height: 22vh;
  147. }
  148. .banner{
  149. height: 22vh;
  150. width: 100%;
  151. margin-top:1vh
  152. }
  153. .swiper-box {
  154. height: 22vh;
  155. }
  156. .swiper-item {
  157. /* #ifndef APP-NVUE */
  158. display: flex;
  159. /* #endif */
  160. flex-direction: column;
  161. justify-content: center;
  162. align-items: center;
  163. color: #fff;
  164. height: 300rpx;
  165. line-height: 300rpx;
  166. }
  167. @media screen and (min-width: 500px) {
  168. .uni-swiper-dot-box {
  169. width: 400px;
  170. /* #ifndef APP-NVUE */
  171. margin: 0 auto;
  172. /* #endif */
  173. margin-top: 8px;
  174. }
  175. .image {
  176. width: 100%;
  177. }
  178. }
  179. .item{
  180. display: inline-block;
  181. width: 50%;
  182. position: relative;
  183. }
  184. .item image{
  185. height: 12vh;
  186. }
  187. .item-text{
  188. position: absolute;
  189. top:30px;
  190. left: 50%;
  191. }
  192. </style>