From c90ecea460e29003d8bc263f4ad86868820c9ae0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=A8=E8=B1=AA?= <781521347@qq.com>
Date: Tue, 14 Dec 2021 15:54:58 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 App.vue                            |  14 ++---
 components/vSwiper.vue             |  45 +++++++++++----
 config/index.js                    |   4 +-
 pages/home/index.vue               |  89 +++++++++++++++++++++--------
 pages/life/articleDetail/index.vue |  63 +++++++++++++++-----
 pages/life/articleList/index.vue   |  25 ++++++--
 pages/life/index.vue               |   1 -
 static/images/eye2.png             | Bin 0 -> 352 bytes
 8 files changed, 176 insertions(+), 65 deletions(-)
 create mode 100644 static/images/eye2.png

diff --git a/App.vue b/App.vue
index 498da52..336e5c8 100644
--- a/App.vue
+++ b/App.vue
@@ -10,9 +10,7 @@ export default {
 		uni.hideTabBar()
   },
   globalData: {
-    // baseURL : 'http://192.168.0.110:8092/api/',
     baseURL: VUE_APP_API_URL+ '/',
-    // baseURL : 'https://cloud.api.cyjyyjy.com/api/',
     userInfo: null,
     navHeight: 0,
     navTopHeight: 0,
@@ -28,7 +26,6 @@ export default {
 
   onShow(e) {
 		this.globalData.scene = e.scene
-		// console.log(this.globalData.scene,'this.globalData.scene')
     //隐藏系统tabbar
     uni.hideTabBar();
     var query = {};
@@ -251,6 +248,7 @@ export default {
 		setMenuHeight() {
 		  uni.getSystemInfo({
 		    success: res => {
+					console.log(res,'resaaaaa')
 		      this.globalData.navTopHeight = res.statusBarHeight;
 		      this.globalData.CustomBar = res.statusBarHeight + 45;
 		      this.globalData.systemInfo = res;
@@ -261,10 +259,12 @@ export default {
 		    }
 		  });
 		  let menuButtonObj = uni.getMenuButtonBoundingClientRect();
-		  this.globalData.menuTop = menuButtonObj.top; // console.log(menuButtonObj)
-		
-		  this.globalData.menuHeight = menuButtonObj.height;
-		  this.globalData.navHeight = menuButtonObj.height + (menuButtonObj.top - this.globalData.navTopHeight);
+			console.log(menuButtonObj,'menuButtonObj')
+		 this.globalData.menuTop = menuButtonObj.top;
+		 this.globalData.menuHeight = menuButtonObj.height;
+		 this.globalData.topHeight = menuButtonObj.top + menuButtonObj.height;
+		 this.globalData.topLeft = menuButtonObj.left;
+		 this.globalData.navHeight = menuButtonObj.top;
 		},
 		
 		getInfo() {
diff --git a/components/vSwiper.vue b/components/vSwiper.vue
index f126083..7f802fd 100644
--- a/components/vSwiper.vue
+++ b/components/vSwiper.vue
@@ -1,18 +1,19 @@
 <template>
-	<swiper class="swiper-block" vertical="true" circular="true" previous-margin="90rpx" next-margin="90rpx" current="0" @change="swiperChange">
+	<swiper class="swiper-block" vertical="true" circular="true" previous-margin="80rpx" next-margin="80rpx" current="0" @change="swiperChange">
 			<block v-for="(item, index) in articleList" :key="index">
 				<swiper-item class="swiper-item" :class="(swiperIndex == index ? 'active' : '')" @tap="previewImg">	
 					<view class="item-box" :class="(swiperIndex == index ? 'active' : '')" @click="toDetial(item.id)">
 						<image mode="aspectFill" :src="item.imageInput" class="slide-image"></image>
 						<view class="content-box">
-							<view class="title-box">{{item.title}}</view>
+							<view class="mask"></view>
+							<view class="title-box line1">{{item.title}}</view>
 							<view class="content acea-row">
 								<view>{{item.author}}</view>
 								<view>{{item.createTime}}</view>
-								<view class="acea-row row-middle">
+								<!-- <view class="acea-row row-middle">
+									<image src="../static/images/eye2.png" class="eye"></image>
 									<text>{{item.visit}}</text>
-									<image src="../static/images/eye.png" class="eye"></image>
-								</view>
+								</view> -->
 							</view>
 						</view>
 					</view>
@@ -60,6 +61,8 @@
 		width: 670rpx;
 	  height: 300rpx;
 		margin: 0 auto;
+		border-radius: 20rpx;
+		
 	}
 	  
 	.swiper-item {
@@ -70,8 +73,8 @@
 	  overflow: unset;
 	}
 	.item-box{
-		width: 622rpx;
-		height: 200rpx;
+		width: 600rpx;
+		height: 230rpx;
 		position: relative;
 		border-radius: 20rpx;
 	}
@@ -82,27 +85,49 @@
 		border-radius: 20rpx;
 	}
 	.content-box{
+		width: 556rpx;
+		height: 100rpx;
 		position: absolute;
 		bottom: 20rpx;
 		left: 20rpx;
 		color: #0081FF;
 		z-index: 5;
 	}
+	.mask{
+		width: 100%;
+		height: 100%;
+		background:rgba(255,255,255,.5);
+		filter: blur(1px);
+		position: absolute;
+		top: 0;
+		left: 0;
+		border-radius: 12rpx;
+	}
 	.title-box{
 		font-size: 32rpx;
 		font-weight: 500;
-		color: #fff;
+		color: #000;
 		margin-bottom: 10rpx;
+		position: absolute;
+		top: 10rpx;
+		left: 10rpx;
+		z-index: 99;
 	}
 	.content{
-		color: #fff;
+		color: #000;
 		font-size: 26rpx;
+		position: absolute;
+		top: 56rpx;
+		z-index: 99;
+		left: 10rpx;
 	}
 	.content view{
 		margin-right: 50rpx;
 	}
 	.active {
-	  transform: scale(1.02);
+	  // transform: scale(1.02);
+		width: 670rpx;
+		height: 256rpx;
 	  transition: all 0.2s ease-in 0s;
 		border-radius: 20rpx;
 	  z-index: 20;
diff --git a/config/index.js b/config/index.js
index 2db8985..d8845b8 100644
--- a/config/index.js
+++ b/config/index.js
@@ -1,8 +1,8 @@
 // export const VUE_APP_API_URL = 'http://natapp.xinxintuan.co/api';
 // export const VUE_APP_API_URL = 'https://wxapi.yixiang.co/api'
 // export const VUE_APP_API_URL = 'http://192.168.0.112:8092/api'
-   export const VUE_APP_API_URL = 'http://192.168.0.111:8092/api'
-// export const VUE_APP_API_URL = 'https://cloud.api.cyjyyjy.com/api'
+   // export const VUE_APP_API_URL = 'http://192.168.0.111:8092/api'
+export const VUE_APP_API_URL = 'https://cloud.api.cyjyyjy.com/api'
 //  export const VUE_APP_API_URL = 'http://natapp.xinxintuan.co/api';
 // export const VUE_APP_API_URL = 'https://thapi.xinxintuan.co/api'
 //  export const VUE_APP_API_URL = 'https://h5api.xinxintuan.co/api';
diff --git a/pages/home/index.vue b/pages/home/index.vue
index 3fd945d..26477bb 100644
--- a/pages/home/index.vue
+++ b/pages/home/index.vue
@@ -2,29 +2,31 @@
   <view class="productSort">
 		<!-- 顶部主页 -->
 		<skeleton v-if="showSkeleton" ref="skeleton" loading="chiaroscuro" selector="skeleton" bgcolor="#FFF"></skeleton>
+		<view class="pageTitle-box" :class="isFixed ? 'showPageTitle' : ''" :style="{'padding-top':navTopHeight + 'px',height:navHeight*2+ 'px'}">
+			<view class="top-logo acea-row row-center" :style="'top:' + menuTop + 'px;height:' + menuHeight + 'px;line-height: ' + menuHeight + 'px;'">禪易生态云</view>
+		</view>
 		<view class="main-box skeleton-rect" >
 			<view class="back-bg"><image src="https://download.cyjyyjy.com/life-bg.png" mode=""></image></view>
-			<view class="top-logo acea-row row-center" :style="'top:' + menuTop + 'px;height:' + menuHeight + 'px;line-height: ' + menuHeight + 'px;'">禪易生态云</view>
-			<view class="details-btn">了解详情</view>
+			<view class="details-btn skeleton-rect">了解详情</view>
 		</view>
 		<!-- 云快讯 -->
 		<view class="yun-box skeleton-rect">
-			<view class="acea-row row-between-wrapper">
+			<view class="acea-row row-between-wrapper skeleton-rect">
 				<image src="../../static/images/yun.png" class="headline-yun"></image>
-				<view class="more-r" @click="toAritcleList">
+				<view class="more-r skeleton-rect" @click="toAritcleList">
 					<text>查看更多</text>
 					<image src="../../static/images/home/arrow-r.png"></image>
 				</view>
 			</view>
-			<view class="rotaion">
+			<view class="rotaion skeleton-rect">
 				<vSwiper :articleList="articleList"></vSwiper>
 			</view>
 		</view>
 		<!-- 最新活动 -->
-		<view class="act-box" >
-			<view class="headline"><image src="../../static/images/new-act.png" mode=""></image></view>
+		<view class="act-box skeleton-rect" >
+			<view class="headline"><image src="../../static/images/new-act.png" mode="" skeleton-rect></image></view>
 			<scroll-view class="scroll-view_H" scroll-x="true">			
-				<view class="slide-left" v-for="(item,index) in activity" :key="index"  @tap="toActiveDetail" :data-id="item.id">
+				<view class="slide-left  skeleton-rect" v-for="(item,index) in activity" :key="index"  @tap="toActiveDetail" :data-id="item.id">
 					<view class="act-title">{{item.name}}</view>
 					<view class="resource-list acea-row-nowrap">
 						<image :src="item.images" class="act-img" mode="aspectFill"></image>
@@ -57,18 +59,18 @@
 		</view>
 		<!-- 为您推荐 -->
 		<view class="rec-box">
-			<view class="headline"><image src="../../static/images/rec-headline.png" mode=""></image></view>
+			<view class="headline  skeleton-rect"><image src="../../static/images/rec-headline.png" mode=""></image></view>
 			<view class="rec-switch">
 				<view class="rec-title acea-row"> 
 					<view class="rec-l " @click="tabClick(1)">
-						<image src="../../static/images/rec-bg.png" class="rec-bg" v-show="active == 1"></image>
+						<image src="../../static/images/rec-bg.png" class="rec-bg" v-show="active == 2"></image>
 						<view class="rec-t acea-row row-center-wrapper">
 							<image src="../../static/images/rec-icon1.png" mode=""></image>
 							<view>需求</view>
 						</view>
 					</view>
 					<view class="rec-r "  @click="tabClick(2)">
-						<image src="../../static/images/rec-bg.png" class="rec-bg"  v-show="active == 2"></image>
+						<image src="../../static/images/rec-bg.png" class="rec-bg"  v-show="active == 1"></image>
 						<view class="rec-t acea-row row-center-wrapper">
 							<image src="../../static/images/rec-icon2.png" mode=""></image>
 							<view>资源</view>
@@ -162,6 +164,7 @@ export default {
 			menuHeight: app.globalData.menuHeight,
 			navHeight: app.globalData.navHeight,
 			menuTop: app.globalData.menuTop,
+			navTopHeight: app.globalData.navTopHeight,
 			currentTabIndex:0,
 			flowList:[],
 			isFixed: false,
@@ -180,8 +183,22 @@ export default {
 			showSkeleton: true
     };
   },
-  watch: {
-		
+  onShareAppMessage() {
+  	return {
+  	  title: '禅易云生态',
+  	  path: '/pages/home/index',
+  	  success(res) {
+  	    uni.showToast({
+  	      title: '分享成功',
+  	    })
+  	  },
+  	  fail(res) {
+  	    uni.showToast({
+  	      title: '分享失败',
+  	      icon: 'none',
+  	    })
+  	  },
+  	}
   },
 	onReady:function(){
 		const that = this;
@@ -210,12 +227,19 @@ export default {
 		// 	this.getProducts();
 		// })
 	},
+	onPageScroll(e) {
+		if (e.scrollTop > 60) {
+			this.isFixed = true;
+		} else {
+			this.isFixed = false;
+		};
+	},
   methods: {
 		getIndexData(){
 			uni.showLoading({ title: '正在加载...' })
 			uni.showNavigationBarLoading();
 			getIndexData().then(res=>{
-				this.articleList = res.data.articleList
+				this.articleList = res.data.articleList.reverse()
 				this.activity= res.data.recommendActivity.content
 				this.demandList = res.data.demandList
 				this.resourcesList = res.data.resourcesDtos
@@ -258,6 +282,12 @@ export default {
 				}
 			})
 		},
+		toGoodsDetail(id){
+			this.$yrouter.push({
+			  path: "/pages/shop/GoodsCon/index",
+			  query: { id: id }
+			});
+		},
 		getProducts(){
 			this.loadStatus = 'loading';
 			getProducts({page:this.page,limit:this.limit}).then((res)=>{
@@ -302,18 +332,26 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-
-</style>
-
 <style lang="less" scoped>
-.productSort {
-  // height: 100%;
-	// padding-bottom: 200rpx;
-	background: #EEEEEE !important;
-	position: relative;
-}
-
+	.productSort {
+		background: #EEEEEE !important;
+		position: relative;
+	}
+	.pageTitle-box{
+		width: 100%;
+		position: fixed;
+		top: 0;
+		z-index: 99;
+		transition: all .5s;
+	}
+	.showPageTitle{
+		background: #fff;
+		color: #000000 !important;
+		opacity: 1;
+		.top-logo{
+			color: #000;
+		}
+	}
 .page-top-box{
 	width: 100%;
 	position: fixed;
@@ -379,6 +417,7 @@ export default {
 	color: #fff;
 	font-weight: 600;
 	font-size: 32rpx;
+	transition: all .5s cubic-bezier(.25, .5, .5, .9);
 }
 .details-btn{
 		width: 196rpx;
diff --git a/pages/life/articleDetail/index.vue b/pages/life/articleDetail/index.vue
index 094cbac..9497253 100644
--- a/pages/life/articleDetail/index.vue
+++ b/pages/life/articleDetail/index.vue
@@ -1,24 +1,28 @@
 
 <template>
 	<view class="article-box">
-		<view class="headline">{{detail.title}}</view>
-		<view class="acea-row">
-			<view class="header-img"><image src="../../../static/images/menu2.png"></image></view>
-			<view class="">
-				<view class="release-auth">{{detail.author}}</view>
-				<view class="acea-row">
-					<view class="fz24 acea-row row-middle">
-						<image src="../../../static/images/eye.png" class="eye-icon"></image>
-						<text>203</text>
-						
+		<view class="article-header">
+			<view class="headline">{{detail.title}}</view>
+			<view class="acea-row">
+				<view class="header-img"><image :src="detail.authorLogo"></image></view>
+				<view class="">
+					<view class="release-auth">{{detail.author}}</view>
+					<view class="acea-row">
+						<view class="fz24 acea-row row-middle">
+							<image src="../../../static/images/eye.png" class="eye-icon"></image>
+							<text>{{detail.visit}}</text>
+						</view>
+						<view class="fz24">{{detail.formatTime}}</view>
 					</view>
-					<view class="fz24">{{detail.addTime}}</view>
 				</view>
 			</view>
 		</view>
+		
 		<view class="content">
-			<view class="conter" v-html="detail.content"></view>
+			<view class="explain-box">转载声明：本文由云快讯收录，观点仅代表作者本人。不代表云快讯立场，云快讯不对所包含的准确性，可靠性或完整性提供任何明示，请自行承担任何责任。</view>
+			<rich-text :nodes="detail.content"></rich-text>
 		</view>
+		
 	</view>
 </template>
 
@@ -35,7 +39,7 @@ export default{
 		return {
 		  title: this.detail.title,
 		  imageUrl: this.detail.imageInput,
-		  path: 'pages/life/articleDeail/index?id=' + this.detail.id,
+		  path: '/pages/life/articleDetail/index?id=' + this.detail.id,
 		  success(res) {
 		    uni.showToast({
 		      title: '分享成功',
@@ -52,8 +56,23 @@ export default{
 	methods:{
 		getArticleDetail(){
 			getArticleDetail({id: this.id}).then((res)=>{
+				res.data.content= this.formatRichText(res.data.content)
 				this.detail = res.data
 			})
+		},
+		formatRichText(html){
+		  let newContent= html.replace(/<img[^>]*>/gi,function(match,capture){
+		    match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
+		    match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
+		    match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
+		    return match;
+		  });
+		  newContent = newContent.replace(/style="[^"]+"/gi,function(match,capture){
+		    match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
+		    return match;
+		  });
+		  newContent = newContent.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"');
+		  return newContent;
 		}
 	},
 	onLoad: function (option) {
@@ -69,7 +88,9 @@ export default{
 	.article-box{
 		width: 100%;
 		min-height: 100vh;
-		padding: 0 40rpx;
+		.article-header{
+			padding: 0 40rpx;
+		}
 		.headline{
 			font-size: 32rpx;
 			color: #333333;
@@ -84,6 +105,7 @@ export default{
 			image{
 				width: 100%;
 				height: 100%;
+				border-radius: 25px;
 			}
 		}
 		.release-auth{
@@ -104,7 +126,18 @@ export default{
 		}
 		.content{
 			width: 100%;
-			padding: 40rpx 0;
+			padding: 24rpx;
+			overflow: hidden;
+		}
+		.explain-box{
+			width: 100%;
+			padding: 12rpx 34rpx;
+			background: #E3E3E3;
+			color: #999;
+			font-size: 24rpx;
+			line-height: 38rpx;
+			border-radius: 12rpx;
+			margin-bottom: 12rpx;
 		}
 	}
 	
diff --git a/pages/life/articleList/index.vue b/pages/life/articleList/index.vue
index cd9b18f..aa63eb6 100644
--- a/pages/life/articleList/index.vue
+++ b/pages/life/articleList/index.vue
@@ -26,13 +26,14 @@
 							<image src="../../../static/images/eye.png"></image>
 						</view>
 					</view>
-					
 				</view>
 				<view class="item-r">
 					<image :src="item.imageInput" mode="aspectFill"></image>
 				</view>
 			</view>
 		</view>
+		
+		<view class="loadStatus-box">{{loadStatus}}</view>
 	</view>
 </template>
 
@@ -44,7 +45,8 @@
 				articleList: [],
 				page: 0,
 				size: 10,
-				isLoading: true
+				isLoading: true,
+				loadStatus: '没有更多了...'
 			}
 		},
 		mounted() {
@@ -56,12 +58,19 @@
 		},
 		methods:{
 			getArticleList(){
+				if(!this.isLoading) return
 				uni.showLoading({
 					title: '加载中...'
 				})
-				if(!this.isLoading) return
+				this.loadStatus = '加载中...'
 				getArticle({page: this.page,size: this.size, isHot: 0}).then((res)=>{
-					res.data.content.length < this.size ? this.isLoading = false : this.isLoading = true
+					if(res.data.content.length < this.size){
+						this.loadStatus = '没有更多了...'
+						this.isLoading = false
+					} else{
+						this.isLoading = true
+						this.loadStatus = '上拉加载更多...'
+					}
 					this.articleList = this.articleList.concat(res.data.content)
 					uni.hideLoading()
 				})
@@ -123,7 +132,7 @@
 	
 		.list-box{
 			width: 100%;
-			padding: 180rpx 40rpx 40rpx;
+			padding: 180rpx 40rpx 0rpx;
 			.list-item{
 				width: 100%;
 				background: #fff;
@@ -173,5 +182,11 @@
 				}
 			}
 		}
+		.loadStatus-box{
+			text-align: center;
+			font-size: 28rpx;
+			color: #000;
+			padding: 30rpx 0;
+		}
 	}
 </style>
diff --git a/pages/life/index.vue b/pages/life/index.vue
index 5ee5387..f9e4cb8 100644
--- a/pages/life/index.vue
+++ b/pages/life/index.vue
@@ -309,7 +309,6 @@ export default {
 	}
 }
 .category-tab-box{
-	border: 1rpx solid black;
 	width: 100%;
 	height: 108rpx;
 	line-height: 108rpx;
diff --git a/static/images/eye2.png b/static/images/eye2.png
new file mode 100644
index 0000000000000000000000000000000000000000..8e7272667ffe30085b821235be1146deda3a93db
GIT binary patch
literal 352
zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM3?#3wJbMaAF%}28J29*~C-V}>2@miIaRt)<
zX#o1%_+9{wmMIDH3ua*95l~h!Ft&Gac8O0YuWs+|pFDg1=KY7?fBvp!d+H-lUB9P`
zV~EE2y@8%WEe0GcF^`3M``nWM{XZwDb3Lg48|$u{OpHGSW{8A_s#HuoT=u1DBX9rB
zuTRW<zJ`fLh*h~x`Tpi+!o|#lW#Wr&%6t6r`^4B=%;uP7buIYingxl;3gWZQF-kt*
zl#ymvxw4P-O04!*gFoN@-6=iTqhYQ4qh^xi#kwOes=n>Gva9Fg>Gl7ZPdpY?ah%z4
Q0_ZdbPgg&ebxsLQ0B`EPRsaA1

literal 0
HcmV?d00001