Component({
    options: {},
    /**
     * 组件的属性列表
     */
    properties: {},
    /**
     * 组件的初始数据
     */
    data: {
        show: false, // 是否显示Tip
        top: 0, // Tip距离顶部的距离
        right: 0, // Tip距离右侧的距离
        arrowRight: 0, // 箭头距离右侧的距离
    },
    /**
     * 组件生命周期
     */
    lifetimes: {
        attached() {
            // 检查用户是否已关闭过Tip
            const tipClosed =
                wx.getStorageSync('addToMiniprogramTipClosed') || false;

            // 如果用户未关闭过，则显示Tip
            if (!tipClosed) {
                this.setData({
                    show: true,
                });
            }

            // 获取胶囊按钮位置信息
            const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
            const windowInfo = wx.getWindowInfo();
            console.log('windowInfo', windowInfo);
            console.log('menuButtonInfo', menuButtonInfo);
            // 计算Tip的位置
            // Tip应该在胶囊按钮下方，箭头向上指向胶囊按钮
            const top = 10; // 胶囊按钮下方20px
            const right = windowInfo.windowWidth - menuButtonInfo.right; // 距离右侧的距离，与胶囊按钮右对齐

            // 计算箭头位置：箭头应该指向胶囊按钮的中心
            // 胶囊按钮中心相对于Tip内容区域的右侧位置
            const capsuleCenterX = menuButtonInfo.left + 28;
            const tipRightEdge = windowInfo.windowWidth - right;
            const arrowRight = tipRightEdge - capsuleCenterX; // 箭头距离Tip右侧的距离

            this.setData({
                top: top,
                right: right,
                arrowRight: arrowRight,
            });
        },
    },
    /**
     * 组件的方法列表
     */
    methods: {
        /** 关闭Tip */
        onClose() {
            // 保存关闭状态到本地存储
            wx.setStorageSync('addToMiniprogramTipClosed', true);
            // 隐藏Tip
            this.setData({
                show: false,
            });
        },
    },
});