Sākums Izpētīt Palīdzība
Reģistrēties Pierakstīties
Allen
/
CloudSQLAdminPanel
Vērot 1
Pievienot zvaigznīti 0
Atdalīts 0
Faili Problēmas 0 Izmaiņu pieprasījumi 0 Vikivietne
Pārlūkot izejas kodu

Merge branch 'develop-lgb' into develop

Allen 8 gadi atpakaļ
vecāks
c7cc460dae 1f99862e2a
revīzija
a149935208
9 mainītis faili ar 517 papildinājumiem un 0 dzēšanām
Dalītais skats Rādīt salīdzināšanas statistiku
  1. BIN
      public/scr/components/signin/icon1.PNG
  2. BIN
      public/scr/components/signin/icon2.PNG
  3. 123 0
      public/scr/components/signin/signin.css
  4. 40 0
      public/scr/components/signin/signin.html
  5. 1 0
      public/scr/components/signin/signin.js
  6. 148 0
      public/signin/css/signin.css
  7. 80 0
      public/signin/js/signin.js
  8. 41 0
      public/signin/signin.html
  9. 84 0
      public/signup/js/signup.js

BIN
public/scr/components/signin/icon1.PNG
Parādīt failu


BIN
public/scr/components/signin/icon2.PNG
Parādīt failu


+ 123 - 0
public/scr/components/signin/signin.css
Parādīt failu 

@@ -0,0 +1,123 @@
 
+*{margin: 0;padding: 0;}
 
+a{text-decoration: none;}
 
+ul,li{list-style: none;}
 
+body{font-size: 14px;font-family: "微软雅黑";}
 
+.top{
 
+    width: 100%;
 
+    height: 64px;
 
+    background-color: #2196F3;
 
+    margin: 0 auto;
 
+    float: left;
 
+    }
 
+.top-title{
 
+    font-size: 24px;
 
+    font-weight: 400;
 
+    color: white;
 
+    line-height: 64px;
 
+    margin-left: 16px;
 
+    float: left;
 
+    }
 
+.top-btn1{
 
+    position: relative;
 
+    left: 63%;
 
+    top: 14px;
 
+    width: 88px;
 
+    height: 36px;
 
+    padding: 0 16px;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    color: white;
 
+    line-height: 33px;
 
+    text-align: center;
 
+    }
 
+.top-btn2{
 
+    position: relative;
 
+    left: 66%;
 
+    top: 14px;
 
+    width: 88px;
 
+    height: 36px;
 
+    padding: 0 16px;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    color: white;
 
+    line-height: 33px;
 
+    text-align: center;
 
+    }
 
+.content{
 
+    width: 100%;
 
+    height: 1000px;
 
+}
 
+.content-title{
 
+    font-size: 34px;
 
+    font-weight: 400;
 
+    color: black;
 
+    font-family: sans-serif;
 
+    padding-left: 19.66%;
 
+    padding-top: 135px;
 
+    margin: 0 auto
 
+}
 
+.content1{
 
+    position: relative;
 
+    top:26px;
 
+    left: 19.66%;
 
+    width: 60%;
 
+    height: 395px;
 
+    border: rgb(222,222,222) solid 1px;
 
+}
 
+.content1-kuang{
 
+    width: 49%;
 
+    height: 36px;
 
+    margin: 0 auto;
 
+    margin-top: 50px;
 
+}
 
+.content1-text1{
 
+    width: 86%;
 
+    height: 33px;
 
+    border: 0px;
 
+    border-bottom: rgb(222,222,222) solid 1px;
 
+    float: right;
 
+    outline: none;
 
+}
 
+.content1-text2{
 
+    width: 70%;
 
+    height: 33px;
 
+    border: 0px;
 
+    border-bottom: rgb(222,222,222) solid 1px;
 
+    float: right;
 
+    outline: none;
 
+}
 
+.content1-tishi{
 
+    font-size: 15px;
 
+    color: #40c4ff;
 
+    line-height: 80px;
 
+    margin-left: 26%;
 
+    }
 
+.content1-button{
 
+    width: 49%;
 
+    height: 36px;
 
+    border: 0px;
 
+    background-color: #40c4ff;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    text-align: center;
 
+    line-height: 36px;
 
+    margin-right: 203px;
 
+    float: right;
 
+}
 
+.buttom{
 
+    width: 100%;
 
+    height: 87px;
 
+    background-color: #424242;
 
+    margin-top: 40%
 
+}
 
+.buttom-text{
 
+    font-size: 15px;
 
+    color: #9e9e9e;
 
+    line-height: 83.25px;
 
+    text-align: center;
 
+}
 
+::-webkit-input-placeholder{
 
+    font-size: 16px;
 
+    font-family: 微软雅黑;
 
+    color: #bdbdbd;
 
+    }

+ 40 - 0
public/scr/components/signin/signin.html
Parādīt failu 

@@ -0,0 +1,40 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="Author" content=" ">
 
+    <title>Document</title>
 
+    <link href="1.css" rel="stylesheet" type="text/css" />
 
+</head>
 
+<body>
 
+    <div class="top">
 
+        <a class="top-title" href="#">CloudSQL Admin Panel</a>
 
+        <a class="top-btn1" href="#" id="btn1">登陆</a>
 
+        <a class="top-btn2" href="#">注册</a>
 
+    </div>
 
+    <div class="content">
 
+        <h2 class="content-title">用户登录</h2>
 
+        <div class="content1">
 
+            <ul>
 
+                <li class="content1-kuang">
 
+                    <img src="icon1.PNG">
 
+                    <input class="content1-text1" placeholder="用户名/邮箱">
 
+                </li>
 
+                <li class="content1-kuang">
 
+                    <img src="icon2.PNG">
 
+                    <input class="content1-text1"  placeholder="密码">
 
+                </li>
 
+                <li class="content1-kuang">
 
+                    <img src="http://admin.cloudsql.1473.cn/v1/captcha?1527505813811">
 
+                    <input class="content1-text2"  placeholder="验证码">
 
+                </li>
 
+            </ul>
 
+            <a class="content1-tishi" href="#">还没有账户，点击注册</a>
 
+            <button class="content1-button">登陆</button>
 
+        </div>
 
+        <div class="buttom">
 
+            <p class="buttom-text">Copyright @ 2016 - 2017 CloudSQL All rights reserved. </p>
 
+        </div>
 
+    </div>
 
+</body>
 
+</html>

+ 1 - 0
public/scr/components/signin/signin.js
Parādīt failu 

@@ -0,0 +1 @@
 
+

+ 148 - 0
public/signin/css/signin.css
Parādīt failu 

@@ -0,0 +1,148 @@
 
+*{margin: 0;padding: 0;}
 
+a{text-decoration: none;}
 
+ul,li{list-style: none;}
 
+body{font-size: 14px;font-family: "微软雅黑";}
 
+.top{
 
+    width: 100%;
 
+    height: 64px;
 
+    background-color: #2196F3;
 
+    margin: 0 auto;
 
+    float: left;
 
+    }
 
+.top-title{
 
+    font-size: 24px;
 
+    font-weight: 400;
 
+    color: white;
 
+    line-height: 64px;
 
+    margin-left: 16px;
 
+    float: left;
 
+    }
 
+.top-btn1{
 
+    position: relative;
 
+    left: 63%;
 
+    top: 14px;
 
+    width: 88px;
 
+    height: 36px;
 
+    padding: 0 16px;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    color: white;
 
+    line-height: 33px;
 
+    text-align: center;
 
+    }
 
+.top-btn2{
 
+    position: relative;
 
+    left: 66%;
 
+    top: 14px;
 
+    width: 88px;
 
+    height: 36px;
 
+    padding: 0 16px;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    color: white;
 
+    line-height: 33px;
 
+    text-align: center;
 
+    }
 
+.content{
 
+    width: 100%;
 
+    height: 450px;
 
+}
 
+.content-title{
 
+    font-size: 34px;
 
+    font-weight: 400;
 
+    color: black;
 
+    font-family: sans-serif;
 
+    padding-left: 19.66%;
 
+    padding-top: 135px;
 
+    margin: 0 auto
 
+}
 
+.content1{
 
+    position: relative;
 
+    top:26px;
 
+    left: 19.66%;
 
+    width: 60%;
 
+    height: 100%;
 
+    border: rgb(222,222,222) solid 1px;
 
+}
 
+.content1-kuang{
 
+    width: 49%;
 
+    height: 36px;
 
+    margin: 0 auto;
 
+    margin-top: 50px;
 
+}
 
+.content1-text1{
 
+    width: 86%;
 
+    height: 33px;
 
+    border: 0px;
 
+    border-bottom: rgb(222,222,222) solid 1px;
 
+    float: right;
 
+    outline: none;
 
+}
 
+.content1-text2{
 
+    width: 60%;
 
+    height: 33px;
 
+    border: 0px;
 
+    border-bottom: rgb(222,222,222) solid 1px;
 
+    float: right;
 
+    outline: none;
 
+}
 
+.content1-tishi{
 
+    font-size: 15px;
 
+    color: #40c4ff;
 
+    line-height: 80px;
 
+    margin-left: 26%;
 
+    }
 
+.content1-button{
 
+    width: 49%;
 
+    height: 36px;
 
+    border: 0px;
 
+    background-color: #40c4ff;
 
+    font-size: 14px;
 
+    font-weight: 500;
 
+    text-align: center;
 
+    line-height: 36px;
 
+    margin-right: 25%;
 
+    float: right;
 
+}
 
+.buttom{
 
+    width: 100%;
 
+    height: 87px;
 
+    background-color: #424242;
 
+    margin-top: 40%
 
+}
 
+.buttom-text{
 
+    font-size: 15px;
 
+    color: #9e9e9e;
 
+    line-height: 83.25px;
 
+    text-align: center;
 
+}
 
+::-webkit-input-placeholder{
 
+    font-size: 16px;
 
+    font-family: 微软雅黑;
 
+    color: #bdbdbd;
 
+    }
 
+@font-face {
 
+    font-family: 'Material Icons';
 
+    font-style: normal;
 
+    font-weight: 400;
 
+    src: local('Material Icons'),
 
+    local('MaterialIcons-Regular'),
 
+    url(MaterialIcons-Regular.woff2) format('woff2'),
 
+    url(MaterialIcons-Regular.woff) format('woff');
 
+    }
 
+.material-icons {
 
+    font-family: 'Material Icons';
 
+    /* Support for all WebKit browsers. */
 
+    -webkit-font-smoothing: antialiased;
 
+    /* Support for Safari and Chrome. */
 
+    text-rendering: optimizeLegibility;
 
+    /* Support for Firefox. */
 
+    -moz-osx-font-smoothing: grayscale;
 
+    /* Support for IE. */
 
+    -webkit-font-feature-settings: 'liga';
 
+    -moz-font-feature-settings: 'liga';
 
+    font-feature-settings: 'liga';
 
+    font-style: normal;
 
+    font-size: 25px;
 
+    color: rgba(0, 0, 0, 0.54);
 
+    }

+ 80 - 0
public/signin/js/signin.js
Parādīt failu 

@@ -0,0 +1,80 @@
 
+class Utils {
 
+    /**
 
+     * 发送Get请求
 
+     *
 
+     * @param {!string} url 请求地址
 
+     * @param {?function} next 回调函数
 
+     */
 
+    static ajaxGet(url, next) {
 
+        let xhr = new XMLHttpRequest();
 
+
 
+        if (url.includes('?')) {
 
+            // 在URL有其他参数时，添加一个date参数加入当前时间以避免缓存
 
+            xhr.open('GET', `${url}&date=${new Date().getTime()}`, true);
 
+        } else {
 
+            // 添加一个date参数加入当前时间以避免缓存
 
+            xhr.open('GET', `${url}&date=${new Date().getTime()}`, true);
 
+        }
 
+        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
+        // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies
 
+        xhr.withCredentials = true;
 
+        xhr.responseType = 'json';
 
+        xhr.onload = function (res) {
 
+            // 获取请求接口返回值
 
+            let response = res.target.response;
 
+
 
+            next && next(response);
 
+        };
 
+        xhr.send();
 
+    }
 
+    /**
 
+     * 发送Post请求
 
+     *
 
+     * @param {!string} url 请求地址
 
+     * @param {?string} data post请求参数
 
+     * @param {?function} next 回调函数
 
+     */
 
+    static ajaxPost(url, data, next) {
 
+        let xhr = new XMLHttpRequest();
 
+
 
+        if (url.includes('?')) {
 
+            // 在URL有其他参数时，添加一个date参数加入当前时间以避免缓存
 
+            xhr.open("POST", `${url}&${new Date().getTime()}`, true);
 
+        } else {
 
+            // 添加一个date参数加入当前时间以避免缓存
 
+            xhr.open("POST", `${url}?${new Date().getTime()}`, true);
 
+        }
 
+        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
+        // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies
 
+        xhr.withCredentials = true;
 
+        xhr.responseType = 'json';
 
+        xhr.onload = function (res) {
 
+            // 获取请求接口返回值
 
+            let response = res.target.response;
 
+
 
+            next && next(response);
 
+        };
 
+        xhr.send(data);
 
+    }
 
+}
 
+
 
+window.onload = function () {
 
+    let signinButton = document.querySelector('#signin-button')
 
+    signinButton.addEventListener('click', () => {
 
+        let userId = document.querySelector('body > div.content > div.content1 > ul > li:nth-child(1) > input').value
 
+        let password = document.querySelector('body > div.content > div.content1 > ul > li:nth-child(2) > input').value
 
+        let cCode = document.querySelector('body > div.content > div.content1 > ul > li:nth-child(3) > input').value
 
+
 
+        let signInUrl = 'http://admin.cloudsql.1473.cn/v1/signin'
 
+        let postData = `userId=${userId}&password=${password}&captcha=${cCode}`
 
+
 
+        Utils.ajaxPost(signInUrl, postData, res => {
 
+            if (res.status == 'signedin') {
 
+                //跳转到首页
 
+                window.location.href = 'index.html'
 
+            } else {
 
+                alert('登陆失败')
 
+            }
 
+        })
 
+    })
 
+}

+ 41 - 0
public/signin/signin.html
Parādīt failu 

@@ -0,0 +1,41 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="Author" content=" ">
 
+    <title>Document</title>
 
+    <link href="css/signin.css" rel="stylesheet" type="text/css" />
 
+    <script src="js/signin.js"></script>
 
+</head>
 
+<body>
 
+    <div class="top">
 
+        <a class="top-title" href="#">CloudSQL Admin Panel</a>
 
+        <a class="top-btn1" href="#" id="btn1">登陆</a>
 
+        <a class="top-btn2" href="#">注册</a>
 
+    </div>
 
+    <div class="content">
 
+        <h2 class="content-title">用户登录</h2>
 
+        <div class="content1">
 
+            <ul>
 
+                <li class="content1-kuang">
 
+                     <i class="material-icons">person</i>
 
+                    <input class="content1-text1" name="userId" placeholder="用户名/邮箱">
 
+                </li>
 
+                <li class="content1-kuang">
 
+                    <i class="material-icons">lock</i>
 
+                    <input class="content1-text1" name="password" placeholder="密码">
 
+                </li>
 
+                <li class="content1-kuang">
 
+                    <img src="http://admin.cloudsql.1473.cn/v1/captcha">
 
+                    <input class="content1-text2" name="captcha" placeholder="验证码">
 
+                </li>
 
+            </ul>
 
+            <a class="content1-tishi" href="#">还没有账户，点击注册</a>
 
+            <button class="content1-button" id="signin-button">登陆</button>
 
+        </div>
 
+        <div class="buttom">
 
+            <p class="buttom-text">Copyright @ 2016 - 2017 CloudSQL All rights reserved. </p>
 
+        </div>
 
+    </div>
 
+</body>
 
+</html>

+ 84 - 0
public/signup/js/signup.js
Parādīt failu 

@@ -0,0 +1,84 @@
 
+class Utils {
 
+    /**
 
+     * 发送Get请求
 
+     *
 
+     * @param {!string} url 请求地址
 
+     * @param {?function} next 回调函数
 
+     */
 
+    static ajaxGet(url, next) {
 
+        let xhr = new XMLHttpRequest();
 
+
 
+        if (url.includes('?')) {
 
+            // 在URL有其他参数时，添加一个date参数加入当前时间以避免缓存
 
+            xhr.open('GET', `${url}&date=${new Date().getTime()}`, true);
 
+        } else {
 
+            // 添加一个date参数加入当前时间以避免缓存
 
+            xhr.open('GET', `${url}&date=${new Date().getTime()}`, true);
 
+        }
 
+        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
+        // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies
 
+        xhr.withCredentials = true;
 
+        xhr.responseType = 'json';
 
+        xhr.onload = function (res) {
 
+            // 获取请求接口返回值
 
+            let response = res.target.response;
 
+
 
+            next && next(response);
 
+        };
 
+        xhr.send();
 
+    }
 
+    /**
 
+     * 发送Post请求
 
+     *
 
+     * @param {!string} url 请求地址
 
+     * @param {?string} data post请求参数
 
+     * @param {?function} next 回调函数
 
+     */
 
+    static ajaxPost(url, data, next) {
 
+        let xhr = new XMLHttpRequest();
 
+
 
+        if (url.includes('?')) {
 
+            // 在URL有其他参数时，添加一个date参数加入当前时间以避免缓存
 
+            xhr.open("POST", `${url}&${new Date().getTime()}`, true);
 
+        } else {
 
+            // 添加一个date参数加入当前时间以避免缓存
 
+            xhr.open("POST", `${url}?${new Date().getTime()}`, true);
 
+        }
 
+        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
+        // 更改XMLHttpRequest对象withCredentials属性以支持跨域Cookies
 
+        xhr.withCredentials = true;
 
+        xhr.responseType = 'json';
 
+        xhr.onload = function (res) {
 
+            // 获取请求接口返回值
 
+            let response = res.target.response;
 
+
 
+            next && next(response);
 
+        };
 
+        xhr.send(data);
 
+    }
 
+}
 
+
 
+window.onload = function(){
 
+    let signupButton = document.querySelector('#signup-button')
 
+    signupButton.addEventListener('click',() => {
 
+        let userId = document.querySelector('input[name=userId]').value
 
+        let password = document.querySelector('input[name=password]').value
 
+        let iCode = document.querySelector('input[name=iCode]').value
 
+        let cCode = document.querySelector('input[name=cCode]').value
 
+
 
+        let signUpUrl = 'http://admin.cloudsql.1473.cn/v1/signup'
 
+        let postData = `userId=${userId}&password=${password}&iCode=${iCode}&captcha=${cCode}`
 
+
 
+        Utils.ajaxPost(signUpUrl, postData, res => {
 
+            if(res.status == 'successed'){
 
+                // mdui.snckbar({
 
+                //     message: response.info
 
+                // })
 
+                alert(response.info)
 
+                window.location.hash = response.url
 
+            }else{
 
+                alert("注册失败");
 
+            }
 
+        })
 
+    })
 
+}