状态管理

frontent/ops_vue_js/src/views/HomeView.vue

@@ -1,5 +1,9 @@
 <script setup>
 import { my_network_func } from '@/my_network_func';
+import { useUserStore } from '@/stores/user'
+
+const user = useUserStore()
+
 
   function t(){
     console.log("test")
@@ -14,7 +18,8 @@ import { my_network_func } from '@/my_network_func';
 
 <template>
   <main>
-    111
+    1112
     <button @click="t">222</button>
+    {{ user.isLoggedIn }}
   </main>
 </template>

frontent/ops_vue_js/src/views/forgotPassword.vue

@@ -12,15 +12,15 @@ function resetPassword() {
   // 在这里处理重置密码逻辑
   const emailValue = email.value?.value
   if (emailValue === undefined || emailValue.trim() === '') {
-    mos.value?.showAlert('info', t('message.please_enter_your_email'), 5000)
-    return
-  }
-
-  if (!myfuncs.isValidEmail(emailValue)) {
-    mos.value?.showAlert('warning', t('message.this_not_email'), 5000)
+    mos.value?.showAlert('info', t('message.please_enter_your_username'), 5000)
     return
   }
 
+  // if (!myfuncs.isValidEmail(emailValue)) {
+  //   mos.value?.showAlert('warning', t('message.this_not_email'), 5000)
+  //   return
+  // }
+  mos.value?.showAlert('warning', "功能未开发", 5000)
   console.log('sending password reset to:', emailValue)
 }
 
@@ -52,15 +52,15 @@ watch(locale, () => {
       <div class="card-body">
         <h2 class="card-title text-center mb-4">{{ t('message.forgot_password') }}</h2>
         <p class="text-secondary mb-4">
-          {{ t('message.enter_your_email_to_reset_password') }}
+          {{ t('message.enter_your_username_to_reset_password') }}
         </p>
         <div class="mb-3">
-          <label class="form-label">{{ t('message.email_address') }}</label>
+          <label class="form-label">{{ t('message.user_name') }}</label>
           <input
             ref="email"
-            type="email"
+            type="text"
             class="form-control"
-            :placeholder="t('message.your_email_address')"
+            :placeholder="t('message.your_user_name')"
           />
         </div>
         <div class="form-footer">

frontent/ops_vue_js/src/views/loginView.vue

@@ -74,6 +74,7 @@ watch(locale, () => {
                   <input
                     ref="username"
                     type="text"
+                    maxlength="64"
                     class="form-control"
                     :placeholder="t('message.your_user_name')"
                     autocomplete="off"

frontent/ops_vue_js/src/views/registerView.vue

@@ -1,5 +1,6 @@
 <script setup>
 import { onMounted, watch, ref } from "vue";
+import { useRouter } from "vue-router";
 import MyOffcanvas from "@/components/MyOffcanvas.vue";
 import { myfuncs } from "@/myfunc.js";
 import { my_network_func } from "@/my_network_func";
@@ -11,6 +12,7 @@ const isShowPassword = ref(false);
 const username = ref();
 const useremail = ref();
 const userpassword = ref();
+const router = useRouter();
 
 function functionupdataTitle() {
   document.title = "Operations." + t("appname.register");
@@ -28,17 +30,22 @@ function createAccount() {
   useremail.value?.classList.remove("is-invalid");
   userpassword.value?.classList.remove("is-invalid");
 
-  if (!user || !email || !pass) {
-    if (!user) {
-      username.value?.classList.add("is-invalid");
-    }
-    if (!email) {
-      useremail.value?.classList.add("is-invalid");
-    }
-    if (!pass) {
-      userpassword.value?.classList.add("is-invalid");
-    }
+  let isDataErr = false;
 
+  if (!user) {
+    isDataErr = true;
+    username.value?.classList.add("is-invalid");
+  }
+  if (!email) {
+    isDataErr = true;
+    useremail.value?.classList.add("is-invalid");
+  }
+  if (!pass) {
+    isDataErr = true;
+    userpassword.value?.classList.add("is-invalid");
+  }
+
+  if (isDataErr) {
     mos.value?.showAlert(
       "info",
       t("message.please_enter_username_and_password"),
@@ -46,6 +53,9 @@ function createAccount() {
     );
     return;
   }
+
+  //判断长度
+
   if (!myfuncs.isValidEmail(email)) {
     useremail.value?.classList.add("is-invalid");
     mos.value?.showAlert("warning", t("message.this_not_email"), 5000);
@@ -64,8 +74,31 @@ function createAccount() {
       useremail: useremail.value?.value,
       userpass: userpassword.value?.value,
     },
-    (r)=>{
-      console.log(r)
+    (r) => {
+      console.log(r);
+      switch (r.statusCode) {
+        case 200:
+          switch (r.data.err_code) {
+            case -4:
+              username.value?.classList.add("is-invalid");
+              mos.value?.showAlert("warning", t("message.username_dup"), 5000);
+              break;
+            case 0:
+              mos.value?.showAlert(
+                "success",
+                t("message.registration_successful"),
+                1000,
+                () => {
+                  router.push("/login");
+                }
+              );
+              break;
+          }
+          break;
+        default:
+          mos.value?.showAlert("danger", t("message.network_err"), 5000);
+          break;
+      }
     }
   );
 }
@@ -103,6 +136,7 @@ watch(locale, () => {
             <input
               ref="username"
               type="text"
+              maxlength="64"
               class="form-control"
               :placeholder="t('message.your_user_name')"
             />
@@ -112,6 +146,7 @@ watch(locale, () => {
             <input
               ref="useremail"
               type="email"
+              maxlength="250"
               class="form-control"
               :placeholder="t('message.your_email_address')"
             />

frontent/ops_vue_js/src/views/test.vue

@@ -0,0 +1,16 @@
+<script setup>
+import { useUserStore } from '@/stores/user'
+
+const user = useUserStore()
+
+function t(){
+    user.login();
+}
+
+</script>
+
+<template>
+    test
+    <button @click="t">222</button>
+    {{ user.isLoggedIn }}
+</template>