sooka_consult_uniapp/pages/fuwu/fuwu.vue

<template>
    <!-- pages/me.wxml -->
	<view class="container">
		<view style="width: 100%;display: flex;">
			<uni-search-bar  :focus="true" v-model="searchValue"  @input="search"
				style="width: 70%;"
				@cancel="cancel">
			</uni-search-bar>
			  <uni-data-select
				  style="width: 30%;margin: auto;"
				  v-model="value"
				  placeholder="请选择排序"
				  :localdata="range"
				  @change="getList(value)"
			></uni-data-select>
		</view>
	    <view class="rnwdList">
	        <view class="list" @tap.stop="goDetails(item)" v-for="(item, index1) in qbwd" :key="index1">
				<span v-if="item.top == 1" style="color: red;">[置顶]</span>
	            <span class="listTitle">{{ item.titleName }}</span>
	
	            <view class="onePic" v-if="item.top != 1  ? item.urls.length == 1 : false ">
	                <image :src="loadImgSrcLocalhost(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
					</image>
	            </view>
	            <view class="twoPic" v-if="item.top != 1 ? item.urls.length == 2 : false">
	                <image :src="loadImgSrcLocalhost(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
					</image>
	            </view>
	
	            <view class="threePic" v-if="item.top != 1 ? item.urls.length == 3 : false">
	                <image :src="loadImgSrcLocalhost(item.urls[index2])" v-for="(v, index2) in item.urls" :key="index2">
					</image>
	            </view>
	
	           <view class="jlSj">
	                <span class="jf">
	                   {{ item.updateTime || item.createTime }}
	                    <!-- <em class="iconfont icon-jifen"></em> -->
	                </span>
	                <view class="ck">
	                    <!-- <span>
	                        <em class="iconfont icon-pinglun"></em>
	                        {{ item.pl }}
	                    </span> -->
	                    <span>
	                        <em class="iconfont icon-chakan"></em>
	                        {{ item.watchNum }}
	                    </span>
	                    <span :class=" favoriteList.includes(item.id) ? 'favorite' : 'not-favorite' ">
	                        <em class="iconfont icon-shoucang" @click.stop="addFavorite(item)"></em>
	                        {{ currentFavoriteCount(item) }}
	                    </span>
	                </view>
	            </view>
	
			</view>
	    </view>
		<!-- 新增资讯按钮 -->
		<!-- <button class="addInfomarionBtn" @click="addInfomation()"></button> -->
	</view>
</template>

<script>
import { listWxs ,listWx,likeServer} from '@/api/information/information.js'
// pages/me.js
export default {
    data() {
        return {
			qbwd:[],
			listParams:{
			  pageNum: 1,
			  pageSize: 7,
			  titleName: '',
			  type: 12,
			  flag:'',
			  isTop:0
			},
			topList:[],
			total:0,
			searchValue:'',
			favoriteList:[],
			value: 1,
			range: [
				{ value: 'watch', text: "热度" },
				{ value: 'like', text: "点赞" },
				{ value: '', text: "最新" },
			],
		};
    },
	created(){
		// 查置顶
		listWx({
			type:12,
			isTop:1
		}).then(e => {
			this.topList = e.data
			this.qbwd = this.topList
			this.getList()
		})
	},
	// 下拉刷新
	onPullDownRefresh() {
		setTimeout(() => {
			this.listParams.pageNum = 1;
			this.qbwd = [];
			let result = this.getList(this.listParams.flag,'刷新')
		},500)
	},
	// 上拉加载
	onReachBottom(){
		let pageNum = this.listParams.pageNum
		let pageSize = this.listParams.pageSize
		let total = this.total
		if(pageNum * pageSize >= total){
			uni.showToast({
				title:'暂无更多数据'
			})
			return
		} else {
			this.listParams.pageNum += 1;
			this.getList()
		}
	},
	methods:{
		currentFavoriteCount(e){
			if(this.favoriteList.includes(e.id)){
				return e.likeNum + 1
			} else {
				return e.likeNum
			}
		},
		addFavorite(e){
			if(this.favoriteList.includes(e.id)) return
			likeServer({
				id:e.id,
				type:12
			}).then(e => {
			})
			this.favoriteList.push(e.id)
			return
			if(this.favoriteList.includes(e.id)){
				// 取消点赞
				likeServer({
					id:e.id,
					type:12
				})
				let deleteIdx = this.favoriteList.findIndex((v => v == e.id))
				this.favoriteList.splice(deleteIdx,1)
			} else {
				likeServer({
					id:e.id,
					type:12
				})
				this.favoriteList.push(e.id)
			}
		},
		cancel(){
			this.listParams.titleName = ''
		},
		search(){
			this.listParams.titleName = this.searchValue
			this.getList()
		},
		getList(val = null,toastVal = '加载'){
			this.listParams.flag = val || ''
			this.qbwd = this.topList
			listWxs(this.listParams).then(res => {
				this.qbwd = [...this.qbwd,...res.rows]
				this.total = res.total
				uni.showToast({
					title:`${toastVal}成功`
				})
			})
		},
		goDetails(e) {
			let id = e.id || ''
			let type = 12
		    uni.navigateTo({
		        url: `../informationDetail/informationDetail?id=${id}&type=${type}`
		    });
		},
		// 新增资讯
		addInfomation(){
			uni.navigateTo({
			    url: `../informationAdd/informationAdd`
			});
		}
	},
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
};
</script>
<style lang="scss">
@import './fuwu.css';
.container{
	height: 100%;
	content: '\e633';
}
.favorite{
	.icon-shoucang:before{
		color: red;
	}
}
.not-favorite{
	
}
</style>