jkzdzx_wjwapp/pages/index/index.vue

<template>
	<view class="container" style="background-color: #fff;">
		<view style="height: 100rpx;">
			<u-tabs :list="lmlist" :current="current" @click="click">
				<view slot="right" style="padding-left: 4px;padding-right: 10px" @click="more">
					<u-icon name="list" size="21" bold></u-icon>
				</view>
			</u-tabs>
		</view>
		<view style="height: 400rpx;">
			<u-swiper height="400rpx" :list="lbList" keyName="imgUrl" showTitle indicator indicatorMode="line"
				@click="info"></u-swiper>
		</view>
		<view style="height:calc(100vh - 502rpx);">
			<swiper style="height: 100%;background-color:#F3F4F6 ;" :current="current"
				@animationfinish="animationfinish">
				<swiper-item v-for="(v,i) in lmlist" :key="i">
					<scroll-view scroll-y style="width: 100%;height: 100%;overflow: auto;box-sizing: border-box;"
						lower-threshold="10" :refresher-enabled="v.xlList1" :refresher-triggered="v.xlList2"
						@scrolltolower="lower(i)" @refresherrefresh="refresherrefresh(i)"
						@refresherrestore="refresherrestore(i)">
						<view>
							<view v-for="(item,index) in v.list" :key="index"
								style="padding: 20rpx 40rpx;border-bottom: 1px solid #eaeaea;background-color: #fff;"
								@click="getinfo(item)">
								<view>
									<u--text :lines="2" size="32rpx" :text="item.title"></u--text>
								</view>
								<view
									style="display: flex;justify-content: flex-end;margin-top: 20rpx;color:#909399;font-size: 28rpx;">
									{{showtime($u.timeFormat(item.publishTime, 'yyyy-mm-dd'))}}
								</view>
							</view>
							<view style="padding: 10rpx 0;" v-if="v.list.length > 0">
								<u-loadmore :status="v.statusList" />
							</view>
							<view v-if="v.list.length == 0">
								<u-empty mode="list" icon="/static/list.png" text="暂无内容" textSize="30rpx"></u-empty>
							</view>
						</view>
					</scroll-view>
				</swiper-item>
			</swiper>
		</view>
		<u-popup :show="lmshow" mode="bottom" closeable @close="saveLmOrder" @open="lmOpen">
			<view style="height: 90vh;padding-top: 20px;box-sizing: border-box;">
				<view>
					<view style="padding: 0 20rpx;font-weight: bold">
						我的订阅
					</view>
					<dragSort ref="dy" :list.sync="lmlist" label="name" :columnNum="4" :columnSpace="20" :rowHeight="60"
						:rowSpace="20" @shanchu="del" @complete="wancheng"></dragSort>
					<view style="padding: 0 20rpx;font-weight: bold;margin-top: 40rpx;">
						未订阅
					</view>
					<view style="display: flex;flex-wrap: wrap;padding-top: 20rpx;">
						<view style="width: 25%;padding: 10rpx;box-sizing: border-box;" v-for="(v,i) in wgzlm" :key="i">
							<view class="shake"
								style="padding: 10rpx;border: 1px solid #ccc;text-align: center;border-radius: 20rpx;font-size: 14px;"
								@click="guanzhu(v,i)">
								{{v.columnName}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		showtime
	} from "@/utils/wjw.js"
	import dragSort from '@/components/dragSort/dragSort.vue'
	export default {
		data() {
			return {
				//新闻列表
				list: [],
				//栏目列表
				lmlist: [],
				//当前tabs索引
				current: 0,
				//新闻分页列表
				fyList: [],
				//总页数列表
				totalList: [],
				//分页状态列表
				statusList: [],
				//下拉刷新列表
				xlList1: [],
				xlList2: [],
				//轮播图列表
				lbList: [],
				showtime: showtime,
				lmshow: false,
				//所有栏目列表
				allList: [],
				//未关注栏目
				wgzlm: [],
				//是否保存栏目
				save: false
			}
		},
		onLoad() {
			this.getLmList()
			this.getLbList()
			// this.getAllList()
			this.getwgzlm()
			this.needUpdateApp()
		},
		onShow() {
			this.getUnreadEmail()
			this.getdbNum()
		},
		methods: {
			wancheng(e) {
				if (e == 'finish') {
					let list = []
					if (this.lmlist.length != 0) {
						this.lmlist[this.current].xlList1 = true
						if (this.lmlist[this.current].list == 0) {
							this.refresherrefresh(this.current)
						}
						this.lmlist.forEach(item => {
							let obj = {
								name: item.name,
								id: item.id,
								columnCode: item.columnCode
							}
							list.push(obj);
						})
					}
					uni.$u.http.post('/oa/column/saveFollowCoulumn', list).then(res => {
						this.save = true
					})
				}
			},
			del(e) {
				// uni.$u.http.delete('/system/subscribed/remove/'+e.data.id).then(res=>{
				this.getwgzlm()
				if (this.current > e.index) {
					this.current = this.current - 1
					// this.lmlist[this.current].totalList = 0
					// this.lmlist[this.current].totalList = 'loadmore'
					// this.lmlist[this.current].pageSize = 10
					// this.lmlist[this.current].pageNum = 1
					// this.lmlist[this.current].xlList1 = true
					// this.lmlist[this.current].xlList2= true
					// this.getNewsList()
				} else if (this.current == 0 && e.index == 0) {
					this.lmlist[0].xlList1 = true
					// this.lmlist[0].xlList2= true
					this.refresherrefresh(0)
				}
				// })

			},
			lmOpen() {
				this.lmlist[this.current].xlList1 = false
				this.$forceUpdate()
			},
			//点击更多
			more() {
				this.lmshow = true
			},
			//获取未读邮件
			getUnreadEmail() {
				uni.$u.http.get('/oa/mail/count/unread').then(res => {
					if (res == 0) {
						uni.removeTabBarBadge({ //显示数字
							index: 2, //tabbar下标
						})
					} else {
						uni.setTabBarBadge({ //显示数字
							index: 2, //tabbar下标
							text: '' + res + '' //数字
						})
					}
				})
			},
			//获取所有栏目
			getAllList() {
				uni.$u.http.get('/oa/column/app/homePage').then(res => {
					this.allList = res
				})
			},
			//获取栏目列表
			getLmList() {
				let that = this
				uni.$u.http.get('/oa/column/app/wgzd').then(res => {
					console.log('55', res)
					if (res.length == undefined || res.length == 0) {
						// this.lmlist.push(this.wgzlm[0])
						// this.wgzlm = this.wgzlm.splice(1)
						uni.$u.http.post('/system/subscribed', {
							userId: uni.getStorageSync('userInfo').userId,
							columnId: this.wgzlm[0].id
						}).then(res => {
							let obj = this.wgzlm[0]
							obj.list = []
							obj.totalList = 0
							obj.totalList = 'loadmore'
							obj.pageSize = 10
							obj.pageNum = 1
							obj.xlList1 = false
							obj.xlList2 = true
							this.lmlist.push(obj)
							if (this.lmlist.length == 1) {
								this.lower(0)
							}
							// this.getwgzlm()
							this.$forceUpdate()
							// this.allList[i].isFollow = '1'
							uni.$u.http.get("/oa/column/app/notFollow").then(res => {
								// console.log(res)
								uni.hideLoading()
								// uni.showToast({
								// 	title: "订阅成功"
								// })
								this.wgzlm = res

							})

						}).catch((error) => {
							uni.showToast({
								title: "取消失败",
								icon: 'none'
							})

						})
					} else {
						this.lmlist = res
					}
					for (let i in this.lmlist) {
						this.lmlist[i].list = []
						this.lmlist[i].totalList = 0
						this.lmlist[i].totalList = 'loadmore'
						this.lmlist[i].pageSize = 30
						this.lmlist[i].pageNum = 1
						if (i == 0) {
							this.lmlist[i].xlList1 = true
							this.lmlist[i].xlList2 = true
							uni.showLoading({
								title: "加载中...",
							})
							setTimeout(() => {
								this.getNewsList()
							}, 1000)
						} else {
							this.lmlist[i].xlList1 = false
							this.lmlist[i].xlList2 = true
						}
					}
				}).catch(error => {
					uni.hideLoading()
				})
			},
			//获取新闻列表
			getNewsList() {
				// uni.hideLoading()
				uni.$u.http.get("/oa/article/listByColumnId", {
					params: {
						pageSize: this.lmlist[this.current].pageSize,
						pageNum: this.lmlist[this.current].pageNum,
						columnId: this.lmlist[this.current].id,
						status: 1
					},
					header: {
						'content-Type': 'application/x-www-form-urlencoded'
					}
				}).then(res => {
					uni.hideLoading()
					this.lmlist[this.current].list = [...this.lmlist[this.current].list, ...res.rows]
					this.$forceUpdate()
					if (res.total <= this.lmlist[this.current].pageSize) {
						this.lmlist[this.current].statusList = "nomore"
					} else {
						this.lmlist[this.current].statusList = "loadmore"
					}
					if (this.lmlist[this.current].pageNum == 1) {
						this.lmlist[this.current].totalList = Math.ceil(res.total / this.lmlist[this.current]
							.pageSize)
					}
					this.$forceUpdate()
				}).catch(error => {
					uni.hideLoading()
				})
			},
			//关注栏目
			guanzhu(v, i) {
				// console.log(v)
				uni.showLoading({
					title: "请稍等...",
					mask: true
				})
				uni.$u.http.post('/system/subscribed', {
					userId: uni.getStorageSync('userInfo').userId,
					columnId: v.id
				}).then(res => {
					let obj = v
					obj.list = []
					obj.totalList = 0
					obj.totalList = 'loadmore'
					obj.pageSize = 10
					obj.pageNum = 1
					obj.xlList1 = false
					obj.xlList2 = true
					this.lmlist.push(obj)
					if (this.lmlist.length == 1) {
						this.lower(0)
					}
					// this.getwgzlm()
					this.$forceUpdate()
					// this.allList[i].isFollow = '1'
					uni.$u.http.get("/oa/column/app/notFollow").then(res => {
						// console.log(res)
						uni.hideLoading()
						uni.showToast({
							title: "订阅成功"
						})
						this.wgzlm = res

					})

				}).catch((error) => {
					uni.showToast({
						title: "取消失败",
						icon: 'none'
					})

				})

			},
			//tabs点击
			click(e) {
				let qwe = this.current
				this.lmlist[qwe].xlList1 = false
				this.current = e.index
				this.lmlist[this.current].xlList1 = true
			},
			animationfinish(e) {
				console.log('animationfinish', e)
				let qwe = this.current
				this.lmlist[qwe].xlList1 = false
				this.current = e.detail.current;
				this.lmlist[this.current].xlList1 = true
				if (this.lmlist[this.current].list.length == 0) {
					uni.showLoading({
						title: "加载中...",
					})
					this.getNewsList()
				}
			},
			//触底加载
			lower(e) {
				if (this.lmlist[e].pageNum != this.lmlist[e].totalList) {
					this.lmlist[e].pageNum++
					this.getNewsList()
				} else {
					this.lmlist[e].statusList = "nomore"
					this.$forceUpdate()
				}
			},
			//下拉刷新
			refresherrefresh(e) {
				this.lmlist[e].xlList2 = true
				this.lmlist[e].pageNum = 1
				this.lmlist[e].list = []
				let a = new Promise((resolve, reject) => {
					uni.$u.http.get("/oa/article/listByColumnId", {
						params: {
							pageSize: this.lmlist[e].pageSize,
							pageNum: this.lmlist[e].pageNum,
							columnId: this.lmlist[e].id,
							status: 1
						},
						header: {
							'content-Type': 'application/x-www-form-urlencoded'
						}
					}).then(res => {
						uni.hideLoading()
						this.lmlist[e].list = [...this.lmlist[e].list, ...res.rows]
						// this.$forceUpdate()
						if (res.total <= this.lmlist[e].pageSize) {
							this.lmlist[e].statusList = "nomore"
						} else {
							this.lmlist[e].statusList = "loadmore"
						}
						if (this.lmlist[e].pageNum == 1) {
							this.lmlist[e].totalList = Math.ceil(res.total / this.lmlist[e].pageSize)
						}
						this.$forceUpdate()
						resolve('1')
					}).catch(error => {
						uni.hideLoading()
						resolve('2')
					})
				})
				a.then(res => {
					setTimeout(() => {
						this.lmlist[e].xlList2 = false
						this.$forceUpdate()
					}, 500)
				})
				// setTimeout(() => {
				// 	// this.$forceUpdate()
				// }, 2000)

			},
			refresherrestore(e) {

			},
			//查询轮播图列表
			getLbList() {
				uni.$u.http.get('/oa/article/listHome?isCarousel=1&pageNum=1&pageSize=100').then(res => {
					this.lbList = res.rows
					for (let i in res.rows) {
						this.lbList[i].imgUrl = getApp().globalData.saveUrl + res.rows[i].imgUrl.split('/zdzx/')[1]
						console.log(this.lbList[i].imgUrl)
					}
				})
			},
			//查看轮播详细信息
			info(e) {
				if (this.lbList[e].urlLink == null) {
					uni.navigateTo({
						url: "/pages/newsContent/newsContent?id=" + this.lbList[e].id
					})
				} else {
					uni.navigateTo({
						url: "/pages/webView/webView?url=" + this.lbList[e].urlLink
					})
				}

			},
			//查看文章详情
			getinfo(item) {
				if (item.urlLink != null) {
					uni.navigateTo({
						url: "/pages/webView/webView?url=" + item.urlLink
					})
				} else {
					uni.navigateTo({
						url: "/pages/newsContent/newsContent?id=" + item.id
					})
				}

			},
			//获取关注栏目
			getwgzlm() {
				uni.$u.http.get("/oa/column/app/notFollow").then(res => {
					// console.log(res)
					this.wgzlm = res
				})
			},
			//查询待办数量
			getdbNum() {
				uni.$u.http.get('/jflow/restful/DB_Todolist_Num?token=' + uni.getStorageSync('jtoken')).then(res => {
					if (res.code == 200) {
						if (res.list.length > 0) {
							let qwe = 0
							for (let i in res.list) {
								if (res.list[i].FK_Flow != '008' && res.list[i].FK_Flow != '009') {
									qwe = res.list[i].Total + qwe
								}
								if (i == res.list.length - 1) {
									uni.setTabBarBadge({ //显示数字
										index: 1, //tabbar下标
										text: '' + qwe + '' //数字
									})
								}
							}
						} else {
							uni.removeTabBarBadge({ //显示数字
								index: 1, //tabbar下标
							})
						}
					}

				})
			},
			//保存栏目顺序
			saveLmOrder() {
				if (this.save == true) {
					this.save = false
					this.lmshow = false
				} else {
					if (this.$refs.dy.cacheList.length != 0) {
						this.$refs.dy.toggleEdit('cancel')
						this.lmlist[this.current].xlList1 = true
					}
					this.lmshow = false
				}

			},
			//升级 
			needUpdateApp(i) {
				var _this = this;
				plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) {
					uni.showLoading({
						title: "检查中...",
						mask: true
					})
					uni.$u.http.post('/app/version/advance/' + wgtinfo.versionCode).then(res => {
						if (res.code == 200) {
							if (res.data != undefined) {
								uni.hideLoading()
								uni.showModal({
									title: "提示",
									content: "有新版本是否进行更新",
									success(qwe) {

										if (qwe.confirm) {
											_this.upgradeApp(getApp().globalData.updateUrl + res
												.data.url)
										}
									}
								})
							} else {
								uni.hideLoading()
								// uni.showToast({
								// 	title: "当前为最新版本",
								// 	icon: "none"
								// })
							}
						}
					}).catch(res => {
						uni.hideLoading()
					})
				})
			},
			upgradeApp(url) {
				uni.showLoading({
					title: '更新中……'
				});
				uni.downloadFile({
					url: url,
					success: downloadResult => {
						if (downloadResult.statusCode === 200) {
							try {
								var filePath = downloadResult.tempFilePath;
								var ext = filePath.substring(
									filePath.lastIndexOf('.') + 1
								);
								plus.runtime.install(
									downloadResult.tempFilePath, {},
									function() {
										uni.hideLoading()
										plus.runtime.restart();
									},
									function(e) {
										// console.log(e);
									}
								);
							} catch (e) {
								// console.log(e);
							}
						} else {
							uni.hideLoading()
							uni.showToast({
								title: "下载失败",
								icon: 'none'
							})
						}
					},
					fail: res => {

					}
				});
			},

		}
	}
</script>

<style lang="scss" scoped>
	.choose {
		border: 1px solid #409EFF !important;
		color: #409EFF;
		font-weight: bold;
	}

	.is-ellipsis {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.dragSort-wrap {}

	.dragSortBox {
		padding: 20rpx;
	}

	.dragSortBox-btns {
		padding: 20rpx;
		margin-bottom: 20rpx;
		text-align: right;
		color: red;
	}

	.dragSortBox-btn {
		margin-left: 20rpx;
	}

	.dragSort-area {
		width: 100%;
		/* background-color: skyblue; */
	}

	.dragSort-view {
		/* background-color: pink; */
		background-color: #eee;
		text-align: center;
	}

	.dragSort-view.is-touched {
		opacity: .9;
	}

	.dragSort-view__con {
		position: relative;
		height: 100%;
	}

	.dragSort-view__label {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		max-width: 100%;
	}

	.dragSort-view__btn-del {
		position: absolute;
		right: 0;
		top: 0;
		transform: translate(50%, -50%);
	}
</style>