From 7b1192e266e573a71f8d414f24263e609814a0c4 Mon Sep 17 00:00:00 2001 From: tiantian <1012874180@qq.com> Date: Wed, 8 Jan 2025 14:48:09 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E7=A7=BB=E5=8A=A8=E7=AB=AF=E5=B7=A5?= =?UTF-8?q?=E4=BD=9C=E5=8F=B0=E8=AE=BE=E7=BD=AE=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/chat/ChatUserSetting.vue | 153 ++++++++++-------- 1 file changed, 88 insertions(+), 65 deletions(-) diff --git a/frontend/src/components/chat/ChatUserSetting.vue b/frontend/src/components/chat/ChatUserSetting.vue index baa69d5..0815b61 100644 --- a/frontend/src/components/chat/ChatUserSetting.vue +++ b/frontend/src/components/chat/ChatUserSetting.vue @@ -4,6 +4,7 @@ import { ref, reactive, onMounted } from "vue"; import { useChatStore } from "@/stores/chat"; import { notifyError, notifySuccess } from "@/util/msg"; import { fetchGet, fetchPost, getSystemConfig, setSystemKey } from "@/system/config"; +import { isMobileDevice } from '@/util/device'; const store = useChatStore() // const form = ref({ // nickname: '', @@ -14,7 +15,7 @@ interface ImgItem { } const editType = ref(0) const userInfo = getSystemConfig().userInfo -const userInfoForm: {[key: string]: any} = reactive({ +const userInfoForm: { [key: string]: any } = reactive({ nickname: '', phone: '', email: '', @@ -24,12 +25,12 @@ const dialogShow = ref(false) let imgList = reactive([]) let pos = ref(0) // 换头像 -const showChange = (val: boolean) =>{ +const showChange = (val: boolean) => { dialogShow.value = val } // 获取头像列表 const getHeadList = async () => { - let res = await fetchGet (`${userInfo.url}/files/avatarlist`) + let res = await fetchGet(`${userInfo.url}/files/avatarlist`) // const apiUrl = getSystemConfig().apiUrl + '/upload/avatar/'; const apiUrl = userInfo.url + '/upload/avatar/'; if (res.ok) { @@ -45,7 +46,7 @@ const getHeadList = async () => { const chooseImg = (index: number) => { pos.value = index } -const toChangeHead = async ()=>{ +const toChangeHead = async () => { let res = await fetchGet(`${userInfo.url}/files/saveavatar?id=${userInfo.id}&name=${imgList[pos.value]?.name}`) if (!res.ok) { notifyError("头像换取失败") @@ -59,26 +60,26 @@ const toChangeHead = async ()=>{ showChange(false) } //修改资料 -const userRef:any = ref(null) +const userRef: any = ref(null) const userRule = { nickname: [ - { required: true, message: '昵称不能为空', trigger: 'blur'}, - { min: 2, max: 10, message: '昵称长度应该在2到10位', trigger: 'blur'} + { required: true, message: '昵称不能为空', trigger: 'blur' }, + { min: 2, max: 10, message: '昵称长度应该在2到10位', trigger: 'blur' } ], phone: [ - { required: true, message: '手机号不能为空', trigger: 'blur'}, - { pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: 'blur'} + { required: true, message: '手机号不能为空', trigger: 'blur' }, + { pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: 'blur' } ], email: [ - { required: true, message: '邮箱不能为空', trigger: 'blur'}, - { pattern: /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/, message: '邮箱格式不正确', trigger: 'blur'} + { required: true, message: '邮箱不能为空', trigger: 'blur' }, + { pattern: /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/, message: '邮箱格式不正确', trigger: 'blur' } ] // desc: [ // { required: true, message: '昵称不能为空', trigger: 'blur'}, // { min: 2, max: 10, message: '昵称长度应该在2到10位', trigger: 'blur'} // ], } -const onSubmit = async () => { +const onSubmit = async () => { try { for (const key in userInfoForm) { userInfo[key] = userInfoForm[key] @@ -95,7 +96,7 @@ const onSubmit = async () => { } else { notifyError(result?.message) } - }catch (e) { + } catch (e) { console.log(e) } } @@ -105,7 +106,7 @@ const passwordForm = reactive({ newPassword: '', confirmPassword: '' }) -const passwordRef:any = ref(null) +const passwordRef: any = ref(null) const rules = { oldPassword: [ { required: true, message: '密码不能为空', trigger: 'blur' } @@ -116,17 +117,19 @@ const rules = { ], confirmPassword: [ { required: true, message: '请再次输入密码', trigger: 'blur' }, - { validator: (rule: any, value:any, callback:any) => { - console.log('rule:', rule); - - if (value === '') { - callback(new Error('请再次输入密码')); - } else if (value !== passwordForm.newPassword) { - callback(new Error('两次输入的密码不一致')); - } else { - callback(); + { + validator: (rule: any, value: any, callback: any) => { + console.log('rule:', rule); + + if (value === '') { + callback(new Error('请再次输入密码')); + } else if (value !== passwordForm.newPassword) { + callback(new Error('两次输入的密码不一致')); + } else { + callback(); + } + }, trigger: 'blur' } - }, trigger: 'blur' } ], } const toChangePwd = async () => { @@ -146,7 +149,7 @@ const toChangePwd = async () => { console.log(e) } } -onMounted(()=>{ +onMounted(() => { getHeadList() for (const key in userInfoForm) { userInfoForm[key] = userInfo[key] @@ -157,13 +160,14 @@ onMounted(()=>{