ソースを参照

feat: set sweep code and camera permission denial processing

wangyuan 2 年 前
コミット
5a573b4f90
7 ファイル変更214 行追加4 行削除
  1. 3 0
      app.js
  2. 2 1
      app.json
  3. 7 3
      pages/appointment/appointment.js
  4. 124 0
      pages/scan/scan.js
  5. 3 0
      pages/scan/scan.json
  6. 25 0
      pages/scan/scan.wxml
  7. 50 0
      pages/scan/scan.wxss

+ 3 - 0
app.js

@@ -11,6 +11,9 @@ App({
       name: '',
       login: false
     },
+    auth: {
+      camera: true
+    },
     selectedInex: 2 // 自定义tabbar选中的index
   }
 })

+ 2 - 1
app.json

@@ -18,7 +18,8 @@
     "pages/myAppointment/myAppointment",
     "pages/myFile/myFile",
     "pages/reportDetail/reportDetail",
-    "pages/myRecord/myRecord"
+    "pages/myRecord/myRecord",
+    "pages/scan/scan"
   ],
   "usingComponents": {
     "van-icon": "@vant/weapp/icon/index",

+ 7 - 3
pages/appointment/appointment.js

@@ -7,8 +7,8 @@ Page({
   data: {
     hasAddress: false,
     calendarcolor: '#45A6B5',
-    timeActive: '0',
-    vanoverlayshow: false
+    timeActive: '9',
+    vanoverlayshow: true
   },
 
   /**
@@ -41,7 +41,11 @@ Page({
     })
   },
   // 激活卡片
-  handleActiveCard () {},
+  handleActiveCard () {
+    wx.navigateTo({
+      url: '/pages/scan/scan?form=appointment',
+    })
+  },
   // 去充值
   handleCharge () {}
 })

+ 124 - 0
pages/scan/scan.js

@@ -0,0 +1,124 @@
+// pages/scan/scan.js
+const app = getApp()
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    scanFunctionUse: true,
+    show: false,
+    scanTimer: null,
+    rescanTimer: null
+  },
+  // 用户不允许使用摄像头时触发
+  error () {
+    console.log('eooro');
+    app.globalData.auth.camera = false
+  },
+  // 在扫码识别成功时触发,仅在 mode="scanCode" 时生效
+  handlescancode (e) {
+    if (this.data.scanFunctionUse) {
+      this.setData({
+        scanFunctionUse: false,
+        show: true
+      })
+      console.log('扫码识别成功');
+    }
+  },
+  // 重新扫码
+  handleRescan () {
+    this.setData({
+      show: false
+    })
+    this.data.rescanTimer = setTimeout(() => {
+      this.setData({
+        scanFunctionUse: true
+      })
+      clearTimeout(this.data.rescanTimer)
+    }, 800);
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    console.log(options, 'options');
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow(option) {
+    if (!app.globalData.auth.camera) {
+      wx.getSetting({
+        success (res) {
+          console.log(res.authSetting['scope.camera'], 'getSetting')
+          if (!res.authSetting['scope.camera']) {
+            wx.showModal({
+              title: '系统提示',
+              content: '请打开相机权限',
+              success (res) {
+                if (res.confirm) {
+                  console.log('用户点击确定')
+                  wx.openSetting({
+                    success (res) {
+                      console.log(res, 'openSetting')
+                      app.globalData.auth.camera = res.authSetting['scope.camera']
+                    }
+                  })
+                } else if (res.cancel) {
+                  console.log('用户点击取消')
+                }
+              }
+            })
+          }
+        }
+      })
+    }
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+    this.setData({
+      show: false,
+      scanFunctionUse: true
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

+ 3 - 0
pages/scan/scan.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

+ 25 - 0
pages/scan/scan.wxml

@@ -0,0 +1,25 @@
+<!--pages/scan/scan.wxml-->
+<view class="scan-content">
+  <view class="scan-item">
+    <camera mode="scanCode" device-position="back" flash="off" binderror="error" bindscancode="handlescancode" style="width: 100%; height: 100%;"></camera>
+  </view>
+  <van-overlay show="{{ show }}">
+    <view class="wrapper ittflex">
+      <view class="modal">
+        <view class="status-icon">
+          <image class="status-img" src="../../imaes/chenggong@2x.png"></image>
+          <!-- <image class="status-img" src="../../imaes/shibai@2x.png"></image> -->
+        </view>
+        <view class="status-text">
+          <text>当前激活的是一次体验卡,体验次数+1</text>
+          <!-- <text>当前激活的是一次套餐卡,体验次数+X</text>
+          <text>该二维码已过期/该二维码不存在</text> -->
+        </view>
+        <view class="actions ittflex">
+          <!-- <view class="status-btn itt-btn success-btn">立即去预约</view> -->
+          <view class="status-btn itt-btn rescan-btn" bindtap="handleRescan">重新扫描</view>
+        </view>
+      </view>
+    </view>
+  </van-overlay>
+</view>

+ 50 - 0
pages/scan/scan.wxss

@@ -0,0 +1,50 @@
+/* pages/scan/scan.wxss */
+.scan-content {
+  width: 100%;
+  height: 100%;
+}
+.scan-item {
+  width: 100%;
+  height: 900rpx;
+  background-color: #f66;
+}
+.wrapper {
+  height: 100%;
+}
+.modal {
+  width: 558rpx;
+  height: 522rpx;
+  background-color: #fff;
+  border-radius: 20rpx;
+}
+.status-icon {
+  width: 100%;
+  height: auto;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 90rpx;
+}
+.status-img {
+  width: 144rpx;
+  height: 144rpx;
+}
+.status-text {
+  font-size: 26rpx;
+  font-weight: 400;
+  color: #333333;
+  text-align: center;
+  margin-top: 40rpx;
+}
+.actions {
+  width: 100%;
+  margin-top: 80rpx;
+}
+.status-btn {
+  width: 210rpx;
+  height: 68rpx;
+  border-radius: 10px;
+  font-size: 26rpx;
+  font-weight: 400;
+  color: #FFFFFF;
+}