uniapp【新增】: 新增页面加载状态

This commit is contained in:
21世纪小八路
2024-10-24 00:11:28 +08:00
parent d16393b1f5
commit 414c9514a4
17 changed files with 214 additions and 108 deletions

View File

@@ -3,15 +3,18 @@
import { queryShopConfigV2, queryAppVersions } from '@/core/api'; import { queryShopConfigV2, queryAppVersions } from '@/core/api';
import type { Response, ShopConfigType } from '@/core/models'; import type { Response, ShopConfigType } from '@/core/models';
import { useShopConfigStore } from '@/core/store'; import { useShopConfigStore } from '@/core/store';
/** 获取项目配置 */
const shopConfigStore = useShopConfigStore();
onShow(() => { onShow(() => {
console.log('App Show') console.log('App Show')
}) })
onHide(() => { onHide(() => {
console.log('App Hide') console.log('App Hide')
}) })
onLaunch(() => { onLaunch(() => {
getShopConfigV2(); getShopConfigV2();
/** 版本设置 */ /** 版本设置 */
@@ -31,15 +34,11 @@
checkVersion() checkVersion()
// #endif // #endif
}) })
/** 获取项目配置 */
const shopConfigStore = useShopConfigStore();
const getShopConfigV2 = async () => { const getShopConfigV2 = async () => {
const shopConfig : Response<ShopConfigType> = await queryShopConfigV2(); shopConfigStore.querySystemConfig();
shopConfigStore.setConfig(shopConfig.data);
} }
const autoUpdate = () => { const autoUpdate = () => {
/** 获取小程序更新机制兼容 */ /** 获取小程序更新机制兼容 */
if (wx.canIUse('getUpdateManager')) { if (wx.canIUse('getUpdateManager')) {

View File

@@ -11,6 +11,10 @@
<coreshop-page-content v-bind="props"> <coreshop-page-content v-bind="props">
<slot name="default" /> <slot name="default" />
</coreshop-page-content> </coreshop-page-content>
<template v-if="props.needLoadingPage">
<uv-loading-page :loading="props.loadingPage" :loading-text="props.loadingText"
:font-size="props.loadingTextFontSize" :bgColor="props.loadingBgColor"></uv-loading-page>
</template>
</template> </template>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@@ -29,6 +33,11 @@
skeleton ?: Array<any>; skeleton ?: Array<any>;
skeletonLoading : boolean; skeletonLoading : boolean;
placeholder : boolean; placeholder : boolean;
loadingPage : boolean;
needLoadingPage : boolean;
loadingText : string;
loadingTextFontSize : string;
loadingBgColor : string;
}>(), { }>(), {
isBack: true, isBack: true,
bgColor: '#eef2f6', bgColor: '#eef2f6',
@@ -49,6 +58,11 @@
}], }],
skeletonLoading: false, skeletonLoading: false,
placeholder: true, placeholder: true,
loadingPage: false,
needLoadingPage: false,
loadingText: '加载中...',
loadingTextFontSize: '24rpx',
loadingBgColor: 'rgba(255, 255, 255, 0.2)'
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@@ -1,6 +1,6 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import type { ShopConfigStoreType, ShopConfigType } from '@/core/models'; import type { ShopConfigStoreType, ShopConfigType,Response } from '@/core/models';
import { queryShopConfigV2 } from '@/core/api';
export const useShopConfigStore = defineStore('shopConfig', { export const useShopConfigStore = defineStore('shopConfig', {
state: () : ShopConfigStoreType => { state: () : ShopConfigStoreType => {
return { return {
@@ -11,6 +11,10 @@ export const useShopConfigStore = defineStore('shopConfig', {
getConfig: state => state.config, getConfig: state => state.config,
}, },
actions: { actions: {
async querySystemConfig() {
const shopConfig : Response<ShopConfigType> = await queryShopConfigV2();
this.setConfig(shopConfig.data);
},
setConfig(data : ShopConfigType) { setConfig(data : ShopConfigType) {
this.config = data; this.config = data;
}, },

View File

@@ -3,7 +3,7 @@
"path": "pages/home/home", "path": "pages/home/home",
"style": { "style": {
"navigationBarTitleText": "首页", "navigationBarTitleText": "首页",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -11,7 +11,7 @@
"path": "pages/cart/cart", "path": "pages/cart/cart",
"style": { "style": {
"navigationBarTitleText": "购物车", "navigationBarTitleText": "购物车",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -19,7 +19,7 @@
"path": "pages/classify/classify", "path": "pages/classify/classify",
"style": { "style": {
"navigationBarTitleText": "分类", "navigationBarTitleText": "分类",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -35,7 +35,7 @@
"path": "pages/category/category", "path": "pages/category/category",
"style": { "style": {
"navigationBarTitleText": "商品列表", "navigationBarTitleText": "商品列表",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -43,7 +43,7 @@
"path": "pages/goods/detail", "path": "pages/goods/detail",
"style": { "style": {
"navigationBarTitleText": "商品详情", "navigationBarTitleText": "商品详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },

View File

@@ -13,7 +13,7 @@
"path": "pinTuan/detail/detail", "path": "pinTuan/detail/detail",
"style": { "style": {
"navigationBarTitleText": "拼团详情", "navigationBarTitleText": "拼团详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -29,7 +29,7 @@
"path": "seckill/detail/detail", "path": "seckill/detail/detail",
"style": { "style": {
"navigationBarTitleText": "秒杀详情", "navigationBarTitleText": "秒杀详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -45,7 +45,7 @@
"path": "groupBuying/detail/detail", "path": "groupBuying/detail/detail",
"style": { "style": {
"navigationBarTitleText": "拼团详情", "navigationBarTitleText": "拼团详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -61,7 +61,7 @@
"path": "solitaire/detail/detail", "path": "solitaire/detail/detail",
"style": { "style": {
"navigationBarTitleText": "接龙详情", "navigationBarTitleText": "接龙详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },

View File

@@ -45,7 +45,7 @@
"path": "pages/home/home", "path": "pages/home/home",
"style": { "style": {
"navigationBarTitleText": "首页", "navigationBarTitleText": "首页",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -53,7 +53,7 @@
"path": "pages/cart/cart", "path": "pages/cart/cart",
"style": { "style": {
"navigationBarTitleText": "购物车", "navigationBarTitleText": "购物车",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -61,7 +61,7 @@
"path": "pages/classify/classify", "path": "pages/classify/classify",
"style": { "style": {
"navigationBarTitleText": "分类", "navigationBarTitleText": "分类",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -77,7 +77,7 @@
"path": "pages/category/category", "path": "pages/category/category",
"style": { "style": {
"navigationBarTitleText": "商品列表", "navigationBarTitleText": "商品列表",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -85,7 +85,7 @@
"path": "pages/goods/detail", "path": "pages/goods/detail",
"style": { "style": {
"navigationBarTitleText": "商品详情", "navigationBarTitleText": "商品详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -501,7 +501,7 @@
"path": "pinTuan/detail/detail", "path": "pinTuan/detail/detail",
"style": { "style": {
"navigationBarTitleText": "拼团详情", "navigationBarTitleText": "拼团详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -517,7 +517,7 @@
"path": "seckill/detail/detail", "path": "seckill/detail/detail",
"style": { "style": {
"navigationBarTitleText": "秒杀详情", "navigationBarTitleText": "秒杀详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -533,7 +533,7 @@
"path": "groupBuying/detail/detail", "path": "groupBuying/detail/detail",
"style": { "style": {
"navigationBarTitleText": "拼团详情", "navigationBarTitleText": "拼团详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
@@ -549,7 +549,7 @@
"path": "solitaire/detail/detail", "path": "solitaire/detail/detail",
"style": { "style": {
"navigationBarTitleText": "接龙详情", "navigationBarTitleText": "接龙详情",
"enablePullDownRefresh": false, "enablePullDownRefresh": true,
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },

View File

@@ -102,12 +102,14 @@
</view> </view>
</view> </view>
</view> </view>
<uv-loading-page :loading="loading" loading-text="加载中..." font-size="24rpx"
bgColor="rgba(255, 255, 255, 0.2)"></uv-loading-page>
</view> </view>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive, nextTick, computed } from 'vue'; import { reactive, nextTick, computed, ref } from 'vue';
import { onShow } from '@dcloudio/uni-app'; import { onShow, onPullDownRefresh } from '@dcloudio/uni-app';
import { handleStaticResources, hanldeShowModal, handleRouteSwitchTab, handleRouteNavigateTo, handleShowToast } from '@/core/utils'; import { handleStaticResources, hanldeShowModal, handleRouteSwitchTab, handleRouteNavigateTo, handleShowToast } from '@/core/utils';
import { queryCartList, deleteGoodsSingle, deleteGoodsSome } from '@/core/api'; import { queryCartList, deleteGoodsSingle, deleteGoodsSome } from '@/core/api';
import type { Response, CartListType, ShopConfigStoreType } from '@/core/models'; import type { Response, CartListType, ShopConfigStoreType } from '@/core/models';
@@ -116,14 +118,14 @@
OpenPointEnum, PointExchangeModelEnum, ShowPointExchangePriceEnum, RouteSwitchTabEnum, OpenPointEnum, PointExchangeModelEnum, ShowPointExchangePriceEnum, RouteSwitchTabEnum,
PointsGiveModeEnum, ShowPointsGiveMsgEnum, PointsGiveModeEnum, ShowPointsGiveMsgEnum,
} from '@/core/enum'; } from '@/core/enum';
import { useSystemInfo } from '@/core/hooks'; import { useLoadingFn, useSystemInfo } from '@/core/hooks';
import { UserToken } from '@/core/consts' import { UserToken } from '@/core/consts'
// 获取项目配置 // 获取项目配置
const shopConfigStore : ShopConfigStoreType = useShopConfigStore(); const shopConfigStore : ShopConfigStoreType = useShopConfigStore();
// 获取自定义导航栏高度 // 获取自定义导航栏高度
const { statusBarHeight } = useSystemInfo(); const { statusBarHeight } = useSystemInfo();
const loading = ref(true);
const state = reactive<{ const state = reactive<{
isManage : boolean, isManage : boolean,
isAllSelect : boolean, isAllSelect : boolean,
@@ -140,6 +142,9 @@
pointShowText: "", pointShowText: "",
}) })
const handleuGetCartList = useLoadingFn(getCartList, loading);
/** 是否显示积分兑换价格 */ /** 是否显示积分兑换价格 */
const isShowPointRedemptionPrice = computed(() => { const isShowPointRedemptionPrice = computed(() => {
return shopConfigStore.config.pointSwitch == OpenPointEnum.yes && return shopConfigStore.config.pointSwitch == OpenPointEnum.yes &&
@@ -155,14 +160,24 @@
}) })
onShow(() => { onShow(() => {
state.isManage = true; getCart();
if (uni.getStorageSync(UserToken)) {
getCartList();
}
}) })
onPullDownRefresh(async () => {
await getCart();
uni.stopPullDownRefresh();
});
async function getCart() {
state.isManage = true;
if (uni.getStorageSync(UserToken)) {
handleuGetCartList();
}
}
/** 获取购物车数据 */ /** 获取购物车数据 */
const getCartList = async () => { async function getCartList() {
const cartList : Response<any> = await queryCartList({ const cartList : Response<any> = await queryCartList({
display: "all", display: "all",
ids: "" ids: ""
@@ -311,8 +326,8 @@
/** 去购买 */ /** 去购买 */
const handleGoToBuy = () => { const handleGoToBuy = () => {
const ids : Array<number>= state.cartList.filter(x=>x.select).map(x=>x.id); const ids : Array<number> = state.cartList.filter(x => x.select).map(x => x.id);
if (ids.length > 0) { if (ids.length > 0) {
handleRouteNavigateTo(`/pages/order/submit/submit?cartIds=${ids.join(',')}`) handleRouteNavigateTo(`/pages/order/submit/submit?cartIds=${ids.join(',')}`)
} else { } else {

View File

@@ -7,8 +7,9 @@
</image> </image>
<uv-input shape="circle" :placeholder="state.pageTitle ? state.pageTitle :`请输入关键词`" <uv-input shape="circle" :placeholder="state.pageTitle ? state.pageTitle :`请输入关键词`"
prefixIcon="search" v-model="state.searchKey" :customStyle="{ 'background-color': '#fff','padding':'3px 9px' }" prefixIcon="search" v-model="state.searchKey"
@confirm="handleSearch" prefixIconStyle="font-size: 22px;color: #909399"> :customStyle="{ 'background-color': '#fff','padding':'3px 9px' }" @confirm="handleSearch"
prefixIconStyle="font-size: 22px;color: #909399">
<template #suffix> <template #suffix>
<view class="search-tit" @click="handleSearch">搜索</view> <view class="search-tit" @click="handleSearch">搜索</view>
</template> </template>
@@ -114,12 +115,14 @@
</view> </view>
</view> </view>
</view> </view>
<uv-loading-page :loading="loading" loading-text="加载中..." font-size="24rpx"
bgColor="rgba(255, 255, 255, 0.2)"></uv-loading-page>
</view> </view>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive } from 'vue'; import { reactive, ref } from 'vue';
import { useSystemInfo } from '@/core/hooks'; import { useLoadingFn, useSystemInfo } from '@/core/hooks';
import { onLoad, onReachBottom } from '@dcloudio/uni-app'; import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
import { handleStaticResources, handleShowToast, splitArrayByStep } from '@/core/utils'; import { handleStaticResources, handleShowToast, splitArrayByStep } from '@/core/utils';
import type { Response, GoodsType, GoodsListType } from '@/core/models'; import type { Response, GoodsType, GoodsListType } from '@/core/models';
import { queryGoodsPageList } from '@/core/api'; import { queryGoodsPageList } from '@/core/api';
@@ -143,8 +146,8 @@
} }
// 获取自定义导航栏高度 // 获取自定义导航栏高度
const { statusBarHeight ,menuButtonHeight} = useSystemInfo(); const { statusBarHeight, menuButtonHeight } = useSystemInfo();
const loading = ref(true);
const state = reactive<{ const state = reactive<{
searchKey : string; searchKey : string;
page : number; page : number;
@@ -216,6 +219,10 @@
pageTitle: "", pageTitle: "",
}) })
let queryParams : QueryParams
const handleuQueryProduct = useLoadingFn(handleQueryData, loading);
onReachBottom(() => { onReachBottom(() => {
if (state.totalPages > state.page) { if (state.totalPages > state.page) {
state.page++; state.page++;
@@ -225,12 +232,20 @@
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
queryParams = query;
/** 处理 query 然后获取商品列表 */ /** 处理 query 然后获取商品列表 */
handleQueryData(query); handleuQueryProduct(query);
});
onPullDownRefresh(async () => {
state.page = 1;
state.totalPages = 1;
await handleuQueryProduct(queryParams);
uni.stopPullDownRefresh();
}); });
/** 处理 options */ /** 处理 options */
const handleQueryData = (options : QueryParams) => { async function handleQueryData(options : QueryParams) {
let where : any = {}; let where : any = {};
if (options?.id) { if (options?.id) {
where.catId = options?.id; where.catId = options?.id;
@@ -263,15 +278,11 @@
where.labelId = options.labelId; where.labelId = options.labelId;
} }
state.where = where; state.where = where;
getGoodsPageList(); await getGoodsPageList();
} }
/** 获取商品列表数据 */ /** 获取商品列表数据 */
const getGoodsPageList = async () => { const getGoodsPageList = async () => {
uni.showLoading({
title: '加载中'
});
let order : Array<string> = []; let order : Array<string> = [];
if (state.sortVal) { if (state.sortVal) {
order.push(`sort ${state.sortVal}`) order.push(`sort ${state.sortVal}`)
@@ -306,7 +317,6 @@
let list = splitArrayByStep(goodsPageList.data.list, 2); let list = splitArrayByStep(goodsPageList.data.list, 2);
state.goodsList[0] = state.goodsList[0].concat(list[0]); state.goodsList[0] = state.goodsList[0].concat(list[0]);
state.goodsList[1] = state.goodsList[1].concat(list[1]); state.goodsList[1] = state.goodsList[1].concat(list[1]);
uni.hideLoading();
} }
/** 点击筛选 */ /** 点击筛选 */

View File

@@ -234,9 +234,7 @@
// 获取商品列表数据 // 获取商品列表数据
const getGoodsPageList = async () => { const getGoodsPageList = async () => {
uni.showLoading({
title: '加载中'
});
const goodsPageList : Response<GoodsListType> = await queryGoodsPageList({ const goodsPageList : Response<GoodsListType> = await queryGoodsPageList({
page: state.page, page: state.page,
limit: 10, limit: 10,
@@ -246,7 +244,6 @@
state.totalPages = goodsPageList.data?.totalPages; state.totalPages = goodsPageList.data?.totalPages;
state.goodsList = state.goodsList.concat(goodsPageList.data?.list); state.goodsList = state.goodsList.concat(goodsPageList.data?.list);
} }
uni.hideLoading();
} }
/** 获取购物车数量和价格 */ /** 获取购物车数量和价格 */

View File

@@ -158,9 +158,7 @@
/** 获取商品列表数据 */ /** 获取商品列表数据 */
const getGoodsPageList = async () => { const getGoodsPageList = async () => {
uni.showLoading({
title: '加载中'
});
const goodsPageList : Response<GoodsListType> = await queryGoodsPageList({ const goodsPageList : Response<GoodsListType> = await queryGoodsPageList({
page: state.page, page: state.page,
limit: 10, limit: 10,
@@ -170,7 +168,6 @@
state.totalPages = goodsPageList.data?.totalPages; state.totalPages = goodsPageList.data?.totalPages;
state.goodsList = state.goodsList.concat(goodsPageList.data?.list); state.goodsList = state.goodsList.concat(goodsPageList.data?.list);
} }
uni.hideLoading();
} }
/** 获取购物车数量和价格 */ /** 获取购物车数量和价格 */

View File

@@ -1,5 +1,5 @@
<template> <template>
<coreshop-page :isBack="false" bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" showLoginModalDom> <coreshop-page :isBack="false" bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" showLoginModalDom needLoadingPage :loadingPage="loading">
<view class="layout-classify-page"> <view class="layout-classify-page">
<!-- #ifndef MP-ALIPAY --> <!-- #ifndef MP-ALIPAY -->
<uv-navbar bgColor="#EEF3F7" :height="menuButtonHeight+'px'"> <uv-navbar bgColor="#EEF3F7" :height="menuButtonHeight+'px'">
@@ -37,8 +37,8 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, reactive, nextTick, watchEffect } from 'vue'; import { onMounted, reactive, nextTick, watchEffect, ref } from 'vue';
import { onHide } from '@dcloudio/uni-app'; import { onHide, onPullDownRefresh } from '@dcloudio/uni-app';
import { useShopConfigStore } from '@/core/store'; import { useShopConfigStore } from '@/core/store';
import { queryAllCategories } from '@/core/api'; import { queryAllCategories } from '@/core/api';
import { GoodsListEnum } from '@/core/enum'; import { GoodsListEnum } from '@/core/enum';
@@ -50,13 +50,14 @@
import classifyThree from './classify-page/classify-three/classify-three.vue'; import classifyThree from './classify-page/classify-three/classify-three.vue';
import classifyFour from './classify-page/classify-four/classify-four.vue'; import classifyFour from './classify-page/classify-four/classify-four.vue';
import classifyFive from './classify-page/classify-five/classify-five.vue'; import classifyFive from './classify-page/classify-five/classify-five.vue';
import { useSystemInfo } from '@/core/hooks'; import { useLoadingFn, useSystemInfo } from '@/core/hooks';
// 获取项目配置 // 获取项目配置
const shopConfigStore : ShopConfigStoreType = useShopConfigStore(); const shopConfigStore : ShopConfigStoreType = useShopConfigStore();
// 获取自定义导航栏高度 // 获取自定义导航栏高度
const { statusBarHeight, systemInfo, menuButtonHeight } = useSystemInfo(); const { statusBarHeight, systemInfo, menuButtonHeight } = useSystemInfo();
const loading = ref(true);
const state = reactive<{ const state = reactive<{
categoriesList : Array<CategoriesType>, categoriesList : Array<CategoriesType>,
@@ -68,8 +69,11 @@
keyWord: "", keyWord: "",
}) })
const handleuAllCategories = useLoadingFn(getAllCategories, loading);
onMounted(async () => { onMounted(async () => {
getAllCategories(); handleuAllCategories();
}) })
watchEffect(() => { watchEffect(() => {
@@ -81,8 +85,14 @@
uni.$emit(onClassifyPageHide); uni.$emit(onClassifyPageHide);
}); });
onPullDownRefresh(async () => {
await handleuAllCategories()
uni.stopPullDownRefresh();
});
/** 获取购物车数量价格 */ /** 获取购物车数量价格 */
const getAllCategories = async () => { async function getAllCategories() {
const allCategories : Response<Array<CategoriesType>> = await queryAllCategories(); const allCategories : Response<Array<CategoriesType>> = await queryAllCategories();
state.categoriesList = allCategories.data || []; state.categoriesList = allCategories.data || [];
} }

View File

@@ -1,5 +1,5 @@
<template> <template>
<coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom> <coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom needLoadingPage :loadingPage="loading">
<view class="goods-detail"> <view class="goods-detail">
<!-- 商品详情 --> <!-- 商品详情 -->
<GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData" <GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData"
@@ -25,8 +25,8 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive } from 'vue'; import { reactive, ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onLoad, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { queryGoodsDetail, queryCartNum, queryGoodsDetailByToken, queryPromotionList, queryAddCart } from '@/core/api'; import { queryGoodsDetail, queryCartNum, queryGoodsDetailByToken, queryPromotionList, queryAddCart } from '@/core/api';
import type { Response, GoodsAgentListType, GoodsPromotionType, GoodsSkuListType } from "@/core/models"; import type { Response, GoodsAgentListType, GoodsPromotionType, GoodsSkuListType } from "@/core/models";
import { PromotionEnum, AddCartEnum, PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum'; import { PromotionEnum, AddCartEnum, PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum';
@@ -38,6 +38,7 @@
import GoodsDetailSkuPopup from '@/pages/components/goods-detail/components/goods-detail-sku/goods-detail-sku.vue'; import GoodsDetailSkuPopup from '@/pages/components/goods-detail/components/goods-detail-sku/goods-detail-sku.vue';
import GoodsDetailRecommend from '@/pages/components/goods-detail/components/goods-detail-recommend/goods-detail-recommend.vue'; import GoodsDetailRecommend from '@/pages/components/goods-detail/components/goods-detail-recommend/goods-detail-recommend.vue';
import { useLoginStore } from '@/core/store'; import { useLoginStore } from '@/core/store';
import { useLoadingFn } from '@/core/hooks';
interface QueryParams { interface QueryParams {
id : number; id : number;
@@ -71,17 +72,32 @@
showSku: false, showSku: false,
skuPrice: 0, skuPrice: 0,
shareUrl: "", shareUrl: "",
}) });
const loading = ref(true);
let productId : number;
const handleuGetGoodsDetail = useLoadingFn(getGoodsDetail, loading);
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
productId = Number(query.id);
getGoodsDetailWithPromotionList();
});
onPullDownRefresh(async () => {
await getGoodsDetailWithPromotionList();
uni.stopPullDownRefresh();
});
async function getGoodsDetailWithPromotionList() {
/** 获取商品详情 */ /** 获取商品详情 */
getGoodsDetail(Number(query.id)); handleuGetGoodsDetail(productId);
/** 获取商品促销列表 */ /** 获取商品促销列表 */
getPromotionList(); getPromotionList();
}) }
/** 获取商品详情 */ /** 获取商品详情 */
const getGoodsDetail = async (id : number) => { async function getGoodsDetail(id : number) {
let goodsDetail : any = null; let goodsDetail : any = null;
if (uni.getStorageSync(UserToken)) { if (uni.getStorageSync(UserToken)) {
goodsDetail = await queryGoodsDetailByToken({ goodsDetail = await queryGoodsDetailByToken({
@@ -132,7 +148,7 @@
/** 如果用户登录,获取购物车数量 */ /** 如果用户登录,获取购物车数量 */
if (uni.getStorageSync(UserToken)) { if (uni.getStorageSync(UserToken)) {
getCartNum(); await getCartNum();
} }
} }

View File

@@ -1,5 +1,5 @@
<template> <template>
<coreshop-page :isBack="false" bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" showLoginModalDom> <coreshop-page :isBack="false" bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" showLoginModalDom needLoadingPage :loadingPage="loading">
<view class="layout-home-page page-bg"> <view class="layout-home-page page-bg">
<image class="home-bg" :src="handleStaticResources('/static/images/home-bg.jpg')"></image> <image class="home-bg" :src="handleStaticResources('/static/images/home-bg.jpg')"></image>
<uv-navbar :title="shopConfigStore.config?.shopName" <uv-navbar :title="shopConfigStore.config?.shopName"
@@ -27,7 +27,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, reactive, ref } from 'vue'; import { onMounted, reactive, ref } from 'vue';
import { onPageScroll, onShow, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onPageScroll, onShow, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { queryPageConfig, queryUserInfo } from '@/core/api'; import { queryPageConfig, queryUserInfo } from '@/core/api';
import type { Response, PageConfigType, PageConfigItemsType, UserInfoType } from '@/core/models'; import type { Response, PageConfigType, PageConfigItemsType, UserInfoType } from '@/core/models';
import CustomPage from '@/pages/components/custom-page/index.vue'; import CustomPage from '@/pages/components/custom-page/index.vue';
@@ -39,7 +39,7 @@
import { ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum'; import { ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum';
/** 获取项目配置 */ /** 获取项目配置 */
const shopConfigStore = useShopConfigStore(); const shopConfigStore = useShopConfigStore();
/** 获取 用户数据 */ /** 获取 用户数据 */
const userInfoStore = useUserInfoStore(); const userInfoStore = useUserInfoStore();
@@ -65,7 +65,16 @@
uni.$emit(onHomePageShow); uni.$emit(onHomePageShow);
}) })
onPullDownRefresh(async () => {
await queryHomePageConfig();
uni.stopPullDownRefresh();
});
onMounted(async () => { onMounted(async () => {
queryHomePageConfig();
})
const queryHomePageConfig = async () => {
handleuQueryPageConfig() handleuQueryPageConfig()
if (uni.getStorageSync(UserToken)) { if (uni.getStorageSync(UserToken)) {
getUserInfo(); getUserInfo();
@@ -76,8 +85,9 @@
url: shareUrl, url: shareUrl,
type: ShareModelEnum.url, type: ShareModelEnum.url,
page: ShareEnum.index, page: ShareEnum.index,
}) });
}) shopConfigStore.querySystemConfig();
}
async function getPageConfig() { async function getPageConfig() {
const pageConfig : Response<PageConfigType> = await queryPageConfig({ code: 'mobile_home' }); const pageConfig : Response<PageConfigType> = await queryPageConfig({ code: 'mobile_home' });

View File

@@ -1,5 +1,6 @@
<template> <template>
<coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom> <coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom
needLoadingPage :loadingPage="loadingPage">
<view class="goods-detail"> <view class="goods-detail">
<!-- 商品详情 --> <!-- 商品详情 -->
<GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData" <GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData"
@@ -62,7 +63,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive, ref } from 'vue'; import { reactive, ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onLoad, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { queryActivityDetial, queryCartNum, queryAddCart } from '@/core/api'; import { queryActivityDetial, queryCartNum, queryAddCart } from '@/core/api';
import { PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum'; import { PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum';
import type { Response } from '@/core/models'; import type { Response } from '@/core/models';
@@ -119,15 +120,22 @@
}); });
const loading = ref(false); const loading = ref(false);
const handleBuyNow = useLoadingFn(onBuyNow, loading) const loadingPage = ref(true);
const handleBuyNow = useLoadingFn(onBuyNow, loading);
const handleGetGoodsDetail = useLoadingFn(getGoodsDetail, loadingPage);
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
state.id = Number(query.id); state.id = Number(query.id);
/** 获取商品详情 */ /** 获取商品详情 */
getGoodsDetail(); handleGetGoodsDetail();
}) });
const getGoodsDetail = async () => { onPullDownRefresh(async () => {
await handleGetGoodsDetail();
uni.stopPullDownRefresh();
});
async function getGoodsDetail() {
let data = { let data = {
id: state.id, id: state.id,
type: PaymentTypeEnum.group, type: PaymentTypeEnum.group,

View File

@@ -1,5 +1,6 @@
<template> <template>
<coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom> <coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom
needLoadingPage :loadingPage="loadingPage">
<view class="goods-detail"> <view class="goods-detail">
<!-- 商品详情 --> <!-- 商品详情 -->
<GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData" <GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData"
@@ -70,7 +71,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive, ref } from 'vue'; import { reactive, ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onLoad, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { queryPinTuanGoodsDetail, queryCartNum, queryAddCart, queryOrderPinTuanTeamInfo } from '@/core/api'; import { queryPinTuanGoodsDetail, queryCartNum, queryAddCart, queryOrderPinTuanTeamInfo } from '@/core/api';
import type { Response } from '@/core/models'; import type { Response } from '@/core/models';
import { UserToken, shareUrl } from '@/core/consts' import { UserToken, shareUrl } from '@/core/consts'
@@ -129,7 +130,9 @@
}); });
const loading = ref(false); const loading = ref(false);
const handleBuyNow = useLoadingFn(onBuyNow, loading) const loadingPage = ref(true);
const handleBuyNow = useLoadingFn(onBuyNow, loading);
const handleGetGoodsDetail = useLoadingFn(getGoodsDetail, loadingPage);
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
if (query?.teamId) { if (query?.teamId) {
@@ -141,10 +144,15 @@
} }
/** 获取商品详情 */ /** 获取商品详情 */
state.id = Number(query.id); state.id = Number(query.id);
getGoodsDetail(); handleGetGoodsDetail();
}) });
const getGoodsDetail = async () => { onPullDownRefresh(async () => {
await handleGetGoodsDetail();
uni.stopPullDownRefresh();
});
async function getGoodsDetail() {
let data = { let data = {
id: state.id, id: state.id,
data: true, data: true,

View File

@@ -1,5 +1,6 @@
<template> <template>
<coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom> <coreshop-page bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" :placeholder="false" showLoginModalDom
needLoadingPage :loadingPage="loadingPage">
<view class="goods-detail"> <view class="goods-detail">
<!-- 商品详情 --> <!-- 商品详情 -->
<GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData" <GoodsDetail :goodsId="state.goodsDetailData?.id" :goodsDetailData="state.goodsDetailData"
@@ -61,7 +62,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive, ref } from 'vue'; import { reactive, ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onLoad, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { queryActivityDetial, queryCartNum, queryShare, queryAddCart } from '@/core/api'; import { queryActivityDetial, queryCartNum, queryShare, queryAddCart } from '@/core/api';
import { PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum'; import { PaymentTypeEnum, ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum';
import type { Response } from '@/core/models'; import type { Response } from '@/core/models';
@@ -119,15 +120,22 @@
}); });
const loading = ref(false); const loading = ref(false);
const handleSeckillNow = useLoadingFn(onSeckillNow, loading) const loadingPage = ref(true);
const handleSeckillNow = useLoadingFn(onSeckillNow, loading);
const handleGetGoodsDetail = useLoadingFn(getGoodsDetail, loadingPage);
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
state.id = Number(query.id); state.id = Number(query.id);
/** 获取商品详情 */ /** 获取商品详情 */
getGoodsDetail(); handleGetGoodsDetail();
}) });
const getGoodsDetail = async () => { onPullDownRefresh(async () => {
await handleGetGoodsDetail();
uni.stopPullDownRefresh();
});
async function getGoodsDetail() {
let data = { let data = {
id: state.id, id: state.id,
type: PaymentTypeEnum.seckill, type: PaymentTypeEnum.seckill,
@@ -152,7 +160,7 @@
state.spesDesc = goodsDetail?.data?.product?.spesDesc; state.spesDesc = goodsDetail?.data?.product?.spesDesc;
/** 如果用户登录,获取购物车数量 */ /** 如果用户登录,获取购物车数量 */
if (uni.getStorageSync(UserToken)) { if (uni.getStorageSync(UserToken)) {
getCartNum(); await getCartNum();
} }
state.shareUrl = await getShareUrl({ state.shareUrl = await getShareUrl({

View File

@@ -1,5 +1,6 @@
<template> <template>
<coreshop-page title="接龙详情" mode="left" bgColor="#D33123" titleColor="#fff" showLoginModalDom> <coreshop-page title="接龙详情" mode="left" bgColor="#D33123" titleColor="#fff" showLoginModalDom needLoadingPage
:loadingPage="loadingPage">
<view class="layout-solitaire-box"> <view class="layout-solitaire-box">
<view class="config-box"> <view class="config-box">
<image class="img" :src="shopConfigStore?.config?.shopLogo"></image> <image class="img" :src="shopConfigStore?.config?.shopLogo"></image>
@@ -96,8 +97,8 @@
</coreshop-page> </coreshop-page>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive } from 'vue'; import { reactive, ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'; import { onLoad, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
import { querySolitaireDetail, queryShare, queryAddCart, queryRemoveCart } from '@/core/api'; import { querySolitaireDetail, queryShare, queryAddCart, queryRemoveCart } from '@/core/api';
import { ShareClientEnum, ShareModelEnum, ShareEnum, EmptyEnum, PaymentTypeEnum, AddCartEnum } from '@/core/enum'; import { ShareClientEnum, ShareModelEnum, ShareEnum, EmptyEnum, PaymentTypeEnum, AddCartEnum } from '@/core/enum';
import type { Response } from '@/core/models'; import type { Response } from '@/core/models';
@@ -106,6 +107,7 @@
import { handleShowToast, handleRouteNavigateTo, getShareUrl } from '@/core/utils'; import { handleShowToast, handleRouteNavigateTo, getShareUrl } from '@/core/utils';
import { timeFormat } from '@/uni_modules/uv-ui-tools/libs/function/index.js'; import { timeFormat } from '@/uni_modules/uv-ui-tools/libs/function/index.js';
import CoreshopShare from '@/components/coreshop-share/coreshop-share.vue'; import CoreshopShare from '@/components/coreshop-share/coreshop-share.vue';
import { useLoadingFn } from '@/core/hooks';
interface QueryParams { interface QueryParams {
id : number; id : number;
@@ -135,13 +137,21 @@
showShare: false, showShare: false,
}); });
const loadingPage = ref(true);
const handleGetGoodsDetail = useLoadingFn(getGoodsDetail, loadingPage);
onLoad((query : QueryParams) => { onLoad((query : QueryParams) => {
state.id = Number(query.id); state.id = Number(query.id);
/** 获取商品详情 */ /** 获取商品详情 */
getGoodsDetail(); handleGetGoodsDetail();
}) });
const getGoodsDetail = async () => { onPullDownRefresh(async () => {
await handleGetGoodsDetail();
uni.stopPullDownRefresh();
});
async function getGoodsDetail() {
const solitaireData : Response<any> = await querySolitaireDetail({ id: state.id }); const solitaireData : Response<any> = await querySolitaireDetail({ id: state.id });
if (solitaireData.status) { if (solitaireData.status) {
state.solitaireInfo = solitaireData.data.model; state.solitaireInfo = solitaireData.data.model;