Authored by 李奇

Merge branch 'feature/menuShare' into 'master'

Feature/menu share



See merge request !10
import { postFormId } from '../../libs/formIdCollectRequest';
Component({
options: {
multipleSlots: true // 在组件定义时的选项中启用多slot支持
},
/**
* 组件的属性列表
* 用于组件自定义设置
*/
properties: {
isShowIndicator: { //是否展示返回顶部按钮
type: Boolean,
value: false,
observer: "_indicatorChange"
},
isShowShopCart: { //是否展示购物车
type: Boolean,
value: true
},
marginBottom: { //底部边距
type: Number,
value: 100
},
isShowMenu: {
type: Boolean,
value: true
},
isShare: { // 是否显示分享
type: Boolean,
value: false
},
isUnionShare: {// 是否显示创建联盟分享按钮
type: Boolean,
value: false
},
isGoApp: { // 是否显示取app按钮
type: Boolean,
value: false
},
appParameter: {
type: String,
value: ''
}
},
/**
* 私有数据,组件的初始数据
* 可用于模版渲染
*/
data: {
// 弹窗显示控制
isShow: true,
isExpand: false,
menuOpacity: 0,
funcItemAnimation: {},
indicatorAnimation: {},
isAnimation: false,
},
/**
* 组件的方法列表
* 更新属性和数据的方法与更新页面数据的方法类似
*/
methods: {
//上报formid
formSubmit: function (e) {
let formId = e.detail.formId;
postFormId(formId)
},
/*
* 公有方法
*/
//隐藏
hide() {
this.setData({
isShow: !this.data.isShow
})
},
//展示
show() {
this.setData({
isShow: !this.data.isShow
})
},
switchMenu() {
if(this.data.isAnimation){
return;
}
var time = 150;
if(this.data.isExpand){
this.takeback(time);
}else {
this.popout(time);
}
this.setData({
isAnimation: true
});
var delayTime = time;
setTimeout(function () {
this.setData({
isAnimation: false
})
}.bind(this), delayTime);
this.setData({
isExpand: !this.data.isExpand,
})
},
_indicatorChange: function(newVal, oldVal) {
var animtionIndicator = wx.createAnimation({
duration: 300,
timingFunction: 'linear',
});
if(newVal){
animtionIndicator.opacity(1).height(44).width(44).step();
}else {
animtionIndicator.opacity(0).height(0).width(0).step();
}
this.setData({
indicatorAnimation: animtionIndicator.export(),
})
},
// 动画
popout(time) {
var funcItemAnimation = wx.createAnimation({
duration: time,
timingFunction: 'ease-in-out'
});
funcItemAnimation.opacity(1).width(44).height(44).step({ duration: time });
this.setData({
funcItemAnimation: funcItemAnimation.export(),
});
},
takeback(time) {
var funcItemAnimation = wx.createAnimation({
duration: time,
timingFunction: 'ease-in-out'
});
funcItemAnimation.opacity(0).width(0).height(0).step({ duration: time });
this.setData({
funcItemAnimation: funcItemAnimation.export(),
});
},
jumpToHome() {
},
jumpToSearch() {
},
jumpToShopCart() {
},
backToTop() {
this.triggerEvent("backToTop");
},
unionShare() {
this.triggerEvent("unionShare");
},
goApp: function (e) {
var pages = getCurrentPages()
var currentPage = pages[pages.length - 1]
var url = currentPage.route
let params = {
PAGE_PATH: url,
};
},
launchAppError: function (e) {
wx.showToast({
title: '打开失败!您可能未安装Yoho!Buy官方APP,请下载后再尝试。',
icon: 'none',
duration: 3000
})
}
}
})
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
<!--pages/quickNavigation/quickNavigation.wxml-->
<view class="quicknavigation" style="display: {{isShow ? 'block':'none'}};bottom:{{marginBottom}}rpx">
<view class="quicknavigation-content">
<view class="quicknavigation-menu" wx:if="{{isShowMenu}}">
<view class="quicknavigation-menu-func">
<navigator target="miniProgram" app-id="wx084ab813d88c594b" path="/pages/index/index" version="develop" >
<image class="img" id="home" animation="{{funcItemAnimation}}" src="/pages/quickNavigation/images/home@3x.png"> </image>
</navigator>
<navigator target="miniProgram" app-id="wx084ab813d88c594b" path="/pages/search/search" version="develop" >
<image class="img" id="search" animation="{{funcItemAnimation}}" src="/pages/quickNavigation/images/search_ic@3x.png"> </image>
</navigator>
<image class="img" id="shopcart" wx:if="{{isShowShopCart}}" animation="{{funcItemAnimation}}" bindtap="jumpToShopCart" src="/pages/quickNavigation/images/shopcart_ic@3x.png"> </image>
<button class="appBtn" bindtap='goApp' id="appBtn" type="default" hover-class="none" open-type="launchApp" app-parameter="{{appParameter}}" binderror="launchAppError" wx:if="{{isGoApp}}" animation="{{funcItemAnimation}}">
<image class="appImg" src="/pages/quickNavigation/images/APP@3x.png" animation="{{funcItemAnimation}}"></image>
</button>
</view>
<image class="img-switch" id="switch" bindtap="switchMenu" src="{{isExpand ?'/pages/quickNavigation/images/close_menu@3x.png' : '/pages/quickNavigation/images/open_menu@3x.png'}}"></image>
<form bindsubmit="formSubmit" report-submit='true'>
<button class="img-switch-btn" bindtap="switchMenu" formType="submit" wx:if="{{!isExpand}}"></button>
</form>
</view>
<button class="share-btn" type="default" hover-class="none" open-type="share" wx:if="{{isShare}}">
<image class="img-share" src="/pages/quickNavigation/images/share@3x.png"></image>
</button>
<image class="union_share" wx:if="{{isUnionShare}}" src="/pages/quickNavigation/images/share@3x.png" bindtap="unionShare"></image>
<image class="img-back" animation="{{indicatorAnimation}}" id="backtop" bindtap="backToTop" src="/pages/quickNavigation/images/backtop@3x.png"></image>
</view>
</view>
/* pages/quickNavigation/quickNavigation.wxss */
.quicknavigation {
position: fixed;
display: flex;
flex-direction: column;
width: 44px;
right: 15px;
bottom: 100rpx;
z-index: 1300;
}
.quicknavigation-content {
display: flex;
flex-direction: column;
width: 44px;
justify-content: flex-end;
align-self: center;
align-items: center;
/* background-color: red; */
}
.quicknavigation-menu {
display: flex;
flex-direction: column;
width: 100%;
align-self: center;
}
.quicknavigation-menu-func {
display: flex;
flex-direction: column;
width: 100%;
justify-content: flex-end;
margin-bottom: 5px;
}
.appBtn {
width: 44px;
height: 44px;
opacity: 0;
padding: 0;
align-self: center;
border-radius: 50%;
margin-top: 5px;
background-color: transparent !important;
}
.appBtn .appImg {
width: 44px;
height: 44px;
bottom: 0px;
margin-bottom: 5px;
}
.img {
width: 0px;
height: 0px;
opacity: 0;
align-self: center;
margin-top: 5px;
}
.img-switch,
.share-btn image {
width: 44px;
height: 44px;
bottom: 0px;
margin-bottom: 5px;
}
.img-switch-btn {
width: 44px;
height: 44px;
background-color: red;
opacity: 0;
position: absolute;
top: 35rpx;
}
.img-back {
width: 0px;
height: 0px;
opacity: 0;
margin-bottom: 5px;
}
.share-btn {
margin: 0;
padding: 0;
line-height: 0;
border-radius: 50%;
background-color: transparent !important;
}
.union_share {
width: 44px;
height: 44px;
bottom: 0px;
margin-bottom: 5px;
}
\ No newline at end of file
... ... @@ -40,9 +40,6 @@ Component({
type: text.miniappType || 0
})
},
goShare() {
this.triggerEvent('share', this.properties.item);
},
onOk() {
this.setData({
show: false
... ...
... ... @@ -267,12 +267,13 @@ Page(Object.assign({
})
setTimeout(function () {
wx.createSelectorQuery().select('.code-list-item-container').boundingClientRect().exec((r) => {
if (r && r[0] && r[0].height) {
animation.height(r[0].height - 65 * sys.screenWidth / 375).step();
this.setData({
animation: animation.export()
});
}
})
})
}.bind(this), 800);
}
});
... ...
... ... @@ -12,7 +12,6 @@
"help": "./components/help",
"fellow-bar": "./components/fellow-bar",
"action-bar": "./components/action-bar",
"quickNavigation": "/pages/quickNavigation/quickNavigation",
"zero-alert": "./components/alert",
"group-recommend": "./components/group-recommend"
}
... ...
... ... @@ -86,8 +86,6 @@
<import src="../../vendors/toast/wetoast.wxml"/>
<template is="wetoast" data="{{...__wetoast__}}"/>
<!-- <quickNavigation id="quickNavigation" isShowIndicator="{{false}}" isShowShopCart="{{false}}" marginBottom="{{190}}"></quickNavigation> -->
<zero-alert wx:if="{{showAuth}}">
<view class="auth-content">OOPS 用户尚未授权登录</view>
<button class="auth-foot action-item confirm" open-type="{{!hasUnionID ? 'getUserInfo':'getPhoneNumber'}}"
... ...
... ... @@ -517,13 +517,6 @@ Page(Object.assign({
});
},
share({detail}) {
this.setData({
'actionsheet.show': true,
'shareProduct': detail
})
},
handleZanActionsheetCancel({componentId}) {
this.setData({
'actionsheet.show': false
... ... @@ -552,37 +545,7 @@ Page(Object.assign({
}
;
},
onShareAppMessage(res) {
let params = {
TITLE: `【0元抽奖】点一下,免费拿走${this.data.shareProduct.name}`,
DESC: '我在YO!LUCK发现一个不错的商品赶快来看看吧!'
};
if (res.from === 'menu') {
// 用户点击右上角分享
return {
title: params.TITLE, // 分享标题
desc: params.DESC, // 分享描述
path: `pages/zeroSell/detail?actPrizeId=${this.data.shareProduct.act_prize_id}`,
imageUrl: this.data.shareProduct.cover_img,
success: function () {
},
fail: function () {
}
};
} else if (res.from === 'button') {
// 用户点击分享按钮
return {
title: params.TITLE, // 分享标题
desc: params.DESC, // 分享描述
path: `/pages/zeroSell/detail?actPrizeId=${this.data.shareProduct.act_prize_id}&shareUid=${app.getUid()}`,
imageUrl: this.data.shareProduct.cover_img,
success: function () {
},
fail: function () {
}
};
}
onShareAppMessage() {
// 默认分享
}
}, Toast, Actionsheet));
\ No newline at end of file
... ...
... ... @@ -5,7 +5,6 @@
"backgroundTextStyle": "light",
"usingComponents": {
"product-item": "./components/product-item",
"quickNavigation": "/pages/quickNavigation/quickNavigation",
"tabs": "./components/tabs",
"tabs-pane": "./components/tabs-pane",
"dialog": "/components/dialog/dialog",
... ...
... ... @@ -38,7 +38,7 @@
</block>
<block wx:else>
<block wx:for="{{my_zero_list[0].data}}" wx:key="{{index}}">
<prize-item item="{{item}}" bindshare="share" tab-idx="{{tabIndex}}"></prize-item>
<prize-item item="{{item}}" tab-idx="{{tabIndex}}"></prize-item>
</block>
</block>
<view class="title-view">
... ... @@ -51,7 +51,7 @@
</block>
<block wx:else>
<block wx:for="{{my_zero_list[1].data}}" wx:key="{{index}}">
<prize-item item="{{item}}" bindshare="share" tab-idx="{{tabIndex}}"></prize-item>
<prize-item item="{{item}}" tab-idx="{{tabIndex}}"></prize-item>
</block>
</block>
</block>
... ...
... ... @@ -22,7 +22,6 @@ function jumpFn(name, qs) {
url: `${path}?${stringify(qs)}`
};
console.log(`page => ${params.url}`);
wx.navigateTo(params);
}
... ...