53 lines
1.7 KiB
Vue
53 lines
1.7 KiB
Vue
<script setup>
|
||
import Avatar from "../../static/images/Avatar.png";
|
||
import user_BG from '../../static/images/user_bg.png';
|
||
import XNav from "../../components/XNav.vue";
|
||
import CreditScore from "../../components/CreditScore.vue";
|
||
</script>
|
||
|
||
<template>
|
||
<!--我的-->
|
||
<x-nav></x-nav>
|
||
|
||
<view class="!w-full !h-[484rpx] overflow-hidden relative">
|
||
<image class="!w-[1200rpx] !h-[480rpx] !absolute left-[-200rpx]" :src="user_BG" mode="aspectFill"></image>
|
||
|
||
<view class="test !w-full relative z-10 p-[20rpx] !flex gap-[34rpx] relative">
|
||
<image class="!size-[132rpx]" :src="Avatar" mode="aspectFill"></image>
|
||
<view class="!flex flex-col items-start justify-between box-border py-[4rpx]">
|
||
<view class="user_name">用户名称</view>
|
||
<view class="user_phone">手机号：1570****061</view>
|
||
<view class="user_phone">uid：38578</view>
|
||
</view>
|
||
|
||
<credit-score></credit-score>
|
||
|
||
<view
|
||
class="bg-[rgba(0,0,0,.8)] text-[#fff] absolute right-0 py-[7rpx] w-[120rpx] rounded-l-full !flex items-center justify-center gap-[4rpx]"
|
||
style="font-size: 22rpx">
|
||
<tui-icon name="edit" size="16"></tui-icon>
|
||
<view class="!mt-[2rpx]">编辑</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.user_name {
|
||
color: rgb(29, 33, 41);
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
line-height: 23px;
|
||
letter-spacing: 0;
|
||
text-align: center;
|
||
}
|
||
|
||
.user_phone {
|
||
color: rgb(134, 144, 156);
|
||
font-size: 22rpx;
|
||
font-weight: 500;
|
||
letter-spacing: 0;
|
||
text-align: left;
|
||
}
|
||
</style>
|