From 87c0c73cf537eab9ae6c102a20aab6ea64f0140c Mon Sep 17 00:00:00 2001
From: LuoShijie <rowe_jason@outlook.com>
Date: Thu, 9 Nov 2023 14:10:42 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BD=97=E4=B8=96=E6=9D=B0=EF=BC=9Afix?=
 =?UTF-8?q?=EF=BC=9A=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/DropDown/DropDown.vue              | 72 ++++++++++++-------
 components/DropDown/DropDownItem.vue          | 12 +++-
 .../ShowShopListItem/ShowShopListItem.vue     | 14 +++-
 pages/shopAddress/shopAddress.vue             | 12 ++--
 pages/shopTransfer/shopTransfer.vue           | 42 ++++-------
 5 files changed, 90 insertions(+), 62 deletions(-)

diff --git a/components/DropDown/DropDown.vue b/components/DropDown/DropDown.vue
index 80034ea..c3bec0a 100644
--- a/components/DropDown/DropDown.vue
+++ b/components/DropDown/DropDown.vue
@@ -1,12 +1,21 @@
 <template>
 	<view class="container">
-		<view 
-			class="title-view"
-			v-for="item in title"
-		>
-			<text>{{item}}</text>
-			<view class="arrow">
-				<u-image src="/static/dropdown/dp_icon_lxia.png" width="14rpx" height="11rpx"/>
+		<view class="tabs">
+			<view
+				class="title-view"
+				v-for="(item, index) in title"
+				@click="changeActiveIndex(index)"
+				:class="{isActive: activeIndex === index}"
+			>
+				<text>{{item}}</text>
+				<!-- <text>{{index}}</text> -->
+				<view class="arrow" v-if="activeIndex !== index">
+					<u-image src="/static/dropdown/dp_icon_lxia.png" width="14rpx" height="11rpx"/>
+				</view>
+				<view class="arrow" v-if="activeIndex === index">
+					<u-image src="/static/dropdown/dp_icon_hlxia.png" width="14rpx" height="11rpx"/>
+				</view>
+				
 			</view>
 		</view>
 		
@@ -18,33 +27,48 @@
 		name:"DropDown",
 		data() {
 			return {
-				title: ['行业','区域','面积','筛选']
+				title: ['行业','区域','面积','筛选'],
+				activeIndex: -1
 			};
+		},
+		methods: {
+			changeActiveIndex(index){
+				if(this.activeIndex === index){
+					this.activeIndex = -1;
+				}
+				this.activeIndex = index
+			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-.container{
-	height: 100rpx;
-	background-color: #fff;
-	display: flex;
-	justify-content: space-around;
-	.title-view {
-		display: flex;
-		>text {
-			font-size: 14px;
+	.isActive{
+		color: #CC3333;
+	}
+	.container{
+		
+		.tabs{
+			background-color: #fff;
+			height: 100rpx;
+			display: flex;
+			justify-content: space-around;
+		}
+		.title-view {
+			display: flex;
+			>text {
+				font-size: 14px;
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+			}
+		}
+		.arrow {
+			margin-left: 8rpx;
 			display: flex;
 			flex-direction: column;
 			justify-content: center;
 		}
 	}
-	.arrow {
-		margin-left: 8rpx;
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-	}
-}
 	
 </style>
\ No newline at end of file
diff --git a/components/DropDown/DropDownItem.vue b/components/DropDown/DropDownItem.vue
index 02409e3..4bcb550 100644
--- a/components/DropDown/DropDownItem.vue
+++ b/components/DropDown/DropDownItem.vue
@@ -1,8 +1,18 @@
 <template>
+	<view class="root">
+		
+	</view>
 </template>
 
 <script>
 </script>
 
-<style>
+<style lang="scss" scoped>
+	.root {
+		width: 100%;
+		height: calc(100% - 300rpx);
+		background-color: magenta;
+		position: absolute;
+		z-index: 4;
+	}
 </style>
\ No newline at end of file
diff --git a/components/ShowShopListItem/ShowShopListItem.vue b/components/ShowShopListItem/ShowShopListItem.vue
index 5e03e70..57e24b4 100644
--- a/components/ShowShopListItem/ShowShopListItem.vue
+++ b/components/ShowShopListItem/ShowShopListItem.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="list-border">
-		<view class="list-container">
-			<view class="shop-list-img">
+		<view class="list-container" @click="enterDetail()">
+			<view class="shop-list-img" >
 				<u-image width="80px" height="80px" :src="shopInfo.imageUrl" radius="8px"></u-image>
 			</view>
 			<view class="text-area">
@@ -87,7 +87,10 @@
 
 <script>
 	/**
-	 * @property shopInfo {Object}  传入商铺对象数据
+	 * @property {Object}   shopInfo          传入商铺对象数据
+	 * @property {Number}   showStyle        展示商铺的样式类型(0为首页默认)
+	 * @property {Boolean}  isADshow         是否显示推广广告
+	 * @property {Boolean}  isEdit           是否显示编辑和删除
 	 */
 	export default {
 		props: {
@@ -135,6 +138,11 @@
 			},
 			handleDel(shopid) {
 				this.$emit('delItem', shopid)
+			},
+			enterDetail(){
+				uni.navigateTo({
+					url: '/pages/detail/detail'
+				})
 			}
 		}
 	}
diff --git a/pages/shopAddress/shopAddress.vue b/pages/shopAddress/shopAddress.vue
index 92bb5e8..d0bb021 100644
--- a/pages/shopAddress/shopAddress.vue
+++ b/pages/shopAddress/shopAddress.vue
@@ -1,12 +1,14 @@
 <template>
 	<view class="root">
 		<InputAndSwiper></InputAndSwiper>
-		
-		<view style="margin-top: 10px;">
-			<DropDown></DropDown>
+		<view class="content">
+			<view style="margin-top: 10px;">
+				<DropDown></DropDown>
+			</view>
+			
+			<SearchShopList :showStyle="1"></SearchShopList>
 		</view>
 		
-		<SearchShopList :showStyle="1"></SearchShopList>
 		<TabBar :current-page="3"></TabBar>
 	</view>
 </template>
@@ -28,7 +30,7 @@
 	page {
 		background-color: $uni-bg-color-grey;
 	}
-	.root{
+	.content{
 		margin: 0 10px;
 	}
 </style>
diff --git a/pages/shopTransfer/shopTransfer.vue b/pages/shopTransfer/shopTransfer.vue
index 6ed7966..746ecbf 100644
--- a/pages/shopTransfer/shopTransfer.vue
+++ b/pages/shopTransfer/shopTransfer.vue
@@ -2,43 +2,27 @@
 	<view class="root">
 		<InputAndSwiper></InputAndSwiper>
 		
-		<view style="margin-top: 10px;">
-			<DropDown></DropDown>
+		<view class="content">
+			<view style="margin-top: 10px;">
+				<DropDown></DropDown>
+			</view>
+			
+			<ShowShopList :showStyle="1"></ShowShopList>
 		</view>
-		
-		<ShowShopList :showStyle="1"></ShowShopList>
+		<DropDownItem></DropDownItem>
 		<TabBar :current-page="1"></TabBar>
 	</view>
 </template>
 
 <script>
+	import DropDownItem from "@/components/DropDown/DropDownItem.vue"
 	export default {
+		components: {
+			DropDownItem
+		},
 		data() {
 			return {
-				value1: 1,
-								value2: 2,
-								options1: [{
-										label: '默认排序',
-										value: 1,
-									},
-									{
-										label: '距离优先',
-										value: 2,
-									},
-									{
-										label: '价格优先',
-										value: 3,
-									}
-								],
-								options2: [{
-										label: '去冰',
-										value: 1,
-									},
-									{
-										label: '加冰',
-										value: 2,
-									},
-								],
+				
 			}
 		},
 		methods: {
@@ -51,7 +35,7 @@
 	page {
 		background-color: $uni-bg-color-grey;
 	}
-	.root {
+	.content{
 		margin: 0 10px;
 	}