Merge branch 'master' of gitee.com:beijing_hongye_huicheng/lilishop-uniapp
# Conflicts: # App.vuemaster
commit
9bfa30f849
10
App.vue
10
App.vue
|
@ -1,3 +1,5 @@
|
|||
|
||||
|
||||
<script>
|
||||
/**
|
||||
* vuex管理登录状态,具体可以参考官方登录模板示例
|
||||
|
@ -6,7 +8,7 @@ import { mapMutations } from "vuex";
|
|||
import APPUpdate from "@/plugins/APPUpdate";
|
||||
import { getClipboardData } from "@/js_sdk/h5-copy/h5-copy.js";
|
||||
import config from "@/config/config";
|
||||
import storage from "@/utils/storage.js";
|
||||
import storage from "@/utils/storage";
|
||||
// 悬浮球
|
||||
|
||||
export default {
|
||||
|
@ -65,14 +67,14 @@ export default {
|
|||
|
||||
onShow() {
|
||||
// #ifndef H5
|
||||
// this.getClipboard();
|
||||
this.getClipboard();
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
console.log(storage.getShow());
|
||||
|
||||
if (storage.getShow()) {
|
||||
if(uni.getSystemInfoSync().platform == 'ios'){
|
||||
this.$u.route("/pages/tabbar/screen/fullScreen");
|
||||
// uni.reLaunch({ url: "/pages/tabbar/screen/fullScreen" });
|
||||
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
|
|
|
@ -1,29 +1,18 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<u-popup
|
||||
class="popup"
|
||||
v-model="buyMask"
|
||||
:height="setup.height"
|
||||
closeable
|
||||
:mode="setup.mode"
|
||||
:border-radius="setup.radius"
|
||||
@close="closeMask()"
|
||||
>
|
||||
<u-popup class="popup" v-model="buyMask" :height="setup.height" closeable :mode="setup.mode"
|
||||
:border-radius="setup.radius" @close="closeMask()">
|
||||
<!-- 商品 -->
|
||||
<view class="goods-box bottom">
|
||||
<view class="goods-header">
|
||||
<view class="goods-img">
|
||||
<u-image
|
||||
width="200rpx"
|
||||
border-radius="20"
|
||||
class="uimage"
|
||||
height="200rpx"
|
||||
:src="selectedSpecImg ? selectedSpecImg : goodsDetail.thumbnail"
|
||||
></u-image>
|
||||
<u-image width="200rpx" border-radius="20" class="uimage" height="200rpx"
|
||||
:src="selectedSpecImg ? selectedSpecImg : goodsDetail.thumbnail"></u-image>
|
||||
</view>
|
||||
<view class="goods-skus">
|
||||
<!-- 有活动商品价格 -->
|
||||
<view class="goods-price" v-if="goodsDetail.promotionPrice && ((isGroup && buyType === 'PINTUAN') || !isGroup)">
|
||||
<view class="goods-price"
|
||||
v-if="goodsDetail.promotionPrice && ((isGroup && buyType === 'PINTUAN') || !isGroup)">
|
||||
<span v-if="goodsDetail.promotionPrice && !pointDetail">
|
||||
¥
|
||||
<span class="goods-price-promotionShow goods-price-bigshow">{{
|
||||
|
@ -46,7 +35,24 @@
|
|||
</div>
|
||||
</view>
|
||||
<!-- 正常商品的价格 -->
|
||||
<view class="goods-price" v-else>
|
||||
<view v-else>
|
||||
|
||||
<!-- 批发价格 -->
|
||||
<div class='price-row flex' v-if="wholesaleList.length">
|
||||
<div class='goods-price' v-for="(item,index) in wholesaleList" :key="index">
|
||||
<span>
|
||||
¥
|
||||
<span class="goods-price-bigshow">{{
|
||||
formatPrice(item.price)[0]
|
||||
}}</span>
|
||||
.{{ formatPrice(item.price)[1] }}
|
||||
</span>
|
||||
<span class='wholesale-item'>
|
||||
{{item.num}}{{goodsDetail.goodsUnit}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="goods-price" v-else>
|
||||
<span>
|
||||
¥
|
||||
<span class="goods-price-bigshow">{{
|
||||
|
@ -54,6 +60,7 @@
|
|||
}}</span>
|
||||
.{{ formatPrice(goodsDetail.price)[1] }}
|
||||
</span>
|
||||
</div>
|
||||
</view>
|
||||
<view class="goods-check-skus">
|
||||
已选
|
||||
|
@ -62,66 +69,46 @@
|
|||
<span>,{{ num }}个</span>
|
||||
</span>
|
||||
</view>
|
||||
<view class="goods-check-skus">
|
||||
库存
|
||||
<span class="goods-check-skus-name">
|
||||
<span>{{ goodsDetail.quantity }}</span>
|
||||
</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品信息 -->
|
||||
<scroll-view class="goods-skus-box" :scroll-y="true">
|
||||
<!-- 规格 -->
|
||||
<view
|
||||
class="goods-skus-view"
|
||||
:key="specIndex"
|
||||
v-for="(spec, specIndex) in formatList"
|
||||
>
|
||||
<view class="goods-skus-view" :key="specIndex" v-for="(spec, specIndex) in formatList">
|
||||
<view class="skus-view-list">
|
||||
<view class="view-class-title">{{ spec.name }}</view>
|
||||
|
||||
<!-- 正常逻辑 循环出sku -->
|
||||
<view
|
||||
v-if="!parentOrder"
|
||||
:class="{ active: spec_val.value == currentSelceted[specIndex] }"
|
||||
class="skus-view-item"
|
||||
v-for="(spec_val, spec_index) in spec.values"
|
||||
:key="spec_index"
|
||||
@click="handleClickSpec(spec, specIndex, spec_val)"
|
||||
>{{ spec_val.value }}
|
||||
<view v-if="!parentOrder" :class="{ active: spec_val.value == currentSelceted[specIndex] }"
|
||||
class="skus-view-item" v-for="(spec_val, spec_index) in spec.values" :key="spec_index"
|
||||
@click="handleClickSpec(spec, specIndex, spec_val)">{{ spec_val.value }}
|
||||
</view>
|
||||
|
||||
<!-- 拼团购买,仅筛选出当前拼团类型商品 -->
|
||||
<view
|
||||
v-if="parentOrder && spec_val.skuId == goodsDetail.id"
|
||||
:class="{ active: spec_val.value == currentSelceted[specIndex] }"
|
||||
class="skus-view-item"
|
||||
v-for="(spec_val, spec_index) in spec.values"
|
||||
:key="spec_index"
|
||||
@click="handleClickSpec(spec, specIndex, spec_val)"
|
||||
>{{ spec_val.value }}
|
||||
<view v-if="parentOrder && spec_val.skuId == goodsDetail.id"
|
||||
:class="{ active: spec_val.value == currentSelceted[specIndex] }" class="skus-view-item"
|
||||
v-for="(spec_val, spec_index) in spec.values" :key="spec_index"
|
||||
@click="handleClickSpec(spec, specIndex, spec_val)">{{ spec_val.value }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 数量 -->
|
||||
<view class="goods-skus-number">
|
||||
<view class="view-class-title">数量</view>
|
||||
<u-number-box
|
||||
:bg-color="numberBox.bgColor"
|
||||
:max="200"
|
||||
:color="numberBox.color"
|
||||
:input-width="numberBox.width"
|
||||
:input-height="numberBox.height"
|
||||
:size="numberBox.size"
|
||||
:min="1"
|
||||
v-model="num"
|
||||
>
|
||||
</u-number-box>
|
||||
|
||||
<u-input style='text-align: right;' v-model="num" type="number" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- 按钮 -->
|
||||
<view class="btns">
|
||||
<view
|
||||
class="box-btn card"
|
||||
v-if="buyType != 'PINTUAN' && goodsDetail.goodsType != 'VIRTUAL_GOODS'"
|
||||
@click="addToCartOrBuy('cart')"
|
||||
>加入购物车</view
|
||||
>
|
||||
<view class="box-btn card" v-if="buyType != 'PINTUAN' && goodsDetail.goodsType != 'VIRTUAL_GOODS'"
|
||||
@click="addToCartOrBuy('cart')">加入购物车</view>
|
||||
<view class="box-btn buy" @click="addToCartOrBuy('buy')">立即购买</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -137,14 +124,7 @@ export default {
|
|||
return {
|
||||
setup,
|
||||
num: 1,
|
||||
// 步进器的大小尺寸单位是 rpx
|
||||
numberBox: {
|
||||
width: "50",
|
||||
height: "50",
|
||||
size: "22",
|
||||
color: "#333",
|
||||
bgColor: "#fff",
|
||||
},
|
||||
|
||||
selectName: "", //选中商品的昵称
|
||||
selectSkuList: "", //选中商铺sku,
|
||||
selectedSpecImg: "", //选中的图片路径
|
||||
|
@ -154,9 +134,14 @@ export default {
|
|||
currentSelceted: [],
|
||||
skuList: "",
|
||||
isClose: false, //是否可以点击遮罩关闭
|
||||
|
||||
};
|
||||
},
|
||||
props: {
|
||||
wholesaleList:{
|
||||
type: null,
|
||||
default: false,
|
||||
},
|
||||
buyMask: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
|
@ -186,7 +171,23 @@ export default {
|
|||
type: null,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
wholesalePrice(key){
|
||||
return this.wholesaleList.length ? this.wholesaleList.map(item=>{ return item.price }) :[]
|
||||
},
|
||||
wholesaleNum(key){
|
||||
return this.wholesaleList.length ? this.wholesaleList.map(item=>{ return item.num }) :[]
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
num(val){
|
||||
if(val){
|
||||
if(val > this.goodsDetail.quantity){
|
||||
console.log(val)
|
||||
this.val = this.goodsDetail.quantity
|
||||
}
|
||||
}
|
||||
},
|
||||
buyType: {
|
||||
handler(val) {
|
||||
if (val) {
|
||||
|
@ -398,7 +399,10 @@ export default {
|
|||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./popup.scss";
|
||||
.price-row{
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
.buy {
|
||||
background-image: linear-gradient(135deg, #ffba0d, #ffc30d 69%, #ffcf0d);
|
||||
box-shadow: 0 2px 6px 0 rgba(255, 65, 66, 0.2);
|
||||
|
@ -419,6 +423,7 @@ export default {
|
|||
.goods-skus-number {
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
text-align: right
|
||||
}
|
||||
|
||||
/deep/ .uni-scroll-view {
|
||||
|
@ -464,6 +469,13 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
.wholesale-item{
|
||||
color: #999 !important;
|
||||
font-size: 24rpx;
|
||||
margin:0 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.goods-header {
|
||||
height: 200rpx;
|
||||
|
@ -483,8 +495,14 @@ export default {
|
|||
.goods-price {
|
||||
color: $price-color;
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
margin-right: 20rpx;
|
||||
>* {
|
||||
color: $price-color;
|
||||
line-height: 80rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.promotion-box {
|
||||
line-height: 1;
|
||||
display: flex;
|
||||
|
@ -492,22 +510,28 @@ export default {
|
|||
text-decoration: line-through;
|
||||
color: #999;
|
||||
margin-left: 10rpx;
|
||||
|
||||
/deep/ span {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.promotion {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.goods-price-promotionShow {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.goods-check-skus {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
|
||||
>.goods-check-skus-name {
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
>span {
|
||||
color: #333;
|
||||
}
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
## 商品列表展示
|
||||
|
||||
### OBJECT 参数说明
|
||||
|
||||
| 属性 | 说明 | 类型 | 必填 |
|
||||
| ----------- | ---------------------------------------------------------- | ------- | ---- |
|
||||
| `res` | 显示数据 | Array | 是 |
|
||||
| `type` | 商品展示类型 oneColumns twoColumns ,默认展示一行两列商品 | String | 否 |
|
||||
| `storeName` | 是否展示店铺名称,默认展示 | Boolean | 否 |
|
||||
|
|
@ -0,0 +1,293 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 一行两列商品展示 -->
|
||||
<view class="goods-list" v-if="type == 'twoColumns'">
|
||||
<view v-for="(item, index) in res" :key="index" class="goods-item">
|
||||
<view class="image-wrapper" @click="navigateToDetailPage(item)">
|
||||
<u-image :src="item.content.thumbnail" width="100%" height='330rpx' mode="aspectFill">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
</view>
|
||||
<view class="goods-detail">
|
||||
<div class="title clamp" @click="navigateToDetailPage(item)">{{ item.content.goodsName }}</div>
|
||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||
<div class="price" v-if="item.content.price!=undefined">
|
||||
¥<span>{{ formatPrice(item.content.price )[0] }} </span>.{{
|
||||
formatPrice(item.content.price )[1]
|
||||
}}
|
||||
</div>
|
||||
</view>
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-if="item.content.salesModel == 'WHOLESALE'">
|
||||
<span>批</span>
|
||||
</div>
|
||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1">满减</span>
|
||||
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-config" @click="navigateToDetailPage(item)">
|
||||
<span>已售 {{ item.content.buyCount || "0" }}</span>
|
||||
<span>{{ item.content.commentNum || "0" }}条评论</span>
|
||||
</div>
|
||||
<div class="store-seller-name" v-if="storeName" @click="navigateToStoreDetailPage(item)">
|
||||
<div class="text-hidden" >
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated"
|
||||
text="自营" type="error" />
|
||||
<span >{{ item.content.storeName || "暂无" }}</span>
|
||||
</div>
|
||||
<span>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 一行一列商品展示 -->
|
||||
<div v-if="type == 'oneColumns'">
|
||||
<div v-for="(item, index) in res" :key="index" class="goods-row">
|
||||
<div class="flex goods-col">
|
||||
<div class="goods-img" @click="navigateToDetailPage(item)">
|
||||
<u-image width="230rpx" border-radius='16' height="230rpx" :src="item.content.thumbnail">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
</div>
|
||||
<div class="goods-detail">
|
||||
<div class="title clamp3" @click="navigateToDetailPage(item)">{{ item.content.goodsName }}</div>
|
||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||
<div class="price" v-if="item.content.price!=undefined">
|
||||
¥<span>{{ formatPrice(item.content.price )[0] }} </span>.{{
|
||||
formatPrice(item.content.price )[1]
|
||||
}}
|
||||
</div>
|
||||
</view>
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-if="item.content.salesModel == 'WHOLESALE'">
|
||||
<span>批</span>
|
||||
</div>
|
||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1">满减</span>
|
||||
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="overflow: hidden" @click="navigateToDetailPage(item)" class="count-config">
|
||||
<span style="float: left; font-size: 22rpx">已售 {{ item.content.buyCount || '0' }}</span>
|
||||
<span style="float: right; font-size: 22rpx">{{ item.content.commentNum || '0' }}条评论</span>
|
||||
</div>
|
||||
<div style="overflow: hidden" @click="navigateToStoreDetailPage(item)" class="count-config">
|
||||
<div class="text-hidden" v-if="storeName">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated"
|
||||
text="自营" type="error" />
|
||||
<span class="line1-store-name">{{ item.content.storeName }}</span>
|
||||
<span class="to-store">进店<u-icon size="24" name="arrow-right" color="#666"></u-icon>
|
||||
</span>
|
||||
</div>
|
||||
<span>
|
||||
<u-icon name="arrow-right" color="#c5c5c5"></u-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
// 遍历的数据
|
||||
res: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// 一行两列还是一行一列显示
|
||||
type: {
|
||||
type: String,
|
||||
default: 'twoColumns',
|
||||
validator() {
|
||||
return ['twoColumns', 'oneColumns']
|
||||
}
|
||||
},
|
||||
storeName: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 格式化金钱 1999 --> [1999,00]
|
||||
formatPrice(val) {
|
||||
if (typeof val == "undefined") {
|
||||
return val;
|
||||
}
|
||||
return val.toFixed(2).split(".");
|
||||
},
|
||||
|
||||
// 数据去重一下 只显示一次 减免 劵 什么的
|
||||
getPromotion(item) {
|
||||
if (item.promotionMap) {
|
||||
let array = [];
|
||||
Object.keys(item.promotionMap).forEach((child) => {
|
||||
if (!array.includes(child.split("-")[0])) {
|
||||
array.push(child.split("-")[0]);
|
||||
}
|
||||
});
|
||||
return array;
|
||||
}
|
||||
},
|
||||
// 跳转到商品详情
|
||||
navigateToDetailPage(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${item.content.id}&goodsId=${item.content.goodsId}`,
|
||||
});
|
||||
},
|
||||
// 跳转地址
|
||||
navigateToStoreDetailPage(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/shopPage?id=${item.content.storeId}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
/* 商品列表 */
|
||||
.goods-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 10rpx 20rpx 284rpx;
|
||||
width: 100%;
|
||||
|
||||
>.goods-item {
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
border-radius: 16rpx;
|
||||
flex-direction: column;
|
||||
width: calc(50% - 30rpx);
|
||||
margin-bottom: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
&:nth-child(2n + 1) {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
|
||||
.image-wrapper {
|
||||
width: 100%;
|
||||
height: 330rpx;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.count-config,
|
||||
.store-seller-name {
|
||||
font-size: $font-sm;
|
||||
}
|
||||
|
||||
.text-hidden {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.goods-row {
|
||||
background: #fff;
|
||||
padding: 16rpx;
|
||||
|
||||
>.goods-col {
|
||||
display: flex;
|
||||
|
||||
>.goods-img {
|
||||
overflow: hidden;
|
||||
flex: 4;
|
||||
}
|
||||
|
||||
>.goods-detail {
|
||||
flex: 7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.goods-detail {
|
||||
margin: 0 20rpx;
|
||||
|
||||
>.title {
|
||||
font-size: $font-base;
|
||||
color: $font-color-dark;
|
||||
line-height: 1.5;
|
||||
height: 84rpx;
|
||||
padding: 10rpx 0 0;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.promotion {
|
||||
margin-top: 4rpx;
|
||||
display: flex;
|
||||
|
||||
div {
|
||||
span {
|
||||
font-size: 24rpx;
|
||||
color: $light-color;
|
||||
margin-right: 10rpx;
|
||||
padding: 0 4rpx;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.store-seller-name {
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.count-config {
|
||||
padding: 5rpx 0;
|
||||
color: #666;
|
||||
display: flex;
|
||||
font-size: 24rpx;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
>.price-box {
|
||||
margin-top: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-right: 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: $font-color-light;
|
||||
|
||||
>.price {
|
||||
font-size: 26rpx;
|
||||
line-height: 1;
|
||||
color: $main-color;
|
||||
font-weight: bold;
|
||||
|
||||
/deep/ span:nth-of-type(1) {
|
||||
font-size: 38rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
|
@ -1,27 +1,11 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="goods-recommend">{{title ? `--${title}-- `:''}}</div>
|
||||
<div class="goods-list">
|
||||
<div @click="handleClick(item)" class="goods-item" v-for="(item, item_index) in goodsList" :key="item_index">
|
||||
<div class="goods-img">
|
||||
<u-image :src="item.content.thumbnail" mode="aspectFill" height="350rpx" width="100%">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
</div>
|
||||
<div class="goods-desc">
|
||||
<div class="goods-title">
|
||||
{{ item.content.goodsName }}
|
||||
</div>
|
||||
<div class="goods-bottom">
|
||||
<div class="goods-price">¥{{ item.content.price | unitPrice }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<goodsTemplate :res='goodsList' />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import goodsTemplate from '@/components/m-goods-list/list'
|
||||
import { getGoodsList } from "@/api/goods.js";
|
||||
export default {
|
||||
data() {
|
||||
|
@ -50,6 +34,7 @@ export default {
|
|||
default: "",
|
||||
},
|
||||
},
|
||||
components:{goodsTemplate},
|
||||
mounted() {
|
||||
this.initGoods();
|
||||
},
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name" : "lili商城",
|
||||
"appid" : "__UNI__83F0C3D",
|
||||
"appid" : "__UNI__EC9FD60",
|
||||
"description" : "",
|
||||
"versionName" : "4.2.5",
|
||||
"versionCode" : 4000250,
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<view class="coupon-center">
|
||||
<swiper class="swiper-box">
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view class="scroll-v" enableBackToTop="true" scroll-y @scrolltolower="loadMore">
|
||||
<u-empty mode="coupon" text="没有优惠券了" v-if="whetherEmpty"></u-empty>
|
||||
<div class="swiper-box">
|
||||
<div class="swiper-item">
|
||||
<div class="scroll-v" enableBackToTop="true" scroll-y>
|
||||
<u-empty mode="coupon" style='margin-top: 20%;' text="没有优惠券了" v-if="whetherEmpty"></u-empty>
|
||||
<view v-else class="coupon-item" v-for="(item, index) in couponList" :key="index">
|
||||
<view class="left">
|
||||
<view class="wave-line">
|
||||
|
@ -23,10 +23,11 @@
|
|||
<view class="right">
|
||||
<view>
|
||||
<!-- 根据scopeType 判断是否是 平台、品类或店铺 -->
|
||||
<view v-if="item.scopeType">
|
||||
<view class="coupon-title wes-3" v-if="item.scopeType">
|
||||
<span v-if="item.scopeType == 'ALL' && item.id == 'platform'">全平台</span>
|
||||
<span v-if="item.scopeType == 'PORTION_CATEGORY'">仅限品类</span>
|
||||
<view v-else>{{ item.storeName == 'platform' ? '全平台' :item.storeName+'店铺' }}使用</view>
|
||||
<view v-else>{{ item.storeName == 'platform' ? '全平台' :item.storeName+'店铺' }}使用
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="item.endTime">有效期至:{{ item.endTime.split(" ")[0] }}</view>
|
||||
</view>
|
||||
|
@ -37,16 +38,20 @@
|
|||
<view class="bg-quan"> 券 </view>
|
||||
</view>
|
||||
</view>
|
||||
<uni-load-more :status="loadStatus"></uni-load-more>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { receiveCoupons } from "@/api/members.js";
|
||||
import { getAllCoupons } from "@/api/promotions.js";
|
||||
import {
|
||||
receiveCoupons
|
||||
} from "@/api/members.js";
|
||||
import {
|
||||
getAllCoupons
|
||||
} from "@/api/promotions.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
@ -57,13 +62,18 @@ export default {
|
|||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
storeId: "", //店铺 id
|
||||
storeId: "", //店铺 id,
|
||||
couponData: ""
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
this.storeId = option.storeId;
|
||||
this.getCoupon();
|
||||
},
|
||||
onReachBottom() {
|
||||
|
||||
this.loadMore()
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
//下拉刷新
|
||||
this.params.pageNumber = 1;
|
||||
|
@ -78,21 +88,26 @@ export default {
|
|||
uni.showLoading({
|
||||
title: "加载中",
|
||||
});
|
||||
let submitData = { ...this.params };
|
||||
let submitData = {
|
||||
...this.params
|
||||
};
|
||||
// 判断当前是否有店铺
|
||||
this.storeId ? (submitData = { ...this.params, storeId: this.storeId }): "",
|
||||
this.storeId ? (submitData = {
|
||||
...this.params,
|
||||
storeId: this.storeId
|
||||
}) : "",
|
||||
getAllCoupons(submitData)
|
||||
.then((res) => {
|
||||
uni.hideLoading();
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.data.code == 200) {
|
||||
// 如果请求成功,展示数据并进行展示
|
||||
let data = res.data.result;
|
||||
if (data.total == 0) {
|
||||
this.couponData = res.data.result
|
||||
if (this.couponData.total == 0) {
|
||||
// 当本次请求数据为空展示空信息
|
||||
this.whetherEmpty = true;
|
||||
} else {
|
||||
this.couponList.push(...data.records);
|
||||
this.couponList.push(...this.couponData.records);
|
||||
this.loadStatus = "noMore";
|
||||
}
|
||||
}
|
||||
|
@ -123,9 +138,9 @@ export default {
|
|||
* 加载更多
|
||||
*/
|
||||
loadMore() {
|
||||
if (this.loadStatus != "noMore") {
|
||||
if (this.couponData.total > this.params.pageNumber * this.params.pageSize) {
|
||||
this.params.pageNumber++;
|
||||
this.getAllCoupons();
|
||||
this.getCoupon();
|
||||
}
|
||||
},
|
||||
},
|
||||
|
@ -145,41 +160,7 @@ page {
|
|||
.coupon-center {
|
||||
height: 100%;
|
||||
|
||||
.couponList-scroll-content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
white-space: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: $main-color;
|
||||
color: #ffffff;
|
||||
|
||||
.tab-item {
|
||||
width: 160rpx;
|
||||
height: 80rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.active {
|
||||
border-bottom: 2px solid #ffffff;
|
||||
broder-width: 60rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
padding-bottom: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
height: 100%;
|
||||
|
||||
.scroll-v {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.coupon-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -191,6 +172,7 @@ page {
|
|||
width: 260rpx;
|
||||
background-color: $light-color;
|
||||
position: relative;
|
||||
|
||||
.message {
|
||||
color: $font-color-white;
|
||||
display: flex;
|
||||
|
@ -226,6 +208,7 @@ page {
|
|||
margin-top: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.circle {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
|
@ -234,10 +217,12 @@ page {
|
|||
border-radius: 50%;
|
||||
z-index: 111;
|
||||
}
|
||||
|
||||
.circle-top {
|
||||
top: -20rpx;
|
||||
right: -20rpx;
|
||||
}
|
||||
|
||||
.circle-bottom {
|
||||
bottom: -20rpx;
|
||||
right: -20rpx;
|
||||
|
@ -254,10 +239,15 @@ page {
|
|||
background-color: #ffffff;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
>view:nth-child(1) {
|
||||
color: #666666;
|
||||
margin-left: 20rpx;
|
||||
line-height: 3em;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
|
||||
>view:nth-child(1) {
|
||||
color: #ff6262;
|
||||
font-size: 30rpx;
|
||||
|
@ -296,4 +286,9 @@ page {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.coupon-title {
|
||||
width: 260rpx;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -116,12 +116,12 @@
|
|||
uni.stopPullDownRefresh();
|
||||
uni.hideLoading();
|
||||
if (res.statusCode == 200) {
|
||||
res.data.result &&
|
||||
res.data.result.forEach((item) => {
|
||||
res.data.result.records.length &&
|
||||
res.data.result.records.forEach((item) => {
|
||||
item.show = false;
|
||||
});
|
||||
|
||||
let data = res.data.result;
|
||||
let data = res.data.result.records;
|
||||
if (data.total == 0) {
|
||||
this.whetherEmpty = true;
|
||||
} else {
|
||||
|
|
|
@ -1,12 +1,13 @@
|
|||
<template>
|
||||
<view class="box">
|
||||
<view class="box-tips">
|
||||
<h2>
|
||||
<h2 class='h2'>
|
||||
{{verificationTitle[validateFlage==false ? 0 : 1].title}}
|
||||
</h2>
|
||||
<view class="verification">{{verificationTitle[step].desc}}</view>
|
||||
</view>
|
||||
<u-form :model="codeForm" class="form" ref="validateCodeForm">
|
||||
<view class="form">
|
||||
<u-form :model="codeForm" ref="validateCodeForm">
|
||||
<view v-if="!validateFlage">
|
||||
<u-form-item label-width="120" label="手机号" prop="mobile">
|
||||
<u-input maxlength="11" v-model="codeForm.mobile" placeholder="请输入您的手机号" />
|
||||
|
@ -36,6 +37,7 @@
|
|||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -221,8 +223,8 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import url("../../../passport/login.scss");
|
||||
.u-form-item {
|
||||
@import url("@/pages/passport/login.scss");
|
||||
/deep/ .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
.sendCode {
|
||||
|
@ -230,6 +232,10 @@ export default {
|
|||
display: flex;
|
||||
}
|
||||
}
|
||||
.h2{
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
@ -248,4 +254,5 @@ page {
|
|||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
</style>
|
|
@ -22,19 +22,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.promotion {
|
||||
margin-top: 4rpx;
|
||||
display: flex;
|
||||
div {
|
||||
span {
|
||||
font-size: 24rpx;
|
||||
color: $light-color;
|
||||
margin-right: 10rpx;
|
||||
padding: 0 4rpx;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.status_bar {
|
||||
height: var(--status-bar-height);
|
||||
background: #fff !important;
|
||||
|
@ -437,180 +424,13 @@ view {
|
|||
margin-left: 4rpx;
|
||||
font-size: 26rpx;
|
||||
color: #888;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.xia {
|
||||
transform: scaleY(-1);
|
||||
}
|
||||
}
|
||||
|
||||
.cate-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 80rpx;
|
||||
position: relative;
|
||||
font-size: 44rpx;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
border-left: 1px solid #ddd;
|
||||
width: 0;
|
||||
height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 分类 */
|
||||
.cate-mask {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: var(--window-top);
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
z-index: 95;
|
||||
transition: 0.3s;
|
||||
|
||||
.cate-content {
|
||||
width: 630rpx;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
float: right;
|
||||
transform: translateX(100%);
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
&.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.show {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
|
||||
.cate-content {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cate-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
.cate-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 90rpx;
|
||||
padding-left: 30rpx;
|
||||
font-size: 28rpx;
|
||||
color: #555;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.two {
|
||||
height: 64rpx;
|
||||
color: #303133;
|
||||
font-size: 30rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
.price-box {
|
||||
margin-top: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-right: 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: $font-color-light;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 26rpx;
|
||||
line-height: 1;
|
||||
color: $main-color;
|
||||
font-weight: bold;
|
||||
/deep/ span:nth-of-type(1) {
|
||||
font-size: 38rpx;
|
||||
}
|
||||
}
|
||||
/* 商品列表 */
|
||||
.goods-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 10rpx 20rpx 284rpx;
|
||||
|
||||
|
||||
// background: #fff;
|
||||
width: 100%;
|
||||
.goods-item {
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
border-radius: 16rpx;
|
||||
flex-direction: column;
|
||||
width: calc(50% - 30rpx);
|
||||
margin-bottom: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
&:nth-child(2n + 1) {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.goods-detail {
|
||||
margin: 0 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.image-wrapper {
|
||||
width: 100%;
|
||||
height: 330rpx;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 1;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: $font-base;
|
||||
color: $font-color-dark;
|
||||
line-height: 1.5;
|
||||
height: 84rpx;
|
||||
padding: 10rpx 0 0;
|
||||
display: -webkit-box;
|
||||
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
-webkit-line-clamp: 2;
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.count-config,
|
||||
.store-seller-name {
|
||||
font-size: $font-sm;
|
||||
}
|
||||
|
||||
.text-hidden {
|
||||
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.status_bar {
|
||||
height: var(--status-bar-height);
|
||||
width: 100%;
|
||||
|
|
|
@ -82,65 +82,10 @@
|
|||
<div v-if="isSWitch">
|
||||
<scroll-view :style="{ height: goodsHeight }" enableBackToTop="true" lower-threshold="250"
|
||||
@scrolltolower="loadmore()" scroll-with-animation scroll-y class="scoll-page">
|
||||
<div class="goods-class">
|
||||
<div v-for="(item, index) in goodsList" :key="index" class="goods-row">
|
||||
<div class="flex goods-col">
|
||||
<div class="goods-img" @click="navigateToDetailPage(item)">
|
||||
<u-image width="230rpx" height="230rpx" :src="item.content.thumbnail">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
</div>
|
||||
<div class="goods-detail">
|
||||
<div class="title clamp3" @click="navigateToDetailPage(item)">{{ item.content.goodsName }}</div>
|
||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||
<div class="price" v-if="item.content.price!=undefined">
|
||||
¥<span>{{ formatPrice(item.content.price )[0] }} </span>.{{
|
||||
formatPrice(item.content.price )[1]
|
||||
}}
|
||||
</div>
|
||||
</view>
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1">满减</span>
|
||||
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="overflow: hidden" @click="navigateToDetailPage(item)" class="count-config">
|
||||
<span style="float: left; font-size: 22rpx">已售 {{ item.content.buyCount || '0' }}</span>
|
||||
<span style="float: right; font-size: 22rpx">{{ item.content.commentNum || '0' }}条评论</span>
|
||||
</div>
|
||||
<div style="overflow: hidden" @click="navigateToStoreDetailPage(item)" class="count-config">
|
||||
<div class="text-hidden">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营"
|
||||
type="error" />
|
||||
<span class="line1-store-name">{{ item.content.storeName }}</span>
|
||||
<span class="to-store">进店<u-icon size="24" name="arrow-right" color="#666"></u-icon></span>
|
||||
</div>
|
||||
<span>
|
||||
<u-icon name="arrow-right" color="#c5c5c5"></u-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<goodsList :res='goodsList' type='oneColumns' />
|
||||
<uni-load-more :status="loadingType" @loadmore="loadmore()"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
<div class="empty" v-if="goodsList == [] || goodsList == '' || goodsList == null">
|
||||
<view>
|
||||
<image style="width: 320rpx; height: 240rpx" src="/static/nodata.png">
|
||||
|
||||
</image>
|
||||
</view>
|
||||
<view>
|
||||
<p>没有找到相关的商品信息</p>
|
||||
<p>请换一个关键词试试吧</p>
|
||||
</view>
|
||||
</div>
|
||||
|
||||
<!-- 一行两个商品展示 -->
|
||||
<div v-if="
|
||||
!isSWitch &&
|
||||
|
@ -148,45 +93,7 @@
|
|||
">
|
||||
<scroll-view :style="{ height: goodsHeight }" scroll-anchoring enableBackToTop="true"
|
||||
@scrolltolower="loadmore()" scroll-with-animation scroll-y lower-threshold="250" class="scoll-page">
|
||||
<view class="goods-list">
|
||||
<view v-for="(item, index) in goodsList" :key="index" class="goods-item">
|
||||
<view class="image-wrapper" @click="navigateToDetailPage(item)">
|
||||
<image :src="item.content.thumbnail" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="goods-detail">
|
||||
<div class="title clamp" @click="navigateToDetailPage(item)">{{ item.content.goodsName }}</div>
|
||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||
<div class="price" v-if="item.content.price!=undefined">
|
||||
¥<span>{{ formatPrice(item.content.price )[0] }} </span>.{{
|
||||
formatPrice(item.content.price )[1]
|
||||
}}
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1">满减</span>
|
||||
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="count-config" @click="navigateToDetailPage(item)">
|
||||
<span>已售 {{ item.content.buyCount || "0" }}</span>
|
||||
<span>{{ item.content.commentNum || "0" }}条评论</span>
|
||||
</div>
|
||||
<div class="store-seller-name" @click="navigateToStoreDetailPage(item)">
|
||||
<div class="text-hidden">
|
||||
<u-tag style="margin-right: 10rpx" size="mini" mode="dark" v-if="item.selfOperated" text="自营"
|
||||
type="error" />
|
||||
<span>{{ item.content.storeName || "暂无" }}</span>
|
||||
</div>
|
||||
<span>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<goodsList :res='goodsList' />
|
||||
<uni-load-more :status="loadingType"></uni-load-more>
|
||||
</scroll-view>
|
||||
</div>
|
||||
|
@ -268,19 +175,31 @@
|
|||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<div class="empty" v-if="empty">
|
||||
<view>
|
||||
<image style="width: 320rpx; height: 240rpx" src="/static/nodata.png">
|
||||
|
||||
</image>
|
||||
</view>
|
||||
<view>
|
||||
<p>没有找到相关的商品信息</p>
|
||||
<p>请换一个关键词试试吧</p>
|
||||
</view>
|
||||
</div>
|
||||
<u-back-top :scroll-top="scrollTop"></u-back-top>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getGoodsList, getGoodsRelated } from "@/api/goods.js";
|
||||
|
||||
import goodsList from '@/components/m-goods-list/list.vue'
|
||||
import { getHotKeywords } from "@/api/home.js";
|
||||
import mSearch from "@/components/m-search-revision/m-search-revision.vue";
|
||||
import storage from "@/utils/storage";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
empty:false,
|
||||
scrollTop: 0,
|
||||
loadIndex: 10,
|
||||
oldKeywordIndex: "",
|
||||
|
@ -339,6 +258,7 @@ export default {
|
|||
routerVal: "",
|
||||
};
|
||||
},
|
||||
|
||||
onPageScroll(e) {
|
||||
console.log(e);
|
||||
this.scrollTop = e.scrollTop;
|
||||
|
@ -371,6 +291,7 @@ export default {
|
|||
},
|
||||
components: {
|
||||
mSearch,
|
||||
goodsList
|
||||
},
|
||||
watch: {
|
||||
/**
|
||||
|
@ -710,6 +631,9 @@ export default {
|
|||
|
||||
if (goodsList.data.result.content.length < 10) {
|
||||
this.loadingType = "noMore";
|
||||
this.empty = true
|
||||
} else {
|
||||
this.empty = false
|
||||
}
|
||||
this.goodsList.push(...goodsList.data.result.content);
|
||||
this.initSortGoods();
|
||||
|
@ -759,6 +683,9 @@ export default {
|
|||
doSearchSwitch() {
|
||||
this.isSWitch = !this.isSWitch;
|
||||
this.isShowSeachGoods = true;
|
||||
this.params.pageNumber = 1
|
||||
this.params.pageSize = 10
|
||||
this.loadData("refresh", 1);
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
|
@ -326,10 +326,10 @@ export default {
|
|||
// this.loadData(this.status);
|
||||
},
|
||||
onShow() {
|
||||
if (this.tabCurrentIndex) {
|
||||
this.initData(this.tabCurrentIndex);
|
||||
} else {
|
||||
if (!this.tabCurrentIndex) {
|
||||
this.initData(0);
|
||||
} else {
|
||||
|
||||
}
|
||||
// this.loadData(this.status);
|
||||
},
|
||||
|
@ -341,6 +341,7 @@ export default {
|
|||
*/
|
||||
let status = Number(options.status);
|
||||
this.status = status;
|
||||
|
||||
this.tabCurrentIndex = status;
|
||||
// if (status == 0) {
|
||||
// this.loadData(status);
|
||||
|
@ -434,6 +435,7 @@ export default {
|
|||
*/
|
||||
loadData(index) {
|
||||
this.params.pageNumber = this.navList[index].pageNumber;
|
||||
// this.params.tag = this.orderStatus[index].orderStatus;
|
||||
getOrderList(this.params).then((res) => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (!res.data.success) {
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
<!-- 分享 -->
|
||||
<shares
|
||||
v-if="shareFlage && goodsDetail.id"
|
||||
v-if="enableShare && goodsDetail.id"
|
||||
:skuId="this.routerVal.id"
|
||||
:goodsId="this.routerVal.goodsId"
|
||||
:link="
|
||||
|
@ -19,7 +19,7 @@
|
|||
:thumbnail="goodsDetail.thumbnail"
|
||||
:goodsName="goodsDetail.goodsName"
|
||||
type="goods"
|
||||
@close="shareFlage = false"
|
||||
@close="enableShare = false"
|
||||
/>
|
||||
<popups
|
||||
v-model="popupsSwitch"
|
||||
|
@ -116,7 +116,7 @@
|
|||
|
||||
<view class="card-box top-radius-0" id="main2">
|
||||
<!-- 活动不显示价钱 -->
|
||||
<view v-if="!promotionFlag" class="desc-bold -goods-msg">
|
||||
<view v-if="isSeckill || isGroup" class="desc-bold -goods-msg">
|
||||
<view class="-goods-flex">
|
||||
<view class="desc-bold">
|
||||
{{ goodsDetail.goodsName || "" }}
|
||||
|
@ -150,9 +150,14 @@
|
|||
</span>
|
||||
|
||||
<span v-else>
|
||||
<span>¥</span
|
||||
><span class="price">{{ formatPrice(goodsDetail.price)[0] }}</span
|
||||
>.{{ formatPrice(goodsDetail.price)[1] }}
|
||||
<span v-if="wholesaleList.length">
|
||||
<span>¥</span><span class="price">{{ formatPrice(wholesaleList[wholesaleList.length-1].price)[0] }}</span>.{{ formatPrice(wholesaleList[wholesaleList.length-1].price)[1] }}
|
||||
~
|
||||
<span>¥</span><span class="price">{{ formatPrice(wholesaleList[0].price)[0] }}</span>.{{ formatPrice(wholesaleList[0].price)[1] }}
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>¥</span><span class="price">{{ formatPrice(goodsDetail.price)[0] }}</span>.{{ formatPrice(goodsDetail.price)[1] }}
|
||||
</span>
|
||||
</span>
|
||||
</view>
|
||||
<view class="-goods-price" v-else>
|
||||
|
@ -348,6 +353,7 @@
|
|||
:id="productId"
|
||||
v-if="goodsDetail.id"
|
||||
:pointDetail="pointDetail"
|
||||
:wholesaleList="wholesaleList"
|
||||
@handleClickSku="selectSku"
|
||||
:buyMask="buyMask"
|
||||
/>
|
||||
|
@ -404,7 +410,6 @@ export default {
|
|||
return {
|
||||
setup,
|
||||
promotionShow: false, //弹窗开关
|
||||
promotionFlag: true, //活动开关
|
||||
// #ifdef H5
|
||||
navbarListX: 110, //导航栏列表栏x轴
|
||||
navbarListY: 80, //导航栏列表栏y轴
|
||||
|
@ -441,9 +446,10 @@ export default {
|
|||
},
|
||||
],
|
||||
popupsSwitch: false, //导航栏列表栏开关
|
||||
shareFlage: false,
|
||||
enableShare: false,
|
||||
selectedGoods: "", //选择的商品规格昵称
|
||||
isGroup: false, // 是否是拼团活动
|
||||
isSeckill:false, // 是否秒杀活动
|
||||
pointDetail: "", // 是否是积分商品
|
||||
assemble: "", //拼团的sku
|
||||
navbarOnlyBack: {
|
||||
|
@ -479,7 +485,6 @@ export default {
|
|||
id: "4",
|
||||
},
|
||||
],
|
||||
oldtabScrollTop: 0,
|
||||
tabScrollTop: null,
|
||||
scrollArr: [],
|
||||
scrollId: "1",
|
||||
|
@ -523,6 +528,7 @@ export default {
|
|||
|
||||
routerVal: "",
|
||||
IMLink: "", // IM地址
|
||||
wholesaleList:[]
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -540,10 +546,7 @@ export default {
|
|||
this.$refs.popupGoods.buyType = "PINTUAN";
|
||||
clearInterval(timer);
|
||||
}, 100);
|
||||
|
||||
this.promotionFlag = false;
|
||||
} else {
|
||||
this.promotionFlag = true;
|
||||
this.$refs.popupGoods.buyType = "";
|
||||
}
|
||||
},
|
||||
|
@ -661,6 +664,7 @@ export default {
|
|||
}
|
||||
/**商品信息以及规格信息存储 */
|
||||
this.goodsDetail = response.data.result.data;
|
||||
this.wholesaleList = response.data.result.wholesaleList;
|
||||
this.goodsSpec = response.data.result.specs;
|
||||
this.PromotionList = response.data.result.promotionMap;
|
||||
this.goodsParams = response.data.result.goodsParamsDTOList || [];
|
||||
|
@ -676,6 +680,10 @@ export default {
|
|||
if (item.indexOf("POINTS_GOODS") == 0) {
|
||||
this.pointDetail = this.PromotionList[item];
|
||||
}
|
||||
// 秒杀
|
||||
if (item.indexOf("SECKILL") == 0) {
|
||||
this.isSeckill = true
|
||||
}
|
||||
});
|
||||
// 轮播图
|
||||
this.imgList = this.goodsDetail.goodsGalleryList;
|
||||
|
@ -1066,7 +1074,7 @@ export default {
|
|||
* 点击分享
|
||||
*/
|
||||
async shareChange() {
|
||||
this.shareFlage = true;
|
||||
this.enableShare = true;
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
|
@ -1,169 +1,20 @@
|
|||
<template>
|
||||
<view class="recommend-box" >
|
||||
<h4 class="goods-recommend-title">宝贝推荐</h4>
|
||||
<view class="like-goods-list">
|
||||
<view class="like-goods-list">
|
||||
<view
|
||||
class="like-goods-item"
|
||||
@click="clickGoods(item)"
|
||||
v-for="(item, index) in res"
|
||||
:key="index"
|
||||
>
|
||||
<u-image
|
||||
:fade="true"
|
||||
duration="450"
|
||||
:lazy-load="true"
|
||||
:src="item.content.thumbnail"
|
||||
width="330rpx"
|
||||
height="330rpx"
|
||||
class="like-goods-uimage"
|
||||
>
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
<view style="background-color: #ffffff; width: 100%">
|
||||
<view class="name">{{ item.content.goodsName }}</view>
|
||||
<view class="price-sales">
|
||||
<div class="item-price" v-if="item.content.price != undefined">
|
||||
¥
|
||||
<span>{{ formatPrice(item.content.price)[0] }}</span>
|
||||
.{{formatPrice(item.content.price)[1]}}
|
||||
<!-- <text v-if="item.point != undefined">+{{ item.point }}积分</text> -->
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<goodsList :res='res' v-if="res" :storeName="false" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import goodsList from '@/components/m-goods-list/list.vue'
|
||||
export default {
|
||||
props: ["res"],
|
||||
components:{goodsList},
|
||||
methods: {
|
||||
// 点击店铺推荐
|
||||
clickGoods(val) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${val.content.id}&goodsId=${val.content.goodsId}`
|
||||
});
|
||||
},
|
||||
// 格式化金钱 1999 --> [1999,00]
|
||||
formatPrice(val) {
|
||||
if (typeof val == "undefined") {
|
||||
return val;
|
||||
}
|
||||
|
||||
return val.toFixed(2).split(".");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../mp-goods.scss";
|
||||
@import "../product.scss";
|
||||
|
||||
.goods_recomm {
|
||||
padding: 12px 0 20rpx 20rpx;
|
||||
color: #000;
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
margin-bottom: 28rpx;
|
||||
}
|
||||
|
||||
.like-goods-uimage {
|
||||
/deep/ .u-image {
|
||||
height: 350rpx !important;
|
||||
}
|
||||
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.recommend-box {
|
||||
background-color: #ffffff;
|
||||
|
||||
width: 100%;
|
||||
|
||||
padding-bottom: 120rpx;
|
||||
|
||||
.title {
|
||||
width: 120rpx;
|
||||
height: 42rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
text-align: left;
|
||||
color: #333333;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.like-goods-list {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.like-goods-item {
|
||||
padding: 0 !important;
|
||||
width: 48%;
|
||||
margin: 0 1% 10rpx 1%;
|
||||
background: #f7f7f7;
|
||||
border-radius: 12rpx;
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
/deep/ .u-image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.like-goods-list {
|
||||
// background-color: #f8f8f8;
|
||||
width: 100%;
|
||||
margin-bottom: 100rpx;
|
||||
|
||||
.name {
|
||||
padding: 14rpx 8rpx 0 8rpx;
|
||||
|
||||
color: #333;
|
||||
font-size: 24rpx;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
-webkit-line-clamp: 2;
|
||||
|
||||
background: #f7f7f7;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.price-sales {
|
||||
padding: 8rpx;
|
||||
background: #f7f7f7;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.item-price {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 26rpx;
|
||||
text-align: left;
|
||||
color: $price-color;
|
||||
line-height: 23px;
|
||||
font-weight: bold;
|
||||
> span {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sales {
|
||||
line-height: 23px;
|
||||
font-size: 22rpx;
|
||||
text-align: left;
|
||||
letter-spacing: 0;
|
||||
color: #cccccc;
|
||||
// padding-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -60,18 +60,7 @@
|
|||
<!-- 商品 -->
|
||||
<div class="contant" v-if="current == 0">
|
||||
<view v-if="!goodsList.length" class="empty">暂无商品信息</view>
|
||||
<view v-else class="item" v-for="(item,index) in goodsList" :key="index" @click="navigateToGoodsDetail(item)">
|
||||
<u-image width="100%" height="330rpx" mode="aspectFit" :src="item.content.thumbnail">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
<div class="name wes-2">{{ item.content.goodsName }}</div>
|
||||
<div class="price">
|
||||
<div>¥{{ item.content.price | unitPrice }}</div>
|
||||
</div>
|
||||
<view class="buyCount">
|
||||
<div>已售 {{ item.content.buyCount || "0" }}</div>
|
||||
</view>
|
||||
</view>
|
||||
<goodsTemplate :res="goodsList" :storeName="false" />
|
||||
</div>
|
||||
<!-- 全部分类 -->
|
||||
<div class="category" v-if="current == 1">
|
||||
|
@ -95,6 +84,7 @@
|
|||
|
||||
<script>
|
||||
import { getStoreBaseInfo, getStoreCategory } from "@/api/store.js";
|
||||
import goodsTemplate from '@/components/m-goods-list/list'
|
||||
import {
|
||||
receiveCoupons,
|
||||
deleteStoreCollection,
|
||||
|
@ -129,6 +119,7 @@ export default {
|
|||
val == 0 ? ()=>{ this.goodsList = []; this.getGoodsData()} : this.getCategoryData();
|
||||
},
|
||||
},
|
||||
components:{goodsTemplate},
|
||||
|
||||
/**
|
||||
* 加载
|
||||
|
@ -188,30 +179,34 @@ export default {
|
|||
* 联系客服
|
||||
*/
|
||||
linkKefuDetail() {
|
||||
// 客服
|
||||
// #ifdef MP-WEIXIN
|
||||
// // 客服
|
||||
// // #ifdef MP-WEIXIN
|
||||
|
||||
// const params = {
|
||||
// // originalPrice: this.goodsDetail.original || this.goodsDetail.price,
|
||||
// uuid: storage.getUuid(),
|
||||
// token: storage.getAccessToken(),
|
||||
// sign: this.storeInfo.yzfSign,
|
||||
// mpSign: this.storeInfo.yzfMpSign,
|
||||
// };
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/product/customerservice/index?params=" +
|
||||
// encodeURIComponent(JSON.stringify(params)),
|
||||
// });
|
||||
// // #endif
|
||||
// // #ifndef MP-WEIXIN
|
||||
// const sign = this.storeInfo.yzfSign;
|
||||
// uni.navigateTo({
|
||||
// url:
|
||||
// "/pages/tabbar/home/web-view?src=https://yzf.qq.com/xv/web/static/chat/index.html?sign=" +
|
||||
// sign,
|
||||
// });
|
||||
// // #endif
|
||||
|
||||
const params = {
|
||||
// originalPrice: this.goodsDetail.original || this.goodsDetail.price,
|
||||
uuid: storage.getUuid(),
|
||||
token: storage.getAccessToken(),
|
||||
sign: this.storeInfo.yzfSign,
|
||||
mpSign: this.storeInfo.yzfMpSign,
|
||||
};
|
||||
uni.navigateTo({
|
||||
url:
|
||||
"/pages/product/customerservice/index?params=" +
|
||||
encodeURIComponent(JSON.stringify(params)),
|
||||
url: `/pages/tabbar/home/web-view?IM=${this.storeId}`,
|
||||
});
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
const sign = this.storeInfo.yzfSign;
|
||||
uni.navigateTo({
|
||||
url:
|
||||
"/pages/tabbar/home/web-view?src=https://yzf.qq.com/xv/web/static/chat/index.html?sign=" +
|
||||
sign,
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
|
||||
/** 获取店铺分类 */
|
||||
|
@ -277,15 +272,6 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到商品详情
|
||||
*/
|
||||
navigateToGoodsDetail(val) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${val.content.id}&goodsId=${val.content.goodsId}`,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 是否收藏
|
||||
*/
|
||||
|
@ -404,42 +390,6 @@ export default {
|
|||
justify-content: center;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.item {
|
||||
overflow: hidden;
|
||||
|
||||
background: #fff;
|
||||
width: 49%;
|
||||
height: 484rpx;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #f8f8f8;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.name {
|
||||
text-align: left !important;
|
||||
color: #333;
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
height: 80rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.price {
|
||||
font-weight: 500;
|
||||
color: $main-color;
|
||||
font-size: 30rpx;
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.buyCount {
|
||||
display: flex;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24upx;
|
||||
justify-content: space-between;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
.discount {
|
||||
height: 154rpx;
|
||||
|
|
|
@ -4,25 +4,17 @@
|
|||
<!-- 商品 -->
|
||||
<div class="contant">
|
||||
<view v-if="!goodsList.length" class="empty">暂无商品信息</view>
|
||||
<view v-else class="item" v-for="(item,index) in goodsList" :key="index" @click="navigateToGoodsDetail(item)">
|
||||
<u-image width="100%" mode="aspectFit" height="324rpx" :src="item.content.thumbnail">
|
||||
<u-loading slot="loading"></u-loading>
|
||||
</u-image>
|
||||
<div class="name">{{ item.content.goodsName }}</div>
|
||||
<div class="price">
|
||||
<div>¥{{ item.content.price | unitPrice }}</div>
|
||||
</div>
|
||||
<view class="buyCount">
|
||||
<div>已售 {{ item.content.buyCount || "0" }}</div>
|
||||
</view>
|
||||
</view>
|
||||
<goodsTemplate :res='goodsList' :storeName='false' />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getGoodsList } from "@/api/goods.js";
|
||||
import {
|
||||
getGoodsList
|
||||
} from "@/api/goods.js";
|
||||
import goodsTemplate from '@/components/m-goods-list/list'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
@ -38,6 +30,9 @@ export default {
|
|||
},
|
||||
};
|
||||
},
|
||||
components: {
|
||||
goodsTemplate
|
||||
},
|
||||
onLoad(options) {
|
||||
this.routerVal = options;
|
||||
this.params.storeId = options.storeId;
|
||||
|
@ -54,15 +49,6 @@ export default {
|
|||
this.getGoodsData();
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 跳转到商品详情
|
||||
*/
|
||||
navigateToGoodsDetail(val) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/product/goods?id=${val.content.id}&goodsId=${val.content.goodsId}`,
|
||||
});
|
||||
},
|
||||
|
||||
async getGoodsData() {
|
||||
// #TODO
|
||||
let goodsList = await getGoodsList(this.params);
|
||||
|
@ -80,48 +66,12 @@ export default {
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
>.empty {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.item {
|
||||
overflow: hidden;
|
||||
|
||||
background: #fff;
|
||||
width: 49%;
|
||||
height: 484rpx;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #f8f8f8;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.name {
|
||||
text-align: left !important;
|
||||
color: #333;
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
line-height: 1.4em;
|
||||
max-height: 2.8em; //height是line-height的整数倍,防止文字显示不全
|
||||
overflow: hidden;
|
||||
}
|
||||
.price {
|
||||
font-weight: 500;
|
||||
color: $main-color;
|
||||
font-size: 30rpx;
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.buyCount {
|
||||
display: flex;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24upx;
|
||||
justify-content: space-between;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -74,6 +74,7 @@
|
|||
</p>
|
||||
<!-- 规格 -->
|
||||
<p class="sp-type">{{skuItem.goodsSku.simpleSpecs}}</p>
|
||||
<p class="sp-type" v-if="skuItem.goodsSku.salesModel == 'WHOLESALE'">批发商品</p>
|
||||
<p class="sp-number">
|
||||
<view class="sp-price">
|
||||
<div class="default-color" :class="{'main-color':Object.keys(skuItem.promotionMap).length ==0 }">
|
||||
|
|
Loading…
Reference in New Issue