Skip to content

M
mayi-mp-shop
Commit 349bf7bc by 程智春
Options

Merge branch 'nativehome_tst' of http://code.mayi888.com/chengmo/mayi-mp-shop into nativehome_tst

parents beedda9f 774db429
Showing with 1428 additions and 267 deletions
custom-tab-bar/index.js
...@@ -46,38 +46,69 @@ Component({ ...@@ -46,38 +46,69 @@ Component({
version: "1.0.0", version: "1.0.0",
visible: 1 visible: 1
}], }],
componentData:{} componentData: {}
}, },
attached() { attached() {
var appInstance = getApp() let that = this
let that=this if (app.globalData.footerVal) {
if (appInstance.globalData.footerVal) {
that.setData({ that.setData({
componentData:appInstance.globalData.footerVal.componentData, componentData: app.globalData.footerVal.componentData,
list: appInstance.globalData.footerVal.componentData.list list: app.globalData.footerVal.componentData.list
}) })
}else{ } else {
appInstance.footerCallBack=function (params) { app.footerCallBack = function (params) {
that.setData({ that.setData({
componentData:params.componentData, componentData: params.componentData,
list: params.componentData.list list: params.componentData.list
}) })
} }
} }
// ----------webview 变化
console.log('启动1111')
app.webviewCallBack = function (state,params) {
console.log('webview变化',state,params)
}
}, },
methods: { methods: {
init() { init() {
}, },
switchTab(e) { switchTab(e) {
const data = e.currentTarget.dataset // mpApp.$themeToLink //
const url = data.path const {
wx.switchTab({ index
url } = e.currentTarget.dataset
}) console.log('755555555', this.data.list[index].link)
this.setData({ // if (index == this.data.selected) return
selected: data.index
})
app.globalData.tabBarPageLink=this.data.list[index].link.link
console.log(app,'aaaa')
this.toPage(this.data.list[index].link,index)
// return
// app.$themeToLink(this.data.list[index].link)
// this.setData({
// selected: index
// })
},
toPage(data,index){
console.log('index98',index)
// 跳转
if (data.link=='/') {
wx.switchTab({
url: '/pages/home/main',
})
}else{
wx.switchTab({
url: `/pages/tabBar${index}/main`,
})
// ?from=tabbar&backpath=${
// data.link
// }
}
} }
} }
}) })
custom-tab-bar/index.wxml
<!--miniprogram/custom-tab-bar/index.wxml--> <!--miniprogram/custom-tab-bar/index.wxml-->
<cover-view class="tab-bar"> <cover-view class="tab-bar">
<cover-view class="tab-bar-border"></cover-view> <cover-view class="tab-bar-border"></cover-view>
<cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" <cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.link}}" data-index="{{index}}"
bindtap="switchTab"> bindtap="switchTab">
<cover-view wx:if="{{item.iconType==0||!item.iconType}}"> <cover-view wx:if="{{item.iconType==0||!item.iconType}}">
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
</cover-view> </cover-view>
<cover-view wx:elif="{{item.iconType==1}}" <cover-view wx:elif="{{item.iconType==1}}"
class="img-view" class="img-view"
style="width:{{(index==selected?componentData.selectionIconSize*2:componentData.defaultIconSize*2)+'rpx'}}"> style="width:{{(index==selected?componentData.selectionIconSize*2:componentData.defaultIconSize*2)+'rpx'}};height:{{(index==selected?componentData.selectionIconSize*2:componentData.defaultIconSize*2)+'rpx'}}">
<cover-image src="{{selected === index ? item.selectImgUrl : item.imgUrl}}"></cover-image> <cover-image src="{{selected === index ? item.selectImgUrl : item.imgUrl}}"></cover-image>
</cover-view> </cover-view>
<!-- 名称 --> <!-- 名称 -->
......
src/api/goods.js 0 → 100644
import { requestPOST, requestGET } from "@/utils/request.js";
export default {
queryProductInfo(data) {
return requestPOST(`${process.env.OLSHOP_URL}/product/query_product_info`, data);
},
queryBriefProductInfo(data) {
return requestPOST(`${process.env.OLSHOP_URL}/product/query_brief_product_info`, data);
},
queryMoreProductInfo(data) {
return requestPOST(`${process.env.OLSHOP_URL}/product/query_more_product_info`, data);
}
};
src/app.json
...@@ -7,7 +7,11 @@ ...@@ -7,7 +7,11 @@
"pages/counter/main", "pages/counter/main",
"pages/address/main", "pages/address/main",
"pages/contact/main", "pages/contact/main",
"pages/officialAccount/main" "pages/officialAccount/main",
"pages/tabBar1/main",
"pages/tabBar2/main",
"pages/tabBar3/main",
"pages/tabBar4/main"
], ],
"tabBar": { "tabBar": {
"custom": true, "custom": true,
...@@ -15,13 +19,23 @@ ...@@ -15,13 +19,23 @@
"selectedColor": "#3cc51f", "selectedColor": "#3cc51f",
"borderStyle": "black", "borderStyle": "black",
"backgroundColor": "#ffffff", "backgroundColor": "#ffffff",
"list": [{ "list": [
"pagePath": "pages/home/main", {
"text": "组件" "pagePath": "pages/home/main"
}, { },
"pagePath": "pages/index/main", {
"text": "接口" "pagePath": "pages/tabBar1/main"
}] },
{
"pagePath": "pages/tabBar2/main"
},
{
"pagePath": "pages/tabBar3/main"
},
{
"pagePath": "pages/tabBar4/main"
}
]
}, },
"usingComponents": {}, "usingComponents": {},
"window": { "window": {
...@@ -35,4 +49,4 @@ ...@@ -35,4 +49,4 @@
"desc": "你的位置信息将用于获取附近的门店" "desc": "你的位置信息将用于获取附近的门店"
} }
} }
} }
\ No newline at end of file
src/main.js
...@@ -2,6 +2,9 @@ import Vue from 'vue' ...@@ -2,6 +2,9 @@ import Vue from 'vue'
import App from './App' import App from './App'
import Store from './store/index' import Store from './store/index'
import "../static/nicon/iconfont.css" import "../static/nicon/iconfont.css"
import goodsApi from "./api/goods"
import { DFSImg } from "@/utils/index";
import { $themeToLink } from "@/utils/mayi"
Vue.config.productionTip = false Vue.config.productionTip = false
App.mpType = 'app' App.mpType = 'app'
...@@ -11,7 +14,7 @@ Vue.prototype.$store = Store ...@@ -11,7 +14,7 @@ Vue.prototype.$store = Store
let mpAnalytics = require("../node_modules/mayi-analytics/dist/mayi.mpAnalytics.js") let mpAnalytics = require("../node_modules/mayi-analytics/dist/mayi.mpAnalytics.js")
.default; .default;
mpAnalytics.init({ mpAnalytics.init({
url:process.env.NODE_ENV == 'production'?"https://analytics.mayi888.com/ma.gif":"https://analytics.mayi888.cn/ma.gif", //错误上报地址 url: process.env.NODE_ENV == 'production' ? "https://analytics.mayi888.com/ma.gif" : "https://analytics.mayi888.cn/ma.gif", //错误上报地址
app: "mayi-mp-shop",//项目名称 app: "mayi-mp-shop",//项目名称
wx wx
}); });
...@@ -22,12 +25,22 @@ app.$mount() ...@@ -22,12 +25,22 @@ app.$mount()
// glob挂载到 // glob挂载到
let mpApp=getApp(); let mpApp = getApp();
Vue.prototype.mpApp = mpApp Vue.prototype.mpApp = mpApp
// 定义数据回调函数 // 数据异步回调函数
// 商城 // 商城
mpApp.shopCallBack=function() {} mpApp.shopCallBack = function () { }
// 多主题页面 // 多主题页面
mpApp.pageCallBack=function() {} mpApp.pageCallBack = function () { }
// 底部栏 // 底部栏
mpApp.footerCallBack=function() {} mpApp.footerCallBack = function () { }
// webview变化
mpApp.webviewCallBack = function () { }
console.log('3555555', wx)
// 全局跳转 data为link对象
mpApp.$themeToLink = $themeToLink
// api
mpApp.goodsApi = goodsApi;
mpApp.DFSImg = DFSImg;
src/pages/home/index.vue
<template> <template>
<div class="domain"> <div class="domain">
<div v-for="item in pageData" :key="item.id"> <!-- <goods-list id="goodsList"></goods-list> -->
<div v-for="(item,index) in pageData" :key="index">
<div v-if="item.componentCode=='banner'"> <div v-if="item.componentCode=='banner'">
<banner :datas="item"></banner> <banner :datas="item"></banner>
1 </div>
<div v-else-if="item.componentCode=='goods-list'">
<goods-list :datas="item"></goods-list>
</div> </div>
<div v-if="item.componentCode == 'area-navigation'"> <div v-if="item.componentCode == 'area-navigation'">
<area-navigation :datas="item"></area-navigation> <area-navigation :datas="item"></area-navigation>
...@@ -12,15 +15,14 @@ ...@@ -12,15 +15,14 @@
<cube-nav :datas="item"></cube-nav> <cube-nav :datas="item"></cube-nav>
</div> </div>
</div> </div>
<image <!-- <image
src="http://cdn.mayi888.com/public/jpg/33ff0efc-96b5-4044-a65a-07799dfe98e1.jpg?x-oss-process=image/resize,limit_1,w_750" src="http://cdn.mayi888.com/public/jpg/33ff0efc-96b5-4044-a65a-07799dfe98e1.jpg?x-oss-process=image/resize,limit_1,w_750"
></image> ></image>
<van-button type="primary">按钮</van-button> <van-button type="primary">按钮</van-button>
<view class="ant-gongsidizhi"></view> <view class="ant-bofang">1</view> -->
<view class="ant-bofang">1</view> <!-- ----瀑布流开始---- -->
----瀑布流开始---- <!-- <waterfall-flow id="waterfallFlow"></waterfall-flow> -->
<waterfall-flow id="waterfallFlow"></waterfall-flow> <!-- ----瀑布流结束---- -->
----瀑布流结束----
<!-- <banner id="banner" :datas="componentsList[0]"></banner> <!-- <banner id="banner" :datas="componentsList[0]"></banner>
<div class="domain">abc <div class="domain">abc
...@@ -38,10 +40,10 @@ export default { ...@@ -38,10 +40,10 @@ export default {
}; };
}, },
onLoad() { onLoad() {
let that = this;
if (this.mpApp.globalData.pageList) { if (this.mpApp.globalData.pageList) {
that.init(this.mpApp.globalData.pageList); that.init(this.mpApp.globalData.pageList);
} else { } else {
let that = this;
this.mpApp.pageCallBack = function (params) { this.mpApp.pageCallBack = function (params) {
that.init(params); that.init(params);
}; };
......
src/pages/index/index.vue
<template> <template>
<div> <div>
{{withoutScene}}
<web-view v-if="withoutScene" :src="pageUrl" @message="getMessage" @error="handleError" @load="handleLoad"></web-view> <web-view v-if="withoutScene" :src="pageUrl" @message="getMessage" @error="handleError" @load="handleLoad"></web-view>
</div> </div>
</template> </template>
...@@ -41,7 +42,7 @@ export default { ...@@ -41,7 +42,7 @@ export default {
shareOrderSn: "", shareOrderSn: "",
shareTid: "", shareTid: "",
newWindowHref : '', newWindowHref : '',
withoutScene: true, withoutScene: false,
sharePageList: [ sharePageList: [
"goods/", "goods/",
"receivingGift", "receivingGift",
...@@ -56,7 +57,7 @@ export default { ...@@ -56,7 +57,7 @@ export default {
} }
}, },
watch: { watch: {
pageUrl() { pageUrl(n,o) {
//埋点未登录时进入文章 //埋点未登录时进入文章
// this.params+='&articleId=111' // this.params+='&articleId=111'
console.log(wx.getStorageSync("sessionid"),3333333,this.pageUrl) console.log(wx.getStorageSync("sessionid"),3333333,this.pageUrl)
...@@ -75,6 +76,7 @@ export default { ...@@ -75,6 +76,7 @@ export default {
} }
}, },
onLoad(options) { onLoad(options) {
this.options = options; this.options = options;
Object.assign(this.$data, this.$options.data()); Object.assign(this.$data, this.$options.data());
console.log( console.log(
...@@ -91,6 +93,7 @@ export default { ...@@ -91,6 +93,7 @@ export default {
success: res => { success: res => {
this.code = res.code; this.code = res.code;
login.miniLogin({ code: this.code}).then(res1 => { login.miniLogin({ code: this.code}).then(res1 => {
this.withoutScene = true;
console.log(res1,555555) console.log(res1,555555)
if (res1.data.code == 200) { if (res1.data.code == 200) {
wx.setStorage({ wx.setStorage({
...@@ -110,7 +113,17 @@ export default { ...@@ -110,7 +113,17 @@ export default {
this.options = options; this.options = options;
console.log('-------1',options.scene) console.log('-------1',options.scene)
console.log(this.options) console.log(this.options)
console.log('-------') console.log('-------link',this.mpApp.globalData.tabBarPageLink)
// tabbar 跳转
// if (this.mpApp.globalData.tabBarPageLink) {
// this.page = this.mpApp.globalData.tabBarPageLink;
// this.mpApp.globalData.tabBarPageLink=''
// }
// if (options.from && options.from == "tabbar") {
// this.page = decodeURIComponent(options.backpath);
// }
// ---------
if (options.share) { if (options.share) {
//来自分享 //来自分享
this.link = decodeURIComponent(options.share); this.link = decodeURIComponent(options.share);
...@@ -137,10 +150,10 @@ export default { ...@@ -137,10 +150,10 @@ export default {
key: "sessionid", key: "sessionid",
data: params.sessionid data: params.sessionid
}); });
} else if (options.from && options.from == "livedToIndex") { } else if (options.from && (options.from == "home" || options.from == "livedToIndex")) {
//来自直播详情 //来自直播详情
this.page = decodeURIComponent(options.backpath); this.page = decodeURIComponent(options.backpath);
this.params += "&" + serialize(options.params); options.params && (this.params += "&" + serialize(options.params));
} else if (options.from && options.from == "livedBackShop") { } else if (options.from && options.from == "livedBackShop") {
//直播页back到商城 //直播页back到商城
this.page = decodeURIComponent(options.backpath); this.page = decodeURIComponent(options.backpath);
...@@ -314,9 +327,6 @@ export default { ...@@ -314,9 +327,6 @@ export default {
} }
this.init(); this.init();
}, },
onShow() {
// console.log('显示了',options.webViewUrl);
},
methods: { methods: {
init() { init() {
// 获取小程序开启的订阅消息配置 // 获取小程序开启的订阅消息配置
...@@ -343,7 +353,7 @@ export default { ...@@ -343,7 +353,7 @@ export default {
console.log('244',getOpenid,getSessionid); console.log('244',getOpenid,getSessionid);
if (getOpenid == "" || getSessionid == "") { if (getOpenid == "" || getSessionid == "") {
this.params += "&logOut=true"; // this.params += "&logOut=true";
} }
}, },
getLocationHandle() { getLocationHandle() {
......
src/pages/login/index.vue
...@@ -95,6 +95,7 @@ export default { ...@@ -95,6 +95,7 @@ export default {
}) })
}, },
onLoad(options) { onLoad(options) {
console.log(options,'login')
Object.assign(this.$data, this.$options.data()); //mpvue 的混合周期 使用小程序生命周期数据未初始化 Object.assign(this.$data, this.$options.data()); //mpvue 的混合周期 使用小程序生命周期数据未初始化
if (options.back) { if (options.back) {
this.backPath = options.back; this.backPath = options.back;
......
src/pages/rediect/main.js 0 → 100644
import Vue from 'vue'
import App from './index'
// add this to handle exception
Vue.config.errorHandler = function (err) {
if (console && console.error) {
console.error(err)
}
}
const app = new Vue(App)
app.$mount()
src/pages/rediect/main.json 0 → 100644
{
}
\ No newline at end of file
src/pages/tabBar1/index.vue 0 → 100644
<!--
tabbar
-->
<template>
<div>
<web-view :src="pageUrl" @error="handleError"></web-view>
</div>
</template>
<script>
import { getUrlofLink } from "../../utils/mayi.js";
export default {
data() {
return {
link: process.env.BASE_URL,
page: "/",
params: "?mixid=" + this.$store.state.mixid,
index:1
};
},
computed: {
pageUrl() {
return this.link + this.page + this.params;
},
},
onLoad(options) {
// tabbar 跳转
if (this.mpApp.globalData.footerVal.componentData.list[this.index].link) {
this.page = getUrlofLink(
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
this.mpApp.globalData.tabBarPageLink = "";
}
},
onShow(){
console.log('show')
if (this.mpApp.globalData.footerVal.componentData.list[this.index].link) {
this.page = getUrlofLink(
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
this.mpApp.globalData.tabBarPageLink = "";
}
// if (typeof this.getTabBar === 'function' &&
// this.getTabBar()) {
// this.getTabBar().setData({
// selected: 0
// })
// }
},
methods: {
handleError(data) {
wx.showLoading({
title: "网页加载失败 请右上角刷新",
});
},
},
};
</script>
<style lang="scss" scoped></style>
src/pages/tabBar1/main.js 0 → 100644
import Vue from 'vue'
import App from './index'
const app = new Vue(App)
app.$mount()
src/pages/tabBar1/main.json 0 → 100644
{
}
\ No newline at end of file
src/pages/tabBar2/index.vue 0 → 100644
<!--
tabbar
-->
<template>
<div>
<web-view :src="pageUrl" @error="handleError"></web-view>
</div>
</template>
<script>
import { getUrlofLink } from "../../utils/mayi.js";
export default {
data() {
return {
link: process.env.BASE_URL,
page: "/",
params: "?mixid=" + this.$store.state.mixid,
index:2
};
},
computed: {
pageUrl() {
return this.link + this.page + this.params;
},
},
onLoad(options) {
// tabbar 跳转
if (this.mpApp.globalData.footerVal.componentData.list[this.index].link) {
this.page = getUrlofLink(
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
this.mpApp.globalData.tabBarPageLink = "";
}
},
// onShow(){
// if (typeof this.getTabBar === 'function' &&
// this.getTabBar()) {
// this.getTabBar().setData({
// selected: 0
// })
// }
// },
methods: {
handleError(data) {
wx.showLoading({
title: "网页加载失败 请右上角刷新",
});
},
},
};
</script>
<style lang="scss" scoped></style>
src/pages/tabBar2/main.js 0 → 100644
import Vue from 'vue'
import App from './index'
const app = new Vue(App)
app.$mount()
src/pages/tabBar2/main.json 0 → 100644
{
}
\ No newline at end of file
src/pages/tabBar3/index.vue 0 → 100644
<!--
tabbar
-->
<template>
<div>
<web-view :src="pageUrl" @error="handleError"></web-view>
</div>
</template>
<script>
import { getUrlofLink } from "../../utils/mayi.js";
export default {
data() {
return {
link: process.env.BASE_URL,
page: "/",
params: "?mixid=" + this.$store.state.mixid,
index:3
};
},
computed: {
pageUrl() {
return this.link + this.page + this.params;
},
},
onLoad(options) {
// tabbar 跳转
if (this.mpApp.globalData.footerVal.componentData.list[this.index].link) {
this.page = getUrlofLink(
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
this.mpApp.globalData.tabBarPageLink = "";
}
},
// onShow(){
// if (typeof this.getTabBar === 'function' &&
// this.getTabBar()) {
// this.getTabBar().setData({
// selected: 0
// })
// }
// },
methods: {
handleError(data) {
wx.showLoading({
title: "网页加载失败 请右上角刷新",
});
},
},
};
</script>
<style lang="scss" scoped></style>
src/pages/tabBar3/main.js 0 → 100644
import Vue from 'vue'
import App from './index'
const app = new Vue(App)
app.$mount()
src/pages/tabBar3/main.json 0 → 100644
{
}
\ No newline at end of file
src/pages/tabbar4/index.vue 0 → 100644
<!--
tabbar
-->
<template>
<div>
<web-view :src="pageUrl" @error="handleError"></web-view>
</div>
</template>
<script>
import { getUrlofLink } from "../../utils/mayi.js";
export default {
data() {
return {
link: process.env.BASE_URL,
page: "/",
params: "?mixid=" + this.$store.state.mixid,
index:4
};
},
computed: {
pageUrl() {
return this.link + this.page + this.params;
},
},
onLoad(options) {
// tabbar 跳转
if (this.mpApp.globalData.footerVal.componentData.list[this.index].link) {
this.page = getUrlofLink(
this.mpApp.globalData.footerVal.componentData.list[this.index].link
);
this.mpApp.globalData.tabBarPageLink = "";
}
},
// onShow(){
// if (typeof this.getTabBar === 'function' &&
// this.getTabBar()) {
// this.getTabBar().setData({
// selected: 0
// })
// }
// },
methods: {
handleError(data) {
wx.showLoading({
title: "网页加载失败 请右上角刷新",
});
},
},
};
</script>
<style lang="scss" scoped></style>
src/pages/tabbar4/main.js 0 → 100644
import Vue from 'vue'
import App from './index'
const app = new Vue(App)
app.$mount()
src/pages/tabbar4/main.json 0 → 100644
{
}
\ No newline at end of file
src/pages/wxArticle/index.vue
<!-- <!--
* @Author: your name 第三方url
* @Date: 2020-10-21 09:51:48
* @LastEditTime: 2020-10-21 10:35:55
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \mayi-mp-shop\src\pages\wxArticle\index.vue
--> -->
<template> <template>
<div> <div>
......
src/utils/mayi.js 0 → 100644
// 获取link 中页面地址(link兼容 有object或者string)
export function getUrlofLink(data) {
return data.link
}
// 全局跳转
export function $themeToLink(data) {
let app = getApp()
let footerVal = app.globalData.footerVal.componentData.list;
console.log('393939', footerVal)
let type = data.type;
// 历史数据
if (type == undefined || type == 'undefined') {
if (data.length > 0) {
toPage(data)
}
return
}
// 底部导航跳转
let parseLink = getUrlofLink(data)
let isFooter = footerVal.findIndex(item => {
return item.link.link == parseLink
})
if (isFooter > -1) {
wx.switchTab({
url: parseLink == '/' ? '/pages/home/main' : `/pages/tabBar${isFooter}/main`,
})
return
}
// -----------------
if (type == 0) {//无链接
return
} else if (type == 1) {//h5页面
//兼容
if (data.link.substring(0, 1) == "/") {
toPage(data.link)
} else {
if (data.link.startsWith('http') || data.link.startsWith('https')) {
wx.navigateTo({ url: '/pages/wxArticle/main?link=' + encodeURIComponent(data.link) });
}
}
} else if (type == 1.1) {//小程序页面 可能增加登录态拦截
wx.navigateTo({ url: data.link });
} else if (type == 1.2) { //第三方链接
if (data.link == 'outerChain:businessCenter') {
// 进入商家中心外链
let url = `${config.GUIDE_URL}/login?mixid=${this.$nuxt.$route.query.mixid}&back=${encodeURIComponent(window.location.href)}`;
wx.navigateTo({ url: '/pages/wxArticle/main?link=' + encodeURIComponent(url) });
return
}
if (data.link.substring(0, 1) == "/") {
toPage(data.link)
} else {
wx.navigateTo({ url: '/pages/wxArticle/main?link=' + encodeURIComponent(data.link) });
}
} else if (type == 2) {//功能
let featureType = data.feature.type;
if (featureType == 'themeCouponClick' || featureType == 0) {//优惠券
// this.$themeCouponClick(data.feature.value.couponCode, data.feature.value);
} else if (featureType == 1) {//分享
console.log('是分享了。。。。');
} else if (featureType == "themeMemberCardClick" || featureType == 2) { //会员卡
// this.$themeMemberCardClick(data.feature.value);
}
} else if (type == 3) { //小程序跳转到小程序
wx.navigateTo({
url: `/pages/toMini/main?weappPage=${encodeURIComponent(data.link)}&weappAppId=${data.name}`,
})
} else {
//向后兼容
if (data.length > 0) {
toPage(data.link);
}
}
}
function toPage(backPath, backParams) {
wx.navigateTo({
url: `../index/main?from=home&backpath=${backPath}&params=${encodeURIComponent(backParams)}`
});
}
// check url是否为底部栏配置项
\ No newline at end of file
static/font/common_icon.wxss 0 → 100644
@font-face {font-family: "iconfont-common";
src: url('//at.alicdn.com/t/font_1701913_tl1esdcjv9r.eot?t=1599790483837'); /* IE9 */
src: url('//at.alicdn.com/t/font_1701913_tl1esdcjv9r.eot?t=1599790483837#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
url('//at.alicdn.com/t/font_1701913_tl1esdcjv9r.woff?t=1599790483837') format('woff'),
url('//at.alicdn.com/t/font_1701913_tl1esdcjv9r.ttf?t=1599790483837') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('//at.alicdn.com/t/font_1701913_tl1esdcjv9r.svg?t=1599790483837#iconfont-common') format('svg'); /* iOS 4.1- */
}
.iconfont-common {
font-family: "iconfont-common" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.common-iconjiantou:before {
content: "\e618";
}
.common-icongouwuche:before {
content: "\e726";
}
.common-icon5gouwudai2:before {
content: "\e656";
}
.common-icongouwudai:before {
content: "\e600";
}
.common-icongwc:before {
content: "\e674";
}
.common-iconjiahao:before {
content: "\e620";
}
.common-iconsousuo:before {
content: "\e6a8";
}
.common-iconyoujiantou:before {
content: "\e61c";
}
.common-iconfenxiang:before {
content: "\e688";
}
.common-iconbofang:before {
content: "\e689";
}
.common-iconaixin:before {
content: "\e65c";
}
.common-iconaixin1:before {
content: "\e619";
}
.common-icondianzan:before {
content: "\e60c";
}
.common-iconbofang2:before {
content: "\e635";
}
.common-iconbofang1-copy:before {
content: "\e675";
}
.common-iconqinziAPPtubiao-:before {
content: "\e648";
}
.common-iconrenzhengguanli:before {
content: "\e650";
}
.common-iconerweima:before {
content: "\e673";
}
.common-iconjifen11:before {
content: "\e652";
}
.common-iconmoren:before {
content: "\e66b";
}
static/nativeComponents/Banner/index.js
...@@ -31,5 +31,10 @@ Component({ ...@@ -31,5 +31,10 @@ Component({
console.log(val,'--------30') console.log(val,'--------30')
this.setData({ activeIndex:val.detail.current }); this.setData({ activeIndex:val.detail.current });
}, },
onClick(data){
let item=data.currentTarget.dataset.item;
console.log(data.currentTarget.dataset.item,'iiii')
app.$themeToLink(item.link)
}
} }
}); });
\ No newline at end of file
static/nativeComponents/Banner/index.wxml
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<swiper class="swiper" indicator-dots="{{indicatorDots}}" <swiper class="swiper" indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="true" bindchange="bannerChange"> autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="true" bindchange="bannerChange">
<block wx:for="{{datas.componentData.imgList}}" wx:key="index"> <block wx:for="{{datas.componentData.imgList}}" wx:key="index">
<swiper-item> <swiper-item data-item="{{item}}" bindtap="onClick" >
<view class="swiper-item"> <view class="swiper-item">
<image src="{{item.imageUrl}}" style="width:100%;border-radius:{{datas.componentData.borderRadius*2}}rpx" mode="widthFix" class="bannerImgItem"></image> <image src="{{item.imageUrl}}" style="width:100%;border-radius:{{datas.componentData.borderRadius*2}}rpx" mode="widthFix" class="bannerImgItem"></image>
</view> </view>
......
static/nativeComponents/GoodsList/GoodsItem/index.js
...@@ -17,7 +17,8 @@ const componentOptions = { ...@@ -17,7 +17,8 @@ const componentOptions = {
}, },
// 组件数据 // 组件数据
data: { data: {
isPageHidden: false // 页面是否处于隐藏状态 isPageHidden: false, // 页面是否处于隐藏状态
timeData: {},
}, },
// 数据监听器 // 数据监听器
observers: {}, observers: {},
...@@ -50,6 +51,9 @@ const componentOptions = { ...@@ -50,6 +51,9 @@ const componentOptions = {
showFlag = true; showFlag = true;
} }
return showFlag; return showFlag;
},
onChange(e) {
this.setData({ timeData: e.detail });
} }
}, },
// 组件生命周期 // 组件生命周期
......
static/nativeComponents/GoodsList/GoodsItem/index.json
{ {
"component": true, "component": true,
"usingComponents": {} "usingComponents": {
"van-count-down":"/static/vant/count-down/index"
}
} }
static/nativeComponents/GoodsList/GoodsItem/index.wxml
<!-- 商品列表item --> <!-- 商品列表item -->
<view class="goodsItem" style="--proGap2:{{datas.componentData.proGap*2}}rpx;"> <view class="goodsItem {{datas.componentData.style==='rowList'?'goodsRowList':''}} {{datas.componentData.style==='heap'?'goodsRowList goodsHeapItem':''}}" style="--proGap2:{{datas.componentData.proGap*2}}rpx;">
<view class="goods-item-child {{datas.componentData['borderColorShow']?'goods-item-child-bd':''}}" style="border-radius:{{datas.componentData.borderRadius}}em;--border_color:{{datas.componentData['borderColor']}};box-shadow:{{datas.componentData['cardShadow']?'0rpx 0rpx 10rpx '+datas.componentData['cardShadowSize']*2+'rpx #ccc':''}};"> <view class="goods-item-child {{datas.componentData['borderColorShow']?'goods-item-child-bd':''}}" style="border-radius:{{datas.componentData.borderRadius}}em;--border_color:{{datas.componentData['borderColor']}};box-shadow:{{datas.componentData['cardShadow']?'0rpx 0rpx 10rpx '+datas.componentData['cardShadowSize']*2+'rpx #ccc':''}};">
<!-- 商户入口-顶部 --> <!-- 商户入口-顶部 -->
<view class="merchantsEntrance flex" wx:if="{{datas.componentData['merchantsEntrance'] && datas.componentData['merchantsEntranceType'] == 0}}"> <view class="merchantsEntrance flex" wx:if="{{datas.componentData['merchantsEntrance'] && datas.componentData['merchantsEntranceType'] == 0 && datas.componentData.style!='heap'}}">
<view class="left flex" wx:if="{{items != null}}"> <view class="left flex" wx:if="{{items != null}}">
<view class="logo"> <view class="logo">
<image mode='widthFix' src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/ppefWK8BS6.png?x-oss-process=image/resize,limit_1,w_150,h_150" /> <image mode='widthFix' src="{{items.shopLogoUrl}}" />
</view> </view>
<view class="name">{{items.orgName}}</view> <view class="name">{{items.orgName}}</view>
</view> </view>
...@@ -18,11 +18,26 @@ ...@@ -18,11 +18,26 @@
style="padding:{{datas.componentData.imgSize}}" style="padding:{{datas.componentData.imgSize}}"
> >
<!-- 开启售卖 --> <!-- 开启售卖 -->
<view class="saleWay" wx:if="{{items.saleWay==2 &&getSaleTime(items.saleTime)>0}}"> <view class="saleWay" wx:if="{{items.saleWay==2 && items.getSaleTime>0 && datas.componentData.style!='heap'}}">
<view class="saleWayBg"></view> <view class="saleWayBg"></view>
<view> <view class="saleTime">
6545646 <van-count-down
use-slot
time="{{items.getSaleTime}}"
bind:change="onChange"
>
<text>距开售:</text>
<text class="block">{{ timeData.days }}</text>
<text class="colon">天</text>
<text class="block">{{ timeData.hours }}</text>
<text class="colon">时</text>
<text class="block">{{ timeData.minutes }}</text>
<text class="colon">分</text>
<text class="block">{{ timeData.seconds }}</text>
<text class="colon">秒</text>
</van-count-down>
</view> </view>
</view> </view>
<!-- 商品角标 --> <!-- 商品角标 -->
<view <view
...@@ -30,14 +45,25 @@ ...@@ -30,14 +45,25 @@
style="width:{{datas.componentData.angleSignSize}}%;height:{{datas.componentData.angleSignSize}}%;" style="width:{{datas.componentData.angleSignSize}}%;height:{{datas.componentData.angleSignSize}}%;"
wx:if="{{datas.componentData['angleSign'] && datas.componentData['angleSignImg']}}" wx:if="{{datas.componentData['angleSign'] && datas.componentData['angleSignImg']}}"
> >
<image mode="widthFix" src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/ppefWK8BS6.png?x-oss-process=image/resize,limit_1,w_150,h_150" /> <image mode="widthFix" src="{{datas.componentData['angleSignImg']}}" />
</view> </view>
<!-- 商品主图 --> <!-- 商品主图 -->
<image mode="widthFix" src="https://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/yWDmitPPmD.jpg?x-oss-process=image/resize,limit_1,w_700" /> <image
mode="{{datas.componentData.style==='rowList' || datas.componentData.style==='heap'?'aspectFit':'widthFix'}}"
class="productImgUrl"
wx:if="{{datas.componentData.goodsImgType == 1}}"
src="{{items.productImgUrl}}"
/>
<image
mode="{{datas.componentData.style==='rowList' || datas.componentData.style==='heap'?'aspectFit':'widthFix'}}"
class="productImgUrl"
wx:else
src="{{items.coverImage}}"
/>
<!-- 售罄遮罩 --> <!-- 售罄遮罩 -->
<view class="whiteBg" wx:if="{{items&&items.oversoldFlag==0&&items.totalQty-0<=0}}"> <view class="whiteBg" wx:if="{{items&&items.oversoldFlag==0&&items.totalQty-0<=0}}">
<view class="cover"> <view class="cover">
<image mode="widthFix" src="http://mayi-newshop.oss-cn-shanghai.aliyuncs.com/public/png/f254fe62-6dda-46f6-a2f4-a7b2aa0474df.png" /> <image mode="aspectFit" src="http://mayi-newshop.oss-cn-shanghai.aliyuncs.com/public/png/f254fe62-6dda-46f6-a2f4-a7b2aa0474df.png" />
</view> </view>
</view> </view>
</view> </view>
...@@ -48,9 +74,13 @@ ...@@ -48,9 +74,13 @@
<view class="name" wx:if="{{datas.componentData['nameShow']}}"> <view class="name" wx:if="{{datas.componentData['nameShow']}}">
{{items!=null?items['productName']:'名称'}} {{items!=null?items['productName']:'名称'}}
</view> </view>
<view class="follower-wrap" wx:if="{{datas.componentData['followerShow']}}"> <view
class="follower-wrap"
wx:if="{{datas.componentData['followerShow']}}"
style="padding-left:{{datas.componentData.columnNum == 3 ? '0' : '20rpx'}}"
>
<view class="follower-num" style="color:{{datas.componentData['followerColor']?datas.componentData['followerColor']:'#ff9933'}};"> <view class="follower-num" style="color:{{datas.componentData['followerColor']?datas.componentData['followerColor']:'#ff9933'}};">
{{items!=null?Number(items['totalCollectionCount']) ? Number(items['totalCollectionCount']) : 0:0}} {{items!=null? items['totalCollectionCount']:0}}
</view> </view>
<view class="follower-text">关注人数</view> <view class="follower-text">关注人数</view>
</view> </view>
...@@ -59,8 +89,8 @@ ...@@ -59,8 +89,8 @@
<view class="Sold"> <view class="Sold">
<text wx:if="{{datas.componentData['alSaleShow']}}">已售{{items!=null ? items['totalSalesCount'] :0}}件</text> <text wx:if="{{datas.componentData['alSaleShow']}}">已售{{items!=null ? items['totalSalesCount'] :0}}件</text>
<text wx:if="{{datas.componentData['alSaleShow'] && datas.componentData['collectShow']}}">/</text> <text wx:if="{{datas.componentData['alSaleShow'] && datas.componentData['collectShow']}}">/</text>
<text wx:if="{{datas.componentData['collectShow']}}">剩余{{items!=null && items['qty']!=undefined ? (Number(items['qty']) > 0 ? Number(items['qty'] ): items.oversoldFlag==1?'数量充足':'数量不足') : ''}}</text> <text wx:if="{{datas.componentData['collectShow']}}">剩余{{items!=null && items['qty']!=undefined ? (items['qty'] > 0 ? items['qty']: items.oversoldFlag==1?'数量充足':'数量不足') : ''}}<text wx:if="{{items!=null && (items['qty'] ? items['qty'] >= 0 : items['saleQty'] >= 0) && items.oversoldFlag!=1}}">件</text>
<text wx:if="{{items!=null && (Number(items['qty']) ? Number(items['qty']) >= 0 : Number(items['saleQty']) >= 0)}}">件</text> </text>
</view> </view>
<!-- 标签 --> <!-- 标签 -->
<view class="marketing flex" wx:if="{{datas.componentData['marketingTag']&&datas.componentData['marketingStyle']==0&&items.marketingTag}}"> <view class="marketing flex" wx:if="{{datas.componentData['marketingTag']&&datas.componentData['marketingStyle']==0&&items.marketingTag}}">
...@@ -88,21 +118,25 @@ ...@@ -88,21 +118,25 @@
￥{{items['minGoodsSuggestedRetailPrice']}} ￥{{items['minGoodsSuggestedRetailPrice']}}
</text> </text>
</view> </view>
<view class="vipPrice2 flex"> <view class="vipPrice2 flex" wx:if="{{datas.componentData.vipPrice}}">
<view class="left" wx:if="{{showVipPrice(index)==true}}"> <view class="left" wx:if="{{items.showVipPrice==true}}">
￥{{Number(items['minPriceAfterRecommendedCardPriceTable']).toFixed(2)}} ￥{{items['minPriceAfterRecommendedCardPriceTable']}}
</view> </view>
<view class="vipIcon line-clamp1" wx:if="{{showVipTag(index)==true}}"> <view class="vipIcon line-clamp1" wx:if="{{items.showVipTag==true}}">
{{items["recommendedCardMinPricePriceTableName"]}} {{items["recommendedCardMinPricePriceTableName"]}}
</view> </view>
</view> </view>
</view> </view>
<!-- 收益样式一 --> <!-- 收益样式一 -->
<block class="" wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}"> <block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
<view class="showCommission" wx:if="{{datas.componentData.commissionStyle==0}}"> <view
<view class="commission-box"> class="showCommission"
style="color:{{datas.componentData.commissionColor}};border-color:{{datas.componentData.commissionColor}};"
wx:if="{{datas.componentData.commissionStyle==0}}"
>
<view class="commission-box" style="background-color:{{datas.componentData.commissionBgColor}}">
<text>收益</text> <text>收益</text>
<text>￥{{Number(items['minProductGoodsCommission']).toFixed(2)}}</text> <text>￥{{items['minProductGoodsCommission']}}</text>
</view> </view>
</view> </view>
</block> </block>
...@@ -115,7 +149,7 @@ ...@@ -115,7 +149,7 @@
已售罄 已售罄
</view> </view>
<view wx:if="{{(items&&items.totalQty-0>0||items&&items.oversoldFlag==1)&& datas.componentData['paynow']}}"> <view wx:if="{{(items&&items.totalQty-0>0||items&&items.oversoldFlag==1)&& datas.componentData['paynow']}}">
<text wx:if="{{datas.componentData.btnType<6}}" class="buy-now-icon iconfont-common {{datas.componentData.btnIcon}}"></text> <text wx:if="{{datas.componentData.btnType<6}}" style="color:{{datas.componentData.btnColor}}" class="buy-now-icon iconfont-common {{datas.componentData.btnIcon}}"></text>
<view <view
wx:else wx:else
class="buy-now" class="buy-now"
...@@ -139,20 +173,21 @@ ...@@ -139,20 +173,21 @@
</block> </block>
<!-- 收益样式二 --> <!-- 收益样式二 -->
<block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}"> <block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
<view class="showCommissionTwo flex" wx:if="{{datas.componentData.commissionStyle==1}}"> <view
<view class="commission-box"> class="showCommissionTwo flex"
<text class="iconfont-common common-iconfenxiang"> wx:if="{{datas.componentData.commissionStyle==1}}"
赚￥ style="color:{{datas.componentData.commissionColor}};border-color:{{datas.componentData.commissionColor}};"
<text style="font-size:32rpx;"> >
{{Number(items['minProductGoodsCommission']).toFixed(2)}} <view class="commission-box" style="background-color:{{datas.componentData.commissionBgColor}}">
</text> <text class="iconfont-common common-iconfenxiang"></text>
</text> <text style="padding:0 8rpx;">赚￥</text>
<text style="font-size:32rpx;">{{items['minProductGoodsCommission']}}</text>
</view> </view>
</view> </view>
</block> </block>
</view> </view>
<!-- 商户入口二 --> <!-- 商户入口二 -->
<view class="merchantsEntrance flex" wx:if="{{datas.componentData.merchantsEntrance&&datas.componentData.merchantsEntranceType==1}}"> <view class="merchantsEntrance flex" wx:if="{{datas.componentData.merchantsEntrance&&datas.componentData.merchantsEntranceType==1 && datas.componentData.style!='heap'}}">
<view class="left flex" wx:if="{{items!=null}}"> <view class="left flex" wx:if="{{items!=null}}">
<view class="logo"> <view class="logo">
<image mode='widthFix' src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/ppefWK8BS6.png?x-oss-process=image/resize,limit_1,w_150,h_150" /> <image mode='widthFix' src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/ppefWK8BS6.png?x-oss-process=image/resize,limit_1,w_150,h_150" />
......
static/nativeComponents/GoodsList/GoodsItem/index.wxss
@import "/static/font/common_icon.wxss";
.flex{ .flex{
display: flex; display: flex;
} }
...@@ -6,15 +7,43 @@ ...@@ -6,15 +7,43 @@
} }
image{ image{
width: 100%; width: 100%;
display: block;
} }
.goodsItem{ .goodsItem{
margin-bottom: var(--proGap2); margin-bottom: var(--proGap2);
white-space: initial;
} }
.goods-item-child { .goods-item-child {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background: #ffffff; background: #ffffff;
} }
.goodsRowList .goods-item-child{
display: flex;
align-items: flex-start;
}
.goodsRowList .goods-item-child .imgBox{
width: auto;
width: 180rpx;
height: 180rpx;
margin: 20rpx;
overflow: hidden;
border-radius: 12rpx;
-webkit-border-radius: 12rpx;
-moz-border-radius: 12rpx;
-ms-border-radius: 12rpx;
-o-border-radius: 12rpx;
}
.goodsRowList .goods-item-child .info{
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-around;
}
.goodsHeapItem{
width: 100%;
}
.merchantsEntrance{ .merchantsEntrance{
padding: 8rpx 20rpx; padding: 8rpx 20rpx;
} }
...@@ -37,13 +66,17 @@ image{ ...@@ -37,13 +66,17 @@ image{
position: relative; position: relative;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
margin: 0 auto 20rpx; margin: 0 auto;
} }
.goodsPicture{ .goodsPicture{
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
.goodsPicture .productImgUrl{
width: 100%;
height: 100%;
}
.goodsPicture .saleWay{ .goodsPicture .saleWay{
position: absolute; position: absolute;
bottom: 0; bottom: 0;
...@@ -51,6 +84,8 @@ image{ ...@@ -51,6 +84,8 @@ image{
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
z-index: 2;
color: #fff;
} }
.goodsPicture .saleWay .saleWayBg{ .goodsPicture .saleWay .saleWayBg{
background: #eee; background: #eee;
...@@ -61,6 +96,14 @@ image{ ...@@ -61,6 +96,14 @@ image{
bottom: 0; bottom: 0;
opacity: 0.5; opacity: 0.5;
} }
.goodsPicture .saleWay .saleTime{
position: relative;
z-index: 2;
padding: 4rpx 0;
}
.goodsPicture .saleWay .saleTime text{
color: #fff;
}
.goodsPicture .angleSign{ .goodsPicture .angleSign{
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -117,6 +160,7 @@ image{ ...@@ -117,6 +160,7 @@ image{
color: #999; color: #999;
text-align: center; text-align: center;
height: 70rpx; height: 70rpx;
border-left: 1px solid #999;
} }
.info .follower-wrap .follower-num{ .info .follower-wrap .follower-num{
text-align: center; text-align: center;
...@@ -204,7 +248,7 @@ image{ ...@@ -204,7 +248,7 @@ image{
color: #999; color: #999;
} }
.Sold text{ .Sold text{
font-size: 0.7em; font-size: 24rpx;
} }
.buy-now { .buy-now {
color: #ffffff; color: #ffffff;
...@@ -230,6 +274,28 @@ image{ ...@@ -230,6 +274,28 @@ image{
bottom: 0; bottom: 0;
font-size: 36rpx; font-size: 36rpx;
} }
.showCommission {
width: auto;
display: inline-block;
margin-top: 8rpx;
border: 1px solid transparent;
border-radius: 12rpx;
font-size: 10px;
overflow: hidden;
-webkit-border-radius: 12rpx;
-moz-border-radius: 12rpx;
-ms-border-radius: 12rpx;
-o-border-radius: 12rpx;
}
.showCommission .commission-box {
box-sizing: border-box;
padding: 0 10rpx;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.showCommissionTwo { .showCommissionTwo {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
......
static/nativeComponents/GoodsList/heapItem/index.js 0 → 100644
import TouchEvent from "./utils/touchEvent";
const componentOptions = {
// 组件选项
options: {
multipleSlots: true
},
behaviors: [],
properties: {
datas: {
type: Object
}
},
// 组件数据
data: {
isPageHidden: false, // 页面是否处于隐藏状态
isLoading: false,
swiperCurIndex: 0,
slideClass: "",
lockSwipe: false
},
// 数据监听器
observers: {},
// 组件生命周期
lifetimes: {
created() {
new TouchEvent(this, "touchCard", {
swipe: evt => {
//在touch结束触发，evt.direction代表滑动的方向 ['Up','Right','Down','Left']
if (evt.direction === "Left") this.next(evt);
if (evt.direction === "Right") this.prev(evt);
}
});
},
attached() {}
},
// 组件方法
methods: {
next(e) {
if (this.data.lockSwipe) return;
this.data.lockSwipe = true;
if (-this.data.swiperCurIndex >= this.data.datas.componentData.goodsList.length - 1) {
return (this.data.lockSwipe = false);
}
const index = e.currentTarget.dataset["index"];
this.setData(
{ ["datas.componentData.goodsList[" + index + "].slideClass"]: " ani-slide-up" },
() => {
this.setData({
swiperCurIndex: --this.data.swiperCurIndex
});
}
);
setTimeout(() => {
this.data.lockSwipe = false;
this.setData({
["datas.componentData.goodsList[" + index + "].slideClass"]: ""
});
}, 590);
},
prev(e) {
const index = e.currentTarget.dataset["index"] - 1;
if (this.data.lockSwipe || index < 0) return;
this.data.lockSwipe = true;
this.setData({
["datas.componentData.goodsList[" + index + "].slideClass"]: " ani-slide-down",
swiperCurIndex: ++this.data.swiperCurIndex
});
setTimeout(() => {
this.data.lockSwipe = false;
this.setData({
["datas.componentData.goodsList[" + index + "].slideClass"]: ""
});
}, 590);
}
},
definitionFilter() {},
// 页面生命周期
pageLifetimes: {
// 页面被展示
show() {
const { isPageHidden } = this.data;
// show事件发生前，页面不是处于隐藏状态时
if (!isPageHidden) {
return;
}
// 重新执行定时器等操作
},
// 页面被隐藏
hide() {
this.setData({
isPageHidden: true
});
// 清除定时器等操作
},
// 页面尺寸变化时
resize() {}
}
};
Component(componentOptions);
static/nativeComponents/GoodsList/heapItem/index.json 0 → 100644
{
"component": true,
"usingComponents": {
"goods-item": "../GoodsItem/index"
}
}
static/nativeComponents/GoodsList/heapItem/index.wxml 0 → 100644
<view class="container center">
<view class="card-swiper">
<view
wx:for="{{datas.componentData.goodsList}}"
wx:key="index"
data-index="{{index}}"
class="{{'card-swiper-item curdistance' + (swiperCurIndex + index) + (!!item.slideClass? item.slideClass: '')}}"
bindtap="next"
catchtouchstart="touchCard.start"
catchtouchmove="touchCard.move"
catchtouchend="touchCard.end"
catchtouchcancel="touchCard.cancel"
>
<goods-item
style="width:100%"
datas="{{datas}}"
items="{{datas.componentData.goodsList[index]}}"
indexs="{{index}}"
></goods-item>
</view>
</view>
</view>
static/nativeComponents/GoodsList/heapItem/index.wxss 0 → 100644
.container{
width: 100%;
height: 200rpx;
padding: 0 0 20rpx;
}
/**index.wxss**/
.card-swiper{
position: relative;
width: 100%;
height: 100%;
color: #666;
font-size: 28rpx;
}
.card-swiper-item{
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
width: 92%;
transition: all .3s ease-out;
z-index: 0;
display: none;
overflow: hidden;
}
.card-swiper .card-swiper-item.curdistance0{
z-index: 10;
display: flex;
}
.card-swiper .card-swiper-item.curdistance1{
display: flex;
z-index: 9;
transform: scale(.95);
opacity: .7;
left: 40rpx;
}
.card-swiper .card-swiper-item.curdistance2{
display: flex;
z-index: 8;
transform: scale(.9);
opacity: .4;
left: 80rpx;
}
.ani-slide-up{
display: flex;
animation: slideUp .6s ease-out;
z-index: 11;
/* transform: rotate(25deg); */
}
.ani-slide-down{
display: flex;
animation: slideUp .6s ease-in;
animation-direction: reverse;
}
@keyframes slideUp{
0% {
}
70% {
opacity: 1;
}
100% {
transform: translateX(-1000rpx);
opacity: 0;
-webkit-transform: translateX(-1000rpx);
-moz-transform: translateX(-1000rpx);
-ms-transform: translateX(-1000rpx);
-o-transform: translateX(-1000rpx);
}
}
\ No newline at end of file
static/nativeComponents/GoodsList/heapItem/utils/touchEvent.js 0 → 100644
var defaultOption = {
touchStart: function () { },
touchMove: function () { },
touchEnd: function () { },
touchCancel: function () { },
multipointStart: function () { },
multipointEnd: function () { },
tap: function () { },
doubleTap: function () { },
longTap: function () { },
singleTap: function () { },
rotate: function () { },
pinch: function () { },
pressMove: function () { },
swipe: function () { }
}
export default class YrobotTouch {
constructor(pageOBJ, name, option = {}) {
this.preV = { x: null, y: null };
this.pinchStartLen = null;
this.scale = 1;
this.isDoubleTap = false;
this.delta = null;
this.last = null;
this.now = null;
this.tapTimeout = null;
this.singleTapTimeout = null;
this.longTapTimeout = null;
this.swipeTimeout = null;
this.x1 = this.x2 = this.y1 = this.y2 = null;
this.preTapPosition = { x: null, y: null };
this.lastZoom = 1;
this.tempZoom = 1;
try {
if (this._checkBeforeCreate(pageOBJ, name)) {
this._name = name
this._option = { ...defaultOption, ...option }
pageOBJ[name] = this
this._bindFunc(pageOBJ)
}
} catch (error) {
console.error(error)
}
}
_checkBeforeCreate(pageOBJ, name) {
if (!pageOBJ || !name) {
throw new Error('YrobotTouch实例化时，必须传入page对象和引用名')
return false
}
if (pageOBJ[name]) {
throw new Error('YrobotTouch实例化error： ' + name + ' 已经存在page中')
return false
}
return true
}
_bindFunc(pageOBJ) {
let funcNames = ['start', 'move', 'end', 'cancel']
for (let funcName of funcNames)
pageOBJ[this._name + '.' + funcName] = this[funcName].bind(this)
}
start(evt) {
if (!evt.touches) return;
this.now = Date.now();
this.x1 = evt.touches[0].pageX == null ? evt.touches[0].x : evt.touches[0].pageX;
this.y1 = evt.touches[0].pageY == null ? evt.touches[0].y : evt.touches[0].pageY;
this.delta = this.now - (this.last || this.now);
this._option.touchStart(evt);
if (this.preTapPosition.x !== null) {
this.isDoubleTap = (this.delta > 0 && this.delta <= 250 && Math.abs(this.preTapPosition.x - this.x1) < 30 && Math.abs(this.preTapPosition.y - this.y1) < 30);
}
this.preTapPosition.x = this.x1;
this.preTapPosition.y = this.y1;
this.last = this.now;
let preV = this.preV,
len = evt.touches.length;
if (len > 1) {
this._cancelLongTap();
this._cancelSingleTap();
let otx = evt.touches[1].pageX == null ? evt.touches[1].x : evt.touches[1].pageX;
let oty = evt.touches[1].pageY == null ? evt.touches[1].y : evt.touches[1].pageY;
let v = { x: otx - this.x1, y: oty - this.y1 };
preV.x = v.x;
preV.y = v.y;
this.pinchStartLen = getLen(preV);
this._option.multipointStart(evt);
}
this.longTapTimeout = setTimeout(function () {
evt.type = "longTap";
this._option.longTap(evt);
}.bind(this), 750);
}
move(evt) {
if (!evt.touches) return;
let preV = this.preV,
len = evt.touches.length,
currentX = evt.touches[0].pageX == null ? evt.touches[0].x : evt.touches[0].pageX,
currentY = evt.touches[0].pageY == null ? evt.touches[0].y : evt.touches[0].pageY;
this.isDoubleTap = false;
if (len > 1) {
let otx = evt.touches[1].pageX == null ? evt.touches[1].x : evt.touches[1].pageX;
let oty = evt.touches[1].pageY == null ? evt.touches[1].y : evt.touches[1].pageY;
let v = { x: otx - currentX, y: oty - currentY };
if (preV.x !== null) {
if (this.pinchStartLen > 0) {
evt.singleZoom = getLen(v) / this.pinchStartLen;
evt.zoom = evt.singleZoom * this.lastZoom;
this.tempZoom = evt.zoom;
evt.type = "pinch";
this._option.pinch(evt);
}
evt.angle = getRotateAngle(v, preV);
evt.type = "rotate";
this._option.rotate(evt);
}
preV.x = v.x;
preV.y = v.y;
} else {
if (this.x2 !== null) {
evt.deltaX = currentX - this.x2;
evt.deltaY = currentY - this.y2;
} else {
evt.deltaX = 0;
evt.deltaY = 0;
}
this._option.pressMove(evt);
}
this._option.touchMove(evt);
this._cancelLongTap();
this.x2 = currentX;
this.y2 = currentY;
if (len > 1) {
// evt.preventDefault();
}
}
end(evt) {
if (!evt.changedTouches) return;
this._cancelLongTap();
let self = this;
evt.direction = this._swipeDirection(this.x1, this.x2, this.y1, this.y2); //在结束钩子都加入方向判断，但触发swipe瞬时必须位移大于30
if (evt.touches.length < 2) {
this.lastZoom = this.tempZoom;
this._option.multipointEnd(evt);
}
this._option.touchEnd(evt);
//swipe
if ((this.x2 && Math.abs(this.x1 - this.x2) > 30) ||
(this.y2 && Math.abs(this.y1 - this.y2) > 30)) {
// evt.direction = this._swipeDirection(this.x1, this.x2, this.y1, this.y2);
this.swipeTimeout = setTimeout(function () {
evt.type = "swipe";
self._option.swipe(evt);
}, 0)
} else {
this.tapTimeout = setTimeout(function () {
evt.type = "tap";
self._option.tap(evt);
// trigger double tap immediately
if (self.isDoubleTap) {
evt.type = "doubleTap";
self._option.doubleTap(evt);
clearTimeout(self.singleTapTimeout);
self.isDoubleTap = false;
}
}, 0)
if (!self.isDoubleTap) {
self.singleTapTimeout = setTimeout(function () {
self._option.singleTap(evt);
}, 250);
}
}
this.preV.x = 0;
this.preV.y = 0;
this.scale = 1;
this.pinchStartLen = null;
this.x1 = this.x2 = this.y1 = this.y2 = null;
}
cancel(evt) {
clearTimeout(this.singleTapTimeout);
clearTimeout(this.tapTimeout);
clearTimeout(this.longTapTimeout);
clearTimeout(this.swipeTimeout);
this._option.touchCancel(evt);
}
_cancelLongTap() {
clearTimeout(this.longTapTimeout);
}
_cancelSingleTap() {
clearTimeout(this.singleTapTimeout);
}
_swipeDirection(x1, x2, y1, y2) {
return Math.abs(x1 - x2) >= Math.abs(y1 - y2) ? (x1 - x2 > 0 ? 'Left' : 'Right') : (y1 - y2 > 0 ? 'Up' : 'Down')
}
destroy() {
if (this.singleTapTimeout) clearTimeout(this.singleTapTimeout);
if (this.tapTimeout) clearTimeout(this.tapTimeout);
if (this.longTapTimeout) clearTimeout(this.longTapTimeout);
if (this.swipeTimeout) clearTimeout(this.swipeTimeout);
this._option.rotate = null;
this._option.touchStart = null;
this._option.multipointStart = null;
this._option.multipointEnd = null;
this._option.pinch = null;
this._option.swipe = null;
this._option.tap = null;
this._option.doubleTap = null;
this._option.longTap = null;
this._option.singleTap = null;
this._option.pressMove = null;
this._option.touchMove = null;
this._option.touchEnd = null;
this._option.touchCancel = null;
this.preV = this.pinchStartLen = this.scale = this.isDoubleTap = this.delta = this.last = this.now = this.tapTimeout = this.singleTapTimeout = this.longTapTimeout = this.swipeTimeout = this.x1 = this.x2 = this.y1 = this.y2 = this.preTapPosition = this.rotate = this.touchStart = this.multipointStart = this.multipointEnd = this.pinch = this.swipe = this.tap = this.doubleTap = this.longTap = this.singleTap = this.pressMove = this.touchMove = this.touchEnd = this.touchCancel = null;
return null;
}
}
function getLen(v) {
return Math.sqrt(v.x * v.x + v.y * v.y);
}
function dot(v1, v2) {
return v1.x * v2.x + v1.y * v2.y;
}
function getAngle(v1, v2) {
let mr = getLen(v1) * getLen(v2);
if (mr === 0) return 0;
let r = dot(v1, v2) / mr;
if (r > 1) r = 1;
return Math.acos(r);
}
function cross(v1, v2) {
return v1.x * v2.y - v2.x * v1.y;
}
function getRotateAngle(v1, v2) {
let angle = getAngle(v1, v2);
if (cross(v1, v2) > 0) {
angle *= -1;
}
return angle * 180 / Math.PI;
}
\ No newline at end of file
static/nativeComponents/GoodsList/index.json
{ {
"component": true, "component": true,
"usingComponents": { "usingComponents": {
"goods-item":"./GoodsItem/index" "goods-item":"./GoodsItem/index",
"waterfall-flow":"../module/WaterfallFlow/index",
"heap-item":"./heapItem/index"
} }
} }
static/nativeComponents/GoodsList/index.wxml
<!-- 商品列表组件 --> <!-- 商品列表组件 -->
<view class="goodsList"> <view class="goodsList" style="padding-top:{{datas.componentData.paddingList[0].value*2}}rpx;padding-bottom:{{datas.componentData.paddingList[1].value*2}}rpx;padding-left:{{datas.componentData.paddingList[2].value*2}}rpx;padding-right:{{datas.componentData.paddingList[3].value*2}}rpx;">
<view class="list-wrap heap-wrap" style="background-color:{{datas.componentData['heapBgColorShow'] ? datas.componentData['heapBgColor'] : ''}};border-radius:{{datas.componentData['cardBorderRadius']*2}}rpx;"> <view class="list-wrap heap-wrap" style="background-color:{{datas.componentData['heapBgColorShow'] ? datas.componentData['heapBgColor'] : ''}};border-radius:{{datas.componentData['cardBorderRadius']*2}}rpx;">
<!-- 头部 --> <!-- 头部 -->
<view class="tops flex" style="padding:{{(datas.componentData['titleIcon'] || (datas.componentData['moreShow'] && datas.componentData.moreButtonSite=='top')) ?'0rpx 0rpx 0rpx 10rpx' : ''}};margin-bottom:{{datas.componentData['titleCardGap']*2}}rpx"> <view class="tops flex" style="padding:{{(datas.componentData['titleIcon'] || (datas.componentData['moreShow'] && datas.componentData.moreButtonSite=='top')) ?'0rpx 0rpx 0rpx 10rpx' : ''}};margin-bottom:{{datas.componentData['titleCardGap']*2}}rpx">
<view class="left flex"> <view class="left flex">
<view class="img" wx:if="{{datas.componentData['titleIcon']}}"> <view class="img" wx:if="{{titleIcon}}">
<image mode="widthFix" src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/ppefWK8BS6.png?x-oss-process=image/resize,limit_1,w_150,h_150" /> <image mode="widthFix" src="{{titleIcon}}" />
</view> </view>
<view class="title">{{datas.componentData['titles']}}</view> <view class="title">{{datas.componentData['titles']}}</view>
</view> </view>
...@@ -23,17 +23,72 @@ ...@@ -23,17 +23,72 @@
<view <view
wx:for="{{datas.componentData.goodsList}}" wx:for="{{datas.componentData.goodsList}}"
wx:key="index" wx:key="index"
class="item" class="goods-item"
style="width:{{100/datas.componentData.columnNum}}%;padding-left:{{datas.componentData.proGap*2}}rpx" style="width:{{100/datas.componentData.columnNum}}%;padding-left:{{datas.componentData.proGap*2}}rpx"
> >
<goods-item <goods-item
class="goodsItem"
datas="{{datas}}" datas="{{datas}}"
items="{{datas.componentData.goodsList[index]}}" items="{{datas.componentData.goodsList[index]}}"
indexs="{{index}}" indexs="{{index}}"
></goods-item> ></goods-item>
</view> </view>
</view> </view>
<!-- 横向滚动 -->
<view class="goods-across" wx:elif="{{datas.componentData.style==='across'}}">
<view class="prev-btn">
<text class="iconfont-common common-iconyoujiantou"></text>
</view>
<view class="next-btn">
<text class="iconfont-common common-iconyoujiantou"></text>
</view>
<view
wx:for="{{datas.componentData.goodsList}}"
wx:key="index"
class="goods-item"
style="width:{{100/datas.componentData.columnNum}}%;margin-right:{{datas.componentData.proGap*2}}rpx"
>
<goods-item
datas="{{datas}}"
items="{{datas.componentData.goodsList[index]}}"
indexs="{{index}}"
></goods-item>
</view>
</view>
<!-- 瀑布流 -->
<view wx:if="{{datas.componentData.style==='waterfall'}}">
<waterfall-flow
generic:defaultCom="goods-item"
id="waterfallFlow"
note="{{datas.componentData.goodsList}}"
datas="{{datas}}"
padding="{{datas.componentData.proGap}}"
wx:if="{{datas.componentData.goodsList}}"
></waterfall-flow>
</view>
<!-- 横向列表 -->
<view
class="goods goods-rowList"
wx:elif="{{datas.componentData.style==='rowList'}}"
style="margin-left:{{-datas.componentData.proGap*2}}rpx;"
>
<view
wx:for="{{datas.componentData.goodsList}}"
wx:key="index"
class="goods-item"
style="width:{{100/datas.componentData.columnNum}}%;padding-left:{{datas.componentData.proGap*2}}rpx"
>
<goods-item
datas="{{datas}}"
items="{{datas.componentData.goodsList[index]}}"
indexs="{{index}}"
></goods-item>
</view>
</view>
<!-- 堆叠卡片 -->
<view class="goods-heap-Item" wx:if="{{datas.componentData.style==='heap'}}">
<heap-item datas="{{datas}}"></heap-item>
</view>
</view> </view>
</view> </view>
static/nativeComponents/GoodsList/index.wxss
@import "/static/font/common_icon.wxss";
.flex{ .flex{
display: flex; display: flex;
} }
...@@ -11,6 +12,9 @@ image{ ...@@ -11,6 +12,9 @@ image{
.goodsList .heap-wrap{ .goodsList .heap-wrap{
padding: 20rpx; padding: 20rpx;
} }
.goods-item{
box-sizing: border-box;
}
.tops{ .tops{
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -49,6 +53,35 @@ image{ ...@@ -49,6 +53,35 @@ image{
.goodsItem-list{ .goodsItem-list{
flex-wrap: wrap; flex-wrap: wrap;
} }
.goodsItem-list .item{ .goodsItem-list .goods-item{
box-sizing: border-box;
}
.goods-across{
overflow-y: hidden;
overflow-X: auto;
white-space: nowrap;
padding-bottom: 10rpx;
display: flex;
align-items: flex-start;
}
.goods-across .prev-btn,.goods-across .next-btn{
position: absolute;
top: 50%;
z-index: 99;
opacity: 0.5;
}
.goods-across .prev-btn text,.goods-across .next-btn text{
font-size: 60rpx;
}
.goods-across .prev-btn{
left: 10px;
transform: rotate(180deg);
}
.goods-across .next-btn{
right: 10px;
}
.goods-across .goods-item{
flex-shrink: 0;
display: inline-block;
box-sizing: border-box; box-sizing: border-box;
} }
\ No newline at end of file
static/nativeComponents/defaultCom/index.js 0 → 100644
const componentOptions = {
// 组件选项
options: {
multipleSlots: true
},
behaviors: [],
properties: {
items: {
type:Object
}
},
// 组件数据
data: {
isPageHidden: false // 页面是否处于隐藏状态
},
// 数据监听器
observers: {},
// 组件方法
methods: {
init() {}
},
// 组件生命周期
lifetimes: {
created() {},
attached() {
this.init();
},
ready() {},
moved() {},
detached() {}
},
definitionFilter() {},
// 页面生命周期
pageLifetimes: {
// 页面被展示
show() {
const { isPageHidden } = this.data;
// show事件发生前，页面不是处于隐藏状态时
if (!isPageHidden) {
return;
}
// 重新执行定时器等操作
},
// 页面被隐藏
hide() {
this.setData({
isPageHidden: true
});
// 清除定时器等操作
},
// 页面尺寸变化时
resize() {}
}
};
Component(componentOptions)
static/nativeComponents/defaultCom/index.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
static/nativeComponents/module/WaterfallFlow/index.js
const app = getApp(); const app = getApp();
Component({ Component({
properties: {}, // 启用插槽
options: {
multipleSlots: true
},
properties: {
note: {
type: Array
},
datas: {
type: Object
},
padding: {
type: Number
}
},
lifetimes: { lifetimes: {
created() { created() {
console.log("进入组件created"); console.log("进入组件created");
...@@ -8,157 +22,15 @@ Component({ ...@@ -8,157 +22,15 @@ Component({
}, },
attached() { attached() {
console.log("进入组件attached"); console.log("进入组件attached");
this.initList(); // this.initList();
}, },
ready() { ready() {
console.log("进入组件ready"); console.log("进入组件ready");
this.reLoadPro(); // this.reLoadPro();
} }
}, },
observers: {}, observers: {},
data: { data: {
note: [
{
name: "大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼",
heart_num: "1",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/241f95cad1c8a7863cb5bacd6709c93d71cf5052.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "2",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fattach.bbs.miui.com%2Fforum%2F201407%2F09%2F195336lcyfkff8rw808row.jpg&refer=http%3A%2F%2Fattach.bbs.miui.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701648&t=574800c4e85e1e5437c9a97d6ff8bc54",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "3",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fattach.bbs.miui.com%2Fforum%2F201407%2F09%2F195336lcyfkff8rw808row.jpg&refer=http%3A%2F%2Fattach.bbs.miui.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701648&t=574800c4e85e1e5437c9a97d6ff8bc54",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "4",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1025707121,3229693962&fm=26&gp=0.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "5",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1025707121,3229693962&fm=26&gp=0.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "6",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/241f95cad1c8a7863cb5bacd6709c93d71cf5052.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "7",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/241f95cad1c8a7863cb5bacd6709c93d71cf5052.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "8",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3111609385,453132559&fm=26&gp=0.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "9",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/241f95cad1c8a7863cb5bacd6709c93d71cf5052.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "10",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fattach.bbs.miui.com%2Fforum%2F201403%2F02%2F092241w9f4vaz8peovfe91.jpg&refer=http%3A%2F%2Fattach.bbs.miui.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701705&t=f7e3d83f199d4aac9b7d6ef3ea72cff1",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "11",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fattach.bbs.miui.com%2Fforum%2F201403%2F02%2F092241w9f4vaz8peovfe91.jpg&refer=http%3A%2F%2Fattach.bbs.miui.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701705&t=f7e3d83f199d4aac9b7d6ef3ea72cff1",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "12",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fandroid-wallpapers.25pp.com%2Ffs01%2F2014%2F10%2F10%2F2000_d9c1ccb59874db2de2ffccd707ecd997_900x675.jpg&refer=http%3A%2F%2Fandroid-wallpapers.25pp.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701726&t=4b48ead509d1b6e0c8211504635bb854",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "13",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fandroid-wallpapers.25pp.com%2Ffs01%2F2014%2F10%2F10%2F2000_d9c1ccb59874db2de2ffccd707ecd997_900x675.jpg&refer=http%3A%2F%2Fandroid-wallpapers.25pp.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1613701726&t=4b48ead509d1b6e0c8211504635bb854",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
},
{
name: "大脸猫爱吃鱼",
heart_num: "14",
title:
"你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识",
url:
"https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3111609385,453132559&fm=26&gp=0.jpg",
avatar:
"http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg"
}
],
//列数 //列数
waterfallImgCol: 2, waterfallImgCol: 2,
//列高度数组 //列高度数组
...@@ -174,6 +46,8 @@ Component({ ...@@ -174,6 +46,8 @@ Component({
contentList[0] = []; contentList[0] = [];
contentList[1] = []; contentList[1] = [];
this.setData({ contentList }); this.setData({ contentList });
console.log(this.data.note, "-------------------185");
this.reLoadPro();
}, },
async reLoadPro() { async reLoadPro() {
let _this = this; let _this = this;
...@@ -215,11 +89,18 @@ Component({ ...@@ -215,11 +89,18 @@ Component({
imageLoad(ev) { imageLoad(ev) {
let windowWidth = wx.getSystemInfoSync().windowWidth; let windowWidth = wx.getSystemInfoSync().windowWidth;
let src = ev.currentTarget.dataset.src, let src = ev.currentTarget.dataset.src,
width = ev.detail.width, width = ev.detail.width,
height = ev.detail.height; height = ev.detail.height;
let newWidth = parseInt(windowWidth * 0.49); let newWidth = parseInt(windowWidth * 0.49);
let newHeight = parseInt(newWidth / (width / height)); let newHeight = parseInt(newWidth / (width / height));
console.log(width, height,newWidth,newHeight, ev.target.dataset.id, "-----------------------219"); console.log(
width,
height,
newWidth,
newHeight,
ev.target.dataset.id,
"-----------------------219"
);
} }
} }
}); });
static/nativeComponents/module/WaterfallFlow/index.json
{ {
"components":true "component":true,
"componentGenerics": {
"defaultCom": {
"default": "/static/nativeComponents/defaultCom/index"
}
}
} }
\ No newline at end of file
static/nativeComponents/module/WaterfallFlow/index.wxml
<!--瀑布流组件--> <!--瀑布流组件-->
<view class="waterfallFlow"> <view class="waterfallFlow" style="--proGap:{{padding}}rpx">
<view class="container flex"> <view class="container flex">
<view <view
wx:for="{{contentList}}" wx:for="{{contentList}}"
...@@ -13,14 +13,11 @@ ...@@ -13,14 +13,11 @@
wx:key="index1" wx:key="index1"
class="imageItem" class="imageItem"
> >
<image <defaultCom
src="{{item1.url}}" datas="{{datas}}"
mode='widthFix' items="{{item1}}"
bindload="imageLoad" indexs="{{2*index+index1}}"
data-id="{{item1.heart_num}}" ></defaultCom>
/>
<!-- <image src="https://ss2.baidu.com/-vo3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/241f95cad1c8a7863cb5bacd6709c93d71cf5052.jpg" mode='widthFix'></image> -->
<text>{{item1.name}}--{{item1.heart_num}}</text>
</view> </view>
</view> </view>
</view> </view>
......
static/nativeComponents/module/WaterfallFlow/index.wxss
...@@ -4,17 +4,16 @@ image { ...@@ -4,17 +4,16 @@ image {
.flex { .flex {
display: flex; display: flex;
} }
.waterfallFlow{
width: 100vw;
}
.container { .container {
justify-content: space-around; justify-content: space-around;
align-items: flex-start; align-items: flex-start;
} }
.container-item{ .container-item{
width: 49%; width: 50%;
} }
.imageItem{ .container-item:nth-child(2n + 1) {
border: 1px solid #333; padding-right: var(--proGap);
margin-bottom: 10rpx;
} }
.container-item:nth-child(2n + 2) {
padding-left: var(--proGap);
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment