<!--
 * @Author: micky 1254597151@qq.com
 * @Date: 2023-08-14 15:38:40
 * @LastEditors: micky 1254597151@qq.com
 * @LastEditTime: 2023-09-12 14:33:43
 * @FilePath: \housekeeping-uniapp\src\components\widgets\user-info\user-info.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <view class="user-info flex justify-between">
        <view
            v-if="isLogin"
            class="flex items-center"
            @click="navigateTo('/pages/user_data/user_data')"
        >
            <u-avatar :src="user.avatar" :size="120"></u-avatar>
            <view class="text-black ml-[20rpx]">
                <view class="text-2xl">{{ user.nickname }}</view>
                <view class="text-s mt-[18rpx]" @click.stop="copy(user.username)">
                    账号名：{{ user.username }}
                </view>
            </view>
        </view>
        <navigator v-else class="flex items-center" hover-class="none" url="/pages/login/login">
            <u-avatar src="/static/images/user/default_avatar.png" :size="120"></u-avatar>
            <view class="text-black text-3xl ml-[20rpx]">未登录</view>
        </navigator>
        <navigator v-if="isLogin" hover-class="none" url="/pages/user_set/user_set" class="mt-4">
            <u-icon name="setting" color="#666666" :size="56"></u-icon>
        </navigator>
    </view>
</template>
<script lang="ts" setup>
import { useCopy } from '@/hooks/useCopy'

const props = defineProps({
    content: {
        type: Object,
        default: () => ({})
    },
    styles: {
        type: Object,
        default: () => ({})
    },
    user: {
        type: Object,
        default: () => ({})
    },
    isLogin: {
        type: Boolean
    }
})
const { copy } = useCopy()
const navigateTo = (url: string) => {
    uni.navigateTo({
        url
    })
}
</script>

<style lang="scss" scoped>
.user-info {
    padding: 180rpx 20rpx 80rpx;
}
</style>
