修改交易采收、搜索页面样式

pageA/product/lookup.vue

@@ -1,68 +1,80 @@
 <template>
 	<view class="content">
-		
-			<view style='background:#fff;display:flex;' class="cu-bar search">
-			<view style='flex:6;' class="search-form round Medium" >
+
+		<view style='background:#fff;display:flex;' class="cu-bar search">
+			<view style='flex:6;' class="search-form round Medium">
 				<text style='color: #ccc;text-indent:6px;' class="cuIcon-search"></text>
-				<input type="text" maxlength="20" :focus="true" v-model="searchKeyWord" @confirm="doSearch()" @input='search' placeholder="请输入货名或标题" confirm-type="search"></input>
-				
+				<input type="text" maxlength="20" :focus="true" v-model="searchKeyWord" @confirm="doSearch()"
+					@input='search' placeholder="请输入货名或标题" confirm-type="search"></input>
+
 			</view>
 			<view @click='doSearch()' class="Regular" style="width:4%;flex:1;">搜索</view>
 			<text @click='emptysearch' v-if='searchKeyWord.length>0' class='tip_text cuIcon-roundclosefill'></text>
-			</view>
-			<!-- mSearch组件 如果使用原样式，删除组件元素-->
-			<!-- <mSearch class="mSearch-input-box" :mode="2" button="inside" :placeholder="defaultKeyword" @search="doSearch(false)" @input="inputChange" @confirm="doSearch(false)" v-model="keyword"></mSearch> -->
-			<!-- 原样式 如果使用原样式，恢复下方注销代码 -->
-			<!-- 			
+		</view>
+		<!-- mSearch组件 如果使用原样式，删除组件元素-->
+		<!-- <mSearch class="mSearch-input-box" :mode="2" button="inside" :placeholder="defaultKeyword" @search="doSearch(false)" @input="inputChange" @confirm="doSearch(false)" v-model="keyword"></mSearch> -->
+		<!-- 原样式 如果使用原样式，恢复下方注销代码 -->
+		<!-- 			
 			<view class="input-box">
 				<input type="text" :placeholder="defaultKeyword" @input="inputChange" v-model="keyword" @confirm="doSearch(false)"
 				 placeholder-class="placeholder-class" confirm-type="search">
 			</view>
 			<view class="search-btn" @tap="doSearch(false)">搜索</view> 
 			-->
-			<!-- 原样式 end -->
+		<!-- 原样式 end -->
 		<view class="search-keyword" @touchstart="blur">
-			<scroll-view style='background:#F5F6FA;' class="keyword-list-box" v-show="isShowKeywordList&&keywordList.length>0" scroll-y>
-				<view style='background:#fff;padding:0 15px;'>
+			<scroll-view style='background:#F5F6FA;' class="keyword-list-box"
+				v-show="isShowKeywordList&&keywordList.length>0" scroll-y>
+				<view style='background:#fff;padding:0 15px;border-radius:0rpx 0rpx 30rpx 30rpx;' class="Semibold">
 					<view @click='tabcarchange(0)' class='line' :class='TabCur==0?"active":""'>采购</view>
-					<view @click='tabcarchange(1)' class='line'  :class='TabCur==1?"active":""'>销售</view>
+					<view @click='tabcarchange(1)' class='line' :class='TabCur==1?"active":""'>销售</view>
 				</view>
 				<view class="introduce-section">
-					<view v-for="(item, index) in keywordList" :key="index" class="guess-item" @click="navToDetailPage(item)">
+					<view v-for="(item, index) in keywordList" :key="index" class="guess-item"
+						@click="navToDetailPage(item)">
 						<view class="price-box">
-							<view class="title">{{item.title}}</view>
-							<view style='dsiplay:flex;' class='flex justify-between'>
+							<view class="title Medium">{{item.title}}</view>		
+							<view class='flex justify-between align-item-center Regular'>
 								<view v-if='TabCur==0' class='address'>
 									{{item.receivePrivate}}{{item.receiveCity}}{{item.receiveArea}}{{item.receiveWarehouse}}
 								</view>
 								<view v-if='TabCur==1' class='address'>
 									{{item.sendPrivate}}{{item.sendCity}}{{item.sendArea}}{{item.sendWarehouse}}
 								</view>
-								<view class='price' v-if='item.procurementPlanType=="期货"'>{{item.basisPrice}}<text
-										style='font-size:13px;color:#333333;'>元/吨</text></view>
-								<view class='price' v-if='item.procurementPlanType=="现货"'>{{item.unitPrice}}<text
-										style='font-size:13px;color:#333;'>元/吨</text></view>
-								<view class='price' v-if='item.salePlanType=="期货"'>{{item.basisPrice}}<text
-									style='font-size:13px;color:#333333;'>元/吨</text></view>
-								<view class='price' v-if='item.salePlanType=="现货"'>{{item.unitPrice}}<text
-									style='font-size:13px;color:#333;'>元/吨</text></view>
+								<view class='price NumberBold' v-if='item.procurementPlanType=="期货"'>
+									<text class="number-style">{{item.basisPrice}}</text><text style='font-size:13px;color:#333333;'
+										class="Semibold">元/吨</text></view>
+								<view class='price NumberBold' v-if='item.procurementPlanType=="现货"'>
+									<text class="number-style">{{item.procurementPrice}}</text><text style='font-size:13px;color:#333;'
+										class="Semibold">元/吨</text></view>
+								<view class='price NumberBold' v-if='item.salePlanType=="期货"'><text class="number-style">+{{item.basisPrice}}</text><text
+										style='font-size:13px;color:#333333;' class="Semibold">元/吨</text></view>
+								<view class='price NumberBold' v-if='item.salePlanType=="现货"'><text class="number-style">{{item.salePrice}}</text><text
+										style='font-size:13px;color:#333;' class="Semibold">元/吨</text></view>
 							</view>
 						</view>
-						<view class='flex justify-between'>
-							<view>
-								<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="现货"'>现货</view>
-								<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="期货"'>期货</view>
-								<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="现货"'>现货</view>
-								<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="期货"'>期货</view>
-								<view class='tag1 tag-yellow radius line-green'>{{item.goodsName}}</view>
-								<view class='tag1 tag-red radius line-yellow'>{{item.weight}}吨</view>
-							</view>
-							<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="期货"'>今日基差</view>
-							<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="现货"'>采购价格</view>
-							<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="期货"'>今日基差</view>
-							<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="现货"'>采购价格</view>
+				<view class='flex justify-between Regular'>
+					<view class="Regular">
+						<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="现货"'>现货</view>
+						<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="期货"'>期货</view>
+						<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="现货"'>现货</view>
+						<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="期货"'>期货</view>
+						<view class='tag1 tag-yellow radius line-green'>{{item.goodsName}}</view>
+						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 0">{{item.plannedPurchaseVolume}}吨
+						</view>
+						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 1">{{item.plannedSaleVolume}}吨
 						</view>
 					</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="期货" && TabCur== 0'>
+						今日基差</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="现货" && TabCur== 0'>
+						采购价格</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="期货" && TabCur== 1'>今日基差
+					</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="现货" && TabCur== 1'>销售价格
+					</view>
+				</view>
+					</view>
 					<view v-show="isLoadMore">
 						<uni-load-more :status="loadStatus"></uni-load-more>
 					</view>
@@ -71,7 +83,7 @@
 			<view style='height:80vh;' v-show="isShowKeywordList&&keywordList.length==0">
 				<view style='background:#fff;padding:0 15px;'>
 					<view @click='tabcarchange(0)' class='line' :class='TabCur==0?"active":""'>采购</view>
-					<view @click='tabcarchange(1)' class='line'  :class='TabCur==1?"active":""'>销售</view>
+					<view @click='tabcarchange(1)' class='line' :class='TabCur==1?"active":""'>销售</view>
 				</view>
 				<view style='background:#F5F6FA;height:100%;line-height:80vh;text-align:center;'>
 					暂无相关结果
@@ -82,27 +94,32 @@
 					<view class="keyword-list-header Medium">
 						<view style='font-size:16px;font-weight:600;'>最近搜索</view>
 						<view>
-							<image @tap="oldDelete" style='width:16px;height:16px;' src="../../static/img/jiaoyi/shanchu@3x.png"></image>
+							<image @tap="oldDelete" style='width:16px;height:16px;'
+								src="../../static/img/jiaoyi/shanchu@3x.png"></image>
 							<!-- <image @tap="oldDelete" src="./static/delete.png"></image> -->
-						<!-- 	<text class="cuIcon-delete text-gray "  ></text> -->
-							
+							<!-- 	<text class="cuIcon-delete text-gray "  ></text> -->
+
 						</view>
 					</view>
 					<view class="keyword Regular">
-						<view v-for="(keyword,index) in oldKeywordList.records" @tap="doSearch(keyword)" :key="index">{{keyword.searchContent}}</view>
+						<view v-for="(keyword,index) in oldKeywordList.records" @tap="doSearch(keyword)" :key="index">
+							{{keyword.searchContent}}
+						</view>
 					</view>
 				</view>
-				 <view class="keyword-block Medium">
+				<view class="keyword-block Medium">
 					<view class="keyword-list-header">
 						<view style='font-size:16px;font-weight:600;'>推荐搜索</view>
 						<view>
-							 <image @tap="hotToggle" :src="'/static/HM-search/attention'+forbid+'.png'"></image> 
+							<image @tap="hotToggle" :src="'/static/HM-search/attention'+forbid+'.png'"></image>
 						</view>
 					</view>
 					<view class="keyword Regular" v-if="forbid==''">
-						<view v-for="(keyword,index) in hotKeywordList" @tap="doSearch(keyword)" :key="index">{{keyword.searchContent}}</view>
+						<view v-for="(keyword,index) in hotKeywordList" @tap="doSearch(keyword)" :key="index">
+							{{keyword.searchContent}}
+						</view>
 					</view>
-				</view> 
+				</view>
 			</scroll-view>
 		</view>
 	</view>
@@ -119,26 +136,26 @@
 			return {
 				defaultKeyword: "",
 				searchKeyWord: "",
-				pageSize:10,
-				currentPage:1,
+				pageSize: 10,
+				currentPage: 1,
 				oldKeywordList: [],
 				hotKeywordList: [],
 				keywordList: [],
 				forbid: '',
 				isShowKeywordList: false,
-				TabCur:0,
-				isLoadMore:false,
-				loadStatus:'',
-				content:'搜索'
+				TabCur: 0,
+				isLoadMore: false,
+				loadStatus: '',
+				content: '搜索'
 			}
 		},
 		onLoad(options) {
-			if(options.searchKeyWord){
-				this.searchKeyWord=options.searchKeyWord
+			if (options.searchKeyWord) {
+				this.searchKeyWord = options.searchKeyWord
 			}
 			this.TabCur = options.TabCur
-			if(this.searchKeyWord){
-				this.isShowKeywordList=true
+			if (this.searchKeyWord) {
+				this.isShowKeywordList = true
 				this.getData()
 			}
 		},
@@ -172,138 +189,144 @@
 				this.loadHotKeyword();
 
 			},
-			search(e){
-				if(e.detail.value.length==0){
-					this.isShowKeywordList=false
+			search(e) {
+				if (e.detail.value.length == 0) {
+					this.isShowKeywordList = false
 					this.loadOldKeyword()
 					this.loadHotKeyword()
-				}
-				else{
+				} else {
 					this.searchKeyWord = e.detail.value
 				}
 			},
-			blur(){
+			blur() {
 				uni.hideKeyboard()
 			},
-			doSearch(keyword){
+			doSearch(keyword) {
 				console.log(keyword)
-				if(keyword){
-					this.searchKeyWord=keyword.searchContent
+				if (keyword) {
+					this.searchKeyWord = keyword.searchContent
 
 				}
-				if(this.searchKeyWord.length>0){
-						this.isShowKeywordList=true
-						this.$api.doRequest('post', '/searchRecordsInfo/api/addInfo',{commonId:this.userInfo.id,searchContent:this.searchKeyWord}).then(res => {
-						})
+				if (this.searchKeyWord.length > 0) {
+					this.isShowKeywordList = true
+					this.$api.doRequest('post', '/searchRecordsInfo/api/addInfo', {
+							commonId: this.userInfo.id,
+							searchContent: this.searchKeyWord
+						}).then(res => {})
 						.catch(res => {
-							
+
 						});
-					}else{
-						this.isShowKeywordList=false
-						this.loadOldKeyword()
-						this.loadHotKeyword()
-					}
+				} else {
+					this.isShowKeywordList = false
+					this.loadOldKeyword()
+					this.loadHotKeyword()
+				}
 				uni.showLoading({
 					title: '正在加载',
-					mask:true
+					mask: true
 				})
-				var param1=''
+				var param1 = ''
 				if (this.TabCur == 0) {
 					param1 = '/procurementPlanInfo/selectProcurementPlanInfo'
 				} else {
 					param1 = '/salePlanInfo/selectSalePlanInfo'
 				}
-				this.$api.doRequest('get', param1,{pageSize:this.pageSize,
-				currentPage:this.currentPage,searchKeyWord:this.searchKeyWord}).then(res => {
-					uni.hideLoading()
-					this.keywordList=res.data.data.records
-				})
-				.catch(res => {
-					uni.hideLoading()
-					if(res.errmsg){
-						uni.showToast({
-							title: res.errmsg,
-							icon: 'none',
-							duration: 2000
-						})
-					}
-					else{
-						uni.showToast({
-							title: "系统异常，请联系管理员",
-							icon: 'none',
-							duration: 2000
-						})
-					}
-				});
+				this.$api.doRequest('get', param1, {
+						pageSize: this.pageSize,
+						currentPage: this.currentPage,
+						searchKeyWord: this.searchKeyWord
+					}).then(res => {
+						uni.hideLoading()
+						this.keywordList = res.data.data.records
+					})
+					.catch(res => {
+						uni.hideLoading()
+						if (res.errmsg) {
+							uni.showToast({
+								title: res.errmsg,
+								icon: 'none',
+								duration: 2000
+							})
+						} else {
+							uni.showToast({
+								title: "系统异常，请联系管理员",
+								icon: 'none',
+								duration: 2000
+							})
+						}
+					});
 			},
-			emptysearch(){
-				this.searchKeyWord=''
-				this.isShowKeywordList=false
+			emptysearch() {
+				this.searchKeyWord = ''
+				this.isShowKeywordList = false
 				this.loadOldKeyword()
 				this.loadHotKeyword()
 			},
-			loadHotKeyword(){
-				this.$api.doRequest('get', '/searchRecordsInfo/selectRecommendedSearchRecordsInfo',{pageSize:this.pageSize,
-				currentPage:this.currentPage,commonId:this.userInfo.id}).then(res => {
-					uni.hideLoading()
-					this.hotKeywordList=res.data.data.records
-				})
-				.catch(res => {
-					if(res.errmsg){
-						uni.showToast({
-							title: res.errmsg,
-							icon: 'none',
-							duration: 2000
-						})
-					}
-					else{
-						uni.showToast({
-							title: "系统异常，请联系管理员",
-							icon: 'none',
-							duration: 2000
-						})
-					}
-				});
+			loadHotKeyword() {
+				this.$api.doRequest('get', '/searchRecordsInfo/selectRecommendedSearchRecordsInfo', {
+						pageSize: this.pageSize,
+						currentPage: this.currentPage,
+						commonId: this.userInfo.id
+					}).then(res => {
+						uni.hideLoading()
+						this.hotKeywordList = res.data.data.records
+					})
+					.catch(res => {
+						if (res.errmsg) {
+							uni.showToast({
+								title: res.errmsg,
+								icon: 'none',
+								duration: 2000
+							})
+						} else {
+							uni.showToast({
+								title: "系统异常，请联系管理员",
+								icon: 'none',
+								duration: 2000
+							})
+						}
+					});
 			},
 			tabSelect(e) {
-				if(e.currentTarget.dataset.id){
+				if (e.currentTarget.dataset.id) {
 					this.TabCur = e.currentTarget.dataset.id;
-				}
-				else{
+				} else {
 					this.TabCur = e.target.current;
 				}
 				this.pages = 1
 				this.isLoadMore = false
 				this.loadData()
 			},
-			getData(){
-				var param1=''
+			getData() {
+				var param1 = ''
 				if (this.TabCur == 0) {
 					param1 = '/procurementPlanInfo/selectProcurementPlanInfo'
 				} else {
 					param1 = '/salePlanInfo/selectSalePlanInfo'
 				}
-				this.$api.doRequest('get', param1,{pageSize:this.pageSize,
-				currentPage:this.currentPage,searchKeyWord:this.searchKeyWord}).then(res => {
-					uni.hideLoading()
-					this.keywordList=res.data.data.records
-				})
-				.catch(res => {
-					if(res.errmsg){
-						uni.showToast({
-							title: res.errmsg,
-							icon: 'none',
-							duration: 2000
-						})
-					}
-					else{
-						uni.showToast({
-							title: "系统异常，请联系管理员",
-							icon: 'none',
-							duration: 2000
-						})
-					}
-				});
+				this.$api.doRequest('get', param1, {
+						pageSize: this.pageSize,
+						currentPage: this.currentPage,
+						searchKeyWord: this.searchKeyWord
+					}).then(res => {
+						uni.hideLoading()
+						this.keywordList = res.data.data.records
+					})
+					.catch(res => {
+						if (res.errmsg) {
+							uni.showToast({
+								title: res.errmsg,
+								icon: 'none',
+								duration: 2000
+							})
+						} else {
+							uni.showToast({
+								title: "系统异常，请联系管理员",
+								icon: 'none',
+								duration: 2000
+							})
+						}
+					});
 			},
 			//加载默认搜索关键字
 			loadDefaultKeyword() {
@@ -312,18 +335,21 @@
 			},
 			//加载历史搜索,自动读取本地Storage
 			loadOldKeyword() {
-				var that=this
-				this.$api.doRequest('get', '/searchRecordsInfo/selectSearchRecordsInfo',{pageSize:this.pageSize,
-				currentPage:this.currentPage,commonId:this.userInfo.id}).then(res => {
+				var that = this
+				this.$api.doRequest('get', '/searchRecordsInfo/selectSearchRecordsInfo', {
+					pageSize: this.pageSize,
+					currentPage: this.currentPage,
+					commonId: this.userInfo.id
+				}).then(res => {
 					uni.hideLoading()
-					that.oldKeywordList=res.data.data
+					that.oldKeywordList = res.data.data
 					console.log(that.oldKeywordList)
 				})
 			},
 			//监听输入
 			inputChange(event) {
 				//兼容引入组件时传入参数情况
-				var keyword = event.detail?event.detail.value:event;
+				var keyword = event.detail ? event.detail.value : event;
 				// if (!keyword) {
 				// 	this.keywordList = [];
 				// 	this.isShowKeywordList = false;
@@ -361,28 +387,30 @@
 			},
 			//清除历史搜索
 			oldDelete() {
-				var that=this
+				var that = this
 				uni.showModal({
 					content: '确定清除历史搜索记录？',
 					success: (res) => {
 						if (res.confirm) {
-							this.$api.doRequest('post', '/searchRecordsInfo/api/deleteSearchRecordsInfo',{commonId:this.userInfo.id}).then(res => {
-								if(res.data.code==200){
+							this.$api.doRequest('post', '/searchRecordsInfo/api/deleteSearchRecordsInfo', {
+									commonId: this.userInfo.id
+								}).then(res => {
+									if (res.data.code == 200) {
+										uni.showToast({
+											title: '清除历史搜索成功',
+											icon: 'none',
+											duration: 2000
+										})
+										that.oldKeywordList.records = []
+									}
+								})
+								.catch(res => {
 									uni.showToast({
 										title: '清除历史搜索成功',
-										icon:'none',
+										icon: 'none',
 										duration: 2000
 									})
-									that.oldKeywordList.records=[]
-								}
-							})
-							.catch(res => {
-								uni.showToast({
-									title: '清除历史搜索成功',
-									icon:'none',
-									duration: 2000
-								})
-							});
+								});
 						} else if (res.cancel) {
 							console.log('用户点击取消');
 						}
@@ -402,7 +430,7 @@
 			// 			this.$api.doRequest('post', '/searchRecordsInfo/api/addInfo',{commonId:this.userInfo.id,searchContent:e.detail.value}).then(res => {
 			// 			})
 			// 			.catch(res => {
-							
+
 			// 			});
 			// 		}else{
 			// 			this.content='搜索'
@@ -419,7 +447,7 @@
 			// 			this.$api.doRequest('post', '/searchRecordsInfo/api/addInfo',{commonId:this.userInfo.id,searchContent:e}).then(res => {
 			// 			})
 			// 			.catch(res => {
-							
+
 			// 			})
 			// 		}else{
 			// 			this.content='搜索'
@@ -461,38 +489,40 @@
 			// 	// 	url: `/pageA/product/querylist?keywords=${key}&TabCur=${TabCur}`
 			// 	// })
 			// },
-			tabcarchange(status){
-				this.TabCur=status
+			tabcarchange(status) {
+				this.TabCur = status
 				var param1 = ''
 				if (this.TabCur == 0) {
 					param1 = '/procurementPlanInfo/selectProcurementPlanInfo'
 				} else {
 					param1 = '/salePlanInfo/selectSalePlanInfo'
 				}
-				this.$api.doRequest('get', param1,{pageSize:this.pageSize,
-				currentPage:this.currentPage,searchKeyWord:this.searchKeyWord}).then(res => {
-					if(res.data.code==200){
-						this.keywordList=res.data.data.records
-					}else{
-						uni.showToast({
-							title: res.data.message,
-							icon:'none',
-							duration: 2000
-						})
-						
-					}
-					uni.hideLoading()
+				this.$api.doRequest('get', param1, {
+						pageSize: this.pageSize,
+						currentPage: this.currentPage,
+						searchKeyWord: this.searchKeyWord
+					}).then(res => {
+						if (res.data.code == 200) {
+							this.keywordList = res.data.data.records
+						} else {
+							uni.showToast({
+								title: res.data.message,
+								icon: 'none',
+								duration: 2000
+							})
+
+						}
+						uni.hideLoading()
 					})
 					.catch(res => {
 						uni.hideLoading()
-						if(res.errmsg){
+						if (res.errmsg) {
 							uni.showToast({
 								title: res.errmsg,
 								icon: 'none',
 								duration: 2000
 							})
-						}
-						else{
+						} else {
 							uni.showToast({
 								title: "系统异常，请联系管理员",
 								icon: 'none',
@@ -537,113 +567,259 @@
 	}
 </script>
 <style scoped>
-	.search-form{
-		    background: #F5F6F9;
+	.search-form {
+		background: #F5F6F9;
 	}
-	.line{
-		display:inline-block;
-		padding:5px;
-		position:relative;
-		font-size:17px;
+
+	.line {
+		display: inline-block;
+		padding: 5px;
+		position: relative;
+		font-size: 17px;
 	}
-	.line.active{
-		font-size:19px;
+
+	.line.active {
+		font-size: 19px;
 		font-weight: 900;
 	}
-	.line.active:after{
-		content:'';
-		display:block;
-		position:absolute;
-		width:18px;
-		left:50%;
+
+	.line.active:after {
+		content: '';
+		display: block;
+		position: absolute;
+		width: 36rpx;
+		height: 6rpx;
+		left: 50%;
 		transform: translateX(-50%);
-		bottom:0;
-		border-bottom:1px solid #22C572;
-	}
-	.search-box {width:100%;background-color:rgb(242,242,242);padding:15upx 2.5%;display:flex;justify-content:space-between;}
-	.search-box .mSearch-input-box{width: 100%;}
-	.search-box .input-box {width:85%;flex-shrink:1;display:flex;justify-content:center;align-items:center;}
-	.search-box .search-btn {width:15%;margin:0 0 0 2%;display:flex;justify-content:center;align-items:center;flex-shrink:0;font-size:28upx;color:#fff;background:linear-gradient(to right,#ff9801,#ff570a);border-radius:60upx;}
-	.search-box .input-box>input {width:100%;height:60upx;font-size:32upx;border:0;border-radius:60upx;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 3%;margin:0;background-color:#ffffff;}
-	.placeholder-class {color:#9e9e9e;}
-	.search-keyword {width:100%;background-color:rgb(242,242,242);}
-	.keyword-list-box {background:#F5F6FA;height:calc(100vh - 110upx);padding-top:10upx;border-radius:20upx 20upx 0 0;}
-	.keyword-entry-tap {background-color:#eee;}
-	.keyword-entry {width:94%;height:80upx;margin:0 3%;font-size:30upx;color:#333;display:flex;justify-content:space-between;align-items:center;border-bottom:solid 1upx #e7e7e7;}
-	.keyword-entry image {width:60upx;height:60upx;}
-	.keyword-entry .keyword-text,.keyword-entry .keyword-img {height:80upx;display:flex;align-items:center;}
-	.keyword-entry .keyword-text {width:90%;}
-	.keyword-entry .keyword-img {width:10%;justify-content:center;}
-	.keyword-box {height:calc(100vh - 110upx);border-radius:20upx 20upx 0 0;background-color:#fff;}
-	.keyword-box .keyword-block {padding:10upx 0;}
-	.keyword-box .keyword-block .keyword-list-header {width:94%;padding:10upx 3%;font-size:27upx;color:#333;display:flex;justify-content:space-between;}
-	.keyword-box .keyword-block .keyword-list-header image {width:40upx;height:40upx;}
-	.keyword-box .keyword-block .keyword {width:94%;padding:3px 3%;display:flex;flex-flow:wrap;justify-content:flex-start;}
-	.keyword-box .keyword-block .hide-hot-tis {display:flex;justify-content:center;font-size:28upx;color:#6b6b6b;}
-	.keyword-box .keyword-block .keyword>view {display:flex;justify-content:center;align-items:center;border-radius:60upx;padding:0 20upx;margin:10upx 20upx 10upx 0;height:60upx;font-size:28upx;background-color:rgb(242,242,242);color:#6b6b6b;}
-	.cuIcon-roundclosefill{
-		position:absolute;
-		right:80px;
+		bottom: 0;
+		background: #22C572;
+		/* border-bottom: 1px solid #22C572; */
+	}
+
+	.search-box {
+		width: 100%;
+		background-color: rgb(242, 242, 242);
+		padding: 15upx 2.5%;
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.search-box .mSearch-input-box {
+		width: 100%;
+	}
+
+	.search-box .input-box {
+		width: 85%;
+		flex-shrink: 1;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.search-box .search-btn {
+		width: 15%;
+		margin: 0 0 0 2%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		flex-shrink: 0;
+		font-size: 28upx;
+		color: #fff;
+		background: linear-gradient(to right, #ff9801, #ff570a);
+		border-radius: 60upx;
+	}
+
+	.search-box .input-box>input {
+		width: 100%;
+		height: 60upx;
+		font-size: 32upx;
+		border: 0;
+		border-radius: 60upx;
+		-webkit-appearance: none;
+		-moz-appearance: none;
+		appearance: none;
+		padding: 0 3%;
+		margin: 0;
+		background-color: #ffffff;
+	}
+
+	.placeholder-class {
+		color: #9e9e9e;
+	}
+
+	.search-keyword {
+		width: 100%;
+		background-color: rgb(242, 242, 242);
+	}
+
+	.keyword-list-box {
+		background: #F5F6FA;
+		height: calc(100vh - 110upx);
+		/* padding-top: 10upx; */
+		border-radius: 20upx 20upx 0 0;
+	}
+
+	.keyword-entry-tap {
+		background-color: #eee;
+	}
+
+	.keyword-entry {
+		width: 94%;
+		height: 80upx;
+		margin: 0 3%;
+		font-size: 30upx;
+		color: #333;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		border-bottom: solid 1upx #e7e7e7;
+	}
+
+	.keyword-entry image {
+		width: 60upx;
+		height: 60upx;
+	}
+
+	.keyword-entry .keyword-text,
+	.keyword-entry .keyword-img {
+		height: 80upx;
+		display: flex;
+		align-items: center;
+	}
+
+	.keyword-entry .keyword-text {
+		width: 90%;
+	}
+
+	.keyword-entry .keyword-img {
+		width: 10%;
+		justify-content: center;
+	}
+
+	.keyword-box {
+		height: calc(100vh - 110upx);
+		border-radius: 20upx 20upx 0 0;
+		background-color: #fff;
+	}
+
+	.keyword-box .keyword-block {
+		padding: 10upx 0;
+	}
+
+	.keyword-box .keyword-block .keyword-list-header {
+		width: 94%;
+		padding: 10upx 3%;
+		font-size: 27upx;
+		color: #333;
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.keyword-box .keyword-block .keyword-list-header image {
+		width: 40upx;
+		height: 40upx;
+	}
+
+	.keyword-box .keyword-block .keyword {
+		width: 94%;
+		padding: 3px 3%;
+		display: flex;
+		flex-flow: wrap;
+		justify-content: flex-start;
+	}
+
+	.keyword-box .keyword-block .hide-hot-tis {
+		display: flex;
+		justify-content: center;
+		font-size: 28upx;
+		color: #6b6b6b;
 	}
+
+	.keyword-box .keyword-block .keyword>view {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		border-radius: 60upx;
+		padding: 0 20upx;
+		margin: 10upx 20upx 10upx 0;
+		height: 60upx;
+		font-size: 28upx;
+		background-color: rgb(242, 242, 242);
+		color: #6b6b6b;
+	}
+
+	.cuIcon-roundclosefill {
+		position: absolute;
+		right: 80px;
+	}
+
 	.tag1 {
-		background:#F5F6F9;
+		background: #F5F6F9;
 		padding: 5px;
-		color:#333333;
+		color: #333333;
 		display: inline-flex;
 		font-size: 22rpx;
 		border-radius: 3px;
 		margin: 3px;
 	}
+
 	.tag {
-		background:#F5F6F9;
+		background: #F5F6F9;
 		padding: 7px 12px;
-		color:#333333;
+		color: #333333;
 		display: inline-flex;
 		font-size: 22rpx;
 		border-radius: 15px;
 		margin: 3px;
 	}
+
 	.tag-bule {
 		background: #EBEEFA;
 		color: #5C76DF;
 	}
+
 	.tag-green {
 		background: #C6F7BC;
 		color: #065112;
 	}
+
 	.tag-yellow {
 		background: #F9F2EA;
 		color: #BE9C69;
 	}
+
 	.tag-red {
 		background: #FEECE6;
 		color: #FE6430;
 	}
-.introduce-section .title{
-	font-size: 17px;
-	font-weight: bold;
-	height:40px;
-	line-height: 40px;
-	flex: 2.5;
-	border-bottom:1px solid #EEEEEE;
-}
-.introduce-section .address{
-	color:#878C9C;
-	font-size:12px;
-	padding:15px 0 10px;
-}
-.introduce-section .price{
-	padding:10px 0 10px;
-	color:#FD714F;
-	font-size:19px;
-	font-weight:700;
-}
+
+	.introduce-section .title {
+		font-size: 17px;
+		height: 40px;
+		line-height: 40px;
+		flex: 2.5;
+		border-bottom: 1px solid #EEEEEE;
+	}
+
+	.introduce-section .address {
+		color: #878C9C;
+		font-size: 12px;
+		padding: 15px 0 10px;
+	}
+
+	.introduce-section .price {
+		padding: 10px 0 10px;
+		color: #FD714F;
+		font-size: 19px;
+		font-weight: 700;
+	}
+
 	/* 销售信息 */
 	.introduce-section {
 		background: #fff;
 		padding: 0upx 30upx 20upx;
-		margin:10px;
-		border-radius:4px;
+		margin: 10px;
+		border-radius: 4px;
 
 		.guess-item {
 			padding-bottom: 20upx;
@@ -696,27 +872,32 @@
 			}
 		}
 	}
-	.side-bg{
-		position:absolute;
+
+	.side-bg {
+		position: absolute;
 		width: 64px;
 		height: 64px;
 		z-index: 1;
 	}
+
 	.drag {
-		position:relative;
+		position: relative;
 		display: flex;
 		justify-content: center;
 		align-items: center;
 		color: $uni-text-color-inverse;
 		width: 64px;
 		height: 64px;
-		background:transparent;
+		background: transparent;
 		font-size: $uni-font-size-sm;
 		position: fixed;
 		z-index: 9;
-		
+
 		&.transition {
-			transition: left .3s ease,top .3s ease;
+			transition: left .3s ease, top .3s ease;
 		}
 	}
+	.number-style{
+		font-size: 44rpx;
+	}
 </style>

pages/business/business.vue

@@ -6,10 +6,12 @@
 			<view style='background:#fff;border-bottom:1px solid #EEE;padding-bottom:10px;'>
 				<view class="cu-bar search">
 					<view style='position:absolute;left:30px;top:50%;transform: translateY(-50%);' @click='status=true'>
-						{{location}}<image style='width:10px;height:6px;margin-left:4px;position:relative;top:-2px;'
+						{{location}}
+						<image style='width:10px;height:6px;margin-left:4px;position:relative;top:-2px;'
 							src='../../static/img/jiaoyi/down.png'></image>
 					</view>
-					<u-picker mode="selector" @confirm='locationChange' v-model="status" :range="locationType"></u-picker>
+					<u-picker mode="selector" @confirm='locationChange' v-model="status" :range="locationType">
+					</u-picker>
 					<!-- <view>
 						<picker style='display:inline-block;' @change="locationChange" :value="location"
 							:range="locationType">
@@ -20,7 +22,7 @@
 						<image style='width:10px;height:6px;margin-left:4px;position:relative;top:-2px;'
 							src='../../static/img/jiaoyi/down.png'></image>
 					</view> -->
-					
+
 					<view class="search-form round" @click="naviageToPage('/pageA/product/lookup?TabCur=')">
 						<text style='color: #ccc;text-indent:56px;' class="cuIcon-search"></text>
 						<view class="Medium search-title"> 请输入货名或标题</view>
@@ -34,7 +36,7 @@
 					<view class='tag radius line-pink' @click="sousuo('高粱')">高粱</view>
 				</view>
 			</view>
-			<view style='background:#fff;padding:0 15px;' class="Semibold">
+			<view style='background:#fff;padding:0 15px;border-radius:0rpx 0rpx 30rpx 30rpx;' class="Semibold">
 				<view @click='tabcarchange(0)' class='line' :class='TabCur==0?"active":""'>采购</view>
 				<view @click='tabcarchange(1)' class='line' :class='TabCur==1?"active":""'>销售</view>
 			</view>
@@ -51,29 +53,37 @@
 					<view v-if='TabCur==1' class='address'>
 						{{item.sendPrivate}}{{item.sendCity}}{{item.sendArea}}{{item.sendWarehouse}}
 					</view>
-					<view class='price NumberBold' v-if='item.procurementPlanType=="期货"'>{{item.basisPrice}}<text
+					<view class='price NumberBold' v-if='item.procurementPlanType=="期货"'>
+						<text class="number-style">{{item.basisPrice}}</text><text style='font-size:13px;color:#333333;'
+							class="Semibold">元/吨</text></view>
+					<view class='price NumberBold' v-if='item.procurementPlanType=="现货"'>
+						<text class="number-style">{{item.procurementPrice}}</text><text style='font-size:13px;color:#333;'
+							class="Semibold">元/吨</text></view>
+					<view class='price NumberBold' v-if='item.salePlanType=="期货"'><text class="number-style">+{{item.basisPrice}}</text><text
 							style='font-size:13px;color:#333333;' class="Semibold">元/吨</text></view>
-					<view class='price NumberBold' v-if='item.procurementPlanType=="现货"'>{{item.procurementPrice}}<text
+					<view class='price NumberBold' v-if='item.salePlanType=="现货"'><text class="number-style">{{item.salePrice}}</text><text
 							style='font-size:13px;color:#333;' class="Semibold">元/吨</text></view>
-					<view class='price NumberBold' v-if='item.salePlanType=="期货"'>+{{item.basisPrice}}<text
-						style='font-size:13px;color:#333333;' class="Semibold">元/吨</text></view>
-					<view class='price NumberBold' v-if='item.salePlanType=="现货"'>{{item.salePrice}}<text
-						style='font-size:13px;color:#333;' class="Semibold">元/吨</text></view>
 				</view>
-				<view class='flex justify-between'>
+				<view class='flex justify-between Regular'>
 					<view class="Regular">
 						<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="现货"'>现货</view>
 						<view class='tag1 tag-bule radius line-pink' v-if='item.procurementPlanType=="期货"'>期货</view>
 						<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="现货"'>现货</view>
 						<view class='tag1 tag-bule radius line-pink' v-if='item.salePlanType=="期货"'>期货</view>
 						<view class='tag1 tag-yellow radius line-green'>{{item.goodsName}}</view>
-						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 0">{{item.plannedPurchaseVolume}}吨</view>
-						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 1">{{item.plannedSaleVolume}}吨</view>
+						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 0">{{item.plannedPurchaseVolume}}吨
+						</view>
+						<view class='tag1 tag-red radius line-yellow' v-if="TabCur== 1">{{item.plannedSaleVolume}}吨
+						</view>
+					</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="期货" && TabCur== 0'>
+						今日基差</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="现货" && TabCur== 0'>
+						采购价格</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="期货" && TabCur== 1'>今日基差
+					</view>
+					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="现货" && TabCur== 1'>销售价格
 					</view>
-					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="期货" && TabCur== 0'>今日基差</view>
-					<view style='color:#878C9C;padding-top:5px;' v-if='item.procurementPlanType=="现货" && TabCur== 0'>采购价格</view>
-					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="期货" && TabCur== 1'>今日基差</view>
-					<view style='color:#878C9C;padding-top:5px;' v-if='item.salePlanType=="现货" && TabCur== 1'>销售价格</view>
 				</view>
 			</view>
 			<view v-show="isLoadMore">
@@ -85,7 +95,7 @@
 		</view>
 		<u-back-top :scroll-top="scrollTop" tips="顶部" :custom-style="{backgroundColor: '#a0cfff',color: '#2979ff'}"
 			:iconStyle="{color: '#2979ff',fontSize: '34rpx'}" mode="square" icon="arrow-up"></u-back-top>
-		
+
 	</view>
 </template>
 
@@ -101,7 +111,7 @@
 				isLoadMore: false, //是否加载中
 				showTran: true,
 				scrollTop: 0,
-				status:false,
+				status: false,
 				pageSize: 10,
 				searchKeyWord: '',
 				receivePrivate: '全国',
@@ -116,22 +126,24 @@
 				TabCur: 0,
 				current: 1,
 				location: '全国',
-				params:{
+				params: {
 					province: true,
 				},
 				locationType: ['全国', '黑龙江', '河南', '山东', '安徽', '吉林', '河北', '江苏', '内蒙古', '四川', '湖南', '湖北', '辽宁',
 					'江西', '云南', '新疆', '山西', '广西', '陕西', '广东', '甘肃', '重庆', '贵州', '浙江', '福建',
 					'宁夏', '天津', '海南', '青海', '西藏', '上海', '北京'
 				],
-				statusBarHeight:"height:"
+				statusBarHeight: "height:"
 			}
 		},
 		onShow() {
 			uni.showTabBar()
 			var userInfo = uni.getStorageSync("userInfo")
 			var that = this
-			console.log("userInfo",userInfo)
-			this.$api.doRequest('get', '/salePlanInfo/getTips', {phone:userInfo.phone}).then(res => {
+			console.log("userInfo", userInfo)
+			this.$api.doRequest('get', '/salePlanInfo/getTips', {
+				phone: userInfo.phone
+			}).then(res => {
 				if (res.data.data) {
 					let name = 'myTip';
 					let value = res.data.data.myTip;
@@ -139,10 +151,10 @@
 						name,
 						value
 					});
-					if(value != 0){
+					if (value != 0) {
 						uni.setTabBarBadge({
-							index:3,
-							text:value+""
+							index: 3,
+							text: value + ""
 						})
 					}
 					name = 'taskTip';
@@ -165,7 +177,7 @@
 			var that = this
 			uni.getSystemInfo({
 				success: function(res) {
-					console.log("statusBarHeight",res.statusBarHeight)
+					console.log("statusBarHeight", res.statusBarHeight)
 					that.statusBarHeight += res.statusBarHeight + "px"; //这就是状态栏的高度
 				},
 			});
@@ -182,7 +194,7 @@
 			this.isLoadMore = false
 			this.loadStatus = 'loading'
 			this.loadData()
-			setTimeout(function () {
+			setTimeout(function() {
 				uni.stopPullDownRefresh();
 			}, 1000);
 		},
@@ -274,14 +286,13 @@
 					})
 					.catch(res => {
 						uni.hideLoading()
-						if(res.errmsg){
+						if (res.errmsg) {
 							uni.showToast({
 								title: res.errmsg,
 								icon: 'none',
 								duration: 2000
 							})
-						}
-						else{
+						} else {
 							uni.showToast({
 								title: "系统异常，请联系管理员",
 								icon: 'none',
@@ -372,14 +383,13 @@
 					})
 					.catch(res => {
 						uni.hideLoading()
-						if(res.errmsg){
+						if (res.errmsg) {
 							uni.showToast({
 								title: res.errmsg,
 								icon: 'none',
 								duration: 2000
 							})
-						}
-						else{
+						} else {
 							uni.showToast({
 								title: "系统异常，请联系管理员",
 								icon: 'none',
@@ -420,7 +430,7 @@
 		left: 50%;
 		transform: translateX(-50%);
 		bottom: 0;
-		background:#22C572;
+		background: #22C572;
 		/* border-bottom: 1px solid #22C572; */
 	}
 
@@ -729,12 +739,13 @@
 			color: $base-color;
 		}
 	}
-	.introduce-section{
+
+	.introduce-section {
 		padding-top: 135px;
 	}
+
 	.introduce-section .title {
 		font-size: 17px;
-		font-weight: bold;
 		height: 40px;
 		line-height: 40px;
 		flex: 2.5;
@@ -759,7 +770,7 @@
 		background: #fff;
 		padding: 0upx 30upx 20upx;
 		margin: 8px;
-		border-bottom: 1px solid #ccc;
+		/* border-bottom: 1px solid #ccc; */
 	}
 
 	/* 销售信息 */
@@ -832,23 +843,29 @@
 			transition: left .3s ease, top .3s ease;
 		}
 	}
-	.top-style{
-		background: red;
+
+	.top-style {
 		position: fixed;
 		width: 100%;
 	}
-	
+
 	.status_bar {
 		width: 100%;
 	}
-	.search-title{
+
+	.search-title {
 		font-size: 28rpx;
 		color: #AFB3BF;
 	}
-	.tag{
+
+	.tag {
 		font-size: 24rpx;
 	}
-	.align-item-center{
+
+	.align-item-center {
 		align-items: center;
 	}
+	.number-style{
+		font-size: 44rpx;
+	}
 </style>