<!-- 售后详情 -->
<template>
    <view class="jy-after-sales-detail">
        <JyCommonHead class="bfff" title="售后详情"></JyCommonHead>
        <view class="content">
            <!-- 退款成功 价格 账户-->
            <view class="df fdc bfff">
                <uni-section titleColor="#333333" titleFontSize="48rpx" title="退款成功"
                    @click="goto('/pages/mine/money-whereabouts/index')">
                    <template v-slot:right>
                        <uni-icons type="right"></uni-icons>
                    </template>
                </uni-section>
                <view class="df aic fdr plr20">
                    <text class="f48 bold">￥</text>
                    <text class="price bold">100</text>
                    <text class="f24 tk ml20">已退款到微信</text>
                </view>
                <uni-steps :options="list2" active-color="#37B111" :active="active" />
            </view>
        </view>
        <!-- 店家 商品信息 -->
        <JyFund />
        <!-- 精选 -->
        <JyCherryPick></JyCherryPick>
    </view>
</template>

<script setup>
import { ref } from 'vue'
//店家 商品信息
import JyFund from '@/components/public/jy-fund'
// 头部
import JyCommonHead from '@/components/public/jy-common-head'
//精选
import JyCherryPick from '@/components/public/jy-cherry-pick';

const active = ref(1)
const list2 = ref([{
    title: '买家下单',
    desc: '2018-11-11'
}, {
    title: '卖家发货',
    desc: '2018-11-12'
}, {
    title: '买家签收',
    desc: '2018-11-13'
}])
</script>
<style scoped lang="scss">
.price {
    font-size: 72rpx;
}

.tk {
    color: #37B111;
}

::v-deep .uni-section__content-title {
    font-weight: 600;
}

::v-deep.uni-steps__row {
    flex-direction: column-reverse;

    .uni-steps__row-title {
        margin: 20rpx 0;
        color: #999999 !important;
    }
}

// 加粗
.bold {
    font-weight: 600;
}
</style>