You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
shop-pc/pages/index/index.vue

89 lines
2.2 KiB

<!--
* @Author: ch
* @Date: 2022-05-03 22:14:16
* @LastEditors: ch
* @LastEditTime: 2022-05-04 22:21:04
* @Description: file content
-->
<template>
<div class="home">
<Banner />
<div class="home-wrap">
<Seckil
v-if="seckillData.activityTimeVO"
:data="seckillData"
:list="sekillGoodsList"
:current="currentTime"
@refresh="handleSeckillRefresh"
/>
<Pick v-if="pickData.length >= PICK_COUNT_MIN" :data="pickData" />
</div>
</div>
</template>
<script>
import {
ApiGetHomeSeckill,
ApiGetCurrentTime,
ApiGetSeckillGoods,
} from "@/plugins/api/seckill";
import { ApiGetRecommendedGoodsList } from "@/plugins/api/goods";
import Banner from "./module/Banner.vue";
import Seckil from "./module/Seckill.vue";
import Pick from "./module/Pick.vue";
const PICK_COUNT_MIN = 3; // 甄选推荐最小商品数
export default {
components: { Banner, Seckil, Pick },
async asyncData() {
// 获取秒杀数据
const { result: seckillData } = await ApiGetHomeSeckill();
// 获取秒杀商品列表
let sekillGoodsList = [];
if (seckillData.activityTimeVO) {
const { result } = await ApiGetSeckillGoods({
pageIndex: 1,
length: 20,
activityTimeId: seckillData.activityTimeVO.id,
});
if (result) {
sekillGoodsList = result.records;
}
}
// 获取服务器当前时间
const { result: currentTime } = await ApiGetCurrentTime();
const { result: pickData } = await ApiGetRecommendedGoodsList();
return {
currentTime,
seckillData: seckillData || { activityTimeVO: null },
sekillGoodsList,
pickData: pickData || [],
};
},
data() {
return {
PICK_COUNT_MIN,
};
},
methods: {
// 刷新秒杀活动状态
async handleSeckillRefresh() {
const { result: seckillData } = await ApiGetHomeSeckill();
const { result: currentTime } = await ApiGetCurrentTime();
this.seckillData = seckillData;
this.currentTime = currentTime;
},
},
};
</script>
<style lang="scss" scoped>
.home {
background: #f8f8f8;
.home-wrap {
@include layout-box;
padding: 30px 0 30px 0;
}
}
</style>