<template>
	<view class="zxbox">
		<view class="navbox">
			<uni-nav-bar color="#ffffff" @clickRight="getNewsFn" :background-color="backgroundColor" :border="false"
				statusBar='true' fixed="true">
				<block slot="right">
					<view class="topr">
						<image :src="noticimg"></image>
						<view class="cir"></view>
					</view>
				</block>
			</uni-nav-bar>
		</view>
		<image :src="bgimg" class="bgimg"></image>
		<view class="mbox">
			<view class="infobox flexc" @click="handleToInfo">
				<image v-if="avatar" @click.stop="handleToAvatar" :src="avatar" class="limg" mode="aspectFill"></image>
				<image v-else @click.stop="handleToAvatar" :src="avatarimg" class="limg" mode="aspectFill"></image>
				<view class="cbox">
					<view class="tit">{{name?name:'登录账号'}}</view>
					<view class="txt">Hi,欢迎登陆潜山智慧政协平台</view>
				</view>
				<image :src="wrimg" class="rimg"></image>
			</view>
			<view class="conts flexcj">
				<view class="clist">
					<image :src="mconta"></image>
					<view class="num">31</view>
					<view class="tit">审查中<text>/件</text></view>
				</view>
				<view class="clist">
					<image :src="mcontb"></image>
					<view class="num">31</view>
					<view class="tit">交办中<text>/件</text></view>
				</view>
				<view class="clist">
					<image :src="mcontc"></image>
					<view class="num">31</view>
					<view class="tit">办理中<text>/件</text></view>
				</view>
				<view class="clist">
					<image :src="mcontd"></image>
					<view class="num">31</view>
					<view class="tit">办结中<text>/件</text></view>
				</view>
			</view>
			<view class="mbgbox">
				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimga" class="imga"></image>
					</view>
					<view class="tit flex1">发布通知</view>
					<image :src="rimg" class="rimg"></image>
				</view>
				<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimgb" class="imgb"></image>
					</view>
					<view class="tit flex1">创建会议</view>
					<image :src="rimg" class="rimg"></image>
				</view>
			</view>
			<view class="mbgbox">
				<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimgc" class="imgc"></image>
					</view>
					<view class="tit flex1">政协提案</view>
					<image :src="rimg" class="rimg"></image>
				</view>
				<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimgd" class="imgc"></image>
					</view>
					<view class="tit flex1">社情民意</view>
					<image :src="rimg" class="rimg"></image>
				</view>
				<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimge" class="imgc"></image>
					</view>
					<view class="tit flex1">履职信息</view>
					<image :src="rimg" class="rimg"></image>
				</view>
				<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
					<view class="limg">
						<image :src="listimgf" class="imgc"></image>
					</view>
					<view class="tit flex1">会议活动</view>
					<image :src="rimg" class="rimg"></image>
				</view>
			</view>
			<view class="mbgbox">
				<view class="flexc mine_list" @click="handleUpassword">
					<view class="limg">
						<image :src="listimgg" class="imgc"></image>
					</view>
					<view class="tit flex1">修改密码</view>
					<image :src="rimg" class="rimg"></image>
				</view>
				<view class="flexc mine_list"@click="onlineWgt">
					<view class="limg">
						<image :src="listimgh" class="imgc"></image>
					</view>
					<view class="tit flex1">版本号</view>
					 <view  class="txt">{{wgtcode}}</view>

				</view>
				<view class="flexc mine_list" @click="handleLogout">
					<view class="limg">
						<image :src="listimgi" class="imgc"></image>
					</view>
					<view class="tit flex1">退出登录</view>
					<image :src="rimg" class="rimg"></image>
				</view>
			</view>
		</view>
		<view class="ztit">安徽中新云计算有限公司提供支持</view>
		<!-- <view class="header-section" style="display: none;">
      <view class="flex padding justify-between">
        <view class="flex align-center">
          <view v-if="!avatar" class="cu-avatar xl round bg-white">
            <view class="iconfont icon-people text-gray icon"></view>
          </view>
          <image v-if="avatar" @click="handleToAvatar" :src="avatar" class="cu-avatar xl round" mode="widthFix">
          </image>
          <view v-if="!name" @click="handleToLogin" class="login-tip">
            点击登录
          </view>
          <view v-if="name" @click="handleToInfo" class="user-info">
            <view class="u_title">
              用户名：{{ name }}
            </view>
          </view>
        </view>
        <view @click="handleToInfo" class="flex align-center">
          <text>个人信息</text>
          <view class="iconfont icon-right"></view>
        </view>
      </view>
    </view> -->

		<!-- <view class="content-section" style="display: none;">
      <view class="mine-actions grid col-4 text-center">
        <view class="action-item" @click="handleJiaoLiuQun">
          <view class="iconfont icon-friendfill text-pink icon"></view>
          <text class="text">交流群</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-service text-blue icon"></view>
          <text class="text">在线客服</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-community text-mauve icon"></view>
          <text class="text">反馈社区</text>
        </view>
        <view class="action-item" @click="handleBuilding">
          <view class="iconfont icon-dianzan text-green icon"></view>
          <text class="text">点赞我们</text>
        </view>
      </view>
    </view> -->
		<!-- <view class="flex0"></view> -->
		<footers v-if="isfootflag" :footlist="footlist" :footerindex="footerindex" :color_checked="color_checked"
			:color_nochecked="color_nochecked" :isHomeIndex="false"></footers>


	</view>
</template>

<script>
	import storage from '@/utils/storage'
	import footers from '@/components/footer/footer.vue'
	// import {getNoticenumber} from "@/api/work/index.js"
	import {updateUserProfile,findVersion} from "@/api/system/user.js"
	import {checkPermi,checkRole} from "@/utils/permission"; // 权限判断函数
	import config from '@/config'
	const baseUrl = config.baseUrl
	export default {
		data() {
			return {
				bgimg: require("@/static/images/bg.png"),
				avatarimg:require("@/static/images/mine/header.png"),
				noticimg: require("@/static/images/home/notice.png"),
				mconta:require("@/static/images/mine/mconta.png"),
				mcontb:require("@/static/images/mine/mcontb.png"),
				mcontc:require("@/static/images/mine/mcontc.png"),
				mcontd:require("@/static/images/mine/mcontd.png"),
				
				listimga: require('@/static/images/mine/minea.png'),
				listimgb: require('@/static/images/mine/mineb.png'),
				listimgc: require('@/static/images/mine/minec.png'),
				listimgd: require('@/static/images/mine/mined.png'),
				listimge: require('@/static/images/mine/minee.png'),
				listimgf: require('@/static/images/mine/minef.png'),
				listimgg: require('@/static/images/mine/mineg.png'),
				listimgh: require('@/static/images/mine/mineh.png'),
				listimgi: require('@/static/images/mine/minei.png'),
				

				rimg:require("@/static/images/mine/rimg.png"),
				wrimg:require("@/static/images/mine/wrimgs.png"),
				border: false,
				backgroundColor: 'transparent',

				name: this.$store.state.user.name,
				// version: getApp().globalData.config.appInfo.version,
				footlist: [{
						module: 'home',
						title: '潜山政协',
						icon_checked: require('@/static/images/tabbar/home_.png'),
						icon_nochecked: require('@/static/images/tabbar/home.png')
					},
					{
						module: 'report',
						title: '履职报告',
						icon_checked: require('@/static/images/tabbar/report_.png'),
						icon_nochecked: require('@/static/images/tabbar/report.png')
					},
					{
						module: 'notice',
						title: '会议通知',
						icon_checked: require('@/static/images/tabbar/notice_.png'),
						icon_nochecked: require('@/static/images/tabbar/notice.png')
					},
					{
						module: 'mine',
						title: '个人中心',
						icon_checked: require('@/static/images/tabbar/mine_.png'),
						icon_nochecked: require('@/static/images/tabbar/mine.png')
					},
				],
				color_checked: '222327',
				color_nochecked: 'AAAAAA',
				footerindex: 'mine',
				isfootflag: true,
				noticenum: 0,
				deptId: this.$store.state.user.deptId,
				wgtcode: this.$store.state.user.wgtcode,
				platform: 'Android',
				nvaHeight:44,
			}
		},
		components: {
			footers
		},
		computed: {
			avatar() {
				return this.$store.state.user.avatar
			},
			windowHeight() {
				return uni.getSystemInfoSync().windowHeight - 50
			}
		},
		onPageScroll(e) {
			var scrollTop = Number(e.scrollTop);
			var listTop=Number(this.listTop)-Number(this.nvaHeight)
			if (scrollTop <=this.nvaHeight) {
				const opacity = scrollTop / 100 // 计算透明度值
				const color = `rgba(29, 100, 226, ${opacity})`
				this.backgroundColor = color // 更新盒子背景颜色
			} else {
				this.backgroundColor = '#1D64E2'
			}
			// if(scrollTop>listTop){
			// 	this.fixedflag=true
			// }else{
			// 	this.fixedflag=false
			// }
		},
		onLoad() {
			this.nvaHeight=uni.getSystemInfoSync().statusBarHeight+44;
			if (checkPermi(['system:notice:number'])) {
				this.getNoticenumber()
			}
		},
		methods: {
			checkPermi,
			checkRole,
			// 修改密码
			handleUpassword(){
				this.$tab.navigateTo(`/pages/mine/pwd/index`)  
			},
			// 账号信息
			handleToInfo() {
				this.$tab.navigateTo('/pages/mine/info/index')
			},
			//消息
			getNewsFn() {
				this.$tab.navigateTo('/work/pages/news/list')
				// if (checkPermi(['system:notice:list'])) {
				// 	this.$tab.navigateTo('/pages/work/message')
				// }
			},
			handleToAddNews(){
				this.$tab.navigateTo('/work/pages/news/add')
			},
			handleToLogin() {
				this.$tab.reLaunch('/pages/login')
			},
			handleToAvatar() {
				this.$tab.navigateTo('/pages/mine/avatar/index')
			},
			handleLogout() {
				this.$modal.confirm('确定注销并退出系统吗？').then(() => {
					this.$store.dispatch('LogOut').then(() => {
						this.$tab.reLaunch('/pages/index')
					})
				})
			},
			onlineWgt() {
				let that = this;
				plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {
					that.$store.dispatch('SetwgtFn', widgetInfo.version).then(() => {})
					that.comparisonVersionNo(widgetInfo.versionCode);
				});
				// that.comparisonVersionNo()
			},
			comparisonVersionNo(versionCode) {
				let that = this;
				// console.log("aaaaaaa===versionCode", versionCode);
				const parmas = {
					model: that.platform
				}
				findVersion(parmas).then(res => {
					if (res.code == "200") {
						let versionNos = res.data.code;
						console.log(versionNos, 'versionNos')
						// console.log(res.data.path);
						let filePath = res.data.path;
						if (versionNos != versionCode) { //服务器返回1更新，0则不更新
							uni.showModal({
								title: '提示',
								content: '发现新版本，是否升级',
								success: function(res) {
									// console.log(widgetInfo.version);
									if (res.confirm) {
										console.log('用户点击确定');
										that.getProperty(filePath);
									} else if (res.cancel) {
										console.log('用户点击取消');
									}
								}
							});
						} else {
							this.$toast('该版本已是最新版')
						}
					}
				}).catch(error => {
					uni.hideLoading()
					console.log(error)
				})
			},
			getProperty(getProperty) {
				// console.log("bbbbbbbbb----------->", getProperty)
				let that = this;
				// 在线升级app/热更新
				that.showwri = true;
				const downloadTask = uni.downloadFile({ //下载文件
					url: baseUrl + getProperty,
					success: (downloadResult) => {
						// console.log(downloadResult);
						if (downloadResult.statusCode == 200) {
							// 更新升级
							plus.runtime.install(downloadResult.tempFilePath, {
								force: true
							}, function() {
								// console.log('install success...');
								that.showwri = false;
								plus.nativeUI.alert("应用资源更新完成！", function() {
									plus.runtime.restart();
								});
							}, function(e) {
								that.showwri = false;
								plus.nativeUI.alert("更新失败，请稍后再试");
							});
						}
					}
				});
				downloadTask.onProgressUpdate((res) => { //下载文件的进度
					that.totalBytesWritten = res.totalBytesWritten; //当前下载大小
					that.progress = res.progress; //当前下载比例
					that.totalBytesExpectedToWrite = res.totalBytesExpectedToWrite; //
				});
			},
			
			getNoticenumber() {
				var params = {
					deptId: this.deptId
				}
				getNoticenumber(params).then(res => {
					if (res.code == 200) {
						this.noticenum = Number(res.data)
					} else {
						this.$toast(res.msg)
					}
				})
			},
			// 项目进展
			handleToAdd() {
				// this.$tab.navigateTo('/pages/work/addclues')
				// this.$tab.navigateTo('/pages/work/addcluelist') 
			},
			
			// handleToSetting() {
			//   this.$tab.navigateTo('/pages/mine/setting/index')
			// },
			
			// handleHelp() {
			// 	this.$tab.navigateTo('/pages/mine/help/index')
			// },
			// handleAbout() {
			// 	this.$tab.navigateTo('/pages/mine/about/index')
			// },
			// handleJiaoLiuQun() {
			// 	this.$toast('QQ群：133713780')
			// },
			// handleBuilding() {
			// 	this.$toast('模块建设中~')
			// }
		}
	}
</script>

<style lang="scss">
page {background-color: #f5f5f5;}
.navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4;
	.topl{width: 274rpx;height: 50rpx;margin-left: 14rpx;}
	.topr{width: 36rpx;height: 36rpx;position: relative;margin-right: 10rpx;
		image{width: 100%;height: 100%;}
		.cir{width: 14rpx;height: 14rpx;background: #DF0024;border-radius: 50%;position: absolute;right: -7rpx;top: -7rpx;}
	}	
}
.zxbox{
	.bgimg{width: 100%;height: 416rpx;}
	.mbox{margin-top: -280rpx;padding: 0 24rpx;z-index: 1;position: relative;
		.infobox{
			.limg{width: 140rpx;height: 140rpx;flex: 0 0 auto;margin-right: 26rpx;border-radius: 50%;}
			.cbox{flex: 1;z-index: 1;
				.tit{font-weight: bold;font-size: 40rpx;color: #ffffff;margin-bottom: 14rpx;}
				.txt{font-weight: 500;font-size: 26rpx;color: #ffffff;}
			}
			.rimg{width: 12rpx;height: 20rpx;flex: 0 0 auto;margin-left: 20rpx;}
		}
		.conts{margin-top: 60rpx;margin-bottom: 24rpx;
			.clist{width: 164rpx;height: 246rpx;background: #FFFFFF;border-radius: 10rpx;padding: 24rpx;box-sizing: border-box;display: flex;flex-direction: column;
				image{width: 42rpx;height: 42rpx;flex: 0 0 auto;}
				.num{font-weight: bold;font-size: 48rpx;color: #222327;flex: 1;display: flex;align-items: center;}
				.tit{font-weight: 500;font-size: 26rpx;color: #222327;flex: 0 0 auto;
					text{color: #AAAAAA;}
				}
			}
			
		}
		.mbgbox{width: 100%;background: #FFFFFF;border-radius: 10rpx;margin-bottom: 24rpx;padding: 16rpx 0;
			.mine_list{
				padding: 28rpx 22rpx;
				.limg{flex: 0 0 auto;width: 42rpx;height: 42rpx;margin-right: 26rpx;display: flex;align-items: center;justify-content: center;
					.imga{width: 36rpx;height: 38rpx;}
					.imgb{width: 38rpx;height: 36rpx;}
					.imgc{width: 42rpx;height: 42rpx;}
				}
				.tit{font-weight: bold;font-size: 30rpx;color: #222327;}
				.txt{font-weight: 500;font-size: 30rpx;color: #666666;margin-left: 20rpx;flex: 0 0 auto;}
				.rimg{width: 12rpx;height: 20rpx;margin-left: 20rpx;flex: 0 0 auto;}
			}
		}
	}
}

.ztit{font-size: 24rpx;color:#c6c6c9;text-align: center;flex:0 0 auto;margin-bottom: 28rpx;margin-top: 40rpx;}

</style>
