lcap_tools

提供一些网页小工具,低代码开发专用

目前為 2024-06-03 提交的版本,檢視 最新版本

// ==UserScript==
// @name         lcap_tools
// @namespace    http://tampermonkey.net/
// @version      0.1.6
// @description  提供一些网页小工具,低代码开发专用
// @author       袁龙辉
// @match        https://lcap.test.zte.com.cn/*
// @match        https://lcap.dev.zte.com.cn/*
// @match        https://lcap.uat.zte.com.cn/*
// @match        https://lcapst.test.zte.com.cn/*
// @match        https://lcappro.uat.zte.com.cn/*
// @match        https://lcappro.test.zte.com.cn/*
// @match        https://lcappro.dev.zte.com.cn/*
// @match        https://uactest.zte.com.cn/*
// @match        https://test55.ucs.zte.com.cn/*
// @match        http://local.zte.com.cn/*
// @match        https://local.zte.com.cn/*
// @match        http://127.0.0.1/*
// @match        https://lcap.opendn.com.cn/*
// @match        https://opendn.com.cn/*
// @match        https://dn.zte.com.cn/*
// @match        https://sdp.test.zte.com.cn/*
// @icon         data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAbCAYAAACJISRoAAAABHNCSVQICAgIfAhkiAAAAQtJREFUSInt1c1Kw0AUhuFTF8kFTJnAFFwKYrHQUjE0Fq2iOxG8Bn/vQ8SbEMX+oLhQ9+raXom9g0lI8roQBDdmFi0q5FsOfOdZDIdTAZAZZ27WQImUyC8ju3v7Ug1q0tva+fZ+dn4h1aAmYacreZ7/PISCPL+8orRBacPbeAyAtZaFxTpKG27v7otGUIgAbGxuo7Th4OgEgMFwhNKGVjskTdPpIA+PTyhtCMw875MJ671PtD8YudTdkCzLWFmNUNpweHyK0oZGs02SJNNDAG76w6+/UdpweXXtWnVH4jim3mihtGFpuYm11hlx3hPP86S7FomISNQJxfd91+ofWcZ/g1SgPL8lUiIF+QCIeCJE+P0wYgAAAABJRU5ErkJggg==
// @grant        GM_cookie
// @grant        GM_addStyle
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @grant        GM_listValues
// ==/UserScript==

(function () {
    'use strict';
    GM_addStyle(
        `.y-panel {
            width: 150px;
            display: flex;
            flex-direction: column;
            position: fixed;
            top: 32px;
            right: -150px;
            background-color: #a1d4e2;
            border-radius: 3px;
            transition: all 0.3s;
            opacity: 1;
            z-index: 9999999999;
          }
        .y-panel:before {
            width: 24px;
            height: 48px;
            position: absolute;
            top: calc(50% - 24px);
            left: -24px;
            background-color: #a1d4e2;
            border-radius: 48px 0px 0px 48px;
            border-top: 1px solid #5ac6aa;
            border-left: 1px solid #5ac6aa;
            border-bottom: 1px solid #5ac6aa;
            content: \"\";
            opacity: 0.8;
            cursor: pointer;
            z-index: 9999999999;
        }
        .y-panel:hover {
            right: 0;
        }
        .y-panel > .y-panel-btn {
            position: relative;
            border: 1px solid #fff;
            border-radius: 3px;
            color: #283654 !important;
            cursor: pointer;
            line-height: normal !important;
            font-size: 13px !important;
            font-weight: bold;
            font-family: SimSun, STSong, 宋体, "Microsoft YaHei", Arial, sans-serif;
            margin: 4px 5px;
            padding: 2px 4px;
            text-align: center;
            user-select: none;
            background-color: #f0f0f0;
            z-index: 9999999999;
        }
        .y-panel-input {
            height: 24px;
            margin: 5px 4px;
            border-radius: 3px;
        }
        ::-webkit-input-placeholder {
            color: rgba(0, 0, 0, 0.5);
            font-size: 14px;
        }
        .y-panel-btn_delete {
            padding: 0px 3px;
            color: #000;
            position: absolute;
            right: 3px;
            top: 0px;
            background-color: #88befc;
        }
        .y-panel-btn_delete:hover {
            color: #fff;
            background-color: red;
        }`
    );

    // 可以在这里配置常用工号,例如:
    const name_map = ['10331290', '00268638', '10286708']
    //const name_map = []
    // 本地存储的工号
    const stored_name_map = GM_listValues().map(item => GM_getValue(item))

    function register(btns) {
        const yPanel = document.querySelector('.y-panel')
        if (yPanel) {
            yPanel.parentNode.removeChild(yPanel)
        }
        const container = document.createElement("div");
        container.className = "y-panel";
        document.body.appendChild(container);

        btns.forEach(btn => {
            const button = document.createElement("button");
            button.textContent = btn.text;
            button.className = "y-panel-btn";
            button.onclick = btn.onclick;
            container.appendChild(button);
            if (btn.isStored) {
                const delete_btn = document.createElement("button");
                delete_btn.textContent = 'x';
                delete_btn.className = 'y-panel-btn_delete';
                delete_btn.onclick = (e) => {
                    e.stopPropagation()
                    GM_deleteValue(btn.text)
                    refreshPanel()
                };
                button.appendChild(delete_btn);
            }
            if(btn.password) {
                button.title = btn?.password
            }
            button.style.backgroundColor = btn.type === 'function' && '#5ac6aa'
        });

        // 添加跳转按钮
        addJumpBtn(container)

        // 工号输入
        const name_input = document.createElement("input");
        name_input.className = 'y-panel-input'
        name_input.placeholder = '新增工号, Enter'
        container.appendChild(name_input);
        name_input.addEventListener('keydown', (event) => {
            if (event.key === 'Enter') {
                GM_setValue(name_input.value, name_input.value)
                login(name_input.value)
                refreshPanel()
            }
        });
    };

    function clearCookies() {
        const cookies = document.cookie.split(';').map(cookie => cookie.trim().split('=')[0]);
        cookies.forEach(item => {
            GM_cookie.delete({ name: item });
        })
        location.reload();
    }

    function login(name, password = '1') {
        const nameInput = document.getElementById('input-loginname')
        if (!nameInput) return
        const passwordInput = document.getElementById('input-password')
        const login_btn = document.getElementsByClassName("el-button login-btn el-button--primary")[0]
        var event = new Event('input', {
            bubbles: true,
            cancelable: true,
        });
        nameInput.value = name
        nameInput.dispatchEvent(event);
        passwordInput.value = password
        passwordInput.dispatchEvent(event);
        login_btn.click()
    }

    function changeLang() {
        const currentUrl = new URL(window.location.href)
        const params = currentUrl.searchParams
        if(params.get('lang')) {
            params.set('lang', params.get('lang') === 'zh' ? 'en' : 'zh')
            window.history.replaceState({}, '', currentUrl)
        }
        const cookies = document.cookie.split(';').map(cookie => cookie.trim());
        cookies.forEach(cookie => {
            const [name, value] = cookie.trim().split('=')
            if (name.includes('Language')) {
                GM_cookie.delete({ name });
                GM.cookie.set({
                    name,
                    value: value === 'zh_CN' ? 'en_US' : 'zh_CN'
                })
            }
        })
        location.reload();
    }


    function getBtnMap(stored_name_map) {
        return [
            {
                text: '清空Cookie并刷新',
                type: 'function',
                onclick: () => clearCookies()
            },
            {
                text: '切换cookie的语言',
                type: 'function',
                onclick: () => changeLang()
            },
            // 可以添加自定义的工号和密码, password属性是为了悬浮显示的
            {
                text: '自定义工号',
                password: '123456@Zte',
                onclick: () => login('10331290','123456@Zte')
            },
            ...name_map.map(name => {
                return {
                    text: name,
                    password: '1',
                    onclick: () => login(name)
                }
            }),
            ...stored_name_map.map(name => {
                return {
                    text: name,
                    isStored: true,
                    password: '1',
                    onclick: () => login(name)
                }
            })
        ]
    }

    // 在name新增删除后刷新面板
    function refreshPanel() {
        const current_stored_name_map = GM_listValues().map(item => GM_getValue(item))
        const btn_map = getBtnMap(current_stored_name_map)
        register(btn_map)
    }

    function addJumpBtn(container) {
        const { hostname, pathname, searchParams, hash } = new URL(window.location.href);
        const hashParts = hash.slice(2).split('/')
        const hashObject = {
            app: hashParts.indexOf('app') !== -1 ? hashParts[hashParts.indexOf('app') + 1] : null,
            bizObject: hashParts.indexOf('bizObject') !== -1 ? hashParts[hashParts.indexOf('bizObject') + 1] : null,
            page: hashParts.indexOf('page') !== -1 ? hashParts[hashParts.indexOf('page') + 1] : null
        }
        const layoutUrl = `https://${hostname}/zte-paas-lcap-frontendcli/layout-designer.html?lang=zh`
        const entityUrl = `https://${hostname}/zte-paas-lcap-frontendcli/entity-designer.html?lang=zh`
        const mainPageUrl = `https://${hostname}/zte-paas-lcap-frontendcli/index.html#/platform/applicationdevelopment`
        if (searchParams.get('bizObject') && searchParams.get('bizObject') !== 'null') {
            createBtn([
                {
                    text: 'to->当前布局',
                    title: '适用于表单页,列表页跳转之后需要切换一下布局',
                    toUrl: `${layoutUrl}${hash}/bizObject/${searchParams.get('bizObject')}`
                },
                { text: 'to->当前实体', toUrl: `${entityUrl}#/app/${hashObject.app}/bizObject/${searchParams.get('bizObject')}` }
            ], container)
        }
        else if (searchParams.get('bizObject') === 'null') {
            createBtn([
                { text: 'to->当前页面设计', toUrl: `${layoutUrl}#/app/${hashObject.app}/page/${hashObject.page}` }
            ], container)
        }
        else if (pathname.includes('zte-paas-lcap-frontendcli/layout-designer.html') && hashObject.bizObject) {
            createBtn([
                { text: 'to->当前实体', toUrl: `${entityUrl}#/app/${hashObject.app}/bizObject/${hashObject.bizObject}` }
            ], container)
        }
        if (hashObject.app) {
            createBtn([
                { text: 'to->应用主页', toUrl: `${mainPageUrl}/${hashObject.app}` }
            ], container)
        }
    }

    function createBtn(btns, container) {
        btns.forEach(btn => {
            const button = document.createElement("button");
            button.textContent = btn.text;
            button.className = "y-panel-btn";
            button.onclick = () => {
                window.open(btn.toUrl)
            };
            if(btn.title) {
                button.title = btn.title
            }
            container.appendChild(button);
        })
    }

    (function init() {
        const initial_btn_map = getBtnMap(stored_name_map)
        register(initial_btn_map)
    })()

})();