JING
8 months ago
parent
2110a7edcc
commit
0df518c15c
@ -0,0 +1,203 @@ |
|||||||
|
<template> |
||||||
|
<view class="container"> |
||||||
|
<view class="imgList"> |
||||||
|
<!--如果是多个就用imgBox--> |
||||||
|
<!-- <view class="imgBox"> |
||||||
|
<image src="/static/img/index/pic.png" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="imgBox"> |
||||||
|
<image src="/static/img/index/pic.png" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
<view class="imgBox"> |
||||||
|
<image src="/static/img/index/pic.png" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
<view class="imgBox"> |
||||||
|
<image src="/static/img/index/pic.png" mode="aspectFill"></image> |
||||||
|
</view> --> |
||||||
|
<!--如果是一个就用picBox--> |
||||||
|
<!-- <view class="picBox"> |
||||||
|
<image src="/static/img/index/pic.png" mode="aspectFill"></image> |
||||||
|
</view> --> |
||||||
|
<view class="picBox"> |
||||||
|
<image :src="xurl" mode="aspectFill"></image> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
<view class="btnList"> |
||||||
|
<view class="btnBox a1"> |
||||||
|
<view class="btnImg"> |
||||||
|
<image src="/static/img/user/delete.png" mode="widthFix"></image> |
||||||
|
</view> |
||||||
|
<view class="btnTxt" @click="deletePic">删除照片</view> |
||||||
|
</view> |
||||||
|
<view class="btnBox a2"> |
||||||
|
<view class="btnImg"> |
||||||
|
<image src="/static/img/user/download.png" mode="widthFix"></image> |
||||||
|
</view> |
||||||
|
<view class="btnTxt" @click="savePic">保存到相册</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
old_url:'', |
||||||
|
xurl:'', |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(option) { |
||||||
|
//数据 |
||||||
|
var _this =this; |
||||||
|
var url = option.url; |
||||||
|
if(_this.$com.isNull(url)) |
||||||
|
{ |
||||||
|
uni.navigateBack({ |
||||||
|
delta:1, |
||||||
|
}) |
||||||
|
} |
||||||
|
_this.old_url = url; |
||||||
|
_this.xurl = decodeURIComponent(url); |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
var _this = this; |
||||||
|
_this.checkAuth(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//判断 |
||||||
|
checkAuth() { |
||||||
|
var _this = this; |
||||||
|
console.log('已授权---'); |
||||||
|
uni.authorize({ |
||||||
|
scope: 'scope.writePhotosAlbum', |
||||||
|
success(res) { |
||||||
|
console.log('已授权', res); |
||||||
|
|
||||||
|
}, |
||||||
|
fail(err) { |
||||||
|
|
||||||
|
uni.showModal({ |
||||||
|
title: '授权失败', |
||||||
|
content: '请在设置界面打开存储相关权限', |
||||||
|
success: (res) => { |
||||||
|
if (res.confirm) { |
||||||
|
uni.openSetting() |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
}) |
||||||
|
}, |
||||||
|
deletePic() |
||||||
|
{ |
||||||
|
var _this = this; |
||||||
|
_this.$com.showError('暂不支持删除'); |
||||||
|
}, |
||||||
|
//保存道相册 |
||||||
|
savePic(){ |
||||||
|
var _this =this; |
||||||
|
var url = _this.xurl; |
||||||
|
uni.getSetting({ |
||||||
|
success(res) { |
||||||
|
console.log(res.authSetting); |
||||||
|
if(!res.authSetting['scope.writePhotosAlbum']) |
||||||
|
{ |
||||||
|
uni.openSetting(); |
||||||
|
} |
||||||
|
else |
||||||
|
{ |
||||||
|
// 下载图片 |
||||||
|
uni.downloadFile({ |
||||||
|
url: url, |
||||||
|
success: downloadResult => { |
||||||
|
if (downloadResult.statusCode === 200) { |
||||||
|
// 下载成功，保存图片到相册 |
||||||
|
uni.saveImageToPhotosAlbum({ |
||||||
|
filePath: downloadResult.tempFilePath, |
||||||
|
success: () => { |
||||||
|
uni.showToast({ |
||||||
|
title: '保存成功' |
||||||
|
}); |
||||||
|
}, |
||||||
|
fail: () => { |
||||||
|
uni.showToast({ |
||||||
|
title: '保存失败', |
||||||
|
icon: 'none' |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
fail: () => { |
||||||
|
uni.showToast({ |
||||||
|
title: '下载失败', |
||||||
|
icon: 'none' |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
.container{padding: 20rpx 26rpx;} |
||||||
|
.imgList{width: 100%; height: auto; |
||||||
|
display: flex; flex-wrap: wrap; |
||||||
|
justify-content: space-around; /* 使子元素在容器中均匀分布 */ |
||||||
|
align-items: center; /* 如果需要垂直居中子元素 */ |
||||||
|
} |
||||||
|
.imgBox{width: 340rpx; height: 440rpx; margin-bottom: 20rpx; } |
||||||
|
.imgBox image{width: 340rpx; height: 440rpx; border-radius: 24rpx;} |
||||||
|
|
||||||
|
|
||||||
|
.picBox{width: 660rpx; height: 770rpx; margin-top: 20rpx;margin-bottom: 20rpx; } |
||||||
|
.picBox image{width: 660rpx; height: 770rpx; border-radius: 24rpx;} |
||||||
|
|
||||||
|
.btnList{ |
||||||
|
width: 100%; height: 88rpx; |
||||||
|
display: flex; flex-wrap: wrap; |
||||||
|
justify-content: space-around; /* 使子元素在容器中均匀分布 */ |
||||||
|
align-items: center; /* 如果需要垂直居中子元素 */ |
||||||
|
} |
||||||
|
.btnBox{ |
||||||
|
width: 340rpx; height: 88rpx; |
||||||
|
border-radius: 44rpx; |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
.btnBox .btnImg{ |
||||||
|
width:126rpx ; |
||||||
|
height: 88rpx; |
||||||
|
} |
||||||
|
.btnBox .btnImg image{ |
||||||
|
width:30rpx ; |
||||||
|
height: 30rpx; |
||||||
|
margin-top: 29rpx; |
||||||
|
margin-left: 80rpx; |
||||||
|
} |
||||||
|
.btnBox .btnTxt{ |
||||||
|
width:214rpx ; |
||||||
|
height: 88rpx; |
||||||
|
font-weight: 700; |
||||||
|
font-size: 30rpx; |
||||||
|
line-height: 88rpx; |
||||||
|
} |
||||||
|
.a1{ |
||||||
|
background: linear-gradient( 270deg, rgba(46,87,241,0.15) 0%, rgba(131,88,246,0.15) 100%); |
||||||
|
color:#7A74F0; |
||||||
|
} |
||||||
|
.a2{ |
||||||
|
background: linear-gradient( 270deg, #2E57F1 0%, #8358F6 100%); |
||||||
|
color:#FFFFFF; |
||||||
|
} |
||||||
|
</style> |
||||||
|
|
||||||
Loading…
Reference in new issue