丰谷页面

app.json

@@ -4,7 +4,9 @@
     "pages/attention/attention",
     "pages/cameraTakePhoto/cameraTakePhoto",
     "pages/upload/upload",
-    "pages/anti/anti"
+    "pages/anti/anti",
+    "pages/fenggu/AICheck/AICheck",
+    "pages/fenggu/takephoto/takephoto"
   ],
   "window": {
     "backgroundTextStyle": "light",

pages/fenggu/AICheck/AICheck.js

+// pages/fenggu/AICheck/AICheck.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})
\ No newline at end of file

pages/fenggu/AICheck/AICheck.json

+{
+  "usingComponents": {}
+}
\ No newline at end of file

pages/fenggu/AICheck/AICheck.wxml

+<view class="AICheck">
+    <image src="/assets/fenggu/ai认证背景.jpg"  class="bgImage" />
+    <view class="content-box">
+        <image src="/assets/fenggu/logo.png" mode="widthFix" class="logo-img"/>
+
+        <image src="/assets/fenggu/AI.png" mode="widthFix" class="ai-img"/>
+        <image src="/assets/fenggu/开始认证.png" mode="widthFix" style="width: 400rpx;"/>
+    </view>
+</view>
\ No newline at end of file

pages/fenggu/AICheck/AICheck.wxss

+
+.AICheck {
+    position: relative;
+    width: 100vw;
+    height: 100vh;
+    background:linear-gradient(to bottom,#1D4396,#1D4396,#494DBF);
+    box-sizing: border-box;
+}
+.AICheck .bgImage {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+.content-box {
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+}
+
+.content-box .logo-img {
+    margin-top: 50rpx;
+    width: 300rpx;
+}
+.content-box  .ai-img {
+    margin: 100rpx 0;
+    width: 450rpx;
+}

pages/fenggu/takephoto/takephoto.js

+// pages/fenggu/takephoto/takephoto.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+  takePhoto() {
+    // wx.getStorageSync('photoFrame')
+    const ctx = wx.createCameraContext()
+    const listener  =  ctx.onCameraFrame((e) => {
+      console.log(e.data)
+      wx.setStorageSync({
+        key:'photoFrame',
+        data:JSON.stringify(e.data)
+      })
+    })
+    listener.start()
+    // ctx.takePhoto({
+    //   quality: 'high',
+    //   success: (res) => {
+    //     console.log(res)
+    //     this.setData({
+    //       src: res.tempImagePath
+    //     })
+    //   }
+    // })
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    this.takePhoto()
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})
\ No newline at end of file

pages/fenggu/takephoto/takephoto.json

+{
+  "usingComponents": {}
+}
\ No newline at end of file

pages/fenggu/takephoto/takephoto.wxml

+<view class="takephoto">
+    <view class="step" style="height: 200rpx; align-items: center;">
+        <view class="step-box" style="border-radius: 10rpx;overflow: hidden;">
+            <view class="step-item step-active">三维码校准完成</view>
+            <view class="step-item" style="margin: 0 5rpx;">拍照中</view>
+            <view class="step-item">验证</view>
+        </view>
+    </view>
+    <view class="photo" style="flex:1;background-color: black;">
+        <!-- <camera style="height: 100%;width: 100%;" flash="on"  devic-position="back" frame-size="large">
+        </camera> -->
+    </view>
+    <view class="bottom" style="height: 400rpx;align-items: center;">
+        <view class="tabs" style="padding: 6rpx;background-color: black;">
+            <view class="tabItem tab-active">AI验证</view>
+            <view class="tabItem">示范</view>
+        </view>
+    </view>
+</view>
\ No newline at end of file

pages/fenggu/takephoto/takephoto.wxss

+.takephoto {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    width: 100vw;
+    height: 100vh;
+    font-size: 30rpx;
+    background-color: #333;
+    box-sizing: border-box;
+}
+
+
+.step,.step-box,.bottom,.tabs {
+    display: flex;
+    justify-content: center;
+    text-align: center;
+}
+.step .step-item {
+    padding: 0 20rpx;
+    height: 80rpx;
+    min-width: 150rpx;
+    line-height: 80rpx;
+    color: #fff;
+    background-color: #ADADAD;
+}
+
+.bottom .tabs .tabItem{
+    height: 80rpx;
+    line-height: 80rpx;
+    min-width: 200rpx;
+    color: #FAF38E;
+    border-radius: 10rpx;
+}
+
+.bottom .tabs .tab-active {
+    color: #fff;
+    background-color: #333;
+}
+
+
+.step-active {
+    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABMCAIAAABSySbyAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAA5NJREFUeJzV2utW2kAQB3DfpLUIHiveoFCx2pZ6vADlUn2kCnITCQICDZE33c4qFMh9k9k53XP2kx/M/7fZmd2EbFReGIxfs/UBfzEERrLD3v9mm1XLuPMeHwKN4y67feFjIzygqLNIlRQQrbHLER7gWOPpKQG7DVaZIgF+6ixWowac9efpEQDfBzwEJWCrym5mSICKwRIP8/RkgIzGbrEApem8fMkAUL65CR4goy3T0wAO2vy24wBM008D4OU7QwJ8G6ylJwDAfJUNJEB5yg7b1IBjbZE+PCA/4e2MEgCXKxl4gJOeOb1swNEDT4UDgG08ek8KiNzxklumDwmwlq9sALT/4hQJAOW716QGpLrr6cMArkY25SsVAN3TPP1hALblKxUAxy1z+jCA7TopAKb/xxAPkB06ppcE2KnzRw4cAJyiPjqUrzxA2lq+gQEXI/4fKQGwfvJ/8ACfu27pZQCO2q8pUQDQ/necy1cGAKYf7rl9+gCA82eP9OiA3QZ/5EADeE4/OiD96Lx+RAFwKz3TIwOq7HrinF4IAN0z9UgN2G+9vjtBAcA+4mf9IALg8HzpUr6iANjJN13bPzog3ly8ekABxF13XxmATM8rvX/A1Zht+kuPBYD2fz3GAyQ6ftNjAeItH+l9AuAcsm337CsP4LH7igJW3zzTAGD39eieQgBoxv7TowBOn/yl9wOA9SM0/eEBsXuWczo8BwAk/O2+iAC++7ocfoQAeZ1t1agB9s++wQBnfYH2jwKA04pAendAZcZ/RxBNHxKwfPEfHlDQ+WmWEgC7TcH21UMwQBLKV7D/hAQkTG+ewwDm008LECtfd8Bp/zU9IQDav/D0OwFKBttrUwOEy9cFkIP1UyMFRGsrv9uFB6S6i/RUgGRHZPd1BxSNRflSAaB8s4NA6W0BJ08r6UkAMVg/ou3fCQDlu9ukBpxo7CZYAVgBF2MWqZEC4LBYMfAA6e56evmATx2eHgdQfvtsgxAAlzsf4gHM5SsfAIfnoo4EKE5ZtE4NeCtfHED2mV+JEsB/99XxALAXvrOmlwn4V744ADiNUAJg+i9HqABITwmIN1lJVxmQ0dbSKwaA01thojIg2TGnVwkA5ZuzTL9KgL0W/1ZNYcCXnk16ZQD8sw279aMM4KBln14NADxq58YqA/bbjukVAMDm9bWvMiB271i+agAOXdePAoCrkcqAeMMj/X8NgO6ZHUgH/AUJ74OazCuVeQAAAABJRU5ErkJggg==');
+    background-size: auto 100%;
+    background-repeat: repeat-x;
+}