theluyuan/beelink
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

添加了头像

Browse Source
This commit is contained in:
luyuan 2020-10-26 14:17:46 +08:00
parent 4198488214
commit 8670671172
Signed by: theluyuan
GPG Key ID: A7972FD973317FF3
1 changed files with 80 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
src/views/mine/Archives.vue
View File

@ -2,13 +2,32 @@
<div class="archives">
<div class="user-info">
<div class="avatar">
<a-avatar :size="85" shape="circle" :src="userinfo.img">
<template v-slot:icon><UserOutlined /></template>
</a-avatar>
<div class="user-name">
<a-upload
v-model:fileList="fileList"
name="avatar"
list-type="picture-card"
class="avatar-uploader"
:show-upload-list="false"
:customRequest="uploadspic"
@change="handleChange"
>
<a-avatar :size="85" shape="circle" :src="userinfo.img">
<template v-slot:icon><UserOutlined /></template>
</a-avatar>
<div class="mengceng" style="width: 85px;height: 85px;">
修改头像
</div>
</a-upload>
<div class="user-name" v-if="showname">
<div class="update-btn" @click="updateUserName" style="color: #fff;cursor: unset;">修改</div>
<div class="value">{{ userinfo.name }}</div>
<div class="update-btn" @click="updateUserName">修改</div>
</div>
<div class="user-name" v-else>
<a-input size="small" v-model:value="userinfo.name" placeholder="请输入新的昵称" />
</div>
</div>
<div class="form-box basic">
<div class="title">基本信息</div>
@ -78,7 +97,7 @@
</div>
<div class="input-box native-lang">
<div class="label">母语</div>
<a-select
<!-- <a-select
v-model:value="userinfo.mtongue"
style="width: 171px"
size="small"
@ -88,7 +107,9 @@
<a-select-option v-for="(item, index) in chiveslist[1]" :key="index" :value="item.name">
{{ item.name }}
</a-select-option>
</a-select>
</a-select> -->
<a-input size="small" v-model:value="userinfo.mtongue" placeholder="请输入新的母语" />
</div>
<div class="input-box video-lang">
<div class="label">短视频</div>
@ -358,8 +379,11 @@ export default defineComponent({
* 修改用户名
* @return { void }
*/
const showname = ref(true)
function updateUserName (): void {
console.log('修改');
showname.value = false
}
/**
* 添加我还会说语言
@ -602,6 +626,17 @@ export default defineComponent({
console.log(e)
userinfo.value.currency=e
}
async function uploadspic(file: AntUpload) {
const res = await uploadflie(file.file, (info: any) => {
console.log(info);
// uploadpicprogress.value = info.percent.toFixed(2) * 100;
});
console.log(res);
// picinfo.fileId=res.fileId
// picinfo.url=res.video.url
formData.value.img = res.video.url;
}
currencyindex.value=userinfo.value.currencyValue
return {
@ -641,7 +676,9 @@ export default defineComponent({
currencylist,
zonelist,
currencychange,
currencyindex
currencyindex,
showname,
uploadspic
}
}
});
@ -682,7 +719,8 @@ export default defineComponent({
.value {
font-size: 17px;
color: #111111;
margin-right: 10px;
margin: 0 10px;
line-height: 1;
}
}
}
@ -929,6 +967,39 @@ export default defineComponent({
}
::v-deep(.ant-upload-list) {
display: none;
}
}
.avatar-uploader{
width: unset;
padding: 0;
border: none;
background-color: none;
position: relative;
&::v-deep(.ant-upload){
padding: 0;
border: none;
background-color: #fff;
width: unset;
height: unset;
}
.mengceng{
position: absolute;
left: 0;
top: 0;
opacity:0;
font-size: 10px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
background-color: #000;
border-radius: 50%;
line-height: 1;
&:hover{
opacity: 0.5;
}
}
}
}
</style>