<view class="ocr-photograph-panel">
  <camera 
    class="ocr-photograph-camera"
    flash="{{ isTorchOn ? 'torch' : 'off'}}"
  >
    <cover-view class="ocr-photograph-selection-box">
      <cover-view class="ocr-photograph-selection-area vertical ocr-photograph-selection-area-{{theme}}">
        <cover-view 
          class="ocr-photograph-bar ocr-photograph-bar-{{theme}}"
          wx:if="{{isAutoMode}}"
          animation="{{barMove}}"
          bindtransitionend="reAnimation"></cover-view>
        <cover-view wx:if="{{category==='ID_CARD' && side==='FRONT' || category==='ID_CARD_FRONT'}}" style="margin-top:30rpx;margin-left:320rpx;">
          <cover-image src="https://beta.gtimg.com/GodIdent/huiyan/img/ico-head.png" style="width:140px;height:157px;"></cover-image>
        </cover-view>
        <cover-view wx:if="{{category==='ID_CARD' && side==='BACK' || category==='ID_CARD_BACK'}}" style="margin-top:20rpx;margin-left:10rpx;">
          <cover-image src="https://beta.gtimg.com/GodIdent/huiyan/img/ico-guohui.png" style="width:76px;height:79px;"></cover-image>
        </cover-view>
      </cover-view>

      <cover-view class="ocr-photograph-tips">
        <cover-image 
          class="icon"
          src="https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/warning.png"
        />
        <cover-view class="text">证件请避免折角、遮挡和反光</cover-view>
      </cover-view>

      <cover-view class="ocr-photograph-btns">
        <cover-image       
          wx:if="{{!disableAlbum}}"
          class="ocr-photograph-pictuer-btn"
          src="https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/chooseImg.png"
          bind:tap="chooseImage"
        />
        <cover-image 
          wx:if="{{!isAutoMode}}"
          class="ocr-photograph-take-btn ocr-photograph-take-btn-{{theme}}"
          src="{{theme==='native' ? 'https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/takePicNative.png' : 'https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/takePicPrimary.png'}}"
          bind:tap="takeImage"
        >
        </cover-image>
        <cover-image 
          class="ocr-photograph-flash-btn"
          src="{{isTorchOn ? 'https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/flashOn.png' : 'https://ocr-static-1254418846.file.myqcloud.com/mpsdk/images/flashOff.png'}}"
          bind:tap="toggleTorch"
        ></cover-image>
      </cover-view>
    </cover-view>
  </camera>
</view>