Shopee 悬浮按钮

添加快捷入口
目前为 2023-06-26 提交的版本。查看最新版本。
Wrap lines
// ==UserScript==
// @name         Shopee 悬浮按钮
// @namespace    http://tampermonkey.net/
// @version      1.0
// @license      GPL Rayu
// @description  添加快捷入口
// @author       Rayu
// @match        https://seller.shopee.tw/*
// @grant        none
// @require      http://code.jquery.com/jquery-3.6.0.min.js
// ==/UserScript==

(function() {
    'use strict';

    // 创建按钮元素
    function createButton(id, content, link) {
        const button = document.createElement('a');
        button.id = id;
        button.textContent = content;
        button.href = link;
        button.target = '_blank'; // 在新标签页中打开链接
        button.style.display = 'flex';
        button.style.alignItems = 'center'; // 垂直居中对齐
        button.style.justifyContent = 'center'; // 水平居中对齐
        button.style.position = 'fixed';
        button.style.zIndex = 9999;

        // 设置样式
        button.style.backgroundColor = 'rgba(238, 77, 45, 0.15)'; // 背景颜色（带透明度）
        button.style.color = '#ffffff'; // 文字颜色
        button.style.width = '100px'; // 宽度
        button.style.height = '48px'; // 高度
        button.style.borderRadius = '5px'; // 圆角半径
        button.style.fontWeight = 'bold'; // 文字加粗
        button.style.fontSize = '16px'; // 字体大小

        // 添加类名
        button.classList.add('floating-button');

        return button;
    }

    // 创建按钮
    const buttons = [
      createButton('button1', '待出货', 'https://seller.shopee.tw/portal/sale/shipment?type=toship'),
      createButton('button2', '我的商品', 'https://seller.shopee.tw/portal/product/list/all?page=1&size=48'),
      createButton('button3', '商品分析', 'https://seller.shopee.tw/datacenter/products/analysis/overview'),
      createButton('button4', '我的广告', 'https://seller.shopee.tw/portal/marketing/pas/assembly'),
      createButton('button5', '行销活动', 'https://seller.shopee.tw/portal/marketing'),
      createButton('button6', '提款金额', 'https://seller.shopee.tw/portal/finance/wallet/shopeepay?page=1&typeGroup=wallet_withdrawals')
    ];

    // 设置按钮位置
    const windowHeight = window.innerHeight || document.documentElement.clientHeight;
    const buttonHeight = 48; // 按钮高度
    const topOffset = (windowHeight - (buttonHeight * 6 + 50)) / 2; // 垂直偏移量

    buttons.forEach((button, index) => {
      button.style.right = '30px'; // 向左偏移20px
      button.style.top = `${topOffset + (buttonHeight * index) + (10 * index)}px`;

      // 监听鼠标进入和离开事件
      button.addEventListener('mouseenter', function() {
        setButtonsOpacity(1); // 设置按钮不透明度为1（不透明）
      });

      button.addEventListener('mouseleave', function() {
        setButtonsOpacity(0.15); // 设置按钮不透明度为0.15（带透明度）
      });

      // 将按钮添加到页面中
      document.body.appendChild(button);
    });

    // 设置所有按钮的不透明度
    function setButtonsOpacity(opacity) {
      buttons.forEach(button => {
        button.style.backgroundColor = `rgba(238, 77, 45, ${opacity})`;
      });
    }

    // 添加额外的样式
    const customStyle = document.createElement('style');
    customStyle.innerHTML = `
        .route-portal-marketing-pas-assembly .ads-index,
        .route-portal-marketing-pas .ads-index {
            width: 1800px !important;
        }

        .product-statistic .shopee-table[data-v-bbac3984]{
            width: 1750px !important;
        }

        #app > div.app-container > div > div {
            margin-left: 30px;
        }
    `;
    document.head.appendChild(customStyle);
})();