下拉隐藏
This commit is contained in:
parent
dcbbe57d64
commit
6d48c1c8d0
|
@ -1,16 +1,19 @@
|
|||
<template>
|
||||
<!-- fixed -->
|
||||
<up-popup :show="show" closeable round="10" @close="close">
|
||||
<view class="address-popup">
|
||||
<view class="head-title">选择提货点</view>
|
||||
<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>
|
||||
<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="content">
|
||||
<view class="top">
|
||||
<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 class="bottom u-line-2">{{item.service_phone}}</view>
|
||||
</view>
|
||||
|
@ -24,7 +27,9 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue"
|
||||
import {
|
||||
ref
|
||||
} from "vue"
|
||||
|
||||
const addressType = ref(-1)
|
||||
|
||||
|
|
|
@ -0,0 +1,11 @@
|
|||
<template>
|
||||
<view class="">
|
||||
商品详情
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -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
19
pages.json
|
@ -81,7 +81,26 @@
|
|||
}
|
||||
}
|
||||
]
|
||||
}, {
|
||||
"root": "pageQuota",
|
||||
"pages": [{
|
||||
"path": "quotation/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "报价单",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goodDetail/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}],
|
||||
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "",
|
||||
|
|
|
@ -2,12 +2,13 @@
|
|||
<view class="content">
|
||||
<up-navbar placeholder style="z-index: 10080;">
|
||||
<template #left>
|
||||
<view style="font-size: 30rpx;font-weight: bold;">惠农批发</view>
|
||||
<view style="font-size: 30rpx;font-weight: bold;" @click="test">惠农批发</view>
|
||||
</template>
|
||||
</up-navbar>
|
||||
<view class="navbar">
|
||||
<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 class="nav-item" @click="navTo('/pages/cart/cart')">
|
||||
<image src="@/static/tab/ba.png"></image>
|
||||
|
@ -18,11 +19,11 @@
|
|||
<text>个人中心</text>
|
||||
</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>
|
||||
<view class="list">
|
||||
<view class="item" :class="{'item-active': topActive===item.id}" v-for="(item, index) in goodClassList"
|
||||
:key="index" @click="changeOne(item, index)">
|
||||
<view class="item" :class="{'item-active': topActive===item.id}"
|
||||
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-text u-line-1">{{item.name}}</view>
|
||||
</view>
|
||||
|
@ -41,9 +42,10 @@
|
|||
<view class="head-title">全部分类</view>
|
||||
<scroll-view scroll-y style="height: 600rpx;">
|
||||
<view class="list">
|
||||
<view class="item" :class="{'item-active': topActive===item.id}" 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="item" :class="{'item-active': topActive===item.id}"
|
||||
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-text u-line-1">{{item.name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -52,8 +54,9 @@
|
|||
</viewPopup>
|
||||
<view class="scroll-box">
|
||||
<scroll-view class="left" scroll-y>
|
||||
<view class="item u-line-1" :class="{'item-active': leftActive===item.id}" v-for="(item, index) in goodClassTow"
|
||||
:key="index" @click="changeTwo(item, index)">{{item.name}}</view>
|
||||
<view class="item u-line-1" :class="{'item-active': leftActive===item.id}"
|
||||
v-for="(item, index) in goodClassTow" :key="index" @click="changeTwo(item, index)">{{item.name}}
|
||||
</view>
|
||||
<view style="width: 100%;height: 300rpx;"></view>
|
||||
</scroll-view>
|
||||
<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=='desc'||where.order=='asc'}"
|
||||
@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>
|
||||
<viewPopup v-if="show===2" @close="show=0">
|
||||
<view class="cateOne">
|
||||
<scroll-view scroll-y style="height: 230rpx;">
|
||||
<view class="classify-list">
|
||||
<view class="classify-list-item u-line-1" :class="{'item-active': rightActive===item.id}"
|
||||
v-for="(item, index) in goodClassThree" :key="index" @click="changeThree(item, index)">
|
||||
<view class="classify-list-item u-line-1"
|
||||
:class="{'item-active': rightActive===item.id}"
|
||||
v-for="(item, index) in goodClassThree" :key="index"
|
||||
@click="changeThree(item, index)">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</viewPopup>
|
||||
<scroll-view class="list" scroll-y @scrolltolower="loadMoreGood">
|
||||
<view class="shop-item" v-for="(item, index) in goodList" :key="item.id" @click="openGoodPopup(item)">
|
||||
<view class="shop-img">
|
||||
<scroll-view class="list" scroll-y @scrolltolower="loadMoreGood" @scroll='hideHeadView'>
|
||||
<view class="shop-item" v-for="(item, index) in goodList" :key="item.id">
|
||||
<view class="shop-img" @tap="navTo(`/pageQuota/goodDetail/index`)">
|
||||
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
|
||||
</view>
|
||||
<view class="shop-content">
|
||||
|
@ -105,7 +111,7 @@
|
|||
</view>
|
||||
<view class="price-btn">
|
||||
<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>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -140,14 +146,41 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad, onShow } 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 {
|
||||
onLoad,
|
||||
onShow
|
||||
} 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 goodPopup from "@/components/goodPopup.vue"
|
||||
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 show = ref(0);
|
||||
|
@ -454,6 +487,7 @@
|
|||
justify-content: center;
|
||||
grid-gap: 20rpx;
|
||||
|
||||
|
||||
.item {
|
||||
width: 120rpx;
|
||||
margin: 0 auto;
|
||||
|
@ -524,9 +558,9 @@
|
|||
display: flex;
|
||||
|
||||
.left {
|
||||
height: calc(100vh - var(--window-top) - var(--window-bottom) - 500rpx);
|
||||
height: calc(100vh - var(--window-top) - var(--window-bottom) - 300rpx);
|
||||
/* #ifdef H5 */
|
||||
height: calc(100vh - 44px - 300rpx);
|
||||
height: calc(100vh - 44px - 100rpx);
|
||||
/* #endif */
|
||||
width: 170rpx;
|
||||
box-sizing: border-box;
|
||||
|
@ -559,9 +593,9 @@
|
|||
}
|
||||
|
||||
.right {
|
||||
height: calc(100vh - var(--window-top) - 500rpx);
|
||||
height: calc(100vh - var(--window-top) - 300rpx);
|
||||
/* #ifdef H5 */
|
||||
height: calc(100vh - 96px - 180rpx);
|
||||
height: calc(100vh - 96px + 20rpx);
|
||||
/* #endif */
|
||||
width: 580rpx;
|
||||
box-sizing: border-box;
|
||||
|
@ -626,9 +660,9 @@
|
|||
}
|
||||
|
||||
.list {
|
||||
height: calc(100vh - var(--window-top) - 600rpx);
|
||||
height: calc(100vh - var(--window-top) - 400rpx);
|
||||
/* #ifdef H5 */
|
||||
height: calc(100vh - 44px - 400rpx);
|
||||
height: calc(100vh - 44px - 200rpx);
|
||||
|
||||
/* #endif */
|
||||
.shop-item {
|
||||
|
@ -743,4 +777,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.headScoll {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: 400ms;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue