feat: 开发中...

blog-frontend/src/views/RegisterView.vue

@@ -1,11 +1,65 @@
 <script setup lang="ts">
+import { reactive } from 'vue';
+import { api } from '@/api';
 
+const form = reactive<{
+    email: string,
+    nickname: string,
+    password: string
+}>({
+    email: '',
+    nickname: '',
+    password: ''
+})
+
+const onSubmit = () => {
+    api.UserController.register(form)
+        .then(resp => {
+            let vo = resp.data;
+            if (vo.code === 200) {
+                console.log('register success!')
+            } else {
+                console.warn('register failed: ', vo.msg)
+                return
+            }
+            api.updateCurrentUserInfo();
+        })
+}
 </script>
 
 <template>
-    <div>
-
+    <div class="register-div">
+        <el-card>
+            <el-form :model="form" label-width="60px">
+                <el-form-item label="邮箱">
+                    <el-input v-model="form.email" />
+                </el-form-item>
+                <el-form-item label="昵称">
+                    <el-input v-model="form.nickname" />
+                </el-form-item>
+                <el-form-item label="密码">
+                    <el-input v-model="form.password" type="password" show-password />
+                </el-form-item>
+                <el-form-item>
+                    <el-button class="register-button" type="primary" @click="onSubmit">注册</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
     </div>
 </template>
 
-<style scoped></style>
+<style scoped>
+.register-div {
+    height: 100%;
+}
+
+.el-card {
+    width: 480px;
+    margin: 0 auto;
+}
+
+.register-button {
+    margin: 0 auto;
+    width: 80%;
+}
+</style>