<template>
    <view class="settings-container">
        <view class="card-box user-info flex">
            <u-avatar :src="dataInfo.cIcon" size="100rpx" default-url="/static/common/avatar.png"></u-avatar>
            <view class="info">
                <view class="name">{{ dataInfo.cNickName }}</view>
                <view class="date">{{ dataInfo.createTime }} 注册</view>
            </view>
        </view>

        <view class="card-box">
            <u-cell-group :border="false">
                <u-cell title="账号安全" isLink :border="false"></u-cell>
            </u-cell-group>
        </view>

        <view class="card-box">
            <u-cell-group :border="false">
                <u-cell title="关于我们" isLink :border="true"></u-cell>
                <u-cell title="意见反馈" isLink :border="true"></u-cell>
                <u-cell title="清空聊天记录" isLink :border="false"></u-cell>
            </u-cell-group>
        </view>

        <view class="card-box">
            <u-cell title="客服电话" :value="dataInfo.mobile" :border="false" @click="onPhoneCall(dataInfo.mobile)"></u-cell>
        </view>

        <view class="footer-bar">
            <u-button text="退出登录" shape="circle"
                customStyle="height: 76rpx; font-size: 32rpx; color: #fff; background: var(--theme-color);"
                @click="onLogout"
            ></u-button>
        </view>
    </view>
</template>

<script>
import {
    logout,
    getInfo,
} from '@/api/index.js';
export default {
    data() {
        return {
            dataInfo: {
                cIcon: 'https://cdn.uviewui.com/uview/album/1.jpg', 
                cNickName: '赵青青',
                createTime: '2025.10.01',
                mobile: ''
            },
        }
    },
    onShow() {
		this.getData();
    },
    methods: {
		// 用户数据
		getData() {
			this.dataInfo = {};
			getInfo().then(res => {
				if (res.data.code == 200) {
					this.dataInfo = res.data.data;
					uni.setStorageSync('wx_copenid', res.data.data.cOpenid);
				}
			})
		},
        onPhoneCall(n) {
            if (!n) return;
            uni.makePhoneCall({
                phoneNumber: n 
            });
        },
        onLogout() {
            uni.showModal({
				title: '确定退出登录吗',
				success: (res) => {
					if (res.confirm) {
						logout().then(res => {
							if (res.data.code == 200) {
								uni.removeStorageSync('access-token')
								this.$router.go(0)
								uni.showToast({
									title: '已退出登录',
									icon: 'none'
								})
							}
						});
					}
				}
			});
        }
    }
}
</script>

<style lang="scss" scoped>
.settings-container {
    min-height: 100vh;
    padding: 24rpx;
    background: #f8f8f8;

    .user-info {
        padding: 24rpx;
        margin-bottom: 24rpx;
        border-radius: 16rpx;
        background: #fff;

        .info {
            margin-left: 20rpx;

            .name {
                font-size: 28rpx;
                font-weight: bold;
                color: #333;
            }

            .date {
                font-size: 24rpx;
                color: #999;
                margin-top: 16rpx;
            }
        }
    }

    .card-box {
        background: #fff;
        border-radius: 16rpx;
        margin-bottom: 24rpx;
        overflow: hidden;
    }
}
</style>