101 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			101 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!--
 | 
						|
 * @Author: Kane
 | 
						|
 * @Date: 2022-11-16 10:50:27
 | 
						|
 * @LastEditors: Kane
 | 
						|
 * @LastEditTime: 2022-11-16 15:07:29
 | 
						|
 * @FilePath: \car_dealer\vue\注册\signup.html
 | 
						|
 * @Description: 
 | 
						|
 * 
 | 
						|
 * Copyright (c) ${2022} by Kane, All Rights Reserved. 
 | 
						|
-->
 | 
						|
<!DOCTYPE html>
 | 
						|
<html lang="en">
 | 
						|
    <head>
 | 
						|
        <meta charset="UTF-8" />
 | 
						|
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 | 
						|
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 | 
						|
        <title>注册</title>
 | 
						|
        <link rel="stylesheet" href="../../css/root.css" />
 | 
						|
        <link rel="stylesheet" href="../../css/normalize.css" />
 | 
						|
        <link rel="stylesheet" href="../../css/app.css" />
 | 
						|
        <link rel="stylesheet" href="css/main.css" />
 | 
						|
    </head>
 | 
						|
    <body>
 | 
						|
        <div class="content">
 | 
						|
            <div id="app">
 | 
						|
                <h5>加入我们,一起创造美好世界</h5>
 | 
						|
                <h1>创建你的账号</h1>
 | 
						|
                <div>
 | 
						|
                    <h6>用户名 *</h6>
 | 
						|
                    <input
 | 
						|
                        type="text"
 | 
						|
                        v-model.lazy.trim="signupInfo.username"
 | 
						|
                    />
 | 
						|
                </div>
 | 
						|
                <div>
 | 
						|
                    <h6>邮箱地址</h6>
 | 
						|
                    <input type="text" v-model.lazy.trim="signupInfo.email" />
 | 
						|
                </div>
 | 
						|
                <div>
 | 
						|
                    <h6>密码*</h6>
 | 
						|
                    <input
 | 
						|
                        type="text"
 | 
						|
                        v-model.lazy.trim="signupInfo.password"
 | 
						|
                    />
 | 
						|
                    <h6>请确认密码长度需要大于6位</h6>
 | 
						|
                </div>
 | 
						|
                <div>
 | 
						|
                    <h6>偏好设置</h6>
 | 
						|
                    <div class="pianhao">
 | 
						|
                        <input
 | 
						|
                            type="checkbox"
 | 
						|
                            id="sendUpdateMail"
 | 
						|
                            v-model="signupInfo.sendUpdateMail"
 | 
						|
                        />
 | 
						|
                        <label for="sendUpdateMail"> 接收更新邮件</label>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
                <button type="button" @click="doSignup()">创建账号</button>
 | 
						|
            </div>
 | 
						|
        </div>
 | 
						|
    </body>
 | 
						|
    <script src="../../js/axios/1.1.3/axios.js"></script>
 | 
						|
    <script src="../../js/vue/vue.global.js"></script>
 | 
						|
    <script>
 | 
						|
        const app = {
 | 
						|
            data() {
 | 
						|
                return {
 | 
						|
                    signupInfo: {
 | 
						|
                        username: "",
 | 
						|
                        email: "",
 | 
						|
                        password: "",
 | 
						|
                        sendUpdateMail: false,
 | 
						|
                    },
 | 
						|
                };
 | 
						|
            },
 | 
						|
            methods: {
 | 
						|
                doSignup() {
 | 
						|
                    let json = "";
 | 
						|
 | 
						|
                    if (
 | 
						|
                        this.signupInfo.username.length != 0 &&
 | 
						|
                        this.signupInfo.password.length != 0
 | 
						|
                    ) {
 | 
						|
                        try {
 | 
						|
                            json = JSON.stringify(this.signupInfo);
 | 
						|
                        } catch (exception) {
 | 
						|
                            console.log(exception.message);
 | 
						|
                        }
 | 
						|
                    } else {
 | 
						|
                    }
 | 
						|
 | 
						|
                    console.log(json);
 | 
						|
                },
 | 
						|
            },
 | 
						|
        };
 | 
						|
 | 
						|
        const vm = Vue.createApp(app);
 | 
						|
        vm.mount("#app");
 | 
						|
    </script>
 | 
						|
</html>
 |