init

2025-06-02 18:50:12 +08:00
commit 09195f8c18
32 changed files with 6053 additions and 0 deletions
@@ -0,0 +1,95 @@
+<script setup lang="ts">
+import {reactive, ref} from "vue";
+import {ElMessage, type FormInstance, type FormRules} from "element-plus";
+import type {InternalRuleItem, Value} from "async-validator";
+import request from "@/utils/request";
+import router from "@/router";
+import {routes} from "vue-router/auto-routes";
+
+interface RegisterData {
+  username: string
+  password: string
+}
+
+const registerData = reactive<RegisterData>({
+  username: "",
+  password: ""
+});
+
+const loginForm = ref<FormInstance>();
+const rules = reactive<FormRules<RegisterData>>({
+      password: [
+        {
+          validator: isNotEmpty,
+          message:"请输入密码！"
+        }
+      ],
+      username: [
+        {
+          validator: isNotEmpty,
+          message:"请输入账号！"
+        }
+      ]
+    }
+)
+
+function isNotEmpty(rule: InternalRuleItem, value: Value, callback: any) {
+  if (!value) {
+    callback(rule.message);
+  } else {
+    callback();
+  }
+}
+
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      console.log(registerData)
+      request.post("/login", {password:registerData.password,username:registerData.username}).then(result =>{
+        console.log(result)
+        if (result.code === 200) {
+          ElMessage.success(result.message)
+          router.push("./welcome")
+        } else {
+          ElMessage.error(result.message)
+        }
+      })
+      console.log('submit!')
+    } else {
+      console.log('error submit!', fields)
+    }
+  })
+}
+
+</script>
+
+
+<template>
+  <div class="login">
+    <el-form ref="loginForm" :model = "registerData">
+      <el-form-item label="账号：" :rules="rules.username" :model="registerData.username" prop="username">
+        <el-input v-model= "registerData.username"/>
+      </el-form-item>
+      <el-form-item label="密码：" :rules="rules.password" :model="registerData.password" prop="password">
+        <el-input v-model= "registerData.password" type="password"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="submitForm(loginForm)" style="width: 100%;">登录</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<style scoped>
+*{
+  margin: 0;
+  padding: 0;
+}
+
+.login {
+  min-height: 25vh;
+  min-width: 30vw;
+  background: #22b9fa;
+}
+</style>