<template>
    <!-- 我的钱包 -->
    <view class="jy-wallet-container" @click="goto('/pages/mine/balance/index')">
        <!-- 左边 -->
        <view class="left df aic">
            <image :src="mineWallet" mode="aspectFill"></image>
            <text>我的钱包</text>
        </view>
        <!-- 右边 -->
        <view class="right df aic">
            <text>查看余额</text>
            <uni-icons type="right"></uni-icons>
        </view>
    </view>
</template>
<script setup>
import { ref } from 'vue'

import mineWallet from '@/static/mine-wallet.png'
const goto = (url) => {
    uni.navigateTo({
        url
    })
}
</script>
<style lang="scss" scoped>
.jy-wallet-container {
    height: 112rpx;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    padding: 16rpx 24rpx;
    border-radius: 20rpx;
    margin: 8rpx 0;

    .left {
        image {
            width: 80rpx;
            height: 80rpx;
            margin-right: 10rpx;
        }

        text {
            font-size: 36rpx;
            color: #333333;
            font-weight: 600;
        }
    }

    .right {

        text {
            font-size: 24rpx;
            color: #999999;
            margin-right: 20rpx;
        }
    }
}
</style>