Commit e29f1366 authored by 彭佳妮(贵阳日报)'s avatar 彭佳妮(贵阳日报)
parents 7f00aad4 af140c96
...@@ -75,7 +75,7 @@ const back = () => { ...@@ -75,7 +75,7 @@ const back = () => {
}; };
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
.searchComponent { .searchComponent {
position: sticky; position: sticky;
top: 0; top: 0;
......
...@@ -186,9 +186,7 @@ ...@@ -186,9 +186,7 @@
{ {
"path": "pages/assistingAgriculture/album/index", "path": "pages/assistingAgriculture/album/index",
"style": { "style": {
"navigationBarTitleText": "用户相册", "navigationBarTitleText": "用户相册"
"navigationBarBackgroundColor": "#ffffff",
"navigationStyle": ""
} }
}, },
{ {
...@@ -196,7 +194,7 @@ ...@@ -196,7 +194,7 @@
"style": { "style": {
"navigationBarTitleText": "购物车", "navigationBarTitleText": "购物车",
"navigationBarBackgroundColor": "#ffffff", "navigationBarBackgroundColor": "#ffffff",
"navigationStyle": "" "navigationStyle": "custom"
} }
}, },
{ {
...@@ -211,7 +209,7 @@ ...@@ -211,7 +209,7 @@
"path": "pages/assistingAgriculture/RuralTravel/RuralTravel", "path": "pages/assistingAgriculture/RuralTravel/RuralTravel",
"style": { "style": {
"navigationBarTitleText": "乡村旅居", "navigationBarTitleText": "乡村旅居",
"enablePullDownRefresh": true, "enablePullDownRefresh": true
} }
}, },
{ {
......
<template> <template>
<div class="route-details"> <div class="route-details">
<Search></Search>
<scroll-view class="container" scroll-y> <scroll-view class="container" scroll-y>
<img class="back-img" src="/static/assistingAgriculture/assets/left.png" @tap="back" /> <!-- <img class="back-img" src="/static/assistingAgriculture/assets/left.png" @tap="back" /> -->
<!-- 轮播 --> <!-- 轮播 -->
<div class="banner"> <div class="banner">
<!-- --> <!-- -->
...@@ -541,6 +542,13 @@ uni-page-body { ...@@ -541,6 +542,13 @@ uni-page-body {
background-color: #eaf9f1; background-color: #eaf9f1;
} }
.route-details { .route-details {
.searchComponent {
z-index: 55;
width: 100%;
position: fixed;
top: 0;
left: 0;
}
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
<template> <template>
<div class="album"> <div class="album">
<Search backgroundBox="white" title="用户相册" :showTitle="true"></Search>
<scroll-view class="content" @scrolltolower="scrolltolower" scroll-y> <scroll-view class="content" @scrolltolower="scrolltolower" scroll-y>
<!-- <div class="filter-box">
<div class="active">全部</div>
<div v-for="(v, i) in filterList" :key="i">{{ v.text }}({{ v.value }})</div>
</div> -->
<div class="card-wrap"> <div class="card-wrap">
<card :photoData="photoData" /> <card :photoData="photoData" />
</div> </div>
......
<template> <template>
<Search title="购物车" showTitle backgroundBox="#fff"></Search>
<div class="cart-wrap"> <div class="cart-wrap">
<div class="shop" v-for="(shop, i) in cartList" :key="i"> <div class="shop" v-for="(shop, i) in cartList" :key="i">
<div class="flex-align-center shop-info"> <div class="flex-align-center shop-info">
......
<template> <template>
<div class="comment-list"> <div class="comment-list">
<div class="top-bar flex-align-center"> <!-- <div class="top-bar flex-align-center">
<wd-icon name="thin-arrow-left" @tap="back"></wd-icon> <wd-icon name="thin-arrow-left" @tap="back"></wd-icon>
<wd-search @search="search" hide-cancel placeholder="点评关键词/特色" placeholder-left /> <wd-search @search="search" hide-cancel placeholder="点评关键词/特色" placeholder-left />
</div> </div> -->
<Search backgroundBox="white">
<wd-search @search="search" hide-cancel placeholder="点评关键词/特色" placeholder-left />
</Search>
<scroll-view @scrolltolower="scrolltolower" class="content" :scroll-y="true"> <scroll-view @scrolltolower="scrolltolower" class="content" :scroll-y="true">
<div class="filter-box"> <div class="filter-box">
<div class="score-sort flex-between"> <div class="score-sort flex-between">
...@@ -189,16 +192,11 @@ uni-page-body { ...@@ -189,16 +192,11 @@ uni-page-body {
background-color: #f3f3f3; background-color: #f3f3f3;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.top-bar { .wd-search {
padding: 16rpx 40rpx; width: 492rpx;
font-size: 28rpx; height: 56rpx;
background: #fff; padding: 0;
.wd-search { margin-left: 50rpx;
width: 492rpx;
height: 56rpx;
padding: 0;
margin-left: 20rpx;
}
} }
.content { .content {
height: 132rpx; height: 132rpx;
......
<template> <template>
<view class="container"> <view class="container">
<wd-icon name="thin-arrow-left" class="icon" @tap="back"></wd-icon> <Search title="优惠券" :showTitle="true" backgroundBox="white"></Search>
<scroll-view class="tabs" scroll-x="true" @scroll="scroll"> <scroll-view class="tabs" scroll-x="true" @scroll="scroll">
<text <text
@tap="choice(index, item.value)" @tap="choice(index, item.value)"
...@@ -145,18 +145,10 @@ page { ...@@ -145,18 +145,10 @@ page {
} }
.container { .container {
position: relative; position: relative;
.icon {
font-size: 28rpx;
margin-right: 40rpx;
position: absolute;
left: 30rpx;
top: 37rpx;
z-index: 999;
}
.tabs { .tabs {
white-space: nowrap; white-space: nowrap;
padding: 0 30rpx; padding: 0 30rpx;
padding-left: 80rpx; // padding-left: 80rpx;
box-sizing: border-box; box-sizing: border-box;
height: 100rpx; height: 100rpx;
line-height: 100rpx; line-height: 100rpx;
...@@ -167,7 +159,6 @@ page { ...@@ -167,7 +159,6 @@ page {
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 99; z-index: 99;
.tab { .tab {
display: inline-block; display: inline-block;
margin-right: 40rpx; margin-right: 40rpx;
......
...@@ -149,7 +149,7 @@ ...@@ -149,7 +149,7 @@
<!-- 美食卡片 --> <!-- 美食卡片 -->
<FoodDetails :cardData="cardData1" /> <FoodDetails :cardData="cardData1" />
<!-- 营销模块 --> <!-- 营销模块 -->
<Marketing /> <!-- <Marketing /> -->
<!-- 美食卡片 --> <!-- 美食卡片 -->
<FoodDetails :cardData="cardData2" /> <FoodDetails :cardData="cardData2" />
<view <view
...@@ -807,8 +807,8 @@ page { ...@@ -807,8 +807,8 @@ page {
box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(0, 0, 0, 0.08); box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(0, 0, 0, 0.08);
margin: 0 auto; margin: 0 auto;
margin-top: 10rpx; margin-top: 10rpx;
position: sticky; // position: sticky;
top: 0; // top: 0;
z-index: 99; z-index: 99;
uni-scroll-view .uni-scroll-view::-webkit-scrollbar { uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
/* 隐藏滚动条,但依旧具备可以滚动的功能 */ /* 隐藏滚动条,但依旧具备可以滚动的功能 */
......
<template> <template>
<view class="container"> <view class="container">
<search
:backIcon="backIcon"
style="position: fixed; top: 0; width: 100%"
:backgroundBox="backgroundBox"
:title="title"
:showTitle="true"
></search>
<view class="head"> <view class="head">
<view class="top" :style="{ backgroundImage: topBg }"> <view class="top" :style="{ backgroundImage: topBg }"></view>
<wd-icon name="thin-arrow-left" class="icon" @tap="back"></wd-icon>
</view>
<view class="bootom"> <view class="bootom">
<view class="bootom-top"> <view class="bootom-top">
<view class="option" @tap="locationFiltering(0)"> <view class="option" @tap="locationFiltering(0)">
...@@ -88,6 +93,9 @@ const topBg = ref(null); ...@@ -88,6 +93,9 @@ const topBg = ref(null);
const categoryData = ref([]); const categoryData = ref([]);
const show = ref(false); const show = ref(false);
const cardData = ref([]); const cardData = ref([]);
const backgroundBox = ref('');
const backIcon = ref('white');
const title = ref('');
let total; let total;
const paramsId = { const paramsId = {
parentId: null, parentId: null,
...@@ -240,6 +248,18 @@ const locationFiltering = (index) => { ...@@ -240,6 +248,18 @@ const locationFiltering = (index) => {
break; break;
} }
}; };
// 监听页面滚动
onPageScroll((e) => {
if (e.scrollTop > 20) {
backgroundBox.value = '#fff';
backIcon.value = '';
title.value = '美食';
} else {
backgroundBox.value = '';
backIcon.value = 'white';
title.value = '';
}
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment