charles/frontend-app
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

feat: 首页改造

Browse Source
This commit is contained in:
charles
2026-07-13 18:14:00 +08:00
parent 85fff5c363
commit c6015b8295
15 changed files with 2726 additions and 1399 deletions
Download Patch File Download Diff File Expand all files Collapse all files
api/cart.js
+15
View File
@@ -67,6 +67,21 @@ export function settlementOrder(data) {
});
}
// 秒杀下单
export function setSeckillOrder(data) {
return request({
url: "/seckill/order",
method: "post",
data,
// cha:1
// headers: {
// "Content-Type": "application/x-www-form-urlencoded"
// }
});
}
// 查询运费
export function getPostageQuery(data) {
return request({
url: "/cart/getPostage",
api/product.js
+38
View File
@@ -91,3 +91,41 @@ export function deleteReview(params) {
data: params,
});
}
// 今日秒杀 --获取activityId
export function getSeckillCurrent(params) {
return request({
url: "/seckill/current",
method: "get",
data: params,
});
}
// 活动预告 --获取activityId
export function getSeckillPreview(params) {
return request({
url: "/seckill/preview",
method: "get",
data: params,
});
}
// 商品列表
export function getSeckillGoodsList(params) {
return request({
url: "/seckill/goodsList",
method: "get",
data: params
});
}
// 商品标签
export function getGoodsTags(params) {
return request({
url: "/goods/getGoodsTagList",
method: "get",
data: params,
});
}
components/common/product-seckill-card.vue
+89 -78
View File
@@ -1,8 +1,9 @@
<template>
<view class="seckill_card_container" @click="$emit('click', item)">
<view class="seckill_card_container" @click="onSelectProct(item)">
<!-- Left side image with optional countdown overlay -->
<view class="seckill_card_left">
<up-image :src="item.url || item.image || item.accessUrl" width="220rpx" height="220rpx" bgColor="#f1f6ff00" shape="square" radius="16rpx"></up-image>
<up-image :src="item.url || item.image || item.accessUrl" width="220rpx" height="220rpx" bgColor="#f1f6ff00"
shape="square" radius="16rpx"></up-image>
<view class="countdown_bar" v-if="showCountdown && countdownText">
<text class="countdown_text">{{ countdownText }}</text>
</view>
@@ -10,37 +11,44 @@
<!-- Right side content -->
<view class="seckill_card_right">
<!-- Tags row (Placeholders, toggleable via item flags) -->
<view>
<!-- <view class="tags_row" v-if="Array.isArray(item.tags)"> -->
<view class="tags_row">
<view class="tag_badge seckill" v-if="isSeckill">限时秒杀</view>
<view class="tag_badge limit" v-if="isLimitTime">限时</view>
<view class="tag_badge special" v-if="isSpecialSupply">
<view class="vip_icon">V</view>特供
</view>
<image v-for="i in item.goodsTagList" :key="i.mchId" :src="i.icon"
class="tag_image" mode="heightFix"></image>
</view>
<!-- Title -->
<view class="product_title">{{ item.title || '商品名称' }}</view>
<!-- 商品名称 -->
<view class="product_title">{{ item.title }}</view>
</view>
<!-- Coupon tag (秒杀券立减) -->
<!-- (秒杀券立减) -->
<view class="coupon_row" v-if="hasCoupon">
<view class="coupon_badge" >
<!-- <view class="coupon_badge" v-if="activedType === 'seckill'"> -->
<text class="flash_icon">⚡</text>
<text class="coupon_text">秒杀券立减{{ item.couponAmount || '8.8' }}元</text>
<text class="coupon_text" v-if="item.secDiscount || item.subsidy">加倍补{{ item.secDiscount || item.subsidy }}元</text>
</view>
<!-- <view class="coupon_badge" v-else>
<text class="flash_icon">⚡</text>
<text class="coupon_text">加倍补{{ item.subsidy }}积分</text>
</view> -->
</view>
<!-- Price and action card row -->
<view class="price_action_row">
<view class="price_section">
<text class="price_symbol">¥</text>
<text class="price_integer">{{ priceParts.integer }}</text>
<text class="price_decimal">.{{ priceParts.decimal }}</text>
<text class="original_price">¥{{ item.originalPrice || item.price || '0.00' }}</text>
<text class="price_integer">{{ item.price }}</text>
<text class="original_price seckill" >{{ `${attributes.leftTime ?
`只剩${attributes.leftTime}` : ''}` }}</text>
<!-- <text class="original_price" v-else>¥{{ formatOriginalPrice }}</text> -->
</view>
<!-- Alarm clock button -->
<view class="alarm_btn_wrapper" @click.stop="$emit('action', item)">
<up-image src="https://static.tbmall.xin/static/new-home/home_3.png" width="36rpx" height="36rpx" bgColor="#f1f6ff00"></up-image>
<image class="uni-image" v-if="activedType === 'seckill'" src="https://static.tbmall.xin/static/new-home/home_3.png"></image>
<image class="uni-image seckill-icon" v-else
src="https://static.tbmall.xin/static/home/qiang.png"></image>
</view>
</view>
</view>
@@ -51,12 +59,12 @@
export default {
name: "product-seckill-card",
props: {
// Product details object
// 单个商品
item: {
type: Object,
default: () => ({})
},
// Control showing countdown bar
// 倒计时
showCountdown: {
type: Boolean,
default: true
@@ -65,6 +73,13 @@ export default {
timeObj: {
type: Object,
default: () => ({})
},
activedType: {
type: String,
},
attributes: {
type: Object,
default: () => ({})
}
},
data() {
@@ -84,31 +99,20 @@ export default {
}
},
computed: {
priceParts() {
const price = String(this.item.price || '0.00');
const parts = price.split('.');
return {
integer: parts[0] || '0',
decimal: parts[1] || '00'
};
},
hasCoupon() {
return this.item.couponAmount !== undefined || this.item.couponText !== undefined;
return this.item.secDiscount || this.item.subsidy;
},
isSeckill() {
return this.item.isSeckill !== undefined ? this.item.isSeckill : true;
},
isLimitTime() {
return this.item.isLimitTime !== undefined ? this.item.isLimitTime : true;
},
isSpecialSupply() {
return this.item.isSpecialSupply !== undefined ? this.item.isSpecialSupply : true;
}
},
beforeDestroy() {
this.clearTimer();
},
methods: {
// 商品
onSelectProct(item) {
uni.navigateTo({
url: "/pages/other_package/productInfo/productInfo?id=" + item.id + "&activedType=" + this.activedType + "&activityId=" + item.activityId,
});
},
startCountdown() {
this.clearTimer();
this.updateCountdown();
@@ -160,11 +164,9 @@ export default {
<style lang="scss" scoped>
.seckill_card_container {
display: flex;
padding: 24rpx;
background-color: #ffffff;
border-radius: 24rpx;
margin-bottom: 20rpx;
box-sizing: border-box;
width: 100%;
}
@@ -206,38 +208,11 @@ export default {
display: flex;
align-items: center;
margin-bottom: 8rpx;
}
gap: 8rpx;
.tag_badge {
font-size: 18rpx;
font-weight: bold;
padding: 4rpx 10rpx;
border-radius: 6rpx;
display: flex;
align-items: center;
line-height: 1;
margin-right: 12rpx;
&:last-child {
margin-right: 0;
}
&.seckill {
background-color: #ff1212;
color: #ffffff;
border: 1rpx dashed #ffffff;
}
&.limit {
background-color: #ae61fa;
color: #ffffff;
}
&.special {
background-color: #333333;
color: #e2d2b2; // Gold/bronze text color
border: 1rpx solid #e2d2b2;
padding: 3rpx 10rpx;
.tag_image {
height: 28rpx;
display: block;
}
}
@@ -256,8 +231,8 @@ export default {
}
.product_title {
font-size: 28rpx;
color: #111111;
font-size: 26rpx;
color: #000;
font-weight: bold;
line-height: 40rpx;
word-break: break-all;
@@ -271,18 +246,32 @@ export default {
.coupon_row {
display: flex;
margin-bottom: 12rpx;
}
position: relative;
.coupon_badge {
position: absolute;
top: -12rpx;
background: linear-gradient(90deg, #b164fb 0%, #7632ff 100%);
color: #ffffff;
font-size: 20rpx;
font-weight: bold;
padding: 6rpx 16rpx;
padding: 4rpx 10rpx;
border-radius: 8rpx;
display: flex;
align-items: center;
&::after {
content: '';
position: absolute;
bottom: -8rpx;
left: 24rpx;
width: 0;
height: 0;
border-left: 8rpx solid transparent;
border-right: 8rpx solid transparent;
border-top: 8rpx solid #b164fb;
}
}
}
.flash_icon {
@@ -294,11 +283,29 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #f1ebff; // Light purple box background
background: linear-gradient(270deg, #F0E7FE 0%, rgba(240, 231, 254, 0) 100%);
border-radius: 12rpx;
padding: 10rpx 20rpx;
height: 80rpx;
border-radius: 16rpx;
width: 100%;
box-sizing: border-box;
position: relative;
.uni-image {
display: block;
width: 80rpx;
height: inherit;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
border-radius: 12rpx;
&.seckill-icon {
height: 80rpx;
}
}
}
.price_section {
@@ -329,14 +336,18 @@ export default {
font-size: 24rpx;
color: #999999;
text-decoration: line-through;
margin-left: 16rpx;
margin-left: 10rpx;
&.seckill {
color: #7934F6;
font-size: 20rpx;
text-decoration: none;
}
}
.alarm_btn_wrapper {
width: 56rpx;
height: 56rpx;
background-color: #ffffff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
manifest.json
+2 -2
View File
@@ -2,8 +2,8 @@
"name" : "信任桥",
"appid" : "__UNI__4910728",
"description" : "信任桥优品是一款集线上商城、线下联盟商家的DAO聚合商城；通过“有趣”“有利”“有希望”的卖货玩法，吸引消费者、推广者、商家、投资人参与生态，共同打造共创共享的全球产业生态。",
"versionName" : "1.0.2",
"versionCode" : 163,
"versionName" : "1.0.3",
"versionCode" : 164,
"transformPx" : false,
/* 5+App特有相关 */
"app-plus" : {
pages.json
+23 -2
View File
@@ -10,7 +10,6 @@
},
"pages": [
//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/order_package/launch_page/launch_page",
"style": {
@@ -35,7 +34,6 @@
"navigationStyle": "custom"
}
},
{
"path": "pages/supply_chain/supply_chain",
"style": {
@@ -637,6 +635,29 @@
}
}
]
},
{
"root": "pages/active",
"pages": [
{
"path": "limited-time/limited-time",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "super-subsidy/super-subsidy",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "newcomer-exclusive/newcomer-exclusive",
"style": {
"navigationStyle": "custom"
}
}
]
}
],
"tabBar": {
pages/active/limited-time/limited-time.vue
+436
View File
@@ -0,0 +1,436 @@
<template>
<view class="content-two">
<TopSafe></TopSafe>
<view class="product_info_header_warp">
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
@change="(e) => (currentNum = e.current)">
<template #indicator>
<view class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</up-swiper>
<view class="img_comm left_warp">
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00"
@click="jumpLeft"></up-image>
</view>
</view>
<view class="tab-view">
<!-- 限时秒杀卡片 -->
<view class="tab-card">
<view
class="tab-item"
:class="{ active: activeTab === index }"
@click="onActiveTabChange(index)"
v-for="(item, index) in activeTabList"
:key="index"
>
<text class="tab-text">{{ item.name }}</text>
</view>
</view>
<!-- 限时秒杀标签 -->
<view class="tab-list-container">
<view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
<text class="text-28 text-space" :style="{
color: curTab == index ? '#7A35F6' : '#666',
}">{{ item.name }}</text>
<!-- <view class="line" v-if="curTab == index"></view> -->
</view>
</view>
</view>
<view class="setting-view">
<view class="name-box">
<mescroll-uni ref="mescrollRef" @down="downCallback" @up="upCallback" :up="upOption" :down="downOption"
@init="mescrollInit" :fixed="false">
<!-- 原来单个 v-for 替换成两列 -->
<view class="mescrollUniView" v-for="item in dataList" :key="item.id">
<productSeckillCard :item="item" actived-type="seckill" :attributes="attributes" />
</view>
</mescroll-uni>
</view>
</view>
<!-- #ifndef H5 || MP-WEIXIN-->
<CustomTabBar :tabIndex="2" />
<!-- #endif -->
<up-toast ref="uToastRef"></up-toast>
</view>
</template>
<script>
import { toRaw } from "vue";
import { getCascadeCategory, getCarouselImage } from "@/api/common.js";
import Header from "@/components/common/header.vue";
import TopSafe from "@/components/common/top-safe.nvue";
import MyBtn from "@/components/common/my-btn.vue";
import PingItem from "@/components/shop/ping-item.vue";
import { getSeckillGoodsList, getSeckillCurrent, getSeckillPreview } from "@/api/product.js";
import CustomTabBar from "@/components/custom-tab-bar.vue";
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
import productSeckillCard from "@/components/common/product-seckill-card.vue";
import { APP_PAGE_TYPE } from "@/utils/enumUtils.js";
export default {
mixins: [MescrollMixin],
components: { Header, TopSafe, MyBtn, PingItem, CustomTabBar, MescrollUni, productSeckillCard },
data() {
return {
swiperList: [],
currentNum: 0,
activityId: "",
dataList: [],
tabList: [{ name: "推荐" }],
curTab: 0,
activeTab: 0,
activeTabList: [
{ name: "今日秒杀", type: "current" },
{ name: "活动预告", type: "preview" }
],
upOption: {
auto: false,
page: {
size: 10, // 每页数据的数量,默认10
},
noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
empty: {
tip: `空空如也`,
},
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
downOption: {
auto: false,
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
mescroll: null,
attributes: {}, // 限时秒杀卡片属性
};
},
onLoad() {
this.init();
this.getCarouselImage()
},
methods: {
// 查询轮播图
async getCarouselImage() {
const params = {
pageUi: APP_PAGE_TYPE.SECKILL,
};
const resp = await getCarouselImage(params);
if (resp && resp.bizcode === 100) {
const data = resp.data || [];
this.swiperList =
data.length !== 0 ? data.map((obj) => obj.carouselImage) : [];
}
},
// 获取秒杀
onGetSeckillCurrent(type = 'current') {
const url = type === 'current' ? getSeckillCurrent : getSeckillPreview;
url().then((res) => {
if (res.bizcode === 100) {
this.activityId = res.data.activityId;
console.log('获取秒杀当前时间',res.data);
this.attributes ={
leftTime: res.data.leftTime || null,
}
this.$nextTick(() => {
this.mescroll && this.mescroll.resetUpScroll();
});
} else {
this.mescroll && this.mescroll.endErr();
}
}).catch(() => {
this.mescroll && this.mescroll.endErr();
});
},
upCallback(page) {
if (!this.activityId) {
this.mescroll && this.mescroll.endErr();
return;
}
let params = {
page: page.num,
pageSize: page.size,
activityId: this.activityId,
};
if (this.curTab != 0) {
params["categoryId"] = this.tabList[this.curTab].id;
} else {
params["isRecomm"] = true;
}
getSeckillGoodsList(params).then((res) => {
let curPageLen = res.data?.entitys ? res.data.entitys.length : 0;
if (page.num === 1) this.dataList = [];
if (res.data?.entitys) {
this.dataList = this.dataList.concat(res.data.entitys);
}
console.log(this.dataList);
this.mescroll.endBySize(curPageLen, res.data ? res.data.totalCount : 0);
}).catch(() => {
this.mescroll && this.mescroll.endErr();
});
},
downCallback() {
this.$nextTick(function () {
this.mescroll && this.mescroll.resetUpScroll();
});
},
mescrollInit(mescroll) {
this.mescroll = mescroll;
},
async cascadeCategory() {
getCascadeCategory({ parentId: 0 }).then((res) => {
if (res && res.bizcode === 100) {
res.data.forEach((item) => {
this.tabList.push(item);
});
}
});
},
onTab(index) {
if (index != this.curTab) {
this.curTab = index;
this.dataList = [];
this.downCallback();
}
},
onActiveTabChange(index) {
if (index !== this.activeTab) {
this.activeTab = index;
this.dataList = [];
const item = this.activeTabList[index];
this.onGetSeckillCurrent(item.type);
}
},
init() {
this.onGetSeckillCurrent();
this.cascadeCategory();
},
jumpLeft() {
uni.navigateBack({
delta: 1, // 返回的页面数，默认为1,返回到上一级
});
},
onSwiper(index) {
uni.previewImage({
current: index,
loop: true,
urls: this.swiperList,
});
},
},
};
</script>
<style lang="scss" scoped>
.content-two {
height: calc(100vh);
background-color: #fff;
display: flex;
flex-direction: column;
}
.product_info_header_warp {
position: relative;
.product_info_header_swiper {
height: 600rpx !important;
border-radius: 0 !important;
::v-deep(.u-swiper__wrapper) {
height: 600rpx !important;
.u-swiper__wrapper {
height: 600rpx !important;
.u-swiper__wrapper__item__wrapper__image {
height: 600rpx !important;
border-radius: 0 !important;
}
}
}
}
.img_comm {
position: absolute;
top: 140rpx;
}
.left_warp {
left: 40rpx;
}
.right_warp {
right: 40rpx;
}
}
.head-view {
width: 100%;
min-height: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
.head-search {
width: 100%;
height: 76rpx;
padding: 0 24rpx;
flex-direction: row;
display: flex;
background-color: #f7f7f7;
align-items: center;
border-radius: 16rpx;
}
}
.tab-box {
width: 100%;
height: 160rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
.tab-item {
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
.tab-img {
width: 56rpx;
height: 56rpx;
}
.tab-name {
font-size: 28rpx;
margin-top: 24rpx;
}
}
}
.tab-card {
width: 100%;
height: 74rpx;
display: flex;
align-items: center;
background-color: #f5f5f5;
border-radius: 12rpx;
padding: 0 4rpx;
margin-bottom: 16rpx;
.tab-item {
flex: 1;
height: 60rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10rpx;
background-color: transparent;
transition: all 0.3s ease;
&.active {
background-color: #fff;
.tab-text {
color: #7A35F6;
font-weight: 600;
}
}
.tab-text {
font-size: 28rpx;
color: #666666;
transition: color 0.3s ease;
}
}
}
.tab-view {
border-top-left-radius: 20rpx !important;
border-top-right-radius: 20rpx !important;
width: 100%;
display: flex;
flex-direction: column;
padding: 24rpx 32rpx 0;
box-sizing: border-box;
background-color: #fff;;
overflow-x: auto;
position: absolute;
top: 520rpx;
left: 0;
.tab-list-container{
width: 100%;
height: 60rpx;
display: flex;
flex-direction: row;
align-items: center;
}
.tab-list {
margin-right: 24rpx;
display: flex;
flex-direction: column;
height: 60rpx;
min-height: 60rpx;
align-items: center;
justify-content: space-between;
}
}
.setting-view {
margin-top: 0;
width: 100%;
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
overflow-y: auto;
padding: 0 32rpx;
box-sizing: border-box;
position: relative;
margin-top: 106rpx;
.name-box {
width: 100%;
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
.mescrollUniView {
width: calc(100vw - 48rpx);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.fall-col {
width: 332rpx;
/* 与 PingItem 宽度一致 */
height: 100%;
}
}
}
}
</style>
pages/active/newcomer-exclusive/newcomer-exclusive.vue
+355
View File
@@ -0,0 +1,355 @@
<template>
<view class="content-two">
<TopSafe></TopSafe>
<view class="product_info_header_warp">
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
@change="(e) => (currentNum = e.current)">
<template #indicator>
<view class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</up-swiper>
<view class="img_comm left_warp">
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00"
@click="jumpLeft"></up-image>
</view>
</view>
<view class="tab-view">
<view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
<text class="text-28 text-space" :style="{
color: curTab == index ? '#7A35F6' : '#666',
}">{{ item.name }}</text>
<view class="line" v-if="curTab == index"></view>
</view>
</view>
<view class="setting-view">
<view class="name-box">
<mescroll-uni ref="mescrollRef" @down="downCallback" @up="upCallback" :up="upOption" :down="downOption"
@init="mescrollInit" :fixed="false">
<!-- 原来单个 v-for 替换成两列 -->
<view class="mescrollUniView" v-for="item in dataList" :key="item.id">
<productSeckillCard :item="item" actived-type="newcomer" />
</view>
</mescroll-uni>
</view>
</view>
<!-- #ifndef H5 || MP-WEIXIN-->
<CustomTabBar :tabIndex="2" />
<!-- #endif -->
<up-toast ref="uToastRef"></up-toast>
</view>
</template>
<script>
import { toRaw } from "vue";
import { getCascadeCategory, getCarouselImage } from "@/api/common.js";
import Header from "@/components/common/header.vue";
import TopSafe from "@/components/common/top-safe.nvue";
import MyBtn from "@/components/common/my-btn.vue";
import PingItem from "@/components/shop/ping-item.vue";
import { searchList, } from "@/api/product.js";
import CustomTabBar from "@/components/custom-tab-bar.vue";
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
import productSeckillCard from "@/components/common/product-seckill-card.vue";
import { APP_PAGE_TYPE } from "@/utils/enumUtils.js";
export default {
mixins: [MescrollMixin],
components: { Header, TopSafe, MyBtn, PingItem, CustomTabBar, MescrollUni, productSeckillCard },
data() {
return {
swiperList: [],
currentNum: 0,
activityId: "",
dataList: [],
tabList: [{ name: "推荐" }],
curTab: 0,
upOption: {
auto: false,
page: {
size: 10, // 每页数据的数量,默认10
},
noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
empty: {
tip: `空空如也`,
},
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
downOption: {
auto: false,
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
mescroll: null,
};
},
onLoad() {
this.cascadeCategory();
this.getCarouselImage()
this.upCallback({ num: 1, size: 10 });
},
methods: {
// 查询轮播图
async getCarouselImage() {
const params = {
pageUi: APP_PAGE_TYPE.NEW,
};
const resp = await getCarouselImage(params);
if (resp && resp.bizcode === 100) {
const data = resp.data || [];
this.swiperList =
data.length !== 0 ? data.map((obj) => obj.carouselImage) : [];
}
},
// 获取秒杀
// onGetSeckillCurrent() {
// getSeckillCurrent().then((res) => {
// console.log("获取秒杀", res);
// if (res.bizcode === 100) {
// this.activityId = res.data.activityId;
// this.$nextTick(() => {
// this.mescroll && this.mescroll.resetUpScroll();
// });
// } else {
// this.mescroll && this.mescroll.endErr();
// }
// }).catch(() => {
// this.mescroll && this.mescroll.endErr();
// });
// },
upCallback(page) {
let params = {
page: page.num,
pageSize: page.size,
// tag:
};
if (this.curTab != 0) {
params["categoryId"] = this.tabList[this.curTab].id;
} else {
params["isRecomm"] = true;
}
searchList(params).then((res) => {
let curPageLen = res.data ? res.data.length : 0;
if (res.data) {
this.dataList = this.dataList.concat(res.data);
}
console.log(this.dataList);
this.mescroll.endBySize(curPageLen, res.data ? res.data.totalCount : 0);
}).catch(() => {
this.mescroll && this.mescroll.endErr();
});
},
downCallback() {
this.$nextTick(function () {
this.mescroll && this.mescroll.resetUpScroll();
});
},
mescrollInit(mescroll) {
this.mescroll = mescroll;
},
async cascadeCategory() {
getCascadeCategory({ parentId: 0 }).then((res) => {
if (res && res.bizcode === 100) {
res.data.forEach((item) => {
this.tabList.push(item);
});
}
});
},
onTab(index) {
if (index != this.curTab) {
this.curTab = index;
this.dataList = [];
this.downCallback();
}
},
jumpLeft() {
uni.navigateBack({
delta: 1, // 返回的页面数，默认为1,返回到上一级
});
},
onSwiper(index) {
uni.previewImage({
current: index,
loop: true,
urls: this.swiperList,
});
},
},
};
</script>
<style lang="scss" scoped>
.content-two {
height: calc(100vh);
background-color: #fff;
}
.product_info_header_warp {
position: relative;
.product_info_header_swiper {
height: 600rpx !important;
border-radius: 0 !important;
::v-deep(.u-swiper__wrapper) {
height: 600rpx !important;
.u-swiper__wrapper {
height: 600rpx !important;
.u-swiper__wrapper__item__wrapper__image {
height: 600rpx !important;
border-radius: 0 !important;
}
}
}
}
.img_comm {
position: absolute;
top: 140rpx;
}
.left_warp {
left: 40rpx;
}
.right_warp {
right: 40rpx;
}
}
.head-view {
width: 100%;
min-height: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
.head-search {
width: 100%;
height: 76rpx;
padding: 0 24rpx;
flex-direction: row;
display: flex;
background-color: #f7f7f7;
align-items: center;
border-radius: 16rpx;
}
}
.tab-box {
width: 100%;
height: 160rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
.tab-item {
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
.tab-img {
width: 56rpx;
height: 56rpx;
}
.tab-name {
font-size: 28rpx;
margin-top: 24rpx;
}
}
}
.tab-view {
border-top-left-radius: 20rpx !important;
border-top-right-radius: 20rpx !important;
width: 100%;
height: 80rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
position: absolute;
top: 520rpx;
left: 0;
.tab-list {
margin-right: 24rpx;
display: flex;
flex-direction: column;
height: 60rpx;
min-height: 60rpx;
align-items: center;
justify-content: space-between;
margin-top: 22rpx;
}
.line {
width: 48rpx;
height: 6rpx;
background-color: #7a35f6;
}
}
.setting-view {
margin-top: 20rpx;
width: 100%;
height: calc(100vh - 88rpx - 80rpx - 100rpx - var(--status-bar-height));
display: flex;
flex-direction: column;
align-items: center;
overflow-y: auto;
padding: 0 32rpx;
box-sizing: border-box;
position: relative;
.name-box {
width: 100%;
height: calc(100vh - 88rpx - 80rpx - 100rpx - var(--status-bar-height));
display: flex;
flex-direction: column;
align-items: center;
.mescrollUniView {
width: calc(100vw - 48rpx);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.fall-col {
width: 332rpx;
/* 与 PingItem 宽度一致 */
height: 100%;
}
}
}
}
</style>
pages/active/super-subsidy/super-subsidy.vue
+337
View File
@@ -0,0 +1,337 @@
<template>
<view class="content-two">
<TopSafe></TopSafe>
<view class="product_info_header_warp">
<up-swiper :list="swiperList" class="product_info_header_swiper" @click="onSwiper"
@change="(e) => (currentNum = e.current)">
<template #indicator>
<view class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ swiperList.length }}</text>
</view>
</template>
</up-swiper>
<view class="img_comm left_warp">
<up-image src="/static/common/left_b_st.png" width="30" height="30" bgColor="#f1f6ff00"
@click="jumpLeft"></up-image>
</view>
</view>
<view class="tab-view">
<view class="tab-list" @click="onTab(index)" v-for="(item, index) in tabList" :key="index">
<text class="text-28 text-space" :style="{
color: curTab == index ? '#7A35F6' : '#666',
}">{{ item.name }}</text>
<view class="line" v-if="curTab == index"></view>
</view>
</view>
<view class="setting-view">
<view class="name-box">
<mescroll-uni ref="mescrollRef" @down="downCallback" @up="upCallback" :up="upOption" :down="downOption"
@init="mescrollInit" :fixed="false">
<!-- 原来单个 v-for 替换成两列 -->
<view class="mescrollUniView" v-for="item in dataList" :key="item.id">
<productSeckillCard :item="item" actived-type="subsidy" />
</view>
</mescroll-uni>
</view>
</view>
<!-- #ifndef H5 || MP-WEIXIN-->
<CustomTabBar :tabIndex="2" />
<!-- #endif -->
<up-toast ref="uToastRef"></up-toast>
</view>
</template>
<script>
import { getCascadeCategory, getCarouselImage } from "@/api/common.js";
import Header from "@/components/common/header.vue";
import TopSafe from "@/components/common/top-safe.nvue";
import MyBtn from "@/components/common/my-btn.vue";
import PingItem from "@/components/shop/ping-item.vue";
import { searchList } from "@/api/product.js";
import CustomTabBar from "@/components/custom-tab-bar.vue";
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
import productSeckillCard from "@/components/common/product-seckill-card.vue";
import { APP_PAGE_TYPE } from "@/utils/enumUtils.js";
export default {
mixins: [MescrollMixin],
components: { Header, TopSafe, MyBtn, PingItem, CustomTabBar, MescrollUni, productSeckillCard },
data() {
return {
swiperList: [],
currentNum: 0,
dataList: [],
tabList: [{ name: "推荐" }],
curTab: 0,
upOption: {
auto: false,
page: {
size: 10, // 每页数据的数量,默认10
},
noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
empty: {
tip: `空空如也`,
},
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
downOption: {
auto: false,
textColor: "#333",
bgColor: "rgba(0,0,0,0)",
},
mescroll: null,
};
},
onLoad() {
this.cascadeCategory();
this.getCarouselImage()
this.upCallback({ num: 1, size: 10 });
},
methods: {
// 查询轮播图
async getCarouselImage() {
const params = {
pageUi: APP_PAGE_TYPE.SUPER_SUBSIDY,
};
const resp = await getCarouselImage(params);
if (resp && resp.bizcode === 100) {
const data = resp.data || [];
this.swiperList =
data.length !== 0 ? data.map((obj) => obj.carouselImage) : [];
}
},
upCallback(page) {
let params = {
page: page.num,
pageSize: page.size,
type: -2
};
if (this.curTab != 0) {
params["categoryId"] = this.tabList[this.curTab].id;
} else {
params["isRecomm"] = true;
}
searchList(params).then((res) => {
let curPageLen = res.data ? res.data.length : 0;
if (res.data) {
this.dataList = this.dataList.concat(res.data);
}
console.log(this.dataList);
this.mescroll.endBySize(curPageLen, res.data ? res.data.totalCount : 0);
}).catch(() => {
this.mescroll && this.mescroll.endErr();
});
},
downCallback() {
this.$nextTick(function () {
this.mescroll && this.mescroll.resetUpScroll();
});
},
mescrollInit(mescroll) {
this.mescroll = mescroll;
},
async cascadeCategory() {
getCascadeCategory({ parentId: 0 }).then((res) => {
if (res && res.bizcode === 100) {
res.data.forEach((item) => {
this.tabList.push(item);
});
}
});
},
onTab(index) {
if (index != this.curTab) {
this.curTab = index;
this.dataList = [];
this.downCallback();
}
},
jumpLeft() {
uni.navigateBack({
delta: 1, // 返回的页面数，默认为1,返回到上一级
});
},
onSwiper(index) {
uni.previewImage({
current: index,
loop: true,
urls: this.swiperList,
});
},
},
};
</script>
<style lang="scss" scoped>
.content-two {
height: calc(100vh);
background-color: #fff;
}
.product_info_header_warp {
position: relative;
.product_info_header_swiper {
height: 600rpx !important;
border-radius: 0 !important;
::v-deep(.u-swiper__wrapper) {
height: 600rpx !important;
.u-swiper__wrapper {
height: 600rpx !important;
.u-swiper__wrapper__item__wrapper__image {
height: 600rpx !important;
border-radius: 0 !important;
}
}
}
}
.img_comm {
position: absolute;
top: 140rpx;
}
.left_warp {
left: 40rpx;
}
.right_warp {
right: 40rpx;
}
}
.head-view {
width: 100%;
min-height: 88rpx;
height: 88rpx;
display: flex;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
.head-search {
width: 100%;
height: 76rpx;
padding: 0 24rpx;
flex-direction: row;
display: flex;
background-color: #f7f7f7;
align-items: center;
border-radius: 16rpx;
}
}
.tab-box {
width: 100%;
height: 160rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
.tab-item {
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
.tab-img {
width: 56rpx;
height: 56rpx;
}
.tab-name {
font-size: 28rpx;
margin-top: 24rpx;
}
}
}
.tab-view {
border-top-left-radius: 20rpx !important;
border-top-right-radius: 20rpx !important;
width: 100%;
height: 80rpx;
min-height: 80rpx;
display: flex;
flex-direction: row;
padding: 0 32rpx;
box-sizing: border-box;
background-color: #fff;
overflow-x: auto;
position: absolute;
top: 520rpx;
left: 0;
.tab-list {
margin-right: 24rpx;
display: flex;
flex-direction: column;
height: 60rpx;
min-height: 60rpx;
align-items: center;
justify-content: space-between;
margin-top: 22rpx;
}
.line {
width: 48rpx;
height: 6rpx;
background-color: #7a35f6;
}
}
.setting-view {
margin-top: 20rpx;
width: 100%;
height: calc(100vh - 88rpx - 80rpx - 100rpx - var(--status-bar-height));
display: flex;
flex-direction: column;
align-items: center;
overflow-y: auto;
padding: 0 32rpx;
box-sizing: border-box;
position: relative;
.name-box {
width: 100%;
height: calc(100vh - 88rpx - 80rpx - 100rpx - var(--status-bar-height));
display: flex;
flex-direction: column;
align-items: center;
.mescrollUniView {
width: calc(100vw - 48rpx);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.fall-col {
width: 332rpx;
/* 与 PingItem 宽度一致 */
height: 100%;
}
}
}
}
</style>
pages/home/home.vue
+170 -124
View File
@@ -52,7 +52,7 @@
<view class="yp_item" v-for="item in faddishProduct" :key="item.id"
@click.stop="jumpInfo(item)">
<view class="yp_item_image_wrapper">
<up-image :src="item.url" width="100%" height="90" bgColor="#f1f6ff00"
<up-image :src="item.url" width="100%" height="80" bgColor="#f1f6ff00"
shape="square" radius="15"></up-image>
</view>
<view class="yp_item_info">
@@ -66,8 +66,7 @@
</view>
<!-- 带灰色背景的内容 -->
<view class="home_content_warp">
<view class="home_content_warp Hot_Picks_content">
<!-- 积分兑换，红包抽奖 -->
<view class="min_card_warp">
<!-- 积分兑换 -->
@@ -89,26 +88,47 @@
<view class="min_card_item_title">红包抽奖</view>
<view class="content_msg">
<view>现金红包等你拿！</view>
</view>
</view>
<up-image src="https://static.tbmall.xin/static/home/min_card_hbcj_2.png" width="55" height="55"
<up-image src="https://static.tbmall.xin/static/home/min_card_hbcj_2.png" width="45" height="45"
bgColor="#f1f6ff00"></up-image>
</view>
</view>
<view class="product_comm_tip">
<view class="home_actived_warp">
<view class="home_actived_item_warp" v-for="item in homeActivedList" :key="item.id">
<view class="home_actived_item"
v-if="(item.activedType === 'seckill' && seckillGoodsList.length !== 0) || (item.activedType === 'super' && superGoodsList.length !== 0)">
<view class="product_comm_tip" @click="jumpPage(item.path)">
<view class="product_comm_tip_left">
<image class="uni-image" :src="item.title_icon"></image>
<view class="tip_title" v-if="item.title_text">{{ item.title_text }}</view>
<view class="tip_title_lable">{{ item.title }}</view>
</view>
<view class="product_comm_tip_right">{{ item.rightText }}
<up-image src="/static/common/right.png" width="15" height="15"
bgColor="#f1f6ff00"></up-image>
</view>
</view>
<!-- 限时秒杀 -->
<view class="product_seckill_card" v-for="item in seckillList" :key="item.id">
<productSeckillCard />
<view v-if="item.activedType === 'seckill'">
<view class="product_seckill_card" v-for="ele in seckillGoodsList" :key="ele.id">
<productSeckillCard :item="ele" :actived-type="item.activedType" />
</view>
</view>
<!-- 超级补贴 -->
<view v-if="item.activedType === 'super'">
<view class="product_seckill_card" v-for="ele in superGoodsList" :key="ele.id">
<productSeckillCard :item="ele" :actived-type="item.activedType" />
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 暂未开放 -->
<up-modal :show="openShow" :showConfirmButton="false">
@@ -128,8 +148,7 @@
<!-- #ifndef H5 || MP-WEIXIN-->
<CustomTabBar :tabIndex="0" />
<!-- #endif -->
<up-action-sheet :actions="languageList" :show="languageShow" cancelText="取消"
@close="languageShow = false"></up-action-sheet>
<up-overlay :show="bannerShow">
<view class="up_content" @tap.stop>
<view class="uni-banner">
@@ -173,21 +192,20 @@
</template>
<script>
import {
getGoodsDetail
} from "@/api/product.js";
import choiceness from "@/components/choiceness/choiceness.vue";
import {
searchList
getGoodsDetail,
searchList,
getSeckillCurrent,
getSeckillGoodsList,
getGoodsTags,
} from "@/api/product.js";
import {
getCascadeCategory,
checkAppVersion,
getCarouselImage,
} from "@/api/common.js";
import {
SEARCH_TYPE,
APP_PAGE_TYPE
SORT_TYPE,
} from "@/utils/enumUtils.js";
import CustomTabBar from "@/components/custom-tab-bar.vue"; // 引入自定义组件路径可能需要根据项目结构调整
import dayjs from "dayjs";
@@ -200,7 +218,6 @@ import {
} from "@/utils/index.js";
import HomePopup from "@/components/common/home-popup.vue";
import productSeckillCard from "@/components/common/product-seckill-card.vue";
import {
SHARE_URL
} from "@/utils/config.js";
@@ -209,27 +226,14 @@ export default {
components: {
choiceness,
CustomTabBar,
HomePopup
HomePopup,
productSeckillCard
},
data() {
return {
swiperList: [],
currentNum: 0,
sortList: [],
languageShow: false, // 语言选项
languageList: [{
name: "中文",
key: "CN",
},
{
name: "英文",
key: "EN",
},
],
currentLanguage: {},
yxProduct: [], // 好物优选列表
faddishProduct: [], // 爆款专区
hotList: [], // 热门
productLoading: false,
openShow: false,
platformType: null, // 当前设备信息
@@ -243,12 +247,30 @@ export default {
homeShow: false,
newsList: [], // 公告列表
newsShow: false, // 是否显示公告弹窗
seckillGoodsList: [], // 秒杀商品列表
superGoodsList: [], // 超级补贴商品列表
homeActivedList: [
{
id: 1,
title: '超级补贴',
title_icon: 'https://static.tbmall.xin/static/new-home/home_4.png',
path: 'super-subsidy',
rightText: '官方补贴 .100%正品',
activedType: 'super'
}, {
id: 2,
title: '限时秒杀',
title_text: '活动预告',
title_icon: 'https://static.tbmall.xin/static/new-home/home_3.png',
path: 'limited-time',
rightText: '专属补贴 . 低价秒杀',
activedType: 'seckill'
},
], // 首页活动列表
};
},
onShow() {
// 获取设备是安卓还是ios
const appUpdate = uni.getStorageSync("platform");
const versionUpdateTime = uni.getStorageSync("versionUpdateTime");
@@ -269,28 +291,19 @@ export default {
}
// #endif
this.getSortList();
this.querySearchList(SEARCH_TYPE.SOMETHING); // 好物专区
this.querySearchList(SEARCH_TYPE.EXPLOSIVE); // 爆单专区
this.getCarouselImage();
this.onNews(); // 获取公告
// 秒杀
this.onGetSeckillCurrent();
this.onGetSuperGoodsList();
},
onLoad() {
/*#ifdef APP-PLUS*/
uni.hideTabBar({
animation: false,
});
// 检查是否需要展示启动页
// const hasShown = getApp().globalData.launchShown;
// if (!hasShown) {
// getApp().globalData.launchShown = true; // 置为已展示
// // ⚠️ 不让首页渲染
// this.pageReady = false;
// uni.navigateTo({
// url: '/pages/order_package/launch_page/launch_page'
// });
// return; // 阻止后续渲染
// }
/*#endif*/
// 不需要启动页，才渲染首页
this.pageReady = true;
@@ -298,6 +311,44 @@ export default {
},
mounted() { },
methods: {
// 获取秒杀
onGetSeckillCurrent() {
getSeckillCurrent().then((res) => {
console.log("获取秒杀", res);
if (res.bizcode === 100) {
res.data.activityId && this.onGetSeckillGoodsList(res.data.activityId, 'seckillGoodsList');
}
});
},
// 获取秒杀商品
onGetSeckillGoodsList(activityId, key) {
getSeckillGoodsList({
activityId: activityId,
page: 1,
pageSize: 3,
}).then((res) => {
console.log("获取秒杀商品", res);
if (res.bizcode === 100) {
this[key] = res.data.entitys || [];
console.log(this[key]);
}
});
},
// 商品列表
onGetSuperGoodsList() {
searchList({
type: -2,
page: 1,
pageSize: 3,
}).then((res) => {
console.log("商品列表", res);
if (res.bizcode === 100) {
this.superGoodsList = res.data || [];
console.log(this.superGoodsList);
}
});
},
// 获取公告
jumpNewSearch(type) {
if (type === 'list') {
@@ -512,46 +563,22 @@ export default {
}
},
// 查询轮播图
async getCarouselImage() {
const params = {
pageUi: APP_PAGE_TYPE.HOME,
};
const resp = await getCarouselImage(params);
if (resp && resp.bizcode === 100) {
const data = resp.data || [];
this.swiperList =
data.length !== 0 ? data.map((obj) => obj.carouselImage) : [];
}
},
jumpIntegral() {
uni.navigateTo({
url: "/pages/rwa_package/shop/fen-shop",
});
},
jumpPage(path) {
uni.navigateTo({
url: `/pages/active/${path}/${path}`,
});
},
jumpTurntable() {
// uni.navigateTo({
// url: '/pages/other_package/turntable/turntable?backPath=home',
// })
uni.navigateTo({
url: "/pages/other_package/nine-grid/nine-grid?backPath=home",
});
},
jumpPrdference() {
uni.switchTab({
url: "/pages/supply_chain/supply_chain",
});
},
jumpWelcome() {
uni.navigateTo({
url: "/pages/login_package/welcome/welcome",
});
},
jumpSearch() {
uni.navigateTo({
url: "/pages/rwa_package/dongjian/search",
});
},
/**
* 查询商品列表
*/
@@ -565,57 +592,30 @@ export default {
};
const resp = await searchList(params);
if (resp && resp.bizcode === 100) {
if (type === SEARCH_TYPE.SOMETHING) {
// 好物优选
this.yxProduct = resp.data;
} else if (type === SEARCH_TYPE.EXPLOSIVE) {
// 爆单专区
this.faddishProduct = resp.data;
}
}
this.productLoading = false;
},
/**
* 查询分类列表
*/
async getSortList() {
this.sortList = [
{
id: 1,
name: "超级补贴",
icon: 'https://static.tbmall.xin/static/new-home/home_2.png'
}, {
id: 2,
name: "限时秒杀",
icon: 'https://static.tbmall.xin/static/new-home/home_3.png'
}, {
id: 3,
name: "全网爆款",
icon: 'https://static.tbmall.xin/static/new-home/home_6.png'
}, {
id: 3,
name: "低价好物",
icon: 'https://static.tbmall.xin/static/new-home/home_4.png'
}, {
id: 4,
name: "新人专享",
icon: 'https://static.tbmall.xin/static/new-home/home_4.png'
const resp = await getGoodsTags({ type: 4 });
if (resp && resp.bizcode === 100) {
this.sortList = resp.data.sort((a, b) => a.sort - b.sort);
}
];
// const resp = await getCascadeCategory({
// parentId: 0
// });
// if (resp && resp.bizcode === 100) {
// this.sortList = resp.data.slice(0, 10);
// }
},
// 跳转到分类栏目
jumpSort(item) {
uni.setStorageSync("sortId", item.id);
uni.switchTab({
// 首页
url: "/pages/sort/sort",
jumpSort({ id }) {
const item = SORT_TYPE.find((item) => item.key == id);
console.log('跳转到分类栏目', item);
if (item.path.includes("/pages/supply_chain/supply_chain")) {
uni.setStorageSync('sortParams', { key: item.key, value: item.value });
return uni.switchTab({
url: item.path,
});
}
uni.navigateTo({url: item.path,})
},
// 跳转到商品详情
jumpInfo(item) {
@@ -634,7 +634,7 @@ export default {
<style lang="scss" scoped>
.home_warp {
background: #fff;
background: #F4F4F4;
height: calc(100vh - env(safe-area-inset-bottom)); // 是底部的导航栏高度
overflow: auto;
position: relative;
@@ -732,7 +732,7 @@ export default {
}
.home_content_warp {
padding: 0 30rpx;
padding-bottom: 100rpx;
&.Hot_Picks_Zone {
width: 100%;
@@ -996,7 +996,8 @@ export default {
display: flex;
gap: 10rpx;
justify-content: space-between;
margin-top: 24rpx;
padding: 30rpx 30rpx 0;
background-color: #fff;
.min_card_item {
padding: 10rpx 12rpx;
@@ -1037,11 +1038,56 @@ export default {
}
// 热门榜
.home_actived_warp {
.home_actived_item_warp{
padding: 0 30rpx 30rpx;
background-color: #fff;
margin-bottom: 30rpx;
&:last-child {
margin-bottom: 0;
}
}
.product_comm_tip {
display: flex;
justify-content: space-between;
padding: 20rpx 0;
.product_comm_tip_left {
display: flex;
align-items: center;
font-size: 32rpx;
.uni-image {
width: 50rpx;
height: 100%;
}
.tip_title {
color: #666666;
margin-right: 12rpx;
}
.tip_title_lable {
font-weight: 500;
color: #000000;
}
}
.product_comm_tip_right {
display: flex;
align-items: center;
font-size: 24rpx;
color: #666666;
::v-deep(.u-image) {
display: flex !important;
align-items: center !important;
margin-left: 10rpx;
}
}
}
}
}
.uni-banner-news {
pages/order_package/order_submit/order_submit.vue
+42 -12
View File
@@ -1,7 +1,6 @@
<template>
<view class="order_submit_warp">
<Header :leftTitle="$t('order.submit.title')" leftPathType="switchTab"
leftPath="/pages/shopping_cart/shopping_cart" />
<Header leftTitle="提交订单" leftPathType="switchTab" leftPath="/pages/shopping_cart/shopping_cart" />
<!-- 收件人信息 -->
<view class="order_submit_header_warp" @click="checkAddressShow(true, 'data')"
v-if="orderInfo.address && Object.keys(orderInfo.address).length !== 0">
@@ -188,7 +187,7 @@
<text class="text-32 text-zu">运费</text>
<text class="text-32 text-zu text-bold">￥{{ orderInfo.postage }}</text>
</view>
<view class="price-view" @click="couponShow = true">
<!-- <view class="price-view" @click="couponShow = true">
<text class="text-32 text-zu">优惠券</text>
<view style="display: flex; align-items: center;">
<view class="text-24 " style="margin-right:4rpx;color:#999;">{{ selectedCoupon ? `-${selectedCoupon.amount}` :
@@ -196,6 +195,14 @@
<up-image src="/static/common/right.png" width="12" height="12" bgColor="#f1f6ff00"
style="display:inline-block;vertical-align: middle;"></up-image>
</view>
</view> -->
<view class="price-view" @click="this.sed?.activedType == 'seckill' && allOrderInfo.activity?.activityPrice">
<text class="text-32 text-zu">秒杀价</text>
<view style="display: flex; align-items: center;">
<view class="seckill-tag">限时秒杀</view>
<view class="text-24 " style="margin-right:8rpx;color:#7934F6;font-size: 32rpx;font-weight: bold;">¥{{
allOrderInfo.activity?.activityPrice}}</view>
</view>
</view>
<view class="price-view" v-if="isCoupon">
<text class="text-32 text-zu">数字积分</text>
@@ -261,11 +268,11 @@
<view class="popup_but" @click="addressOk"> 确认 </view>
</view>
</up-popup>
<u-modal :show="tipsShow" title="提示" showCancelButton @cancel="onCancel" @confirm="onConfirm"
<u-modal :show="tipsShow" v-if="tipsShow" title="提示" showCancelButton @cancel="onCancel" @confirm="onConfirm"
:cancelText="type == 1 ? '取消' : '忘记密码'" :confirmText="type == 1 ? '去设置' : '重试'" confirmColor="#7934F6"
:content="content"></u-modal>
<u-keyboard ref="uKeyboard" mode="number" :show="show" @change="onChange" @backspace="onBackspace"
<u-keyboard ref="uKeyboard" mode="number" v-if="show" :show="show" @change="onChange" @backspace="onBackspace"
:dotDisabled="true" :tooltip="false">
<view style="background-color: #fff">
<view class="money">
@@ -287,7 +294,7 @@
<up-toast ref="uToastRef"></up-toast>
<!-- 优惠券选择弹框 -->
<CouponDialog :show="couponShow" @close="couponShow = false" @select="handleCouponSelect"></CouponDialog>
<CouponDialog :show="couponShow" v-if="couponShow" @close="couponShow = false" @select="handleCouponSelect"></CouponDialog>
</view>
</template>
@@ -297,19 +304,17 @@ import { getGoodsDetail } from "@/api/product.js";
import { getAddress } from "@/api/address.js";
import {
PAYMENT_WAY,
PAYMENT_WAY_,
PRODUCT_DELIVERY_TIME,
getValue,
WAY_LIST,
} from "@/utils/enumUtils.js";
import {
getSettleList,
settle,
settlementOrder,
updateGoodsNum,
setSeckillOrder
} from "@/api/cart.js";
import { getSupportPay } from "@/api/order.js";
import { feedback } from "@/api/payment.js";
import { assembleAddress } from "@/utils/index.js";
import Header from "@/components/header.vue";
import { getUserInfo } from "@/api/auth.js";
@@ -535,6 +540,10 @@ export default {
parmas["types"] = "1,2,3";
parmas.isDeduction = true;
}
if(this.sed.activedType == "seckill"){
parmas["types"] = "1,2,3";
}
const result = await getSupportPay(parmas);
if (result && result.bizcode === 100) {
const data = result.data || [];
@@ -613,13 +622,17 @@ export default {
if (this.isCoupon) {
params.type = -1;
}
if (this.sed?.activedType == "seckill") {
params.activityId = Number(this.sed?.activityId);
params.activityType = "seckill";
}
const resp = await getGoodsDetail(params);
if (resp && resp.bizcode === 100) {
const data = resp.data;
this.isPoints = data.type == 3 ? 1 : 0;
this.orderInfo = {
address: null,
amount: this.sed.goodsNum * this.sed.specsId.price,
amount:this.sed?.activedType == "seckill" ? data.activity?.activityPrice :this.sed.goodsNum * this.sed.specsId.price || 0,
postage: 0,
shops: [
{
@@ -886,9 +899,16 @@ export default {
params["goodsId"] = this.sed.id;
params["specsId"] = this.sed.specsId.id;
params["goodsNum"] = this.orderInfo.shops[0].addrTimes[0].goods[0].num;
if (this.isCoupon) params.payway2 = "vcoin";
console.log("秦星星params-----", this.sed?.activedType);
if (this.sed?.activedType == "seckill") {
params["activityId"] = Number(this.sed?.activityId); // 秒杀活动ID
resp = await setSeckillOrder(params);
} else {
if (this.isCoupon) params.payway2 = "vcoin";
resp = await settlementOrder(params);
}
} else {
params["cartIds"] = this.ids;
if (
@@ -1056,6 +1076,16 @@ export default {
display: flex;
flex-direction: row;
justify-content: space-between;
.seckill-tag {
background: #7934F6;
border-radius: 4rpx;
font-weight: 600;
font-size: 20rpx;
color: #FFFFFF;
padding: 4rpx 12rpx;
margin-right: 8rpx;
}
}
.way-option {
@@ -1115,7 +1145,7 @@ export default {
.order_submit_warp {
background-color: $app-bj;
height: calc(100vh - 200rpx);
height: calc(100% - 200rpx - env(safe-area-inset-bottom));
padding: 20rpx;
overflow-y: auto;
}
pages/other_package/productInfo/productInfo.vue
+35 -25
View File
@@ -321,7 +321,8 @@
<SharePopup ref="share" v-if="shareOpen" :show="shareShow" @close="onClose" @share="onShare" :id="id"
:text="orderInfo.name ? orderInfo.name : ''" :price="orderInfo.minPrice ? orderInfo.minPrice : ''"
:tu="swiperList.length && swiperList[0]"></SharePopup>
<EvaluateDialog ref="evaluateDialog" :show="evaluateDialogShow" @close="evaluateDialogShow = false" :evalId="id" :mainGraph="orderInfo.mainGraph" :name="orderInfo.name"></EvaluateDialog>
<EvaluateDialog ref="evaluateDialog" :show="evaluateDialogShow" @close="evaluateDialogShow = false" :evalId="id"
:mainGraph="orderInfo.mainGraph" :name="orderInfo.name"></EvaluateDialog>
<view class="hideCanvasView">
<canvas id="myCanvas" canvas-id="myCanvas" :style="{
height: bgObj.height + 'px',
@@ -333,7 +334,7 @@
<script>
import { getGoodsDetail, addGoods, getGoodsSpecs } from "@/api/product.js";
import { getValue, PRODUCT_DELIVERY_TIME } from "@/utils/enumUtils.js";
import { getValue, PRODUCT_DELIVERY_TIME, ACTIVITY_TYPE } from "@/utils/enumUtils.js";
import { copyData } from "@/utils/index.js";
import Evaluation from "@/pages/other_package/productInfo/evaluation.vue";
import EvaluateDialog from "@/pages/other_package/productInfo/evaluate-dialog.vue";
@@ -410,6 +411,8 @@ export default {
isSplash: false,
isCoupon: false, // 是否是优惠券商品
curAmount: 0, // 当前人剩余优惠券金额
activedType: "", // 活动类型
activityId: "", // 秒杀活动ID
};
},
onBackPress(options) {
@@ -425,6 +428,9 @@ export default {
},
onLoad(options) {
const id = options.id;
this.activedType = options.activedType;
this.activityId = options.activityId;
this.isCoupon = options.isPar;
if (this.isCoupon && options.curAmount) {
this.curAmount = options.curAmount;
@@ -840,10 +846,16 @@ export default {
if (this.isCoupon) {
params.type = -1;
}
if(this.activedType === 'seckill'){
params.activityId = this.activityId;
params.activityType = 'seckill';
}
const resp = await getGoodsDetail(params);
if (resp && resp.bizcode === 100) {
const data = resp.data;
this.isShowCart = data.type == 3 ? 1 : 0;
// 限时秒杀 和 积分兑换 不需要购物车
this.isShowCart = this.activedType === 'seckill' || data.type == 3 ? 1 : 0;
// 商品图
if (data.goodsGraph) {
this.swiperList = data.goodsGraph.split(",");
@@ -851,6 +863,9 @@ export default {
data.addressObj = {}; // 收件人地址
data.quantity = 1; // 数量
data.inventory = 0; // 库存
if(this.activedType === 'seckill'){
data.minPrice = data.activity?.activityPrice;
}
this.orderInfo = data;
}
},
@@ -1066,14 +1081,28 @@ export default {
specsId: selectTempl.id, // 规格ID
goodsNum: this.orderInfo.quantity, // 商品数量
};
console.log("selectTempl", selectTempl);
if (this.isShowCart == 1 || this.isCoupon) {
console.log("活动类型params---秦星星", params,this.isCoupon);
params["specsId"] = selectTempl;
let url = "";
if(this.activedType == "seckill"){
params["activedType"] = this.activedType; // 活动类型
params["activityId"] = this.activityId;// 秒杀活动ID
url = `/pages/order_package/order_submit/order_submit?sed=${JSON.stringify(
params
)}`;
}
if(this.isCoupon){
url =`/pages/order_package/order_submit/order_submit?sed=${JSON.stringify(
params
)}&address=${this.selectAddress?.id}&isCoupon=${this.isCoupon}`
}
uni.navigateTo({
url: `/pages/order_package/order_submit/order_submit?sed=${JSON.stringify(
params
)}&address=${this.selectAddress?.id}&isCoupon=${this.isCoupon}`,
url: url
});
return;
}
@@ -1091,9 +1120,6 @@ export default {
duration: 2000, // 持续时长，单位ms
});
}
// setTimeout(() => {
// this.checkSpecification(false, null);
// }, 2000)
}
},
// 跳转到分享页面
@@ -1124,22 +1150,6 @@ export default {
.product_info_header_warp {
position: relative;
// .product_info_header_swiper {
// height: 562.5rpx !important;
// ::v-deep(.u-swiper__wrapper) {
// height: 562.5rpx !important;
// .u-swiper__wrapper {
// height: 562.5rpx !important;
// .u-swiper__wrapper__item__wrapper__image {
// height: 562.5rpx !important;
// }
// }
// }
// }
.product_info_header_swiper {
height: 800rpx !important;
pages/sort/sort.vue
+3
View File
@@ -193,9 +193,11 @@ export default {
},
// 查询分类
async getSort(pId) {
const params = {
parentId: pId,
};
console.log('查询分类', params,pId);
const resp = await getCascadeCategory(params);
if (resp && resp.bizcode === 100) {
return resp.data;
@@ -207,6 +209,7 @@ export default {
},
// 点击左边的栏目切换
async swichMenu(item, index) {
console.log('点击左边的栏目切换',item, index, "item, index");
if (index == this.current) return;
this.tabbarContentLoading = true;
const firstData = await this.getSort(item.id);
pages/supply_chain/supply_chain.vue
+52 -68
View File
@@ -7,24 +7,6 @@
<text class="text-28 text-fu" style="margin-left: 12rpx">搜索</text>
</view>
</view>
<!-- 原来的tab切换 -->
<!-- <view class="tab-view">
<view
class="tab-list"
@click="onTab(index)"
v-for="(item, index) in tabList"
:key="index"
>
<text
class="text-28 text-space"
:style="{
color: curTab == index ? '#7A35F6' : '#666',
}"
>{{ item.name }}</text
>
<view class="line" v-if="curTab == index"></view>
</view>
</view> -->
<view class="tab-box">
<view
class="tab-item"
@@ -33,7 +15,7 @@
@click="onTab(index)"
>
<image
:src="curTab == index ? item.img : item.greyImg"
:src="curTab == index ? item.icon : item.icon"
mode="aspectFill"
class="tab-img"
></image>
@@ -89,13 +71,11 @@
</template>
<script>
import { toRaw } from "vue";
import { getCascadeCategory } from "@/api/common.js";
import Header from "@/components/common/header.vue";
import TopSafe from "@/components/common/top-safe.nvue";
import MyBtn from "@/components/common/my-btn.vue";
import PingItem from "@/components/shop/ping-item.vue";
import { searchList } from "@/api/product.js";
import { searchList,getGoodsTags } from "@/api/product.js";
import CustomTabBar from "@/components/custom-tab-bar.vue";
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
@@ -106,29 +86,7 @@ export default {
data() {
return {
dataList: [],
tabList: [{ name: "推荐" }],
tabArr: [
{
img: "/static/common/xrjx.png",
greyImg: "/static/common/xrjx_grey.png",
name: "信任精选",
},
{
img: "/static/common/cdjk.png",
greyImg: "/static/common/cdjk_grey.png",
name: "吃的健康",
},
{
img: "/static/common/qwhb.png",
greyImg: "/static/common/qwhb_grey.png",
name: "全网爆款",
},
{
img: "/static/common/yxhw.png",
greyImg: "/static/common/yxhw_grey.png",
name: "严选好物",
},
],
tabArr: [ ],
curTab: 0,
upOption: {
auto: false,
@@ -152,10 +110,51 @@ export default {
mescroll: null,
};
},
onLoad() {
onLoad(options) {
this.init();
if(options.index){
this.curTab = options.index;
}
},
onShow() {
if (this.tabArr.length > 0) {
const sortParams = uni.getStorageSync('sortParams');
if (sortParams) {
uni.removeStorageSync('sortParams');
const targetIndex = this.tabArr.findIndex(item => item.name === sortParams.value);
if (targetIndex !== -1 && targetIndex !== this.curTab) {
this.curTab = targetIndex;
this.dataList = [];
this.downCallback();
}
}
}
},
methods: {
/**
* 查询分类列表
*/
async getSortList() {
const resp = await getGoodsTags({ type: 5 });
if (resp && resp.bizcode === 100) {
this.tabArr = resp.data.sort((a, b) => a.sort - b.sort);
this.$nextTick(() => {
this.applySortParams();
this.downCallback();
});
}
},
applySortParams() {
const sortParams = uni.getStorageSync('sortParams');
if (sortParams && this.tabArr.length > 0) {
uni.removeStorageSync('sortParams');
const targetIndex = this.tabArr.findIndex(item => item.name === sortParams.value);
if (targetIndex !== -1 && targetIndex !== this.curTab) {
this.curTab = targetIndex;
this.dataList = [];
}
}
},
mescrollInit(mescroll) {
this.mescroll = mescroll;
},
@@ -167,16 +166,14 @@ export default {
type: 2,
page: page.num,
pageSize: page.size,
isPar: true,
isPar: true
};
if (this.curTab != 0) {
params["categoryId"] = this.tabList[this.curTab].id;
if (this.tabArr.length > 0 && this.tabArr[this.curTab]) {
params["tag"] = this.tabArr[this.curTab].id;
}
searchList(params).then((res) => {
let curPageLen = res.data.length;
if (page.num === 1) this.dataList = [];
this.dataList = this.dataList.concat(res.data);
console.log(this.dataList);
this.waterfall();
this.mescroll.endBySize(curPageLen, res.data.total);
@@ -187,16 +184,6 @@ export default {
this.mescroll && this.mescroll.resetUpScroll();
});
},
async cascadeCategory() {
getCascadeCategory({ parentId: 0 }).then((res) => {
if (res && res.bizcode === 100) {
res.data.forEach((item) => {
this.tabList.push(item);
});
this.downCallback();
}
});
},
onTab(index) {
if (index != this.curTab) {
this.curTab = index;
@@ -204,20 +191,17 @@ export default {
this.downCallback();
}
},
init() {
this.cascadeCategory();
init() {;
this.getSortList();
},
async getSearchList() {
const params = {
type: 2,
page: 1,
pageSize: 10,
isPar: true,
};
if (this.curTab != 0) {
params["categoryId"] = this.tabList[this.curTab].id;
} else {
params["isRecomm"] = true;
if (this.tabArr.length > 0 && this.tabArr[this.curTab]) {
params["type"] = this.tabArr[this.curTab].id;
}
const resp = await searchList(params);
if (resp && resp.bizcode === 100) {
utils/config.js
+2 -2
View File
@@ -4,10 +4,10 @@
// export const BASE_URL = "https://api.tbmall.xin"; //生产
export const MILD_BASE_URL = "https://agent.tbmall.xin/"; //中台生产
// export const MILD_BASE_URL = "https://agent.tbmall.xin/"; //中台生产
export const BASE_URL ='https://api.o.tbmall.xin'; // 本地测试
// export const MILD_BASE_URL = "https://agent.o.tbmall.xin/"; //中台测试
export const MILD_BASE_URL = "https://agent.o.tbmall.xin/"; //中台测试
// https://h.o.tbmall.xin/#/
utils/enumUtils.js
+42 -1
View File
@@ -414,7 +414,7 @@ export const FINANCE_WITHDRAWAL_STATUS = [
];
/**
* 页面：1-APP首页，2-APP分类页，3-商学院资讯，4-爆单区，5-好物区,6-积分专区
* 页面：1-APP首页，2-APP分类页，3-商学院资讯，4-爆单区，5-好物区,6-积分专区,7-数字积分页 8-新人专享、9-超级补贴、10-限时秒杀
* @type {[{value: string, key: string}]}
*/
export const APP_PAGE_TYPE = {
@@ -424,6 +424,10 @@ export const APP_PAGE_TYPE = {
HOT: 4,
GOOD: 5,
INTEGRAL: 6,
DIGITAL_INTEGRAL: 7,
NEW: 8,
SUPER_SUBSIDY: 9,
SECKILL: 10,
};
/**
@@ -468,3 +472,40 @@ export const RWA_STATUS = [
value: "交易失败"
},
];
// 商品--活动的类型 activityType
export const ACTIVITY_TYPE = [
{
key: 'seckill',
value: "秒杀活动"
},
]
// 商品--分类的类型 type
export const SORT_TYPE = [
{
key: 3,
value: "新人专享",
path: "/pages/active/newcomer-exclusive/newcomer-exclusive"
},
{
key: 4,
value: "低价好物",
path: "/pages/supply_chain/supply_chain"
},
{
key: 5,
value: "全网爆款",
path: "/pages/supply_chain/supply_chain"
},
{
key: 12,
value: "超级补贴",
path: "/pages/active/super-subsidy/super-subsidy"
},
{
key: 13,
value: "限时秒杀",
path: "/pages/active/limited-time/limited-time"
},
]