邓洁 : 首页icon页面渲染

components/SearchShopListItem/SearchShopListItem.vue

@@ -3,7 +3,7 @@
 		<view class="yzr" v-if="showStyle === 2">
 			<u-image src="/static/cjal/anl_tu.png" width="156rpx" height="156rpx"></u-image>
 		</view>
-		<view class="list-container">
+		<view class="list-container" @click="enterDetail()">
 			<view class="text-area">
 				<text>{{shopInfo.tt}}</text>
 
@@ -141,6 +141,18 @@
 
 		},
 		methods: {
+			enterDetail() {
+				// console.log("进入详情页面");
+				const query = this.$u.queryParams({
+					id: this.shopInfo.id,
+					type: this.shopInfo.type,
+					search: 1
+				})
+				console.log("query", query);
+				uni.navigateTo({
+					url: '/pages/detail/detail' + `${query}`
+				})
+			},
 			handleEdit(searchid) {
 				// TODO 完成页面跳转
 				console.log("点击了编辑ID为", searchid);
@@ -221,6 +233,7 @@
 			flex-direction: column;
 			justify-content: space-between;
 			width: 100%;
+
 			>text {
 				font-size: 14px;
 			}

pages.json

@@ -60,7 +60,7 @@
 		{
 			"path": "pages/detail/detail",
 			"style": {
-				"navigationBarTitleText": "商品详情",
+				"navigationBarTitleText": "商铺详情",
 				"navigationBarTextStyle": "white",
 				"navigationBarBackgroundColor": "#339967",
 				"enablePullDownRefresh": false

pages/detail/detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="detail" ref="viewref">
-		<view class="swiper">
+		<view class="swiper" v-if="search">
 			<u-swiper :list="shopInfo.pics" height="500rpx" radius="0"></u-swiper>
 		</view>
 		<view class="sub-detail u-flex">
@@ -30,7 +30,7 @@
 		<view class="location-detail">
 			<text>行业：{{shopInfo.trade1}}</text>
 			<text>区域：{{shopInfo.area1}}</text>
-			<text>地址：{{shopInfo.adress}}</text>
+			<text v-if="search">地址：{{shopInfo.adress}}</text>
 		</view>
 		<view class="bgc">
 
@@ -68,7 +68,7 @@
 				</u-modal>
 			</view>
 		</view>
-		<view class="bug-figure">
+		<view v-if="search" class="bug-figure">
 
 		</view>
 	</view>
@@ -79,11 +79,17 @@
 		data() {
 			return {
 				shopInfo: {},
-				showM: false
+				showM: false,
+				search: true
 			}
 		},
 		onLoad: function(options) {
 			console.log('detail', options);
+			if (options.search == "1") {
+				this.search = false
+			} else {
+				this.search = true
+			}
 			//点击轮播图跳转详情, 传递的参数id, type
 			if (options.id !== undefined && options.type !== undefined) {
 				this.getDetail(options.type, options.id)

pages/index/NavBarPages/cjal/cjal.vue

@@ -1,15 +1,10 @@
 <template>
 	<view class="marginLR10">
-		<view class="head-img">
+		<!-- 	<view class="head-img">
-			<u-image 
+			<u-image :src="headimg" width=100% height=200rpx radius="10px"></u-image>
-				:src="headimg" 
+		</view> -->
-				width=100%
-				height=200rpx
-				radius="10px"
-				></u-image>
-		</view>
 		<view>
-			<SearchShopList :show-style="2"></SearchShopList>
+			<SearchShopList :show-style="2" :searchInfoList="shopInfoList"></SearchShopList>
 		</view>
 	</view>
 </template>
@@ -19,10 +14,20 @@
 		data() {
 			return {
 				headimg: "https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg",
+				shopInfoList: [],
 			}
 		},
+		onLoad() {
+			this.getInfo()
+		},
 		methods: {
-			
+			getInfo() {
+				this.$api.getSuccList().then(res => {
+					this.shopListLength = res.data.data.length
+					this.shopInfoList = [...this.shopInfoList, ...res.data.data]
+					console.log(this.shopInfoList);
+				})
+			}
 		}
 	}
 </script>
@@ -31,14 +36,15 @@
 	page {
 		background-color: #f8f8f8;
 	}
+
 	.marginLR10 {
 		margin: 0 10px;
 	}
+
 	.head-img {
 		margin-top: 10rpx;
 		width: 100%;
 		height: 200rpx;
 		border-radius: 10px;
 	}
-	
+</style>
-</style>

pages/index/NavBarPages/czxx/czxx.vue

@@ -10,65 +10,108 @@
 				</view>
 			</view>
 		</view>
-		
+
 		<view>
-			<DropDown></DropDown>
+			<DropDown @getQueryInfo="getShopList"></DropDown>
 		</view>
 		<view class="marginLR10">
-			<ShowShopList :showStyle="2" :adlinkPath = "adlinkPath" :listType="3"/>
+			<ShowShopList :showStyle="2" :adlinkPath="adlinkPath" :listType="3" :shopInfoList="shopInfoList" />
 		</view>
 	</view>
 </template>
 
 <script>
+	import DropDownItem from "@/components/DropDown/DropDownItem.vue"
 	export default {
+		components: {
+			DropDownItem
+		},
 		data() {
 			return {
-				adlinkPath: "/pages/publish/publishRent/publishRent"
+				adlinkPath: "/pages/publish/publishRent/publishRent",
+				shopInfoList: [],
+				pageSize: 5,
+				pageNum: 1,
+				customQuery: {},
+				shopListLength: '',
 			}
 		},
+		onReachBottom() {
+			if (this.shopInfoList.length !== 0) {
+				this.pageNum++
+				this.getShopList()
+				console.log("触底加载");
+			}
+		},
+		onLoad() {
+			this.getShopList()
+		},
 		methods: {
-			
+			getShopList(q) {
+				let query = this.getQueryInfo(q)
+				console.log("listquery", query);
+				this.$api.getShopList(query).then(res => {
+					this.shopListLength = res.data.data.length
+					this.shopInfoList = [...this.shopInfoList, ...res.data.data]
+					console.log(this.shopInfoList);
+				})
+			},
+			getQueryInfo(query) {
+				console.log("getQueryInfo", query);
+				const q = this.$u.queryParams({
+					type: 3,
+					pageSize: this.pageSize,
+					pageNum: this.pageNum,
+					...query
+				})
+				this.customQuery = q
+				return q
+			},
 		}
 	}
 </script>
 
 <style lang="scss">
-	page{
+	page {
 		background-color: #F8F8F8;
 	}
-	.marginLR10{
+
+	.marginLR10 {
 		margin: 0 10px;
 	}
-	.search-box-bg{
+
+	.search-box-bg {
 		width: 100%;
 		position: relative;
 		z-index: 3;
 		background-color: #F8F8F8;
+
 		.bug-fix {
 			transform: translateY(-20rpx);
 			width: 100%;
 			height: 20rpx;
 		}
+
 		.search-box {
 			position: relative;
 			z-index: 2;
 			left: 50%;
 			width: 84.6%;
 			transform: translateX(-50%);
+
 			.search-box-input {
 				border-radius: 12rpx;
 				background-color: #fff;
 				opacity: 0.85;
-		
+
 				.u-border {
 					border: none;
-		
+
 					.u-input__content {
 						height: 62rpx;
 						border-radius: 12rpx;
 						background-color: #fff;
-		
+
 						.u-input__content__field-wrapper__field {
 							font-size: 26rpx !important;
 						}
@@ -77,5 +120,4 @@
 			}
 		}
 	}
-	
+</style>
-</style>

pages/index/NavBarPages/xmzs/xmzs.vue

@@ -10,65 +10,108 @@
 				</view>
 			</view>
 		</view>
-		
+
 		<view>
-			<DropDown></DropDown>
+			<DropDown @getQueryInfo="getShopList"></DropDown>
 		</view>
 		<view class="marginLR10">
-			<ShowShopList :showStyle="2" :adlinkPath="adlinkPath" :listType="4"/>
+			<ShowShopList :showStyle="2" :adlinkPath="adlinkPath" :listType="4" :shopInfoList="shopInfoList" />
 		</view>
 	</view>
 </template>
 
 <script>
+	import DropDownItem from "@/components/DropDown/DropDownItem.vue"
 	export default {
+		components: {
+			DropDownItem
+		},
 		data() {
 			return {
-				adlinkPath: "/pages/publish/publishInvestment/publishInvestment"
+				adlinkPath: "/pages/publish/publishInvestment/publishInvestment",
+				shopInfoList: [],
+				pageSize: 5,
+				pageNum: 1,
+				customQuery: {},
+				shopListLength: '',
 			}
 		},
+		onReachBottom() {
+			if (this.shopInfoList.length !== 0) {
+				this.pageNum++
+				this.getShopList()
+				console.log("触底加载");
+			}
+		},
+		onLoad() {
+			this.getShopList()
+		},
 		methods: {
-			
+			getShopList(q) {
+				let query = this.getQueryInfo(q)
+				console.log("listquery", query);
+				this.$api.getShopList(query).then(res => {
+					this.shopListLength = res.data.data.length
+					this.shopInfoList = [...this.shopInfoList, ...res.data.data]
+					console.log(this.shopInfoList);
+				})
+			},
+			getQueryInfo(query) {
+				console.log("getQueryInfo", query);
+				const q = this.$u.queryParams({
+					type: 4,
+					pageSize: this.pageSize,
+					pageNum: this.pageNum,
+					...query
+				})
+				this.customQuery = q
+				return q
+			},
 		}
 	}
 </script>
 
 <style lang="scss">
-	page{
+	page {
 		background-color: #F8F8F8;
 	}
-	.marginLR10{
+
+	.marginLR10 {
 		margin: 0 10px;
 	}
-	.search-box-bg{
+
+	.search-box-bg {
 		width: 100%;
 		position: relative;
 		z-index: 3;
 		background-color: #F8F8F8;
+
 		.bug-fix {
 			transform: translateY(-20rpx);
 			width: 100%;
 			height: 20rpx;
 		}
+
 		.search-box {
 			position: relative;
 			z-index: 2;
 			left: 50%;
 			width: 84.6%;
 			transform: translateX(-50%);
+
 			.search-box-input {
 				border-radius: 12rpx;
 				background-color: #fff;
 				opacity: 0.85;
-		
+
 				.u-border {
 					border: none;
-		
+
 					.u-input__content {
 						height: 62rpx;
 						border-radius: 12rpx;
 						background-color: #fff;
-		
+
 						.u-input__content__field-wrapper__field {
 							font-size: 26rpx !important;
 						}
@@ -77,5 +120,4 @@
 			}
 		}
 	}
-	
+</style>
-</style>

pages/index/NavBarPages/zdxx/zdxx.vue

@@ -10,65 +10,107 @@
 				</view>
 			</view>
 		</view>
-		
+
 		<view>
-			<DropDown></DropDown>
+			<DropDown @getQueryInfo="getShopList"></DropDown>
 		</view>
 		<view class="marginLR10">
-			<SearchShopList :showStyle="1"/>
+			<SearchShopList :showStyle="1" :searchInfoList="searchInfoList" />
 		</view>
 	</view>
 </template>
 
 <script>
+	import DropDownItem from "@/components/DropDown/DropDownItem.vue"
 	export default {
+		components: {
+			DropDownItem
+		},
 		data() {
 			return {
-				
+				pageSize: 5,
+				pageNum: 1,
+				searchInfoList: [],
+				customQuery: {},
+				searchListLength: '',
 			}
 		},
+		onReachBottom() {
+			if (this.searchListLength !== 0) {
+				this.pageNum++
+				this.getShopList()
+				console.log("触底加载");
+			}
+		},
+		created() {
+			this.getShopList()
+		},
 		methods: {
-			
+			getShopList(q) {
+				let query = this.getQueryInfo(q)
+				console.log("listquery", query);
+				this.$api.getShopList(query).then(res => {
+					this.searchListLength = res.data.data.length
+					this.searchInfoList = [...this.searchInfoList, ...res.data.data]
+					console.log(this.searchInfoList);
+				})
+			},
+			getQueryInfo(query) {
+				console.log("getQueryInfo", query);
+				const q = this.$u.queryParams({
+					type: 2,
+					pageSize: this.pageSize,
+					pageNum: this.pageNum,
+					...query
+				})
+				this.customQuery = q
+				return q
+			},
 		}
 	}
 </script>
 
 <style lang="scss">
-	page{
+	page {
 		background-color: #F8F8F8;
 	}
-	.marginLR10{
+
+	.marginLR10 {
 		margin: 0 10px;
 	}
-	.search-box-bg{
+
+	.search-box-bg {
 		width: 100%;
 		position: relative;
 		z-index: 3;
 		background-color: #F8F8F8;
+
 		.bug-fix {
 			transform: translateY(-20rpx);
 			width: 100%;
 			height: 20rpx;
 		}
+
 		.search-box {
 			position: relative;
 			z-index: 2;
 			left: 50%;
 			width: 84.6%;
 			transform: translateX(-50%);
+
 			.search-box-input {
 				border-radius: 12rpx;
 				background-color: #fff;
 				opacity: 0.85;
-		
+
 				.u-border {
 					border: none;
-		
+
 					.u-input__content {
 						height: 62rpx;
 						border-radius: 12rpx;
 						background-color: #fff;
-		
+
 						.u-input__content__field-wrapper__field {
 							font-size: 26rpx !important;
 						}
@@ -77,5 +119,4 @@
 			}
 		}
 	}
-	
+</style>
-</style>

pages/index/NavBarPages/zrxx/zrxx.vue

@@ -10,65 +10,108 @@
 				</view>
 			</view>
 		</view>
-		
+
 		<view>
-			<DropDown></DropDown>
+			<DropDown @getQueryInfo="getShopList"></DropDown>
 		</view>
 		<view class="marginLR10">
-			<ShowShopList :showStyle="1"/>
+			<ShowShopList :showStyle="1" :shopInfoList="shopInfoList" />
 		</view>
 	</view>
 </template>
 
 <script>
+	import DropDownItem from "@/components/DropDown/DropDownItem.vue"
 	export default {
+		components: {
+			DropDownItem
+		},
 		data() {
 			return {
-				
+				shopInfoList: [],
+				pageSize: 5,
+				pageNum: 1,
+				customQuery: {},
+				shopListLength: '',
+
 			}
 		},
+		onReachBottom() {
+			if (this.shopInfoList.length !== 0) {
+				this.pageNum++
+				this.getShopList()
+				console.log("触底加载");
+			}
+		},
+		onLoad() {
+			this.getShopList()
+		},
 		methods: {
-			
+			getShopList(q) {
+				let query = this.getQueryInfo(q)
+				console.log("listquery", query);
+				this.$api.getShopList(query).then(res => {
+					this.shopListLength = res.data.data.length
+					this.shopInfoList = [...this.shopInfoList, ...res.data.data]
+					console.log(this.shopInfoList);
+				})
+			},
+			getQueryInfo(query) {
+				console.log("getQueryInfo", query);
+				const q = this.$u.queryParams({
+					type: 1,
+					pageSize: this.pageSize,
+					pageNum: this.pageNum,
+					...query
+				})
+				this.customQuery = q
+				return q
+			},
 		}
 	}
 </script>
 
 <style lang="scss">
-	page{
+	page {
 		background-color: #F8F8F8;
 	}
-	.marginLR10{
+
+	.marginLR10 {
 		margin: 0 10px;
 	}
-	.search-box-bg{
+
+	.search-box-bg {
 		width: 100%;
 		position: relative;
 		z-index: 3;
 		background-color: #F8F8F8;
+
 		.bug-fix {
 			transform: translateY(-20rpx);
 			width: 100%;
 			height: 20rpx;
 		}
+
 		.search-box {
 			position: relative;
 			z-index: 2;
 			left: 50%;
 			width: 84.6%;
 			transform: translateX(-50%);
+
 			.search-box-input {
 				border-radius: 12rpx;
 				background-color: #fff;
 				opacity: 0.85;
-		
+
 				.u-border {
 					border: none;
-		
+
 					.u-input__content {
 						height: 62rpx;
 						border-radius: 12rpx;
 						background-color: #fff;
-		
+
 						.u-input__content__field-wrapper__field {
 							font-size: 26rpx !important;
 						}
@@ -77,5 +120,4 @@
 			}
 		}
 	}
-	
+</style>
-</style>