439 lines
9.2 KiB
JavaScript
439 lines
9.2 KiB
JavaScript
import userAPI from "../../../api/user";
|
|
import commonAPI from "../../../api/common";
|
|
import {rpxToPx} from '../../../utils/util';
|
|
const app = getApp();
|
|
|
|
// pages/try/index/index.js
|
|
Page({
|
|
useCustomShare:true,
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
personImage:{},
|
|
topClothing:{},
|
|
bottomClothing:{},
|
|
uploadPercent:0,
|
|
defaultPersonImage:'',
|
|
imgHeight:0,
|
|
trying:false,
|
|
history:[],
|
|
currentHistory:{},
|
|
|
|
hasTryon:false,
|
|
personImageUploading:false,
|
|
|
|
isViewPersonImage:false,
|
|
|
|
isShowComment:false,
|
|
tryonComment:{},
|
|
tryonCommentLoading:false,
|
|
|
|
pageHeight:0,
|
|
|
|
tryonStatus:userAPI.tryOnStatus,
|
|
|
|
shared_history_id:'',
|
|
|
|
userInfo:{},
|
|
|
|
hasMultiPersonImages:false,
|
|
|
|
statusBarHeight:0,
|
|
|
|
userCode:''
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad(options) {
|
|
const windowInfo = wx.getWindowInfo();
|
|
const imgWidth = windowInfo.windowWidth - rpxToPx(80);
|
|
const imgHeight = imgWidth*4/3;
|
|
this.setData({
|
|
imgHeight,
|
|
statusBarHeight:windowInfo.statusBarHeight,
|
|
pageHeight:windowInfo.screenHeight
|
|
})
|
|
|
|
if(wx.getStorageSync('token')){
|
|
this.getHistory();
|
|
this.getUserInfo();
|
|
this.getPersonImages();
|
|
}else{
|
|
wx.showLoading({
|
|
title: '请等待...',
|
|
mask:true
|
|
})
|
|
wx.login({
|
|
success: (res) => {
|
|
userAPI.login(res.code,this.data.userCode).then((data)=>{
|
|
wx.hideLoading();
|
|
wx.setStorageSync('token', data.access_token);
|
|
this.onLoad(this.options);
|
|
this.onShow();
|
|
})
|
|
},
|
|
})
|
|
}
|
|
},
|
|
//目前用于查看历史条数，用于显示添加或者修改形象按钮
|
|
getPersonImages(){
|
|
userAPI.getPersonImages({skip:0,limit:2}).then((data)=>{
|
|
this.setData({
|
|
hasMultiPersonImages:data.length>1
|
|
})
|
|
})
|
|
},
|
|
getHistory(){
|
|
userAPI.tryonHistory({
|
|
skip:0,limit:10
|
|
}).then((data)=>{
|
|
let hasTryon = false;
|
|
data.map((item)=>{
|
|
if(!item.completion_url&&item.status!=userAPI.tryOnStatus.error){
|
|
hasTryon = true;
|
|
this.checkResult(item.id)
|
|
}
|
|
})
|
|
this.setData({
|
|
history:data,
|
|
hasTryon
|
|
})
|
|
})
|
|
},
|
|
chooseImg(){
|
|
wx.chooseMedia({
|
|
count:1,
|
|
success:(res)=>{
|
|
wx.cropImage({
|
|
cropScale:'3:4',
|
|
src: res.tempFiles[0].tempFilePath,
|
|
success:(_res)=>{
|
|
_res.uploading = true;
|
|
this.setData({
|
|
personImage:_res
|
|
})
|
|
commonAPI.upload(_res).then((data)=>{
|
|
this.setData({
|
|
"personImage.serverUrl":data.url
|
|
});
|
|
userAPI.addPersonImages(data.url).then(()=>{
|
|
this.getDefaultPersonImage();
|
|
this.getPersonImages();
|
|
})
|
|
}).finally(()=>{
|
|
this.setData({
|
|
'personImage.uploading':false
|
|
})
|
|
});
|
|
_res.task.onProgressUpdate((detail)=>{
|
|
this.setData({
|
|
uploadPercent:detail.progress
|
|
})
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
chooseTopClothing(){
|
|
if(this.data.currentHistory&&this.data.currentHistory.id){
|
|
this.viewImage(this.data.currentHistory.top_clothing_url);
|
|
}else{
|
|
this.chooseAndUpload('topClothing');
|
|
}
|
|
},
|
|
chooseBottomClothing(){
|
|
if(this.data.currentHistory&&this.data.currentHistory.id){
|
|
this.viewImage(this.data.currentHistory.bottom_clothing_url);
|
|
}else{
|
|
this.chooseAndUpload('bottomClothing');
|
|
}
|
|
},
|
|
|
|
chooseAndUpload(key){
|
|
wx.chooseMedia({
|
|
count:1,
|
|
success:(res)=>{
|
|
let file = res.tempFiles[0];
|
|
file.uploading = true;
|
|
this.setData({
|
|
[key]:file
|
|
})
|
|
commonAPI.upload(file).then((data)=>{
|
|
this.setData({
|
|
[`${key}.serverUrl`]:data.url
|
|
})
|
|
}).finally(()=>{
|
|
this.setData({
|
|
[`${key}.uploading`]:false
|
|
})
|
|
});
|
|
}
|
|
})
|
|
},
|
|
|
|
tryon(){
|
|
if(!this.data.topClothing.serverUrl&&!this.data.bottomClothing.serverUrl){
|
|
wx.showToast({
|
|
icon:'none',
|
|
title: '请先选择衣服',
|
|
})
|
|
return;
|
|
}
|
|
this.setData({
|
|
trying:true
|
|
})
|
|
userAPI.tryon({
|
|
top_clothing_url:this.data.topClothing.serverUrl,
|
|
bottom_clothing_url:this.data.bottomClothing.serverUrl
|
|
}).then((data)=>{
|
|
this.setData({
|
|
topClothing:{},
|
|
bottomClothing:{},
|
|
"userInfo.tryon_remain_count":data.tryon_remain_count
|
|
})
|
|
this.getHistory();
|
|
}).finally(()=>{
|
|
this.setData({
|
|
trying:false
|
|
})
|
|
})
|
|
},
|
|
|
|
checkResult(id){
|
|
this.setData({
|
|
hasTryon:true
|
|
})
|
|
setTimeout(()=>{
|
|
userAPI.checkTryon(id).then((data)=>{
|
|
if(data.completion_url||data.status==userAPI.tryOnStatus.error){
|
|
this.getHistory();
|
|
}else{
|
|
this.checkResult(id);
|
|
}
|
|
})
|
|
},1000);
|
|
},
|
|
|
|
selectHistory(event){
|
|
const item = event.currentTarget.dataset.item;
|
|
this.setData({
|
|
currentHistory:item
|
|
})
|
|
},
|
|
|
|
addNew(){
|
|
this.setData({
|
|
topClothing:{},
|
|
bottomClothing:{},
|
|
currentHistory:{}
|
|
})
|
|
},
|
|
|
|
deleteHistory(event){
|
|
const item = event.currentTarget.dataset.item;
|
|
wx.showModal({
|
|
title:'你确定删除这个搭配吗？',
|
|
complete: (res) => {
|
|
if (res.confirm) {
|
|
userAPI.deleteTryon(item.id).then(()=>{
|
|
wx.showToast({
|
|
icon:'none',
|
|
title: '删除成功',
|
|
})
|
|
this.getHistory();
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
viewPersonImage(){
|
|
this.setData({
|
|
isViewPersonImage:true
|
|
})
|
|
},
|
|
viewCompleteImage(){
|
|
this.setData({
|
|
isViewPersonImage:false
|
|
})
|
|
},
|
|
showComment(){
|
|
// const commentViewHeight = 40+35+38+
|
|
if(this.data.tryonCommentLoading)return;
|
|
this.setData({
|
|
tryonCommentLoading:true
|
|
})
|
|
userAPI.getTryonComment(this.data.currentHistory.id).then((data)=>{
|
|
wx.hideTabBar({
|
|
success:()=>{
|
|
this.setData({
|
|
isShowComment:true,
|
|
tryonComment:data
|
|
})
|
|
}
|
|
});
|
|
}).finally(()=>{
|
|
this.setData({
|
|
tryonCommentLoading:false
|
|
})
|
|
})
|
|
},
|
|
commentViewLeave(){
|
|
wx.showTabBar();
|
|
this.setData({
|
|
shared_history_id:''
|
|
})
|
|
if(this.options){
|
|
this.options.shared_history_id = '';
|
|
}
|
|
wx.rewriteRoute({
|
|
url:'/pages/try/index/index',
|
|
preserveQuery:true
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面初次渲染完成
|
|
*/
|
|
onReady() {
|
|
|
|
},
|
|
|
|
getUserInfo(){
|
|
userAPI.getInfo().then((data)=>{
|
|
this.setData({
|
|
userInfo:data
|
|
})
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow() {
|
|
this.setData({
|
|
userCode:app.globalData.shared_user_code||''
|
|
})
|
|
if(!wx.getStorageSync('token')){
|
|
return;
|
|
}
|
|
this.getDefaultPersonImage();
|
|
this.getPersonImages();
|
|
if(this.options&&this.options.shared_history_id){
|
|
userAPI.tryonDetail(this.options.shared_history_id).then((data)=>{
|
|
wx.hideTabBar({
|
|
success:()=>{
|
|
this.setData({
|
|
shared_history_id:this.options.shared_history_id,
|
|
isShowComment:true,
|
|
tryonComment:data
|
|
})
|
|
}
|
|
});
|
|
})
|
|
}
|
|
},
|
|
tryonShared(){
|
|
this.setTop(this.data.tryonComment.top_clothing_url);
|
|
this.setBottom(this.data.tryonComment.bottom_clothing_url);
|
|
this.setData({
|
|
isShowComment:false
|
|
})
|
|
},
|
|
getDefaultPersonImage(){
|
|
userAPI.getDefaultPersonImage().then((data)=>{
|
|
this.setData({
|
|
defaultPersonImage:data.image_url
|
|
})
|
|
}).catch(()=>{
|
|
this.setData({
|
|
defaultPersonImage:''
|
|
})
|
|
});
|
|
},
|
|
setTop(url){
|
|
this.setData({
|
|
topClothing:{
|
|
serverUrl:url,
|
|
tempFilePath:url
|
|
},
|
|
currentHistory:{}
|
|
})
|
|
},
|
|
setBottom(url){
|
|
this.setData({
|
|
bottomClothing:{
|
|
serverUrl:url,
|
|
tempFilePath:url
|
|
},
|
|
currentHistory:{}
|
|
})
|
|
},
|
|
viewImageInView(event){
|
|
this.viewImage(event.currentTarget.dataset.item);
|
|
},
|
|
viewImage(url){
|
|
wx.previewImage({
|
|
urls: [url],
|
|
})
|
|
},
|
|
navToPersonImage(){
|
|
wx.navigateTo({
|
|
url: '/pages/my/images/index?auto_back=true',
|
|
})
|
|
},
|
|
showChooseImageAS(){
|
|
wx.showActionSheet({
|
|
itemList: ['更换形象照'],
|
|
success:(res)=>{
|
|
if(res.tapIndex==0){
|
|
this.navToPersonImage()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
/**
|
|
* 生命周期函数--监听页面隐藏
|
|
*/
|
|
onHide() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面卸载
|
|
*/
|
|
onUnload() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面相关事件处理函数--监听用户下拉动作
|
|
*/
|
|
onPullDownRefresh() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面上拉触底事件的处理函数
|
|
*/
|
|
onReachBottom() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 用户点击右上角分享
|
|
*/
|
|
onShareAppMessage() {
|
|
if(this.data.currentHistory.id){
|
|
return {
|
|
title:'我的美搭，分享给你',
|
|
imageUrl:this.data.currentHistory.completion_url,
|
|
path:`/pages/try/index/index?shared_history_id=${this.data.currentHistory.id}`
|
|
}
|
|
}
|
|
}
|
|
}) |