bigDataApp/pages/expertDiagnosis/exchangeShare.vue

<template>
	<view>
		<view style="position: fixed;z-index: 100;">
			<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="交流圈">
				<image src="../../static/image/expertDiagnosis/tianjiawenjian.png" mode="" class="right_icon" @click="postmessage"></image>
			</uni-nav-bar>
		</view>
		<u-action-sheet :list="actionSheetList" v-model="post_show" @click="message"></u-action-sheet>
		<view class="invitations">
			<view class="invitations_item" v-for="(items,index) in invitation" :key="index" @click="particulars(items)">
				<view class="invitations_item_left">
					<image :src="items.img_urls" mode="" v-if="items.img_urls!='' && items.img_urls!=null"></image>
					<image :src="$imghost+defaultimg" mode="" v-else></image>
				</view>
				<view class="invitations_item_right">
					<view class="invitations_item_right_top">
						<image src="../../static/image/expertDiagnosis/6940a11a251770f1b0d8b7b10ebdf9b.png" mode="" v-if="Number(items.heat) == 1"></image>
						<span>{{items.title}}</span>
					</view>
					<view class="invitations_item_right_contert" v-html="items.content">
					</view>
					<view class="invitations_item_right_bot">
						<image src="../../static/image/expertDiagnosis/d2014837228702eeceb762bc5302b3f.png" mode=""></image>
						<span>{{items.username}}</span>
						<p>查看详情</p>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				// pest.pests.pests_heat_rank
				invitation: [],
				actionSheetList:[{
					text:"我的发帖"
				},{
					text:"我要发帖"
				}],
				post_show:false,
				defaultimg: '/images/expertDiagnosis/img01.png'
			}
		},
		methods: {
			async getInvitation() {//获取问题
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=pest.pests.pests_heat_rank',
				})
				this.invitation = res.data
				for (var i = 0; i < this.invitation.length; i++) {
					var index1 = this.invitation[i].content.indexOf("/>") + 2
					var index2 = this.invitation[i].content.indexOf('<img')
					var str = this.invitation[i].content.slice(index2, index1)
					this.invitation[i].content = this.invitation[i].content.replace(str, '')
				}
				console.log(this.invitation)
			},
			async getInvitationMy(str) {//获取自己的发帖
				const res = await this.$myRequest({
					url: '/api/api_gateway?method=pest.pests.pests_answers_list',
					data:{
						screen:str
					}
				})
				this.invitation = res.data
				for (var i = 0; i < this.invitation.length; i++) {
					var index1 = this.invitation[i].content.indexOf("/>") + 2
					var index2 = this.invitation[i].content.indexOf('<img')
					var str = this.invitation[i].content.slice(index2, index1)
					this.invitation[i].content = this.invitation[i].content.replace(str, '')
				}
				console.log(this.invitation)
			},
			clickLeft() {
				uni.navigateTo({
					url: 'index'
				})
			},
			particulars(items){//详情页
				uni.navigateTo({
					url:"particulars?items="+JSON.stringify(items)
				})
			},
			postmessage(){//发帖
				this.post_show=true
			},
			message(index){
				if(this.actionSheetList[index].text.includes("我要发帖")){
					uni.navigateTo({
						url:"./postmessage"
					})
				}else if(this.actionSheetList[index].text.includes("我的发帖")){
					this.actionSheetList[index].text="全部发帖"
					this.getInvitationMy("my")
				}else if(this.actionSheetList[index].text.includes("全部发帖")){
					this.getInvitation()
				}
			}
		},
		onLoad() {
			this.getInvitation()
		}
	}
</script>

<style lang="scss">
	.right_icon {
		width: 40rpx;
		height: 40rpx;
		position: absolute;
		top: 26rpx;
		right: 26rpx;
	}

	.invitations {
		width: 100%;
		position: relative;
		top: 88rpx;

		.invitations_item {
			width: 90%;
			margin: 0 auto;
			display: flex;
			justify-content: space-between;
			padding: 30rpx 0;

			.invitations_item_left {
				width: 26%;

				image {
					width: 100%;
					height: 180rpx;
				}
			}

			.invitations_item_right {
				width: 71%;
				position: relative;

				.invitations_item_right_top {
					width: 100%;

					image {
						width: 32rpx;
						height: 32rpx;
						margin: 0 16rpx 0 0;
						vertical-align: text-bottom;
					}

					span {
						font-weight: 700;
					}
				}

				.invitations_item_right_contert {
					width: 100%;
					margin: 10rpx 0;
					overflow: hidden;
					-webkit-line-clamp: 2;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-box-orient: vertical;
				}

				.invitations_item_right_bot {
					display: flex;
					position: absolute;
					bottom: 12rpx;
					height: 50rpx;
					width: 100%;

					image {
						width: 50rpx;
						height: 50rpx;
						position: absolute;
					}

					span {
						color: #B9B9B9;
						margin-left: 74rpx;
						line-height: 50rpx;
					}

					p {
						width: 100rpx;
						height: 40rpx;
						font-size: 24rpx;
						border: 2rpx solid #5FAE50;
						line-height: 40rpx;
						padding: 0 10rpx;
						position: absolute;
						right: 0;
						top: 6rpx;
						color: #5FAE50;
					}
				}
			}
		}
	}
</style>