mirror of
https://github.com/woodchen-ink/openai-billing-query.git
synced 2025-07-18 05:51:59 +08:00
update
This commit is contained in:
parent
08b6a4186b
commit
918213a64e
24
index.html
24
index.html
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="mdui-theme-light">
|
||||
<html class="mdui-theme-light" lang="zh-cmn-Hans">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
@ -7,14 +7,14 @@
|
||||
<title>OpenAI API 信息查询</title>
|
||||
<meta name="description" content="批量快速查询OPENAI的余额，支持可视化展现已用比例、额度、已用量、未用量、是否GPT-4、是否GPT4-32K、是否绑卡、绑卡信息、组织信息、是否有效">
|
||||
<link rel="stylesheet" href="./static/css-1.css" type="text/css" />
|
||||
<link rel="stylesheet" href="https://unpkg.com/mdui@2.0.1/mdui.css">
|
||||
<script src="https://unpkg.com/mdui@2.0.1/mdui.global.js"></script>
|
||||
<script src="https://unpkg.com/mdui@2.0.1/functions/setColorScheme.js"></script>
|
||||
<link rel="stylesheet" href="./static/mdui/mdui.css">
|
||||
<script src="./static/mdui/mdui.global.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<mdui-layout class="mdui-prose">
|
||||
<mdui-layout >
|
||||
<mdui-layout-main>
|
||||
<div class="mdui-main-container">
|
||||
<h2>查询结果</h2>
|
||||
<div class="mdui-table">
|
||||
<table id="result-table">
|
||||
@ -40,6 +40,7 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</mdui-layout-main>
|
||||
|
||||
<mdui-top-app-bar>
|
||||
@ -48,7 +49,7 @@
|
||||
</mdui-top-app-bar>
|
||||
|
||||
<mdui-navigation-drawer open class="left-drawer" close-on-overlay-click >
|
||||
<div style="width:92%;margin:0 auto;">
|
||||
<div class="left-drawer-main">
|
||||
<h3>输入 API KEY</h3>
|
||||
<p>本站不保存 KEY 信息，查询后请自行保存</p>
|
||||
<mdui-text-field id="api-key-input" placeholder="请输入 API-KEY或sessID，多个可直接粘贴" rows="8"
|
||||
@ -57,12 +58,11 @@
|
||||
<mdui-select id="api-url-select" icon="airline_stops" label="查询线路" value="https://api.openai.com"
|
||||
onchange="toggleCustomUrlInput()">
|
||||
<mdui-menu-item value="https://api.openai.com">[官网线路]api.openai.com</mdui-menu-item>
|
||||
<mdui-menu-item value="https://oapi.czl.net">[CZLoapi线路] oapi.czl.net</mdui-menu-item>
|
||||
<mdui-menu-item value="https://oapi.czl.net">[CZLoapi线路]oapi.czl.net</mdui-menu-item>
|
||||
<mdui-menu-item
|
||||
value="https://gateway.ai.cloudflare.com/v1/feedd0aa8abd6875052d86a94f1baf83/test/openai">[Cloudflare网关]
|
||||
查不了已用量</mdui-menu-item>
|
||||
<mdui-menu-item value="https://openai.996.lat">[群友提供公益CF反代] openai.996.lat</mdui-menu-item>
|
||||
<mdui-menu-item value="custom">[已前置https] 自定义</mdui-menu-item>
|
||||
value="https://gateway.ai.cloudflare.com/v1/feedd0aa8abd6875052d86a94f1baf83/test/openai">[Cloudflare网关]查不了已用量</mdui-menu-item>
|
||||
<mdui-menu-item value="https://openai.996.lat">[群友CF反代]openai.996.lat</mdui-menu-item>
|
||||
<mdui-menu-item value="custom">[已前置https]自定义</mdui-menu-item>
|
||||
</mdui-select>
|
||||
|
||||
<mdui-text-field type="text" id="custom-url-input" placeholder="输入自定义API，填域名即可，无需https://"
|
||||
@ -83,6 +83,8 @@
|
||||
<mdui-button full-width id="query-button" icon="search" onclick="sendRequest()">
|
||||
查询
|
||||
</mdui-button>
|
||||
|
||||
<!-- 下半部分 -->
|
||||
<h4>页面列表</h4>
|
||||
<mdui-menu dense style="width:100%;margin-top:20px;">
|
||||
<mdui-menu-item icon="search" href="index.html">查API信息</mdui-menu-item>
|
||||
|
||||
@ -4,19 +4,24 @@
|
||||
--mdui-color-primary-dark: 208, 188, 255;
|
||||
}
|
||||
mdui-top-app-bar {
|
||||
background-color: rgba(var(--mdui-color-primary), 0.2);
|
||||
background-color: rgba(var(--mdui-color-primary), 0.8);
|
||||
}
|
||||
|
||||
mdui-button {
|
||||
border-radius: var(--mdui-shape-corner-small);
|
||||
}
|
||||
|
||||
mdui-navigation-drawer {
|
||||
padding-top: 20px;
|
||||
.left-drawer-main{
|
||||
padding:20px 10px 0 10px;
|
||||
/* background-color: rgba(var(--mdui-color-primary), 0.1); */
|
||||
height:calc(100vh - 84px);
|
||||
}
|
||||
.mdui-main-container{
|
||||
width:96%;
|
||||
padding:20px auto 0 auto;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
height: 100VH;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
@ -34,6 +39,8 @@ a {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
src: url(/static/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2);
|
||||
|
||||
91
static/js.js
91
static/js.js
@ -1,3 +1,5 @@
|
||||
|
||||
mdui.setColorScheme('#006874');
|
||||
function toggleProgressBar() {
|
||||
let progressBarHeader = document.getElementById("progressbar-header");
|
||||
let progressBarCells = document.querySelectorAll("td.progressbar");
|
||||
@ -272,7 +274,6 @@ async function checkBilling(apiKey, apiUrl) {
|
||||
|
||||
//查询函数
|
||||
function sendRequest() {
|
||||
showLoadingAnimation();
|
||||
toggleProgressBar();
|
||||
toggleSubInfo();
|
||||
toggleSetidInfo();
|
||||
@ -284,7 +285,11 @@ function sendRequest() {
|
||||
table.style.visibility = "visible";
|
||||
|
||||
if (apiKeyInput.value.trim() === "") {
|
||||
alert("请填写API KEY");
|
||||
mdui.alert({
|
||||
headline: "未匹配到 API-KEY",
|
||||
description: "请检查输入内容",
|
||||
confirmText: "OK",
|
||||
})
|
||||
return;
|
||||
}
|
||||
|
||||
@ -293,7 +298,11 @@ function sendRequest() {
|
||||
let apiUrl = "";
|
||||
if (apiUrlSelect.value === "custom") {
|
||||
if (customUrlInput.value.trim() === "") {
|
||||
alert("请设置API链接");
|
||||
mdui.alert({
|
||||
headline: "无查询线路",
|
||||
description: "请选择或自定义",
|
||||
confirmText: "OK",
|
||||
})
|
||||
return;
|
||||
} else {
|
||||
apiUrl = customUrlInput.value.trim();
|
||||
@ -313,11 +322,15 @@ function sendRequest() {
|
||||
|
||||
let apiKeys = parseKeys(apiKeyInput.value);
|
||||
|
||||
if (apiKeys.length === 0) {
|
||||
alert("未匹配到 API-KEY，请检查输入内容");
|
||||
return;
|
||||
}
|
||||
alert("成功匹配到 API Key，确认后开始查询：" + apiKeys);
|
||||
mdui.alert({
|
||||
headline: "成功匹配到 API Key",
|
||||
description: apiKeys,
|
||||
confirmText: "OK",
|
||||
});
|
||||
|
||||
|
||||
|
||||
showLoadingAnimation();
|
||||
|
||||
function parseKeys(input) {
|
||||
let lines = input.split(/\n/);
|
||||
@ -361,36 +374,23 @@ function sendRequest() {
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
let row = document.createElement("tr");
|
||||
row.classList.add("bg-gray-600");
|
||||
row.classList.add("bg-opacity-60");
|
||||
row.classList.add("border");
|
||||
row.classList.add("border-slate-500");
|
||||
|
||||
let serialNumberCell = document.createElement("td"); // 创建序列号单元格
|
||||
serialNumberCell.classList.add("border");
|
||||
serialNumberCell.classList.add("border-slate-500");
|
||||
serialNumberCell.textContent = serialNumber;
|
||||
row.appendChild(serialNumberCell);
|
||||
|
||||
let apiKeyCell = document.createElement("td");
|
||||
apiKeyCell.classList.add("border");
|
||||
apiKeyCell.classList.add("border-slate-500");
|
||||
apiKeyCell.textContent = apiKey.replace(/^(.{5}).*(.{4})$/, "$1***$2");
|
||||
row.appendChild(apiKeyCell);
|
||||
|
||||
console.log('查看查询结果', data); // 添加 console.log 以查看 data 的值
|
||||
|
||||
let totalAmount = document.createElement("td");
|
||||
totalAmount.classList.add("border");
|
||||
totalAmount.classList.add("border-slate-500");
|
||||
totalAmount.textContent = typeof data[0] === "number" ? data[0] : "无值";
|
||||
row.appendChild(totalAmount);
|
||||
|
||||
let totalUsedCell = document.createElement("td");
|
||||
totalUsedCell.classList.add("border");
|
||||
totalUsedCell.classList.add("border-slate-500");
|
||||
typeof data[1] === "number" ? data[1].toFixed(3) : '无值';
|
||||
if(isNaN(data[1])){
|
||||
totalUsedCell.textContent = "无值";
|
||||
@ -400,8 +400,6 @@ function sendRequest() {
|
||||
row.appendChild(totalUsedCell);
|
||||
|
||||
let totalAvailableCell = document.createElement("td");
|
||||
totalAvailableCell.classList.add("border");
|
||||
totalAvailableCell.classList.add("border-slate-500");
|
||||
if(isNaN(data[2])){
|
||||
totalAvailableCell.textContent = "无值";
|
||||
}else{
|
||||
@ -412,8 +410,6 @@ function sendRequest() {
|
||||
// 进度条
|
||||
let progressCell = document.createElement("td");
|
||||
progressCell.classList.add("progressbar");
|
||||
progressCell.classList.add("border");
|
||||
progressCell.classList.add("border-slate-500");
|
||||
let progressContainer = document.createElement("div"); // 添加一个新的容器元素
|
||||
progressContainer.style.width = "100%";
|
||||
progressContainer.style.height = "20px";
|
||||
@ -435,8 +431,6 @@ function sendRequest() {
|
||||
|
||||
// 到期时间
|
||||
let expireTime = document.createElement("td");
|
||||
expireTime.classList.add("border");
|
||||
expireTime.classList.add("border-slate-500");
|
||||
if (data[3] === "1970-01-01") {
|
||||
expireTime.textContent = "永久有效";
|
||||
}else if(data[3] === "NaN-NaN-NaN"){
|
||||
@ -454,8 +448,6 @@ function sendRequest() {
|
||||
let GPT432kCheckResult = document.createElement("td");
|
||||
GPT432kCheckResult.textContent = data[6];
|
||||
let highestModel = document.createElement("td");
|
||||
highestModel.classList.add("border");
|
||||
highestModel.classList.add("border-slate-500");
|
||||
if (GPT35CheckResult.textContent === "✅" && GPT4CheckResult.textContent === "❌" && GPT432kCheckResult.textContent === "❌") {
|
||||
highestModel.textContent = "gpt3.5";
|
||||
} else if (GPT35CheckResult.textContent === "✅" && GPT4CheckResult.textContent === "✅" && GPT432kCheckResult.textContent === "❌") {
|
||||
@ -469,8 +461,6 @@ function sendRequest() {
|
||||
row.appendChild(highestModel);
|
||||
|
||||
let isSubscribe = document.createElement("td");
|
||||
isSubscribe.classList.add("border");
|
||||
isSubscribe.classList.add("border-slate-500");
|
||||
isSubscribe.style.whiteSpace = "pre"; // 添加这一行来保留换行
|
||||
isSubscribe.textContent = data[7];
|
||||
if (data[7] === "Not Found.") {
|
||||
@ -482,8 +472,6 @@ function sendRequest() {
|
||||
row.appendChild(isSubscribe);
|
||||
|
||||
let SubInformation = document.createElement("td");
|
||||
SubInformation.classList.add("border-slate-500");
|
||||
SubInformation.classList.add("border");
|
||||
SubInformation.classList.add("subinfo");
|
||||
let SubInformationContainer = document.createElement("div");
|
||||
SubInformationContainer.style.whiteSpace = "pre-wrap";
|
||||
@ -495,8 +483,6 @@ function sendRequest() {
|
||||
|
||||
|
||||
let setidCell = document.createElement("td");
|
||||
setidCell.classList.add("border");
|
||||
setidCell.classList.add("border-slate-500");
|
||||
setidCell.classList.add("setid");
|
||||
let setidCellContainer = document.createElement("div");
|
||||
setidCellContainer.style.whiteSpace = "pre-wrap";
|
||||
@ -507,8 +493,6 @@ function sendRequest() {
|
||||
|
||||
|
||||
let rateLimitsDataCell = document.createElement("td");
|
||||
rateLimitsDataCell.classList.add("border");
|
||||
rateLimitsDataCell.classList.add("border-slate-500");
|
||||
let rateLimitsDataContainer = document.createElement("div");
|
||||
rateLimitsDataContainer.style.whiteSpace = "pre-wrap";
|
||||
if (data[13]) {
|
||||
@ -541,8 +525,6 @@ function sendRequest() {
|
||||
|
||||
// 是否有效列
|
||||
let completionCheckResultCell = document.createElement("td");
|
||||
completionCheckResultCell.classList.add("border");
|
||||
completionCheckResultCell.classList.add("border-slate-500");
|
||||
completionCheckResultCell.innerHTML = `<span style="font-size:24px">${data[12][0]}</span><br>消耗${data[12][1]} tokens`; // 使用 innerHTML 添加两行内容
|
||||
row.appendChild(completionCheckResultCell);
|
||||
|
||||
@ -556,8 +538,6 @@ function sendRequest() {
|
||||
serialNumber++; // 增加序列号
|
||||
table.style.display = 'table';
|
||||
|
||||
hideLoadingAnimation();
|
||||
|
||||
})
|
||||
lastQueryPromise = checkBilling(apiKey, apiUrl).then((data) => {
|
||||
// 查询完成后的代码...
|
||||
@ -587,18 +567,33 @@ function toggleCustomUrlInput() {
|
||||
|
||||
function showLoadingAnimation() {
|
||||
const button = document.getElementById("query-button");
|
||||
button.disabled = true;
|
||||
button.innerHTML = `
|
||||
<span class="loading loading-ring "></span>
|
||||
`;
|
||||
|
||||
// 创建一个新的 <mdui-linear-progress> 元素
|
||||
const progressElement = document.createElement("mdui-linear-progress");
|
||||
progressElement.id = "query-progress";
|
||||
|
||||
// 将新元素替代原始按钮元素
|
||||
button.parentElement.replaceChild(progressElement, button);
|
||||
}
|
||||
|
||||
function hideLoadingAnimation() {
|
||||
const button = document.getElementById("query-button");
|
||||
button.disabled = false;
|
||||
button.innerHTML = "查询";
|
||||
const progressElement = document.querySelector("mdui-linear-progress");
|
||||
|
||||
if (progressElement) {
|
||||
const button = document.createElement("mdui-button");
|
||||
button.id = "query-button";
|
||||
button.innerHTML = "查询";
|
||||
button.setAttribute("full-width", "");
|
||||
button.setAttribute("icon", "search");
|
||||
button.setAttribute("onclick", "sendRequest()");
|
||||
|
||||
// 将原始按钮元素替代回来
|
||||
progressElement.parentElement.replaceChild(button, progressElement);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const navigationDrawer = document.querySelector(".left-drawer");
|
||||
const toggleButton = document.getElementById("toggle-button");
|
||||
|
||||
|
||||
1
static/mdui/mdui.css
Normal file
1
static/mdui/mdui.css
Normal file
File diff suppressed because one or more lines are too long
22
static/mdui/mdui.global.js
Normal file
22
static/mdui/mdui.global.js
Normal file
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user