<template>
    <view class="rulesGroupWrap">
        <view class="rulesGroup">
            <view v-for="(item, index) in growthDetail" :key="index">
                <view class="rulesItem">
                    <view>{{ item.title }}</view>
                    <view><span style="color: #FC4A4A;margin-right: 15rpx;">+{{ item.growthValue }} </span> 成长值</view>
                </view>
                <view class="rulesTime">{{ item.date }}</view>
            </view>
            <view v-if="growthDetail.length == 0">暂无信息</view>
        </view>
    </view>
</template>

<script>
export default {
    onShow() {
        this.http.quickGet('/getInfo', true).then(res => {
            console.log(res.data.user.growthDetail);

            this.growthDetail = JSON.parse(res.data.user.growthDetail)
        })
        console.log(this.growthDetail);

    },
    data() {
        return {
            growthDetail: []
        }
    }
}
</script>

<style lang="scss" scoped>
.rulesGroupWrap {
    padding: 30rpx 0;

    .rulesGroup {
        width: 683rpx;
        margin: 0rpx auto;
        background: #FFFFFF;
        border-radius: 10rpx;
        padding: 0 40rpx;
        font-family: PingFang SC;
        font-weight: 500;
        padding: 5rpx 25rpx 55rpx 25rpx;

        img {
            width: 13rpx;
            height: 21rpx;
        }

        >view {
            border-bottom: 1px solid #EDEDED;
            padding: 25rpx 0;

            .rulesItem {
                font-size: 30rpx;
                color: #1A1A1A;
                line-height: 38rpx;
                line-height: 50rpx;
                width: 100%;
                display: flex;
                justify-content: space-between;
            }

            .rulesTime {
                margin-top: 10rpx;
                font-size: 24rpx;
                color: #808080;
                line-height: 38rpx;
            }
        }
    }
}
</style>