1

api.html

@@ -11,7 +11,7 @@
     />
     <meta
       name="description"
-      content="翻译之家提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
+      content="聚合翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
     />
     <meta name="baidu-site-verification" content="codeva-mXz3BqI9VN" />
     <link rel="stylesheet" href="static/css/public.css" />
@@ -23,7 +23,7 @@
     <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>
+    <title>聚合翻译</title>
     <script>
       var _hmt = _hmt || [];
       (function () {
@@ -56,7 +56,7 @@
           </div>
         </div>
         <div v-if="userInfo!=undefined&&userInfo.userId>0" class="right">
-          <a href="userInfo.html" class="console">控制台</a>
+          <a href="userinfo.html" class="console">控制台</a>
           <div class="user-info">
             <div class="phone">{{userInfo.name}}</div>
             <i></i>
@@ -177,13 +177,13 @@
             </li>
           </ul>
         </div>
-        <!--<div class="p1 content">--><!--    <h3>翻译之家API</h3>--><!--    <p>翻译之家为你提供主流翻译引擎机器翻译技术</p>--><!--    <div class="line"></div>--><!--    <div class="w1">为什么选择翻译之家？</div>--><!--    <div class="w2">我们是主流翻译引擎综合代理服务商，汇集众多企业客户，从而可以享受较低的渠道价格。</div>--><!--</div>-->
+        <!--<div class="p1 content">--><!--    <h3>聚合翻译API</h3>--><!--    <p>聚合翻译为你提供主流翻译引擎机器翻译技术</p>--><!--    <div class="line"></div>--><!--    <div class="w1">为什么选择聚合翻译？</div>--><!--    <div class="w2">我们是主流翻译引擎综合代理服务商，汇集众多企业客户，从而可以享受较低的渠道价格。</div>--><!--</div>-->
         <div class="p2 content">
           <div class="w1">介绍</div>
-          <!--<h3 data="介绍">翻译之家API</h3>-->
-          <p>翻译之家为你提供主流翻译引擎机器翻译技术</p>
+          <!--<h3 data="介绍">聚合翻译API</h3>-->
+          <p>聚合翻译为你提供主流翻译引擎机器翻译技术</p>
           <div class="line"></div>
-          <div class="w1">为什么选择翻译之家？</div>
+          <div class="w1">为什么选择聚合翻译？</div>
           <div class="w2">
             我们是主流翻译引擎综合代理服务商，汇集众多企业客户，从而可以享受较低的渠道价格。
           </div>

commonProblems.html

@@ -11,7 +11,7 @@
     />
     <meta
       name="description"
-      content="翻译之家提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
+      content="聚合翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
     />
     <meta name="baidu-site-verification" content="codeva-mXz3BqI9VN" />
     <link rel="stylesheet" href="static/css/public.css" />
@@ -23,7 +23,7 @@
     <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>
+    <title>聚合翻译</title>
     <script>
       var _hmt = _hmt || [];
       (function () {
@@ -56,7 +56,7 @@
           </div>
         </div>
         <div v-if="userInfo!=undefined&&userInfo.userId>0" class="right">
-          <a href="userInfo.html" class="console">控制台</a>
+          <a href="userinfo.html" class="console">控制台</a>
           <div class="user-info">
             <div class="phone">{{userInfo.name}}</div>
             <i></i>
@@ -131,7 +131,7 @@
             <div class="title">服务</div>
             <ul>
               <li>
-                <div class="q">翻译之家是如何服务客户的？</div>
+                <div class="q">聚合翻译是如何服务客户的？</div>
                 <div class="a">
                   我们是一个聚合翻译服务商，聚合主流的翻译公司接口，提供更便宜、多样化的翻译服务。
                 </div>
@@ -200,17 +200,17 @@
             font-size: 12px;
           "
         >
-          <p style="color: #fff; font-size: 12px"><span>关于我们：</span></p>
-          <p style="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>联系我们：</span></p>
-          <p><span>地址：</span></p>
-          <p><span></span></p>
-          <p class=""><span>电话: </span></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">

index.html

@@ -11,7 +11,7 @@
     />
     <meta
       name="description"
-      content="翻译之家提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
+      content="聚合翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译等服务。"
     />
     <meta name="baidu-site-verification" content="codeva-mXz3BqI9VN" />
     <link rel="stylesheet" href="static/css/public.css" />
@@ -23,7 +23,7 @@
     <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>
+    <title>聚合翻译</title>
     <script>
       var _hmt = _hmt || [];
       (function () {
@@ -56,7 +56,7 @@
           </div>
         </div>
         <div v-if="userInfo!=undefined&&userInfo.userId>0" class="right">
-          <a href="userInfo.html" class="console">控制台</a>
+          <a href="userinfo.html" class="console">控制台</a>
           <div class="user-info">
             <div class="phone">{{userInfo.name}}</div>
             <i></i>
@@ -214,7 +214,7 @@
             <li class="row-info">
               <div class="item">谷歌翻译-V2/V3</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">60（微信咨询，领取折扣）</div>
+              <div class="item">60（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
                 5.5折（20美元）<img src="static/picture/p7.png" alt="" />
@@ -223,7 +223,7 @@
             <li class="row-info">
               <div class="item">百度翻译-企业版本</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">25（微信咨询，领取折扣）</div>
+              <div class="item">25（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
                 5折（50元）<img src="static/picture/p7.png" alt="" />
@@ -232,16 +232,16 @@
             <li class="row-info">
               <div class="item">有道翻译</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">25（微信咨询，领取折扣）</div>
+              <div class="item">25（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
-                5折（50元）<img src="static/picture/p7.png" alt="" />
+                5折<img src="static/picture/p7.png" alt="" />
               </div>
             </li>
             <li class="row-info">
               <div class="item">微软翻译</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">60（微信咨询，领取折扣）</div>
+              <div class="item">60（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
                 8.2折（10美元）<img src="static/picture/p7.png" alt="" />
@@ -250,16 +250,16 @@
             <li class="row-info">
               <div class="item">火山翻译</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">25（微信咨询，领取折扣）</div>
+              <div class="item">25（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
-                5折（50元）<img src="static/picture/p7.png" alt="" />
+                5折<img src="static/picture/p7.png" alt="" />
               </div>
             </li>
             <li class="row-info">
               <div class="item">chatgpt翻译</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">50（微信咨询，领取折扣）</div>
+              <div class="item">50（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
                 5折（100元）<img src="static/picture/p7.png" alt="" />
@@ -268,7 +268,7 @@
             <li class="row-info">
               <div class="item">yandex翻译</div>
               <div class="item">按调用字符计费</div>
-              <div class="item">25（微信咨询，领取折扣）</div>
+              <div class="item">25（电报咨询，领取折扣）</div>
               <div class="item">5～1000（支持扩展）</div>
               <div class="item">
                 8.3折（30元）<img src="static/picture/p7.png" alt="" />
@@ -481,11 +481,11 @@
         <div class="ctr">
           <div class="item">
             <img src="static/picture/p25.png" alt="" />
-            <div>微信咨询</div>
+            <div>电报咨询</div>
             <div class="detail wechat">
-              <h5>微信咨询</h5>
+              <h5>电报咨询</h5>
               <img src="static/picture/p23.jpg" alt="" />
-              <p>手机扫码加我微信</p>
+              <p>手机扫码加我电报</p>
             </div>
           </div>
           <div class="line"></div>
@@ -494,13 +494,13 @@
             <div>电话咨询</div>
             <div class="detail">
               <h5>电话咨询</h5>
-              <div class="phone">13327906119</div>
+              <div class="phone">+18435173355</div>
             </div>
           </div>
         </div>
       </div>
     </div>
-    <!-- <div class="service-modal"><div class="content"><div class="close"></div><div class="contact">联系我们</div><img class="qrcode-img" src="https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p23.jpg" alt=""><p>请添加专属营销顾问</p></div></div> -->
+    <!-- <div class="service-modal"><div class="content"><div class="close"></div><div class="contact">联系我们</div><img class="qrcode-img" src="/static/picture/p23.jpg" alt=""><p>请添加专属营销顾问</p></div></div> -->
     <script type="text/javascript">
       var vm = new Vue({
         el: "#app",
@@ -688,17 +688,17 @@
             font-size: 12px;
           "
         >
-          <p style="color: #fff; font-size: 12px"><span>关于我们：</span></p>
-          <p style="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>联系我们：</span></p>
-          <p><span>地址：</span></p>
-          <p><span>邮箱：</span></p>
-          <p class=""><span>电话: </span></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">

login.html

@@ -1,382 +1,382 @@
-<!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>关于我们：</span></p>
-          <p style="color: #fff; font-size: 12px">
-            <span></span>
-          </p>
-        </div>
-        <div class="right" style="white-space: nowrap">
-          <p></p>
-          <p><span>联系我们：</span></p>
-          <p><span>地址：</span></p>
-          <p><span>邮箱：</span></p>
-          <p class=""><span>电话: </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>
+<!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>

onlineTranslation.html

@@ -1,451 +1,451 @@
-<!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="active" href=""><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!=undefined&&userInfo.userId>0" class="right">
-          <a href="userInfo.html" class="console">控制台</a>
-          <div class="user-info">
-            <div class="phone">{{userInfo.name}}</div>
-            <i></i>
-            <div class="log-out" @click="logOut">退出</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 {
-            userInfo: {},
-            token: "",
-          };
-        },
-        created() {},
-        mounted() {
-          let token = localStorage.getItem("token");
-          if (token) {
-            this.token = token;
-            this.getUserInfo(token);
-          } else {
-            // location.href = "login.html";
-          }
-        },
-        methods: {
-          logOut() {
-            axios
-              .post("/logout", {
-                headers: {
-                  Authorization: `Bearer ${this.token}`,
-                },
-              })
-              .then((response) => {
-                localStorage.removeItem("token");
-                location.reload();
-              });
-          },
-
-          getUserInfo(token) {
-            let that = this;
-            axios
-              .get("/getinfo", {
-                headers: {
-                  Authorization: `Bearer ${this.token}`,
-                },
-              })
-              .then((response) => {
-                if (response.data.code === 200) {
-                  this.userInfo = response.data.data;
-                  console.log("userinfo", this.userInfo);
-                } else {
-                  localStorage.removeItem("token");
-                  location.href = "login.html";
-                }
-              });
-          },
-        },
-      });
-    </script>
-    <div class="page-translation" id="app">
-      <div class="w1200">
-        <div class="translation-engine">
-          <div
-            v-for="item in engineType"
-            :key="item.key"
-            class="item"
-            :class="{ on: engine.key == item.key }"
-            @click="onSelectEngine(item)"
-          >
-            <img :src="item.icon" alt="" />
-          </div>
-        </div>
-        <div class="translation-row">
-          <div class="translation-language" @mouseleave="languageShow = false">
-            <div
-              class="source"
-              @mouseenter="() => onShowLanguage('100px', true, 'sourceLanguage')"
-            >
-              {{ sourceLanguage.name }}
-              <div class="icon select-icon"></div>
-            </div>
-            <div
-              class="target"
-              @mouseenter="() => onShowLanguage('620px', true, 'targetLanguage')"
-            >
-              <div class="icon switch-icon" @click="onSwitch"></div>
-              {{ targetLanguage.name }}
-              <div class="icon select-icon"></div>
-            </div>
-            <div
-              class="language-row"
-              :class="{ show: languageShow }"
-              :style="{ left: languageRowLeft }"
-            >
-              <div class="search">
-                <i class="icon"></i
-                ><input
-                  type="text"
-                  class="search-input"
-                  v-model="serachKeywords"
-                  placeholder="搜索你想要的"
-                />
-              </div>
-              <div class="row">
-                <div
-                  v-for="(k, v) in languageCurrent"
-                  :key="v"
-                  :value="v"
-                  class="col"
-                  @click="onSelectLanguage(v)"
-                  :class="{ on: sourceLanguage.key == v || targetLanguage.key == v }"
-                >
-                  <span>{{ k }}</span>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div class="translation-text">
-            <div class="source">
-              <textarea
-                cols="30"
-                rows="10"
-                v-model="sourceText"
-                placeholder="输入文字，即可翻译"
-              ></textarea>
-            </div>
-            <div class="target">
-              <textarea
-                disabled
-                cols="30"
-                rows="10"
-                v-model="targetText"
-              ></textarea>
-              <div class="loading" v-if="isLoading">
-                <img class="icon" src="static/picture/p17.png" alt="" />
-                <div>Loading...</div>
-              </div>
-              <div v-if="targetText" class="copy" @click="copy">复制</div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <script src="static/js/lodash.min.js"></script>
-    <script type="text/javascript">
-      const CancelToken = axios.CancelToken;
-      let source = CancelToken.source();
-      new Vue({
-        el: "#app",
-        data() {
-          return {
-            engine: {},
-            engineType: [
-              {
-                key: "deepl",
-                value: 0,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p2.png",
-              },
-              {
-                key: "google",
-                value: 1,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p3.png",
-              },
-              {
-                key: "baidu",
-                value: 2,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p4.png",
-              },
-              {
-                key: "youdao",
-                value: 3,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/youdao.png",
-              },
-              {
-                key: "bing",
-                value: 4,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/bing.png",
-              },
-              {
-                key: "huoshan",
-                value: 5,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/huoshan.png",
-              },
-              {
-                key: "chatgpt",
-                value: 6,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/openai.png",
-              },
-              {
-                key: "yandex",
-                value: 7,
-                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/yandex.png",
-              },
-            ],
-            sourceLanguage: {
-              key: "auto",
-              name: "自动检测",
-            },
-            targetLanguage: {
-              key: "ZH",
-              name: "中文（简体）",
-            },
-            sourceText: "",
-            targetText: "",
-            serachKeywords: "",
-            languageShow: false,
-            languageRowLeft: "100px",
-            languageTotalData: {},
-            isLoading: false,
-          };
-        },
-        created() {
-          this.engine = this.engineType[0];
-          this.getLanguage();
-        },
-        mounted() {
-          let token = localStorage.getItem("token");
-          if (token) {
-            this.token = token;
-            this.getUserInfo(token);
-          } else {
-            // location.href = "login.html";
-          }
-        },
-        watch: {
-          sourceText(v) {
-            if (v) {
-              // _.debounce(this.translate, 500)
-              this.translate();
-            } else {
-              source.cancel("取消请求");
-              this.targetText = "";
-            }
-          },
-        },
-        computed: {
-          languageCurrent() {
-            const current = this.languageTotalData[this.engine.key];
-            const copyCurrent = {};
-            if (this.serachKeywords) {
-              Object.keys(current).forEach((key) => {
-                // console.log('current[key]', current[key])
-                if (current[key].indexOf(this.serachKeywords) > -1) {
-                  copyCurrent[key] = current[key];
-                }
-              });
-              return copyCurrent;
-            }
-            return this.languageTotalData[this.engine.key];
-          },
-        },
-        methods: {
-          copy() {
-            // 模拟 输入框
-            var cInput = document.createElement("input");
-            cInput.value = this.targetText;
-            document.body.appendChild(cInput);
-            cInput.select(); // 选取文本框内容
-
-            // 执行浏览器复制命令
-            // 复制命令会将当前选中的内容复制到剪切板中（这里就是创建的input标签）
-            // Input要在正常的编辑状态下原生复制方法才会生效
-
-            document.execCommand("copy");
-            layer.msg("复制成功");
-            // 复制成功后再将构造的标签 移除
-            document.body.removeChild(cInput);
-          },
-          onShowLanguage(left, boolean, key) {
-            this.languageRowLeft = left ? left : "100px";
-            this.languageShow = boolean;
-            this.currentKey = key;
-          },
-          onSelectEngine(e) {
-            this.engine = e;
-            const firstEntry = Object.entries(this.languageCurrent)[0];
-            this.targetLanguage = {
-              key: firstEntry[0],
-              name: this.languageCurrent[firstEntry[0]],
-            };
-            this.translate();
-          },
-          getLanguage() {
-            axios.get("/api/translate/getLanguages").then((res) => {
-              if (res.data.code == 1) {
-                this.languageTotalData = res.data.data;
-              }
-            });
-          },
-          translate: _.debounce(function () {
-            source.cancel("取消请求");
-            source = axios.CancelToken.source();
-            const that = this;
-            if (!this.sourceText) {
-              that.targetText = "";
-              return;
-            }
-            this.isLoading = true;
-            axios
-              .post(
-                "/api/translate/index",
-                {
-                  keywords: this.sourceText,
-                  targetLanguage: this.targetLanguage.key,
-                  type: this.engine.value, // 0 :deepl, 1:谷歌 2:百度
-                },
-                { cancelToken: source.token }
-              )
-              .then(function (res) {
-                console.log(res.data.data.text);
-                if (res.data.code == 1) {
-                  that.targetText = res.data.data.text;
-                  if (!this.sourceText) {
-                    this.targetText = "";
-                  }
-                } else {
-                  that.targetText = "";
-                  layer.msg(res.data.info);
-                }
-              })
-              .catch(function (err) {
-                console.log(err);
-              })
-              .finally(() => {
-                this.isLoading = false;
-              });
-          }, 800),
-          onSelectLanguage(e) {
-            this[this.currentKey] = {
-              key: e,
-              name: this.languageCurrent[e],
-            };
-            this.languageShow = false;
-            this.translate();
-          },
-          onSwitch() {
-            const copySource = JSON.parse(JSON.stringify(this.sourceLanguage));
-            const copyTarget = JSON.parse(JSON.stringify(this.targetLanguage));
-            this.targetLanguage = copySource;
-            this.sourceLanguage = copyTarget;
-          },
-          onInput(e) {
-            if (this.sourceText) {
-              // _.debounce(this.translate, 500)
-              this.translate();
-            } else {
-              this.targetText = "";
-            }
-          },
-        },
-      });
-    </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>关于我们：</span></p>
-          <p style="color: #fff; font-size: 12px">
-            <span></span>
-          </p>
-        </div>
-        <div class="right" style="white-space: nowrap">
-          <p></p>
-          <p><span>联系我们：</span></p>
-          <p><span>地址：</span></p>
-          <p><span></span></p>
-          <p class=""><span>电话: </span></p>
-        </div>
-      </div>
-      <div class="copyright">
-        <a href="https://beian.miit.gov.cn/" target="blank"
-          ></a
-        >
-      </div>
-    </div>
-  </body>
-</html>
+<!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="active" href=""><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!=undefined&&userInfo.userId>0" class="right">
+          <a href="userinfo.html" class="console">控制台</a>
+          <div class="user-info">
+            <div class="phone">{{userInfo.name}}</div>
+            <i></i>
+            <div class="log-out" @click="logOut">退出</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 {
+            userInfo: {},
+            token: "",
+          };
+        },
+        created() {},
+        mounted() {
+          let token = localStorage.getItem("token");
+          if (token) {
+            this.token = token;
+            this.getUserInfo(token);
+          } else {
+            // location.href = "login.html";
+          }
+        },
+        methods: {
+          logOut() {
+            axios
+              .post("/logout", {
+                headers: {
+                  Authorization: `Bearer ${this.token}`,
+                },
+              })
+              .then((response) => {
+                localStorage.removeItem("token");
+                location.reload();
+              });
+          },
+
+          getUserInfo(token) {
+            let that = this;
+            axios
+              .get("/getinfo", {
+                headers: {
+                  Authorization: `Bearer ${this.token}`,
+                },
+              })
+              .then((response) => {
+                if (response.data.code === 200) {
+                  this.userInfo = response.data.data;
+                  console.log("userinfo", this.userInfo);
+                } else {
+                  localStorage.removeItem("token");
+                  location.href = "login.html";
+                }
+              });
+          },
+        },
+      });
+    </script>
+    <div class="page-translation" id="app">
+      <div class="w1200">
+        <div class="translation-engine">
+          <div
+            v-for="item in engineType"
+            :key="item.key"
+            class="item"
+            :class="{ on: engine.key == item.key }"
+            @click="onSelectEngine(item)"
+          >
+            <img :src="item.icon" alt="" />
+          </div>
+        </div>
+        <div class="translation-row">
+          <div class="translation-language" @mouseleave="languageShow = false">
+            <div
+              class="source"
+              @mouseenter="() => onShowLanguage('100px', true, 'sourceLanguage')"
+            >
+              {{ sourceLanguage.name }}
+              <div class="icon select-icon"></div>
+            </div>
+            <div
+              class="target"
+              @mouseenter="() => onShowLanguage('620px', true, 'targetLanguage')"
+            >
+              <div class="icon switch-icon" @click="onSwitch"></div>
+              {{ targetLanguage.name }}
+              <div class="icon select-icon"></div>
+            </div>
+            <div
+              class="language-row"
+              :class="{ show: languageShow }"
+              :style="{ left: languageRowLeft }"
+            >
+              <div class="search">
+                <i class="icon"></i
+                ><input
+                  type="text"
+                  class="search-input"
+                  v-model="serachKeywords"
+                  placeholder="搜索你想要的"
+                />
+              </div>
+              <div class="row">
+                <div
+                  v-for="(k, v) in languageCurrent"
+                  :key="v"
+                  :value="v"
+                  class="col"
+                  @click="onSelectLanguage(v)"
+                  :class="{ on: sourceLanguage.key == v || targetLanguage.key == v }"
+                >
+                  <span>{{ k }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="translation-text">
+            <div class="source">
+              <textarea
+                cols="30"
+                rows="10"
+                v-model="sourceText"
+                placeholder="输入文字，即可翻译"
+              ></textarea>
+            </div>
+            <div class="target">
+              <textarea
+                disabled
+                cols="30"
+                rows="10"
+                v-model="targetText"
+              ></textarea>
+              <div class="loading" v-if="isLoading">
+                <img class="icon" src="static/picture/p17.png" alt="" />
+                <div>Loading...</div>
+              </div>
+              <div v-if="targetText" class="copy" @click="copy">复制</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <script src="static/js/lodash.min.js"></script>
+    <script type="text/javascript">
+      const CancelToken = axios.CancelToken;
+      let source = CancelToken.source();
+      new Vue({
+        el: "#app",
+        data() {
+          return {
+            engine: {},
+            engineType: [
+              {
+                key: "deepl",
+                value: 0,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p2.png",
+              },
+              {
+                key: "google",
+                value: 1,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p3.png",
+              },
+              {
+                key: "baidu",
+                value: 2,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/p4.png",
+              },
+              {
+                key: "youdao",
+                value: 3,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/youdao.png",
+              },
+              {
+                key: "bing",
+                value: 4,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/bing.png",
+              },
+              {
+                key: "huoshan",
+                value: 5,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/huoshan.png",
+              },
+              {
+                key: "chatgpt",
+                value: 6,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/openai.png",
+              },
+              {
+                key: "yandex",
+                value: 7,
+                icon: "https://codeai.oss-cn-hangzhou.aliyuncs.com/img/yandex.png",
+              },
+            ],
+            sourceLanguage: {
+              key: "auto",
+              name: "自动检测",
+            },
+            targetLanguage: {
+              key: "ZH",
+              name: "中文（简体）",
+            },
+            sourceText: "",
+            targetText: "",
+            serachKeywords: "",
+            languageShow: false,
+            languageRowLeft: "100px",
+            languageTotalData: {},
+            isLoading: false,
+          };
+        },
+        created() {
+          this.engine = this.engineType[0];
+          this.getLanguage();
+        },
+        mounted() {
+          let token = localStorage.getItem("token");
+          if (token) {
+            this.token = token;
+            this.getUserInfo(token);
+          } else {
+            // location.href = "login.html";
+          }
+        },
+        watch: {
+          sourceText(v) {
+            if (v) {
+              // _.debounce(this.translate, 500)
+              this.translate();
+            } else {
+              source.cancel("取消请求");
+              this.targetText = "";
+            }
+          },
+        },
+        computed: {
+          languageCurrent() {
+            const current = this.languageTotalData[this.engine.key];
+            const copyCurrent = {};
+            if (this.serachKeywords) {
+              Object.keys(current).forEach((key) => {
+                // console.log('current[key]', current[key])
+                if (current[key].indexOf(this.serachKeywords) > -1) {
+                  copyCurrent[key] = current[key];
+                }
+              });
+              return copyCurrent;
+            }
+            return this.languageTotalData[this.engine.key];
+          },
+        },
+        methods: {
+          copy() {
+            // 模拟 输入框
+            var cInput = document.createElement("input");
+            cInput.value = this.targetText;
+            document.body.appendChild(cInput);
+            cInput.select(); // 选取文本框内容
+
+            // 执行浏览器复制命令
+            // 复制命令会将当前选中的内容复制到剪切板中（这里就是创建的input标签）
+            // Input要在正常的编辑状态下原生复制方法才会生效
+
+            document.execCommand("copy");
+            layer.msg("复制成功");
+            // 复制成功后再将构造的标签 移除
+            document.body.removeChild(cInput);
+          },
+          onShowLanguage(left, boolean, key) {
+            this.languageRowLeft = left ? left : "100px";
+            this.languageShow = boolean;
+            this.currentKey = key;
+          },
+          onSelectEngine(e) {
+            this.engine = e;
+            const firstEntry = Object.entries(this.languageCurrent)[0];
+            this.targetLanguage = {
+              key: firstEntry[0],
+              name: this.languageCurrent[firstEntry[0]],
+            };
+            this.translate();
+          },
+          getLanguage() {
+            axios.get("/api/translate/getLanguages").then((res) => {
+              if (res.data.code == 1) {
+                this.languageTotalData = res.data.data;
+              }
+            });
+          },
+          translate: _.debounce(function () {
+            source.cancel("取消请求");
+            source = axios.CancelToken.source();
+            const that = this;
+            if (!this.sourceText) {
+              that.targetText = "";
+              return;
+            }
+            this.isLoading = true;
+            axios
+              .post(
+                "/api/translate/index",
+                {
+                  keywords: this.sourceText,
+                  targetLanguage: this.targetLanguage.key,
+                  type: this.engine.value, // 0 :deepl, 1:谷歌 2:百度
+                },
+                { cancelToken: source.token }
+              )
+              .then(function (res) {
+                console.log(res.data.data.text);
+                if (res.data.code == 1) {
+                  that.targetText = res.data.data.text;
+                  if (!this.sourceText) {
+                    this.targetText = "";
+                  }
+                } else {
+                  that.targetText = "";
+                  layer.msg(res.data.info);
+                }
+              })
+              .catch(function (err) {
+                console.log(err);
+              })
+              .finally(() => {
+                this.isLoading = false;
+              });
+          }, 800),
+          onSelectLanguage(e) {
+            this[this.currentKey] = {
+              key: e,
+              name: this.languageCurrent[e],
+            };
+            this.languageShow = false;
+            this.translate();
+          },
+          onSwitch() {
+            const copySource = JSON.parse(JSON.stringify(this.sourceLanguage));
+            const copyTarget = JSON.parse(JSON.stringify(this.targetLanguage));
+            this.targetLanguage = copySource;
+            this.sourceLanguage = copyTarget;
+          },
+          onInput(e) {
+            if (this.sourceText) {
+              // _.debounce(this.translate, 500)
+              this.translate();
+            } else {
+              this.targetText = "";
+            }
+          },
+        },
+      });
+    </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>
+  </body>
+</html>

static/css/public.css

@@ -1700,6 +1700,39 @@
     padding: 20px;
     z-index: 10000;
   }
+
+  .service-modal .content-normal{
+    background-color: white;
+    border-radius: 10px;
+    height: 442px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 444px;
+    background-size: 100% 100%;
+    box-sizing: border-box;
+    padding: 45px 15px 15px;
+    overflow-y: auto;
+  }
+
+  .service-modal .content-normal .content-item {
+        padding: 10px;
+    border-radius: 3px;
+    /* border: solid .5px #6c75e1; */
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+    cursor: pointer;
+  }
+
+  .service-modal .content-normal .content-item:hover{
+     transform: translateY(-5px); /* 向上浮动一点 */
+     box-shadow: 0 4px 12px rgb(65 63 63 / 10%);
+     transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; 
+  }
+
+  .service-modal .content-normal .content-item:not(:first-child){
+     margin-top: 10px;
+  }
   
   .service-modal .content {
     position: absolute;
@@ -1732,7 +1765,7 @@
     line-height: 25px;
   }
   
-  .service-modal .content .close {
+  .service-modal .content .close,.service-modal .content-normal .close {
     position: absolute;
     top: 16px;
     right: 16px;
@@ -3003,7 +3036,7 @@
 	 white-space: nowrap;
  }
  
- .modal-overlay {
+ .modal-overlay,.modal-overlay-record {
    position: fixed;
    top: 0;
    left: 0;

static/js/common.js

@@ -1,2 +1,2 @@
-
+
 axios.defaults.baseURL = 'http://localhost:8085/api/v1';

static/js/countdown.js

@@ -0,0 +1,10 @@
+/*!
+ * vue-countdown v1.1.5
+ * https://fengyuanchen.github.io/vue-countdown
+ *
+ * Copyright 2018-present Chen Fengyuan
+ * Released under the MIT license
+ *
+ * Date: 2020-02-25T01:19:32.769Z
+ */
+!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):(t=t||self).VueCountdown=i()}(this,function(){"use strict";var t=1e3,i=6e4,s=36e5,e="visibilitychange";return{name:"countdown",data:function(){return{counting:!1,endTime:0,totalMilliseconds:0}},props:{autoStart:{type:Boolean,default:!0},emitEvents:{type:Boolean,default:!0},interval:{type:Number,default:1e3,validator:function(t){return 0<=t}},now:{type:Function,default:function(){return Date.now()}},tag:{type:String,default:"span"},time:{type:Number,default:0,validator:function(t){return 0<=t}},transform:{type:Function,default:function(t){return t}}},computed:{days:function(){return Math.floor(this.totalMilliseconds/864e5)},hours:function(){return Math.floor(this.totalMilliseconds%864e5/s)},minutes:function(){return Math.floor(this.totalMilliseconds%s/i)},seconds:function(){return Math.floor(this.totalMilliseconds%i/t)},milliseconds:function(){return Math.floor(this.totalMilliseconds%t)},totalDays:function(){return this.days},totalHours:function(){return Math.floor(this.totalMilliseconds/s)},totalMinutes:function(){return Math.floor(this.totalMilliseconds/i)},totalSeconds:function(){return Math.floor(this.totalMilliseconds/t)}},render:function(t){return t(this.tag,this.$scopedSlots.default?[this.$scopedSlots.default(this.transform({days:this.days,hours:this.hours,minutes:this.minutes,seconds:this.seconds,milliseconds:this.milliseconds,totalDays:this.totalDays,totalHours:this.totalHours,totalMinutes:this.totalMinutes,totalSeconds:this.totalSeconds,totalMilliseconds:this.totalMilliseconds}))]:this.$slots.default)},watch:{$props:{deep:!0,immediate:!0,handler:function(){this.totalMilliseconds=this.time,this.endTime=this.now()+this.time,this.autoStart&&this.start()}}},methods:{start:function(){this.counting||(this.counting=!0,this.emitEvents&&this.$emit("start"),"visible"===document.visibilityState&&this.continue())},continue:function(){var e=this;if(this.counting){var n=Math.min(this.totalMilliseconds,this.interval);if(0<n)if(window.requestAnimationFrame){var o,a;this.requestId=requestAnimationFrame(function t(i){a=a||i;var s=i-(o=o||i);n<=s||n<=s+(i-a)/2?e.progress():e.requestId=requestAnimationFrame(t),a=i})}else this.timeoutId=setTimeout(function(){e.progress()},n);else this.end()}},pause:function(){window.requestAnimationFrame?cancelAnimationFrame(this.requestId):clearTimeout(this.timeoutId)},progress:function(){this.counting&&(this.totalMilliseconds-=this.interval,this.emitEvents&&0<this.totalMilliseconds&&this.$emit("progress",{days:this.days,hours:this.hours,minutes:this.minutes,seconds:this.seconds,milliseconds:this.milliseconds,totalDays:this.totalDays,totalHours:this.totalHours,totalMinutes:this.totalMinutes,totalSeconds:this.totalSeconds,totalMilliseconds:this.totalMilliseconds}),this.continue())},abort:function(){this.counting&&(this.pause(),this.counting=!1,this.emitEvents&&this.$emit("abort"))},end:function(){this.counting&&(this.pause(),this.totalMilliseconds=0,this.counting=!1,this.emitEvents&&this.$emit("end"))},update:function(){this.counting&&(this.totalMilliseconds=Math.max(0,this.endTime-this.now()))},handleVisibilityChange:function(){switch(document.visibilityState){case"visible":this.update(),this.continue();break;case"hidden":this.pause()}}},mounted:function(){document.addEventListener(e,this.handleVisibilityChange)},beforeDestroy:function(){document.removeEventListener(e,this.handleVisibilityChange),this.pause()}}});