Files
lilishop-uniapp/pages/order/afterSales/applySuccess.vue
pikachu1995@126.com a32f6d2313 style(theme): 统一应用主题样式并更新组件样式变量
- 在多个页面组件中添加动态主题样式绑定
- 将硬编码的颜色值替换为CSS变量和主题配置
- 引入主题样式计算逻辑到各个页面
- 更新优惠券、地址、订单等页面的主题适配
- 替换线性渐变背景为动态主题颜色
- 移除uni_modules组件中的$set方法调用以优化性能
- 更新README中主题色管理状态为已完成
2026-10-09 16:02:11 +08:00

81 lines
2.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view :style="themeStyle">
<view class="header">
<u-icon name='checkmark' size="150" color="#ff6b35"></u-icon>
<view class="success-text">售后申请提交成功</view>
<view class="btn-view">
<view class="btn-item">
<u-button ripple class="btn1" shape="circle" @click="navigateToAfterSales()">查看记录</u-button>
</view>
<view class="btn-item">
<u-button ripple class="btn2" shape="circle" @click="navigateToHome()">回到主页</u-button>
</view>
</view>
</view>
<view class="text-view">
<view style="display: flex; margin-bottom: 20rpx; align-items: center">温馨提示:</view>
<view>• 商品寄回地址将在审核通过后在申请记录中查询。</view>
<view>• 提交服务单后,售后专员可能与您电话沟通,请保持手机畅通。</view>
<view>• 退货处理成功后退款金额将原路返回到您的支持账户中;</view>
</view>
</view>
</template>
<script setup lang="ts">import { computed } from 'vue'
import { useStore } from '@/store'
import { getThemeStyle } from '@/utils/theme'
const store = useStore()
const themeStyle = computed(() => getThemeStyle(store.state.theme))
function navigateToAfterSales() {
uni.redirectTo({
url: '/pages/order/afterSales/afterSales',
})
}
function navigateToHome() {
uni.switchTab({
url: '/pages/tabbar/home/index',
})
}
</script>
<style lang="scss" scoped>
page {
background: $page-color-base;
padding-bottom: 100rpx;
}
.btn1 {
background: $light-color;
color: #fff;
}
.btn2 {
color: $light-color;
}
.header {
background-color: #fff;
height: 500rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.success-text {
font-size: 40rpx;
font-weight: 400;
margin: 20rpx 0;
}
.btn-view {
display: flex;
flex-direction: row;
margin: 40rpx 0rpx;
.btn-item {
margin: 0rpx 20rpx;
}
}
}
.text-view {
margin: 40rpx;
color: #909399;
}
</style>