添加资讯页面：工厂价格5s滚一屏，港口价格自动慢速滚动

pageA/freightTransport/addsendgoods.vue

@@ -221,7 +221,9 @@
 	.content {
 		background: #F5F6FA;
 	}
-
+	.center{
+		overflow-y: hidden;
+	}
 	.c-row {
 		display: -webkit-box;
 		display: -webkit-flex;

pageA/freightTransport/index.vue

@@ -24,7 +24,7 @@
 									<view class='consigner'>{{item.consignee}}</view>
 								</view>
 							</view>
-					
+
 							<view class="list-item-right">
 								<view class='time'>{{item.createDate}}</view>
 								<view class='goods'>{{item.goodsName}}</view>
@@ -40,7 +40,9 @@
 					</view>
 				</view>
 			</view>
-	
+			<view v-show="isLoadMore">
+				<uni-load-more :status="loadStatus"></uni-load-more>
+			</view>
 
 		</view>
 		<view class="footer">
@@ -61,7 +63,12 @@
 				listData: [],
 				searchData: {},
 				userinfo: {},
-				isShowNoData:false
+				isShowNoData: false,
+				currentPage: 1, //页数
+				pageSize: 10, //每次取条目数
+				loadStatus: 'loading', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
+				isLoadMore: false, //是否加载中
+				scrollTop: 0,
 
 			}
 		},
@@ -75,11 +82,26 @@
 			this.initData();
 		},
 		onPageScroll(e) {
-
+			this.scrollTop = e.scrollTop;
 		},
-		//下拉刷新
-		onPullDownRefresh() {},
 		onReachBottom() { //上拉触底函数
+		debugger
+			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
+				this.isLoadMore = true
+				this.currentPage += 1
+				this.getListData(this.status)
+			}
+		},
+		onPullDownRefresh() {
+			debugger
+			this.currentPage = 1
+			this.isLoadMore = false
+			this.loadStatus = 'loading'
+			this.listData=[]
+			this.getListData(this.status)
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
 		},
 		methods: {
 			getUserInfo() {
@@ -103,30 +125,34 @@
 				}
 			},
 			initData() {
+				this.currentPage = 1
+				this.isLoadMore = false
+				this.loadStatus = 'more'
 				this.getListData(0)
 			},
 			getListData(state, type) {
-				let _data = {}
+				let _data = {
+					currentPage: this.currentPage,
+					pageSize: this.pageSize
+				}
+
 				if (state == "searchKeyWord") {
-					_data = {
-						pageSize: 10,
-						currentPage: 1,
-						searchKeyWord: type,
-						accountNumber: this.userInfo.phone
-					}
+					_data.searchKeyWord = type
+					_data.accountNumber = this.userInfo.phone
+
 				} else {
-					_data = {
-						pageSize: 10,
-						currentPage: 1,
-						searchType: state,
-						accountNumber: this.userInfo.phone
-					}
+					_data.searchType = state
+					_data.accountNumber = this.userInfo.phone
 				}
 				let that = this
+				uni.showLoading({
+					title: '正在加载',
+					mask: true
+				})
 				this.$api.doRequest('get', '/freightReceivingDispatching/selectFreightReceivingDispatchingPage', _data)
 					.then(res => {
-						if (res.data.code == 200) {				
-							that.listData = res.data.data.records;
+						if (res.data.code == 200) {
+							that.listData = that.listData.concat(res.data.data.records);
 							for (let i = 0; i < that.listData.length; i++) {
 								that.utils.nullToString(that.listData[i])
 								that.listData[i].toSettled = that.listData[i].toSettled == '' ? 0 : that.listData[i]
@@ -135,9 +161,25 @@
 									.signedFor
 							}
 							console.log(that.listData)
+							that.isLoadMore = false
+						} else {
+							if (that.currentPage > 1) {
+								that.currentPage = 1
+							}
+							that.isLoadMore = true
+							that.loadStatus = 'nomore'
 						}
 
+						uni.hideLoading()
+
 					}).catch(res => {
+						that.$api.msg(res.data.data.errmsg)
+						that.isLoadMore = false
+						that.loadStatus = 'nomore'
+						if (that.currentPage > 1) {
+							that.currentPage = 1
+						}
+						uni.hideLoading()
 						// uni.showToast({
 						// 	title: res.data.message,
 						// 	icon: 'none',
@@ -197,7 +239,9 @@
 		position: relative;
 		font-size: 17px;
 	}
-	.line:nth-last-of-type(2),.line:nth-last-of-type(1){
+
+	.line:nth-last-of-type(2),
+	.line:nth-last-of-type(1) {
 		margin-left: 68rpx;
 	}
 
@@ -593,26 +637,31 @@
 	.addgoods:after {
 		border: none;
 	}
-	.cu-bar{
+
+	.cu-bar {
 		padding: 0 30rpx;
 	}
-	.no-data{
+
+	.no-data {
 		/* background: red; */
 		text-align: center;
 		font-size: 36rpx;
 		margin-top: 300rpx;
 	}
-	.list-item{
+
+	.list-item {
 		width: 100%;
 		display: flex;
 		justify-content: space-between;
-		.list-item-left{
+
+		.list-item-left {
 			display: flex;
 			align-items: center;
-			.number{
+
+			.number {
 				margin-left: 40rpx;
 			}
-			
+
 		}
 	}
 </style>

pages.json

@@ -480,7 +480,7 @@
 					"path": "freightTransport/index",
 					"style": {
 						"navigationBarTitleText": "货运收发",
-						"enablePullDownRefresh": false
+						"enablePullDownRefresh": true
 					}
 				
 				},

pages/sale/information.vue

@@ -1,7 +1,7 @@
 <template name="sale">
 	<view class="container">
-		 <view :style="statusBarHeight" class="status_bar">
-		 </view>
+		<view :style="statusBarHeight" class="status_bar">
+		</view>
 		<!-- 小程序头部兼容 -->
 		<!-- #ifdef MP -->
 		<!-- <view class="mp-search-box">
@@ -10,86 +10,84 @@
 		<!-- #endif -->
 		<!-- 头部轮播 -->
 		<view class="carousel-section">
-			<swiper class="screen-swiper header-swiper" ::class="dotStyle?'square-dot':'round-dot'" :indicator-dots="true" :circular="true"
-		 :autoplay="true" interval="3000" duration="500" @change="swiperChange" indicator-color="#8799a3"
-					 indicator-active-color="#0081ff">
-						<swiper-item class="swiper-item" v-for="(item,index) in carouselList" :key="index" :class="cardCur==index?'text-white':''" @click="naviageToPage(item.url)">
-							<image :src="item.imgUrl"></image>
-						<!-- 	<view style='position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);'>11111</view> -->
-						</swiper-item>
-					</swiper>
+			<swiper class="screen-swiper header-swiper" ::class="dotStyle?'square-dot':'round-dot'"
+				:indicator-dots="true" :circular="true" :autoplay="true" interval="5000"
+				@change="swiperChange" indicator-color="#8799a3" indicator-active-color="#0081ff">
+				<swiper-item class="swiper-item" v-for="(item,index) in carouselList" :key="index"
+					:class="cardCur==index?'text-white':''" @click="naviageToPage(item.url)">
+					<image :src="item.imgUrl"></image>
+					<!-- 	<view style='position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);'>11111</view> -->
+				</swiper-item>
+			</swiper>
 			<!-- <view class="swiper-dots">
 				<text class="num">{{swiperCurrent+1}}</text>
 				<text class="sign">/</text>
 				<text class="num">{{swiperLength}}</text>
 			</view> -->
-		</view> 
-		<swiper-up :list="infoList" ></swiper-up>
-<!-- 		<scroll-view style='margin-top:12px;padding:0 20px;' scroll-x class="nav">
-			<view class="flex text-center">
-				<view style='position:relative;' class="cu-item flex-sub" :class="item.value==TabCur?'text-white':''" v-for="item in categoryList"@tap="tabSelect" :data-id="item.value">
-					<image v-if='item.value==TabCur' style='width:100%;height:100%;position: absolute;z-index:1;left:0;' src='https://taohaoliang.oss-cn-beijing.aliyuncs.com/tmp/bg.png'></image>
-					<text style='position:relative;z-index:2;'>{{item.label}}</text>
-				</view>
-			</view>
-		</scroll-view> -->
-		
+		</view>
+		<swiper-up :list="infoList"></swiper-up>
 		<view class="guess-section-wrap">
 			<view class='flex justify-between'>
 				<view class='title'>工厂价格</view>
 				<view style='color:#B2B3BB;' @click='more("/pages/sale/plant")'>更多</view>
 			</view>
-			<scroll-view :scroll-x="true">
-				<view class='guess-section-wrap-content'>
-					<view class='guess-section-wrap-item clearfix' v-for='item in plantList'>
+			<swiper class="screen-swiper header-swiper" :autoplay="true" interval="3000" duration="500" :circular="true" :acceleration="true"
+				style="min-height: 380px;">
+				<swiper-item class="" v-for="(item1,index) in factoryPriceData.list" :key="index">
+					<view class='guess-section-wrap-item clearfix' v-for='(item,index1) in item1' :key="index1">
 						<view class='factory'>{{item.factory}}</view>
 						<view class='wrap'>{{item.city}} {{item.factoryType}}</view>
 						<view class='price'>
 							<text class='currectprice'>{{item.price}}</text>
 							较昨日
-							<image v-if='item.comparePrice>0' style="width:7.5px;height:9px;" src='../../static/img/homepage/shangsheng.png'></image>
-							<image v-if='item.comparePrice<0'  style="width:7.5px;height:9px;" src='../../static/img/homepage/xiajiang.png'></image>
+							<image v-if='item.comparePrice>0' style="width:7.5px;height:9px;"
+								src='../../static/img/homepage/shangsheng.png'></image>
+							<image v-if='item.comparePrice<0' style="width:7.5px;height:9px;"
+								src='../../static/img/homepage/xiajiang.png'></image>
 							<text v-if='item.comparePrice>0' class='yesterday up'>{{item.comparePrice}}</text>
 							<text v-if='item.comparePrice<0' class='yesterday down'>{{-item.comparePrice}}</text>
 							<text v-if='item.comparePrice==0' class='yesterday'>-</text>
 						</view>
 					</view>
-				</view>
-			</scroll-view>
+				</swiper-item>
+			</swiper>
 		</view>
 		<view class="guess-section-wrap">
 			<view class='flex justify-between'>
 				<view class='title'>港口价格</view>
-				<view style='color:#B2B3BB;'  @click='more("/pages/sale/portprice")'>更多</view>
+				<view style='color:#B2B3BB;' @click='more("/pages/sale/portprice")'>更多</view>
 			</view>
-			
-			<scroll-view :scroll-x="true">
-				<view class='guess-section-wrap-content port'>
-					<view class='guess-section-wrap-item clearfix' v-for='item in portList'>
+			<!-- <uni-notice-bar scrollable="true" single="true" background-color="white" :portList="portList" ></uni-notice-bar> -->
+				<swiper class="screen-swiper header-swiper-port" :autoplay="true" interval="0" duration="60000" :circular="true" :acceleration="true">
+					<swiper-item class="" v-for="(item1,index) in portPriceData.list" :key="index">
+						<view class='guess-section-wrap-item clearfix' v-for='(item,index1) in item1' :key="index1">
 						<view class='factory'>{{item.port}}</view>
 						<view class='wrap'>{{item.goodsName}}</view>
 						<view class='price'>
 							<text class='currectprice'>{{item.price}}</text>
 							较昨日
-							<image v-if='item.comparePrice>0' style="width:7.5px;height:9px;" src='../../static/img/homepage/shangsheng.png'></image>
-							<image v-if='item.comparePrice<0'  style="width:7.5px;height:9px;" src='../../static/img/homepage/xiajiang.png'></image>
+							<image v-if='item.comparePrice>0' style="width:7.5px;height:9px;"
+								src='../../static/img/homepage/shangsheng.png'></image>
+							<image v-if='item.comparePrice<0' style="width:7.5px;height:9px;"
+								src='../../static/img/homepage/xiajiang.png'></image>
 							<text v-if='item.comparePrice>0' class='yesterday up'>{{item.comparePrice}}</text>
 							<text v-if='item.comparePrice<0' class='yesterday down'>{{-item.comparePrice}}</text>
 							<text v-if='item.comparePrice==0' class='yesterday'>-</text>
 						</view>
 						<view style='color:#B2B3BB;' class='flex'>
 							<view style='margin-right:10px;'>
-								<image style='width:11px;height:11px;' src='../../static/img/homepage/water@3x.png'></image>
-								<={{item.waterContent}}
-							</view>
-							<view>
-								<image  style='width:11px;height:11px;' src='../../static/img/homepage/unitweight@3x.png'></image>
-							>={{item.bulkDensity}}
-							</view>
+								<image style='width:11px;height:11px;' src='../../static/img/homepage/water@3x.png'>
+								</image>
+								<={{item.waterContent}} </view>
+									<view>
+										<image style='width:11px;height:11px;'
+											src='../../static/img/homepage/unitweight@3x.png'></image>
+										>={{item.bulkDensity}}
+									</view>
+									</view>
 						</view>
-					</view>
-				</view>
-			</scroll-view>
+					</swiper-item>
+				</swiper>
 		</view>
 		<view class="guess-section-wrap1">
 			<view style='padding:15px;' class='flex justify-between'>
@@ -97,29 +95,35 @@
 				<view style='color:#B2B3BB;' @click="more('/pages/sale/newsinfo')">更多</view>
 			</view>
 			<view style='border-bottom:1px solid #EEEEEE;' class='guess-section-wrap-content1'>
-				<view style='border-bottom:1px solid #eee;padding:15px;' class='flex justify-between'  v-for='(item, index) in newsInfo' :key="index" @click="navToDetailPage(item.id)">
+				<view style='border-bottom:1px solid #eee;padding:15px;' class='flex justify-between'
+					v-for='(item, index) in newsInfo' :key="index" @click="navToDetailPage(item.id)">
 					<view>
 						<view class="list-row-titel">{{item.title}}</view>
-						<view style='color:#B2B3BB;font-size:12px;'><text style='margin-right:5px;'>{{item.from}}</text>{{item.gmtUpdate}}</view>
+						<view style='color:#B2B3BB;font-size:12px;'><text
+								style='margin-right:5px;'>{{item.from}}</text>{{item.gmtUpdate}}</view>
+					</view>
+					<view>
+						<image style='width:100px;height:72px;border-radius:5px;' :src='item.titleImg'></image>
 					</view>
-					<view><image style='width:100px;height:72px;border-radius:5px;' :src='item.titleImg'></image></view>
 				</view>
-				
+
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-	import { formatDate } from '@/common/date.js';
-    import dragButton from "@/components/drag-button/drag-button.vue";
+	import {
+		formatDate
+	} from '@/common/date.js';
+	import dragButton from "@/components/drag-button/drag-button.vue";
 	import swiperUp from "@/components/swiperup.vue";
 	import {
 		mapState
 	} from 'vuex';
 	export default {
 		components: {
-		    dragButton,
+			dragButton,
 			swiperUp
 		},
 		name: "sale",
@@ -135,33 +139,34 @@
 				salesTop: [],
 				saleInfo: [],
 				portInfo: [],
-				plantList:[],
-				portList:[],
+				plantList: [],
+				portList: [],
 				banner: undefined,
 				isVip: false,
 				pages: 1, //页数
 				limit: 10, //每次取条目数
 				loadStatus: 'loading', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
 				isLoadMore: false, //是否加载中
-				showTran:true,
+				showTran: true,
 				list: [],
 				scrollTop: 0,
 				cardCur: 0,
-		        dotStyle: false,
+				dotStyle: false,
 				newsInfo: [],
-				categoryList:[],
-				pages:1,//页数
-				limit:10 ,//每次取条目数
-				loadStatus:'loading',  //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
+				categoryList: [],
+				pages: 1, //页数
+				limit: 10, //每次取条目数
+				loadStatus: 'loading', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
 				TabCur: 0,
-				category:0,
+				category: 0,
 				current: 0,
-				infoList1:[],
-				statusBarHeight:"height:"
+				infoList1: [],
+				statusBarHeight: "height:",
+				factoryPriceData: {},
+				portPriceData:{}
 			};
 		},
-		onReady() {
-		},
+		onReady() {},
 		onShow() {
 			uni.showTabBar()
 			this.pages = 1
@@ -170,7 +175,9 @@
 			this.loadData()
 			var userInfo = uni.getStorageSync("userInfo")
 			var that = this
-			this.$api.doRequest('get', '/salePlanInfo/getTips', {phone:userInfo.phone}).then(res => {
+			this.$api.doRequest('get', '/salePlanInfo/getTips', {
+				phone: userInfo.phone
+			}).then(res => {
 				if (res.data.data) {
 					let name = 'myTip';
 					let value = res.data.data.myTip;
@@ -178,10 +185,10 @@
 						name,
 						value
 					});
-					if(value != 0){
+					if (value != 0) {
 						uni.setTabBarBadge({
-							index:3,
-							text:value+""
+							index: 3,
+							text: value + ""
 						})
 					}
 					name = 'taskTip';
@@ -203,28 +210,28 @@
 			var that = this
 			uni.getSystemInfo({
 				success: function(res) {
-					console.log("statusBarHeight",res.statusBarHeight)
+					console.log("statusBarHeight", res.statusBarHeight)
 					that.statusBarHeight += res.statusBarHeight + "px"; //这就是状态栏的高度
 				},
 			});
 			var infoList = [];
 			uni.request({
-			    url: "https://hq.sinajs.cn/list=C0,C2109,C2111,C2201,C2203,C2205,C2207,A0,A2109,A2111,A2201,A2203,A2205,A2207",
-			    // url: "https://hq.sinajs.cn/list=C2109",
-			    header: {
-			        'content-type': 'application/x-www-form-urlencoded'
-			    },
-			    success: function(result) {
-			        // resolve调用后，即可传递到调用方使用then或者async+await同步方式进行处理逻辑
+				url: "https://hq.sinajs.cn/list=C0,C2109,C2111,C2201,C2203,C2205,C2207,A0,A2109,A2111,A2201,A2203,A2205,A2207",
+				// url: "https://hq.sinajs.cn/list=C2109",
+				header: {
+					'content-type': 'application/x-www-form-urlencoded'
+				},
+				success: function(result) {
+					// resolve调用后，即可传递到调用方使用then或者async+await同步方式进行处理逻辑
 					var tmp = result.data.split('"')
-					for(var i = 1; i<tmp.length;i=i+2){
+					for (var i = 1; i < tmp.length; i = i + 2) {
 						var list = tmp[i].split(",")
 						var data = {
-							goodsName:list[0],
-							newPrice:list[6],
-							openPrice:list[2]
+							goodsName: list[0],
+							newPrice: list[6],
+							openPrice: list[2]
 						}
-						if(data.goodsName){
+						if (data.goodsName) {
 							infoList.push(data)
 						}
 					}
@@ -235,12 +242,12 @@
 						value
 					});
 					// console.log("infoList",infoList)
-			    },
-			    fail: function(e) {
-			        console.log('error in...')
-			        // reject调用后，即可传递到调用方使用catch或者async+await同步方式进行处理逻辑
-			        reject(e)
-			    },
+				},
+				fail: function(e) {
+					console.log('error in...')
+					// reject调用后，即可传递到调用方使用catch或者async+await同步方式进行处理逻辑
+					reject(e)
+				},
 			})
 		},
 		onPageScroll(e) {
@@ -258,7 +265,7 @@
 			this.isLoadMore = false
 			this.loadStatus = 'loading'
 			this.loadData()
-			setTimeout(function () {
+			setTimeout(function() {
 				uni.stopPullDownRefresh();
 			}, 1000);
 		},
@@ -266,13 +273,55 @@
 			...mapState(['hasLogin', 'userInfo'])
 		},
 		methods: {
-			more(url){
+			makeportScrollData(valList) {
+				debugger
+				console.log(valList)
+				let _rowCount = valList.length;
+				let _pageSize = 2
+				let _newArray = []
+				if (_rowCount == null || _rowCount == "") {
+					this.portPriceData.totalPage = 0;
+				} else {
+					if (_pageSize != 0 && _rowCount % _pageSize == 0) {
+						this.portPriceData.totalPage = parseInt(_rowCount / _pageSize)
+					}
+					if (_pageSize != 0 && _rowCount % _pageSize != 0) {
+						this.portPriceData.totalPage = parseInt(_rowCount / _pageSize) + 1;
+					}
+				}
+				for (let i = 0; i < valList.length; i += 2) {
+					_newArray.push(valList.slice(i, i + 2))
+				}
+				this.portPriceData.list = _newArray
+			},
+			makeScrollData(valList) {
+				debugger
+				console.log(valList)
+				let _rowCount = valList.length;
+				let _pageSize = 8
+				let _newArray = []
+				if (_rowCount == null || _rowCount == "") {
+					this.factoryPriceData.totalPage = 0;
+				} else {
+					if (_pageSize != 0 && _rowCount % _pageSize == 0) {
+						this.factoryPriceData.totalPage = parseInt(_rowCount / _pageSize)
+					}
+					if (_pageSize != 0 && _rowCount % _pageSize != 0) {
+						this.factoryPriceData.totalPage = parseInt(_rowCount / _pageSize) + 1;
+					}
+				}
+				for (let i = 0; i < valList.length; i += 8) {
+					_newArray.push(valList.slice(i, i + 8))
+				}
+				this.factoryPriceData.list = _newArray
+			},
+			more(url) {
 				console.log(url)
 				uni.navigateTo({
 					url: url
 				})
 			},
-			
+
 			DotStyle(e) {
 				this.dotStyle = e.detail.value
 			},
@@ -290,20 +339,20 @@
 				this.pages = 1
 				this.loadData()
 			},
-			 //回到顶部
-			  goTop(e) {  // 一键回到顶部
-			  console.log(e)
-			    if (wx.pageScrollTo) {
-			      wx.pageScrollTo({
-			        scrollTop: 0
-			      })
-			    } else {
-			      wx.showModal({
-			        title: '提示',
-			        content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
-			      })
-			    }
-			  },
+			//回到顶部
+			goTop(e) { // 一键回到顶部
+				console.log(e)
+				if (wx.pageScrollTo) {
+					wx.pageScrollTo({
+						scrollTop: 0
+					})
+				} else {
+					wx.showModal({
+						title: '提示',
+						content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
+					})
+				}
+			},
 			async loadData() {
 				console.log("sale loadData pages " + this.pages)
 				const that = this
@@ -311,7 +360,7 @@
 				uni.showLoading({
 					title: '正在加载',
 				})
-				that.$api.request('dict', 'getDictDataList',{
+				that.$api.request('dict', 'getDictDataList', {
 					dictType: "news_type"
 				}, failres => {
 					that.$api.msg(failres.errmsg)
@@ -325,47 +374,55 @@
 					title: '正在加载',
 				})
 				// 工厂价格
-				that.$api.request('news', 'getFactoryPriceInfo',{
-					category:this.category,
+				that.$api.request('news', 'getFactoryPriceInfo', {
+					category: this.category,
 					page: 1,
-					limit:2
+					limit: 2
 				}, failres => {
 					that.$api.msg(failres.errmsg)
 					this.isLoadMore = false
 					this.loadStatus = 'nomore'
-					if(this.pages>1){this.pages=1}
+					if (this.pages > 1) {
+						this.pages = 1
+					}
 					uni.hideLoading()
 				}).then(res => {
 					let data = res.data
 					that.plantList = data
+					that.makeScrollData(that.plantList)
 					uni.hideLoading()
 				})
 				// 港口价格
-				that.$api.request('news', 'getPortPriceInfo',{
-					category:this.category,
+				that.$api.request('news', 'getPortPriceInfo', {
+					category: this.category,
 					page: 1,
-					limit:2
+					limit: 2
 				}, failres => {
 					that.$api.msg(failres.errmsg)
 					this.isLoadMore = false
 					this.loadStatus = 'nomore'
-					if(this.pages>1){this.pages=1}
+					if (this.pages > 1) {
+						this.pages = 1
+					}
 					uni.hideLoading()
 				}).then(res => {
 					let data = res.data
 					that.portList = data
+					that.makeportScrollData(that.portList)
 					uni.hideLoading()
 				})
 				// 新闻内容
-				that.$api.request('news', 'getNewsInfo',{
-					category:2,
+				that.$api.request('news', 'getNewsInfo', {
+					category: 2,
 					page: 1,
-					limit:10
+					limit: 10
 				}, failres => {
 					that.$api.msg(failres.errmsg)
 					this.isLoadMore = false
 					this.loadStatus = 'nomore'
-					if(this.pages>1){this.pages=1}
+					if (this.pages > 1) {
+						this.pages = 1
+					}
 					uni.hideLoading()
 				}).then(res => {
 					let data = res.data
@@ -416,7 +473,7 @@
 					//价格简报
 					if (data.portInfo) {
 						that.portInfo = data.portInfo
-						console.log("portInfo",that.portInfo)
+						console.log("portInfo", that.portInfo)
 					}
 					//分类5Buttom
 					if (data.advertisement.t4) {
@@ -430,7 +487,7 @@
 					uni.hideLoading()
 					uni.stopPullDownRefresh()
 				})
-				
+
 			},
 			//轮播图切换修改背景色
 			swiperChange(e) {
@@ -496,26 +553,28 @@
 				// 	uni.hideLoading()
 				// })
 				const that = this
-				var pages=that.pages
-				var limit=that.limit
-							   
+				var pages = that.pages
+				var limit = that.limit
+
 				uni.showLoading({
 					title: '正在加载',
 				})
 				that.$api.request('news', 'getNewsInfo', {
-					category:2,
+					category: 2,
 					page: 1,
-					limit:10
-				},failres => {
+					limit: 10
+				}, failres => {
 					that.$api.msg(failres.errmsg)
-					that.isLoadMore=false
+					that.isLoadMore = false
 					that.loadStatus = 'nomore'
-					if(that.pages>1){that.pages-=1}
+					if (that.pages > 1) {
+						that.pages -= 1
+					}
 					uni.hideLoading()
 				}).then(res => {
 					let data = res.data
 					that.newsInfo = data
-					that.isLoadMore=false
+					that.isLoadMore = false
 					uni.hideLoading()
 				})
 			}
@@ -553,97 +612,120 @@
 </script>
 
 <style lang="scss" scoped>
-	.container{
+	.container {
 		margin: 10rpx 10rpx 10rpx 10rpx;
 	}
+
 	.cu-tag.badge {
-	    right: 26rpx;
+		right: 26rpx;
 	}
-	.up,.down{
-		width: 8px;
-		height: 5px;
+
+	.up,
+	.down {
+		// width: 8px;
+		// height: 5px;
 		vertical-align: middle;
 		margin-left: 2px;
 	}
-	.gird-left,.gird-right{
-		
-	}
+
+	.gird-left,
+	.gird-right {}
+
 	.cu-tag.radius[class*="line"]::after {
-    border-radius: 66rpx;
+		border-radius: 66rpx;
 	}
-	.goTop{
-	  height: 32px;
-	  width: 32px;
-	  position: fixed;
-	  bottom: 200rpx;
-	  right: 30rpx;
-	  border-radius: 50%;
+
+	.goTop {
+		height: 32px;
+		width: 32px;
+		position: fixed;
+		bottom: 200rpx;
+		right: 30rpx;
+		border-radius: 50%;
 	}
-	.goTop image{
-		width:32px;
-		height:32px;
+
+	.goTop image {
+		width: 32px;
+		height: 32px;
 	}
-	.flex{
-		display:flex;
+
+	.flex {
+		display: flex;
 	}
-	.text-white{
-		color:#fff;
+
+	.text-white {
+		color: #fff;
 	}
-	.cu-card{
-		border-bottom:1rpx solid #f8f8f8;
+
+	.cu-card {
+		border-bottom: 1rpx solid #f8f8f8;
 		text-align: center;
 	}
-	.factorytitle view{
+
+	.factorytitle view {
 		border-right: 1px solid #F8F8F8;
 	}
-	.factorytitle view:last-child{
+
+	.factorytitle view:last-child {
 		border-right: 1px solid transparent;
 	}
-	.factory{
-		font-size:26rpx;
-		font-weight:900;
+
+	.factory {
+		font-size: 26rpx;
+		font-weight: 900;
 	}
-	.currectprice{
-		color:rgba(253, 113, 79, 1);
-		font-size:18px;
-		font-weight:600;
+
+	.currectprice {
+		color: rgba(253, 113, 79, 1);
+		font-size: 18px;
+		font-weight: 600;
 		vertical-align: middle;
-		margin-right:10px;
+		margin-right: 10px;
 	}
-	.yesterday{
-		font-size:14px;
-		font-weight:600;
+
+	.yesterday {
+		font-size: 14px;
+		font-weight: 600;
 		vertical-align: middle;
 	}
-	.yesterday.up{
-		color:rgba(253, 113, 79, 1);
+
+	.yesterday.up {
+		color: rgba(253, 113, 79, 1);
 	}
-	.yesterday.down{
-		color:#22C572;
+
+	.yesterday.down {
+		color: #22C572;
 	}
-	.positive{
-		color:#E63113;
-		font-size:26rpx;
-		font-weight:900;
+
+	.positive {
+		color: #E63113;
+		font-size: 26rpx;
+		font-weight: 900;
 	}
-	.negative{
-		color:#229453;
-		font-size:26rpx;
-		font-weight:900;
+
+	.negative {
+		color: #229453;
+		font-size: 26rpx;
+		font-weight: 900;
 	}
-	.wrap{
-		font-size:20rpx;
-		color: rgba(0,0,0,0.5);
+
+	.wrap {
+		font-size: 20rpx;
+		color: rgba(0, 0, 0, 0.5);
 	}
-	.align-center{
+
+	.align-center {
 		align-items: center;
 	}
-	.flex-direction-row{
-		flex-direction:row;
+
+	.flex-direction-row {
+		flex-direction: row;
 	}
-	.factoryItem{
+
+	.factoryItem {
 		padding: 20rpx 0;
 	}
+
 	/* #ifdef MP */
 	.mp-search-box {
 		// position:relative;
@@ -665,13 +747,16 @@
 			background: rgba(255, 255, 255, .6);
 		}
 	}
-	.desc{
-	    width:73%;
-		margin-right:2%;
+
+	.desc {
+		width: 73%;
+		margin-right: 2%;
 	}
-    .justify-between{
+
+	.justify-between {
 		justify-content: space-between;
 	}
+
 	page {
 		.cate-section {
 			position: relative;
@@ -703,64 +788,78 @@
 	}
 
 	/* #endif */
-	.cuIcon-notification::before{
-		color:#f37b1;
+	.cuIcon-notification::before {
+		color: #f37b1;
 	}
+
 	.cu-card.article>.cu-item .content>image {
-	    height: 3.4em;
+		height: 3.4em;
 		margin-right: 0rpx;
 		margin-top: 24rpx;
 	}
-	.screen-swiper.price-swiper{
-		height:70rpx;
+
+	.screen-swiper.price-swiper {
+		height: 70rpx;
 		min-height: 70rpx;
 		background: #fff;
 		margin-bottom: 10px;
 	}
-	.swiper-item{
+
+	.swiper-item {
 		border-radius: 5%;
 	}
+
 	.guess-section-wrap {
-		padding:15px;
-		margin:10px 5px;
-		border-radius:5px;
-		background:#fff;
-		overflow:hidden;
+		padding: 15px;
+		margin: 10px 5px;
+		border-radius: 5px;
+		background: #fff;
+		overflow: hidden;
 	}
+
 	.guess-section-wrap1 {
-		margin:10px 5px;
-		border-radius:5px;
-		background:#fff;
-		overflow:hidden;
-		height:366px;
-	}
-	.guess-section-wrap-content{
-		width:1500px;
+		margin: 10px 5px;
+		border-radius: 5px;
+		background: #fff;
+		overflow: hidden;
+		height: 366px;
+	}
+
+	.guess-section-wrap-content {
+		width: 1500px;
 		// display:flex;
 	}
-	.guess-section-wrap-content.port{
-		width:3000px;
+
+	.guess-section-wrap-content.port {
+		width: 3000px;
 	}
-	.guess-section-wrap-item{
-		float:left;
-		width:40vw;
-		background:#F9F9FA;
-		padding:10px;
-		margin:10px;
-		border-radius:3px;
+
+	.guess-section-wrap-item {
+		float: left;
+		width: 38vw;
+		background: #F9F9FA;
+		padding: 10px;
+		margin: 10px;
+		border-radius: 3px;
 		// width:50%;
 	}
-	.guess-section-wrap-item:first-child{
+
+	.guess-section-wrap-item:first-child {
 		// margin-left:2px;
 	}
-	.clearfix:after{
-		content:"";
-		display:block;
-		clear:both;
+
+	.clearfix:after {
+		content: "";
+		display: block;
+		clear: both;
 	}
-	.guess-section-wrap .price{
-		color:#B2B3BB;
+
+	.guess-section-wrap .price {
+		color: #B2B3BB;
+		display: flex;
+		align-items: center;
 	}
+
 	page {
 		background: #f5f5f5;
 	}
@@ -768,7 +867,8 @@
 	.m-t {
 		margin-top: 16upx;
 	}
-	.header-swiper{
+
+	.header-swiper {
 		min-height: 300rpx;
 	}
 
@@ -887,7 +987,8 @@
 			opacity: .7;
 			// box-shadow: 4upx 4upx 20upx rgba(250, 67, 106, 0.3);
 		}
-		.grid_icon{
+
+		.grid_icon {
 			font-size: 48upx;
 			margin-bottom: 18upx;
 			color: #fa436a;
@@ -907,29 +1008,33 @@
 	}
 
 
-	
 
-	
+
+
 	/* 销售信息 */
 	.introduce-section {
 		background: #fff;
 		padding: 20upx 30upx;
 		padding-bottom: 100upx;
+
 		.guess-item {
 			padding-bottom: 20upx;
 			border-bottom: 1px solid #ccc;
 		}
+
 		.title {
 			font-size: 28upx;
 			color: $font-color-dark;
-			font-weight:bold;
+			font-weight: bold;
 			height: 50upx;
 			line-height: 50upx;
-			flex:2.5;
+			flex: 2.5;
 		}
+
 		.title-tip {
-			flex:1;
+			flex: 1;
 		}
+
 		.price-box {
 			display: flex;
 			align-items: baseline;
@@ -938,17 +1043,17 @@
 			font-size: 26upx;
 			color: $uni-color-primary;
 		}
-	
+
 		.price {
 			font-size: $font-lg + 2upx;
 		}
-	
+
 		.m-price {
 			margin: 0 12upx;
 			color: $font-color-light;
 			text-decoration: line-through;
 		}
-	
+
 		.coupon-tip {
 			align-items: center;
 			padding: 4upx 10upx;
@@ -959,36 +1064,44 @@
 			line-height: 1;
 			transform: translateY(-4upx);
 		}
-	
+
 		.bot-row {
 			display: flex;
 			align-items: center;
 			height: 50upx;
 			font-size: $font-sm;
 			color: $font-color-light;
-	
+
 			view {
 				flex: 1;
 			}
 		}
+
 		.status_bar {
 			width: 100%;
 		}
 	}
-	.title{
+
+	.title {
 		font-size: 34rpx;
-		font-weight: 700;
+		font-weight: 500;
 		color: #333333;
 	}
-	.list-row-titel{
+
+	.list-row-titel {
 		text-overflow: -o-ellipsis-lastline;
 		overflow: hidden;
-		text-overflow: ellipsis;display:
-		-webkit-box;-webkit-line-clamp: 2;
+		text-overflow: ellipsis;
+		display:
+			-webkit-box;
+		-webkit-line-clamp: 2;
 		-webkit-box-orient: vertical;
-		font-size:16px;
-		height:45px;
+		font-size: 16px;
+		height: 45px;
 		padding-right: 40rpx;
 		margin-bottom: 26rpx;
 	}
+	.header-swiper-port{
+		height: 120px;
+	}
 </style>

uni_modules/uni-icons/changelog.md

@@ -0,0 +1,6 @@
+## 1.2.0（2021-07-30）
+- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.1.5（2021-05-12）
+- 新增 组件示例地址
+## 1.1.4（2021-02-05）
+- 调整为uni_modules目录规范

uni_modules/uni-icons/components/uni-icons/icons.js

@@ -0,0 +1,132 @@
+export default {
+	"pulldown": "\ue588",
+	"refreshempty": "\ue461",
+	"back": "\ue471",
+	"forward": "\ue470",
+	"more": "\ue507",
+	"more-filled": "\ue537",
+	"scan": "\ue612",
+	"qq": "\ue264",
+	"weibo": "\ue260",
+	"weixin": "\ue261",
+	"pengyouquan": "\ue262",
+	"loop": "\ue565",
+	"refresh": "\ue407",
+	"refresh-filled": "\ue437",
+	"arrowthindown": "\ue585",
+	"arrowthinleft": "\ue586",
+	"arrowthinright": "\ue587",
+	"arrowthinup": "\ue584",
+	"undo-filled": "\ue7d6",
+	"undo": "\ue406",
+	"redo": "\ue405",
+	"redo-filled": "\ue7d9",
+	"bars": "\ue563",
+	"chatboxes": "\ue203",
+	"camera": "\ue301",
+	"chatboxes-filled": "\ue233",
+	"camera-filled": "\ue7ef",
+	"cart-filled": "\ue7f4",
+	"cart": "\ue7f5",
+	"checkbox-filled": "\ue442",
+	"checkbox": "\ue7fa",
+	"arrowleft": "\ue582",
+	"arrowdown": "\ue581",
+	"arrowright": "\ue583",
+	"smallcircle-filled": "\ue801",
+	"arrowup": "\ue580",
+	"circle": "\ue411",
+	"eye-filled": "\ue568",
+	"eye-slash-filled": "\ue822",
+	"eye-slash": "\ue823",
+	"eye": "\ue824",
+	"flag-filled": "\ue825",
+	"flag": "\ue508",
+	"gear-filled": "\ue532",
+	"reload": "\ue462",
+	"gear": "\ue502",
+	"hand-thumbsdown-filled": "\ue83b",
+	"hand-thumbsdown": "\ue83c",
+	"hand-thumbsup-filled": "\ue83d",
+	"heart-filled": "\ue83e",
+	"hand-thumbsup": "\ue83f",
+	"heart": "\ue840",
+	"home": "\ue500",
+	"info": "\ue504",
+	"home-filled": "\ue530",
+	"info-filled": "\ue534",
+	"circle-filled": "\ue441",
+	"chat-filled": "\ue847",
+	"chat": "\ue263",
+	"mail-open-filled": "\ue84d",
+	"email-filled": "\ue231",
+	"mail-open": "\ue84e",
+	"email": "\ue201",
+	"checkmarkempty": "\ue472",
+	"list": "\ue562",
+	"locked-filled": "\ue856",
+	"locked": "\ue506",
+	"map-filled": "\ue85c",
+	"map-pin": "\ue85e",
+	"map-pin-ellipse": "\ue864",
+	"map": "\ue364",
+	"minus-filled": "\ue440",
+	"mic-filled": "\ue332",
+	"minus": "\ue410",
+	"micoff": "\ue360",
+	"mic": "\ue302",
+	"clear": "\ue434",
+	"smallcircle": "\ue868",
+	"close": "\ue404",
+	"closeempty": "\ue460",
+	"paperclip": "\ue567",
+	"paperplane": "\ue503",
+	"paperplane-filled": "\ue86e",
+	"person-filled": "\ue131",
+	"contact-filled": "\ue130",
+	"person": "\ue101",
+	"contact": "\ue100",
+	"images-filled": "\ue87a",
+	"phone": "\ue200",
+	"images": "\ue87b",
+	"image": "\ue363",
+	"image-filled": "\ue877",
+	"location-filled": "\ue333",
+	"location": "\ue303",
+	"plus-filled": "\ue439",
+	"plus": "\ue409",
+	"plusempty": "\ue468",
+	"help-filled": "\ue535",
+	"help": "\ue505",
+	"navigate-filled": "\ue884",
+	"navigate": "\ue501",
+	"mic-slash-filled": "\ue892",
+	"search": "\ue466",
+	"settings": "\ue560",
+	"sound": "\ue590",
+	"sound-filled": "\ue8a1",
+	"spinner-cycle": "\ue465",
+	"download-filled": "\ue8a4",
+	"personadd-filled": "\ue132",
+	"videocam-filled": "\ue8af",
+	"personadd": "\ue102",
+	"upload": "\ue402",
+	"upload-filled": "\ue8b1",
+	"starhalf": "\ue463",
+	"star-filled": "\ue438",
+	"star": "\ue408",
+	"trash": "\ue401",
+	"phone-filled": "\ue230",
+	"compose": "\ue400",
+	"videocam": "\ue300",
+	"trash-filled": "\ue8dc",
+	"download": "\ue403",
+	"chatbubble-filled": "\ue232",
+	"chatbubble": "\ue202",
+	"cloud-download": "\ue8e4",
+	"cloud-upload-filled": "\ue8e5",
+	"cloud-upload": "\ue8e6",
+	"cloud-download-filled": "\ue8e9",
+	"headphones":"\ue8bf",
+	"shop":"\ue609"
+}

uni_modules/uni-icons/package.json

@@ -0,0 +1,82 @@
+{
+  "id": "uni-icons",
+  "displayName": "uni-icons 图标",
+  "version": "1.2.0",
+  "description": "图标组件，用于展示移动端常见的图标，可自定义颜色、大小。",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "icon",
+    "图标"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "category": [
+      "前端组件",
+      "通用组件"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        }
+      }
+    }
+  }
+}

uni_modules/uni-icons/readme.md

@@ -0,0 +1,46 @@
+
+
+## Icons 图标
+> **组件名：uni-icons**
+> 代码块： `uIcons`
+
+
+用于展示 icons 图标 。
+
+### 安装方式
+
+本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范，`HBuilderX 2.5.5`起，只需将本组件导入项目，在页面`template`中即可直接使用，无需在页面中`import`和注册`components`。
+
+如需通过`npm`方式使用`uni-ui`组件，另见文档：[https://ext.dcloud.net.cn/plugin?id=55](https://ext.dcloud.net.cn/plugin?id=55)
+
+### 基本用法
+
+在 ``template`` 中使用组件
+
+```html
+<uni-icons type="contact" size="30"></uni-icons>
+```
+
+
+
+## API
+
+### Icons Props
+
+|属性名	|类型		|默认值	|说明				|
+|:-:	|:-:		|:-:	|:-:				|
+|size	|Number		|24		|图标大小			|
+|type	|String		|-		|图标图案，参考示例	|
+|color	|String		|-		|图标颜色			|
+
+
+### Icons Events
+|事件名	|说明			|返回值|
+|:-:	|:-:			|:-:  |
+|@click|点击 Icon 触发事件|-    |
+
+
+
+## 组件示例
+
+点击查看：[https://hellouniapp.dcloud.net.cn/pages/extUI/icons/icons](https://hellouniapp.dcloud.net.cn/pages/extUI/icons/icons)

uni_modules/uni-notice-bar/changelog.md

@@ -0,0 +1,11 @@
+## 1.1.0（2021-07-30）
+- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.0.9（2021-05-12）
+- 新增 组件示例地址
+## 1.0.8（2021-04-21）
+- 优化 添加依赖 uni-icons, 导入后自动下载依赖
+## 1.0.7（2021-02-05）
+- 优化 组件引用关系，通过uni_modules引用组件
+
+## 1.0.6（2021-02-05）
+- 调整为uni_modules目录规范

uni_modules/uni-notice-bar/components/uni-notice-bar/uni-notice-bar.vue

@@ -0,0 +1,492 @@
+<template>
+	<view v-if="show" class="uni-noticebar" :style="{ backgroundColor: backgroundColor }" @click="onClick">
+		<!-- #ifdef MP-ALIPAY -->
+		<view v-if="showClose === true || showClose === 'true'" class="uni-noticebar-close uni-cursor-point"
+			@click="close">
+			<uni-icons type="closeempty" :color="color" size="12" />
+		</view>
+		<view v-if="showIcon === true || showIcon === 'true'" class="uni-noticebar-icon">
+			<uni-icons type="sound" :color="color" size="14" />
+		</view>
+		<!-- #endif -->
+		<!-- #ifndef MP-ALIPAY -->
+		<uni-icons v-if="showClose === true || showClose === 'true'" class="uni-noticebar-close uni-cursor-point"
+			type="closeempty" :color="color" size="12" @click="close" />
+		<uni-icons v-if="showIcon === true || showIcon === 'true'" class="uni-noticebar-icon" type="sound"
+			:color="color" size="14" />
+		<!-- #endif -->
+		<view ref="textBox" class="uni-noticebar__content-wrapper"
+			:class="{'uni-noticebar__content-wrapper--scrollable':scrollable, 'scrollStyle':portList.length!=0, 'uni-noticebar__content-wrapper--single':!scrollable && (single || moreText)}">
+			<view :id="elIdBox" class="uni-noticebar__content"
+				:class="{'uni-noticebar__content--scrollable':scrollable, 'scrollStyle1':portList.length!=0,'uni-noticebar__content--single':!scrollable && (single || moreText)}">
+				<text v-if="portList.length==0" :id="elId" ref="animationEle" class="uni-noticebar__content-text"
+					:class="{'uni-noticebar__content-text--scrollable':scrollable,'uni-noticebar__content-text--single':!scrollable && (single || moreText)}"
+					:style="{color:color, width:wrapWidth+'px', 'animationDuration': animationDuration, '-webkit-animationDuration': animationDuration ,animationPlayState: webviewHide?'paused':animationPlayState,'-webkit-animationPlayState':webviewHide?'paused':animationPlayState, animationDelay: animationDelay, '-webkit-animationDelay':animationDelay}">{{text}}</text>
+					
+					<view v-if="portList.length!=0" :id="elId" ref="animationEle" class="uni-noticebar__content-text"
+						:class="{'uni-noticebar__content-text--scrollable':scrollable,'scrollStyle2':portList.length!=0,'uni-noticebar__content-text--single':!scrollable && (single || moreText)}" :style="{color:color, width:wrapWidth+'px', 'animationDuration': animationDuration, '-webkit-animationDuration': animationDuration ,animationPlayState: webviewHide?'paused':animationPlayState,'-webkit-animationPlayState':webviewHide?'paused':animationPlayState, animationDelay: animationDelay, '-webkit-animationDelay':animationDelay}">
+						<view class='guess-section-wrap-content port'>
+							<view class='guess-section-wrap-item clearfix' v-for='item in portList'>
+								<view class='factory'>{{item.port}}</view>
+								<view class='wrap'>{{item.goodsName}}</view>
+								<view class='price'>
+									<text class='currectprice'>{{item.price}}</text>
+									较昨日
+									<image v-if='item.comparePrice>0' style="width:7.5px;height:9px;"
+										src='@/static/img/homepage/shangsheng.png'></image>
+									<image v-if='item.comparePrice<0' style="width:7.5px;height:9px;"
+										src='@/static/img/homepage/xiajiang.png'></image>
+									<text v-if='item.comparePrice>0' class='yesterday up'>{{item.comparePrice}}</text>
+									<text v-if='item.comparePrice<0' class='yesterday down'>{{-item.comparePrice}}</text>
+									<text v-if='item.comparePrice==0' class='yesterday'>-</text>
+								</view>
+								<view style='color:#B2B3BB;' class='flex'>
+									<view style='margin-right:10px;'>
+										<image style='width:11px;height:11px;' src='@/static/img/homepage/water@3x.png'>
+										</image>
+										<={{item.waterContent}} </view>
+											<view>
+												<image style='width:11px;height:11px;'
+													src='@/static/img/homepage/unitweight@3x.png'></image>
+												>={{item.bulkDensity}}
+											</view>
+									</view>
+								</view>
+							</view>
+						</view>
+			</view>
+		</view>
+		<view v-if="showGetMore === true || showGetMore === 'true'" class="uni-noticebar__more uni-cursor-point"
+			@click="clickMore">
+			<text v-if="moreText" :style="{ color: moreColor }" class="uni-noticebar__more-text">{{ moreText }}</text>
+			<uni-icons type="arrowright" :color="moreColor" size="14" />
+		</view>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const dom = weex.requireModule('dom');
+	const animation = weex.requireModule('animation');
+	// #endif
+
+	/**
+	 * NoticeBar 自定义导航栏
+	 * @description 通告栏组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=30
+	 * @property {Number} speed 文字滚动的速度，默认100px/秒
+	 * @property {String} text 显示文字
+	 * @property {String} backgroundColor 背景颜色
+	 * @property {String} color 文字颜色
+	 * @property {String} moreColor 查看更多文字的颜色
+	 * @property {String} moreText 设置“查看更多”的文本
+	 * @property {Boolean} single = [true|false] 是否单行
+	 * @property {Boolean} scrollable = [true|false] 是否滚动，为true时，NoticeBar为单行
+	 * @property {Boolean} showIcon = [true|false] 是否显示左侧喇叭图标
+	 * @property {Boolean} showClose = [true|false] 是否显示左侧关闭按钮
+	 * @property {Boolean} showGetMore = [true|false] 是否显示右侧查看更多图标，为true时，NoticeBar为单行
+	 * @event {Function} click 点击 NoticeBar 触发事件
+	 * @event {Function} close 关闭 NoticeBar 触发事件
+	 * @event {Function} getmore 点击”查看更多“时触发事件
+	 */
+
+	export default {
+		name: 'UniNoticeBar',
+		emits: ['click', 'getmore', 'close'],
+		props: {
+			portList: {
+				type: Array,
+				default: ''
+			},
+			text: {
+				type: String,
+				default: ''
+			},
+			moreText: {
+				type: String,
+				default: ''
+			},
+			backgroundColor: {
+				type: String,
+				default: '#fffbe8'
+			},
+			speed: {
+				// 默认1s滚动100px
+				type: Number,
+				default: 8
+			},
+			color: {
+				type: String,
+				default: '#de8c17'
+			},
+			moreColor: {
+				type: String,
+				default: '#999999'
+			},
+			single: {
+				// 是否单行
+				type: [Boolean, String],
+				default: false
+			},
+			scrollable: {
+				// 是否滚动，添加后控制单行效果取消
+				type: [Boolean, String],
+				default: false
+			},
+			showIcon: {
+				// 是否显示左侧icon
+				type: [Boolean, String],
+				default: false
+			},
+			showGetMore: {
+				// 是否显示右侧查看更多
+				type: [Boolean, String],
+				default: false
+			},
+			showClose: {
+				// 是否显示左侧关闭按钮
+				type: [Boolean, String],
+				default: false
+			}
+		},
+		data() {
+			const elId = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
+			const elIdBox = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
+			return {
+				textWidth: 0,
+				boxWidth: 0,
+				wrapWidth: '',
+				webviewHide: false,
+				// #ifdef APP-NVUE
+				stopAnimation: false,
+				// #endif
+				elId: elId,
+				elIdBox: elIdBox,
+				show: true,
+				animationDuration: 'none',
+				animationPlayState: 'paused',
+				animationDelay: '0s'
+			}
+		},
+		mounted() {
+			// #ifdef APP-PLUS
+			var pages = getCurrentPages();
+			var page = pages[pages.length - 1];
+			var currentWebview = page.$getAppWebview();
+			currentWebview.addEventListener('hide', () => {
+				this.webviewHide = true
+			})
+			currentWebview.addEventListener('show', () => {
+				this.webviewHide = false
+			})
+			// #endif
+			this.$nextTick(() => {
+				this.initSize()
+			})
+		},
+		// #ifdef APP-NVUE
+		beforeDestroy() {
+			this.stopAnimation = true
+		},
+		// #endif
+		methods: {
+			initSize() {
+				if (this.scrollable) {
+					// #ifndef APP-NVUE
+					let query = [],
+						boxWidth = 0,
+						textWidth = 0;
+					let textQuery = new Promise((resolve, reject) => {
+						uni.createSelectorQuery()
+							// #ifndef MP-ALIPAY
+							.in(this)
+							// #endif
+							.select(`#${this.elId}`)
+							.boundingClientRect()
+							.exec(ret => {
+								this.textWidth = ret[0].width
+								resolve()
+							})
+					})
+					let boxQuery = new Promise((resolve, reject) => {
+						uni.createSelectorQuery()
+							// #ifndef MP-ALIPAY
+							.in(this)
+							// #endif
+							.select(`#${this.elIdBox}`)
+							.boundingClientRect()
+							.exec(ret => {
+								this.boxWidth = ret[0].width
+								resolve()
+							})
+					})
+					query.push(textQuery)
+					query.push(boxQuery)
+					Promise.all(query).then(() => {
+						this.animationDuration = `${this.textWidth / this.speed}s`
+						this.animationDelay = `-${this.boxWidth / this.speed}s`
+						setTimeout(() => {
+							this.animationPlayState = 'running'
+						}, 1000)
+					})
+					// #endif
+					// #ifdef APP-NVUE
+					dom.getComponentRect(this.$refs['animationEle'], (res) => {
+						let winWidth = uni.getSystemInfoSync().windowWidth
+						this.textWidth = res.size.width
+						animation.transition(this.$refs['animationEle'], {
+							styles: {
+								transform: `translateX(-${winWidth}px)`
+							},
+							duration: 0,
+							timingFunction: 'linear',
+							delay: 0
+						}, () => {
+							if (!this.stopAnimation) {
+								animation.transition(this.$refs['animationEle'], {
+									styles: {
+										transform: `translateX(-${this.textWidth}px)`
+									},
+									timingFunction: 'linear',
+									duration: (this.textWidth - winWidth) / this.speed * 1000,
+									delay: 1000
+								}, () => {
+									if (!this.stopAnimation) {
+										this.loopAnimation()
+									}
+								});
+							}
+						});
+					})
+					// #endif
+				}
+				// #ifdef APP-NVUE
+				if (!this.scrollable && (this.single || this.moreText)) {
+					dom.getComponentRect(this.$refs['textBox'], (res) => {
+						this.wrapWidth = res.size.width
+					})
+				}
+				// #endif
+			},
+			loopAnimation() {
+				// #ifdef APP-NVUE
+				animation.transition(this.$refs['animationEle'], {
+					styles: {
+						transform: `translateX(0px)`
+					},
+					duration: 0
+				}, () => {
+					if (!this.stopAnimation) {
+						animation.transition(this.$refs['animationEle'], {
+							styles: {
+								transform: `translateX(-${this.textWidth}px)`
+							},
+							duration: this.textWidth / this.speed * 1000,
+							timingFunction: 'linear',
+							delay: 0
+						}, () => {
+							if (!this.stopAnimation) {
+								this.loopAnimation()
+							}
+						});
+					}
+				});
+				// #endif
+			},
+			clickMore() {
+				this.$emit('getmore')
+			},
+			close() {
+				this.show = false;
+				this.$emit('close')
+			},
+			onClick() {
+				this.$emit('click')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.uni-noticebar {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		width: 100%;
+		box-sizing: border-box;
+		/* #endif */
+		flex-direction: row;
+		align-items: center;
+		padding: 6px 12px;
+		margin-bottom: 10px;
+	}
+
+	.uni-cursor-point {
+		/* #ifdef H5 */
+		cursor: pointer;
+		/* #endif */
+	}
+
+	.uni-noticebar-close {
+		margin-right: 5px;
+	}
+
+	.uni-noticebar-icon {
+		margin-right: 5px;
+	}
+
+	.uni-noticebar__content-wrapper {
+		flex: 1;
+		flex-direction: column;
+		overflow: hidden;
+	}
+
+	.uni-noticebar__content-wrapper--single {
+		/* #ifndef APP-NVUE */
+		line-height: 18px;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-wrapper--single,
+	.uni-noticebar__content-wrapper--scrollable {
+		flex-direction: row;
+	}
+
+	/* #ifndef APP-NVUE */
+	.uni-noticebar__content-wrapper--scrollable {
+		position: relative;
+		height: 18px;
+	}
+
+	/* #endif */
+
+	.uni-noticebar__content--scrollable {
+		/* #ifdef APP-NVUE */
+		flex: 0;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		flex: 1;
+		display: block;
+		overflow: hidden;
+		/* #endif */
+	}
+
+	.uni-noticebar__content--single {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex: none;
+		width: 100%;
+		justify-content: center;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-text {
+		font-size: 14px;
+		line-height: 18px;
+		/* #ifndef APP-NVUE */
+		word-break: break-all;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-text--single {
+		/* #ifdef APP-NVUE */
+		lines: 1;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		display: block;
+		width: 100%;
+		white-space: nowrap;
+		/* #endif */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	.uni-noticebar__content-text--scrollable {
+		/* #ifdef APP-NVUE */
+		lines: 1;
+		padding-left: 750rpx;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		position: absolute;
+		display: block;
+		height: 18px;
+		line-height: 18px;
+		white-space: nowrap;
+		padding-left: 100%;
+		animation: notice 10s 0s linear infinite both;
+		animation-play-state: paused;
+		/* #endif */
+	}
+
+	.uni-noticebar__more {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		/* #endif */
+		flex-direction: row;
+		flex-wrap: nowrap;
+		align-items: center;
+		padding-left: 5px;
+	}
+
+	.uni-noticebar__more-text {
+		font-size: 14px;
+	}
+
+	@keyframes notice {
+		100% {
+			transform: translate3d(-100%, 0, 0);
+		}
+	}
+	.guess-section-wrap-content{
+		display: flex;
+	}
+	.scrollStyle{
+		height: 100px;
+		display: flex;
+		justify-content: center;
+		// align-items: center;
+	}
+	.scrollStyle1{
+		// background: red;
+		display: felx;
+		align-items: center;
+	}
+	.scrollStyle2{
+		// background: yellow;
+		display: felx;
+		align-items: center;
+		height: 100%;
+	}
+	.guess-section-wrap-content{
+		height: 100%;
+		display: flex;
+		align-items: center;
+	}
+	.guess-section-wrap-item {
+		float: left;
+		width: 38vw;
+		background: #F9F9FA;
+		padding: 10px;
+		margin: 10px;
+		border-radius: 3px;
+		color: black;
+		// width:50%;
+	}
+	.factory{
+		    font-size: 13px;
+		    font-weight: 900;	
+	}
+	.wrap{
+		font-size: 10px;
+		    color: rgba(0, 0, 0, 0.5);
+	}
+	.price{
+		color: #B2B3BB;
+	}
+	.currectprice{
+		    color: #fd714f;
+		    font-size: 18px;
+		    font-weight: 600;
+		    vertical-align: middle;
+		    margin-right: 10px;
+	}
+</style>

uni_modules/uni-notice-bar/package.json

@@ -0,0 +1,85 @@
+{
+  "id": "uni-notice-bar",
+  "displayName": "uni-notice-bar 通告栏",
+  "version": "1.1.0",
+  "description": "NoticeBar 通告栏组件，常用于展示公告信息，可设为滚动公告",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "通告栏",
+    "公告",
+    "跑马灯"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "category": [
+      "前端组件",
+      "通用组件"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": [
+			"uni-icons"
+		],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        }
+      }
+    }
+  }
+}

uni_modules/uni-notice-bar/readme.md

@@ -0,0 +1,71 @@
+
+
+## NoticeBar 通告栏
+> **组件名：uni-notice-bar**
+> 代码块： `uNoticeBar`
+
+
+通告栏组件 。
+
+### 安装方式
+
+本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范，`HBuilderX 2.5.5`起，只需将本组件导入项目，在页面`template`中即可直接使用，无需在页面中`import`和注册`components`。
+
+如需通过`npm`方式使用`uni-ui`组件，另见文档：[https://ext.dcloud.net.cn/plugin?id=55](https://ext.dcloud.net.cn/plugin?id=55)
+ 
+### 基本用法
+
+在 ``template`` 中使用组件
+
+```html
+<!-- 基本用法 -->
+<uni-notice-bar single="true" text="[单行] 这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+<uni-notice-bar text="[多行] 这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+
+<!-- 文字滚动 -->
+<uni-notice-bar scrollable="true" single="true" text="[单行] 这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+
+<!-- 显示图标 -->
+<uni-notice-bar showIcon="true" text="[多行] 这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+
+<!-- 显示关闭按钮 -->
+<uni-notice-bar showClose="true" showIcon="true" text="这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+
+<!-- 查看更多 -->
+ <uni-notice-bar @getmore="getMore" :showGetMore="true" moreText="查看更多" single="true" text="[单行] 这是 NoticeBar 通告栏，这是 NoticeBar 通告栏，这是 NoticeBar 通告栏"></uni-notice-bar>
+```
+
+> **注意**
+> 如果需要异步获取内容后展示需要使用`v-if`进行控制，`<uni-notice-bar v-if="text" :text="text"></uni-notice-bar>`
+
+
+## NoticeBar API
+
+### NoticeBar Props
+
+|属性名				|类型	|默认值	|说明												|
+|:-:				|:-:	|:-:	|:-:												|
+|speed				|Number	|100	|文字滚动的速度，默认100px/秒						|
+|text				|String	|-		|显示文字											|
+|background-color	|String	|#fffbe8|背景颜色											|
+|color				|String	|#de8c17|文字颜色											|
+|moreColor			|String	|#999999|查看更多文字的颜色									|
+|moreText			|String	|-		|设置“查看更多”的文本								|
+|single				|Boolean|false	|是否单行											|
+|scrollable			|Boolean|false	|是否滚动，为true时，NoticeBar为单行				|
+|showIcon			|Boolean|false	|是否显示左侧喇叭图标								|
+|showClose			|Boolean|false	|是否显示左侧关闭按钮								|
+|showGetMore		|Boolean|false	|是否显示右侧查看更多图标，为true时，NoticeBar为单行|
+
+### NoticeBar Events
+
+|事件名称	|说明						|返回值	|
+|:-:		|:-:						|:-:	|
+|@click		|点击 NoticeBar 触发事件	|-		|
+|@close		|关闭 NoticeBar 触发事件	|-		|
+|@getmore	|点击”查看更多“时触发事件	|-		|
+
+
+## 组件示例
+
+点击查看：[https://hellouniapp.dcloud.net.cn/pages/extUI/notice-bar/notice-bar](https://hellouniapp.dcloud.net.cn/pages/extUI/notice-bar/notice-bar)