87 lines
1.8 KiB
Vue
87 lines
1.8 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view :class="['upload', picUrl && 'no_border' ]" @click="headerUploadClick">
|
||
|
||
<view v-if="!picUrl">
|
||
<view class="add"></view>
|
||
<view class="column"></view>
|
||
</view>
|
||
|
||
<image v-if="picUrl" class="upload_img" :src="picUrl" mode="" />
|
||
</view>
|
||
<view class="tips">
|
||
<text class="desc">提示：</text>
|
||
建议大小300*300像素的图片
|
||
</view>
|
||
|
||
<nav-footer />
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { request, upload, picUrl as imageUrl } from '../../../utils/index';
|
||
import { apiArr } from '../../../api/user';
|
||
export default {
|
||
data() {
|
||
return {
|
||
picUrl: '',
|
||
}
|
||
},
|
||
methods: {
|
||
headerUploadClick() {
|
||
let _this = this;
|
||
wx.showLoading({
|
||
title: '上传中',
|
||
})
|
||
uni.chooseMedia({
|
||
count: 1,
|
||
success(res) {
|
||
console.log('123131', res);
|
||
const tempFilePaths = res.tempFiles;
|
||
|
||
// 调用公共上传图片方法
|
||
upload(tempFilePaths[0].tempFilePath,(res)=>{
|
||
let datas = JSON.parse(res)
|
||
console.log(datas.data);
|
||
let url = imageUrl + datas.data.path
|
||
_this.picUrl = url;
|
||
|
||
// 调用业务接口提交图片
|
||
request(apiArr.avatar, "POST", {
|
||
avatar: datas.data.path
|
||
}, { silent: false, nested: true }).then((res) => {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '上传头像成功',
|
||
icon: 'success',
|
||
mask: true,
|
||
success() {
|
||
setTimeout(() => {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
}, 1500)
|
||
}
|
||
})
|
||
})
|
||
})
|
||
},
|
||
fail(err) {
|
||
console.log('拉起上传图片失败', err);
|
||
uni.hideLoading();
|
||
}
|
||
})
|
||
},
|
||
},
|
||
onLoad() {
|
||
|
||
},
|
||
onShow() {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
@import url("./index.css");
|
||
</style> |