<!-- 售后类型 -->
<template>
    <view class="jy-return-type">
        <!-- 商品物流 -->
        <JyCommodityLogisticsCard></JyCommodityLogisticsCard>
        <view class="mtb20 mlr20 uni-section-for">
            <uni-section class="br20 mb30 ptb30" v-for="(item, index) in sales_type" :key="index" :title="item.title"
                :subTitle="item.subTitle" @click="fn[item.fn](item)">
                <template v-slot:decoration>
                    <image class="shopSales" :src="shopSales" mode="aspectFill"></image>
                </template>
                <template v-slot:right>
                    <uni-icons type="right"></uni-icons>
                </template>
            </uni-section>
        </view>
    </view>
</template>

<script setup>
import { ref } from 'vue'
//商品物流
import JyCommodityLogisticsCard from '@/components/public/jy-commodity-logistics-card'
import shopSales from '@/static/shop-sales.png'
const fn = {
    refund: (val) => {
        uni.navigateTo({
            url: `/pages/shop/refund/index?type=${val.type}`
        })
    },
    refunds_returns: (val) => {
        uni.navigateTo({
            url: `/pages/shop/refund/index?type=${val.type}`
        })
    }
}
const sales_type = ref([{
    title: '我要退款（无需退货）',
    subTitle: '我要退款（无需退货）',
    fn: 'refund',
    type: 1
}, {
    title: '已收到货，我要退货退款',
    subTitle: '已收到货，我要退货退款',
    fn: 'refunds_returns',
    type: 2
}])
</script>
<style scoped lang="scss">
.shopSales {
    height: 44rpx;
    width: 44rpx;
    border-radius: 10rpx;
    margin: 0 30rpx 0 20rpx;
    font-weight: 600;
}

.uni-section-for {
    ::v-deep .uni-section__content-title {
        margin-bottom: 20rpx;
        font-size: 36rpx;
        color: #333333;
    }
}

::v-deep .uni-section__content-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
</style>