|
@@ -2,27 +2,29 @@
|
|
|
<view>
|
|
|
<view id="box">
|
|
|
<view class='distribution-posters'>
|
|
|
- <swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
|
|
|
- @change="bindchange" previous-margin="40px" next-margin="40px">
|
|
|
+ <swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval"
|
|
|
+ :duration="duration" @change="bindchange" previous-margin="40px" next-margin="40px">
|
|
|
<block v-for="(item,index) in spreadList" :key="index">
|
|
|
<swiper-item>
|
|
|
<view class="fx-h fx-bc fx-ac" style="height: 100%;">
|
|
|
- <image v-if="item.qrcode_img != ''" :src="item.qrcode_img" class="slide-image" :class="swiperIndex == index ? 'active' : 'quiet'" mode="widthFix" />
|
|
|
- <image v-else :src="item.poster_img" class="slide-image" :class="swiperIndex == index ? 'active' : 'quiet'" mode="widthFix" />
|
|
|
+ <image v-if="item.qrcode_img != ''" :src="item.qrcode_img" class="slide-image"
|
|
|
+ :class="swiperIndex == index ? 'active' : 'quiet'" mode="widthFix" />
|
|
|
+ <image v-else :src="item.poster_img" class="slide-image"
|
|
|
+ :class="swiperIndex == index ? 'active' : 'quiet'" mode="widthFix" />
|
|
|
</view>
|
|
|
</swiper-item>
|
|
|
</block>
|
|
|
</swiper>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<view class="foot-view fx-r">
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
<view class="save fx-h fx-bc fx-ac" @tap="tapScheng">
|
|
|
<image src="/static/img/foot-save.png" mode="widthFix"></image>
|
|
|
<view class="text">重新生成</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<view class="save fx-h fx-bc fx-ac" @tap="savePosterPath">
|
|
|
<image src="/static/img/foot-down.png" mode="widthFix"></image>
|
|
|
<view class="text">保存海报</view>
|
|
@@ -40,7 +42,7 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+
|
|
|
indicatorDots: false,
|
|
|
circular: false,
|
|
|
autoplay: false,
|
|
@@ -50,7 +52,7 @@
|
|
|
spreadList: [],
|
|
|
userInfo: {},
|
|
|
poster: '',
|
|
|
- navIndex : 0
|
|
|
+ navIndex: 0
|
|
|
};
|
|
|
},
|
|
|
computed: mapState(['user']),
|
|
@@ -70,15 +72,18 @@
|
|
|
this.navIndex = e.detail.current;
|
|
|
this.changeImg(e.detail.current);
|
|
|
},
|
|
|
-
|
|
|
- tapScheng:function(){
|
|
|
+
|
|
|
+ tapScheng: function() {
|
|
|
let spreadList = this.spreadList;
|
|
|
- uni.showLoading({title: '获取推广码中..',mask: true});
|
|
|
+ uni.showLoading({
|
|
|
+ title: '获取推广码中..',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
this
|
|
|
.request
|
|
|
- .post("userSpreadQrcode",{
|
|
|
- id:spreadList[this.navIndex].id,
|
|
|
- type : 1
|
|
|
+ .post("userSpreadQrcode", {
|
|
|
+ id: spreadList[this.navIndex].id,
|
|
|
+ type: 1
|
|
|
})
|
|
|
.then(res => {
|
|
|
uni.hideLoading();
|
|
@@ -93,18 +98,23 @@
|
|
|
uni.hideLoading();
|
|
|
this.utils.Tip("加载失败,返回在尝试!");
|
|
|
});
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
-
|
|
|
- changeImg:function(index){
|
|
|
+
|
|
|
+ changeImg: function(index) {
|
|
|
let spreadList = this.spreadList;
|
|
|
this.swiperIndex = index;
|
|
|
this.$set(this, 'poster', spreadList[index].poster);
|
|
|
- if(!this.utils.isDefine(spreadList[index].qrcode_img)) {
|
|
|
- uni.showLoading({title: '获取推广码中..',mask: true});
|
|
|
+ if (!this.utils.isDefine(spreadList[index].qrcode_img)) {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '获取推广码中..',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
this
|
|
|
.request
|
|
|
- .post("userSpreadQrcode",{id:spreadList[index].id})
|
|
|
+ .post("userSpreadQrcode", {
|
|
|
+ id: spreadList[index].id
|
|
|
+ })
|
|
|
.then(res => {
|
|
|
uni.hideLoading();
|
|
|
if (res.code == 200) {
|
|
@@ -120,13 +130,29 @@
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
savePosterPath: function() {
|
|
|
- var img =this.spreadList[this.swiperIndex].qrcode_img;
|
|
|
- if(img == ''){
|
|
|
+ var img = this.spreadList[this.swiperIndex].qrcode_img;
|
|
|
+ if (img == '') {
|
|
|
return this.utils.Tip("海报在生成中!");
|
|
|
}
|
|
|
let that = this;
|
|
|
+ // #ifdef APP
|
|
|
+ let p = uni.getSystemInfoSync().platform;
|
|
|
+ if (p === "ios") {
|
|
|
+ that.domImage(img);
|
|
|
+ } else {
|
|
|
+ that.$store.dispatch('permission/requestPermissions', 'WRITE_EXTERNAL_STORAGE').then(res => {
|
|
|
+ that.domImage(img);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // #endif
|
|
|
+ // #ifndef APP
|
|
|
+ that.domImage(img);
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ domImage(img) {
|
|
|
+ const that = this;
|
|
|
uni.downloadFile({
|
|
|
url: img,
|
|
|
success(resFile) {
|
|
@@ -187,24 +213,32 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
- .about{width: 100%;height: 100%;background: #303033;;}
|
|
|
-
|
|
|
- .distribution-posters{
|
|
|
+ .about {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #303033;
|
|
|
+ ;
|
|
|
+ }
|
|
|
+
|
|
|
+ .distribution-posters {
|
|
|
padding-top: 40rpx;
|
|
|
}
|
|
|
+
|
|
|
.distribution-posters swiper {
|
|
|
width: 100%;
|
|
|
height: calc(100vh - 120rpx - 40rpx);
|
|
|
position: relative;
|
|
|
}
|
|
|
+
|
|
|
/* #ifdef H5 */
|
|
|
- .distribution-posters swiper {
|
|
|
- height: calc(100vh - 120rpx - 40rpx - 50px);
|
|
|
- }
|
|
|
+ .distribution-posters swiper {
|
|
|
+ height: calc(100vh - 120rpx - 40rpx - 50px);
|
|
|
+ }
|
|
|
+
|
|
|
/* #endif */
|
|
|
|
|
|
.distribution-posters .slide-image {
|
|
|
- width: calc(54 - 86rpx);
|
|
|
+ width: calc(54 - 86rpx);
|
|
|
height: calc(100vh - 160rpx);
|
|
|
margin: 0 auto;
|
|
|
border-radius: 15rpx;
|
|
@@ -249,7 +283,7 @@
|
|
|
|
|
|
|
|
|
.bg-color {
|
|
|
- background:#844bff;
|
|
|
+ background: #844bff;
|
|
|
}
|
|
|
|
|
|
|
|
@@ -281,9 +315,24 @@
|
|
|
justify-content: space-around;
|
|
|
-webkit-justify-content: space-around
|
|
|
}
|
|
|
-
|
|
|
- .foot-view{height: 120rpx;}
|
|
|
- .foot-view .save{width: 50%;}
|
|
|
- .foot-view .save image{width: 60rpx;height: 60rpx;}
|
|
|
- .foot-view .save .text{color: #999999;text-align: center;font-size: 14px;margin-top: 6px;}
|
|
|
-</style>
|
|
|
+
|
|
|
+ .foot-view {
|
|
|
+ height: 120rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .foot-view .save {
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .foot-view .save image {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .foot-view .save .text {
|
|
|
+ color: #999999;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 6px;
|
|
|
+ }
|
|
|
+</style>
|