weipengfei
/
purchase-let
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

下拉隐藏

This commit is contained in:
zmj 2024-05-06 17:57:19 +08:00
parent dcbbe57d64
commit 6d48c1c8d0
5 changed files with 986 additions and 893 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
components/shopListPopup.vue
View File

@ -1,16 +1,19 @@
<template> <template>
<!-- fixed -->
<up-popup :show="show" closeable round="10" @close="close"> <up-popup :show="show" closeable round="10" @close="close">
<view class="address-popup"> <view class="address-popup">
<view class="head-title">选择提货点</view> <view class="head-title">选择提货点</view>
<view class="list-admin"> <view class="list-admin">
<up-search placeholder="请输入提货点名称" @search="searchKeyword" v-model="keyword" @custom="searchKeyword"></up-search> <up-search placeholder="请输入提货点名称" @search="searchKeyword" v-model="keyword"
@custom="searchKeyword"></up-search>
</view> </view>
<scroll-view style="height: 600rpx;padding-bottom: 20rpx;" scroll-y> <scroll-view style="height: 600rpx;padding-bottom: 20rpx;" scroll-y>
<view class="row" v-for="(item,index) in list" :key="index" @click="addressType=index"> <view class="row" v-for="(item,index) in list" :key="index" @click="addressType=index">
<view class="content"> <view class="content">
<view class="top"> <view class="top">
<view class="name">{{item.mer_name}}</view> <view class="name">{{item.mer_name}}</view>
<u-tag v-if="item.distance" style="pointer-events: none;" :text="item.distance" type="success" plain size="mini"></u-tag> <u-tag v-if="item.distance" style="pointer-events: none;" :text="item.distance"
type="success" plain size="mini"></u-tag>
</view> </view>
<view class="bottom u-line-2">{{item.service_phone}}</view> <view class="bottom u-line-2">{{item.service_phone}}</view>
</view> </view>
@ -24,7 +27,9 @@
</template> </template>
<script setup> <script setup>
import { ref } from "vue" import {
ref
} from "vue"
const addressType = ref(-1) const addressType = ref(-1)
@ -35,7 +40,7 @@
}, },
list: { list: {
type: Array, type: Array,
default: ()=>[] default: () => []
} }
}) })
@ -49,11 +54,11 @@
} }
const keyword = ref('') const keyword = ref('')
const searchKeyword = ()=>{ const searchKeyword = () => {
emit('search', keyword.value); emit('search', keyword.value);
} }
const navTo = (url)=>{ const navTo = (url) => {
uni.navigateTo({ uni.navigateTo({
url: url url: url
}) })

11
pageQuota/goodDetail/index.vue Normal file
View File

@ -0,0 +1,11 @@
<template>
<view class="">
商品详情
</view>
</template>
<script>
</script>
<style>
</style>

18
pageQuota/quotation/index.vue Normal file
View File

@ -0,0 +1,18 @@
<template>
<view class="">
<up-navbar placeholder style="z-index: 10080;">
<template #left>
<view style="font-size: 30rpx;font-weight: bold;" @click="test">报价单</view>
</template>
</up-navbar>
dgfsdhjg
</view>
</template>
<script>
</script>
<style>
</style>

19
pages.json
View File

@ -81,7 +81,26 @@
} }
} }
] ]
}, {
"root": "pageQuota",
"pages": [{
"path": "quotation/index",
"style": {
"navigationBarTitleText": "报价单",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "goodDetail/index",
"style": {
"navigationBarTitleText": "商品详情",
"enablePullDownRefresh": false
}
}
]
}], }],
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "", "navigationBarTitleText": "",

122
pages/index/index.vue
View File

@ -2,12 +2,13 @@
<view class="content"> <view class="content">
<up-navbar placeholder style="z-index: 10080;"> <up-navbar placeholder style="z-index: 10080;">
<template #left> <template #left>
<view style="font-size: 30rpx;font-weight: bold;">惠农批发</view> <view style="font-size: 30rpx;font-weight: bold;" @click="test">惠农批发</view>
</template> </template>
</up-navbar> </up-navbar>
<view class="navbar"> <view class="navbar">
<view style="width: 500rpx;"> <view style="width: 500rpx;">
<up-search placeholder="请输入商品" @search="searchKeyword" v-model="keyword" :showAction="false"></up-search> <up-search placeholder="请输入商品" @search="searchKeyword" v-model="keyword"
:showAction="false"></up-search>
</view> </view>
<view class="nav-item" @click="navTo('/pages/cart/cart')"> <view class="nav-item" @click="navTo('/pages/cart/cart')">
<image src="@/static/tab/ba.png"></image> <image src="@/static/tab/ba.png"></image>
@ -18,11 +19,11 @@
<text>个人中心</text> <text>个人中心</text>
</view> </view>
</view> </view>
<view style="position: relative;overflow: hidden;"> <view class='headScoll' ref='headscroll' :style="{height:isScroll?'0':'200rpx'}">
<scroll-view class="head-view" scroll-x> <scroll-view class="head-view" scroll-x>
<view class="list"> <view class="list">
<view class="item" :class="{'item-active': topActive===item.id}" v-for="(item, index) in goodClassList" <view class="item" :class="{'item-active': topActive===item.id}"
:key="index" @click="changeOne(item, index)"> v-for="(item, index) in goodClassList" :key="index" @click="changeOne(item, index)">
<view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image></view> <view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image></view>
<view class="c-text u-line-1">{{item.name}}</view> <view class="c-text u-line-1">{{item.name}}</view>
</view> </view>
@ -41,9 +42,10 @@
<view class="head-title">全部分类</view> <view class="head-title">全部分类</view>
<scroll-view scroll-y style="height: 600rpx;"> <scroll-view scroll-y style="height: 600rpx;">
<view class="list"> <view class="list">
<view class="item" :class="{'item-active': topActive===item.id}" v-for="(item, index) in goodClassList" <view class="item" :class="{'item-active': topActive===item.id}"
:key="index" @click="changeOne(item, index)"> v-for="(item, index) in goodClassList" :key="index" @click="changeOne(item, index)">
<view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image></view> <view class="c-img"><up-image height="100rpx" width="100rpx" :src="item.pic"></up-image>
</view>
<view class="c-text u-line-1">{{item.name}}</view> <view class="c-text u-line-1">{{item.name}}</view>
</view> </view>
</view> </view>
@ -52,8 +54,9 @@
</viewPopup> </viewPopup>
<view class="scroll-box"> <view class="scroll-box">
<scroll-view class="left" scroll-y> <scroll-view class="left" scroll-y>
<view class="item u-line-1" :class="{'item-active': leftActive===item.id}" v-for="(item, index) in goodClassTow" <view class="item u-line-1" :class="{'item-active': leftActive===item.id}"
:key="index" @click="changeTwo(item, index)">{{item.name}}</view> v-for="(item, index) in goodClassTow" :key="index" @click="changeTwo(item, index)">{{item.name}}
</view>
<view style="width: 100%;height: 300rpx;"></view> <view style="width: 100%;height: 300rpx;"></view>
</scroll-view> </scroll-view>
<view class="right"> <view class="right">
@ -74,24 +77,27 @@
<view class="item" :class="{'order-active': where.order==''}" @click="changeOrder('')">综合</view> <view class="item" :class="{'order-active': where.order==''}" @click="changeOrder('')">综合</view>
<view class="item" :class="{'order-active': where.order=='desc'||where.order=='asc'}" <view class="item" :class="{'order-active': where.order=='desc'||where.order=='asc'}"
@click="changeOrder(where.order=='asc'?'desc':'asc')">价格</view> @click="changeOrder(where.order=='asc'?'desc':'asc')">价格</view>
<view class="item" :class="{'order-active': where.order=='sales'}" @click="changeOrder('sales')">销量</view> <view class="item" :class="{'order-active': where.order=='sales'}"
@click="changeOrder('sales')">销量</view>
</view> </view>
</view> </view>
<viewPopup v-if="show===2" @close="show=0"> <viewPopup v-if="show===2" @close="show=0">
<view class="cateOne"> <view class="cateOne">
<scroll-view scroll-y style="height: 230rpx;"> <scroll-view scroll-y style="height: 230rpx;">
<view class="classify-list"> <view class="classify-list">
<view class="classify-list-item u-line-1" :class="{'item-active': rightActive===item.id}" <view class="classify-list-item u-line-1"
v-for="(item, index) in goodClassThree" :key="index" @click="changeThree(item, index)"> :class="{'item-active': rightActive===item.id}"
v-for="(item, index) in goodClassThree" :key="index"
@click="changeThree(item, index)">
{{item.name}} {{item.name}}
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
</view> </view>
</viewPopup> </viewPopup>
<scroll-view class="list" scroll-y @scrolltolower="loadMoreGood"> <scroll-view class="list" scroll-y @scrolltolower="loadMoreGood" @scroll='hideHeadView'>
<view class="shop-item" v-for="(item, index) in goodList" :key="item.id" @click="openGoodPopup(item)"> <view class="shop-item" v-for="(item, index) in goodList" :key="item.id">
<view class="shop-img"> <view class="shop-img" @tap="navTo(`/pageQuota/goodDetail/index`)">
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image> <up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
</view> </view>
<view class="shop-content"> <view class="shop-content">
@ -105,7 +111,7 @@
</view> </view>
<view class="price-btn"> <view class="price-btn">
<view class="price">￥{{item.sell}}</view> <view class="price">￥{{item.sell}}</view>
<view class="btn"> <view class="btn" @click="openGoodPopup(item)">
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon> <u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
</view> </view>
</view> </view>
@ -140,14 +146,41 @@
</template> </template>
<script setup> <script setup>
import { onLoad, onShow } from "@dcloudio/uni-app" import {
import { reactive, ref } from "vue" onLoad,
import { goodListApi, goodClassListApi } from "@/api/good.js" onShow
import { cartCreateApi, cartChangeApi, cartListApi } from "@/api/cart.js" } from "@dcloudio/uni-app"
import {
reactive,
ref
} from "vue"
import {
goodListApi,
goodClassListApi
} from "@/api/good.js"
import {
cartCreateApi,
cartChangeApi,
cartListApi
} from "@/api/cart.js"
import viewPopup from "@/components/viewPopup.vue" import viewPopup from "@/components/viewPopup.vue"
import goodPopup from "@/components/goodPopup.vue" import goodPopup from "@/components/goodPopup.vue"
import useCartStore from "@/store/cart.js" import useCartStore from "@/store/cart.js"
/*商品列表滚动隐藏头部导航 */
const isScroll = ref(false)
let lastScollTop = 0
const hideHeadView = (e) => {
isScroll.value = e.detail.scrollTop > lastScollTop
lastScollTop = e.detail.scrollTop
}
/*商品列表滚动隐藏头部导航结束 */
const test = () => {
uni.navigateTo({
url: '/pageQuota/quotation/index'
})
}
const cartStore = useCartStore(); const cartStore = useCartStore();
const show = ref(0); const show = ref(0);
@ -232,10 +265,10 @@
let class_id = rightActive.value || leftActive.value || topActive.value || ''; let class_id = rightActive.value || leftActive.value || topActive.value || '';
let class_all = ''; let class_all = '';
// 若分类没有选中时,则直接查询上一级分类 // 若分类没有选中时,则直接查询上一级分类
if(rightActive.value=='') class_all = leftActive.value; if (rightActive.value == '') class_all = leftActive.value;
if(leftActive.value=='') class_all = topActive.value; if (leftActive.value == '') class_all = topActive.value;
if(topActive.value=='') class_all = ''; if (topActive.value == '') class_all = '';
if(class_all) class_id = ""; //只能带其中一个 if (class_all) class_id = ""; //只能带其中一个
goodListApi({ goodListApi({
...where.value, ...where.value,
class_all: class_all, class_all: class_all,
@ -262,15 +295,15 @@
pic: "https://lihai001.oss-cn-chengdu.aliyuncs.com/def/35adb202404271727457954.png", pic: "https://lihai001.oss-cn-chengdu.aliyuncs.com/def/35adb202404271727457954.png",
children: [] children: []
}) })
res.data.lists = res.data.lists.map(item=>{ res.data.lists = res.data.lists.map(item => {
if(!item.children) item.children = []; if (!item.children) item.children = [];
item.children?.unshift({ item.children?.unshift({
id: "", id: "",
pid: item.id, pid: item.id,
name: "全部", name: "全部",
}) })
item.children = item.children.map(t=>{ item.children = item.children.map(t => {
if(!t.children) t.children = []; if (!t.children) t.children = [];
t.children?.unshift({ t.children?.unshift({
id: "", id: "",
pid: t.id, pid: t.id,
@ -304,12 +337,12 @@
goodRef.value.setData(item); goodRef.value.setData(item);
showGoodPopup.value = true; showGoodPopup.value = true;
}; };
const changeGood = (data)=>{ // 确定选择商品重量 const changeGood = (data) => { // 确定选择商品重量
showGoodPopup.value = false; showGoodPopup.value = false;
addCart(data.id, data.cart_num); addCart(data.id, data.cart_num);
} }
// 结算 // 结算
const settleAccounts = ()=>{ const settleAccounts = () => {
uni.navigateTo({ uni.navigateTo({
url: '/pagesOrder/settle/settle' url: '/pagesOrder/settle/settle'
}) })
@ -320,16 +353,16 @@
total_price: '0.00', total_price: '0.00',
count: 0 count: 0
}) })
const getCartList = (res)=>{ const getCartList = (res) => {
cartListApi({ cartListApi({
page_no: 1, page_no: 1,
page_size: 100, page_size: 100,
}).then(res=>{ }).then(res => {
cartInfo.value = { cartInfo.value = {
total_price: res.data?.extend?.total_price || '0.00', total_price: res.data?.extend?.total_price || '0.00',
count: res.data?.count || 0 count: res.data?.count || 0
} }
cartStore.setCartList(res.data?.lists.map(item=>item.cart_id)) cartStore.setCartList(res.data?.lists.map(item => item.cart_id))
}) })
} }
@ -337,7 +370,7 @@
getgoodClassList(); getgoodClassList();
getGoodList(); getGoodList();
}) })
onShow(()=>{ onShow(() => {
getCartList(); getCartList();
}) })
</script> </script>
@ -454,6 +487,7 @@
justify-content: center; justify-content: center;
grid-gap: 20rpx; grid-gap: 20rpx;
.item { .item {
width: 120rpx; width: 120rpx;
margin: 0 auto; margin: 0 auto;
@ -524,9 +558,9 @@
display: flex; display: flex;
.left { .left {
height: calc(100vh - var(--window-top) - var(--window-bottom) - 500rpx); height: calc(100vh - var(--window-top) - var(--window-bottom) - 300rpx);
/* #ifdef H5 */ /* #ifdef H5 */
height: calc(100vh - 44px - 300rpx); height: calc(100vh - 44px - 100rpx);
/* #endif */ /* #endif */
width: 170rpx; width: 170rpx;
box-sizing: border-box; box-sizing: border-box;
@ -559,9 +593,9 @@
} }
.right { .right {
height: calc(100vh - var(--window-top) - 500rpx); height: calc(100vh - var(--window-top) - 300rpx);
/* #ifdef H5 */ /* #ifdef H5 */
height: calc(100vh - 96px - 180rpx); height: calc(100vh - 96px + 20rpx);
/* #endif */ /* #endif */
width: 580rpx; width: 580rpx;
box-sizing: border-box; box-sizing: border-box;
@ -626,9 +660,9 @@
} }
.list { .list {
height: calc(100vh - var(--window-top) - 600rpx); height: calc(100vh - var(--window-top) - 400rpx);
/* #ifdef H5 */ /* #ifdef H5 */
height: calc(100vh - 44px - 400rpx); height: calc(100vh - 44px - 200rpx);
/* #endif */ /* #endif */
.shop-item { .shop-item {
@ -743,4 +777,10 @@
} }
} }
} }
.headScoll {
position: relative;
overflow: hidden;
transition: 400ms;
}
</style> </style>