master

分支 (1)

管理

管理

master

portal3.0_doc
/
ropdoc.html

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>鹏燊科技接口文档</title>
    <style>
        body {
            display: flex;
            font-family: Arial, sans-serif;
        }
        #sidebar {
            width: 250px;
            border-right: 1px solid #ccc;
            padding: 10px;
            overflow-y: auto;
            height: 100vh;
        }
        #content {
            padding: 20px;
            flex-grow: 1;
        }
        .api-item {
            cursor: pointer;
            padding: 5px;
            margin: 5px 0;
            border-radius: 4px;
        }
        .api-item:hover {
            background-color: #f0f0f0;
        }
        input[type="text"],
        select {
            width: 100%;
            padding: 8px;
            box-sizing: border-box;
            margin-bottom: 10px;
        }
        select {
            border-radius: 5px;
        }
        h2 {
            margin: 0;
        }
    </style>
</head>
<body>

<div id="sidebar">
    <select id="api-selector">
        <option value="edu-user">edu-user接口</option>
        <option value="edu-rpa">RPA 接口</option>
    </select>
    <input type="text" id="search-box" placeholder="搜索接口..." />
    <div id="api-list"></div>
</div>
<div id="content">
    <h2>接口详情</h2>
    <div id="api-details"></div>
</div>

<script>
    // 请求接口数据
    async function fetchApiData(apiType) {
		var apiUrl = 'https://test.pengshencloud.com/birui/userapi/api/data';
		if (apiType === 'edu-user'){
		apiUrl = 'https://test.pengshencloud.com/birui/userapi/api/data';
		}
		if (apiType === 'edu-rpa'){
		apiUrl = 'https://test.pengshencloud.com/birui/rpaapi/api/data';
		}
		if (apiType === 'edu-rpa'){
		apiUrl = 'https://test.pengshencloud.com/birui/rpaapi/api/data';
		}

        try {
            const response = await fetch(apiUrl);
            const data = await response.json();
            return data;
        } catch (error) {
            console.error('Error fetching API data:', error);
        }
    }

    // 渲染左侧目录
    function renderApiList(apiData) {
        const apiList = document.getElementById('api-list');
        apiList.innerHTML = ''; // 清空之前的内容

        apiData.apiGroupList.forEach(group => {
            const groupDiv = document.createElement('div');
            groupDiv.innerHTML = `<strong>${group.controllerName}</strong>`;
            apiList.appendChild(groupDiv);

            group.groupItemList.forEach(item => {
                const apiDiv = document.createElement('div');
                apiDiv.className = 'api-item';
                apiDiv.innerText = item.apiName;
                apiDiv.onclick = () => renderApiDetails(item);
                apiList.appendChild(apiDiv);
            });
        });
    }

    // 渲染接口详细信息
    function renderApiDetails(api) {
        const apiDetails = document.getElementById('api-details');
        apiDetails.innerHTML = `
            <h3>${api.apiName} (${api.method}:${api.version})</h3>
            <p><strong>描述:</strong> ${api.apiDesc}</p>
            <h4>参数:</h4>
            <ul>
                ${api.paramList.map(param => `
                    <li><strong>${param.field} ${param.name} (${param.type})</strong>: ${param.mock}${param.notnull ? ' (必填)' : ''}</li>
                `).join('')}
            </ul>
            <h4>响应:</h4>
            <pre>${JSON.stringify(api.response, null, 2)}</pre>
        `;
    }

    // 搜索功能
    function filterApiList(apiData) {
        const searchBox = document.getElementById('search-box');
        searchBox.addEventListener('input', () => {
            const searchValue = searchBox.value.toLowerCase();
            const apiList = document.getElementById('api-list');
            apiList.innerHTML = ''; // 清空之前的内容

            apiData.apiGroupList.forEach(group => {
                const groupDiv = document.createElement('div');
                groupDiv.innerHTML = `<strong>${group.controllerName}</strong>`;
                apiList.appendChild(groupDiv);

                group.groupItemList.forEach(item => {
                    if (item.apiName.toLowerCase().includes(searchValue)) {
                        const apiDiv = document.createElement('div');
                        apiDiv.className = 'api-item';
                        apiDiv.innerText = item.apiName;
                        apiDiv.onclick = () => renderApiDetails(item);
                        apiList.appendChild(apiDiv);
                    }
                });
            });
        });
    }

    // 监听下拉列表变化
    function addApiTypeChangeHandler(apiData) {
        const apiSelector = document.getElementById('api-selector');
        apiSelector.addEventListener('change', async () => {
            const apiType = apiSelector.value;
            const newApiData = await fetchApiData(apiType);
            renderApiList(newApiData);
            filterApiList(newApiData);
        });
    }

    // 初始化
    async function init() {
        const initialApiType = 'edu-user'; // 默认选择 User 接口
        const apiData = await fetchApiData(initialApiType);
        renderApiList(apiData);
        filterApiList(apiData);
        addApiTypeChangeHandler(apiData);
    }

    init();
</script>
</body>
</html>