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>
							 |