badminton-web/src/views/hd/wd/index.vue

<template>
    <div class="user-main">
        <div class="info">
            <div class="tx-info">
                <div class="tx"><el-image style="width: 50px; height: 50px;border-radius: 5px;"
                        src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="cover" />
                </div>
                <div>
                    <div>{{ user.nickName }}</div>
                    <div>余额：￥{{ form.money }}</div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>
import { getUserProfile } from '@/api/system/user.js'
import { getInfo } from '@/api/svc/user'
import { onMounted } from 'vue';

const user = ref({})
const form = ref({})

async function init() {
    await getUserProfile().then(res => {
        console.log(res);
        user.value = res.data
    })
    await getInfo(user.value.userId).then(res => {
        console.log(res);
        form.value = res.data
    })
}

onMounted(() => {
    init()
})
</script>

<style scoped>
.user-main {
    width: 100%;
    display: flex;
    justify-content: center;
}

.info {
    width: 90%;
    padding-top: 10px;
}

.tx-info {
    border-radius: 5px;
    background-color: #FFF;
    width: 100%;
    display: flex;
    padding: 5px;
    align-items: center;
}

.tx {
    margin-right: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>