import { SettingList } from "./components/SettingList"; import { SettingItem } from "./components/SettingItem"; import { SettingButton } from "./components/SettingButton"; import { SettingSwitch } from "./components/SettingSwitch"; import { SettingSelect } from "./components/SettingSelect"; import { OB11Config, OB11ConfigWrapper } from "./components/WebUiApiOB11Config"; async function onSettingWindowCreated(view: Element) { const isEmpty = (value: any) => value === undefined || value === undefined || value === ""; await OB11ConfigWrapper.Init(localStorage.getItem("auth") as string); let ob11Config: OB11Config = await OB11ConfigWrapper.GetOB11Config(); const setOB11Config = (key: string, value: any) => { const configKey = key.split("."); if (configKey.length === 2) { ob11Config[configKey[1]] = value; } else if (configKey.length === 3) { ob11Config[configKey[1]][configKey[2]] = value; } OB11ConfigWrapper.SetOB11Config(ob11Config); }; const parser = new DOMParser(); const doc = parser.parseFromString( [ "
", `
`, SettingList([ SettingItem( 'Napcat', undefined, SettingButton("V1.3.5", "napcat-update-button", "secondary") ), ]), SettingList([ SettingItem( "启用 HTTP 服务", undefined, SettingSwitch("ob11.http.enable", ob11Config.http.enable, { "control-display-id": "config-ob11-http-port", }) ), SettingItem( "HTTP 服务监听端口", undefined, `
`, "config-ob11-http-port", ob11Config.http.enable ), SettingItem( "启用 HTTP 心跳", undefined, SettingSwitch("ob11.http.enableHeart", ob11Config.http.enableHeart, { "control-display-id": "config-ob11-HTTP.enableHeart", }) ), SettingItem( "启用 HTTP 事件上报", undefined, SettingSwitch("ob11.http.enablePost", ob11Config.http.enablePost, { "control-display-id": "config-ob11-http-postUrls", }) ), `
HTTP 事件上报密钥
HTTP 事件上报地址
添加
`, SettingItem( "启用正向 WebSocket 服务", undefined, SettingSwitch("ob11.ws.enable", ob11Config.ws.enable, { "control-display-id": "config-ob11-ws.port", }) ), SettingItem( "正向 WebSocket 服务监听端口", undefined, `
`, "config-ob11-ws.port", ob11Config.ws.enable ), SettingItem( "启用反向 WebSocket 服务", undefined, SettingSwitch("ob11.reverseWs.enable", ob11Config.reverseWs.enable, { "control-display-id": "config-ob11-reverseWs-urls", }) ), `
反向 WebSocket 监听地址
添加
`, SettingItem( " WebSocket 服务心跳间隔", "控制每隔多久发送一个心跳包,单位为毫秒", `
` ), SettingItem( "Access token", undefined, `
` ), SettingItem( "新消息上报格式", "如客户端无特殊需求推荐保持默认设置,两者的详细差异可参考 OneBot v11 文档", SettingSelect( [ { text: "消息段", value: "array" }, { text: "CQ码", value: "string" }, ], "ob11.messagePostFormat", ob11Config.messagePostFormat ) ), SettingItem( "音乐卡片签名地址", undefined, `
`, "ob11.musicSignUrl" ), SettingItem( "", undefined, SettingButton("保存", "config-ob11-save", "primary") ), ]), SettingList([ SettingItem( "上报 Bot 自身发送的消息", "上报 event 为 message_sent", SettingSwitch("ob11.reportSelfMessage", ob11Config.reportSelfMessage) ), ]), SettingList([ SettingItem( "GitHub 仓库", `https://github.com/NapNeko/NapCatQQ`, SettingButton("点个星星", "open-github") ), SettingItem("NapCat 文档", ``, SettingButton("看看文档", "open-docs")), SettingItem( "Telegram 群", `https://t.me/+nLZEnpne-pQ1OWFl`, SettingButton("进去逛逛", "open-telegram") ), SettingItem( "QQ 群", `545402644`, SettingButton("我要进去", "open-qq-group") ), ]), "
", ].join(""), "text/html" ); // 外链按钮 doc.querySelector("#open-github")?.addEventListener("click", () => { window.open("https://napneko.github.io/", "_blank"); }); doc.querySelector("#open-telegram")?.addEventListener("click", () => { window.open("https://t.me/+nLZEnpne-pQ1OWFl"); }); doc.querySelector("#open-qq-group")?.addEventListener("click", () => { window.open("https://qm.qq.com/q/bDnHRG38aI"); }); doc.querySelector("#open-docs")?.addEventListener("click", () => { window.open("https://github.com/NapNeko/NapCatQQ"); }); // 生成反向地址列表 const buildHostListItem = ( type: string, host: string, index: number, inputAttrs: any = {} ) => { const dom = { container: document.createElement("setting-item"), input: document.createElement("input"), inputContainer: document.createElement("div"), deleteBtn: document.createElement("setting-button"), }; dom.container.classList.add("setting-host-list-item"); dom.container.dataset.direction = "row"; Object.assign(dom.input, inputAttrs); dom.input.classList.add("q-input__inner"); dom.input.type = "url"; dom.input.value = host; dom.input.addEventListener("input", () => { ob11Config[type.split("-")[0]][type.split("-")[1]][index] = dom.input.value; }); dom.inputContainer.classList.add("q-input"); dom.inputContainer.appendChild(dom.input); dom.deleteBtn.innerHTML = "删除"; dom.deleteBtn.dataset.type = "secondary"; dom.deleteBtn.addEventListener("click", () => { ob11Config[type.split("-")[0]][type.split("-")[1]].splice(index, 1); initReverseHost(type); }); dom.container.appendChild(dom.inputContainer); dom.container.appendChild(dom.deleteBtn); return dom.container; }; const buildHostList = ( hosts: string[], type: string, inputAttr: any = {} ) => { const result: HTMLElement[] = []; hosts?.forEach((host, index) => { result.push(buildHostListItem(type, host, index, inputAttr)); }); return result; }; const addReverseHost = ( type: string, doc: Document = document, inputAttr: any = {} ) => { type = type.replace(/\./g, "-");//替换操作 const hostContainerDom = doc.body.querySelector( `#config-ob11-${type}-list` ); hostContainerDom?.appendChild( buildHostListItem( type, "", ob11Config[type.split("-")[0]][type.split("-")[1]].length, inputAttr ) ); ob11Config[type.split("-")[0]][type.split("-")[1]].push(""); }; const initReverseHost = (type: string, doc: Document = document) => { type = type.replace(/\./g, "-");//替换操作 const hostContainerDom = doc.body?.querySelector( `#config-ob11-${type}-list` ); if (hostContainerDom) { [...hostContainerDom.childNodes].forEach((dom) => dom.remove()); buildHostList( ob11Config[type.split("-")[0]][type.split("-")[1]], type ).forEach((dom) => { hostContainerDom?.appendChild(dom); }); } }; initReverseHost("http.postUrls", doc); initReverseHost("reverseWs.urls", doc); doc .querySelector("#config-ob11-http-postUrls-add") ?.addEventListener("click", () => addReverseHost("http.postUrls", document, { placeholder: "如:http://127.0.0.1:5140/onebot", }) ); doc .querySelector("#config-ob11-reverseWs-urls-add") ?.addEventListener("click", () => addReverseHost("reverseWs.urls", document, { placeholder: "如:ws://127.0.0.1:5140/onebot", }) ); doc.querySelector("#config-ffmpeg-select")?.addEventListener("click", () => { //选择ffmpeg }); doc.querySelector("#config-open-log-path")?.addEventListener("click", () => { //打开日志 }); // 开关 doc .querySelectorAll("setting-switch[data-config-key]") .forEach((dom: Element) => { dom.addEventListener("click", () => { const active = dom.getAttribute("is-active") == undefined; //@ts-ignore 扩展 setOB11Config(dom.dataset.configKey, active); if (active) dom.setAttribute("is-active", ""); else dom.removeAttribute("is-active"); //@ts-ignore 等待修复 if (!isEmpty(dom.dataset.controlDisplayId)) { const displayDom = document.querySelector( //@ts-ignore 等待修复 `#${dom.dataset.controlDisplayId}` ); if (active) displayDom?.removeAttribute("is-hidden"); else displayDom?.setAttribute("is-hidden", ""); } }); }); // 输入框 doc .querySelectorAll( "setting-item .q-input input.q-input__inner[data-config-key]" ) .forEach((dom: Element) => { dom.addEventListener("input", () => { const Type = dom.getAttribute("type"); //@ts-ignore 等待修复 const configKey = dom.dataset.configKey; const configValue = Type === "number" ? parseInt((dom as HTMLInputElement).value) >= 1 ? parseInt((dom as HTMLInputElement).value) : 1 : (dom as HTMLInputElement).value; setOB11Config(configKey, configValue); }); }); // 下拉框 doc .querySelectorAll("ob-setting-select[data-config-key]") .forEach((dom: Element) => { //@ts-ignore 等待修复 dom?.addEventListener("selected", (e: CustomEvent) => { //@ts-ignore 等待修复 const configKey = dom.dataset.configKey; const configValue = e.detail.value; setOB11Config(configKey, configValue); }); }); // 保存按钮 doc.querySelector("#config-ob11-save")?.addEventListener("click", () => { OB11ConfigWrapper.SetOB11Config(ob11Config); alert("保存成功"); }); doc.body.childNodes.forEach((node) => { view.appendChild(node); }); } export { onSettingWindowCreated };