Commit 4a204ee7 by 程默

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

parents 286740db 0b1d1345
......@@ -40,8 +40,11 @@ export default {
// 初始
this.getShopInfo(extConfig);
console.log(this,'this.mpApp')
// 页面配置信息
this.getThemePage(extConfig);
},
methods: {
async setVisible(pageList){
......@@ -99,6 +102,7 @@ export default {
// 设置主题色
themeColor['--main-color']=val.themeColor.mainColor
themeColor['--minor-color']=val.themeColor.minorColor
mpApp.themeColorCallBack(themeColor);
//
console.log(this.mpApp,'mmmmm74',themeColor)
}
......
import { requestPOST, requestGET } from "@/utils/request.js";
// 添加商品
export default {
addCart(data) {
return requestPOST(`${process.env.OLSHOP_URL}/cart/add_item`, data);
},
}
\ No newline at end of file
import { requestPOST } from "@/utils/request.js";
export default {
// 组件查询优惠券列表
queryCouponIdsList(data) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_coupon_detail_by_ids`, data)
},
// 领取优惠券
receive_coupon(params) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/receive_coupon/?couponCode=`+params+``)
},
};
......@@ -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
<!-- 优惠券 -->
<template>
<div class="domin" v-if="showList">
<div class="tops">
<h3 class="line-clamp1">{{datas.componentData['title']}}</h3>
</div>
<!-- 优惠券列表 -->
<div class="couponBg">
<div class="coupon" :class="'coupon'+datas.componentData.style">
<div class="couponList clearfix">
<div
class="item clearfix"
v-for="(item,index) in datas.componentData.couponList"
:key="index"
>
<img
class="img"
:class="'imgWidth'+datas.componentData.style"
:src="datas.componentData.couponStyleList[datas.componentData.style-1]"
alt
/>
<div v-if="datas.componentData.style==1" class="info info1" @click="receiveCoupon(item.couponCode,item)">
<div v-if="item.preferentialType!=1">
<span
class="price"
v-if="(item.preferentialMoney-0)%1==0"
>{{item.preferentialMoney | keepIntNum}}</span>
<span class="price" v-else>{{parseFloat(item.preferentialMoney)}}</span>
<span style="font-size:10px;color:#e74745;"></span>
</div>
<div v-else>
<span
class="price"
v-if="(item.preferentialDiscount-0)%1==0"
>{{item.preferentialDiscount | keepIntNum}}</span>
<span class="price" v-else>{{parseFloat(item.preferentialDiscount)}}</span>
<span style="font-size:10px;color:#e74745;"></span>
</div>
<p class="name line-clamp1">{{item.couponName}}</p>
<p class="describe line-clamp2">{{item.info}}</p>
<p class="btn">立即领取</p>
</div>
<div v-else-if="datas.componentData.style==2" class="info info2" @click="receiveCoupon(item.couponCode,item)">
<p class="name line-clamp1">{{item.couponName}}</p>
<div v-if="item.preferentialType!=1" class="priceItem">
<div
class="price"
:class="{'priceCopy':String(item.preferentialMoney-0).length>3}"
v-if="(item.preferentialMoney-0)%1==0"
>
<span>{{item.preferentialMoney | keepIntNum}}</span>
<span
class="label"
:class="{'labelCopy':String(item.preferentialMoney-0).length>3}"
>
<i></i>
</span>
</div>
<div
class="price"
:class="{'priceCopy':String(item.preferentialMoney-0).length>3}"
v-else
>
<span>{{parseFloat(item.preferentialMoney)}}</span>
<span
class="label"
:class="{'labelCopy':String(item.preferentialMoney-0).length>3}"
>
<i></i>
</span>
</div>
</div>
<div v-else class="priceItem">
<div
class="price"
:class="{'priceCopy':String(item.preferentialDiscount-0).length>3}"
v-if="(item.preferentialDiscount-0)%1==0"
>
<span>{{item.preferentialDiscount | keepIntNum}}</span>
<span
class="label"
:class="{'labelCopy':String(item.preferentialMoney-0).length>3}"
>
<i></i>
</span>
</div>
<div
class="price"
:class="{'priceCopy':String(item.preferentialDiscount-0).length>3}"
v-else
>
<span>{{parseFloat(item.preferentialDiscount)}}</span>
<span
class="label"
:class="{'labelCopy':String(item.preferentialMoney-0).length>3}"
>
<i></i>
</span>
</div>
</div>
<p class="describe line-clamp2">{{item.info}}</p>
</div>
<div v-else-if="datas.componentData.style==3" class="info info3" @click="receiveCoupon(item.couponCode,item)">
<div v-if="item.preferentialType!=1">
<div
class="price"
:class="{'priceCopy':String(item.preferentialMoney-0).length>2}"
v-if="(item.preferentialMoney-0)%1==0"
>
<span style="font-size:10px;"></span>
<span class="isPrice">{{item.preferentialMoney | keepIntNum}}</span>
</div>
<div
class="price"
:class="{'priceCopy':String(item.preferentialMoney-0).length>2}"
v-else
>
<span style="font-size:10px;"></span>
<span class="isPrice">{{parseFloat(item.preferentialMoney)}}</span>
</div>
</div>
<div v-else>
<div
class="price"
:class="{'priceCopy':String(item.preferentialDiscount-0).length>2}"
v-if="(item.preferentialDiscount-0)%1==0"
>
<span class="isPrice">{{item.preferentialDiscount | keepIntNum}}</span>
<span style="font-size:10px;"></span>
</div>
<div
class="price"
:class="{'priceCopy':String(item.preferentialDiscount-0).length>2}"
v-else
>
<span class="isPrice">{{parseFloat(item.preferentialDiscount)}}</span>
<span style="font-size:10px;"></span>
</div>
</div>
<div class="right">
<p class="name line-clamp1">{{item.couponName}}</p>
<p class="btn">立即领取</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import coupon from '@/api/coupon'
export default {
name: "coupon",
props: {
datas: {
type: Object,
default: {
componentData: {
couponList: []
}
}
}
},
data() {
return {
showGetCouponPop: false, //消耗积分领取
usingIntegrals: 0, //使用积分
couponCode: 0, //优惠券code
couItem: "", //当前优惠券
showList: true, //展示优惠券组件
};
},
mounted() {
this.getList();
},
watch:{
// 'datas.componentData.couponList' : function(newVal){
// if(newVal){
// if(newVal.length){
// this.showList=true;
// }else{
// this.showList=false;
// }
// }
// }
},
components: {},
methods: {
getList() {
let query = this.datas.componentData.selectionIds;
coupon.queryCouponIdsList(query).then(res => {
if (res.data.code == 200&&res.data.data.length!=0) {
this.datas.componentData.couponList = res.data.data.filter((item,index)=>{return item.publicFlag != 0});
if(this.datas.componentData.couponList.length==0){
this.showList=false;
}
}else{
this.showList=false;
}
});
},
// 领取优惠券
receiveCoupon(code,item) {
this.usingIntegrals = (item.consumeIntegral - 0).toFixed(0);
this.couponCode = code;
this.couItem = item;
if (item.receiveCostType == 1) {
this.showGetCouponPop = true;
return;
} else {
this.useCoupon(1);
}
// if (!this.$store.state.sessionId) {
// this.toEnvPage();
// return;
// }
// this.usingIntegrals = (item.consumeIntegral - 0).toFixed(0);
// this.couponCode = code;
// this.couItem = item;
// if (item.receiveCostType == 1) {
// // this.showGetCouponPop = true;
// this.$dialog
// .confirm({
// confirmButtonColor:"#CA173B",
// message: `是否消耗${this.usingIntegrals}积分领取`
// })
// .then(() => {
// this.useCoupon(2);
// })
// .catch(() => {
// // on cancel
// });
// return;
// } else {
// this.useCoupon(1);
// }
},
useCoupon(val) {
coupon.receive_coupon(this.couponCode).then(res => {
console.log(res, "cou137");
if (res.data.data == 'true') {
this.couItem.receiveStatus = 1;
if (val == 1) {
wx.showToast({
title:'领取成功',
icon: "success"
})
} else {
let tit = "积分-" + this.usingIntegrals;
wx.showToast({
title:tit,
icon: "success"
})
}
// item.receive=false;
} else {
this.$toast(res.msg);
// item.receive=true;
}
});
},
toEnvPage() {
if (this.isWx()) {
wx.miniProgram.getEnv(res => {
if (res.miniprogram) {
const url = `/pages/login/main?back=${encodeURIComponent(
this.$route.path
)}&params=${JSON.stringify({
productId: this.$route.params.goodsInfo
})}`;
wx.miniProgram.navigateTo({
url: url
});
} else {
let query = {
back: this.$route.path,
productId: this.$route.params.goodsInfo
};
this.$router.push({ name: "login-accountLogin", query });
}
});
} else {
let query = {
back: this.$route.path,
productId: this.$route.params.goodsInfo
};
this.$router.push({ name: "login-accountLogin", query });
}
}
}
};
</script>
<style lang="scss" scoped>
.line-clamp1 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.line-clamp2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
/*清除浮动*/
.clearfix {
zoom: 1;
}
.clearfix:after {
clear: both;
content: ".";
display: block;
width: 0;
height: 0;
visibility: hidden;
}
.domin {
font-size: 16px;
padding: 10px;
.tops {
padding: 0px 0px 10px 10px;
h3 {
font-size: 18px;
color: #333;
}
}
.coupon {
width: 100%;
overflow: hidden;
.couponList {
overflow-x: auto;
white-space: nowrap;
overflow-y: hidden;
.item {
padding: 25px 20px;
display: inline-block;
vertical-align: top;
white-space: initial;
padding-bottom: 40px;
position: relative;
.img {
transform: scale(1.3);
}
.imgWidth1 {
width: 70px;
height: 112px;
}
.imgWidth2 {
width: 76px;
height: 76px;
}
.imgWidth3 {
width: 128px;
height: 64px;
}
.info {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
max-width: 100%;
max-height: 100%;
font-size: 12px;
padding: 20px;
text-align: center;
overflow: hidden;
}
.info1 {
.price {
display: inline-block;
padding: 9px 0;
color: #e74745;
font-weight: bold;
font-size: 16px;
}
.name {
margin-top: 4px;
color: #e74745;
}
.describe {
margin-top: 4px;
}
.btn {
font-size: 12px;
position: absolute;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
color: #e74745;
}
}
.info2 {
color: #fff;
.name {
transform: scale(0.8);
margin-top: 5px;
}
.priceItem {
margin-top: 5px;
line-height: 30px;
}
.price {
display: inline-block;
padding: 2px;
font-size: 29px;
font-weight: bold;
position: relative;
.label {
position: absolute;
bottom: 5px;
font-size: 12px;
// transform:rotateZ(90deg) scale(0.8);
i {
transform: translateX(-10px);
font-style: normal;
}
}
.labelCopy {
right: -12px;
}
}
.priceCopy {
font-size: 24px;
}
.describe {
transform: scale(0.8);
}
}
.info3 {
color: #fff;
height: 60%;
display: flex;
justify-content: space-around;
align-items: center;
.price {
display: inline-block;
font-size: 30px;
}
.priceCopy {
// transform:translateY(-10px);
font-size: 18px;
}
.right {
width: 50%;
padding-bottom: 10px;
.name {
font-size: 16px;
}
.btn {
margin-top: 3px;
background: #fff;
color: #ff6ca2;
}
}
}
}
}
}
.coupon1 {
// height: 160px;
}
.coupon2 {
// height: 134px;
.couponList {
.item {
padding-left: 24px;
}
}
}
.coupon3 {
// height: 100px;
.couponList {
.item {
padding-left: 30px;
}
}
}
}
</style>
<!-- 积分大转盘 -->
<template>
<div class="IntegralTurntable" v-if="isShow == true">
<div class="img" @click="toPrizePage">
<img v-if="datas.componentData.imgUrl" mode="widthFix" :src="datas.componentData.imgUrl" lazy-load alt />
<img
v-else
src="http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/png/2a61b201-4fe3-406b-9d76-9ec606ed08c0.png"
alt
/>
</div>
</div>
</template>
<script type="text/ecmascript-6">
import coupon from '@/api/coupon'
const app = getApp()
export default {
name: "integral-turntable",
props: {
datas: {
type: Object,
default: function() {
return {
id: "",
pageCode: 0,
pageType: 0,
queueNumber: 0,
componentName: "积分大转盘",
componentCode: "Integral-turntable",
code: 3,
componentData: {
imgUrl:
"http://test-bucket-ant.oss-cn-shanghai.aliyuncs.com/product/png/2a61b201-4fe3-406b-9d76-9ec606ed08c0.png",
turntableCode: ""
}
};
}
}
},
data() {
return {
isShow: false,
};
},
components: {},
watch : {
// "datas.componentData._tempData" : function(newVal){
// this.isShow = newVal
// }
},
mounted() {
if (this.render) {
try {
this.$on('getEnvInfo',([val])=>{
console.log(val,'ggggggggggggg',typeof val)
this.api=val;
this.init();
})
} catch (error) {}
} else {
this.isShow=true;
}
},
methods: {
// 初始化--查询列表看活动是否可用
// init() {
// let activityId=this.datas.componentData.turntableCode;
// coupon.queryPrizeFlag({activityId}).then(res=>{
// if(res.data.code==200){
// this.isShow=res.data=='true'?true:false;
// }else{
// this.isShow=true;
// }
// })
// },
// 跳转到大转盘页
toPrizePage() {
let link = `/turntable?turntableCode=${this.datas.componentData.turntableCode}`
app.$themeToLink(link);
},
// toEnvPage() {
// let query = {
// back: this.$route.path,
// };
// this.$router.push({ name: "login-accountLogin", query });
// }
}
};
</script>
<style lang="scss" scoped>
.IntegralTurntable {
.img {
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
max-height: 200px;
img {
width: 100%;
object-fit: cover;
}
}
}
</style>
......@@ -7,7 +7,8 @@ import orderApi from "./api/order"
import promoteApi from "./api/promote";
import indexApi from './api/index'
import { DFSImg } from "@/utils/index";
import { $themeToLink } from "@/utils/mayi"
import { $themeToLink, $themeAddToCard } from "@/utils/mayi";
import shop from "./api/shop";
Vue.config.productionTip = false
App.mpType = 'app'
......@@ -40,11 +41,13 @@ mpApp.footerCallBack = function () { }
// webview变化
mpApp.webviewCallBack = function () { }
mpApp.shareInit = function () {};
mpApp.themeColorCallBack = function () {};
console.log('3555555', wx)
// 全局跳转 data为link对象
mpApp.$themeToLink = $themeToLink
// 全局加入购物车
mpApp.$themeAddToCard = $themeAddToCard
// api
mpApp.goodsApi = goodsApi;
mpApp.orderApi = orderApi;
......@@ -52,6 +55,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"> -->
......@@ -54,8 +54,17 @@
<div v-if="item.componentCode == 'pop-up' && item.componentInfo.visible == 1">
<pop-up :datas="item"></pop-up>
</div>
<div v-if="item.componentCode == 'coupon'">
<coupon :datas="item"></coupon>
</div>
<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
......@@ -86,7 +95,9 @@ import shopPopup from '@/components/basicTool/shop-popup/index.vue'
import text from '@/components/content/text'
import imgText from '@/components/content/imgText'
import videoPlayer from '@/components/content/videoPlayer'
import { setTabBarActive, checkTabbarPage } from "../../utils/mayi.js";
import coupon from '@/components/activity/coupon'
import integralTurntable from '@/components/activity/integralTurntable'
import { setTabBarActive, checkTabbarPage,themeColor } from "../../utils/mayi.js";
const app = getApp();
export default {
......@@ -94,6 +105,10 @@ export default {
return {
pageInfo: {},
pageData: {},
themeColor:{
'--main-color':"",
'--minor-color':"",
}
};
},
components:{
......@@ -105,7 +120,9 @@ export default {
ThemeDataPlant,
'text-text':text,
'img-text':imgText,
videoPlayer
videoPlayer,
coupon,
integralTurntable
},
onShareAppMessage(res) {
let shareVal={};
......@@ -163,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
import cart from "@/api/cart"
// 主题色
export let themeColor = {
"--main-color": "#ffffff",
......@@ -95,6 +96,35 @@ export function $themeToLink(data, option) {
}
}
}
export function $themeAddToCard(item, callback) {
let app = getApp();
let errorMsg = "";
if (item.productNature == 5) {
errorMsg="电子卡券不可加入购物车";
}
if (item.productNature == 3) {
errorMsg="会员卡不可加入购物车";
}
if (item.productNature == 2) {
errorMsg="虚拟商品不可加入购物车";
}
if (errorMsg) {
wx.showToast({
title:errorMsg,
icon: 'none',
});
}
cart
.addCart([
{ productGoodsId: item.minProductGoodsId, qty: item.saleQty }
])
.then(res => {
if (res.data.code == 200) {
wx.showToast({ title: "加入购物车成功", icon: "none" });
}
callback();
});
}
function toPage(backPath, backParams = "") {
wx.navigateTo({
......
......@@ -15,7 +15,8 @@ export async function requestGET(url, options) {
"Shop-Mixid": store.state.mixid,
"Offline-Shop-Code": store.state.offlineShopCode,
"Authorization": wx.getStorageSync('sessionid') || "",
"Location-Id" : wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).systemRegionId : ''
"Region-id" : wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).systemRegionId : '',
"Area-Id": wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).id : '',
// "dubbo-tag": "ljx"
},
success: function (res) {
......@@ -39,7 +40,8 @@ export async function requestPOST(url, options) {
"Authorization": wx.getStorageSync('sessionid') || "",
"Offline-Shop-Code": store.state.offlineShopCode,
"openId": wx.getStorageSync("openid") || '',
"Location-Id" : wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).systemRegionId : ''
"Region-id": wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).systemRegionId : '',
"Area-Id": wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).id : '',
// "dubbo-tag": "ljx"
},
success: function (res) {
......@@ -63,6 +65,8 @@ export function requestPOST1(url, options) {
"Shop-Mixid": store.state.mixid,
Authorization: wx.getStorageSync('sessionid') || "",
"Offline-Shop-Code": store.state.offlineShopCode,
"Region-id": wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).systemRegionId : '',
"Area-Id": wx.getStorageSync('location') ? JSON.parse(wx.getStorageSync('location')).id : '',
// "dubbo-tag": "ljx"
},
success: function (res) {
......
......@@ -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>
......
......@@ -58,8 +58,7 @@
width: 100%;
box-sizing: border-box;
color: white;
/* background-color: var(--main-color); */
background-color: red;
background-color: var(--main-color);
text-align: center;
font-size: 28rpx;
padding: 0 20rpx;
......
......@@ -27,14 +27,14 @@
</view>
<view class="nav-wrap" wx:if="{{navShow && datas.componentData.layoutType == 1}}">
<view class="nav">
<view class="inner-nav" style="left :{{navLeft*2}}rpx;background-color:#f00"></view>
<view class="inner-nav" style="left :{{navLeft*2}}rpx"></view>
</view>
</view>
</view>
<view class="cube3 clearfix" wx:if="{{datas.componentData.layoutType == 2}}" style="background-color:{{datas.componentData.backgroundColor || ''}};border-radius:{{datas.componentData.moduleRadius}}px;">
<swiper indicator-dots="{{true}}" style="height:{{cube3H}}px">
<swiper indicator-dots="{{true}}" indicator-active-color="var(--main-color)" style="height:{{cube3H}}px">
<swiper-item wx:for="{{swiperList}}" style="width:{{swiperItemW}}px">
<view class="cube-item" style="padding-top:{{datas.componentData.lineHeight}}px;padding-bottom:{{datas.componentData.lineHeight}}px;width:{{getColumnWidth}};position:relative" wx:for-item="item1" wx:for="{{item}}" data-item="{{item1}}" bindtap="onclickHandle">
<view style="padding-left:{{getImgSize}}%;padding-right:{{getImgSize}}%">
......
const app = getApp();
const { goodsApi, DFSImg, $themeToLink } = app;
const { goodsApi, DFSImg, $themeToLink, $themeAddToCard } = app;
const componentOptions = {
// 组件选项
options: {
......@@ -86,7 +86,7 @@ const componentOptions = {
if (btnType < 6) {
// 加入购物车
console.log("加入购物车");
// this.$themeAddToCard(item);
$themeAddToCard(this.data.items);
} else {
// 进入确认订单
linkVal = `/order/orderConfirm?productGoodsMixId=${minProductGoodsMixid}&productGoodsId=${minProductGoodsId}&goodsId=${minGoodsId}&qty=1&goodsString=null&source=3`;
......
......@@ -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;
......@@ -250,13 +250,16 @@ align-items: flex-start;
.Sold text{
font-size: 24rpx;
}
.buy-now-icon{
color: var(--main-color);
}
.buy-now {
color: #ffffff;
position: absolute;
right: 0;
bottom: 0;
border-radius: 30rpx;
background-color: #333;
background-color: var(--main-color);
width: 140rpx;
white-space: nowrap;
padding: 8rpx 20rpx;
......
......@@ -226,7 +226,7 @@ const componentOptions = {
item.productImgUrl = DFSImg(item.productImgUrl, 400, 400, 1);
item.minPrice = Number(item.minPrice).toFixed(2);
item.qty = Number(item.qty);
item.saleQty = Number(item.saleQty);
item.saleQty = item.saleQty?Number(item.saleQty):1;
item.totalCollectionCount = Number(item.totalCollectionCount) || 0;
item.minPriceAfterRecommendedCardPriceTable = item.minPriceAfterRecommendedCardPriceTable
? Number(item.minPriceAfterRecommendedCardPriceTable)
......
// 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