From e743738779483a53b0dc5e5a2958649db2ce13ba Mon Sep 17 00:00:00 2001
From: unknown <331404948@qq.com>
Date: Wed, 24 Jan 2024 18:55:05 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=90=AD=E5=BB=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/searchRow/searchRow.vue      |  21 +-
 pages/tabbar/index/comp/informaItem.vue |  61 +++++
 pages/tabbar/index/comp/schoolItem.vue  |  98 ++++++++
 pages/tabbar/index/index.vue            | 433 +++++++-------------------------
 uni.scss                                |   2 +-
 5 files changed, 274 insertions(+), 341 deletions(-)
 create mode 100644 pages/tabbar/index/comp/informaItem.vue
 create mode 100644 pages/tabbar/index/comp/schoolItem.vue

diff --git a/components/searchRow/searchRow.vue b/components/searchRow/searchRow.vue
index a10a454..fbac4de 100644
--- a/components/searchRow/searchRow.vue
+++ b/components/searchRow/searchRow.vue
@@ -1,5 +1,5 @@
 <template>
-	<view class="searchBg">
+	<view class="searchBg" :style="{background: `${bg}`}">
 		<view class="flex">
 			<view class="searchIcon">
 				<image src="@/static/images/index/searchIcon.png" mode=""></image>
@@ -14,7 +14,21 @@
 
 <script>
 	export default {
-		props: ['placeholder', 'disable'],
+		// props: ['placeholder', 'disable', 'bg'],
+		props: {
+			placeholder: {
+				type: String,
+				default: ''
+			},
+			disable: {
+				type: Boolean,
+				default: false
+			},
+			bg: {
+				type: String,
+				default: '#ddd'
+			}
+		},
 		data() {
 			return {
 				keyword: ''
@@ -33,12 +47,11 @@
 
 <style lang="scss" scoped>
 	.searchBg {
-		background: #8ABAED;
 		width: 100%;
 		height: 72rpx;
 		border-radius: 16rpx;
 		line-height: 72rpx;
-	
+		
 		.flex {
 			height: 100%;
 			padding: 0 28rpx;
diff --git a/pages/tabbar/index/comp/informaItem.vue b/pages/tabbar/index/comp/informaItem.vue
new file mode 100644
index 0000000..2b1af88
--- /dev/null
+++ b/pages/tabbar/index/comp/informaItem.vue
@@ -0,0 +1,61 @@
+<template>
+	<view class="flex-b">
+		<view class="imgBox">
+			<image :src="item.picture" mode="aspectFill"></image>
+		</view>
+		<view class="rightText">
+			<view class="text towRowText">{{ item.title }}</view>
+			<view class="date">{{ $u.timeFormat(item.createTime, 'yyyy/mm/dd') }}</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			item: {
+				type: Object,
+				default () {
+					return {
+						picture: require('@/static/images/index/img_7@2x.png'),
+						title: '测试数据',
+						createTime: new Date()*1
+					}
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.flex-b {
+		padding: 30rpx 0 28rpx 0;
+	
+		.imgBox {
+			width: 184rpx;
+			height: 148rpx;
+			background: linear-gradient(180deg, rgba(0, 122, 255, 0.5) 0%, #007AFF 100%);
+			border-radius: 6rpx;
+			overflow: hidden;
+		}
+	
+		.rightText {
+			flex: 1;
+			padding: 0 0 0 30rpx;
+			height: 148rpx;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+	
+			.text {
+				font-size: 24rpx;
+				color: #333;
+			}
+	
+			.date {
+				font-size: 20rpx;
+				color: #686B73;
+			}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/tabbar/index/comp/schoolItem.vue b/pages/tabbar/index/comp/schoolItem.vue
new file mode 100644
index 0000000..eab87b4
--- /dev/null
+++ b/pages/tabbar/index/comp/schoolItem.vue
@@ -0,0 +1,98 @@
+<template>
+	<view class="itemBox" >
+		<view class="img">
+			<image src="@/static/images/index/img_7@2x.png" mode=""  ></image>
+		</view>
+		<view class="textCon">
+			<view class="name">翔力驾校</view>
+			<view class="flex-b">
+				<view class="starBox">
+					<!-- <u-rate active-color="#1989FA" inactive-color="#1989FA" gutter="1" :size="16"  :value="item.stars" :readonly="true" style="pointer-events: none;"></u-rate> -->
+					<view class="num">5分</view>
+				</view>
+				<view class="adr">距您0.6km</view> 
+			</view>
+			<!-- <view class="credit">行业信用 <text v-if="item.creditrating">{{item.creditrating}}</text></view>  {{ $u.utils.distanceFn(item.distance)}}-->
+		</view>
+		<callPhone v-if="showPhone" :servicePhone="[{name: item.phone}]">
+			<view class="pozPhone">
+				<image src="@/static/images/index/telephone.png" mode=""></image>
+			</view>
+		</callPhone>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			showPhone: {
+				type: Boolean,
+				default: true
+			},
+			item: {
+				type: Object,
+				default: {}
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.itemBox {
+		background: #FFFFFF;
+		border-radius: 16rpx;
+		padding: 24rpx;
+		position: relative;
+		display: flex;
+		margin-bottom: 20rpx;
+	}
+	.img {
+		width: 204rpx;
+		height: 140rpx;
+		background: #f6f6f6;
+		border-radius: 8rpx;
+		overflow: hidden;
+	}
+	
+	.textCon {
+		flex: 1;
+		font-size: 24rpx;
+		padding: 0 0 0 36rpx;
+		.name {
+			font-size: 32rpx;
+			margin-top: 4rpx;
+			color: #363A44;
+			font-weight: 600;
+			min-height: 84rpx;
+		}
+	
+		.starBox {
+			display: flex;
+			padding: 6rpx 0 6rpx 0;
+			.num {
+				color: $themC;
+			}
+		}
+	
+		.credit {
+			color: #1989FA;
+			margin-bottom: 4rpx;
+		}
+	
+		.adr {
+			color: #363A44;
+		}
+	}
+	
+	.pozPhone {
+		position: absolute;
+		top: 40%;
+		right: 20rpx;
+		width: 72rpx;
+		height: 72rpx;
+		transform: translateY(-50%);
+	}
+</style>
\ No newline at end of file
diff --git a/pages/tabbar/index/index.vue b/pages/tabbar/index/index.vue
index a69d603..2ef041b 100644
--- a/pages/tabbar/index/index.vue
+++ b/pages/tabbar/index/index.vue
@@ -1,44 +1,42 @@
 <template>
 	<view class="main pageBg">
-		<!-- <button @click="$goPage('/pages/userCenter/login/face')">进入人脸识别</button> -->
-		<view  style="background-color: #2170FD; width: 100%;height: 20rpx;"></view>
-		<!-- <u-navbar title=" " :bgColor="bgColor" :autoBack="false">
-			<view class="" slot="left">
-				<view class="flex">
-					<view class="adrsIcon">
-						<image src="@/static/images/index/dingwei.png" mode=""></image>
-					</view>
-					<view class="adr">{{ vuex_cityInfo.city }} </view>
-				</view>
-			</view>
-			<view class="rightScan" slot="right">
-				<view class="scan" @click="scanCodeFn">
-					<image src="@/static/images/index/scan.png" mode=""></image>
-				</view>
-			</view>
-		</u-navbar> -->
-		<!-- <button @click="refereshFn">刷新token</button> -->
-		<view class="TopCon" :style="{ backgroundImage: `url(${imgUrl})`, backgroundSize: backgroundSize }">
-			<view class="status_bar"></view>
+		<view class="status_bar"></view>
+		<view class="TopCon pad" >
 			<!-- 地址、扫一扫 -->
-			 <!-- #ifdef MP-WEIXIN -->
 			<view class="flex-b">
-				<view class="flex">
+				<view class="adrsCon">
 					<view class="adrsIcon">
 						<image src="@/static/images/index/dingwei.png" mode=""></image>
 					</view>
 					<view class="adr">{{ vuex_cityInfo.city || '杭州' }} </view>
 				</view>
+				<!-- 搜索 -->
+				<view class="searchCon"  @click.capture="$goPage('/pages/indexEntry/findShcool/searchShcool/searchShcool')">
+					<searchRow placeholder="搜索驾校、教练…" :disable="true"></searchRow>
+				</view>
 				<view class="scan" @click="scanCodeFn">
-					<image src="@/static/images/index/scan.png" mode=""></image>
+					<image src="@/static/images/index/scan.png" mode="aspectFill"></image>
 				</view>
-			</view>
-			<!-- #endif -->
-			<!-- 搜索 -->
-			<view class="searchCon"  @click.capture="$goPage('/pages/indexEntry/findShcool/searchShcool/searchShcool')">
-				<searchRow placeholder="搜索驾校、教练…" :disable="true"></searchRow>
-			</view>
+			</view>	
 		</view>
+		
+		<!-- 海报 -->
+		<view class="banner">
+			<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="swiperInfo" v-if="swiperInfo.length"
+				:current="current" :mode="mode" :dots-styles="dotsStyles"
+				field="content">
+				<swiper class="swiper-box" @change="change" :current="swiperDotIndex" >
+					<swiper-item v-for="(item, index) in swiperInfo" :key="index"  @click="$goPage('/pages/indexEntry/iIndustryInfo/detail/detail?id='+ item.id)">
+						<view class="swiper-item" :class="'swiper-item' + index">
+							<view class="imgBox">
+								<image :src="item.picture" mode="widthFix"></image>
+							</view>
+						</view>
+					</swiper-item>
+				</swiper>
+			</uni-swiper-dot>
+		</view>
+		
 		<view class="pad">
 			<!-- 精钢区 -->
 			<view class="card traTop">
@@ -51,67 +49,29 @@
 					</view>
 				</view>
 			</view>
-			<!-- 更多入口 -->
-			<view class="card">
-				<view class="ul3">
-					<view class="li3" v-for="(item,index) in moreSection" :key="index">
-						<view class="icon">
-							<image :src="item.icon" mode=""></image>
-						</view>
-						<view class="name">{{ item.text }}</view>
-					</view>
+			
+			<!-- 优质驾校 -->
+			<view class="schoolCon">
+				<view class="h1" style="margin: 28rpx 0;">优质驾校</view>
+				<view class="li" v-for="(item,index) in 3" :key="index">
+					<schoolItem/>
 				</view>
 			</view>
-			<!-- 行业资讯 -->
-			<view class="card">
-				<view class="information">
-					<view class="flex-b border">
-						<view class="h1">行业资讯</view>
-						<view class="more" @click="$goPage('/pages/indexEntry/iIndustryInfo/iIndustryInfo')">
-							<view class="text">更多</view>
-							<view class="icon">
-								<u-icon name="arrow-right"></u-icon>
-							</view>
-						</view>
-					</view>
-					<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="swiperInfo" v-if="swiperInfo.length"
-						:current="current" :mode="mode" style="height: 230rpx;" :dots-styles="dotsStyles"
-						field="content">
-						<swiper class="swiper-box" @change="change" :current="swiperDotIndex" style="height: 230rpx;">
-							<swiper-item v-for="(item, index) in swiperInfo" :key="index"  @click="$goPage('/pages/indexEntry/iIndustryInfo/detail/detail?id='+ item.id)">
-								<view class="swiper-item" :class="'swiper-item' + index">
-									<view class="flex-b">
-										<view class="imgBox">
-											<image :src="item.picture" mode="aspectFill"></image>
-										</view>
-										<view class="rightText">
-											<view class="text towRowText">{{ item.title }}</view>
-											<view class="date">{{ $u.timeFormat(item.createTime, 'yyyy/mm/dd') }}</view>
-										</view>
-									</view>
-								</view>
-							</swiper-item>
-						</swiper>
-					</uni-swiper-dot>
+			
+			<!-- 行业资讯，政策法规 -->
+			<view class="information">
+				<view class="tabs">
+					<view class="tab active">行业资讯</view>
+					<view class="tab">政策法规</view>
 				</view>
-			</view>
-			<!-- 服务专区 -->
-			<view class="card serviceCon">
-				<view class="h1">服务专区</view>
-				<view class="ul2">
-					<view class="li2" v-for="(item,index) in serviceSector" :key="index" :class="'li2Bg' + index" @click="goServiceSector(item)">
-						<view class="icon">
-							<image :src="item.icon" mode=""></image>
-						</view>
-						<view class="textCon">
-							<view class="text">{{ item.text }}</view>
-							<view class="tps">{{ item.tps}}</view>
-						</view>
+				<view class="ul">
+					<view class="li" v-for="(item,index) in 3" :key="index">
+						<informaItem/>
 					</view>
 				</view>
 			</view>
-			<view style="height: 20rpx;width: 100%;"></view>
 		</view>
+		
 		<u-popup :show="showPrivacy" mode="center" :round="20" >
 			<privacyPopup   @disagree="showPrivacy=false" @agree="showPrivacy=false"></privacyPopup>
 		</u-popup>
@@ -121,7 +81,10 @@
 <script>
 	import { imgUrl } from '@/config/site.config'
 	import { getarticleList } from '@/config/api.js'
+	import schoolItem from './comp/schoolItem'
+	import informaItem from './comp/informaItem'
 	export default {
+		components: { schoolItem, informaItem },
 		data() {
 			return {
 				showPrivacy: false,
@@ -129,7 +92,7 @@
 				backgroundSize: '100% 100%',
 				keywords: '',
 				entrySection: [{
-						text: '我要报名',
+						text: '学车报名',
 						icon: require('../../../static/images/index/ic_baoming.png'),
 						url: '/pages/indexEntry/enroll/enroll',
 						goPage: function (){
@@ -146,7 +109,7 @@
 						}
 					},
 					{
-						text: '找考场',
+						text: '找教练',
 						icon: require('../../../static/images/index/ic_kaochang.png'),
 						url: '/pages/indexEntry/examines/examines',
 						goPage: ((item)=>{
@@ -154,7 +117,7 @@
 						})
 					},
 					{
-						text: '找驾驶馆',
+						text: '理论学习',
 						icon: require('../../../static/images/index/ic_jsg.png'),
 						url: '/pages/carEntry/simulateAppointment/simulateAppointment',
 						goPage: ((item)=>{
@@ -162,45 +125,12 @@
 						})
 					},
 					{
-						text: '找陪练',
+						text: '签到签退',
 						icon: require('../../../static/images/index/ic_peilian.png'),
 						goPage: ((item)=>{
 							this.$u.toast('正在开发中，敬请期待...')
 						})
-					},
-					{
-						text: '理论学习',
-						icon: require('../../../static/images/index/ic_lilun.png'),
-						url: '/pages/indexEntry/theory/theory',
-						goPage: ((item)=>{
-							this.$goPage(item.url)
-						})
-					},
-				],
-				moreSection: [{
-						text: '摩托车业务',
-						icon: require('../../../static/images/index/btn_motuoche.png'),
-						url: '/pages/indexEntry/enroll/enroll'
-					},
-					{
-						text: '考试预约',
-						icon: require('../../../static/images/index/btn_yuyue.png'),
-						url: '/pages/indexEntry/findShcool/findShcool'
-					},
-					{
-						text: '交通求助',
-						icon: require('../../../static/images/index/btn_jiuzhu.png'),
-						url: '/pages/indexEntry/examines/examines'
-					},
-					{
-						text: '学驾保险',
-						icon: require('../../../static/images/index/btn_baoxian.png'),
-					},
-					{
-						text: '更多',
-						icon: require('../../../static/images/index/btn_gengduo.png'),
-						url: '/pages/indexEntry/theory/theory'
-					},
+					}
 				],
 				serviceSector: [{
 						text: '学车指南',
@@ -306,13 +236,7 @@
 				}
 				this.$goPage(item.url)
 			},
-			async goServiceSector(item) {
-				if(item.text=='咨询投诉') {
-					const res = this.$store.dispatch('checkLogin')
-					if(!res) return
-				}
-				this.$goPage(item.url)
-			},
+			
 			async getarticleListFn() {
 				const {data: res} = await getarticleList(this.params)
 				this.swiperInfo = res.list[0].articleManagementDO
@@ -397,24 +321,6 @@
 	.main {
 		width: 100%;
 
-		.flex {
-			.adrsIcon {
-				width: 26rpx;
-				height: 38rpx;
-				margin-top: 4rpx;
-			}
-
-			.adr {
-				padding-left: 14rpx;
-				font-size: 28rpx;
-				color: #fff;
-			}
-		}
-
-		.rightScan {
-			padding-right: 190rpx;
-		}
-
 		.scan {
 			width: 64rpx;
 			height: 64rpx;
@@ -422,25 +328,43 @@
 
 		.TopCon {
 			width: 100%;
-			height: 476rpx;
-			// background: url('../../../static/images/bigImg/index_banner.png') no-repeat;
-			// background: url('http://192.168.1.20:81/zhili/image/20230809/e7086ccf82ed4aa09d156f2590a50fba.png') no-repeat;
-
-			position: relative;
-
+			height: 120rpx;
 			.flex-b {
-				padding: 10rpx 212rpx 0 50rpx;
-
+				display: flex;
+				height: 100%;
 			}
-
-			.searchCon {
-				position: absolute;
-				left: 0;
-				bottom: 68rpx;
-				padding: 0 28rpx;
-				width: 100%;
-
+			.adrsCon {
+				display: flex;
+				align-items: center;
+				width: 180rpx;
+				height: 100%;
+				.adrsIcon {
+					width: 26rpx;
+					height: 38rpx;
+					margin-top: 4rpx;
+				}
 				
+				.adr {
+					padding-left: 14rpx;
+					font-size: 28rpx;
+					color: #333;
+				}
+			}
+			
+			.searchCon {
+				flex:1;
+			}
+			.scan {
+				width: 100rpx;
+				background-color: #ddd;
+				height: 100%;
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+				image {
+					width: 90rpx;
+					height: 90rpx;
+				}
 			}
 		}
 
@@ -451,13 +375,6 @@
 			border-radius: 16rpx;
 			margin-bottom: 20rpx;
 
-			&.traTop {
-				// transform: translateY(-40rpx);
-				margin-top: -40rpx;
-				position: relative;
-				z-index: 9;
-			}
-
 			.ul {
 				height: 236rpx;
 				display: flex;
@@ -484,174 +401,18 @@
 					}
 				}
 			}
-			.ul3 {
-				height: 128rpx;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				padding: 0 30rpx;
-				border: 2rpx solid #E8E9EC;
-				border-radius: 16rpx;
-				.li3 {
-					// flex: 1;
-					display: flex;
-					align-items: center;
-					flex-direction: column;
-			
-					.icon {
-						width: 52rpx;
-						height: 52rpx;
-					}
-			
-					.name {
-						font-size: 22rpx;
-						color: #686B73;
-						padding-top: 2rpx;
-						text-align: center;
-					}
-				}
-			}
 		}
-
-		.information {
-			padding: 0 20rpx;
-			height: 320rpx;
-
-			.border {
-				height: 86rpx;
-				border-bottom: 2px dashed #E8E9EC;
-
-				.h1 {
-					font-size: 28rpx;
-					color: #333;
-				}
-
-				.more {
-					font-size: 24rpx;
-					display: flex;
-
-					.text {
-						// margin-right: 8rpx;
-						color: #686B73;
-					}
-				}
-			}
-
-			.swiper-item {
-				height: 148rpx;
-
-				.flex-b {
-					padding: 30rpx 0 28rpx 0;
-
-					.imgBox {
-						width: 184rpx;
-						height: 148rpx;
-						background: linear-gradient(180deg, rgba(0, 122, 255, 0.5) 0%, #007AFF 100%);
-						border-radius: 6rpx;
-						overflow: hidden;
-					}
-
-					.rightText {
-						flex: 1;
-						padding: 0 0 0 30rpx;
-						height: 148rpx;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-
-						.text {
-							font-size: 24rpx;
-							color: #333;
-						}
-
-						.date {
-							text-align: right;
-							font-size: 20rpx;
-							color: #686B73;
-						}
-					}
-				}
-			}
-		}
-
-
-		.serviceCon {
-			width: 100%;
-			padding: 0 20rpx 20rpx 20rpx;
-
-			.h1 {
-				font-size: 28rpx;
-				color: #333;
-				padding: 0 0 0 20rpx;
-				font-weight: 500;
-				line-height: 90rpx;
-			}
-
-			.ul2 {
-				display: flex;
-				flex-wrap: wrap;
-				justify-content: space-between;
-
-				.li2 {
-					width: 48.8%;
-					display: flex;
-					align-items: center;
-					padding: 14rpx 0 14rpx 14rpx;
-					margin-bottom: 20rpx;
-					border-radius: 16rpx;
-					height: 160rpx;
-
-					&.li2Bg0 {
-						background: linear-gradient(180deg, #F7FBFF 0%, #EFF6FF 100%);
-					}
-
-					&.li2Bg1 {
-						background: linear-gradient(180deg, #FFFAF3 0%, #FFF4EA 100%);
-					}
-
-					&.li2Bg2 {
-						background: linear-gradient(180deg, #F4FFF5 0%, #F3FFED 100%);
-					}
-
-					&.li2Bg3 {
-						background: linear-gradient(180deg, #EFFFF9 0%, #E3FFF5 100%);
-					}
-
-					&.li2Bg4 {
-						background: linear-gradient(180deg, #FAF9FF 0%, #F9F5FF 100%);
-					}
-
-					&.li2Bg5 {
-						background: linear-gradient(180deg, #FCF9FB 0%, #FFF5F8 100%);
-					}
-					&.li2Bg6 {
-						background: linear-gradient(180deg, #FDFFF3 0%, #F5FFE1 100%);
-					}
-					&.li2Bg7 {
-						background: linear-gradient(180deg, #EDF7FF 0%, #F3F1FF 100%);
-					}
-					.icon {
-						width: 80rpx;
-						height: 80rpx;
-					}
-
-					.textCon {
-						// flex: 1;
-						padding-left: 10rpx;
-
-						.text {
-							font-size: 32rpx;
-							color: #333;
-							font-weight: 500;
-						}
-
-						.tps {
-							margin-top: 6rpx;
-							font-size: 20rpx;
-							color: #949494;
-						}
-					}
-				}
+	}
+	
+	.tabs {
+		display: flex;
+		padding: 20rpx 0 10rpx 0;
+		.tab {
+			font-size: 30rpx;
+			color: #333;
+			margin-right: 20rpx;
+			&.active {
+				border-bottom: 4px solid $themC
 			}
 		}
 	}
diff --git a/uni.scss b/uni.scss
index 8738726..2017b5b 100644
--- a/uni.scss
+++ b/uni.scss
@@ -77,4 +77,4 @@ $uni-color-paragraph: #3F536E; // 文章段落颜色
 $uni-font-size-paragraph:15px;
 
 // 自已定义的
-$themC: #1989FA,
+$themC: #FC9933,