车友- 司机 车队

pages/riders/index.vue

@@ -16,14 +16,15 @@
 			<view class="flex screen">
 				<view @click="selectAddress(1)" class="screen_item">
 					<view class="screen_sign sign1">装</view>
-					{{title1 ? title1 : "请选择地址"}}
+
+					<text style="font-size: 36rpx; font-weight: 700;">{{title1 ? title1 : "请选择地址"}}</text>
 				</view>
 				<itmister-address-picker ref="addressElone" @confirmChange="confirmChangeOne"></itmister-address-picker>
 				<u--image :showLoading="true" class="exchange" src="../../static/images/riders/exchange.png"
 					width="43px" height="43px" @click="replace"></u--image>
-				<view @click="selectAddress(2)" class="screen_item">
+				<view @click="selectAddress(2)" class="screen_item" style="align-items: flex-end;">
 					<view class="screen_sign sign2">卸</view>
-					{{title2 ? title2 : "请选择地址"}}
+					<text style="font-size: 36rpx; font-weight: 700;">{{title2 ? title2 : "请选择地址"}}</text>
 				</view>
 				<itmister-address-picker-other ref="addressEltwo" :wholeCountry="true"
 					@confirmChange="confirmChangeTwo"></itmister-address-picker-other>
@@ -31,24 +32,19 @@
 			<view class="route">
 				<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
 					<view v-for="(item,index) in routeData">
-						<view class="flex route_item">
-							<view style="width: 20%;">
-								<u-avatar :src="item.driverPortrait" size="60"></u-avatar>
+						<view class="flex route_item" style="margin-bottom: 70rpx;">
+							<view style="">
+								<u-avatar :src="item.driverPortrait" size="40"></u-avatar>
 							</view>
-							<view style="width: 80%;">
-								<view class="flex">
+							<view style="">
+								<view class="flex" style="width: 78vw;justify-content: space-between">
 									<view class="driver_name">
 										{{item.driverNickname}}
 									</view>
-									<view class="driver_invite">
-										<view class="route_invite" style="margin-left: 30px;" @click="invitation(item)">
-											<image src="../../static/images/riders/yaoqing.png" mode=""
-												style="width: 26rpx;height: 26rpx;margin-rigth:10rpx;"></image>邀请
-										</view>
+									<view class="route_invite" @click="invitation(item)">
+										<image src="../../static/images/riders/yaoqing.png" mode=""
+											style="width: 26rpx;height: 26rpx;margin-rigth:10rpx;"></image>邀请
 									</view>
-									<u-picker :show="fleetShow" :columns="columns" @cancel="fleetClose"
-										@confirm="invitationCheng">
-									</u-picker>
 								</view>
 								<view class="address" v-for="(items,index) in item.startAdress">
 									<span class="spots spot1"></span>
@@ -74,51 +70,52 @@
 		<view class="riders" v-if="indexbtn == 2">
 			<view class="flex riders_top">
 				<view @click="selectChange" class="riders_city">{{city ? city : province}}</view>
-				
+
 				<u-search placeholder="输入车队信息关键字" bgColor="#ffffff" v-model="searchKeyWord" @search="getList"
-					maxlength="15"></u-search>
+					maxlength="15" :actionStyle="actionStyle" actionText="查询"></u-search>
 			</view>
 			<view class="fleet">
 				<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
-				<view v-for="(item,index) in formData" class="flex">
-					<view class="fleet_item">
-						<view class="flex">
-							<u-avatar :src="item.coverUrl" size="45"></u-avatar>
-							<view class="fleet_name" @click="lookfleet(item)">
-								{{item.fleetName}}
-								<view class="fleet_member flex">
-									<u-avatar-group :urls="item.fleetMemberUrl.split(',')" size="24" gap="0.4">
-									</u-avatar-group>
-									<text class="fleet_number">{{item.fleetMemberNum}}人</text>
-									<!-- <image src="../../static/images/myimg/gengduo1@3x.png" class="arrow"></image> -->
-									<image src="../../static/images/myimg/gengduo1.png" mode=""
-										style="width: 18rpx;height: 20rpx;margin-top:14rpx;"></image>
+					<view v-for="(item,index) in formData" class="flex">
+						<view class="fleet_item">
+							<view class="flex">
+								<u-avatar :src="item.coverUrl" size="45"></u-avatar>
+								<view class="fleet_name" @click="lookfleet(item)">
+									{{item.fleetName}}
+									<view class="fleet_member flex">
+										<u-avatar-group :urls="item.fleetMemberUrl.split(',')" size="24" gap="0.4">
+										</u-avatar-group>
+										<text class="fleet_number">{{item.fleetMemberNum}}人</text>
+										<!-- <image src="../../static/images/myimg/gengduo1@3x.png" class="arrow"></image> -->
+										<image src="../../static/images/myimg/gengduo1.png" mode=""
+											style="width: 18rpx;height: 20rpx;margin-top:14rpx;"></image>
+									</view>
+								</view>
+								<view class="fleet_invite" v-if="!item.fleetMemberStatus" @click="joinFleet(item)">加入
 								</view>
+								<view class="fleet_invite" v-else>{{item.fleetMemberStatus}}</view>
 							</view>
-							<view class="fleet_invite" v-if="!item.fleetMemberStatus" @click="joinFleet(item)">加入</view>
-							<view class="fleet_invite" v-else>{{item.fleetMemberStatus}}</view>
-						</view>
 
-						<view class="fleet_introduce">
-							<u-read-more ref="uReadMore" :toggle="true" :shadowStyle="shadowStyle" closeText="查看全部"
-								:showHeight="20">
-								<rich-text :nodes="item.fleetProfile"></rich-text>
-							</u-read-more>
+							<view class="fleet_introduce">
+								<u-read-more ref="uReadMore" :toggle="true" :shadowStyle="shadowStyle" closeText="查看全部"
+									:showHeight="20">
+									<rich-text :nodes="item.fleetProfile"></rich-text>
+								</u-read-more>
 
-							<!-- <view class="fleet_text" v-if="item.textShow">{{item.fleetProfile}}</view>
+								<!-- <view class="fleet_text" v-if="item.textShow">{{item.fleetProfile}}</view>
 							<view class="" v-else>{{item.fleetProfile}}</view>
 								<span class="btn_change" @click="textChange(index)">{{switchtext}}</span> -->
 
-						</view>
-						<view class="" v-if="item.img">
-							<u-upload class="uview-upload" :fileList="item.img" :deletable="false" name="1" multiple
-								:maxCount="1">
-							</u-upload>
+							</view>
+							<view class="" v-if="item.img">
+								<u-upload class="uview-upload" :fileList="item.img" :deletable="false" name="1" multiple
+									:maxCount="1">
+								</u-upload>
+							</view>
 						</view>
 					</view>
-				</view>
-				<!-- <u-loadmore :status="status" :nomore-text="nomoreText" /> -->
-					</mescroll-body>
+					<!-- <u-loadmore :status="status" :nomore-text="nomoreText" /> -->
+				</mescroll-body>
 			</view>
 
 			<!-- <view v-if="formData.length == 0" style="background: #FFFFFF;text-align: center;">
@@ -127,6 +124,8 @@
 		</view>
 		<itmister-address-picker ref="addressElthree" :showCheck="false" @confirmChange="confirmChangethree">
 		</itmister-address-picker>
+		<u-picker :show="fleetShow" :columns="columns" @cancel="fleetClose" @confirm="invitationCheng">
+		</u-picker>
 		<u-toast ref="uToast"></u-toast>
 		<u-modal :show="isShowAlert" :title="alertTitle" :closeOnClickOverlay='true' :showCancelButton='true'
 			confirmColor='#2772FB' @confirm="confirmClick" @close="cancelClick" @cancel="cancelClick"></u-modal>
@@ -149,11 +148,19 @@
 		},
 		data() {
 			return {
+				actionStyle: {
+					"background": "#2772FB",
+					"position": "absolute",
+					"right": "30rpx",
+					"borderRadius": "33px",
+					"color": "#fff",
+					"padding": "10rpx"
+				},
 				indexbtn: 1,
 				routeData: [], //列表
 				// show1: false,
 				// show2: false,
-				passOnce:'',
+				passOnce: '',
 				title1: "",
 				title2: "",
 				sendInfo: {
@@ -188,8 +195,8 @@
 				},
 				status: 'loadmore',
 				nomoreText: '实在没有了',
-				mescroll:{},
-				popupShow:false
+				mescroll: {},
+				popupShow: false
 			}
 		},
 		created() {},
@@ -290,7 +297,7 @@
 									this.formData = []
 								}
 								this.routeData = this.routeData.concat(res.data.records); //追加新数据
-								
+
 								for (let i = 0; i < this.routeData.length; i++) {
 									if (this.routeData[i].startAdress) {
 										this.routeData[i].startAdress = this.routeData[i].startAdress.split(",")
@@ -321,7 +328,7 @@
 								this.formData = []
 							}
 							this.formData = this.formData.concat(res.data.records); //追加新数据
-						
+
 							for (let i = 0; i < that.formData.length; i++) {
 								that.formData[i].textShow = false
 								if (that.formData[i].fleetUrl) {
@@ -347,11 +354,11 @@
 				uni.$u.route("/pages/riders/fleetSee?fleetId=" + item.id)
 			},
 			async getPassOnce() {
-				
+
 				await this.$request.baseRequest('', '/driverInfo/firstAuthentication', {
 						driverPhone: this.userInfo.phone,
 					}).then(res => {
-						if(res.data){
+						if (res.data) {
 							// this.passOnce=res.data.passOnce
 							uni.setStorageSync("firstAuthentication", res.data) //更新缓存数据（解决pc端审核后未及时更新缓存  用于车友判断）
 						}
@@ -367,10 +374,10 @@
 					this.$request.baseRequest('', '/driverInfo/firstAuthentication', {
 							driverPhone: this.userInfo.phone,
 						}).then(res => {
-							if(res.data){
+							if (res.data) {
 								// this.passOnce=res.data.passOnce
 								uni.setStorageSync("firstAuthentication", res.data) //更新缓存数据（解决pc端审核后未及时更新缓存  用于车友判断）
-								if (res.data.passOnce!=1) {
+								if (res.data.passOnce != 1) {
 									uni.setTabBarItem({
 										index: 1,
 										text: '车友',
@@ -398,7 +405,7 @@
 						.catch(res => {
 							uni.$u.toast(res.message);
 						});
-					
+
 				} else if (!uni.getStorageSync("firstAuthentication") && !uni.getStorageSync("userInfo")) { //判断有没有登录
 					this.tipsShow = true
 					this.tipsText = "您尚未登录，请前去登录！"
@@ -502,21 +509,23 @@
 					return
 				}
 				this.sendInfo.sendProvince = address.province ? address.province : ''
-				if(address.city=='天津'||address.city=='北京'||address.city=='上海'||address.city=='重庆'||address.city=='台湾'){
-					this.sendInfo.sendCity=''
-				}else{
+				if (address.city == '天津' || address.city == '北京' || address.city == '上海' || address.city == '重庆' || address
+					.city == '台湾') {
+					this.sendInfo.sendCity = ''
+				} else {
 					this.sendInfo.sendCity = address.city ? address.city : ''
 				}
-				
+
 				this.sendInfo.sendArea = address.area ? address.area : ''
 				if (address.city == '全省') {
 					this.title1 = address.province
 					this.sendInfo.sendCity = ""
 					this.sendInfo.sendArea = ""
 				} else if (address.area == '全市') {
-					if(address.city=='天津'||address.city=='北京'||address.city=='上海'||address.city=='重庆'||address.city=='台湾'){
+					if (address.city == '天津' || address.city == '北京' || address.city == '上海' || address.city == '重庆' ||
+						address.city == '台湾') {
 						this.title1 = address.province
-					}else{
+					} else {
 						this.title1 = address.province + address.city
 					}
 					this.sendInfo.sendArea = ""
@@ -528,9 +537,10 @@
 			},
 			confirmChangeTwo(address) {
 				this.unloadInfo.unloadProvince = address.province ? address.province : ''
-				if(address.city=='天津'||address.city=='北京'||address.city=='上海'||address.city=='重庆'||address.city=='台湾'){
-					this.unloadInfo.unloadCity=''
-				}else{
+				if (address.city == '天津' || address.city == '北京' || address.city == '上海' || address.city == '重庆' || address
+					.city == '台湾') {
+					this.unloadInfo.unloadCity = ''
+				} else {
 					this.unloadInfo.unloadCity = address.city ? address.city : ''
 				}
 				// this.unloadCity.unloadCity = address.city ? address.city : ''
@@ -541,9 +551,10 @@
 					this.unloadInfo.unloadCity = ""
 					this.unloadInfo.unloadArea = ""
 				} else if (address.area == '全市') {
-					if(address.city=='天津'||address.city=='北京'||address.city=='上海'||address.city=='重庆'||address.city=='台湾'){
+					if (address.city == '天津' || address.city == '北京' || address.city == '上海' || address.city == '重庆' ||
+						address.city == '台湾') {
 						this.title2 = address.province
-					}else{
+					} else {
 						this.title2 = address.province + address.city
 					}
 					this.unloadInfo.unloadArea = ""
@@ -766,20 +777,21 @@
 			width: 100%;
 
 			.route_invite {
-				width: 146rpx;
-				height: 54rpx;
+				font-size: 26rpx;
+				display: flex;
+				align-items: center;
 				border-radius: 35px;
-				text-align: center;
 				color: #FFFFFF;
-				line-height: 54rpx;
 				background: #2772FB;
+				padding: 10rpx 30rpx;
 			}
 
 			.driver_name {
 				width: 50%;
-				margin: 20rpx 0 0 30rpx;
+				margin: 10rpx 0 0 30rpx;
 				color: #333333;
 				font-size: 30rpx;
+				font-weight: 700;
 			}
 
 			.driver_invite {
@@ -791,6 +803,8 @@
 
 		.address {
 			margin-left: 30rpx;
+			color: #A3A3A3;
+			font-size: 26rpx;
 
 			// line-height: 34rpx;
 			.spots {
@@ -819,22 +833,30 @@
 			border-radius: 20rpx;
 			height: 200rpx;
 			margin: 40rpx auto 30rpx;
-			// margin-top: 60rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 0 34rpx;
+			box-sizing: border-box;
 
 			.screen_item {
-				padding: 60rpx 30rpx;
+				// padding: 60rpx 30rpx;
 				width: 40%;
-				text-align: center;
+				// text-align: center;
+				display: flex;
+				flex-direction: column;
+				align-items: flex-start;
 
 				.screen_sign {
 					width: 40rpx;
 					height: 40rpx;
 					text-align: center;
-					margin: 0 auto;
+					// margin: 0 auto;
 					border-radius: 6px;
 					color: #FFFFFF;
 					font-size: 22rpx;
 					line-height: 40rpx;
+					margin-bottom: 20rpx;
 				}
 
 				.sign1 {
@@ -847,9 +869,9 @@
 			}
 
 			.exchange {
-				transform: rotate(-90deg);
-				position:relative;
-				left:30px;
+				// transform: rotate(-90deg);
+				// position: relative;
+				// left: 30px;
 				// line-height: 200rpx;
 				// margin-top: 60rpx;
 			}
@@ -859,6 +881,7 @@
 	.riders {
 		.riders_top {
 			margin-top: 40rpx;
+			padding-right: 20rpx;
 
 			.riders_city {
 				margin-top: 10rpx;
@@ -888,10 +911,11 @@
 					text-align: center;
 					background-color: #2772FB;
 					width: 128rpx;
-					height: 66rpx;
-					line-height: 66rpx;
+					height: 60rpx;
+					line-height: 60rpx;
 					border-radius: 35rpx;
 					color: #fff;
+					font-size: 26rpx;
 				}
 
 				.fleet_introduce {
@@ -937,6 +961,7 @@
 		// margin-top: 10rpx;
 
 	}
+
 	.popupShow {
 		overflow: hidden;
 		position: fixed;