|
@@ -1,345 +1,84 @@
|
|
|
<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">
|
|
|
- <!-- #ifdef H5 -->
|
|
|
- <swiper-item v-for="(item, index) in rwmListArr" :key="index">
|
|
|
- <image :src="item.wap_poster" mode="aspectFit" class="imgw750h375" />
|
|
|
- </swiper-item>
|
|
|
- <!-- #endif -->
|
|
|
- <!-- #ifdef MP-WEIXIN -->
|
|
|
- <swiper-item v-for="(item, index) in rwmListArr" :key="index">
|
|
|
- <image :src="item.poster" mode="aspectFit" class="imgw750h375" />
|
|
|
- </swiper-item>
|
|
|
- <!-- #endif -->
|
|
|
-
|
|
|
- </swiper>
|
|
|
+ <view class="content">
|
|
|
+ <image src="../../static/img/sharebase.png" mode="widthFix" class="baseimg"></image>
|
|
|
+ <view class="erweima">
|
|
|
+ <tki-qrcode
|
|
|
+ :cid="cid"
|
|
|
+ ref="qrcode"
|
|
|
+ :val="val"
|
|
|
+ :size="size"
|
|
|
+ :unit="unit"
|
|
|
+ :background="background"
|
|
|
+ :foreground="foreground"
|
|
|
+ :pdground="pdground"
|
|
|
+ :iconSize="iconSize"
|
|
|
+ :lv="lv"
|
|
|
+ :onval="onval"
|
|
|
+ :loadMake="loadMake"
|
|
|
+ :usingComponents="usingComponents"
|
|
|
+ @result="qrR"
|
|
|
+ />
|
|
|
</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>
|
|
|
</template>
|
|
|
<script>
|
|
|
import {
|
|
|
- mapState
|
|
|
+ mapState,
|
|
|
+ mapMutations
|
|
|
} from 'vuex';
|
|
|
- import {
|
|
|
- spreadBanner
|
|
|
- } from '@/api/user.js';
|
|
|
- import {
|
|
|
- interceptor,
|
|
|
- saveUrl
|
|
|
- } from '@/utils/loginUtils';
|
|
|
- // #ifdef H5
|
|
|
- import {
|
|
|
- weixindata
|
|
|
- } from '@/utils/wxAuthorized';
|
|
|
- // #endif
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- rwmListArr: [],
|
|
|
- current: 0,
|
|
|
- imgSrc: ''
|
|
|
+ val: '',
|
|
|
+ cid: 'cid',
|
|
|
+ size: 150,
|
|
|
+ unit: '150',
|
|
|
+ background: '#FFFFFF',
|
|
|
+ foreground: '#000000',
|
|
|
+ pdground: '#000000',
|
|
|
+ icon: '',
|
|
|
+ iconSize: 40,
|
|
|
+ lv: 3,
|
|
|
+ onval: true,
|
|
|
+ loadMake: true,
|
|
|
+ usingComponents: true,
|
|
|
};
|
|
|
},
|
|
|
- onLoad(option) {
|
|
|
- uni.showLoading({
|
|
|
- title: '邀请图生成中',
|
|
|
- mask: true
|
|
|
- });
|
|
|
- // 判断是否强制登录
|
|
|
- this.loadCodeList();
|
|
|
- // #ifdef MP-WEIXIN
|
|
|
- uni.authorize({
|
|
|
- scope: 'scope.writePhotosAlbum',
|
|
|
- complete() {}
|
|
|
- });
|
|
|
- // #endif
|
|
|
+ onLoad() {
|
|
|
+
|
|
|
},
|
|
|
onShow() {
|
|
|
- if (this.loginInterceptor && !this.hasLogin) {
|
|
|
- saveUrl();
|
|
|
- // 登录拦截
|
|
|
- interceptor();
|
|
|
- }
|
|
|
+ this.val = 'http://hgd.liuniu946.com/appdom/index.html?spread=' + this.userInfo.uid
|
|
|
},
|
|
|
//下拉刷新
|
|
|
onPullDownRefresh() {
|
|
|
- let obj = this;
|
|
|
- //监听下拉刷新动作的执行方法,每次手动下拉刷新都会执行一次
|
|
|
- setTimeout(function() {
|
|
|
- obj.loadCodeList();
|
|
|
- uni.stopPullDownRefresh(); //停止下拉刷新动画
|
|
|
- }, 1000);
|
|
|
+
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapState(['weichatObj', 'baseURL', 'urlFile']),
|
|
|
+ ...mapState(['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();
|
|
|
+ qrR(res) {
|
|
|
+ this.src = res;
|
|
|
},
|
|
|
- uniCopy(content) {
|
|
|
- /**
|
|
|
- * 小程序端 和 app端的复制逻辑
|
|
|
- */
|
|
|
- //#ifndef H5
|
|
|
- uni.setClipboardData({
|
|
|
- data: content,
|
|
|
- success: function() {
|
|
|
- console.log('success');
|
|
|
- return true;
|
|
|
- }
|
|
|
- });
|
|
|
- //#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')||'';
|
|
|
- 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();
|
|
|
- });
|
|
|
- },
|
|
|
- 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">
|
|
|
- page {
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .imgw750h375 {
|
|
|
- width: 100%;
|
|
|
- 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 */
|
|
|
+.baseimg {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.erweima {
|
|
|
+ width: 300rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 923rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
</style>
|