r1235613/index.html

## index.html
<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>臺東大學宿舍報到系統</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.js"></script>
    <script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-auth.js"></script>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
    <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
    <script src="jsdorm.js"></script>
    <script>

        var config = {
            apiKey: "AIzaSyC7AvBJ_t8x0LhOSzZhEdWhbTxA291O7YE",
            authDomain: "dorm-nttu.firebaseapp.com",
            databaseURL: "https://dorm-nttu.firebaseio.com",
            projectId: "dorm-nttu",
            storageBucket: "dorm-nttu.appspot.com",
            messagingSenderId: "1098591909183"
        };
        // firebase.initializeApp(config);
        firebase.auth().onAuthStateChanged(function(user) {
            if (user) {
                if(user.emailVerified == false) {
                    window.location = "/index.html";  // 登陸但是沒驗證電子郵件 送回去
                }
            } else {
                window.location = "/index.html";  // 沒登錄送回去
            }
        });
        function sentphonechecked(){
            var phoneNumber = "+886" + document.getElementById("phone").value;
            firebase.auth().languageCode = 'zh-TW';
            var appVerifier = window.recaptchaVerifier;
            window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sendmessage', {
                'size': 'invisible',
                'callback': function(response) {
                    onSignInSubmit();
                }
            });
            firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier)
                .then(function (confirmationResult) {
                    window.confirmationResult = confirmationResult;
                    alert("發送成功！");
                }).catch(function (error) {
                alert("簡訊發送失敗，請稍後再試");
            });
        }
    </script>
</head>
<body>
<style type="text/css">
    .segment {
        max-width: 300px;
    }
</style>
<div class="ts narrow container">
    <br>
    <br>

    <h1 class="ts center aligned header">
        手機驗證
        <div class="sub header">很高興能夠再次見到你</div>
    </h1>

    <div class="ts centered secondary segment">

        <form class="ts form">

            <div id ="app"> <!-- app -->
            <div class="field">
                <label>輸入手機號碼</label>
                <input id="phone" type="tel" placeholder="09xxxxxxxx">
            </div>
            <div class="field">
                <label>輸入簡訊驗證碼</label>
                <input type="password">
            </div>
            <button v-on:click="phoneclick" id="sendmessage" type="button" class="ts positive fluid button">發送驗證簡訊</button>
            </div> <!-- app div -->
        </form>

        <script>
            var app = new Vue({
                el: '#app',
                data: {
                },
                methods: {
                    phoneclick: function(){
                        this.phonefunction();
                    },
                    phonefunction: function(){
                        sentphonechecked();
                    }
                }
            })
        </script>

    </div>
</div>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
	<head>
	<meta charset="UTF-8">
	<title>臺東大學宿舍報到系統</title>
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.css">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.js"></script>
	<script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-app.js"></script>
	<script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-auth.js"></script>
	<script src="https://unpkg.com/vue/dist/vue.js"></script>
	<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
	<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
	<script src="jsdorm.js"></script>
	<script>

	var config = {
	apiKey: "AIzaSyC7AvBJ_t8x0LhOSzZhEdWhbTxA291O7YE",
	authDomain: "dorm-nttu.firebaseapp.com",
	databaseURL: "https://dorm-nttu.firebaseio.com",
	projectId: "dorm-nttu",
	storageBucket: "dorm-nttu.appspot.com",
	messagingSenderId: "1098591909183"
	};
	// firebase.initializeApp(config);
	firebase.auth().onAuthStateChanged(function(user) {
	if (user) {
	if(user.emailVerified == false) {
	window.location = "/index.html"; // 登陸但是沒驗證電子郵件送回去
	}
	} else {
	window.location = "/index.html"; // 沒登錄送回去
	}
	});
	function sentphonechecked(){
	var phoneNumber = "+886" + document.getElementById("phone").value;
	firebase.auth().languageCode = 'zh-TW';
	var appVerifier = window.recaptchaVerifier;
	window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sendmessage', {
	'size': 'invisible',
	'callback': function(response) {
	onSignInSubmit();
	}
	});
	firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier)
	.then(function (confirmationResult) {
	window.confirmationResult = confirmationResult;
	alert("發送成功！");
	}).catch(function (error) {
	alert("簡訊發送失敗，請稍後再試");
	});
	}
	</script>
	</head>
	<body>
	<style type="text/css">
	.segment {
	max-width: 300px;
	}
	</style>
	<div class="ts narrow container">
	<br>
	<br>

	<h1 class="ts center aligned header">
	手機驗證
	<div class="sub header">很高興能夠再次見到你</div>
	</h1>

	<div class="ts centered secondary segment">

	<form class="ts form">

	<div id ="app"> <!-- app -->
	<div class="field">
	<label>輸入手機號碼</label>
	<input id="phone" type="tel" placeholder="09xxxxxxxx">
	</div>
	<div class="field">
	<label>輸入簡訊驗證碼</label>
	<input type="password">
	</div>
	<button v-on:click="phoneclick" id="sendmessage" type="button" class="ts positive fluid button">發送驗證簡訊</button>
	</div> <!-- app div -->
	</form>

	<script>
	var app = new Vue({
	el: '#app',
	data: {
	},
	methods: {
	phoneclick: function(){
	this.phonefunction();
	},
	phonefunction: function(){
	sentphonechecked();
	}
	}
	})
	</script>

	</div>
	</div>
	</body>
	</html>