//参数
data(){
return {
localIds:[],//新的localIds和旧的图片
newlocalIds:[],//新上传的localIds
serverId:[],//新上传的serverId 最终要的 旧的localIds和新的serverId
mark:false,
}
},
/************************************** 回显图片 start******************************************/
mounted(){
this.$http.jsonp('https://www.yunshuxie.com//v1/web/game/get_my_game_opus.json').then(function(res){
if(res.body.returnCode==0){
if(res.body.data){
this.localIds=res.body.data.slice();//slice防止地址引用
this.serverId=res.body.data.slice();
}else{
this.localIds=[];
}
}else{
console.log(res)
this.$vux.alert.show({
title: '验证码错误',
content: '验证码错误',
})
}
},function(res){
this.$vux.alert.show({
title: '接口错误',
content: '接口错误!',
})
})
},
/************************************** 回显图片 end******************************************/
methods:{
/************************************** 添加图片 start******************************************/
_uploadpict(){
if(this.isWeixin){
var _self=this;
wx.ready( function () {
try{
wx.chooseImage({
count: 5-_self.localIds.length, // 默认9
sizeType: ['original','compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
_self.localIds=_self.localIds.concat(res.localIds);
_self.newlocalIds=_self.newlocalIds.concat(res.localIds);
// _self.newlocalIds=_self.newlocalIds.concat(res.localIds);
// alert(_self.localIds.length)
// 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
// syncUpload(localIds);
console.log('new_ser:'+_self.newlocalIds);
}
});
} catch(error) {
}
})
}else{
}
},
/************************************** 添加图片 end******************************************/
/************************************** 删除图片 start******************************************/
_clonecover(e,index){
console.log('ok')
e.stopPropagation();
if(this.localIds.length>1){
var val=this.localIds[index];
var ind=this.newlocalIds.indexOf(val);
var ind2=this.serverId.indexOf(val);
if(ind!=-1){//newlocalIds删除
this.newlocalIds.splice(ind,1);
}
if(ind2!=-1){//serverId删除
this.serverId.splice(ind2,1);
}
this.localIds.splice(index,1);
}else{
this.$vux.alert.show({
title: '至少要保留一张图片啊!',
})
}
},
/************************************** 删除图片 end******************************************/
/************************************** 预览图片 start******************************************/
_enlarge(val){
var _self=this;
wx.ready( function () {
wx.previewImage({
current: val, // 当前显示图片的http链接
urls: _self.localIds // 需要预览的图片http链接列表
});
})
},
/************************************** 预览图片 end******************************************/
/************************************** 上传图片 start******************************************/
syncUpload(localIds){//上传图片
var _self=this;
var newlocalIdslength=this.newlocalIds.length;
// var length=localIds.length;
var localId = localIds.pop();
var num=localIds.length;
this.$vux.loading.show({
text: `上传第${newlocalIdslength-num}张!`,
})
if(typeof(localId) != "undefined"){
wx.uploadImage({
localId: localId,
isShowProgressTips: 0,
success: function (res) {
console.log('结果:length'+localIds.length+'localId'+localId)
//其他对serverId做处理的代码
_self.$vux.loading.hide();
_self.serverId.push(res.serverId);
console.log("res.serverId:" + res.serverId);
console.log("_self.serverId:" + _self.serverId);
_self.syncUpload(localIds);
}
});
}else{
_self.$vux.loading.show({
text: `全部上传成功`,
})
_self.$http.jsonp('https://www.yunshuxie.com//v1/web/game/submit_game_opus.json',{
params: {
mediaId:_self.serverId.join(',')
}
}).then(function(res){
if(res.body.returnCode==0){
console.log(res);
_self.mark=true;
_self.serverId=[];
}else{
_self.$vux.alert.show({
title: '接口错误',
content: '接口错误',
})
}
},function(res){
_self.$vux.alert.show({
title: '接口错误',
content: '接口错误!',
})
})
setTimeout(()=>{
_self.$vux.loading.hide();
},1000);
}
},
_noopenup(){
var _self=this;
var localIds=_self.newlocalIds.slice();
if(localIds.length!=0){
this.syncUpload(localIds);
}else{
_self.$http.jsonp('https://www.yunshuxie.com//v1/web/game/submit_game_opus.json',{
params: {
mediaId:_self.serverId.join(',')
}
}).then(function(res){
if(res.body.returnCode==0){
_self.$vux.alert.show({
title: '保存成功!',
content: '保存成功!',
})
_self.serverId=[];
}else{
_self.$vux.alert.show({
title: '接口错误',
content: '接口错误',
})
}
},function(res){
_self.$vux.alert.show({
title: '接口错误',
content: '接口错误!',
})
})
}
}
/************************************** 上传图片 end******************************************/
}
网友评论