|
|
@@ -1,307 +1,123 @@
|
|
|
<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.wap_poster" mode="aspectFit" class="imgw750h375" /></swiper-item>
|
|
|
- </swiper>
|
|
|
- </view>
|
|
|
- <view class="baocun" @click="comfirm(userInfo.uid+'')">复制邀请码</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 class="container">
|
|
|
+ <image @longtap="bc_code" class="backImg" :src="backImg"></image>
|
|
|
+ <view class="tki-qrcode"><canvas @longtap="bc_code" canvas-id="qrcode" /></view>
|
|
|
</view>
|
|
|
</template>
|
|
|
+
|
|
|
<script>
|
|
|
-import { mapState } from 'vuex';
|
|
|
import { spreadBanner } from '@/api/user.js';
|
|
|
-import { interceptor, saveUrl } from '@/utils/loginUtils';
|
|
|
-// #ifdef H5
|
|
|
-import { weixindata } from '@/utils/wxAuthorized';
|
|
|
-// #endif
|
|
|
export default {
|
|
|
+ // components: { tkiQrcode },
|
|
|
data() {
|
|
|
return {
|
|
|
- rwmListArr: [],
|
|
|
- current: 0,
|
|
|
- imgSrc: ''
|
|
|
+ url: '',
|
|
|
+ backImg:'',
|
|
|
+ userInfo:''
|
|
|
};
|
|
|
},
|
|
|
- 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();
|
|
|
- }
|
|
|
+ onLoad() {
|
|
|
+ this.spread();
|
|
|
},
|
|
|
- //下拉刷新
|
|
|
- onPullDownRefresh() {
|
|
|
- let obj = this;
|
|
|
- //监听下拉刷新动作的执行方法,每次手动下拉刷新都会执行一次
|
|
|
- setTimeout(function() {
|
|
|
- obj.loadCodeList();
|
|
|
- uni.stopPullDownRefresh(); //停止下拉刷新动画
|
|
|
- }, 1000);
|
|
|
- },
|
|
|
computed: {
|
|
|
- ...mapState(['weichatObj', 'baseURL', 'urlFile']),
|
|
|
- ...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
|
|
|
- },
|
|
|
- methods: {
|
|
|
- comfirm(text) {
|
|
|
- // let text = this.userInfo.uid
|
|
|
- console.log(text);
|
|
|
- const result = this.uniCopy(text);
|
|
|
- if (result === false) {
|
|
|
- uni.showToast({
|
|
|
- title: '不支持'
|
|
|
- });
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: '复制成功',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- }
|
|
|
- // this.$refs.popup.close();
|
|
|
- },
|
|
|
- uniCopy(content) {
|
|
|
- /**
|
|
|
- * 小程序端 和 app端的复制逻辑
|
|
|
- */
|
|
|
- //#ifndef H5
|
|
|
- uni.setClipboardData({
|
|
|
- data: content,
|
|
|
- success: function() {
|
|
|
- console.log('success');
|
|
|
- return true;
|
|
|
+ cpSize() {
|
|
|
+ if(this.unit == "upx"){
|
|
|
+ return uni.upx2px(this.size)
|
|
|
+ }else{
|
|
|
+ return this.size
|
|
|
}
|
|
|
- });
|
|
|
- //#endif
|
|
|
-
|
|
|
- /**
|
|
|
- * H5端的复制逻辑
|
|
|
- */
|
|
|
- // #ifdef H5
|
|
|
- if (!document.queryCommandSupported('copy')) {
|
|
|
- //为了兼容有些浏览器 queryCommandSupported 的判断
|
|
|
- // 不支持
|
|
|
- return false;
|
|
|
}
|
|
|
- let textarea = document.createElement('textarea');
|
|
|
- textarea.value = content;
|
|
|
- textarea.readOnly = 'readOnly';
|
|
|
- document.body.appendChild(textarea);
|
|
|
- textarea.select(); // 选择对象
|
|
|
- textarea.setSelectionRange(0, content.length); //核心
|
|
|
- let result = document.execCommand('copy'); // 执行浏览器复制命令
|
|
|
- textarea.remove();
|
|
|
- return result;
|
|
|
- // #endif
|
|
|
- },
|
|
|
- loadCodeList() {
|
|
|
- let self = this;
|
|
|
- // 加载二维码信息
|
|
|
- // let andrUid = uni.getStorageSync('andrUid')||'';
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ spread(){
|
|
|
+ let obj = this;
|
|
|
spreadBanner({
|
|
|
- // #ifdef H5
|
|
|
- type: 2,
|
|
|
- // #endif
|
|
|
- // #ifdef MP
|
|
|
- type: 1,
|
|
|
- // #endif
|
|
|
- }).then(e => {
|
|
|
- if (e.status == 200) {
|
|
|
- console.log(e.data)
|
|
|
- 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();
|
|
|
+ type:2
|
|
|
+ }).then(({ data }) => {
|
|
|
+ console.log(data)
|
|
|
+ obj.backImg = data[0].wap_poster;
|
|
|
});
|
|
|
},
|
|
|
- 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'
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
+ bc_code(){
|
|
|
+ let that = this;
|
|
|
+ console.log('保存二维码',this.backImg)
|
|
|
+ uni.downloadFile({ //获得二维码的临时地址
|
|
|
+ url:this.backImg,
|
|
|
+ success:(res)=>{
|
|
|
+ //console.log('获取url',res)
|
|
|
+ if(res.statusCode == 200){
|
|
|
+ uni.saveImageToPhotosAlbum({
|
|
|
+ filePath:res.tempFilePath,//传入临时地址
|
|
|
+ success() {
|
|
|
+ that.$api.msg('保存成功')//封装的提示
|
|
|
+ },
|
|
|
+ fail() {
|
|
|
+ that.$api.msg('保存失败')
|
|
|
}
|
|
|
- }
|
|
|
- });
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
- });
|
|
|
- }
|
|
|
- // #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 {
|
|
|
+ page{
|
|
|
+ width: 100%;
|
|
|
+ min-height: 100%;
|
|
|
+ .container{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .backImg{
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+.portrait{
|
|
|
width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 80rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ image{
|
|
|
+ width: 250rpx;
|
|
|
+ height: 250rpx;
|
|
|
+ }
|
|
|
}
|
|
|
-.andr-shQ-JusCC {
|
|
|
- justify-content: center;
|
|
|
-}
|
|
|
-.andr-shQ-marginT30 {
|
|
|
- margin-top: 30rpx;
|
|
|
-}
|
|
|
-.andr-shQ-bgc06B163 {
|
|
|
- background-color: $base-color;
|
|
|
+.text{
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size:55rpx;
|
|
|
+ letter-spacing:15rpx;
|
|
|
}
|
|
|
-.andr-shQ-cFFF {
|
|
|
- color: #ffffff;
|
|
|
+.uid-name{
|
|
|
+ padding: 50rpx 0rpx;
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ color: #FFFFFF;
|
|
|
}
|
|
|
-.andr-shQ-bdR50 {
|
|
|
+.copy-btn{
|
|
|
+ color: #FFFFFF;
|
|
|
+ background-color: #4BA6ED;
|
|
|
border-radius: 50rpx;
|
|
|
-}
|
|
|
-.andr-shQ-h86 {
|
|
|
- height: 86rpx;
|
|
|
-}
|
|
|
-.andr-shQ-AIC {
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.baocun {
|
|
|
- color: #ffffff;
|
|
|
- background: $base-color;
|
|
|
+ width: 170rpx;
|
|
|
+ line-height: 70rpx;
|
|
|
+ margin: 0rpx auto;
|
|
|
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;
|
|
|
+.tki-qrcode{
|
|
|
+ position: fixed;
|
|
|
+ bottom: 10%;
|
|
|
+ left: 30%;
|
|
|
}
|
|
|
-/* #ifdef H5 */
|
|
|
-.cbnagan {
|
|
|
- width: 80%;
|
|
|
- background: $base-color;
|
|
|
- margin: 50rpx auto;
|
|
|
- font-size: 28rpx;
|
|
|
- text-align: center;
|
|
|
+canvas{
|
|
|
+ width:150px;
|
|
|
+ height: 150px;
|
|
|
+ margin: auto;
|
|
|
+
|
|
|
}
|
|
|
-/* #endif */
|
|
|
-</style>
|
|
|
+</style>
|