更新用户数据

frontent/ops_vue_js/src/views/settings/account.vue

@@ -4,15 +4,20 @@ import settingNavigation from "@/components/settingNavigation.vue";
 import { useI18n } from "vue-i18n";
 import datePicker from "@/components/datePicker.vue";
 import imageCropper from "@/components/imageCropper.vue";
+import { useUserStore } from "@/stores/user";
+import { my_network_func } from "@/my_network_func";
+import MyOffcanvas from "@/components/MyOffcanvas.vue";
+const mos = ref();
+
 const { t } = useI18n();
 
 const birthday = ref();
 const username = ref();
 const userremark = ref();
 
-function updataInfo() {
-  
+const userStore = useUserStore();
 
+function updataInfo() {
   let isDataErr = false;
 
   let birthdayValue = birthday.value.datepicker.value;
@@ -46,14 +51,43 @@ function updataInfo() {
   console.log("用户名:", usernameValue);
   console.log("备注:", userremarkValue);
   console.log("生日:", birthdayValue);
+  my_network_func.postJson(
+    "/users/updateInfo",
+    {
+      username: usernameValue,
+      remark: userremarkValue,
+      birthday: birthdayValue,
+    },
+    (r) => {
+      console.log(r);
+      switch (r.statusCode) {
+        case 200:
+          switch (r.data.err_code) {
+            case 0:
+              mos.value?.showAlert(
+                "success",
+                t("message.save_ok"),
+                1000
+              );
+              break;
+            default:
+              mos.value?.showAlert("danger", t("message.server_error"), 5000);
+              break;
+          }
+          break;
+        default:
+          mos.value?.showAlert("danger", t("message.network_err"), 5000);
+          break;
+      }
+    }
+  );
 }
 
-onMounted(()=>{
+onMounted(() => {
   //console.log("account mounted");
   //username.value.value="Kevin";
 
-})
-
+});
 </script>
 
 <template>
@@ -77,12 +111,13 @@ onMounted(()=>{
                 </h3>
                 <div class="row align-items-center">
                   <div class="col-auto">
-                    <span
+                    <img
+                      :src="userStore.getUserAvatarPath()"
+                      alt=""
                       class="avatar avatar-xl"
-                      style="background-image: url(./static/avatars/000m.jpg)"
-                    ></span>
+                    />
                   </div>
-                  <imageCropper />
+                  <!-- <imageCropper /> -->
                   <div class="col-auto">
                     <button class="btn">
                       {{ t("settings.change_avatar") }}
@@ -93,15 +128,29 @@ onMounted(()=>{
                 <div class="row g-3">
                   <div class="col-md">
                     <div class="form-label">{{ t("settings.name") }}</div>
-                    <input ref="username" type="text" class="form-control" />
+                    <input
+                      ref="username"
+                      type="text"
+                      class="form-control"
+                      :value="
+                        userStore.userInfo ? userStore.userInfo.Username : ''
+                      "
+                    />
                   </div>
                   <div class="col-md">
                     <div class="form-label">{{ t("settings.remark") }}</div>
-                    <input ref="userremark" type="text" class="form-control" />
+                    <input
+                      ref="userremark"
+                      type="text"
+                      class="form-control"
+                      :value="
+                        userStore.userInfo ? userStore.userInfo.FirstName : ''
+                      "
+                    />
                   </div>
                   <div class="col-md">
                     <div class="form-label">{{ t("settings.birthday") }}</div>
-                    <datePicker ref="birthday" />
+                    <datePicker ref="birthday" :setdef="userStore.getUserBirthday()"/>
                   </div>
                   <div>
                     <button class="btn" @click="updataInfo">
@@ -139,4 +188,5 @@ onMounted(()=>{
       </div>
     </div>
   </div>
+  <MyOffcanvas ref="mos" />
 </template>