首页添加搜索框 物业管理等

api/community.js

@@ -1,4 +1,6 @@
 export const apiArr = {
+	isShowSearch: '/api/v1/wechat/home-page/search-enable/info', // 获取搜索框是否显示
+	hotWord: '/api/v1/wechat/home-page/search-hot-word/info', // 获取搜索框热词
 	list: '/api/v1/wechat/community/list', // 获取社区列表
 	info: '/api/v1/wechat/community/info', // 获取单个社区信息
 	isJoin: '/api/v1/wechat/community/is-join', // 用户是否加入社区、楼宇、房间

pages/index/index.css

@@ -1,13 +1,44 @@
+
 .container {
 	background-color: #f9f9f9;
 }
+
+.hot-word-container {
+	height: 40px;
+	overflow: hidden;
+	position: relative;
+	flex: 1;
+}
+
+.hot-word-scroll {
+	transition: transform 0.5s ease;
+}
+
+.hot-word-item {
+	height: 40px;
+	line-height: 40px;
+	padding: 0 10px;
+	color: #666;
+}
+
+.hot-word-item:active {
+	background-color: #f5f5f5;
+}
+
+.searchBox2 {
+	display: flex;
+	align-items: center;
+}
+
 .white_container {
 	background: #FFFFFF;
 	padding: 0 20rpx;
 }
+
 page {
 	background-color: #FFFFFF;
 }
+
 .grid_Pic {
 	width: 61.5rpx;
 	height: 63.14rpx;
@@ -35,16 +66,81 @@ page {
 	margin-right: 10rpx;
 }
 
+.search2 {
+	padding: 20rpx 0;
+}
+
+.function-nav {
+	display: flex;
+	justify-content: space-around;
+	padding: 20rpx 0;
+	margin: 20rpx -20rpx 0 -20rpx;
+
+	background-color: #f7f6fb;
+}
+
+.function-item {
+	width: 200rpx;
+	height: 180rpx;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	border-radius: 20rpx;
+	background-color: #fff;
+}
+
+.icon-box {
+	width: 120rpx;
+	height: 100rpx;
+	border-radius: 10rpx;
+	margin-top: 15rpx;
+	margin-bottom: 10rpx;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.icon-box image {
+	width: 70rpx;
+	height: 70rpx;
+}
+
+.function-item text {
+	font-size: 28rpx;
+	color: #333;
+}
+
+.searchBox2 {
+	width: 100%;
+	height: 60rpx;
+	background-color: #f6f7fb;
+	border-radius: 100rpx 100rpx 100rpx 100rpx;
+	margin-right: 170rpx;
+	display: flex;
+	box-sizing: border-box;
+	align-items: center;
+	padding-left: 30rpx;
+	padding-right: 30rpx;
+	font-size: 26rpx;
+}
+
+.searchBox2 image {
+	width: 28rpx;
+	height: 28rpx;
+	margin-right: 16rpx;
+}
+
 .swiper {
 	width: 710rpx;
 	height: 300rpx;
 	margin: 0 auto;
-	margin-top: 30rpx;
+	margin-top: 10rpx;
 	position: relative;
 	border-radius: 20rpx;
 	overflow: hidden;
 }
-.swiper swiper{
+
+.swiper swiper {
 	height: 100%;
 }
 
@@ -117,17 +213,19 @@ page {
 	font-size: 36rpx;
 	color: #222222;
 }
+
 .local {
 	max-width: 414rpx;
 	overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
-	
+
 }
+
 .Tit_desc {
 	padding: 0 12rpx;
 	height: 36rpx;
-	background: linear-gradient( 90deg, #FFA100 0%, #FF6A00 100%);
+	background: linear-gradient(90deg, #FFA100 0%, #FF6A00 100%);
 	border-radius: 100rpx 100rpx 100rpx 100rpx;
 	font-weight: normal;
 	font-size: 26rpx;
@@ -154,6 +252,7 @@ page {
 	position: relative;
 	margin-bottom: 12rpx;
 }
+
 .serverList_left {
 	display: block;
 	width: 260rpx;
@@ -161,7 +260,7 @@ page {
 	margin-right: 17rpx;
 }
 
-.serverList_left swiper{
+.serverList_left swiper {
 	height: 100%;
 }
 
@@ -182,19 +281,20 @@ page {
 
 .serverItem3 {
 	background: #F1FFEC;
-margin-right: 12rpx;
+	margin-right: 12rpx;
 }
 
 .serverItem4 {
 	background: #F0FDFF;
 }
+
 .serverItem5 {
-background: #EFF7FF;
-margin-right: 12rpx;
+	background: #EFF7FF;
+	margin-right: 12rpx;
 }
 
 .serverItem6 {
-background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
+	background: linear-gradient(180deg, #FFFFFF 0%, #FFEDF2 100%);
 }
 
 .serverItem1 image {
@@ -228,6 +328,7 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
 	top: 30rpx;
 	right: 11rpx;
 }
+
 .serverItem5 image {
 	width: 162rpx;
 	height: 93rpx;
@@ -250,7 +351,7 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
 	text-align: center;
 	width: 710rpx;
 	border-radius: 100rpx 100rpx 100rpx 100rpx;
-	background: linear-gradient( 91deg, #FF7658 0%, #FF370B 100%);
+	background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
 	font-weight: normal;
 	font-size: 36rpx;
 	color: #FFFFFF;
@@ -260,16 +361,19 @@ background: linear-gradient( 180deg, #FFFFFF 0%, #FFEDF2 100%);
 .padding_bottom32 {
 	padding-bottom: 32rpx;
 }
+
 .main {
 	display: flex;
 	flex-wrap: wrap;
 }
+
 .list_pic {
 	width: 345rpx;
 	height: 345rpx;
 	margin-right: 20rpx;
 	margin-bottom: 20rpx;
 }
+
 .list_pic:nth-child(2n) {
 	margin-right: 0;
 }