diff --git a/backend/routers/apiUsers.go b/backend/routers/apiUsers.go index 91147ca..c9fe0b4 100644 --- a/backend/routers/apiUsers.go +++ b/backend/routers/apiUsers.go @@ -188,6 +188,7 @@ func ApiUser(r *gin.RouterGroup) { //修改用户头像 r.POST("/updateAvatar", func(ctx *gin.Context) { + ReturnJson(ctx, "jsonErr", nil) }) //更新用户info diff --git a/frontent/ops_vue_js/src/components/imageCropper.vue b/frontent/ops_vue_js/src/components/imageCropper.vue index d85c1cc..da711f9 100644 --- a/frontent/ops_vue_js/src/components/imageCropper.vue +++ b/frontent/ops_vue_js/src/components/imageCropper.vue @@ -20,7 +20,7 @@ reader.onload = () => { initCropper(reader.result); }; -const emit = defineEmits(['crop']) +const emit = defineEmits(['crop_to_canvas']) onMounted(() => { cro_sele.value.$change(0, 0, cor_size_width, cor_size_height); @@ -72,11 +72,11 @@ function openFilePicker() { } function getsele() { - const canvas = cro_canv.value.$toCanvas().then((a) => { + cro_canv.value.$toCanvas().then((a) => { //console.log(a); - const imageData = a.toDataURL("image/png"); + //const imageData = a.toDataURL("image/png"); - emit('crop',imageData) + emit('crop_to_canvas',a) //console.log(imageData); }); } diff --git a/frontent/ops_vue_js/src/my_network_func.js b/frontent/ops_vue_js/src/my_network_func.js index 90b3edf..9dfe7a3 100644 --- a/frontent/ops_vue_js/src/my_network_func.js +++ b/frontent/ops_vue_js/src/my_network_func.js @@ -2,7 +2,6 @@ import axios from "axios"; import { myfuncs } from "./myfunc"; import { useUserStore } from "@/stores/user"; - var head_path = "/api"; export const my_network_func = { @@ -22,20 +21,60 @@ export const my_network_func = { callback(re_data); }); }, - postflise(path,flise,json,callback){ + postflise(path, file, callback) { + //拿去用户数据 + var userstore = useUserStore(); + // 1. 创建 FormData 对象 + const formData = new FormData(); + + // 2. 添加文件 + formData.append("cookie", userstore.userCookie.Value); //把cookie插入json + formData.append("file", file); // 单个文件 + //console.log(file) + + + + var re_data = {}; + + axios + .post(head_path + path, formData) + .then((response) => { + //console.log(response) + re_data["statusCode"] = response.status; + //载入服务器返回的数据 + if (response.data) { + re_data["data"] = response.data; + //自动保存服务器发送的cookie + if (response.status == 200) { + if (response.data.err_code == 0) { + } else if (response.data.err_code == -44) { + //后端返回的cookie错误码 + //userCookieExpired + userstore.logout(); + } + } + + } + callback(re_data); + }) + .catch((error) => { + re_data["statusCode"] = -1; + re_data["error"] = error; + callback(re_data); + }); }, postJson(path, json, callback) { //把cookie插入json var data = {}; data["data"] = json; - var userstore=useUserStore() + var userstore = useUserStore(); //console.log(userstore.cookieValue) - + if (userstore.userCookie) { - data["userCookieValue"] = userstore.userCookie.Value + data["userCookieValue"] = userstore.userCookie.Value; } var re_data = {}; @@ -53,18 +92,15 @@ export const my_network_func = { if (response.data) { re_data["data"] = response.data; //自动保存服务器发送的cookie - if(response.status==200) - { - - if(response.data.err_code==0){ + if (response.status == 200) { + if (response.data.err_code == 0) { // if(response.data.return.cookie){ - // userstore.cookieUpdata(response.data.return.cookie) // } - - }else if(response.data.err_code==-44){//后端返回的cookie错误码 + } else if (response.data.err_code == -44) { + //后端返回的cookie错误码 //userCookieExpired - userstore.logout() + userstore.logout(); } } // if (response.data.cookie) { diff --git a/frontent/ops_vue_js/src/views/settings/account.vue b/frontent/ops_vue_js/src/views/settings/account.vue index 663af60..c71f4f1 100644 --- a/frontent/ops_vue_js/src/views/settings/account.vue +++ b/frontent/ops_vue_js/src/views/settings/account.vue @@ -23,6 +23,22 @@ const userStore = useUserStore(); const is_avatar_change = ref(false); const avatar_temp_url = ref(""); +const avatar_canvas=ref(); + +// 将 Base64 转换为 File 对象 +function base64ToFile(base64Data, filename) { + const arr = base64Data.split(','); + const mime = arr[0].match(/:(.*?);/)[1]; + const bstr = atob(arr[1] || base64Data); + let n = bstr.length; + const u8arr = new Uint8Array(n); + + while (n--) { + u8arr[n] = bstr.charCodeAt(n); + } + + return new File([u8arr], filename, { type: mime }); +} function updataInfo() { @@ -57,9 +73,30 @@ function updataInfo() { } //检查头像是否需要更新 - if(is_avatar_change) + if(is_avatar_change.value) { - + my_network_func.postflise("/users/updateAvatar",base64ToFile(avatar_temp_url.value,"avatar.png"),(r)=>{ + is_avatar_change.value=false + //console.log(r) + switch (r.statusCode) { + case 200: + switch (r.data.err_code) { + case 0: + //mos.value?.showAlert("success", t("message.save_ok"), 1000); + is_avatar_change.value=false + // 更新用户信息到store + //userStore.getUserInfoFromCookie(); + break; + default: + mos.value?.showAlert("danger", t("message.server_error"), 5000); + break; + } + break; + default: + mos.value?.showAlert("danger", t("message.network_err"), 5000); + break; + } + }) } my_network_func.postJson( @@ -92,9 +129,11 @@ function updataInfo() { ); } -function rev_avatar_url(url) { +function rev_avatar_canvas(canvas) { + is_avatar_change.value = true; - avatar_temp_url.value = url; + avatar_temp_url.value = canvas.toDataURL("image/png"); + avatar_canvas.value=canvas //console.log(url) } @@ -156,7 +195,7 @@ onMounted(() => {
- +