<template> <view class="andr-shQ-padL30 andr-shQ-padR30 andr-shQ-Flex andr-shQ-FlexDirC"> <view class="andr-shQ-w100B andr-shQ-Flex andr-shQ-JusCC"> <swiper class="imgw750h375 matop" :indicator-dots="false" :current="current" @change="currentChange" > <swiper-item v-for="(item, index) in rwmListArr" :key="index"><image :src="item.poster" mode="aspectFit" class="imgw750h375" /></swiper-item> </swiper> </view> <!-- #ifdef H5 --> <view class="baocun">长按二维码保存图片</view> <!-- #endif --> <!-- #ifdef MP-WEIXIN --> <view class="baocun" @click="seav">保存图片并转发</view> <!-- <button open-type="share" class="baocun btn" v-if="scLoading == 2">分享到微信</button> --> <!-- #endif --> </view> </template> <script> import { mapState } from 'vuex'; import { spreadBanner } from '@/api/shareQrCode.js'; import { interceptor, saveUrl } from '@/utils/loginUtils'; // #ifdef H5 import { weixindata } from '@/utils/wxAuthorized'; // #endif export default { data() { return { rwmListArr: [], current: 0, imgSrc: '' }; }, onLoad(option) { uni.showLoading({ title: '邀请图生成中', mask: true }); // 判断是否强制登录 this.loadCodeList(); // #ifdef MP-WEIXIN uni.authorize({ scope: 'scope.writePhotosAlbum', complete() {} }); // #endif }, onShow() { if (this.loginInterceptor && !this.hasLogin) { saveUrl(); // 登录拦截 interceptor(); } }, //下拉刷新 onPullDownRefresh() { let obj = this; //监听下拉刷新动作的执行方法,每次手动下拉刷新都会执行一次 setTimeout(function() { obj.loadCodeList(); uni.stopPullDownRefresh(); //停止下拉刷新动画 }, 1000); }, computed: { ...mapState(['weichatObj', 'baseURL', 'urlFile']), }, methods: { loadCodeList() { let self = this; // 加载二维码信息 // let andrUid = uni.getStorageSync('andrUid')||''; spreadBanner({ // #ifdef H5 type: 2, // #endif // #ifdef MP type: 1, // #endif }).then(e => { if (e.status == 200) { self.rwmListArr = e.data; // #ifdef H5 self.imgSrc = self.rwmListArr[0].wap_poster; // #endif // #ifdef MP-WEIXIN self.imgSrc = self.rwmListArr[0].poster; // #endif } uni.hideLoading(); }); }, currentChange(e) { this.current = e.detail.current; }, // onShareAppMessage(options){ // console.log(options,'options') // let userInfo = uni.getStorageSync('userInfo'); // console.log(userInfo) // let obj = this; // // 设置菜单中的转发按钮触发转发事件时的转发内容 // let shareObj = { // title: "邀请好友领券", // 默认是小程序的名称(可以写slogan等) // path: '/pages/index/index?spread='+userInfo.uid, // 默认是当前页面,必须是以‘/’开头的完整路径 // imageUrl: obj.imgSrc, // success: function(res){ // // 转发成功之后的回调 // if(res.errMsg == 'shareAppMessage:ok'){ // } // }, // fail: function(){ // // 转发失败之后的回调 // if(res.errMsg == 'shareAppMessage:fail cancel'){ // // 用户取消转发 // }else if(res.errMsg == 'shareAppMessage:fail'){ // // 转发失败,其中 detail message 为详细失败信息 // } // } // }; // // 来自页面内的按钮的转发 // if( options.from == 'button' ){ // // 此处可以修改 shareObj 中的内容 // shareObj.path = '/pages/index/index?spread='+userInfo.uid; // console.log(shareObj.path,'shareObj.path') // } // // 返回shareObj // return shareObj; // }, // scClick() { // let self = this; // // #ifdef H5 // self.imgSrc = self.rwmListArr[self.current].wap_poster; // // #endif // // #ifdef MP-WEIXIN // self.imgSrc = self.rwmListArr[self.current].poster; // // #endif // }, // #ifdef MP-WEIXIN seav() { uni.getImageInfo({ src: this.imgSrc, complete: function (result) { let path = result.path; uni.getSetting({ success(res) { console.log(res) if (!res.authSetting['scope.writePhotosAlbum']) { uni.authorize({ scope:'scope.writePhotosAlbum', success(res) { uni.saveImageToPhotosAlbum({ filePath:path, complete(result) { } }); }, complete(result) { uni.showToast({ title: '请先授权保存图片', duration: 2000, icon:'none' }); obj.seav(); } }) }else{ uni.saveImageToPhotosAlbum({ filePath:path, complete(result) { uni.showToast({ title: '保存图片成功!', duration: 2000, icon:'none' }); } }); } } }); } }); } // #endif } }; </script> <style lang="scss"> .imgw750h375 { width: 700rpx; height: 958rpx; } .matop{ margin-top: 40rpx; } .andr-shQ-padL30 { padding-left: 30rpx; } .andr-shQ-padR30 { padding-right: 30rpx; } .andr-shQ-Flex { display: flex; } .andr-shQ-FlexDirC { flex-direction: column; } .andr-shQ-w100B { width: 100%; } .andr-shQ-JusCC { justify-content: center; } .andr-shQ-marginT30 { margin-top: 30rpx; } .andr-shQ-bgc06B163 { background-color: $base-color; } .andr-shQ-cFFF { color: #ffffff; } .andr-shQ-bdR50 { border-radius: 50rpx; } .andr-shQ-h86 { height: 86rpx; } .andr-shQ-AIC { align-items: center; } .baocun { color: #ffffff; background: $base-color; text-align: center; width: 80%; margin: 50rpx auto; font-size: 28rpx; padding: 25rpx 0rpx; border-radius: 50rpx; } .btn{ padding: 0rpx 0rpx !important; margin: 0rpx auto; margin-bottom: 100rpx; } /* #ifdef H5 */ .cbnagan { width: 80%; background: $base-color; margin: 50rpx auto; font-size: 28rpx; text-align: center; } /* #endif */ </style>