公众号前级页面逻辑完成
This commit is contained in:
1
2X9Hgqt14u.txt
Normal file
1
2X9Hgqt14u.txt
Normal file
@@ -0,0 +1 @@
|
||||
871e39ed927a49014bcd5237755b88cc
|
||||
281
index.html
281
index.html
@@ -620,6 +620,13 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.userinfo-wrapper img {
|
||||
max-width: 20px;
|
||||
max-height: 20px;
|
||||
margin-right: 4px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.chat-container .content {
|
||||
overflow-y: auto;
|
||||
scrollbar-width: none;
|
||||
@@ -627,7 +634,7 @@
|
||||
|
||||
/* 按钮样式 */
|
||||
.userinfo-toggle {
|
||||
padding: 7px 2px;
|
||||
padding: 4px 2px;
|
||||
border-radius: 9px;
|
||||
border: none;
|
||||
background: #0057ff;
|
||||
@@ -1169,7 +1176,11 @@
|
||||
|
||||
<!-- 左侧侧边栏 -->
|
||||
<div class="sidebar" id="sidebar">
|
||||
<button class="toggle-btn" id="toggleBtn" onclick="toggleSidebar()">☰</button>
|
||||
<button class="toggle-btn" id="toggleBtn" onclick="toggleSidebar()"><svg t="1764295127411" class="icon"
|
||||
viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19121" width="32" height="32">
|
||||
<path d="M118.279 336.402h754.531v68.618h-754.531v-68.618z" p-id="19122"></path>
|
||||
<path d="M118.279 647.52h754.531v68.618h-754.531v-68.618z" p-id="19123"></path>
|
||||
</svg></button>
|
||||
<div class="sidebar-header"><img src="./img/logo.png">会话列表</div>
|
||||
<div class="sidebar-actions">
|
||||
<button onclick="newChat()">＋ 新建会话</button>
|
||||
@@ -1220,17 +1231,17 @@
|
||||
</div>
|
||||
<div class="userinfo">
|
||||
<span class="username"></span>
|
||||
<span class="logout" onClick="logout()">退出</span>
|
||||
<span class="logout " onClick="logout()">退出</span>
|
||||
<a class="logout price" href="./modal.html">服务价格</a>
|
||||
</div>
|
||||
<div class="userinfo-wrapper">
|
||||
<img src="" alt="">
|
||||
<!-- 初始按钮 -->
|
||||
<button class="userinfo-toggle username" onclick="toggleUserInfo()">用户</button>
|
||||
|
||||
<!-- 折叠面板 -->
|
||||
<div class="userinfo-panel">
|
||||
<!-- <span class="username">用户名</span> -->
|
||||
<span class="logout" onclick="logout()">退出</span>
|
||||
<span class="logout logout1" onclick="logout()">退出</span>
|
||||
<a class="logout price" href="./modal.html">服务价格</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1408,59 +1419,33 @@
|
||||
let sessId;
|
||||
let activeChatId = '';
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
console.log(params.get("userId"), 644);
|
||||
console.log(params.get("userId"), 644, params.get("nickname"), params.get("headingimg"));
|
||||
|
||||
const encodedUserId = params.get("userId");
|
||||
const from = params.get("from");
|
||||
const code = params.get("code");
|
||||
|
||||
|
||||
|
||||
function handleCode(code) {
|
||||
if (code) {
|
||||
console.log(code, "code");
|
||||
retryFetch(`https://servicestream.satabot.com/api/wechat/access_token?code=${code}`)
|
||||
|
||||
.then(res => {
|
||||
console.log(res.nickname)
|
||||
document.querySelectorAll('.username').forEach((e) => {
|
||||
e.textContent = res.nickname;
|
||||
})
|
||||
openId = res.openid;
|
||||
userId = res.openid;
|
||||
getUserByOpenId(userId)
|
||||
|
||||
});
|
||||
} else {
|
||||
return; // ✅ 没问题，直接退出函数
|
||||
}
|
||||
}
|
||||
const appid = "wx364b8ebf17fe45fe";
|
||||
// 回调地址（必须和公众号后台配置的网页授权域名一致）
|
||||
const redirect_uri = encodeURIComponent("http://ai.satabot.com");
|
||||
// 授权方式：snsapi_base（静默） 或 snsapi_userinfo（需要用户确认）
|
||||
const scope = "snsapi_userinfo";
|
||||
// 自定义参数，授权后会原样返回
|
||||
const state = "12399";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ✅ 先 URL 解码，再 Base64 解码，再 UTF-8 解码
|
||||
let userId;
|
||||
if (from == "weixin") {
|
||||
userId = encodedUserId;
|
||||
openId = encodedUserId;
|
||||
setCookie('openId', openId)
|
||||
document.querySelectorAll('.logout').forEach(el => {
|
||||
if (params.get("nickname")) {
|
||||
console.log(1)
|
||||
|
||||
document.querySelectorAll('.logout1').forEach(el => {
|
||||
el.style.display = 'none';
|
||||
});
|
||||
console.log(3)
|
||||
document.querySelectorAll('.username').forEach((e) => {
|
||||
e.textContent = params.get("nickname");
|
||||
})
|
||||
|
||||
document.querySelector(".userinfo-wrapper img").src = params.get("headingimg");
|
||||
userId = decodeURIComponent(Number(escape(atob(encodedUserId))));
|
||||
console.log(4)
|
||||
|
||||
} else {
|
||||
userId = decodeURIComponent(Number(escape(atob(encodedUserId))));
|
||||
}
|
||||
// 微信授权的码
|
||||
handleCode(code);
|
||||
if (userId && userId != "NaN") {
|
||||
setCookie("userId", userId);
|
||||
}
|
||||
@@ -1477,7 +1462,6 @@
|
||||
if (isMobile()) {
|
||||
toggleSidebar();
|
||||
}
|
||||
console.log(isWeChat(), 999, code)
|
||||
// if (isWeChat()) {
|
||||
// if (code) {
|
||||
// // gotoWeiXin();
|
||||
@@ -1496,29 +1480,8 @@
|
||||
// }
|
||||
|
||||
// } else {
|
||||
if (getCookie("userId") && getCookie("userId") != "NaN" && !code) {
|
||||
getSessionList();
|
||||
|
||||
if (from == "weixin") {
|
||||
getUserByOpenId(userId)
|
||||
} else {
|
||||
getSessionList();
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
// deleteCookie('userId');
|
||||
|
||||
if (from == "weixin") {
|
||||
|
||||
} else {
|
||||
// getUserName(userId);
|
||||
getSessionList();
|
||||
// window.location.href = 'http://ri.satabot.com/index.html#/login?goRemote=1&clear=1';
|
||||
|
||||
// window.location.href = 'http://ri.satabot.com/#/login?goRemote=1&clear=1';
|
||||
}
|
||||
|
||||
}
|
||||
function handleLogin(data) {
|
||||
console.log("开始登录")
|
||||
const loginParams = data;
|
||||
@@ -1695,143 +1658,42 @@
|
||||
throw lastError;
|
||||
}
|
||||
|
||||
function getUserByOpenId(id) {
|
||||
if (document.querySelector(".weixin-loading").classList.contains("none")) {
|
||||
document.querySelector(".weixin-loading").classList.remove("none");
|
||||
}
|
||||
const data = {
|
||||
sourceType: 5,
|
||||
openId: id,
|
||||
|
||||
phonenumber: '',
|
||||
smsCode: '',
|
||||
}
|
||||
retryFetch("https://serviceri.satabot.com/login", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 300) {
|
||||
showpop(); // 弹出验证码
|
||||
} else if (res.code == 200) {
|
||||
setCookie('token', res.token);
|
||||
userId = res.userId;
|
||||
getSessionList();
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.error("登录请求失败（重试10次后）:", err);
|
||||
showToast("网络异常，请稍后再试");
|
||||
})
|
||||
.finally(() => {
|
||||
if (!document.querySelector(".weixin-loading").classList.contains("none")) {
|
||||
document.querySelector(".weixin-loading").classList.add("none");
|
||||
}
|
||||
console.log("登录请求结束");
|
||||
});
|
||||
// fetch("https://ai.satabot.com/api/remote/login", {
|
||||
// method: "POST", // 必选：指定请求方法为 POST
|
||||
// headers: {
|
||||
// "Content-Type": "application/json", // 声明请求体是 JSON 格式
|
||||
// // 可选：如果接口需要 Token 前置验证，可添加 Authorization 头
|
||||
// // "Authorization": "Bearer 你的前置 Token"
|
||||
// },
|
||||
// // 必选：请求体，将参数对象转为 JSON 字符串（不能直接传对象）
|
||||
// body: JSON.stringify(data)
|
||||
// }).then(res => res.json()).then(res => {
|
||||
// if (res.code == 300) {
|
||||
// showpop();//出现验证码弹窗
|
||||
// } else if (res.code == 200) {
|
||||
// setCookie('token', res.token);
|
||||
// userId = res.userId;
|
||||
|
||||
// }
|
||||
// }).catch(err => {
|
||||
// console.error("请求失败：", err);
|
||||
// showToast("网络异常，请稍后再试" + err);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// console.log("登录请求结束");
|
||||
// });
|
||||
// try {
|
||||
// handleLogin(data).then(res => {
|
||||
// if (res.code == 300) {
|
||||
// showpop();//出现验证码弹窗
|
||||
// } else if (res.code == 200) {
|
||||
// setCookie('token', res.token);
|
||||
// userId = res.userId;
|
||||
|
||||
// }
|
||||
// })
|
||||
// retryFetch("https://serviceai.satabot.com/getuserByopenid", {
|
||||
// method: "POST",
|
||||
// headers: {
|
||||
// "Content-Type": "application/json"
|
||||
// },
|
||||
// body: JSON.stringify({
|
||||
// userId: id,
|
||||
|
||||
// })
|
||||
// }).then(data => {
|
||||
// if (data.code == 0) {
|
||||
|
||||
// userId = data.userId;
|
||||
// sendParam.userId = userId;
|
||||
// getSessionList();
|
||||
// } else {
|
||||
// console.error("未找到该用户:",);
|
||||
// }
|
||||
// })
|
||||
// } catch (err) {
|
||||
// console.error("请求异常:", err);
|
||||
// }
|
||||
}
|
||||
const questions = document.querySelectorAll(".question");
|
||||
// 获取到用户名称
|
||||
function getUserName(userId) {
|
||||
if (code) return;
|
||||
if (from == "weixin") {
|
||||
document.querySelectorAll('.username').forEach((e) => {
|
||||
e.textContent = userId;
|
||||
})
|
||||
} else {
|
||||
try {
|
||||
fetch("https://serviceai.satabot.com/user", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify({
|
||||
userId,
|
||||
if (params.get("nickname")) return;
|
||||
try {
|
||||
fetch("https://serviceai.satabot.com/user", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify({
|
||||
userId,
|
||||
|
||||
})
|
||||
}).then(res => res.json()).then(data => {
|
||||
if (data.code === 0) {
|
||||
document.querySelectorAll('.username').forEach((e) => {
|
||||
e.textContent = data.userName;
|
||||
})
|
||||
|
||||
console.log("成功找到该用户:", data.userName, data.userId);
|
||||
|
||||
} else {
|
||||
window.location.href = data.error;
|
||||
return;
|
||||
console.error("未找到该用户:",);
|
||||
}
|
||||
})
|
||||
}).then(res => res.json()).then(data => {
|
||||
if (data.code === 0) {
|
||||
document.querySelectorAll('.username').forEach((e) => {
|
||||
e.textContent = data.userName;
|
||||
})
|
||||
|
||||
console.log("成功找到该用户:", data.userName, data.userId);
|
||||
|
||||
} else {
|
||||
window.location.href = data.error;
|
||||
return;
|
||||
console.error("未找到该用户:",);
|
||||
}
|
||||
})
|
||||
|
||||
} catch (err) {
|
||||
console.error("请求异常:", err);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error("请求异常:", err);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
questions.forEach(q => {
|
||||
|
||||
q.addEventListener("click", () => {
|
||||
@@ -2296,11 +2158,8 @@
|
||||
sessId = sendParam.sessionId;
|
||||
sendParam.imageBase64 = img;
|
||||
// sendParam.userId= encodedUserId;
|
||||
if (from != "weixin" && !code) {
|
||||
sendParam.userId = decodeURIComponent(Number(escape(atob(encodedUserId))));
|
||||
} else {
|
||||
sendParam.userId = userId;
|
||||
}
|
||||
sendParam.userId = decodeURIComponent(Number(escape(atob(encodedUserId))));
|
||||
|
||||
|
||||
// ✅ 创建 AbortController
|
||||
controller = new AbortController();
|
||||
@@ -2390,6 +2249,32 @@
|
||||
sendBtnImg.classList.remove('none');
|
||||
stopBtn.classList.add('none');
|
||||
msgDiv.innerHTML = marked.parse(aiMsg.content);
|
||||
const shareSpan = document.createElement("span");
|
||||
shareSpan.style.display = "inline-flex";
|
||||
shareSpan.style.alignItems = "center";
|
||||
shareSpan.style.cursor = "pointer";
|
||||
shareSpan.style.marginTop = "8px";
|
||||
shareSpan.style.opacity = "0.75";
|
||||
shareSpan.style.transition = "opacity .2s";
|
||||
shareSpan.title = "分享";
|
||||
|
||||
shareSpan.onmouseenter = () => shareSpan.style.opacity = "1";
|
||||
shareSpan.onmouseleave = () => shareSpan.style.opacity = "0.75";
|
||||
|
||||
shareSpan.innerHTML = `
|
||||
<svg t="1764059839985" class="icon" viewBox="0 0 1236 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5667" width="20" height="20"><path d="M741.743 1018.343c-28.287 0-50.917-11.315-73.547-28.288-22.63-22.63-39.602-50.917-39.602-84.862V792.044c-124.464 0-328.133 33.945-435.624 181.039-16.973 28.287-56.575 45.26-90.52 50.917H85.478C28.903 1012.685-5.042 961.768 0.616 905.193c28.287-243.27 113.15-418.652 260.243-537.458 107.492-84.862 231.956-130.122 367.735-141.437V118.807c0-50.917 22.63-96.177 67.89-113.15C736.086-5.657 781.345 0 815.29 33.945l362.077 367.735c28.288 22.63 45.26 56.574 50.918 96.176 5.657 39.603-5.658 79.205-33.945 107.492-5.658 5.658-11.315 16.972-22.63 22.63l-350.762 356.42c-22.63 22.63-50.918 33.945-79.205 33.945z m-90.52-339.448h90.52v226.298l356.42-367.734 5.658-5.658c5.657-5.657 5.657-16.972 5.657-22.63 0-11.315-5.657-16.972-11.315-22.63l-5.657-5.657-356.42-362.077V333.79l-79.205 5.658c-118.806 0-231.956 39.602-328.132 113.149-113.15 90.519-186.696 237.613-209.326 429.967 141.436-175.382 390.364-203.669 531.8-203.669z" p-id="5668"></path></svg>
|
||||
`;
|
||||
|
||||
shareSpan.onclick = () => {
|
||||
generatePoster(aiMsg.content);
|
||||
};
|
||||
setTimeout(() => {
|
||||
msgDiv.appendChild(shareSpan);
|
||||
}, 1000)
|
||||
|
||||
|
||||
console.log("shareSpan appended?", msgDiv.contains(shareSpan));
|
||||
|
||||
|
||||
|
||||
setTimeout(scrollToBottom, 0); // chatMessages.scrollTop = chatMessages.scrollHeight;
|
||||
|
||||
759
middle.html
759
middle.html
@@ -3,9 +3,12 @@
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"">
|
||||
<title>新能源智能体</title>
|
||||
<script src=" https://unpkg.com/vconsole@latest/dist/vconsole.min.js">
|
||||
</script>
|
||||
<link rel="prefetch" href="index.html">
|
||||
|
||||
|
||||
<style>
|
||||
:root {
|
||||
@@ -31,34 +34,43 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(180deg, #f3fbff 0%, #e9f5ff 60%);
|
||||
background: #fff;
|
||||
padding: 28px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.fadeout {
|
||||
opacity: 0;
|
||||
transition: opacity .3s ease;
|
||||
}
|
||||
|
||||
body {
|
||||
opacity: 1;
|
||||
transition: opacity .3s ease;
|
||||
}
|
||||
|
||||
|
||||
.wrap {
|
||||
width: 100%;
|
||||
max-width: 560px;
|
||||
background: var(--card-bg);
|
||||
border-radius: 14px;
|
||||
padding: 56px 48px;
|
||||
box-shadow: var(--shadow);
|
||||
text-align: center
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: -15%;
|
||||
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 92px;
|
||||
height: 92px;
|
||||
border-radius: 18px;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 18px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0.6));
|
||||
box-shadow: 0 8px 20px rgba(12, 75, 40, 0.06);
|
||||
|
||||
}
|
||||
|
||||
.logo img {
|
||||
@@ -69,10 +81,21 @@
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 6px 0 24px;
|
||||
font-size: 22px;
|
||||
color: #0f1724;
|
||||
font-weight: 600
|
||||
margin: 6px 0 12px;
|
||||
font-size: 36px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
letter-spacing: 1px;
|
||||
font-family: cursive;
|
||||
}
|
||||
|
||||
.sloagan {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
letter-spacing: 2px;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
@@ -129,6 +152,84 @@
|
||||
margin-top: 18px
|
||||
}
|
||||
|
||||
.popbox {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
z-index: 999999;
|
||||
}
|
||||
|
||||
.popbox .loading-box {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999999999;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
opacity: 0.7;
|
||||
|
||||
}
|
||||
|
||||
.popbox .loading-box.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.popbox .loading-box .loading {
|
||||
border: solid #e2e8f0;
|
||||
/* 浅灰色边框 */
|
||||
border-top-color: #165DFF;
|
||||
/* 蓝色顶部边框 */
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
/* 旋转动画 */
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
#sms-form {
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.toast {
|
||||
position: fixed;
|
||||
top: 20%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
color: #fff;
|
||||
padding: 10px 18px;
|
||||
border-radius: 8px;
|
||||
font-size: 15px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
z-index: 9999999999;
|
||||
}
|
||||
|
||||
.toast.show {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.toast.success {
|
||||
background-color: #09db45;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (max-width:520px) {
|
||||
.wrap {
|
||||
@@ -139,23 +240,399 @@
|
||||
justify-content: center
|
||||
}
|
||||
}
|
||||
|
||||
.weixin-loading {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
z-index: 99999;
|
||||
background-color: #fff;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.weixin-loading.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.weixin-loading .loading {
|
||||
border: solid #e2e8f0;
|
||||
/* 浅灰色边框 */
|
||||
border-top-color: #165DFF;
|
||||
/* 蓝色顶部边框 */
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
/* 旋转动画 */
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
* {
|
||||
touch-action: manipulation;
|
||||
/* 允许平移和捏合缩放，但禁用双击缩放和长按 */
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
/* 移除点击时的默认高亮（可选，优化体验） */
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: "Segoe UI", "PingFang SC", Arial, sans-serif;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
color: #333;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.stopBtn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0px 5px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
}
|
||||
|
||||
.area-select {
|
||||
width: 130px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input {
|
||||
/* flex: 1; */
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 获取验证码按钮 */
|
||||
.code-btn {
|
||||
border: none;
|
||||
/* border: 1px solid #1890ff; */
|
||||
background: white;
|
||||
padding: 5px 12px;
|
||||
border-radius: 6px;
|
||||
color: #1890ff;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
width: 135px;
|
||||
}
|
||||
|
||||
/* 登录按钮 */
|
||||
.login-btn {
|
||||
margin-top: 25px;
|
||||
width: 100%;
|
||||
background: #1890ff;
|
||||
color: white;
|
||||
padding: 12px 0;
|
||||
border-radius: 10px;
|
||||
border: none;
|
||||
font-size: 17px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* 协议 */
|
||||
.agreement {
|
||||
margin-top: 15px;
|
||||
font-size: 12px;
|
||||
color: #777;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
/* 微信登录 */
|
||||
.wechat-login {
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.wechat-login>div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
|
||||
}
|
||||
|
||||
.wechat-login img {
|
||||
width: 38px;
|
||||
display: block;
|
||||
margin: 0 auto 5px;
|
||||
}
|
||||
|
||||
/* 区号选择框 */
|
||||
.mask {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.area-box {
|
||||
background: #fff;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
|
||||
.area-item {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.area-item:hover {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.toggle-eye {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: #1677ff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.wechat-login {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.wechat-login span:nth-child(1) {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.popbox {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
z-index: 999999;
|
||||
}
|
||||
|
||||
.popbox .loading-box {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999999999;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
opacity: 0.7;
|
||||
|
||||
}
|
||||
|
||||
.popbox .loading-box.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.popbox .loading-box .loading {
|
||||
border: solid #e2e8f0;
|
||||
/* 浅灰色边框 */
|
||||
border-top-color: #165DFF;
|
||||
/* 蓝色顶部边框 */
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
/* 旋转动画 */
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
#sms-form {
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
|
||||
#sms-button {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
|
||||
.popup {
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
|
||||
width: 400px;
|
||||
|
||||
}
|
||||
|
||||
.popup h2 {
|
||||
margin-top: 0;
|
||||
font-size: 18px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
button {
|
||||
width: 100%;
|
||||
padding: 8px;
|
||||
margin: 5px 0;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
}
|
||||
|
||||
#popupForm input {
|
||||
border: 1px solid #ccc !important;
|
||||
width: 94%;
|
||||
}
|
||||
|
||||
.options {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.option {
|
||||
/* flex: 1 1 calc(50% - 5px); */
|
||||
width: 28%;
|
||||
text-align: center;
|
||||
padding: 8px;
|
||||
background: #f0f0f0;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.option.selected {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
button {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
|
||||
.popup {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- <div class="wrap" role="main" aria-labelledby="title">
|
||||
<div class="wrap" role="main" aria-labelledby="title">
|
||||
<div class="logo" aria-hidden>
|
||||
<img src="./img/logo.png" alt="飒沓 logo">
|
||||
</div>
|
||||
|
||||
|
||||
<h1 id="title">欢迎来到飒沓</h1>
|
||||
<h1 id="title">飒沓智能</h1>
|
||||
<p class="sloagan">沐光而立，顺风顺水</p>
|
||||
|
||||
|
||||
<div style="height:8px"></div> -->
|
||||
<div style="height:8px"></div>
|
||||
<div class="weixin-loading none">
|
||||
<div class="loading">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <label class="agree" for="agreeChk">
|
||||
|
||||
<!-- <label class="agree" for="agreeChk">
|
||||
<input type="checkbox" id="agreeChk" />
|
||||
<div style="line-height:1.35">已阅读并同意
|
||||
<a href="#" onclick="return false">服务协议</a>、
|
||||
@@ -165,13 +642,13 @@
|
||||
</label> -->
|
||||
|
||||
|
||||
<!-- <div>
|
||||
<!-- <div>
|
||||
<button id="loginBtn" class="btn" onclick="handlelogin()">授权登录</button>
|
||||
</div> -->
|
||||
|
||||
|
||||
<!-- <div class="subtle">使用微信扫码或微信内授权登录。为保障账号安全，请勿在不信任的设备上授权。</div> -->
|
||||
<!-- </div> -->
|
||||
<!-- <div class="subtle">使用微信扫码或微信内授权登录。为保障账号安全，请勿在不信任的设备上授权。</div> -->
|
||||
</div>
|
||||
<script>
|
||||
// 开启 vConsole 调试面板
|
||||
var vConsole = new VConsole();
|
||||
@@ -181,11 +658,32 @@
|
||||
|
||||
|
||||
const code = params.get("code");
|
||||
let countTimer;
|
||||
let userInfo = null;
|
||||
let userId;
|
||||
handleCode(code);
|
||||
handlelogin();
|
||||
|
||||
handlelogin()
|
||||
function handlelogin() {
|
||||
if (document.querySelector('.weixin-loading').classList.contains("none")) {
|
||||
document.querySelector('.weixin-loading').classList.remove("none");
|
||||
}
|
||||
if (code) return;
|
||||
|
||||
if (localStorage.getItem("userInfo") && localStorage.getItem("userId")) {
|
||||
const userId = localStorage.getItem("userId");
|
||||
const nickname = JSON.parse(localStorage.getItem("userInfo")).nickname;
|
||||
const imgurl = JSON.parse(localStorage.getItem("userInfo")).headimgurl;
|
||||
console.log(userId, nickname, imgurl);
|
||||
document.body.classList.add('fadeout');
|
||||
|
||||
// return;
|
||||
window.location.replace(`https://ai.satabot.com?userId=${userId}&headingimg=${imgurl}&nickname=${nickname}&t=${Date.now()}`);
|
||||
return;
|
||||
}
|
||||
|
||||
const APP_ID = 'wxa957108dae7d9048';
|
||||
const REDIRECT_URI = encodeURIComponent("https://ai.satabot.com");
|
||||
const REDIRECT_URI = encodeURIComponent("https://ai.satabot.com/middle.html");
|
||||
// const REDIRECT_URI = encodeURIComponent("https://ai.satabot.com/middle.html");
|
||||
const STATE = Math.random().toString(36).substring(2, 12);
|
||||
const SCOPE = 'snsapi_userinfo';
|
||||
@@ -194,21 +692,20 @@
|
||||
window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APP_ID}&redirect_uri=${REDIRECT_URI}&response_type=code&scope=${SCOPE}&state=${STATE}&connect_redirect=1#wechat_redirect`
|
||||
}
|
||||
function handleCode(code) {
|
||||
if (code) {
|
||||
console.log(code, "code");
|
||||
fetch(`https://servicestream.satabot.com/api/wechat/access_token?code=${code}`)
|
||||
.then(res => res.json())
|
||||
.then(res => {
|
||||
console.log(res.nickname)
|
||||
if (!code) return;
|
||||
retryFetch(`https://servicestream.satabot.com/api/wechat/access_token?code=${code}`)
|
||||
.then(res => {
|
||||
userInfo = res;
|
||||
localStorage.setItem("userInfo", JSON.stringify(res));
|
||||
getUserByOpenId(res.openid)
|
||||
}).catch(() => {
|
||||
if (!document.querySelector('.weixin-loading').classList.contains("none")) {
|
||||
document.querySelector('.weixin-loading').classList.add("none");
|
||||
}
|
||||
}).finally(() => {
|
||||
|
||||
openId = res.openid;
|
||||
userId = res.openid;
|
||||
getUserByOpenId(res.openid)
|
||||
})
|
||||
|
||||
});
|
||||
} else {
|
||||
return; // ✅ 没问题，直接退出函数
|
||||
}
|
||||
}
|
||||
|
||||
function getUserByOpenId(id) {
|
||||
@@ -230,8 +727,12 @@
|
||||
showpop(); // 弹出验证码
|
||||
} else if (res.code == 200) {
|
||||
setCookie('token', res.token);
|
||||
userId = res.userId;
|
||||
getSessionList();
|
||||
const encodedUserId = btoa(unescape(encodeURIComponent(res.userId)));
|
||||
localStorage.setItem('userId', encodedUserId);
|
||||
const t = Date.now();
|
||||
document.body.classList.add('fadeout');
|
||||
|
||||
window.location.replace(`https://ai.satabot.com?userId=${encodedUserId}&headingimg=${userInfo.headimgurl}&nickname=${userInfo.nickname}&t=${t}`)
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
@@ -239,10 +740,11 @@
|
||||
showToast("网络异常，请稍后再试");
|
||||
})
|
||||
.finally(() => {
|
||||
if (!document.querySelector(".weixin-loading").classList.contains("none")) {
|
||||
document.querySelector(".weixin-loading").classList.add("none");
|
||||
}
|
||||
|
||||
console.log("登录请求结束");
|
||||
if (!document.querySelector('.weixin-loading').classList.contains("none")) {
|
||||
document.querySelector('.weixin-loading').classList.add("none");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -266,6 +768,181 @@
|
||||
}
|
||||
throw lastError;
|
||||
}
|
||||
function setCookie(name, value, days = 7) {
|
||||
const d = new Date();
|
||||
d.setTime(d.getTime() + days * 24 * 60 * 60 * 1000);
|
||||
const expires = "expires=" + d.toUTCString();
|
||||
document.cookie = `${name}=${encodeURIComponent(value)}; ${expires}; path=/`;
|
||||
}
|
||||
function getCookie(name) {
|
||||
const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
|
||||
if (match) return decodeURIComponent(match[2]);
|
||||
return null;
|
||||
}
|
||||
function showpop() {
|
||||
let html = `<div class='popbox'>
|
||||
|
||||
<div class="form sms-form" id="sms-form">
|
||||
<div class="loading-box none">
|
||||
<div class="loading"></div>
|
||||
|
||||
</div>
|
||||
<h2 style='margin:0px'>欢迎使用光伏运维智能体</h2>
|
||||
<p style='color:#666;margin:13px 0px;'>请先绑定手机号</p>
|
||||
|
||||
<div class="input-group">
|
||||
<div class="area-select" onclick="showAreaSelect()">
|
||||
<span id="areaText">中国大陆 +86</span>
|
||||
</div>
|
||||
<input id="sys-phone" type="text" placeholder="请输入手机号">
|
||||
</div>
|
||||
|
||||
<!-- 验证码登录 -->
|
||||
<div id="codeLogin" class="input-group">
|
||||
<input id="code" type="text" placeholder="请输入验证码">
|
||||
<button class="code-btn" id="send-code" onclick="getSms()">获取验证码</button>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button type="button" class="button button-primary" id="sms-button" onclick="bindToLogin()">
|
||||
<!-- <i class="fas fa-user-plus mr-2"></i> -->
|
||||
绑定
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
</div></div>`;
|
||||
|
||||
document.body.insertAdjacentHTML('beforeend', html);
|
||||
}
|
||||
|
||||
function showToast(message, type = '') {
|
||||
// 创建元素
|
||||
const toast = document.createElement("div");
|
||||
toast.className = `toast${type == "success" ? " success" : ""}`;
|
||||
toast.innerText = message;
|
||||
document.body.appendChild(toast);
|
||||
|
||||
// 显示
|
||||
setTimeout(() => {
|
||||
toast.classList.add("show");
|
||||
}, 10);
|
||||
|
||||
// 2 秒后自动消失
|
||||
setTimeout(() => {
|
||||
toast.classList.remove("show");
|
||||
setTimeout(() => toast.remove(), 300); // 动画结束后移除
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
function getSms() {
|
||||
document.getElementById('send-code').textContent = "60s";
|
||||
let remainSeconds = 60;
|
||||
countTimer = setInterval(() => {
|
||||
if (remainSeconds > 0) {
|
||||
remainSeconds--;
|
||||
document.getElementById('send-code').textContent = `${remainSeconds}s`;
|
||||
document.getElementById('send-code').disabled = true;
|
||||
} else {
|
||||
clearInterval(countTimer);
|
||||
countTimer = null;
|
||||
document.getElementById('send-code').textContent = "获取验证码";
|
||||
document.getElementById('send-code').disabled = false;
|
||||
}
|
||||
}, 1000)
|
||||
const phonenumber = document.getElementById('sys-phone').value;
|
||||
const bindParams = {
|
||||
phoneNumbers: phonenumber,
|
||||
}
|
||||
retryFetch("https://serviceri.satabot.com/external/sms/sendAliSmsCode", {
|
||||
method: "POST", // 必选：指定请求方法为 POST
|
||||
headers: {
|
||||
"Content-Type": "application/json", // 声明请求体是 JSON 格式
|
||||
// 可选：如果接口需要 Token 前置验证，可添加 Authorization 头
|
||||
// "Authorization": "Bearer 你的前置 Token"
|
||||
},
|
||||
// 必选：请求体，将参数对象转为 JSON 字符串（不能直接传对象）
|
||||
body: JSON.stringify(bindParams)
|
||||
}).then(res => {
|
||||
showToast("验证码发送成功");
|
||||
if (res.code == 200) {
|
||||
// showToast("验证码发送成功");
|
||||
|
||||
} else {
|
||||
// showToast(res.msg + "yanzssahnegma");
|
||||
// clearInterval(countTimer);
|
||||
// countTimer = null;
|
||||
// document.getElementById('send-code').textContent = "获取验证码";
|
||||
// document.getElementById('send-code').disabled = false;
|
||||
// return;
|
||||
}
|
||||
console.log(res);
|
||||
}).catch(err => {
|
||||
showToast(err + "验证码发送失败");
|
||||
clearInterval(countTimer);
|
||||
countTimer = null;
|
||||
document.getElementById('send-code').textContent = "获取验证码";
|
||||
document.getElementById('send-code').disabled = false;
|
||||
return;
|
||||
})
|
||||
}
|
||||
function unshowpop() {
|
||||
if (countTimer) {
|
||||
clearInterval(countTimer);
|
||||
}
|
||||
const popbox = document.querySelector('.popbox');
|
||||
if (popbox) {
|
||||
popbox.remove();
|
||||
}
|
||||
}
|
||||
function bindToLogin() {
|
||||
document.querySelector('.popbox .loading-box').classList.remove('none');
|
||||
const data = {
|
||||
sourceType: 5,
|
||||
openId: userInfo.openid,
|
||||
phonenumber: document.getElementById('sys-phone').value,
|
||||
smsCode: document.getElementById('code').value
|
||||
}
|
||||
retryFetch("https://serviceri.satabot.com/login", {
|
||||
// fetch("/api/remote/login", {
|
||||
method: "POST", // 必选：指定请求方法为 POST
|
||||
headers: {
|
||||
"Content-Type": "application/json", // 声明请求体是 JSON 格式
|
||||
// 可选：如果接口需要 Token 前置验证，可添加 Authorization 头
|
||||
// "Authorization": "Bearer 你的前置 Token"
|
||||
},
|
||||
// 必选：请求体，将参数对象转为 JSON 字符串（不能直接传对象）
|
||||
body: JSON.stringify(data)
|
||||
}).then(res => {
|
||||
console.log(res, "绑定信息")
|
||||
if (res.code == 200) {
|
||||
if (document.querySelector('.popbox .loading-box')) {
|
||||
document.querySelector('.popbox .loading-box').classList.add('none');
|
||||
}
|
||||
userId = res.userId;
|
||||
setCookie('token', res.token);
|
||||
unshowpop();
|
||||
const encodedUserId = btoa(unescape(encodeURIComponent(res.userId)));
|
||||
localStorage.setItem("userId", encodedUserId)
|
||||
const t = Date.now();
|
||||
document.body.classList.add('fadeout');
|
||||
|
||||
window.location.replace(`https://ai.satabot.com?userId=${encodedUserId}&headingimg=${userInfo.headimgurl}&nickname=${userInfo.nickname}&t=${t}`)
|
||||
}
|
||||
|
||||
|
||||
}).catch(err => {
|
||||
|
||||
console.error("请求异常:", err);
|
||||
showToast("登录失败，请重试" + err); // 给用户友好提示
|
||||
})
|
||||
.finally(() => {
|
||||
unshowpop();
|
||||
if (document.querySelector('.popbox .loading-box')) {
|
||||
document.querySelector('.popbox .loading-box').classList.add('none');
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
|
||||
Reference in New Issue
Block a user