shuju_ui/qs_zhaoshang/pages/mine/index.vue

<template>
  <view class="mine-container">
	<view class="flex1">
	  <uni-nav-bar background-color='transparent' statusBar='true' :border='border'>
		  <block slot="right" v-if="checkPermi(['system:notice:list'])"> 
			<view class="min_top" @click="getMessage">
				<image :src="noticimg"></image>
				<view v-if="noticenum">
					<block v-if="noticenum>99">99+</block>
					<block v-else>{{noticenum}}</block>
				</view>
			</view>
		  </block>
		 
	  </uni-nav-bar>
    <!--顶部个人信息栏-->
	<view class="min-topa" @click="handleToInfo">
		<view class="min-topat fw f22 cof mb12">{{name}}</view>
		<view class="f15 cof5">查看账号信息/退出登录</view>
	</view>
	
	<view >
		<view class="flexc mine_list" @click="handleToAdd" v-if="checkPermi(['projectV2:sbbzb:add'])">
		  <image :src="nlistimgf" class="limg"></image>
		  <view class="f17 c34 flex1">上报线索</view>
		  <image :src="rimg" class="rimg"></image>
		</view>
		<!-- @click="handleTojin" -->
		<!-- <view class="flexc mine_list"  >
		  <image :src="nlistimgg" class="limg"></image>
		  <view class="f17 c34 flex1">项目归属统计</view>
		  <image :src="rimg" class="rimg"></image>
		</view> -->
	  <view class="flexc mine_list" @click="handleToAll" v-if="checkPermi(['projectV2:sbbzb:list'])">
	    <image :src="nlistimga" class="limg"></image>
	    <view class="f17 c34 flex1">全部项目</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <view class="flexc mine_list" @click="handleTosk" v-if="checkPermi(['projectV2:skxm:list'])">
	    <image :src="nlistimgb" class="limg"></image>
	    <view class="f17 c34 flex1">省库申报</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <view class="flexc mine_list" @click="handleTowt" v-if="checkPermi(['projectV2:shyj:list'])">
	   <image :src="nlistimgc" class="limg"></image>
	   <view class="f17 c34 flex1">问题项目</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <view class="flexc mine_list" @click="handleTold" v-if="checkPermi(['projectV2:sbbzb:ldps:list'])">
	   <image :src="nlistimgd" class="limg"></image>
	   <view class="f17 c34 flex1">领导批示</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <view class="flexc mine_list" @click="handleToPwd">
	    <image :src="nlistimge" class="limg"></image>
	    <view class="f17 c34 flex1">修改密码</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <!-- #ifdef APP -->
	  <view class="flexc mine_list" @click="onlineWgt">
	    <image :src="nlistimgh" class="limg"></image>
	    <view class="f17 c34 flex1">版本更新</view>
	    <view  class="f15 c34 mlr8">{{wgtcode}}</view>
	    <image :src="rimg" class="rimg"></image>
	  </view>
	  <!-- #endif -->
	
	  
	</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">
	<footers v-if="isfootflag" :footlist="footlist" :footerindex="footerindex" :color_checked="color_checked" :color_nochecked="color_nochecked" :isHomeIndex="false"></footers>	
	</view>
	
  </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 {
		 noticimg:require("@/static/images/mine/notice.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'),
		 nlistimga:require('@/static/images/mine/nminea.png'),
		 nlistimgb:require('@/static/images/mine/nmineb.png'),
		 nlistimgc:require('@/static/images/mine/nminec.png'),
		 nlistimgd:require('@/static/images/mine/nmined.png'),
		 nlistimge:require('@/static/images/mine/nminee.png'),
		 nlistimgf:require('@/static/images/mine/nminef.png'),
		 nlistimgg:require('@/static/images/mine/nmineg.png'),
		 nlistimgh:require('@/static/images/mine/nmineh.png'),
		rimg:require("@/static/images/mine/rimg.png"),
		border:false,
		  
        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:'center',title:'引荐项目',icon_checked:require('@/static/images/tabbar/cen_.png'),icon_nochecked:require('@/static/images/tabbar/cen.png')},
			{module:'mine',title:'我的',icon_checked:require('@/static/images/tabbar/mine_.png'),icon_nochecked:require('@/static/images/tabbar/mine.png')},
			],
		 footerindex:'mine',
		 showfooter: 0,
		 isfootflag:true,
		 color_checked :'343434',
		 color_nochecked :'666666',
		 noticenum:0,
		 deptId:this.$store.state.user.deptId,
		 wgtcode:this.$store.state.user.wgtcode,
		 platform:'Android'  
      }
    },
	components:{footers},
    computed: {
      avatar() {
        return this.$store.state.user.avatar
      },
      windowHeight() {
        return uni.getSystemInfoSync().windowHeight - 50
      }
    },
	onLoad() {
		if(checkPermi(['system:notice:number'])){
			this.getNoticenumber()
		}
	},
    methods: {
		checkPermi, checkRole,
	getNoticenumber(){
		var params={
			deptId:this.deptId
		}
		getNoticenumber(params).then(res=>{
			if(res.code==200){
				this.noticenum=Number(res.data)
			}else{
				this.$toast(res.msg)
			}
		})
	},
	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; //
		});
	},
	// 项目进展
		handleToAdd(){
			this.$tab.navigateTo('/pages/work/addclues')
			// this.$tab.navigateTo('/pages/work/addcluelist') 
		},
		// 账号信息
      handleToInfo() {
        this.$tab.navigateTo('/pages/mine/info/index')
      },
	  // 修改密码
	  handleToPwd(){
		this.$tab.navigateTo('/pages/mine/pwd/index')  
	  },
	  //消息
	  getMessage(){
		  if(checkPermi(['system:notice:list'])){
		  	this.$tab.navigateTo('/pages/work/message')
		  } 
	  },
	  //审核进度pages/work/shprogres
	  //全部项目
	  handleToAll(){
	  	this.$tab.navigateTo('/pages/work/allitems?idx=0') 
	  },
	  // 省库申报
	  handleTosk(){
	  			  this.$tab.navigateTo('/pages/work/skitem')
	  },
	  handleTowt(){
	  	this.$tab.navigateTo('/pages/work/wtitem')
	  },
	  handleTold(){
	  	 this.$tab.navigateTo('/pages/work/lditem')
	  },
	  
	  
      // handleToSetting() {
      //   this.$tab.navigateTo('/pages/mine/setting/index')
      // },
      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')
          })
        })
      },
      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: #FFFFFF;
  }
.min_top{position: relative;width: 44rpx;height: 44rpx;display: flex;align-items: center;justify-content: center;margin-right: 32rpx;
	image{width: 38rpx;height: 40rpx;}
	view{position: absolute;background: #ffffff;box-shadow: 0px 2rpx 6rpx 0px rgba(198,78,0,0.49);border-radius: 10rpx;color: #FF0000;font-size: 18rpx;right: -50%;top: -12rpx;border-radius: 50%;min-width: 40rpx;height: 40rpx;text-align: center;padding: 0 4rpx;box-sizing: border-box;line-height: 40rpx;}
}
.min-topa{padding: 64rpx 48rpx 108rpx;}
.min-topat{font-weight: bold;color: #FFFFFF;}
.mine_list{padding: 30rpx 48rpx;}
.limg{width: 56rpx;height: 56rpx;margin-right: 30rpx;flex: 0 0 auto;}
.rimg{width: 14rpx;height: 28rpx;flex: 0 0 auto;}

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





  .mine-container {
    width: 100%;
    height: 100vh;
	display: flex;flex-direction: column;
	background: url('~@/static/images/mine/minebg.png') top center no-repeat;background-size: 100% 360rpx;

    .header-section {
      padding: 15px 15px 45px 15px;
      background-color: #3c96f3;
      color: white;

      .login-tip {
        font-size: 18px;
        margin-left: 10px;
      }

      .cu-avatar {
        border: 2px solid #eaeaea;

        .icon {
          font-size: 40px;
        }
      }

      .user-info {
        margin-left: 15px;

        .u_title {
          font-size: 18px;
          line-height: 30px;
        }
      }
    }

    .content-section {
      position: relative;
      top: -50px;

      .mine-actions {
        margin: 15px 15px;
        padding: 20px 0px;
        border-radius: 8px;
        background-color: white;

        .action-item {
          .icon {
            font-size: 28px;
          }

          .text {
            display: block;
            font-size: 13px;
            margin: 8px 0px;
          }
        }
      }
    }
  }
</style>