first commit
This commit is contained in:
4
Xboard/theme/.gitignore
vendored
Normal file
4
Xboard/theme/.gitignore
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
/*
|
||||
!v2board
|
||||
!Xboard
|
||||
!.gitignore
|
||||
1
Xboard/theme/Xboard/assets/images/background.svg
Normal file
1
Xboard/theme/Xboard/assets/images/background.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg height="200" width="200" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="translate(10 8)"><circle cx="176" cy="12" r="4" stroke="#ddd" stroke-width="1.25"/><path d="M20.5.5l23 11m-29 84l-3.79 10.377M27.037 131.4l5.898 2.203-3.46 5.947 6.072 2.392-3.933 5.758m128.733 35.37l.693-9.316 10.292.052.416-9.222 9.274.332M.5 48.5s6.131 6.413 6.847 14.805c.715 8.393-2.52 14.806-2.52 14.806M124.555 90s-7.444 0-13.67 6.192c-6.227 6.192-4.838 12.012-4.838 12.012m2.24 68.626s-4.026-9.025-18.145-9.025-18.145 5.7-18.145 5.7" stroke="#ddd" stroke-linecap="round" stroke-width="1.25"/><path d="M85.716 36.146l5.243-9.521h11.093l5.416 9.521-5.41 9.185H90.953zm63.909 15.479h10.75v10.75h-10.75z" stroke="#ddd" stroke-width="1.25"/><g fill="#ddd"><circle cx="71.5" cy="7.5" r="1.5"/><circle cx="170.5" cy="95.5" r="1.5"/><circle cx="81.5" cy="134.5" r="1.5"/><circle cx="13.5" cy="23.5" r="1.5"/><path d="M93 71h3v3h-3zm33 84h3v3h-3zm-85 18h3v3h-3z"/></g><path d="M39.384 51.122l5.758-4.454 6.453 4.205-2.294 7.363h-7.79zM130.195 4.03l13.83 5.062-10.09 7.048zm-83 95l14.83 5.429-10.82 7.557-4.01-12.987zM5.213 161.495l11.328 20.897L2.265 180z" stroke="#ddd" stroke-width="1.25"/><path d="M149.05 127.468s-.51 2.183.995 3.366c1.56 1.226 8.642-1.895 3.967-7.785-2.367-2.477-6.5-3.226-9.33 0-5.208 5.936 0 17.51 11.61 13.73 12.458-6.257 5.633-21.656-5.073-22.654-6.602-.606-14.043 1.756-16.157 10.268-1.718 6.92 1.584 17.387 12.45 20.476 10.866 3.09 19.331-4.31 19.331-4.31" stroke="#ddd" stroke-linecap="round" stroke-width="1.25"/></g></svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
2
Xboard/theme/Xboard/assets/umi.js
vendored
Normal file
2
Xboard/theme/Xboard/assets/umi.js
vendored
Normal file
File diff suppressed because one or more lines are too long
33
Xboard/theme/Xboard/config.json
Normal file
33
Xboard/theme/Xboard/config.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "Xboard",
|
||||
"description": "Xboard",
|
||||
"version": "1.0.0",
|
||||
"images": "",
|
||||
"configs": [
|
||||
{
|
||||
"label": "主题色",
|
||||
"placeholder": "请选择主题颜色",
|
||||
"field_name": "theme_color",
|
||||
"field_type": "select",
|
||||
"select_options": {
|
||||
"default": "默认(绿色)",
|
||||
"blue": "蓝色",
|
||||
"black": "黑色",
|
||||
"darkblue": "暗蓝色"
|
||||
},
|
||||
"default_value": "default"
|
||||
},
|
||||
{
|
||||
"label": "背景",
|
||||
"placeholder": "请输入背景图片URL",
|
||||
"field_name": "background_url",
|
||||
"field_type": "input"
|
||||
},
|
||||
{
|
||||
"label": "自定义页脚HTML",
|
||||
"placeholder": "可以实现客服JS代码的加入等",
|
||||
"field_name": "custom_html",
|
||||
"field_type": "textarea"
|
||||
}
|
||||
]
|
||||
}
|
||||
264
Xboard/theme/Xboard/dashboard.blade.php
Normal file
264
Xboard/theme/Xboard/dashboard.blade.php
Normal file
@@ -0,0 +1,264 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
|
||||
<title>{{$title}}</title>
|
||||
<script type="module" crossorigin src="/theme/{{$theme}}/assets/umi.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<script>
|
||||
window.routerBase = "/";
|
||||
window.settings = {
|
||||
title: '{{$title}}',
|
||||
assets_path: '/theme/{{$theme}}/assets',
|
||||
theme: {
|
||||
color: '{{ $theme_config['theme_color'] ?? "default" }}',
|
||||
},
|
||||
version: '{{$version}}',
|
||||
background_url: '{{$theme_config['background_url']}}',
|
||||
description: '{{$description}}',
|
||||
i18n: [
|
||||
'zh-CN',
|
||||
'en-US',
|
||||
'ja-JP',
|
||||
'vi-VN',
|
||||
'ko-KR',
|
||||
'zh-TW',
|
||||
'fa-IR'
|
||||
],
|
||||
logo: '{{$logo}}'
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.xboard-online-devices-trigger {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-left: 12px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 999px;
|
||||
background: rgba(24, 160, 88, 0.12);
|
||||
color: #176b3d;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.xboard-online-devices-trigger strong {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.xboard-online-devices-menu {
|
||||
padding: 10px 14px 12px;
|
||||
margin: 6px 8px 0;
|
||||
border-radius: 12px;
|
||||
background: rgba(24, 160, 88, 0.08);
|
||||
color: #1f2937;
|
||||
}
|
||||
|
||||
.xboard-online-devices-menu-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #176b3d;
|
||||
}
|
||||
|
||||
.xboard-online-devices-menu-list {
|
||||
margin-top: 8px;
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.xboard-online-devices-menu-item {
|
||||
font-size: 12px;
|
||||
color: #4b5563;
|
||||
word-break: break-all;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.xboard-online-devices-menu-empty {
|
||||
margin-top: 8px;
|
||||
font-size: 12px;
|
||||
color: #6b7280;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
<div id="app"></div>
|
||||
<script>
|
||||
(function () {
|
||||
const STORAGE_KEYS = ['access_token', 'AccessToken', 'ACCESS_TOKEN'];
|
||||
const SUMMARY_ENDPOINT = '/api/v1/user-online-devices/summary';
|
||||
const STATE = {
|
||||
loaded: false,
|
||||
loading: false,
|
||||
enabled: false,
|
||||
data: null
|
||||
};
|
||||
|
||||
function readTokenFromStorage(storage) {
|
||||
if (!storage) return '';
|
||||
for (const key of STORAGE_KEYS) {
|
||||
const value = storage.getItem(key);
|
||||
if (value) return value.replace(/^"|"$/g, '');
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
function getAccessToken() {
|
||||
return readTokenFromStorage(window.localStorage) || readTokenFromStorage(window.sessionStorage);
|
||||
}
|
||||
|
||||
function getAuthHeader() {
|
||||
const token = getAccessToken();
|
||||
if (!token) return '';
|
||||
return token.startsWith('Bearer ') ? token : 'Bearer ' + token;
|
||||
}
|
||||
|
||||
async function loadSummary() {
|
||||
if (STATE.loading || STATE.loaded) return;
|
||||
const authorization = getAuthHeader();
|
||||
if (!authorization) return;
|
||||
|
||||
STATE.loading = true;
|
||||
|
||||
try {
|
||||
const response = await fetch(SUMMARY_ENDPOINT, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Authorization': authorization
|
||||
},
|
||||
credentials: 'same-origin'
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
STATE.enabled = false;
|
||||
return;
|
||||
}
|
||||
|
||||
const result = await response.json();
|
||||
if (result && result.data) {
|
||||
STATE.data = result.data;
|
||||
STATE.enabled = true;
|
||||
STATE.loaded = true;
|
||||
injectIntoAvatarArea();
|
||||
injectIntoDropdowns();
|
||||
}
|
||||
} catch (error) {
|
||||
STATE.enabled = false;
|
||||
} finally {
|
||||
STATE.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
function buildTriggerHtml() {
|
||||
const count = STATE.data?.user?.online_count ?? 0;
|
||||
return '<span>在线 IP</span><strong>' + count + '</strong>';
|
||||
}
|
||||
|
||||
function buildMenuNode() {
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.className = 'xboard-online-devices-menu';
|
||||
wrapper.setAttribute('data-user-online-devices-menu', '1');
|
||||
|
||||
const devices = Array.isArray(STATE.data?.online_devices) ? STATE.data.online_devices : [];
|
||||
const title = document.createElement('div');
|
||||
title.className = 'xboard-online-devices-menu-title';
|
||||
title.innerHTML = '<span>在线 IP / 设备</span><span>' + (STATE.data?.user?.online_count ?? 0) + '</span>';
|
||||
wrapper.appendChild(title);
|
||||
|
||||
if (!devices.length) {
|
||||
const empty = document.createElement('div');
|
||||
empty.className = 'xboard-online-devices-menu-empty';
|
||||
empty.textContent = '当前没有检测到在线 IP。';
|
||||
wrapper.appendChild(empty);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
const list = document.createElement('div');
|
||||
list.className = 'xboard-online-devices-menu-list';
|
||||
|
||||
devices.forEach(function (device) {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'xboard-online-devices-menu-item';
|
||||
item.textContent = device.name + ': ' + device.ip;
|
||||
list.appendChild(item);
|
||||
});
|
||||
|
||||
wrapper.appendChild(list);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
function injectIntoAvatarArea() {
|
||||
if (!STATE.enabled || !STATE.data) return;
|
||||
if (document.querySelector('[data-user-online-devices-trigger="1"]')) {
|
||||
const current = document.querySelector('[data-user-online-devices-trigger="1"]');
|
||||
current.innerHTML = buildTriggerHtml();
|
||||
return;
|
||||
}
|
||||
|
||||
const avatar = document.querySelector('.n-avatar');
|
||||
if (!avatar) return;
|
||||
|
||||
const anchor = avatar.closest('button, .n-button, .n-space, .n-flex, div');
|
||||
if (!anchor || !anchor.parentElement) return;
|
||||
|
||||
const badge = document.createElement('span');
|
||||
badge.className = 'xboard-online-devices-trigger';
|
||||
badge.setAttribute('data-user-online-devices-trigger', '1');
|
||||
badge.innerHTML = buildTriggerHtml();
|
||||
anchor.parentElement.insertBefore(badge, anchor.nextSibling);
|
||||
}
|
||||
|
||||
function injectIntoDropdowns() {
|
||||
if (!STATE.enabled || !STATE.data) return;
|
||||
|
||||
const dropdowns = document.querySelectorAll('.n-dropdown-menu');
|
||||
dropdowns.forEach(function (dropdown) {
|
||||
if (dropdown.querySelector('[data-user-online-devices-menu="1"]')) return;
|
||||
|
||||
const menuNode = buildMenuNode();
|
||||
const host = document.createElement('div');
|
||||
host.className = 'n-dropdown-option';
|
||||
host.appendChild(menuNode);
|
||||
dropdown.appendChild(host);
|
||||
});
|
||||
}
|
||||
|
||||
const observer = new MutationObserver(function () {
|
||||
injectIntoAvatarArea();
|
||||
injectIntoDropdowns();
|
||||
});
|
||||
|
||||
observer.observe(document.documentElement, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
|
||||
document.addEventListener('click', function () {
|
||||
loadSummary();
|
||||
window.setTimeout(function () {
|
||||
injectIntoAvatarArea();
|
||||
injectIntoDropdowns();
|
||||
}, 120);
|
||||
}, true);
|
||||
|
||||
window.setTimeout(loadSummary, 1200);
|
||||
window.setInterval(function () {
|
||||
STATE.loaded = false;
|
||||
loadSummary();
|
||||
}, 30000);
|
||||
})();
|
||||
</script>
|
||||
{!! $theme_config['custom_html'] !!}
|
||||
</body>
|
||||
|
||||
</html>
|
||||
19
Xboard/theme/Xboard/env.example.js
vendored
Normal file
19
Xboard/theme/Xboard/env.example.js
vendored
Normal file
@@ -0,0 +1,19 @@
|
||||
// API地址
|
||||
window.routerBase = 'http://127.0.0.1:8000/'
|
||||
window.settings = {
|
||||
// 站点名称
|
||||
title: 'Xboard',
|
||||
// 站点描述
|
||||
description: 'Xboard',
|
||||
assets_path: '/assets',
|
||||
// 主题色
|
||||
theme: {
|
||||
color: 'default', //可选default、blue、black、、darkblue
|
||||
},
|
||||
// 版本号
|
||||
version: '0.1.1-dev',
|
||||
// 登陆背景
|
||||
background_url: '',
|
||||
// 站点LOGO
|
||||
logo: '',
|
||||
}
|
||||
18
Xboard/theme/Xboard/env.js
vendored
Normal file
18
Xboard/theme/Xboard/env.js
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
window.routerBase = 'http://127.0.0.1:8000/'
|
||||
window.settings = {
|
||||
// 站点名称
|
||||
title: 'Xboard',
|
||||
// 主题色
|
||||
theme: {
|
||||
color: 'anyway', //可选default、blue、black、、darkblue
|
||||
},
|
||||
// 站点描述
|
||||
description: 'Xboard',
|
||||
assets_path: '/assets',
|
||||
// 版本号
|
||||
version: '0.1.1-dev',
|
||||
// 登陆背景
|
||||
background_url: '',
|
||||
// 站点LOGO
|
||||
logo: '',
|
||||
}
|
||||
1
Xboard/theme/Xboard/index.html
Normal file
1
Xboard/theme/Xboard/index.html
Normal file
@@ -0,0 +1 @@
|
||||
<!doctype html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"><title>Xboard</title><script type="module" crossorigin src="/assets/umi.js"></script></head><body><script src="./env.js"></script><div id="app"></div></body></html>
|
||||
Reference in New Issue
Block a user