<view class="container" wx:if="{{id === 1}}" style="position: relative; left: 0rpx; top: 610rpx">
  <!-- 动画区域 -->
  <view style="position: relative; left: 0rpx; top: -29rpx; width: 674rpx; height: 452rpx; display: block; box-sizing: border-box">
    <image class="rotating-image" style="width: 222rpx; height: 222rpx; display: inline-block; box-sizing: border-box; position: relative; left: 226rpx; top: -267rpx" src="/images/loading.png" mode="" />
  </view>
  <!-- 文本区域 -->
  <view>
    <view class="title" style="width: 122rpx; display: block; box-sizing: border-box; position: relative; left: 58rpx; top: -189rpx">授权中</view>
    <view class="sub-title" style="position: relative; left: 0rpx; top: -149rpx; width: 237rpx; display: block; box-sizing: border-box; height: 120rpx; font-size: 20px">请勿退出页面</view>
  </view>
  <!-- 底部链接区域 -->
  <view class="bottom-links" style="position: relative; left: 179rpx; top: -149rpx">
    <text style="height: 56rpx; display: block; box-sizing: border-box; left: 7rpx; top: -25rpx; position: relative; width: 150rpx">客服帮助</text>
    <text style="width: 72rpx; height: 1224rpx; display: block; box-sizing: border-box; position: relative; left: -29rpx; top: 560rpx">|</text>
    <text style="position: relative; left: -65rpx; top: -25rpx; width: 218rpx; display: block; box-sizing: border-box; height: 56rpx">隐私政策等</text>
  </view>
</view>


<view class="page-container" wx:if="{{id === 2}}" style="position: relative; left: 0rpx; top: -39rpx">
  <!-- 图标部分 -->
  <view>
    <image style="width: 222rpx; height: 222rpx; display: inline-block; box-sizing: border-box; position: relative; left: 0rpx; top: 174rpx" src="/images/no.png" mode="" />
  </view>

  <!-- 提示文本部分 -->
  <view class="prompt-text-area">
    <text class="fail-title" style="position: relative; left: 0rpx; top: 237rpx">支付失败</text>
  </view>
  <!-- 操作按钮部分 -->
  <view class="action-button-section">
    <button class="retry-pay-btn" style="position: relative; left: 0rpx; top: 356rpx; width: 600rpx; display: block; box-sizing: border-box">重新支付</button>
  </view>
  <!-- 底部链接区域 -->
  <view class="bottom-links" style="position: relative; left: 130rpx; top: -15rpx">
    <text style="height: 56rpx; display: block; box-sizing: border-box; left: 86rpx; top: -26rpx; position: relative; width: 212rpx">客服帮助</text>
    <text style="width: 72rpx; height: 56rpx; display: block; box-sizing: border-box; position: relative; left: -20rpx; top: -29rpx">|</text>
    <text style="position: relative; left: -57rpx; top: -29rpx; width: 212rpx; display: block; box-sizing: border-box; height: 56rpx">隐私政策等</text>
  </view>
</view>


<view class="a" wx:if="{{id === 3}}" style="position: relative; left: 0rpx; top: 0rpx">
  <!-- 图标区域 -->
  <view class="b">
    <image style="width: 222rpx; height: 222rpx; display: block; box-sizing: border-box; left: 0rpx; top: 88rpx; position: relative" src="/images/yes.png" alt="" />
  </view>
  <!-- 提示文本区域 -->
  <view class="e">
    <text class="f" style="position: relative; left: 0rpx; top: -100rpx">授权成功</text>
  </view>
  <view class="g">
    <text class="h" style="position: relative; left: 0rpx; top: -266rpx">请在两分钟内提枪加油</text>
  </view>
  <!-- 倒计时区域 -->
  <view class="i" style="position: relative; left: -2rpx; top: -387rpx; width: 560rpx; height: 100rpx; display: block; box-sizing: border-box">
    <view class="k" style="width: {{progressWidth}}%; position: relative;"></view>
    <text class="countdown-text" style="position: absolute; left: 85rpx; top: -105rpx; width: 368rpx; height: 291rpx; display: flex; box-sizing: border-box">{{currentSeconds}}s</text>
  </view>
  <!-- 底部链接区域 -->
  <view class="bottom-links" style="position: relative; left: 57rpx; top: -15rpx">
    <text style="height: 56rpx; display: block; box-sizing: border-box; left: 148rpx; top: -57rpx; position: relative; width: 186rpx">客服帮助</text>
    <text style="width: 72rpx; height: 56rpx; display: block; box-sizing: border-box; position: relative; left: 77rpx; top: -57rpx">|</text>
    <text style="position: relative; left: 40rpx; top: -57rpx; width: 186rpx; display: block; box-sizing: border-box; height: 56rpx">隐私政策等</text>
  </view>
</view>


<view class="a" wx:if="{{id === 4}}" style="position: relative; left: 0rpx; top: 45rpx">
  <!-- 图标区域 -->
  <view class="b" style="position: relative; left: 0rpx; top: 125rpx; width: 562rpx; height: 439rpx; display: flex; box-sizing: border-box">
    <view>
      <image style="width: 222rpx; height: 222rpx; display: inline-block; box-sizing: border-box; position: relative; left: 0rpx; top: -24rpx" src="/images/yes.png" mode="" />
    </view>
  </view>
  <!-- 提示文本区域 -->
  <view class="e">
    <text class="f" style="position: relative; left: 0rpx; top: -312rpx">加油中</text>
  </view>
  <view class="button-container">
    <button class="check-order-btn" style="position: relative; left: 0rpx; top: -314rpx; width: 593rpx; display: block; box-sizing: border-box; height: 99rpx" bind:tap="toHistory">查看订单</button>
    <button class="complete-btn" style="position: relative; left: 0rpx; top: -295rpx; width: 593rpx; display: block; box-sizing: border-box; height: 99rpx"bind:tap="toHistory">完成</button>
  </view>
  <!-- 底部链接区域 -->
  <view class="bottom-links" style="position: relative; left: 180rpx; top: -12rpx">
    <text style="height: 56rpx; display: block; box-sizing: border-box; left: 12rpx; top: -62rpx; position: relative; width: 120rpx">客服帮助</text>
    <text style="width: 72rpx; height: 56rpx; display: block; box-sizing: border-box; position: relative; left: 12rpx; top: -62rpx">|</text>
    <text style="position: relative; left: -34rpx; top: -62rpx; width: 174rpx; display: block; box-sizing: border-box; height: 56rpx">隐私政策等</text>
  </view>
</view>

<view class="page-container" wx:if="{{id === 5}}" style="position: relative; left: 0rpx; top: -37rpx">
  <!-- 图标部分 -->
  <view class="fail-icon-box">
    <view>
      <image style="width: 222rpx; height: 222rpx; display: inline-block; box-sizing: border-box; position: relative; left: 0rpx; top: 175rpx" src="/images/no.png" mode="" />
    </view>
  </view>
  <!-- 提示文本部分 -->
  <view class="prompt-text-area">
    <text class="fail-title" style="position: relative; left: 0rpx; top: 143rpx">授权失败</text>
  </view>

  <!-- 操作按钮部分 -->
  <view class="action-button-section">
    <button class="retry-pay-btn" style="position: relative; left: 0rpx; top: 245rpx; width: 602rpx; display: block; box-sizing: border-box" bind:tap="toAuthorization">重新发起授权</button>
    <button class="checkHistory" style="position: relative; left: 0rpx; top: 245rpx; width: 602rpx; display: block; box-sizing: border-box" bind:tap="toHistory">查看订单</button>
  </view>
  <!-- 底部链接区域 -->
  <view class="bottom-links" style="position: relative; left: 24rpx; top: 0rpx">
    <text style="height: 56rpx; display: block; box-sizing: border-box; left: 200rpx; top: -55rpx; position: relative; width: 104rpx">客服帮助</text>
    <text style="width: 72rpx; height: 56rpx; display: block; box-sizing: border-box; position: relative; left: 201rpx; top: -55rpx">|</text>
    <text style="position: relative; left: 164rpx; top: -55rpx; width: 138rpx; display: block; box-sizing: border-box; height: 55rpx">隐私政策等</text>
  </view>
</view>