Commit 9ff7bcea by liujinsa

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

parents f243cead 451c0cc8
......@@ -39,8 +39,11 @@ export default {
// 初始
this.getShopInfo(extConfig);
console.log(this,'this.mpApp')
// 页面配置信息
this.getThemePage(extConfig);
},
methods: {
//商城配置
......@@ -73,6 +76,7 @@ export default {
// 设置主题色
themeColor['--main-color']=val.themeColor.mainColor
themeColor['--minor-color']=val.themeColor.minorColor
mpApp.themeColorCallBack(themeColor);
//
console.log(this.mpApp,'mmmmm74',themeColor)
}
......
......@@ -18,6 +18,9 @@ console.log(process.env,'-----------------config------')
},
queryLocation(longitude,latitude){
return requestGET(`${process.env.OLSHOP_URL}/operatingArea/query_Location_operating_area_area_list?location=${longitude},${latitude}`)
}
},
get_product_category(data) {
return requestPOST(`${process.env.OLSHOP_URL}/product/get_product_category`, data);
},
}
\ No newline at end of file
......@@ -8,6 +8,7 @@ import promoteApi from "./api/promote";
import indexApi from './api/index'
import { DFSImg } from "@/utils/index";
import { $themeToLink } from "@/utils/mayi"
import shop from "./api/shop";
Vue.config.productionTip = false
App.mpType = 'app'
......@@ -40,6 +41,7 @@ mpApp.footerCallBack = function () { }
// webview变化
mpApp.webviewCallBack = function () { }
mpApp.shareInit = function () {};
mpApp.themeColorCallBack = function () {};
console.log('3555555', wx)
// 全局跳转 data为link对象
......@@ -52,6 +54,32 @@ mpApp.promoteApi = promoteApi;
mpApp.indexApi = indexApi;
mpApp.DFSImg = DFSImg;
mpApp.getThemePage = getThemePage
function getThemePage({mixid,shopid}) {
shop
.themePagesInfo({
shopid,
shopMixId: mixid,
})
.then((response) => {
if (response.data.code == 200) {
let data = response.data.data;
if (Array.isArray(data) && data.length > 0) {
console.log("90", data);
mpApp.globalData.pageList = data;
// app中异步数据回调 底部栏数据
if (mpApp.pageCallBack) {
mpApp.pageCallBack(data);
}
}
}
})
.catch((err) => {});
}
......
<template>
<div class="domain">
<div class="domain" :style="{'--main-color':themeColor['--main-color'],'--minor-color':themeColor['--minor-color']}">
<!-- <view class="ant-daipinglun">1</view> -->
<!-- <goods-list id="goodsList"></goods-list> -->
<!-- <scroll-view @scroll="scrolls" @scrolltolower="scrolltolower" style="height:100vh;overflow-y:auto;" scroll-y="true"> -->
......@@ -60,8 +60,11 @@
<div v-if="item.componentCode == 'integral-turntable'">
<integralTurntable :datas="item"></integralTurntable>
</div>
<div v-if="item.componentCode == 'speedy-nav'">
<speedy-nav :datas="item"></speedy-nav>
</div>
</div>
<bottomCont></bottomCont>
<!-- </scroll-view> -->
<!-- <image
......@@ -94,7 +97,7 @@ import imgText from '@/components/content/imgText'
import videoPlayer from '@/components/content/videoPlayer'
import coupon from '@/components/activity/coupon'
import integralTurntable from '@/components/activity/integralTurntable'
import { setTabBarActive, checkTabbarPage } from "../../utils/mayi.js";
import { setTabBarActive, checkTabbarPage,themeColor } from "../../utils/mayi.js";
const app = getApp();
export default {
......@@ -102,6 +105,10 @@ export default {
return {
pageInfo: {},
pageData: {},
themeColor:{
'--main-color':"",
'--minor-color':"",
}
};
},
components:{
......@@ -173,6 +180,13 @@ export default {
that.init(params);
};
}
if(themeColor['--main-color']!='#ffffff'){
this.themeColor = themeColor
}else {
this.mpApp.themeColorCallBack=(res)=>{
this.themeColor = res
}
}
},
onShow() {
setTabBarActive.bind(this)(checkTabbarPage('/'));
......
......@@ -11,7 +11,8 @@
"goods-search":"/static/nativeComponents/GoodsSearch/index",
"notice":"/static/nativeComponents/Notice/index",
"pop-up":"/static/nativeComponents/PopUp/index",
"share-popup":"/static/nativeComponents/SharePopup/index"
"share-popup":"/static/nativeComponents/SharePopup/index",
"speedy-nav":"/static/nativeComponents/SpeedyNav/index"
},
"enablePullDownRefresh":true
}
\ No newline at end of file
......@@ -216,6 +216,7 @@ Component({
positionCity : obj
})
}
app.getThemePage({ mixid: "antgood", shopid: 67 })
return
}
......@@ -243,11 +244,11 @@ Component({
this.setData({
positionCity: obj
})
app.getThemePage({ mixid: "antgood", shopid: 67 })
return
}
}
this.$mp.page.onReady()
}
......
......@@ -56,7 +56,7 @@
切换到{{ positionCity.regionName }}
</view>
<view class="continue line-clamp1" bindtap="continueBrowser">
继续浏览{{ datas.componentData.designateAreaObj.regionName }}
继续浏览{{ designateAreaObj.regionName }}
</view>
</view>
......
......@@ -16,7 +16,7 @@ image{
.goods-item-child {
position: relative;
overflow: hidden;
background: #ffffff;
background: #fff;
}
.goodsRowList .goods-item-child{
display: flex;
......@@ -88,7 +88,7 @@ align-items: flex-start;
color: #fff;
}
.goodsPicture .saleWay .saleWayBg{
background: #eee;
background: var(--main-color);
position: absolute;
top: 0;
left: 0;
......@@ -256,7 +256,7 @@ align-items: flex-start;
right: 0;
bottom: 0;
border-radius: 30rpx;
background-color: #333;
background-color: var(--main-color);
width: 140rpx;
white-space: nowrap;
padding: 8rpx 20rpx;
......
// static/nativeComponents/SpeedyNav/index.js
const app = getApp();
Component({
/**
* 组件的属性列表
*/
properties: {
datas:{
type : Object
}
},
/**
* 组件的初始数据
*/
data: {
getTypeStyle: 'across',
categoryList : [],
targetShow: true,
loading: false,
getColumnWidth : '',
getStyle : ''
},
ready(){
this.setData({
getTypeStyle: this.data.datas.componentData.typeStyle
})
let arr = ['50%', "33.3%", "25%", "20%", "16.6%"]
this.setData({
getColumnWidth: arr[this.data.datas.componentData.columnNum - 2]
})
if (this.data.datas.componentData.style == 'circle'){
this.setData({
getStyle : '20%'
})
} else if (this.data.datas.componentData.style == 'rect'){
this.setData({
getStyle: '0'
})
} else if (this.data.datas.componentData.style == 'whole-circle'){
this.setData({
getStyle: '50%'
})
}
app.indexApi.get_product_category({
whetherShowSoldOutGoods: null
}).then(res => {
if (res.data.code == 200 && res.data.data.category[0] && res.data.data.category[0].children){
this.setData({
loading : true
})
res.data.data.category[0].children.forEach(item => {
if (item.categoryBigImg) {
item.categoryBigImg = app.DFSImg(item.categoryBigImg)
}
if (item.categoryBigImg) {
item.categoryImgUrl = app.DFSImg(item.categoryImgUrl)
}
this.setData({
categoryList: res.data.data.category[0].children
})
if (this.data.categoryList.length == 0) {
this.setData({
targetShow : false
})
}
})
}
})
},
/**
* 组件的方法列表
*/
methods: {
onclick(e){
let item = e.currentTarget.dataset.item
app.$themeToLink({
type: 1,
link: `/goods/commodityMenu?categoryName=${item.categoryName}&categoryId=${item.id}`
})
}
}
})
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
<!--static/nativeComponents/SpeedyNav/index.wxml-->
<view class="speedy-nav" style="background-color:{{datas.componentData.backgroundColor || ''}}">
<view class="speedy-nav-skeleton skeleton-animate" wx:if="{{getTypeStyle==='across' && !loading}}">
<view wx:for="{{[1,2,3,4]}}" class="speedy-nav-skeleton-item">
<view class="skeleton-blocks"></view>
<view class="skeleton_100 skeleton-title"></view>
</view>
</view>
<view class="goods1 goods1-wibkit" wx:if="{{getTypeStyle == 'across'}}" style="margin-left:{{-datas.componentData.proGap * 2}}rpx;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="prev-btn" wx:if="loading">
<i class="iconfont-common common-iconyoujiantou" style="font-size:30px"></i>
</view>
<view class="next-btn" wx:if="loading">
<i class="iconfont-common common-iconyoujiantou" style="font-size:30px"></i>
</view>
<view class="goods-item" wx:for="{{categoryList}}" style="width:{{getColumnWidth}}" bindtap="onclick" data-item="{{item}}">
<view class="items" style="margin-left:{{datas.componentData.proGap *2}}rpx">
<view class="imgBox slidebox2" style="border-radius:{{getStyle}}">
<image src="{{item.categoryBigImg || item.categoryImgUrl}}"></image>
</view>
<view class="info">
<view class="name line-clamp1" style="color:{{datas.componentData['textColor']}}">{{item.categoryName}}</view>
</view>
</view>
</view>
</view>
<view class="speedy-nav-skeleton skeleton-animate" wx:if="{{getTypeStyle==='list' && !loading}}">
<view wx:for="{{[1,2,3,4,5,6,7,8]}}" class="speedy-nav-skeleton-item">
<view class="skeleton-blocks"></view>
<view class="skeleton_100 skeleton-title"></view>
</view>
</view>
<view class="goods3 goods1-wibkit" wx:if="{{ getTypeStyle==='list' && loading }}" style="display:flex;flex-wrap: wrap;margin-left:{{-datas.componentData.proGap * 2}}rpx;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="goods-item" wx:for="{{categoryList}}" style="width:{{getColumnWidth}}" bindtap="onclick" data-item="{{item}}">
<view class="items" style="margin-left:{{datas.componentData.proGap *2}}rpx">
<view class="imgBox slidebox2" style="border-radius:{{getStyle}}">
<image src="{{item.categoryBigImg || item.categoryImgUrl}}"></image>
</view>
<view class="info">
<view class="name line-clamp1" style="color:{{datas.componentData['textColor']}}">{{item.categoryName}}</view>
</view>
</view>
</view>
</view>
</view>
/* static/nativeComponents/SpeedyNav/index.wxss */
@import "/static/font/common_icon.wxss";
.speedy-nav{
width: 100%;
font-size: 28rpx;
overflow: hidden;
position: relative;
}
.goods1{
overflow-x: auto;
white-space: nowrap;
overflow-y: hidden;
}
.goods1 .goods-item{
display: inline-block;
vertical-align: top;
white-space: initial;
width: 25%;
}
.goods1 .goods-item:last-child .info{
overflow: hidden;
}
.goods1 .slidebox2{
box-sizing: border-box;
-moz-box-sizing: border-box; /* Firefox */
-webkit-box-sizing: border-box; /* Safari */
}
.goods1-wibkit::-webkit-scrollbar {
display: none;
}
.goods{
box-sizing: border-box;
}
.goods1 .imgBox,.goods3 .imgBox{
position: relative;
overflow: hidden;
width: 100%;
height: 0;
padding-bottom: 100%;
margin: 0 auto 10rpx;
background-color: rgb(255, 251, 232);
}
.goods1 .imgBox image, .goods3 .imgBox image{
width: 100%;
height: 100%;
position: absolute;
margin: auto;
top: -9999px;
right: -9999px;
bottom: -9999px;
left: -9999px;
}
.goods2 .goods-item{
flex: 1;
padding-bottom: 60rpx;
}
.goods2 .goods-item .items{
position: relative;
}
.goods2 .goods-item .items .info{
position: absolute;
bottom: -80%;
}
.goods2 .imgBox{
position: relative;
overflow: hidden;
width: 100%;
padding-bottom: 100%;
background-color: rgb(255, 251, 232);
}
.goods2 .imgBox image{
width: 100%;
height: 100%;
position: absolute;
margin: auto;
top: -9999px;
right: -9999px;
bottom: -9999px;
left: -9999px;
}
.info .name{
text-align: center;
margin: 0 -100%;
color: #666;
height: 2em;
line-height: 1em;
white-space: nowrap;
}
/* 骨架屏样式-start */
.skeleton-content{
padding: 0px 16px;
}
.skeleton-title{
height: 16px;
background-color: #f2f3f5;
margin-top: 16px;
}
.skeleton-blocks{
margin-top: 16px;
width: 100%;
padding-top: 70%;
background-color: #f2f3f5;
}
.skeleton-dice{
margin-top: 16px;
width: 30%;
padding-top: 30%;
background-color: #f2f3f5;
}
.skeleton_50{
width: 50%;
}
.skeleton_100{
width: 100%;
}
/* 快捷导航骨架 */
.speedy-nav-skeleton{
width: 100%;
display: flex;
flex-wrap: wrap;
}
.speedy-nav-skeleton-item{
width: 25%;
padding: 16px 10px;
display: flex;
align-items: center;
flex-direction: column;
}
/* 动画 */
.skeleton-animate{
animation: skeleton-blink 1.2s ease-in-out infinite;
}
@keyframes skeleton-blink {
50% {
opacity: 0.6;
}
}
/* 骨架屏样式-end */
/* 左右箭头 */
.prev-btn,.next-btn{
width: 60rpx;
height: 60rpx;
position: absolute;
top: 50%;
margin-top: -30rpx;
z-index: 99;
opacity: 0.3;
}
.common-iconyoujiantou{
text-shadow: -1rpx 1rpx 14rpx #333;
pointer-events: none;
}
.prev-btn{
left: 10rpx;
transform: rotate(180deg);
}
.next-btn{
right: 10rpx;
}
\ No newline at end of file
......@@ -26,7 +26,6 @@
height: 100%;
}
.countDown {
padding: 4rpx 10rpx;
justify-content: flex-end;
font-size: 24rpx;
color: #666;
......
......@@ -96,7 +96,7 @@
}
.goods-item-child .info .allPrice .btn {
font-size: 24rpx;
background: #333;
background: var(--main-color);
padding: 8rpx;
color: #fff;
border-radius: 10rpx;
......
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