<template>
  <view class="repaired-container">
    <!-- 顶部栏 -->
    <view class="repaired-navbar">
      <image src="/static/ic_back.png" class="repaired-back" @click="goBack" />
      <text class="repaired-progress" @click="goProgress">查看进度</text>
    </view>
    <!-- 成功图标 -->
    <view class="repaired-icon-box">
      <image src="/static/ic_repaired_01.png" class="repaired-icon" />
    </view>
    <!-- 提交成功文字 -->
    <view class="repaired-title">提交成功</view>
    <view class="repaired-desc">提交成功后我们将及时为您服务</view>
    <!-- 返回首页按钮 -->
    <button class="repaired-btn" @click="goHome">返回首页</button>
  </view>
</template>

<script>
export default {
  methods: {
    goBack() {
      uni.navigateBack();
    },
    goProgress() {
      // 跳转到进度页面
      uni.showToast({ title: '查看进度', icon: 'none' });
    },
    goHome() {
      uni.switchTab({ url: '/pages/home/home' });
    }
  }
}
</script>

<style scoped>
.repaired-container {
  min-height: 100vh;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.repaired-navbar {
  width: 100%;
  height: 100rpx;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  margin-top: 40rpx;
}
.repaired-back {
  width: 18rpx;
  height: 32rpx;
  margin-left: 24rpx;
}
.repaired-progress {
  position: absolute;
  right: 36rpx;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24rpx;
  color: #333;
}
.repaired-icon-box {
  width: 180rpx;
  height: 180rpx;
  margin: 113rpx auto 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.repaired-icon {
  width: 150rpx;
  height: 150rpx;
}
.repaired-title {
  margin-top: 96rpx;
  font-size: 38rpx;
  color: #333;
  font-weight: 500;
  text-align: center;
}
.repaired-desc {
  margin-top: 39rpx;
  font-size: 28rpx;
  color: rgba(51,51,51,0.5);
  text-align: center;
}
.repaired-btn {
  width: 524rpx;
  height: 92rpx;
  background: linear-gradient(90deg, #00C7FF 0%, #0096FF 100%);
  color: #fff;
  font-size: 28rpx;
  border: none;
  border-radius: 22rpx;
  margin: 246rpx auto 0 auto;
  box-shadow: 0 15rpx 24rpx 0 rgba(0,199,255,0.18), 0 8rpx 24rpx 0 rgba(0,150,255,0.18);
  display: flex;
  align-items: center;
  justify-content: center;

}
</style>