|
|
@ -0,0 +1,96 @@ |
|
|
|
<template> |
|
|
|
<view class="page"> |
|
|
|
<navbar title="分享好友" leftClick @leftClick="$utils.navigateBack" /> |
|
|
|
|
|
|
|
<view class="flex content"> |
|
|
|
<image class="bg" :src="imgurl"></image> |
|
|
|
<view class="flex btns"> |
|
|
|
<button class="btn btn-back" @click="$utils.navigateBack">返回</button> |
|
|
|
<button plain class="btn btn-save" @click="saveImg" >保存到相册</button> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
imgurl: null, |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad() { |
|
|
|
// todo: fetch imgurl |
|
|
|
this.imgurl = '../../static/image/center/temp-share.png' |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
saveImg(){ |
|
|
|
this.$authorize('scope.writePhotosAlbum').then((res) => { |
|
|
|
this.imgApi(this.imgurl) |
|
|
|
}) |
|
|
|
}, |
|
|
|
imgApi(image) { |
|
|
|
/* 获取图片的信息 */ |
|
|
|
uni.getImageInfo({ |
|
|
|
src: image, |
|
|
|
success: function(image) { |
|
|
|
/* 保存图片到手机相册 */ |
|
|
|
uni.saveImageToPhotosAlbum({ |
|
|
|
filePath: image.path, |
|
|
|
success: function() { |
|
|
|
uni.showModal({ |
|
|
|
title: '保存成功', |
|
|
|
content: '图片已成功保存到相册', |
|
|
|
showCancel: false |
|
|
|
}); |
|
|
|
}, |
|
|
|
complete(res) { |
|
|
|
console.log(res); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
.page { |
|
|
|
background-color: #111317; |
|
|
|
height: 100vh; |
|
|
|
} |
|
|
|
|
|
|
|
.content { |
|
|
|
margin-top: 79rpx; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
.bg { |
|
|
|
width: 598rpx; |
|
|
|
height: 1063rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.btns { |
|
|
|
justify-content: space-between; |
|
|
|
margin-top: 53rpx; |
|
|
|
width: 598rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.btn { |
|
|
|
width: 280rpx; |
|
|
|
height: 90rpx; |
|
|
|
font-size: 36rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
border-radius: 45rpx; |
|
|
|
margin: 0; |
|
|
|
|
|
|
|
&-back { |
|
|
|
background-color: #4E5053; |
|
|
|
} |
|
|
|
|
|
|
|
&-save { |
|
|
|
background-image: linear-gradient(to right, #02DED6, #05D9A2); |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |