scan.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <!-- 扫一扫 -->
  2. <template>
  3. <view>
  4. <view class="scanCode_box">
  5. <view class="title">请扫描设备二维码</view>
  6. <camera class='camera' mode="scanCode" @error="cameraError" @scancode='scancode'
  7. frame-size='large'>
  8. <cover-view class='animation' :animation="animation"></cover-view>
  9. </camera>
  10. <view @click="manualFun()" class="manual">手动选择设备</view>
  11. </view>
  12. </view>
  13. </template>
  14. <script>
  15. let animation = uni.createAnimation({});
  16. export default {
  17. data() {
  18. return {
  19. animation,
  20. form:{},
  21. }
  22. },
  23. onLoad(option) {
  24. if(option.form){
  25. this.form=JSON.parse(decodeURIComponent(option.form));
  26. }
  27. console.log(this.form)
  28. },
  29. onShow() {
  30. this.donghua()
  31. },
  32. methods: {
  33. donghua() {
  34. let that = this;
  35. let scode = true
  36. setInterval(function() {
  37. if (scode) {
  38. animation.translateY(250).step({
  39. duration: 3000
  40. })
  41. scode = !scode;
  42. } else {
  43. animation.translateY(-10).step({
  44. duration: 3000
  45. })
  46. scode = !scode;
  47. }
  48. that.animation = animation.export()
  49. }.bind(this), 3000)
  50. },
  51. //手动选择设备
  52. manualFun(){
  53. uni.redirectTo({
  54. url: '/pages_safetyExamine/examineManage/examineAddContent?form='+encodeURIComponent(JSON.stringify(this.form))+'&pageType=3'
  55. });
  56. },
  57. scancode(e){
  58. let self=this;
  59. // 扫描结果
  60. let text = decodeURIComponent(e.detail.result)
  61. let list = text.split("?")[1].split("&");
  62. for(let i=0;i<list.length;i++){
  63. let newList = list[i].split("=");
  64. if(newList[0] == 'code'){
  65. self.code = newList[1];
  66. }else if(newList[0] == 'type'){
  67. self.type = newList[1];
  68. }else if(newList[0] == 'subId'){
  69. self.subId = newList[1];
  70. }
  71. }
  72. if(self.type=='10' && self.form.subIds==self.subId){//
  73. let joinHazardIds=[];
  74. if(this.form.hazardIds){
  75. joinHazardIds=this.form.hazardIds.split(',')
  76. joinHazardIds.push(self.code)
  77. this.form.joinHazardIds=joinHazardIds
  78. }else{
  79. this.form.joinHazardIds=self.code
  80. }
  81. uni.redirectTo({
  82. url: '/pages_safetyExamine/examineManage/examineAddTow?form='+encodeURIComponent(JSON.stringify(this.form))+'&joinHazardIds='+self.code
  83. });
  84. }else{
  85. uni.showToast({
  86. title: '二维码不正确!',
  87. icon:"none",
  88. mask:true,
  89. duration: 2000
  90. });
  91. }
  92. }
  93. }
  94. }
  95. </script>
  96. <style>
  97. .scanCode_box {
  98. width: 100%;
  99. height: 100%;
  100. display: flex;
  101. flex-direction: column;
  102. background-color: #000000;
  103. position: fixed;
  104. align-items: center;
  105. }
  106. .title{
  107. font-size: 34rpx;
  108. font-family: PingFang SC-Medium, PingFang SC;
  109. font-weight: 400;
  110. color: #FFFFFF;
  111. line-height: 48rpx;
  112. margin-top: 256rpx;
  113. text-align: center;
  114. }
  115. .camera {
  116. width: 433rpx;
  117. height: 434rpx;
  118. border-radius: 6rpx;
  119. margin: 30rpx;
  120. overflow: hidden;
  121. }
  122. .animation {
  123. position: absolute;
  124. top: 10rpx;
  125. left: 0rpx;
  126. width: 430rpx;
  127. height: 2rpx;
  128. background-color: #4CD964;
  129. border-radius: 50%;
  130. }
  131. .manual{
  132. width: 300rpx;
  133. height: 100rpx;
  134. background: #0183FA;
  135. border-radius: 60rpx 60rpx 60rpx 60rpx;
  136. font-size: 34rpx;
  137. font-family: PingFang SC-Medium, PingFang SC;
  138. font-weight: 400;
  139. color: #FFFFFF;
  140. line-height: 100rpx;
  141. text-align: center;
  142. position: fixed;
  143. bottom: 76rpx;
  144. left: 226rpx;
  145. }
  146. </style>