Raw Source Toggle Dropdown

• Minified Source

zhangqiang66 / 聚合引擎快照解析

// ==UserScript==
// @name         聚合引擎快照解析
// @namespace    http://tampermonkey.net/
// @version      2024-12-10
// @description  try to take over the world!
// @author       You
// @match https://*.sankuai.com/client/internal/deploy-record/Page*
// @run-at document-body
// @icon         https://www.google.com/s2/favicons?sz=64&domain=sankuai.com
// @grant        none
// @license      MIT
// ==/UserScript==

(function () {
    // 更新 https://openuserjs.org/scripts/zhangqiang66/%E8%81%9A%E5%90%88%E5%BC%95%E6%93%8E%E5%BF%AB%E7%85%A7%E8%A7%A3%E6%9E%90
    'use strict';
    // 创建一个按钮元素
    const createElement = () => {
        const div = document.createElement('div');
        const button = document.createElement('button');
        const textarea = document.createElement('textarea');
        // 设置按钮的样式
        button.textContent = '进行快照解析';
        button.style.display = 'block';
        button.style.width = '100px';
        button.style.height = '50px';
        button.style.backgroundColor = '#4CAF50';
        button.style.color = 'white';
        button.style.border = 'none';
        button.style.borderRadius = '5px';
        // 输入框样式
        textarea.style.width = '400px';
        textarea.style.height = '100px';
        textarea.style.border = '1px solid black';
        div.style.position = 'fixed';
        div.style.top = '10px';
        div.style.right = '10px';
        div.style.zIndex = 9999;
        div.style.padding = '10px';

        div.appendChild(button);
        div.appendChild(textarea);

        // 将按钮添加到页面上
        document.body.appendChild(div);

        // 添加按钮点击事件
        button.addEventListener('click', parseSnapshot);
    };

    // 定义解析快照的函数
    const parseSnapshot = () => {
        const inputValue = document.querySelector('textarea').value;
        try {
            const obj = JSON.parse(inputValue);
            if (!Array.isArray(obj?.executableRules)) {
                throw new Error('快照找不到合法的可执行分组');
            }
            obj.executableRules = obj.executableRules.map((r, index) => {
                return { index, ruleName: r.ruleName, conditionExpression: r.conditionExpression, action: r.actions?.[0].actionAttrsExpression }
            });
            // console.log(23333, obj.executableRules);
            // console.table(obj.executableRules, ['ruleName', 'conditionExpression', 'action']);
            createTable(obj.executableRules);
        } catch (err) {
            alert(err.message);
            return;
        }
    };


    // 创建表格
    const createTable = (dataArray) => {
        console.table(dataArray);
        // 创建浮动容器
        const container = document.createElement('div');
        container.style.position = 'fixed';
        container.style.top = '20px';
        container.style.left = '60px';
        container.style.maxWidth = '70vw';
        container.style.backgroundColor = 'white';
        container.style.border = '1px solid #ccc';
        container.style.boxShadow = '0 0 10px rgba(0,0,0,0.5)';
        container.style.zIndex = '1000';
        container.style.padding = '10px';
        container.style.maxHeight = '80vh';
        container.style.overflowY = 'auto';

        // 创建关闭按钮
        const closeButton = document.createElement('button');
        closeButton.textContent = '关闭表格';
        closeButton.style.marginBottom = '10px';
        closeButton.style.padding = '5px 10px';
        closeButton.style.cursor = 'pointer';
        closeButton.style.position = 'fixed';
        closeButton.style.zIndex = 9999;
        closeButton.style.top = '0';
        closeButton.style.left = '0';
        closeButton.style.background = 'red';
        closeButton.style.color = 'white';
        closeButton.style.border = 'none';
        closeButton.style.display = 'block';

        closeButton.onclick = function() {
            document.body.removeChild(container);
            document.querySelector('#app').removeChild(closeButton);
        };
        // 创建表格元素
        const table = document.createElement('table');
        table.style.borderCollapse = 'collapse';
        table.style.width = '100%';

        // 创建表头
        const headerRow = document.createElement('tr');
        const headers = ['序号', '分组名称', '规则表达式', '配置内容'];
        headers.forEach(headerText => {
            const th = document.createElement('th');
            th.textContent = headerText;
            th.style.border = '1px solid #ddd';
            th.style.padding = '4px';
            th.style.backgroundColor = '#f2f2f2';
            headerRow.appendChild(th);
        });
        table.appendChild(headerRow);

        // 创建表格内容
        dataArray.forEach(item => {
            const row = document.createElement('tr');
            Object.values(item).forEach(text => {
                const td = document.createElement('td');
                td.textContent = text;
                td.style.border = '1px solid #ddd';
                td.style.padding = '8px';
                row.appendChild(td);
            });
            table.appendChild(row);
        });

        // 将表格添加到容器中
        container.appendChild(table);

        // 将容器插入到页面中
        document.querySelector('#app').appendChild(closeButton);
        document.body.appendChild(container);

    };


    createElement();
})();