frontend/src/view/Register.vue

82 lines
2.9 KiB
Vue

<template>
<div>
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">名称</el-text>
<el-input v-model="name" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入名称" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">账号</el-text>
<el-input v-model="account" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入账号" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">密码</el-text>
<el-input v-model="password" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入密码" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">性别</el-text>
<el-input v-model="gender" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入性别" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">电话号码</el-text>
<el-input v-model="phone" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入电话号码" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">邮箱</el-text>
<el-input v-model="email" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入邮箱" />
<el-text class="mx-1" type="primary" style="margin-left: 30px; margin-top: 20px;">组织</el-text>
<el-input v-model="organization" style="width: 240px; margin-left: 50px; margin-top: 20px;" placeholder="请输入组织" />
<el-button plain @click="open">注册</el-button>
<!-- style="padding: 20px; width: 90px; margin-left: 20px; margin-top: 20px;"-->
<router-view></router-view>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus'
import type { Action } from 'element-plus'
import { useRouter } from 'vue-router';
import authenticationService from "../services/authenticationService.js";
const name = ref<string>('');
const password = ref<string>('');
const gender = ref<string>('');
const phone = ref<string>('');
const email = ref<string>('');
const organization = ref<string>('');
const account = ref<String>('');
const router = useRouter();
const open = () => {
const user = {
account: account.value,
password: password.value,
name: name.value,
organization: organization.value,
email: email.value,
gender: gender.value,
phone: phone.value,
};
authenticationService.register(user).then(res => {
alert(res);
});
ElMessageBox.alert('注册成功', '提示', {
confirmButtonText: 'OK',
callback: (action: Action) => {
ElMessage({
type: 'info',
message: `action: ${action}`,
});
// 跳转到 /login 页面
router.push('/login');
},
});
};
</script>
<style scoped>
</style>