feat: 添加商品列表和获取位置功能
This commit is contained in:
parent
ae7660e239
commit
e2ae755323
|
|
@ -7,3 +7,7 @@ export const goodListApi = (data) => {
|
|||
export const goodClassListApi = (data) => {
|
||||
return request.get('/cate/cate/lists', data);
|
||||
}
|
||||
|
||||
export const storeProductListApi = (data) => {
|
||||
return request.get('/product/product/store_lists', data);
|
||||
}
|
||||
|
|
@ -318,6 +318,11 @@
|
|||
{{ popPhone }}
|
||||
</view>
|
||||
</up-modal>
|
||||
<!-- 加载中 -->
|
||||
<!-- <view style="position: absolute; top: 34%; left: 42%;">
|
||||
<up-loading-icon text="加载中" textSize="14" show="true" :vertical="true"></up-loading-icon>
|
||||
</view> -->
|
||||
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
|
|
@ -568,7 +573,7 @@
|
|||
|
||||
} catch (error) {
|
||||
uni.hideLoading()
|
||||
uni.$u.toast('查询失败');
|
||||
uni.$u.toast(error.msg ?? '查询失败');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -92,6 +92,14 @@
|
|||
"navigationBarTitleText": "购买礼包",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/product/product",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "商品列表",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [{
|
||||
|
|
|
|||
|
|
@ -121,6 +121,7 @@
|
|||
<up-cell title="预约记录" :isLink="true" url="/pageQuota/asset/lists"></up-cell> -->
|
||||
<up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell>
|
||||
<up-cell title="支付密码" :isLink="true" url="/pagesOrder/setPayPassword/index"></up-cell>
|
||||
<!-- <up-cell title="商品列表" :isLink="true" url="pages/product/product"></up-cell> -->
|
||||
</up-cell-group>
|
||||
</view>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,199 @@
|
|||
<template>
|
||||
|
||||
<view class="page-box1">
|
||||
<up-sticky offset-top="5">
|
||||
<up-subsection :list="list1" :current="where.type" @change="sectionChange"></up-subsection>
|
||||
<view style="margin: 0 20rpx; background-color: white;">
|
||||
|
||||
<up-search placeholder="请输入商品" @search="searchKeyword" @clear="searchKeyword" v-model="keyword"
|
||||
:showAction="false"></up-search>
|
||||
</view>
|
||||
</up-sticky>
|
||||
<up-list @scrolltolower="loadMoreGood">
|
||||
<view v-if="frequentlyList.length>0" class="list">
|
||||
<up-list-item class="shop-item" v-for="(item, index) in frequentlyList" :key="index">
|
||||
<image class="shop-img" :src="item.image"></image>
|
||||
<view class="shop-content" style="width: 490rpx;">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">{{item.store_name}}</view>
|
||||
<view class="name u-line-2" style="color: red;">价格:￥{{item.price}}</view>
|
||||
|
||||
<!-- <view class="tip u-line-1">{{item.spec}}</view> -->
|
||||
<view class="tip u-line-1">单位:{{item.unit_name}}</view>
|
||||
<view class="tip u-line-1">规格:{{item.store_info}}</view>
|
||||
<view class="tip u-line-1" style="justify-content: space-between;" v-if="item.batch">
|
||||
<view style="display: flex;">
|
||||
<view class="shop-content-li-l">起批量</view>
|
||||
<view class="shop-content-li-r">{{ item.batch }}{{ item.unit_name }}起卖</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</up-list-item>
|
||||
<up-loadmore :status="status" />
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty :text="text"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
</up-list>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
computed,
|
||||
ref,
|
||||
watch
|
||||
} from 'vue';
|
||||
import {
|
||||
storeProductListApi
|
||||
} from "@/api/good.js"
|
||||
|
||||
const frequentlyList = ref([]);
|
||||
let text = '没有商品'
|
||||
let status = ref('loadmore')
|
||||
let list1 = ['零售', '商户', '会员']
|
||||
let keyword = ref('');
|
||||
|
||||
const where = ref({
|
||||
page_no: 1,
|
||||
page_size: 15,
|
||||
type: 0,
|
||||
name: '',
|
||||
store_name: '',
|
||||
})
|
||||
const getProductList = (loadmore = false) => {
|
||||
if (loadmore) where.value.page_no++;
|
||||
else where.value.page_no = 1;
|
||||
storeProductListApi(where.value).then(res => {
|
||||
if (res.data.lists.length == 0) {
|
||||
status.value = 'nomore'
|
||||
} else {
|
||||
status.value = 'loadmore'
|
||||
}
|
||||
if (loadmore) {
|
||||
frequentlyList.value.push(...res.data.lists);
|
||||
} else {
|
||||
frequentlyList.value = res.data.lists;
|
||||
}
|
||||
})
|
||||
}
|
||||
const sectionChange = (item) => {
|
||||
where.value.type = item
|
||||
getProductList()
|
||||
}
|
||||
const searchKeyword = () => {
|
||||
where.value.name = keyword.value;
|
||||
where.value.store_name = keyword.value;
|
||||
getProductList();
|
||||
}
|
||||
// 商品列表触底
|
||||
const loadMoreGood = () => {
|
||||
status.value = 'loading'
|
||||
getProductList(true)
|
||||
}
|
||||
getProductList()
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page-box1 {
|
||||
position: relative;
|
||||
|
||||
.total {
|
||||
// margin-top: 10rpx;
|
||||
padding: 0 40rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// position: sticky;
|
||||
// top: var(--window-top);
|
||||
// left: 0;
|
||||
// right: 0;
|
||||
z-index: 100000 !important;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.list {
|
||||
margin: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
// height: calc(100vh - var(--window-top) - 400rpx);
|
||||
// /* #ifdef H5 */
|
||||
// height: calc(100vh - 44px - 200rpx);
|
||||
|
||||
// /* #endif */
|
||||
.shop-item {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #f6f6f6;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
|
||||
.shop-check {
|
||||
width: 60rpx;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-img {
|
||||
height: 164rpx;
|
||||
width: 164rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
|
||||
.shop-content {
|
||||
width: 430rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.title {
|
||||
.name {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.tip {
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
margin: 12rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #F55726;
|
||||
}
|
||||
|
||||
.price-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.num {
|
||||
margin: 0 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -548,25 +548,34 @@
|
|||
|
||||
onLoad(options => {
|
||||
if (uni.getStorageSync('location')) {
|
||||
location = JSON.parse(uni.getStorageSync('location'))
|
||||
checkOrder();
|
||||
try {
|
||||
location = JSON.parse(uni.getStorageSync('location'))
|
||||
checkOrder();
|
||||
} catch (e) {
|
||||
getLocation()
|
||||
}
|
||||
|
||||
} else {
|
||||
uni.getLocation({
|
||||
type: "gcj02",
|
||||
success(res) {
|
||||
location.lat = res.latitude;
|
||||
location.long = res.longitude;
|
||||
uni.setStorageSync('location', JSON.stringify(location))
|
||||
checkOrder();
|
||||
},
|
||||
fail() {
|
||||
uni.$u.toast('获取位置当前失败，为你推荐当前门店')
|
||||
checkOrder(STORE_INFO.id);
|
||||
},
|
||||
complete() {}
|
||||
})
|
||||
getLocation()
|
||||
}
|
||||
})
|
||||
|
||||
const getLocation = () => {
|
||||
uni.getLocation({
|
||||
type: "gcj02",
|
||||
success(res) {
|
||||
location.lat = res.latitude;
|
||||
location.long = res.longitude;
|
||||
uni.setStorageSync('location', JSON.stringify(location))
|
||||
checkOrder();
|
||||
},
|
||||
fail() {
|
||||
uni.$u.toast('获取位置当前失败，为你推荐当前门店')
|
||||
checkOrder(STORE_INFO.id);
|
||||
},
|
||||
complete() {}
|
||||
})
|
||||
}
|
||||
onShow(() => {
|
||||
getAddressList();
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue