h5开盘详情

public/appnew/src/assets/js/public.js

 //公用js文件
 let ServerHost = 'https://pre2.tonglianjituan.com';
+//let ServerHost = 'http://127.0.0.1';
 //let ServerHost = 'https://api.tonglianjituan.com';
 let ServerHostImageLiu = 'https://pre2.tonglianjituan.com';
 if(location.origin === 'https://api.tonglianjituan.com') {

public/appnew/src/components/openSquareDetails/openSquareCommentLi.vue

+<template>
+	<li>
+		<div class="flex">
+			<div class="flex">
+				<img-error :datasrc="data.img" :imgtype="'avatar'"></img-error>
+			</div>
+			<div>
+				<p>{{data.name}}</p>
+				<p>{{data.create_time}}</p>
+				<div>
+					<p class="comment-real-p">{{data.comment}}</p>
+				</div>
+			</div>
+		</div>
+	</li>
+</template>
+
+<script>
+	import '@/assets/js/layer041002.js';
+	export default {
+		name: '',
+		props: {
+			data: {
+				type: Object,
+				default: () => ({
+					message: 'hello'
+				})
+			},
+			dataindex: {
+				type: [Number, String],
+				default: 0
+			}
+		},
+		components: {
+			
+		},
+		data: () => ({
+			dealContent: '',
+			
+		}),
+		created() {
+			let _this = this;
+		},
+		mounted() {
+			let _this = this;
+		},
+		methods: {
+			
+			
+		},
+		computed: {
+
+		}
+	}
+</script>
+
+<style scoped>
+	li>div{
+		padding: .3rem 0;
+	}
+	li>div>div:nth-of-type(1){
+		padding-right: .24rem;
+	}
+	li>div>div:nth-of-type(1)>img{
+		width: .75rem;
+		height: .75rem;
+		border-radius: .375rem;
+	}
+	li>div>div:nth-of-type(2){}
+	li>div>div:nth-of-type(2)>p:nth-of-type(1){
+		color: #808080;
+		font-size: .3rem;
+	}
+	li>div>div:nth-of-type(2)>p:nth-of-type(2){
+		color: #808080;
+		font-size: .24rem;
+		padding-top: .1rem;
+	}
+	li>div>div:nth-of-type(2)>div{
+		padding: .2rem 0 .2rem;
+		color: #1a1a1a;
+		position: relative;
+	}
+	.comment-real-p{
+		word-break: break-all;
+	}
+	.comment-a-lookmore,.comment-a-shouqi{
+		display: block;
+		line-height: .4rem;
+		color: #FF9419;
+		font-size: .26rem;
+		position: relative;
+	}
+	.comment-a-lookmore{
+		width: 1.4rem;
+		position: absolute;
+		right: 0;
+		bottom: .2rem;
+	}
+	.comment-a-shouqi{
+		text-align: right;
+	}
+	.comment-a-lookmore::after{
+		content: '';
+		float: right;
+		width: .18rem;
+		height: .4rem;
+		padding-left: .18rem;
+		background: url(images/icon_down@2x.png) no-repeat center center/.18rem .13rem;
+		transform: rotate(180deg);
+	}
+	.comment-a-shouqi::after{
+		content: '';
+		width: .18rem;
+		height: .4rem;
+		padding-left: .36rem;
+		background: url(images/icon_down@2x.png) no-repeat center center/.18rem .13rem;
+	}
+	
+</style>
\ No newline at end of file

public/appnew/src/components/openSquareDetails/openSquareDetails.vue

+<template>
+	<div>
+		<div class="header_seat"></div>
+		<article>
+			<div class="article-bar">
+				<h1>{{articleTitle}}</h1>
+				<p>{{articleSiteName}} {{articleDepartmentName}} {{articleName}} {{articleTime}}</p>
+			</div>
+			<div class="oh article-content-area" v-html="articleContent">{{articleContent}}</div>
+		</article>
+		
+		<div class="list-commnet-area">
+			<h2>评论</h2>
+			<pagination-load :canload="!isStop" :distance="10" @load="getCommentList">
+				<ul>
+					<li is="self-defined-li" v-for="(item, index) in commentDataList" :data="item" :dataindex="index"></li>
+				</ul>
+			</pagination-load>
+			<div class="loading-gif-block" v-show="isLoading">正在加载...</div>
+			<div class="no-data-block" v-if="noDataFlag">暂无数据</div>
+			<div class="no-more-block" v-if="!noDataFlag&&isStop">没有更多了...</div>
+		</div>
+		
+	</div>
+</template>
+
+<script>
+	import '@/assets/js/layer041002.js';
+	import paginationLoad from '@/components/publicEg/paginationLoad';
+	import selfDefinedLi from '@/components/openSquareDetails/openSquareCommentLi.vue';
+	import commentIcon from '@/components/businessCollege/images/icon_comment_2x.png';
+	export default {
+		name: '',
+		props: {
+			data: {
+				type: Object,
+				default: () => ({
+					message: 'hello'
+				})
+			},
+			dataindex: {
+				type: [Number, String],
+				default: 0
+			}
+		},
+		components: {
+			'pagination-load': paginationLoad,
+			'self-defined-li': selfDefinedLi
+		},
+		data() {
+			let _this = this;
+			return {
+				articleId: _this.$route.query.id,
+				token: _this.$route.query.token,
+				articleTitle: '',
+				articleName: '',
+				articleTime: '',
+				articleDepartmentName:'',
+				articleSiteName:'',
+				articleContent: '',
+				isStop: false,
+				isLoading: false,
+				noDataFlag: false,
+				pageSize: 2,
+				page: 1,
+				commentDataList: []
+			};
+		},
+		created() {
+			let _this = this;
+			_this.common.duringRequest({
+				'urlStr': '/broker/getSquareCommentList',
+				startAction() {
+					_this.isLoading = true;
+				},
+				endAction() {
+					_this.isLoading = false;
+				}
+			});
+			
+			_this.axios({
+				method: 'GET',
+				url: '/broker/getSquareInfo',
+				responseType: 'json',
+				data: {
+					'AuthToken': _this.token,
+					'id': _this.articleId
+				}
+			})
+			.then(function(response) {
+				if(response.data.code == 200) {
+					let _news = response.data.data;
+					_this.articleTitle = _news.title;
+					_this.articleName = _news.name;
+					_this.articleSiteName = _news.site_name;
+					_this.articleDepartmentName = _news.district_lable_name;
+					_this.articleTime = _news.create_time;
+					_this.articleContent = _this.common.urlDeal(_news.content);
+				} else {
+					layer.tipsX(response.data.msg);
+				}
+			})
+			.catch(function(error) {
+				layer.tipsX(error);
+			});
+			//获取评论列表
+			_this.getCommentList();
+		},
+		methods: {
+			getCommentList() {
+				let _this = this;
+				_this.axios({
+					method: 'get',
+					url: '/broker/getSquareCommentList',
+					responseType: 'json',
+					data: {
+					    'AuthToken': _this.token,
+						'page_no': _this.page,
+						'page_size': _this.pageSize,
+						'square_id': _this.articleId
+					}
+				})
+				.then(function(response) {
+					if(response.data.code == 200) {
+						let _list = response.data.data.data;
+						if(Array.isArray(_list)){
+							if(_list.length === 0) {
+								_this.page === 1 && (_this.noDataFlag = true);
+								_this.isStop = true;
+							} else {
+								_this.commentDataList.push(..._list); //这里使用push要注意，先把数组展开
+								_list.length < _this.pageSize && (_this.isStop = true);
+								_this.page++;
+							};
+						};
+					} else {
+						layer.tipsX(response.data.msg);
+					}
+				})
+				.catch(function(error) {
+					layer.tipsX(error);
+				});
+			},
+			
+		
+		},
+		computed: {
+
+		}
+	}
+</script>
+
+<style scoped>
+	article,.list-commnet-area{
+		background-color: white;
+		padding: .3rem;
+	}
+	
+	/*而如果在组件中使用了v-html，要为myHtml中的标签添加CSS样式，我们需要在写样式的时候添加>>>：*/
+	.article-content-area >>> img{
+		width: 100%;
+		max-width: 6.9rem;
+	}
+	.article-content-area >>> iframe{
+		width: 100%;
+		max-width: 6.9rem;
+	}
+	.article-content-area >>> embed{
+		width: 100%;
+		max-width: 6.9rem;
+	}
+	.article-content-area >>> video{
+		width: 100%;
+		max-width: 6.9rem;
+	}
+	.article-bar>h1{
+		font-size: .4rem;
+		color: #1a1a1a;
+	}
+	.article-bar>p{
+		font-size: .3rem;
+		color: #999;
+	}
+	.article-bar+div{
+		padding-top: .3rem;
+	}
+	.list-commnet-area{
+		margin-top: .2rem;
+	}
+	.list-commnet-area>h2{
+		font-size: .32rem;
+		color: #1a1a1a;
+	}
+	
+	.comment-area-seat{
+		height: .98rem;
+	}
+	
+	/*按钮区域样式*/
+	.btn-comment-area{
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		height: .98rem;
+		border-top: 1px solid #ccc;
+		background-color: white;
+	}
+	.btn-comment-area>a{
+		height: .7rem;
+		width: 6.86rem;
+		border-radius: .35rem;
+		border: 1px solid #ccc;
+		color: #ccc;
+	}
+	.btn-comment-area>a>img{
+		width: .3rem;
+		padding-right: .6em;
+	}
+	
+	.txt-comment-area{
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		background-color: rgba(0, 0, 0, .3);
+		width: 100%;
+		height: 100%;
+	}
+	.mask-comment-area{
+		width: 100%;
+		height: 100%;
+	}
+	
+	/*评论输入框区域*/
+	.real-comment-area{
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		width: 100%;
+		height: 2.6rem;
+		background-color: #f4f4f4;
+	}
+	.real-comment-area>div:nth-of-type(1){
+		height: 1.8rem;
+	}
+	.real-comment-area>div:nth-of-type(1)>textarea{
+		width: 6.86rem;
+		height: 1.4rem;
+		border: 1px solid #e0e0e0;
+		border-radius: .1rem;
+		background-color: white;
+	}
+	.real-comment-area>div:nth-of-type(2){
+		padding: 0 .3rem;
+	}
+	.real-comment-area>div:nth-of-type(2)>a{
+		box-sizing: border-box;
+		width: 1.2rem;
+		height: .6rem;
+		border-radius: .1rem;
+		font-size: .28rem;
+		color: #999;
+		border: 1px solid #e0e0e0;
+	}
+	.real-comment-area>div:nth-of-type(2)>a:nth-of-type(2){
+		background-color: #FA903F;
+		color: white;
+	}
+	.real-comment-area>div:nth-of-type(2)>a:nth-of-type(3){
+		background-color: #999;
+		color: white;
+	}
+</style>
\ No newline at end of file

public/appnew/src/components/publicEg/entrance.vue

@@ -10,7 +10,7 @@
 
 <script>
 	let _token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjo1NzM5LCJuYW1lIjoiXHU2MDNiXHU2ZDRiXHU4YmQ1MSIsInBob25lIjoiMTU2MDE2NTIzNTMiLCJsZXZlbCI6MzB9LCJ0aW1lU3RhbXBfIjoxNTQxNTc2MzQ3fQ.csvXQnqzLdZ-dW3pVGosyPqbCPWPXyECncwD4dD6M6I';
-	let _token2 = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjo1NzM5LCJuYW1lIjoiXHU2MDNiXHU2ZDRiXHU4YmQ1MSIsInBob25lIjoiMTU2MDE2NTIzNTMiLCJsZXZlbCI6MzB9LCJ0aW1lU3RhbXBfIjoxNTMwNjA2ODU4fQ.8jL49CjtBMV6BqmaKdJfd4pkGBazrAgQQrutb53Z3mY';
+	let _token2 = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjo1Nzc1LCJuYW1lIjoiXHU2ZDRiXHU4YmQ1MiIsInBob25lIjoiMTU2MDE2NTIzNTIiLCJsZXZlbCI6MjB9LCJ0aW1lU3RhbXBfIjoxNTU1NDY3MDI0fQ.knCdHuqEZV2zKBmi8ESp0b1NX_245fEQPx7tS4QJ4oA';
 	export default {
 		name: '',
 		data() {
@@ -123,8 +123,18 @@
 					'query': {
 						'token': _token2
 					}
+				},
+				{
+					'path': '/openSquareDetails',
+					'nameCustom': '开盘广场详情',
+					'query': {
+						'token': _token2,
+						'id': 23
+						
+					}
 				}
 				
+				
 				]
 			}
 		},

public/appnew/src/router/index.js

@@ -23,6 +23,7 @@ import match from '@/components/match/match'
 import phoneDetail from '@/components/phoneDetail/phoneDetail'
 import inviteRules from '@/components/inviteRules/inviteRules'
 import search from '@/components/businessCollege/search'
+import openSquareDetails from '@/components/openSquareDetails/openSquareDetails'
 Vue.use(VueRouter)
 
 export default new VueRouter({
@@ -153,6 +154,10 @@ export default new VueRouter({
 			path: '/search',
 			name: 'v-search',
 			component: search
+		},{
+			path: '/openSquareDetails',
+			name: 'v-openSquareDetails',
+			component: openSquareDetails
 		}
 	]
-})
\ No newline at end of file
+})