12.23
This commit is contained in:
parent
2b68401d29
commit
78c54f2ec6
|
@ -6,15 +6,18 @@
|
|||
<div class="stats-container">
|
||||
<div class="stat-box quantity-box" style="margin-right: 20px;" @click="goToShangpinIndex">
|
||||
<span>商品数量</span>
|
||||
<p>50</p>
|
||||
<!-- <p>{{ productQuantity }}</p> -->
|
||||
<p>30</p>
|
||||
</div>
|
||||
<div class="stat-box sales-box" style="margin-right: 20px;">
|
||||
<span>评价数量</span>
|
||||
<p>120</p>
|
||||
<!-- <p>{{ commentQuantity }}</p> -->
|
||||
<p>30</p>
|
||||
</div>
|
||||
<div class="stat-box order-box">
|
||||
<span>订单数量</span>
|
||||
<p>30</p>
|
||||
<!-- <p>{{ orderQuantity }}</p> -->
|
||||
<p>50</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 商品公告栏 -->
|
||||
|
@ -45,12 +48,12 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
// 用于存储当前日期时间
|
||||
|
@ -88,14 +91,17 @@ const currentNoticeIndex = ref(0);
|
|||
// 当前显示的公告内容
|
||||
const currentNotices = ref([]);
|
||||
|
||||
|
||||
|
||||
// 更新当前显示的公告内容
|
||||
const updateCurrentNotices = () => {
|
||||
const startIndex = currentNoticeIndex.value;
|
||||
currentNotices.value = notices.value.slice(startIndex, startIndex + 3).map((notice, i) => notices.value[(startIndex + i) % notices.value.length]);
|
||||
};
|
||||
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
// 初始化时设置当前日期时间和颜色类名
|
||||
updateDateTimeAndColor();
|
||||
// 每秒更新一次日期时间和颜色类名
|
||||
setInterval(() => {
|
||||
|
@ -110,8 +116,15 @@ onMounted(() => {
|
|||
currentNoticeIndex.value = (currentNoticeIndex.value + 1) % notices.value.length;
|
||||
updateCurrentNotices();
|
||||
}, 3000);
|
||||
});
|
||||
|
||||
// 初始化时获取订单数量、商品数量、评价数量(可根据实际需求决定是否都获取)
|
||||
fetchOrderQuantity();
|
||||
// fetchProductQuantity();
|
||||
// fetchCommentQuantity();
|
||||
setInterval(() => {
|
||||
fetchOrderQuantity();
|
||||
}, 60000);
|
||||
});
|
||||
const updateDateTimeAndColor = () => {
|
||||
const now = dayjs();
|
||||
currentDateTime.value = now.format('YYYY-MM-DD HH:mm:ss');
|
||||
|
@ -124,7 +137,6 @@ const updateDateTimeAndColor = () => {
|
|||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 20px;
|
||||
|
|
Loading…
Reference in New Issue