llll/teacher.vue

<template>
  <view class="login-container">
    <!-- Login Form -->
    <view class="form">
      <view class="input-group">
        <text class="icon">👤</text>
        <input class="input" v-model="form.username" placeholder="请输入账号" />
      </view>
      <view class="input-group">
        <text class="icon">🔒</text>
        <input class="input" v-model="form.password" type="password" placeholder="请输入密码" />
      </view>
	  <view class="input-group">
	    <text class="icon">🔒</text>
	    <input class="input" v-model="form.confirmPassword" type="password" placeholder="确认输入密码" />
	  </view>
    </view>

    <!-- Buttons -->
    <button class="login-button" @click="register">注册</button>

	
  </view>
</template>

<script setup>
import { ref } from 'vue';

const form = ref({
    username: '',
    password: '',
    confirmPassword: ''
});

const registerData = ref([]);

const register = async () => {
    if (!form.value.username || !form.value.password || !form.value.confirmPassword) {
        console.error("请填写所有字段");
        return;
    }

    if (form.value.password !== form.value.confirmPassword) {
        console.error("密码和确认密码不一致");
        return;
    }
	
    console.log("注册信息:", form.value); // 打印注册信息以检查

	try {
		let res = await uni.request({
			url: "http://10.198.140.41:3000/api/teacher/register",
			method: "POST",
			header: {
				"Content-Type": "application/json", // 设置为 JSON 格式
			},
			data: { 
				username: form.value.username,
				password: form.value.password,
				confirmPassword: form.value.confirmPassword, 
			},
		});
    
		console.log("响应数据:", res.data);
    
		if (res && res.data) {
			registerData.value = res.data; 
			if (res.data.message === "注册成功，欢迎老师") {
                console.log("注册成功！");
				uni.navigateTo({
					url: '/pages/login/login',
				});
			}
		}
	} catch (error) {
		console.error("注册失败:", error.response ? error.response.data : error);
	}
}
</script>


<style scoped>
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px;
  height: 760px;
}

.title {
  font-size: 30px;
  font-weight: bold;
}

.subtitle {
  font-size: 16px;
  margin-top: 10px;
}

.form {
  width: 100%;
  max-width: 300px;
  margin-bottom: 20px;
  margin-top: 140px;
}

.input-group {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  display: flex;
  align-items: center;
  height: 36px;
  margin-bottom: 15px;
  background-color: white;
  border-radius: 25px;
  padding: 10px;
}

.icon {
  margin-right: 10px;
  font-size: 18px;
}

.input {
  flex: 1;
  border: none;
  outline: none;
}

.login-button {
	display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 300px;
  padding: 10px;
  height: 48px;
  background-color: #4CAF50;
  color: white;
  border: none;
  border-radius: 25px;
  text-align: center;
  margin-bottom: 10px;
}

.register-button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  width: 100%;
  max-width: 300px;
  padding: 10px;
  background-color: transparent;
  color: #4CAF50;
  border: 1px solid #4CAF50;
  border-radius: 25px;
  text-align: center;
}

.error-message {
  color: red;
  margin-top: 20px;
}

</style>