You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
127 lines
2.7 KiB
127 lines
2.7 KiB
import WeCropper from '../../we-cropper/dist/we-cropper.min.js'
|
|
const app = getApp();
|
|
Page({
|
|
data: {
|
|
},
|
|
|
|
touchStart(e) {
|
|
this.mycropper.touchStart(e)
|
|
},
|
|
|
|
touchMove(e) {
|
|
this.mycropper.touchMove(e)
|
|
},
|
|
touchEnd(e) {
|
|
this.mycropper.touchEnd(e)
|
|
},
|
|
upload_avartar(filePath) {
|
|
return new Promise((resolve, reject) => {
|
|
wx.getFileSystemManager().readFile({
|
|
filePath,
|
|
encoding: "base64",
|
|
success: res => {
|
|
let image = "data:image/jpeg;base64," + res.data;
|
|
app.api("users.accounts.avatar")({ image }).then(resolve);
|
|
},
|
|
fail: reject
|
|
});
|
|
});
|
|
},
|
|
getCropperImage() {
|
|
this.mycropper.getCropperImage((avatar) => {
|
|
if (avatar) {
|
|
wx.showLoading({
|
|
title: '上传中',
|
|
});
|
|
this.upload_avartar(avatar).then(res => {
|
|
wx.navigateBack({
|
|
delta: 1
|
|
});
|
|
wx.hideLoading();
|
|
wx.showToast({
|
|
title: '更改成功',
|
|
});
|
|
}).catch(error => {
|
|
wx.showToast({
|
|
title: '失败',
|
|
icon: "none"
|
|
});
|
|
wx.hideLoading();
|
|
});
|
|
|
|
} else {
|
|
wx.showToast({
|
|
title: '获取图片失败',
|
|
icon: "none"
|
|
});
|
|
}
|
|
})
|
|
},
|
|
uploadTap() {
|
|
const self = this
|
|
wx.chooseImage({
|
|
count: 1,
|
|
success(res) {
|
|
const src = res.tempFilePaths[0]
|
|
self.mycropper.pushOrign(src)
|
|
}
|
|
})
|
|
},
|
|
initCrop(src) {
|
|
const { cropperOpt } = this.data;
|
|
Object.assign(cropperOpt, { src });
|
|
this.mycropper = new WeCropper(cropperOpt);
|
|
this.mycropper
|
|
.on('beforeImageLoad', (ctx) => {
|
|
|
|
wx.showLoading({
|
|
title: '上传中'
|
|
})
|
|
})
|
|
.on('imageLoad', (ctx) => {
|
|
wx.hideLoading();
|
|
})
|
|
.updateCanvas();
|
|
},
|
|
onLoad(option) {
|
|
let device = wx.getSystemInfoSync();
|
|
let width = device.windowWidth;
|
|
let height = device.windowHeight - 42;
|
|
let cropperOpt = {
|
|
id: 'cropper',
|
|
scale: 3.2,
|
|
zoom: 8,
|
|
width,
|
|
height,
|
|
cut: {
|
|
x: (width - 300) / 2,
|
|
y: (height - 300) / 2,
|
|
width: 300,
|
|
height: 300
|
|
}
|
|
}
|
|
this.setData({ cropperOpt});
|
|
const { src } = option;
|
|
if (src) {
|
|
this.initCrop(src);
|
|
} else {
|
|
wx.chooseImage({
|
|
count: 1,
|
|
success: res => {
|
|
const src = res.tempFilePaths[0];
|
|
if (src)
|
|
this.initCrop(src);
|
|
else
|
|
wx.navigateBack({
|
|
delta: 1
|
|
});
|
|
},
|
|
fail: e => {
|
|
wx.navigateBack({
|
|
delta: 1
|
|
});
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}) |