Files
aggregate_translate_website/login.html

383 lines
13 KiB
HTML
Raw Normal View History

2025-07-02 18:32:06 +08:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="baidu-site-verification" content="codeva-bhaFvYlfgd" />
<meta
name="keywords"
content="deepl、deepl翻译、百度翻译、谷歌翻译、腾讯翻译君"
/>
<meta
name="description"
content="聚合翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
/>
<meta name="baidu-site-verification" content="codeva-mXz3BqI9VN" />
<link rel="stylesheet" href="static/css/public.css" />
<link rel="stylesheet" href="static/css/layui.css" />
<script src="static/js/jquery-1.11.0.min.js"></script>
<script src="static/js/axios.min.js"></script>
<script src="static/js/countUp.min.js"></script>
<script src="static/js/vue.js"></script>
<script src="static/js/lodash.min.js"></script>
<script src="static/js/layui.all.js"></script>
<script src="static/js/common.js"></script>
<title>聚合翻译</title>
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?c4e0dd6add63dd71fa52870120ca22cf";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body >
<div class="public-header normal" id="main">
<div class="container clearfix">
<div class="left">
<img class="logo default" src="static/picture/logo.png" alt="" /><img
class="logo1 default"
src="static/picture/logo1.png"
alt=""
/><img class="logo light" src="static/picture/logow.png" alt="" /><img
class="logo1 light"
src="static/picture/logo1w.png"
alt=""
/>
<div class="nav">
<a class="" href="index.html"><span>首页</span></a
><a class="" href="onlineTranslation.html"><span>文本翻译</span></a
><a class="" href="voice.html"><span>语音翻译</span></a
><a class="" href="api.html"><span>API文档</span></a
><a class="" href="commonProblems.html"><span>常见问题</span></a>
</div>
</div>
<div v-if="userInfo&&userInfo.id" class="right">
<a href="userinfo.html" class="console">控制台</a>
<div class="user-info">
<div class="phone">13809073722</div>
<i></i>
<div class="log-out">退出</div>
</div>
</div>
<div v-else class="right"><a class="unlogin" href="login.html">登录</a></div>
</div>
<div class="bg"></div>
</div>
<script type="text/javascript">
var vm = new Vue({
el: "#main",
data() {
return {};
},
mounted() {},
methods: {
logOut() {
axios.get("/api/translate/logOut").then((response) => {
location.reload();
});
},
},
});
</script>
<div id="app">
<div class="page-login" v-if="type == 0">
<div class="w1200">
<div class="left"></div>
<div class="right">
<img src="static/picture/logo3x.png" alt="" />
<h3>登录</h3>
<div class="form-group">
<div class="form-item">
<div class="label">账号</div>
<!-- <span class="pre">+86</span> -->
<input class="form-input" placeholder="请输入" v-model="tel"/>
</div>
<div class="form-item">
<div class="label">密码</div>
<input
class="form-input"
type="password"
placeholder="请输入"
v-model="password"
/>
</div>
<div class="form-item">
<div class="label">验证码</div>
<input
class="form-input captcha-input" v-model="code" placeholder="请输入验证码"></input>
<div class="code-col captcha-container" @click="getCode" style="height: 100%;">
<img :src="captcha" class="captcha-img" />
</div>
</div>
<div class="login" @click="login()">登录</div>
<!-- <div class="more">
<a href="javascript:;" @click="type=1">注册</a>
<a href="javascript:;" @click="type=2 ">找回密码</a>
</div> -->
<div
class="rule"
style="
font-size: 15px;
text-align: center;
padding-top: 13px;
color: #666;
"
>
登录即代表您同意并遵守<a
target="_blank"
href="static/file/rule.pdf"
>《隐私协议》</a
>
</div>
</div>
</div>
</div>
</div>
<div class="page-login find-password" v-if="type == 1">
<div class="w1200">
<div class="left"></div>
<div class="right">
<img src="static/picture/p20.png" alt="" />
<h3>注册</h3>
<div class="form-group">
<div class="form-item">
<div class="label">手机号</div>
<span class="pre">+86</span
><input class="form-input" type="number" v-model="tel" />
</div>
<div class="form-item form-code">
<div class="label">验证码</div>
<input
class="form-input"
type="number"
placeholder="4位数验证码"
v-model="code"
/>
<div class="code-col" @click="getCode">{{ codeText }}</div>
</div>
<div class="form-item">
<div class="label">密码</div>
<input
class="form-input"
type="password"
placeholder="至少8位字母或数字的组合"
v-model="password"
/>
</div>
<div class="form-item">
<div class="label">确认密码</div>
<input
class="form-input"
type="password"
placeholder="至少8位字母或数字的组合"
v-model="surepassword"
/>
</div>
<div class="login" @click="register()">确定</div>
<div class="login-now">
<a href="javascript:;" @click="type=0">登录</a>
</div>
</div>
</div>
</div>
</div>
<div class="page-login find-password" v-if="type == 2">
<div class="w1200">
<div class="left"></div>
<div class="right">
<img src="static/picture/p20.png" alt="" />
<h3>登录</h3>
<div class="form-group">
<div class="form-item">
<div class="label">手机号</div>
<span class="pre">+86</span
><input class="form-input" type="number" v-model="tel" />
</div>
<div class="form-item form-code">
<div class="label">验证码</div>
<input
class="form-input"
type="number"
placeholder="4位数验证码"
v-model="code"
/>
<div class="code-col" @click="getCode">{{ codeText}}</div>
</div>
<div class="form-item">
<div class="label">密码</div>
<input
class="form-input"
type="password"
placeholder="至少8位字母或数字的组合"
v-model="password"
/>
</div>
<div class="form-item">
<div class="label">确认密码</div>
<input
class="form-input"
type="password"
placeholder="至少8位字母或数字的组合"
v-model="surepassword"
/>
</div>
<div class="login" @click="register()">确定</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var vm = new Vue({
el: "#app",
data() {
return {
tel: "",
password: "",
code:"",
uuid:"",
type: 0,
isCanClick: true,
count: 60,
timer: undefined,
codeText: "发送验证码",
code: "",
surepassword: "",
captcha:"",
};
},
beforeCreate(){
let token = localStorage.getItem("token");
if(token){
location.href="userinfo.html"
}
},
mounted() {
this.getCode();
},
methods: {
login() {
var pattern = /^1[0-9]{10}$/;
if (this.password) {
axios
.post("/login", {
username: this.tel,
password: this.password,
code:this.code,
uuid:this.uuid,
rememberMe: false,
})
.then((response) => {
if (response.data.code == 200) {
localStorage.setItem("token", response.data.token);
location.href="userinfo.html"
} else {
layer.msg(response.data.msg);
}
});
} else {
layer.msg("密码不能为空");
}
},
getCode() {
const that = this;
axios
.get("/captcha")
.then((response) => {
if (response.data.code == 200) {
that.isCanClick = false;
that.captcha=response.data.data;
this.uuid=response.data.id;
} else {
that.isCanClick = 1;
layer.msg(response.data.msg);
}
});
},
register() {
var pattern = /^1[0-9]{10}$/;
if (!pattern.test(this.tel)) {
layer.msg("手机号码有误!");
return;
}
if (!$.trim(this.password)) {
layer.msg("密码不能为空");
return;
}
if (this.password != this.surepassword) {
layer.msg("两次密码不一致,请重新输入");
return;
}
if (!this.code) {
layer.msg("验证码不能为空");
return;
}
axios
.post("/api/translate/register", {
tel: this.tel,
password: this.password,
code: this.code,
type: this.type,
})
.then((response) => {
if (response.data.code == 200) {
} else {
layer.msg(response.data.msg);
}
});
},
},
});
</script>
<div class="public-footer">
<div class="w1200">
<div class="left"><img src="static/picture/logo.png" alt="" /></div>
<div
style="
flex-direction: column;
line-height: 23px;
padding-left: 100px;
color: #fff;
font-size: 12px;
"
>
<p style="color: #fff; font-size: 12px"><span>官方频道:@apiapl_news</span></p>
<p style="color: #fff; font-size: 12px"><span>咨询客服:@apiapl</span></p>
<span></span>
</p>
</div>
<div class="right" style="white-space: nowrap">
<p></p>
<p><span>技术服务:@apiapl_sdk</span></p>
<p><span>联系邮箱info@apiapl.com</span></p>
<p class=""><span>联系电话:+18435173355 </span></p>
</div>
</div>
<div class="copyright">
<a href="https://beian.miit.gov.cn/" target="blank"></a>
</div>
</div>
<style>
.captcha-input{
width: 260px !important;
}
.captcha-container{
cursor: pointer;
}
.captcha-img{
max-width: 100%;
max-height: 100%;
}
</style>
</body>
</html>