<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 {{stepIndex > 0 ? 'step-active' : ''}}">三维码校准完成</view>
            <view class="step-item {{stepIndex > 1 ? 'step-active' : ''}}" style="margin: 0 5rpx;">拍照中</view>
            <view class="step-item {{stepIndex > 2 ? 'step-active' : ''}}">验证</view>
        </view>
    </view>
    <view class="photo" style="position: relative;background-color: black;">
        <camera style="position: relative;z-index: 2; height: 100%;width: 100%;" flash="on"  devic-position="back" frame-size="large">
        </camera>
        <!-- 拍照框（正方形） -->
        <view class="focus">
          <image src="/assets/fenggu/拍照框.png" mode="widthFix" style="width: 100%;"/>
          <view class="text">请将结构三维码放在拍照框内</view>
        </view>
    </view>
    <view class="bottom" style="height: 400rpx;align-items: center;">
        <view class="tabs" bind:tap="tabChange" style="padding: 6rpx;background-color: black;">
            <view class="tabItem tab-active" data-tindex='1'>AI验证</view>
            <view class="tabItem" data-tindex='2'>示范</view>
        </view>
    </view>
</view>


<view style="visibility:hidden; position:fixed;">
  <canvas canvas-id="myCanvas" style='width:{{frame.width}}px; height:{{frame.height}}px;'></canvas>
  <image src="{{src}}" mode="widthFix" style='width: {{windowWidth}}px; height: {{windowWidth}}px;border: 1px solid red; '></image>
</view>