diff --git a/oaer/index.html b/oaer/index.html
index 089cf6b..4e650ad 100644
--- a/oaer/index.html
+++ b/oaer/index.html
@@ -5,6 +5,7 @@
OAer Dev
+
diff --git a/oaer/lib/api/app.ts b/oaer/lib/api/app.ts
new file mode 100644
index 0000000..186dc66
--- /dev/null
+++ b/oaer/lib/api/app.ts
@@ -0,0 +1,28 @@
+/*
+* @name: app
+* @author: veypi
+* @date: 2021-11-17 14:44
+* @description：ap
+* @update: 2021-11-17 14:44
+*/
+import ajax from './axios'
+import cfg from '../cfg'
+
+export default {
+ local: () => cfg.BaseUrl() + '/app/',
+ getKey(uuid: string) {
+ return ajax.get(this.local() + uuid, { option: 'key' })
+ },
+ get(uuid: string) {
+ return ajax.get(this.local() + uuid)
+ },
+ list() {
+ return ajax.get(this.local())
+ },
+ users(uuid: string, user_id: string, data?: any) {
+ if (uuid === '') {
+ uuid = '-'
+ }
+ return ajax.get(this.local() + uuid + '/user/' + user_id, data)
+ },
+}
diff --git a/oaer/lib/api/axios.ts b/oaer/lib/api/axios.ts
new file mode 100644
index 0000000..f050662
--- /dev/null
+++ b/oaer/lib/api/axios.ts
@@ -0,0 +1,113 @@
+/*
+ * axios.ts
+ * Copyright (C) 2023 veypi
+ * 2023-09-22 20:22
+ * Distributed under terms of the MIT license.
+ */
+
+import axios, { AxiosError, AxiosResponse } from 'axios';
+import cfg from '../cfg';
+
+// Be careful when using SSR for cross-request state pollution
+// due to creating a Singleton instance here;
+// If any client changes this (global) instance, it might be a
+// good idea to move this instance creation inside of the
+// "export default () => {}" function below (which runs individually
+// for each client)
+
+axios.defaults.withCredentials = true
+const proxy = axios.create({
+ withCredentials: true,
+ headers: {
+ 'content-type': 'application/json;charset=UTF-8',
+ },
+});
+
+
+// 请求拦截
+const beforeRequest = (config: any) => {
+ // 设置 token
+ const token = cfg.token
+ config.retryTimes = 3
+ // NOTE 添加自定义头部
+ token && (config.headers.Authorization = `Bearer ${token}`)
+ // config.headers['auth_token'] = ''
+ return config
+}
+proxy.interceptors.request.use(beforeRequest)
+
+// 响应拦截器
+const responseSuccess = (response: AxiosResponse) => {
+ // eslint-disable-next-line yoda
+ // 这里没有必要进行判断，axios 内部已经判断
+ // const isOk = 200 <= response.status && response.status < 300
+ let data = response.data
+ if (response.config.method === 'head') {
+ data = JSON.parse(JSON.stringify(response.headers))
+ }
+ return Promise.resolve(data)
+}
+
+const responseFailed = (error: AxiosError) => {
+ const { response, config } = error
+ if (!window.navigator.onLine) {
+
+ alert('没有网络')
+ return Promise.reject(new Error('请检查网络连接'))
+ }
+
+ // @ts-ignore
+ if (!config || !config.retryTimes) {
+ return Promise.reject(response?.data || response?.headers.error)
+ };
+ // @ts-ignore
+ const { __retryCount = 0, retryDelay = 300, retryTimes } = config;
+ // 在请求对象上设置重试次数
+ // @ts-ignore
+ config.__retryCount = __retryCount;
+ // 判断是否超过了重试次数
+ if (__retryCount >= retryTimes) {
+ return Promise.reject(response?.data || response?.headers.error)
+ }
+ // 增加重试次数
+ // @ts-ignore
+ config.__retryCount++;
+ // 延时处理
+ const delay = new Promise((resolve) => {
+ setTimeout(() => {
+ resolve();
+ }, retryDelay);
+ });
+ // 重新发起请求
+ return delay.then(function() {
+ return axios(config);
+ });
+}
+
+proxy.interceptors.response.use(responseSuccess, responseFailed)
+
+
+const ajax = {
+ get(url: string, data = {}, header?: any) {
+ return proxy.get(url, { params: data, headers: header })
+ },
+ head(url: string, data = {}, header?: any) {
+ return proxy.head(url, { params: data, headers: header })
+ },
+ delete(url: string, data = {}, header?: any) {
+ return proxy.delete(url, { params: data, headers: header })
+ },
+
+ post(url: string, data = {}, header?: any) {
+ return proxy.post(url, data, { headers: header })
+ },
+ put(url: string, data = {}, header?: any) {
+ return proxy.put(url, data, { headers: header })
+ },
+ patch(url: string, data = {}, header?: any) {
+ return proxy.patch(url, data, { headers: header })
+ },
+}
+
+export default ajax
+
diff --git a/oaer/lib/api/index.ts b/oaer/lib/api/index.ts
new file mode 100644
index 0000000..a930c06
--- /dev/null
+++ b/oaer/lib/api/index.ts
@@ -0,0 +1,35 @@
+/*
+ * Copyright (C) 2019 light
+ *
+ * Distributed under terms of the MIT license.
+ */
+
+import user from './user'
+import app from './app'
+import cfg from '../cfg'
+import ajax from './axios'
+import nats from './nats'
+import tsdb from './tsdb'
+
+
+const api = {
+ nats: nats,
+ tsdb: tsdb,
+ user: user,
+ app: app,
+ info: () => {
+ return ajax.get(cfg.BaseUrl() + '/info')
+ },
+ refresh_token: () => {
+ ajax.post(cfg.BaseUrl() + '/app/' + cfg.uuid + '/token/', { app_id: cfg.uuid, token: cfg.refresh }).then(e => {
+ cfg.token = e
+ // bus.emit('sync', e)
+ }).catch(e => {
+ console.warn(e)
+ // bus.emit('logout', 'get token failed ' + e)
+ })
+ }
+}
+
+export { api }
+export default api
diff --git a/oaer/lib/api/nats.ts b/oaer/lib/api/nats.ts
new file mode 100644
index 0000000..6ee3ed6
--- /dev/null
+++ b/oaer/lib/api/nats.ts
@@ -0,0 +1,20 @@
+/*
+ * nats.ts
+ * Copyright (C) 2023 veypi
+ * 2023-10-19 21:36
+ * Distributed under terms of the MIT license.
+ */
+
+
+import cfg from '../cfg'
+import ajax from './axios'
+
+export default {
+ local: () => cfg.BaseUrl() + '/nats/',
+ general() {
+ return ajax.get(this.local() + 'varz')
+ },
+ conns() {
+ return ajax.get(this.local() + 'connz', { subs: true })
+ },
+}
diff --git a/oaer/lib/api/tsdb.ts b/oaer/lib/api/tsdb.ts
new file mode 100644
index 0000000..9feb20a
--- /dev/null
+++ b/oaer/lib/api/tsdb.ts
@@ -0,0 +1,26 @@
+/*
+ * tsdb.ts
+ * Copyright (C) 2023 veypi
+ * 2023-10-20 23:21
+ * Distributed under terms of the MIT license.
+ */
+
+
+import cfg from '../cfg'
+import ajax from './axios'
+
+export default {
+ local: () => cfg.BaseUrl() + '/ts/',
+ range(query: string, props?: { start?: string, end?: string, step?: string, query?: string }) {
+ if (query !== undefined) {
+ // @ts-ignore
+ props.query = query
+ } else {
+ props = { query: query }
+ }
+ return ajax.get(this.local() + 'query_range', props)
+ },
+ query(query: string) {
+ return ajax.get(this.local() + 'query', { query: query })
+ }
+}
diff --git a/oaer/lib/api/user.ts b/oaer/lib/api/user.ts
new file mode 100644
index 0000000..10380cc
--- /dev/null
+++ b/oaer/lib/api/user.ts
@@ -0,0 +1,24 @@
+/*
+ * user.ts
+ * Copyright (C) 2023 veypi
+ * 2023-10-05 15:37
+ * Distributed under terms of the MIT license.
+ */
+
+
+
+import ajax from './axios'
+import cfg from '../cfg'
+
+
+
+export default {
+ local: () => cfg.BaseUrl() + '/user/',
+ search(q: string) {
+ return ajax.get(this.local(), { username: q })
+ },
+ get(id: number) {
+ return ajax.get(this.local() + id)
+ },
+}
+
diff --git a/oaer/lib/assets/css/animate.scss b/oaer/lib/assets/css/animate.scss
new file mode 100644
index 0000000..1ce66c4
--- /dev/null
+++ b/oaer/lib/assets/css/animate.scss
@@ -0,0 +1,39 @@
+/*
+ * animate.css
+ * Copyright (C) 2024 veypi
+ *
+ * Distributed under terms of the MIT license.
+ */
+
+@keyframes scale-up {
+ 0% {
+ transform: scale(0);
+ opacity: 0;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 1;
+ }
+}
+
+@keyframes scale-off {
+ 0% {
+ transform: scale(1);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(0);
+ opacity: 0;
+ }
+}
+
+@keyframes slide-in {
+ 0% {
+ transform: translateX(200%) scale(0);
+ opacity: 0;
+ }
+ 100% {
+ transform: translateX(0) scale(1);
+ opacity: 1;
+ }
+}
diff --git a/oaer/lib/assets/css/oaer.scss b/oaer/lib/assets/css/oaer.scss
new file mode 100644
index 0000000..c6a3e59
--- /dev/null
+++ b/oaer/lib/assets/css/oaer.scss
@@ -0,0 +1,242 @@
+/*
+ * oaer.css
+ * Copyright (C) 2024 veypi
+ *
+ * Distributed under terms of the MIT license.
+ */
+
+@import "./animate.scss";
+
+.voa {
+ user-select: none;
+ cursor: pointer;
+ height: 4rem;
+ width: 4rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ .voa-off {
+ }
+ .voa-on {
+ border-radius: 100%;
+ background: #999;
+ animation: scale-up 100ms ease-out forwards;
+ }
+ :hover {
+ opacity: 0.9;
+ }
+}
+
+.voa-scale-off {
+ transform-origin: center center;
+ animation: scale-off 200ms ease-out forwards !important;
+}
+.voa-scale-up {
+ animation: scale-up 200ms ease-in;
+}
+
+.hover-line-b {
+ cursor: pointer;
+ position: relative;
+ &:hover {
+ opacity: 0.7;
+ }
+
+ &:after {
+ content: "";
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ width: 0;
+ height: 0.1em;
+ background-color: #000;
+ transition: all 0.3s;
+ }
+
+ &:hover::after {
+ left: 0px;
+ width: 100%;
+ }
+}
+
+.voa-modal {
+ user-select: none;
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ translate: -50% -50%;
+ padding: 2rem;
+ z-index: 10000;
+ width: 40%;
+ min-width: 20rem;
+ &::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ border-radius: 2rem;
+ background-color: rgba(240, 240, 240, 0.5);
+ backdrop-filter: blur(20px); /* 模糊效果 */
+ z-index: -1;
+ }
+ .header {
+ line-height: 2rem;
+ width: 100%;
+ display: flex;
+ justify-content: start;
+ align-items: center;
+ gap: 0.5rem;
+ .voa-logo {
+ height: 4rem;
+ width: 4rem;
+ }
+ .txt {
+ font-size: 1.5rem;
+ }
+ }
+ .username,
+ .password {
+ margin: 2rem 0;
+ position: relative;
+ width: 100%;
+ input {
+ height: 2.5rem;
+ line-height: 2.5rem;
+ font-size: 1.5rem;
+ width: 100%;
+ margin: 0 1rem;
+ border: none;
+ outline: none;
+ background: none;
+ }
+ &:after {
+ content: "";
+ position: absolute;
+ bottom: 0;
+ left: 1rem;
+ width: calc(100% - 2rem);
+ height: 0.1em;
+ background-color: #000;
+ transition: all 0.3s;
+ }
+ &:hover::after {
+ left: 0%;
+ width: 100%;
+ background-color: #00ffff;
+ }
+ }
+ .ok {
+ cursor: pointer;
+ line-height: 3rem;
+ font-size: 1.5rem;
+ height: 3rem;
+ margin: 2rem auto;
+ width: 40%;
+ background: #0a0;
+ border-radius: 1.5rem;
+ }
+ .last {
+ display: flex;
+ justify-content: space-between;
+ padding: 0 1rem;
+ height: 3rem;
+ .icos {
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+ div {
+ opacity: 0.5;
+ cursor: pointer;
+ height: 2rem;
+ width: 2rem;
+ background-size: cover;
+ background-position: center;
+ &:hover {
+ opacity: 1;
+ }
+ }
+ .github {
+ background-image: url("../img/github.svg");
+ }
+ .google {
+ background-image: url("../img/google.svg");
+ }
+ .wechat {
+ background-image: url("../img/wechat.svg");
+ }
+ }
+ .txt {
+ height: 1.5rem;
+ line-height: 1.5rem;
+ font-size: 1rem;
+ div {
+ cursor: pointer;
+ opacity: 0.5;
+ &:hover {
+ opacity: 1;
+ }
+ }
+ }
+ }
+ .close {
+ height: 2rem;
+ width: 2rem;
+ position: absolute;
+ opacity: 0.5;
+ top: 1rem;
+ right: 1rem;
+ cursor: pointer;
+ &:active {
+ opacity: 0.8;
+ }
+ }
+}
+
+#voa-mask {
+ position: fixed;
+ display: none;
+ top: 0;
+ left: 0;
+ width: 100vw;
+ height: 100vh;
+ z-index: 999;
+ &::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(255, 255, 255, 0.01); /* 半透明白色遮罩 */
+ backdrop-filter: blur(1px); /* 模糊效果 */
+ }
+}
+
+.voa-logo {
+ background-image: url("../favicon.svg");
+ background-size: cover;
+ background-position: center;
+}
+
+.voa-btn {
+ position: relative;
+ text-align: center;
+ display: block;
+ border: none;
+ &::after {
+ content: "";
+ position: absolute;
+ inset: 0;
+ border-radius: inherit;
+ transition: 0.3s;
+ }
+ &:active::after {
+ box-shadow: 0 1px 0px 0px rgba(0, 0, 0, 0.5);
+ /* opacity: 0; */
+ }
+ &:active {
+ opacity: 0.8;
+ }
+}
diff --git a/oaer/lib/assets/favicon.ico b/oaer/lib/assets/favicon.ico
new file mode 100644
index 0000000..e26bc40
Binary files /dev/null and b/oaer/lib/assets/favicon.ico differ
diff --git a/oaer/lib/assets/favicon.svg b/oaer/lib/assets/favicon.svg
new file mode 100644
index 0000000..7a505b0
--- /dev/null
+++ b/oaer/lib/assets/favicon.svg
@@ -0,0 +1,6 @@
+
diff --git a/oaer/lib/assets/img/github.svg b/oaer/lib/assets/img/github.svg
new file mode 100644
index 0000000..54382ad
--- /dev/null
+++ b/oaer/lib/assets/img/github.svg
@@ -0,0 +1,6 @@
+
diff --git a/oaer/lib/assets/img/google.svg b/oaer/lib/assets/img/google.svg
new file mode 100644
index 0000000..b5b80b3
--- /dev/null
+++ b/oaer/lib/assets/img/google.svg
@@ -0,0 +1,6 @@
+
diff --git a/oaer/lib/assets/img/wechat.svg b/oaer/lib/assets/img/wechat.svg
new file mode 100644
index 0000000..bc1c2fc
--- /dev/null
+++ b/oaer/lib/assets/img/wechat.svg
@@ -0,0 +1,9 @@
+
diff --git a/oaer/lib/cfg.ts b/oaer/lib/cfg.ts
index f7414b2..4072c72 100644
--- a/oaer/lib/cfg.ts
+++ b/oaer/lib/cfg.ts
@@ -6,14 +6,13 @@
*/
let cfg = {
- self: '',
-
uuid: '',
- app_data: {},
+ refresh: '',
+ token: '',
+
+ app_data: {},
ready: false,
- token: '',
- oa_token: '',
local_user: {},
host: '',
diff --git a/oaer/lib/css/animate.scss b/oaer/lib/css/animate.scss
deleted file mode 100644
index 4903ee5..0000000
--- a/oaer/lib/css/animate.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-/*
- * animate.css
- * Copyright (C) 2024 veypi
- *
- * Distributed under terms of the MIT license.
- */
-
-@keyframes scale-up {
- 0% {
- transform: scale(0);
- opacity: 0;
- }
- 100% {
- transform: scale(1);
- opacity: 1;
- }
-}
-
-@keyframes scale-off {
- 0% {
- transform: scale(1);
- opacity: 1;
- }
- 100% {
- transform: scale(0);
- opacity: 0;
- }
-}
diff --git a/oaer/lib/css/oaer.scss b/oaer/lib/css/oaer.scss
deleted file mode 100644
index 43283ab..0000000
--- a/oaer/lib/css/oaer.scss
+++ /dev/null
@@ -1,32 +0,0 @@
-/*
- * oaer.css
- * Copyright (C) 2024 veypi
- *
- * Distributed under terms of the MIT license.
- */
-
-@import './animate.scss';
-
-.voa {
- user-select: none;
- cursor: pointer;
- height: 4rem;
- width: 4rem;
- display: flex;
- justify-content: center;
- align-items: center;
- .voa-off{
- }
- .voa-on {
- border-radius: 100%;
- background: #999;
- animation: scale-up 100ms ease-out forwards;
- }
- :hover{
- opacity: 0.9;
- }
-}
-
-.voa-animate-off-scale-off {
- animation: scale-off 100ms ease-out forwards;
-}
diff --git a/oaer/lib/main.ts b/oaer/lib/main.ts
index eb5d99f..e135950 100644
--- a/oaer/lib/main.ts
+++ b/oaer/lib/main.ts
@@ -5,22 +5,28 @@
* Distributed under terms of the MIT license.
*/
-import './css/oaer.scss'
+import './assets/css/oaer.scss'
+
export class OAer {
domid: string
id: string
dom: {
+ mask: HTMLDivElement
frame: HTMLDivElement
b0?: HTMLDivElement
b1?: HTMLDivElement
+ login_box?: HTMLDivElement
}
constructor(id: string, domid?: string) {
this.id = id
this.domid = domid || 'oaer'
this.dom = {
- frame: document.querySelector(`#${this.domid}`)!
+ frame: document.querySelector(`#${this.domid}`)!,
+ mask: document.createElement('div'),
}
+ this.dom.mask.id = 'voa-mask'
+ document.body.appendChild(this.dom.mask)
this.dom.frame.classList.add('voa')
this.build_b0()
this.dom.frame.appendChild(this.dom.b0!)
@@ -28,18 +34,66 @@ export class OAer {
}
build_b0() {
this.dom.b0 = document.createElement('div')
- this.dom.b0.classList.add('voa-off')
+ this.dom.b0.classList.add('hover-line-b')
this.dom.b0.onclick = () => {
- this.dom.b1?.classList.add('voa-animate-scale-off')
- this.build_b1()
- this.dom.frame.replaceChild(this.dom.b1!, this.dom.b0!)
+ console.log('click b0')
+ this.build_login()
+ // this.dom.b1?.classList.add('voa-animate-scale-off')
+ // this.build_b1()
+ // this.dom.frame.replaceChild(this.dom.b1!, this.dom.b0!)
}
this.dom.b0.innerHTML = `
-
登录
-
`
}
+ build_login() {
+ if (this.dom.login_box) {
+ return
+ }
+ this.dom.login_box = document.createElement('div')
+ this.dom.login_box.classList.add('voa-modal', 'voa-scale-up')
+ this.dom.login_box.innerHTML = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Create Account
+
Forgot Password?
+
+
+