首页页面搭建

components/footer/footer.vue

@@ -24,18 +24,18 @@
 			// 'color_checked',
 			// 'color_nochecked',
 			'footerindex',
-			'isHomeIndex'
+			// 'isHomeIndex'
 		],
         data () {
             return{
 				active :'',
 				footlist:[
-					{module:'home',title:'潜山政协',img:"imga",icon_checked:require('@/static/images/tabbar/home_.png'),icon_nochecked:require('@/static/images/tabbar/home.png')},
-					{module:'report',title:'履职报告',img:"imgb",icon_checked:require('@/static/images/tabbar/report_.png'),icon_nochecked:require('@/static/images/tabbar/report.png')},
-					{module:'notice',title:'会议通知',img:"imgc",icon_checked:require('@/static/images/tabbar/notice_.png'),icon_nochecked:require('@/static/images/tabbar/notice.png')},
-					{module:'mine',title:'个人中心',img:"imgd",icon_checked:require('@/static/images/tabbar/mine_.png'),icon_nochecked:require('@/static/images/tabbar/mine.png')},
+					{module:'home',title:'首页',img:"imga",icon_checked:require('@/static/images/tabbar/home_.png'),icon_nochecked:require('@/static/images/tabbar/home.png')},
+					{module:'work',title:'业务',img:"imgb",icon_checked:require('@/static/images/tabbar/work_.png'),icon_nochecked:require('@/static/images/tabbar/work.png')},
+					{module:'custom',title:'客户',img:"imgc",icon_checked:require('@/static/images/tabbar/custom_.png'),icon_nochecked:require('@/static/images/tabbar/custom.png')},
+					{module:'mine',title:'我的',img:"imga",icon_checked:require('@/static/images/tabbar/mine_.png'),icon_nochecked:require('@/static/images/tabbar/mine.png')},
 					],
-				color_checked :'222327',
+				color_checked :'00A9F0',
 				color_nochecked :'AAAAAA',
             }
         },
@@ -50,10 +50,10 @@
 				let link = e.link, module = e.module, def = e.default, title = e.title;
 				if(module == 'home'){
 					this.$tab.reLaunch('/pages/index/index')
-				// }else if(module == 'report'){
-				// 	this.$tab.reLaunch('/pages/report/index')
-				// }else if(module == 'notice'){
-				// 	this.$tab.reLaunch('/pages/notice/index')
+				}else if(module == 'work'){
+					this.$tab.reLaunch('/pages/work/index')
+				}else if(module == 'custom'){
+					this.$tab.reLaunch('/pages/custom/index')
 				}else if(module == 'mine'){
 					this.$tab.reLaunch('/pages/mine/index')
 				}
@@ -73,9 +73,8 @@
 	.com_footer .in_txt_on{ color: #20AD20; }
 	.im_imgs{width: 48rpx;height: 48rpx;display: flex;align-items: center;justify-content: center;margin: 0 auto;}
 	.in_img{
-		&.imga{width: 38rpx;height: 48rpx;}
-		&.imgb{width: 46rpx;height: 48rpx;}
-		&.imgc{width: 44rpx;height: 44rpx;}
-		&.imgd{width: 48rpx;height: 42rpx;}
+		&.imga{width: 40rpx;height: 40rpx;}
+		&.imgb{width: 42rpx;height: 40rpx;}
+		&.imgc{width: 38rpx;height: 40rpx;}
 	}
 </style>

components/order/stepbar.vue

@@ -1,78 +0,0 @@
-<template>
-  <view class="stepbar" :class="fixeda?'sfixed':''">
-	  <block v-for="(ite,idx) in steps" :key="idx">
-		  <view class="steps" :class="ite.status>0?'act':''" v-if="reservatType!=2&&ite.val==2||ite.val!=2">
-		  	<image :src="filln" class="img" v-if="ite.status==0"></image>
-		  	<image :src="fillin" class="img" v-if="ite.status==1"></image>
-		  	<image :src="fillf" class="img" v-if="ite.status==2"></image>
-		  	<view class="tit">{{ite.tit}}</view>
-			<image :src="line" class="line"></image>
-		  	<!-- <view class="line"></view> -->
-		  </view>
-	  </block>
-  </view>
-</template>
-
-<script>
-//fixeda   固定
-  export default {
-	props:{
-		steps: {
-			type: Array,
-			default () {
-				return []
-			}
-		},
-		fixeda:{
-			type: Boolean,
-			default () {
-				return false
-			}
-		},
-		reservatType:{
-			type: [Number,String],
-			default () {
-				return 1
-			}
-		}
-	},
-	components:{
-		
-	},
-	data(){
-		return{
-			fillin:require("@/static/images/order/come/fillin.png"),//填写
-			fillf:require("@/static/images/order/come/fillf.png"), //完成
-			filln:require("@/static/images/order/come/filln.png"),//未填
-			line:require("@/static/images/order/come/line.png"),//完成
-		}
-	},
-	onLoad: function() {
-	},
-	methods:{
-		getDetail(e){
-			this.$emit('getDetail')
-		} 
-	},
-	
-  }
-</script>
-
-<style lang="scss" scoped>
-// .sfixed{position: absolute;left: 0;right: 0;top: 0;z-index: 10;}
-.stepbar{background: transparent;display: flex;align-items: center;padding: 30rpx 0rpx;flex: 0 0 auto;
-	.steps{display: flex;flex-direction: column;flex: 1;align-items: center;position: relative;
-		.img{width: 30rpx;height: 30rpx;margin-bottom: 20rpx;}
-		.tit{font-size: 24rpx;font-weight: bold;color: #ffffff;opacity: 0.7;
-
-		}
-		.line{position: absolute;width: 102rpx;height:18rpx;top: 6rpx;right: 0;transform: translateX(50%);opacity: 0.7;}
-		&:last-of-type{.line{display: none;}}
-		&.act{
-			.line{opacity: 1;}
-			.tit{opacity: 1;}
-		}
-	}
-
-}
-</style>

components/swiper/notice.vue

@@ -0,0 +1,64 @@
+<template>
+  <view v-if="noticelist.length">
+	  <view class="hswip flexc" >
+	  		<image :src="tztip"></image>
+			<swiper class="swiper" circular :autoplay="autoplay" :interval="interval" :duration="duration" vertical='true'>
+				<swiper-item v-for="(ite,idx) in noticelist" :key="">
+					<view class="flexc swipers" @click="getDetail(ite.zxNoticeId)">
+						<view class="tit over">{{ite.noticeTitle}}</view>
+						<view class="time">{{ite.issuerTime}}</view>
+					</view>
+				</swiper-item>
+			</swiper>
+	  		
+	  </view>
+  </view>
+</template>
+
+<script>
+  export default {
+	  props:{
+	  	autoplay: {
+	  		type: Boolean,
+	  		default () {
+	  			return false
+	  		}
+	  	},
+	  	confdat:{},
+		noticelist:{
+			type: Array,
+			default () {
+				return []
+			}
+		}
+	  },
+	data(){
+		return{
+			tztip:require('@/static/images/home/tztip.png'),
+            interval: 2000,
+            duration: 500
+		}
+	},
+	methods:{
+		 getRoad(){
+		 	console.log(1)
+		 },
+		 getDetail(e){
+			 this.$emit('getNoticeDet',e)
+		 }
+	},
+	onLoad: function() {
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.hswip{width: 100%;background: #F7F7FF;border-radius: 10rpx;height: 92rpx;padding: 0 26rpx 0 28rpx;box-sizing: border-box;
+	image{width: 64rpx;height: 46rpx;flex: 0 0 auto;margin-right: 24rpx;}
+	.swiper{flex: 1;height: 92rpx;
+	.swipers{height: 92rpx;}
+		.tit{flex: 1;font-weight: bold;font-size: 26rpx;color: #222327;}
+		.time{font-weight: 500;font-size: 22rpx;color: #878787;flex: 0 0 auto;margin-left: 40rpx;}
+	}
+}
+</style>

components/toptab/banner.vue

@@ -0,0 +1,74 @@
+<template>
+	<view class="hometop">
+		<swiper class="swiper" circular :indicator-active-color="activecolor" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
+			:duration="duration">
+			<block v-for="(ite,idx) in bannerlist" :key='idx'>
+				<swiper-item>
+					<image  :src="baseUrl+ite.path" class="swiperimg"></image>
+				</swiper-item>
+			</block>
+		</swiper>
+	</view>
+</template>
+
+<script>
+	import config from '@/config.js';
+	const baseUrl = config.baseUrl;
+	export default{
+		props:{
+			bannerlist:{
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			type:{
+				type: String,
+				default () {
+					return 'zhao'
+				}
+			},
+			currentdate:{
+				type: String,
+				default () {
+					return ''
+				}
+			}
+		},
+		data(){
+			return{
+				background: ['color1', 'color2', 'color3'],
+				activecolor:'#ffffff',
+				indicatorDots: true,
+				autoplay: false,
+				interval: 2000,
+				duration: 500,
+				baseUrl:''
+			}
+		},
+		mounted() {
+			// this.baseUrl=baseUrl
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+
+	.swiper{height: 246rpx;position: relative;border-radius: 10rpx;overflow: hidden;
+		.swiperimg{width: 100%;height: 100%;border-radius: 10rpx;overflow: hidden;}
+	}
+	.swiper /deep/ .uni-swiper-wrapper .uni-swiper-dot{
+		width:12rpx;height:12rpx;border-radius: 50%;background: rgba(0, 0, 0, 0.5);
+		}
+	.swiper /deep/ .uni-swiper-wrapper .uni-swiper-dot-active{
+		width: 20rpx;height: 12rpx;border-radius: 6rpx;background-color: #ffffff;
+	}
+	// wx
+	.swiper /deep/ .wx-swiper-wrapper .wx-swiper-dot{
+		width:12rpx;height:12rpx;border-radius: 50%;background: rgba(0, 0, 0, 0.5);
+		}
+	.swiper /deep/ .wx-swiper-wrapper .wx-swiper-dot-active{
+		width: 20rpx;height: 12rpx;border-radius: 6rpx;background-color: #ffffff;
+	}
+	.bannerfot{position: absolute;left: 0;right: 0;height: 70rpx;background-color: rgba(0, 0, 0, 0.5);padding: 0 32rpx;bottom: 0;display: flex;align-items: center;justify-content: space-between;}
+</style>

components/toptab/tab.vue

@@ -3,24 +3,19 @@
 		<block v-for="(ite,idx) in tablist" :key='idx'>
 			<block v-if='ite.limt'>
 				<view class="tit" :style="'height:'+height+'rpx'" :class="tabidx==ite.val?'act':''" @click="getTab(ite.val)" v-if="checkPermi([ite.limt])">
-					<view class="f16 fw mb6 tits" >{{ite.tit}}</view>
-					<view class="f500 f14 txt" v-if="ite.txt||ite.txt==0">{{ite.txt}}</view>
-					<image :src="tapline" class="line"></image>
+					{{ite.tit}}
 				</view>
 			</block>
 			<block v-else>
 				<view class="tit" :style="'height:'+height+'rpx'" :class="tabidx==ite.val?'act':''" @click="getTab(ite.val)" >
-					<view class="f16 fw mb6 tits" >{{ite.tit}}</view>
-					<view class="f500 f14 txt" v-if="ite.txt||ite.txt==0">{{ite.txt}}</view>
-					<image :src="tapline" class="line"></image>
-				</view>
-				
+					{{ite.tit}}
+				</view>	
 			</block>
 		</block>
 		<!-- 切换按钮 -->
-		<view :style="'height:'+height+'rpx'" class="chebox" @click="getroleFn" v-if="checkPermi(['register:teacher:list'])&&tabbtn">
+		<!-- <view :style="'height:'+height+'rpx'" class="chebox" @click="getroleFn" v-if="checkPermi(['register:teacher:list'])&&tabbtn">
 			<image :src="micone"></image>
-		</view>
+		</view> -->
 	</view>
 </template>
 
@@ -56,8 +51,6 @@
 		data(){
 			return{
 				// :0,
-				tapline:require("@/static/images/hline.png"), 
-				micone:require("@/static/images/micone.png"),
 			}
 		},
 		mounted() {
@@ -78,22 +71,14 @@
 
 <style lang="scss">
 	.listtopb{
-		background-color: #ffffff;
-		 .tit{flex: 1;display: flex;flex-direction: column;justify-content: center;position: relative;
-			view{text-align: center;}
-			.tits{color: #AAAAAA ;}
-			.txt{color: #aaaaaa;}
-			.line{width: 40rpx;height: 12rpx;position: absolute;left: 50%;margin-left: -20rpx;bottom: 6rpx;display: none;}
-		 &.act{
-			 // &::after{content: '';width: 100rpx;height: 6rpx;background:#FE5706 ;position: absolute;left: 50%;margin-left: -50rpx;bottom: 0;}
-			.tits{color: #161616;}
-			.txt{color: #FE5706;}
-			.line{display: block;}
+		background-color:#00A9F0;
+		 .tit{flex: 1;display: flex;justify-content: center;position: relative;font-weight: 500;align-items: center;
+font-size: 26rpx;
+color: #FFFFFF;
+			&.act{font-weight: bold;font-size: 30rpx;
+			 &::after{content: '';width: 30rpx;height: 10rpx;background:#FFFFFF;position: absolute;left: 50%;margin-left: -10rpx;bottom: 16rpx;border-radius: 4rpx;}
+			
 			}
 		 }
-		.chebox{width: 96rpx;background: #FFFFFF;
-box-shadow: -10rpx 0rpx 10rpx 0rpx rgba(196,191,191,0.22);display: flex;align-items: center;justify-content: center;
-			image{width: 30rpx;height: 26rpx;}
-		}
 	}
 </style>

components/order/list.vue → components/wait/list.vue

@@ -1,12 +1,10 @@
 <template>
   <view>
 	<view v-if="datalist.length>0">
-		<!-- 预约 -->
-		<block v-if="type==1">
-			<view class="ylist" v-for="(ite,idx) in datalist" :key='idx' @click="getDetail(ite.reservatId)">
-				
-			</view>
-		</block>
+		<view class="watlist" v-for="(ite,idx) in datalist" :key='idx' @click="getDetail()">
+			<view class="tit flex1 over">{{ite.tit}}</view>
+			<view class="txt flex0">{{ite.time}}</view>
+		</view>
 		<view class="shax" v-if="wtdt">{{wtdt}}</view>
 	</view>
 	<block v-else>
@@ -26,12 +24,6 @@
 				return []
 			}
 		},
-		adrlist:{
-			type: Array,
-			default () {
-				return []
-			}
-		},
 		wtdt:{
 			type: String,
 			default () {
@@ -74,30 +66,6 @@
 				}
 			});
 		},
-		gettypeFn(type,id){
-			var that=this;
-			var str="拒绝"
-			if(type==3){
-				str='同意'
-			}
-			uni.showModal({
-				title: '确认'+str,
-				content: "是否确认"+str+"该预约",
-				cancelText: '取消',
-				confirmText: '确认',
-				success: function(res) {
-					if (res.confirm) {
-						var newobj={
-							type:type,
-							id:id
-						}
-						that.$emit("gettypeFn",newobj)
-					} else if (res.cancel) {
-						// console.log('用户点击取消');
-					}
-				}
-			});
-		},
 		getDetail(e){
 			this.$emit('getDetail',e)
 		},
@@ -122,8 +90,9 @@
 </script>
 
 <style lang="scss" scoped>
-// 预约
-.ylist{background: #FFFFFF;border-radius: 14rpx;margin-bottom: 30rpx;position: relative;
+.watlist{display: flex;align-items: center;padding: 20rpx 34rpx;
+	.tit{font-weight: 500;font-size: 28rpx;color: #222327;line-height: 40rpx;}
+	.txt{font-weight: 500;font-size: 24rpx;color: #AAAAAA;margin-left: 20rpx;}
 }
 
 </style>

pages.json

@@ -16,6 +16,16 @@
 	    "navigationBarTitleText": "智慧访客预约系统",
 	    "navigationStyle": "custom"
 	  }},
+	{
+	  "path": "pages/index/notice",
+	  "style": {
+	    "navigationBarTitleText": "申报业务",
+	    "navigationBarBackgroundColor": "#00A9F0",
+		"navigationBarTextStyle": "white",
+		"h5":{
+			"titleNView":false
+			}
+	  }},
 	
   {
     "path": "pages/register",
@@ -29,13 +39,19 @@
 	    "navigationBarTitleText": "用户协议及隐私条款"
 	  }
 	},
-	
-  {
+	{
     "path": "pages/work/index",
     "style": {
-      "navigationBarTitleText": "工作台"
-    }
-	}, {
+      "navigationBarTitleText": "业务"
+		}
+	},
+	{
+	"path": "pages/custom/index",
+	"style": {
+	  "navigationBarTitleText": "客户"
+		}
+	},
+	{
     "path": "pages/mine/index",
     "style": {
       "navigationBarTitleText": "我的",
@@ -50,7 +66,9 @@
   }, {
     "path": "pages/mine/info/index",
     "style": {
-      "navigationBarTitleText": "个人信息"
+      "navigationBarTitleText": "个人信息",
+	  "navigationBarBackgroundColor": "#00A9F0",
+	  "navigationBarTextStyle": "white"
     }
   }, {
     "path": "pages/mine/info/edit",

pages/custom/index.vue

@@ -0,0 +1,32 @@
+<template>
+	<view class="zan">
+		
+		<footers v-if="isfootflag"  :footerindex="footerindex"  :isHomeIndex="true"></footers>
+	</view>
+</template>
+
+<script>
+	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
+	import footers from '@/components/footer/footer.vue'
+	export default{
+		components:{footers},
+		data(){
+			return{
+				footerindex:'custom',
+				isfootflag:true,
+			}
+		},
+		methods:{
+			checkPermi, checkRole,
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.zan{
+	display: flex;align-items: center;
+	view{
+		font-size: 32rpx;padding: 0 20rpx;flex: 1;
+	}
+}
+</style>

pages/index/index.vue

@@ -1,67 +1,187 @@
 <template>
 	<view class="zxbox">
-		<view class="navbox">
-			<uni-nav-bar  color="#ffffff" leftWidth='300rpx'  :background-color="backgroundColor" :border="false" statusBar='true' fixed="true">
-				<block slot="left">
-					<image :src="titimg" class="topl"></image>
-				</block>
-				<block slot="right">
-					<view class="topr">
-						<image :src="noticeimg"></image>
-						<view class="cir"></view>
+		<view class="zxtop">
+			<view class="navbox">
+				<uni-nav-bar  color="#ffffff" leftWidth='160rpx' rightWidth="48rpx" :background-color="backgroundColor" :border="false" statusBar='true' fixed="true">
+					<block slot="left">
+						<view class="topl flexc">
+							<image :src="adrimg" ></image>
+							<view class="over">潜山</view>
+						</view>
+					</block>
+					<view class="topc flexc">
+						<image :src="secimg"></image>
+						<input  placeholder="请输入您要找的客户名称" confirm-type="search" v-model="usename" @confirm="getConfirm"/>
+					</view>
+					<block slot="right">
+						<view class="topr">
+							<image :src="noticeimg"></image>
+							<view class="cir">99+</view>
+							<!-- <block v-if="noticenum>99">99+</block>
+							<block v-else>{{noticenum}}</block> -->
+						</view>
+					</block>
+				</uni-nav-bar>
+			</view>
+			<image :src="bgimg" class="bgimg"></image>
+			<view class="zxmain">
+				<view class="banbox mb12" v-if="bannerlist.length">
+					<banner :bannerlist="bannerlist"></banner>
+				</view>
+				<view class="grid">
+					<view class="grid-item-box">
+						<view class="img"><image :src="topaimg" class="imga"></image></view>
+						<view>申报审核</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topbimg" class="imgb"></image></view>
+						<view>担保初审</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topcimg" class="imgc"></image></view>
+						<view>外部工具</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topdimg" class="imgd"></image></view>
+						<view>尽职调查</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topeimg" class="imga"></image></view>
+						<view>评审会</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topfimg" class="imgc"></image></view>
+						<view>签署合同</view>
 					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="topgimg" class="imge"></image></view>
+						<view>台账表</view>
+					</view>
+					<view class="grid-item-box">
+						<view class="img"><image :src="tophimg" class="imgf"></image></view>
+						<view>文件管理</view>
+					</view>
+				</view>
+				<!-- v-if="checkPermi(['zxNotice:notice:list'])" -->
+				<view class="mlrbox">
+					<view class="mb24">
+						<h-notice :noticelist="noticelist" :autoplay='autoplay' @getNoticeDet="getNoticeDet"></h-notice>
+					</view>
+					<view class="addbox mb26">
+						<view class="adda bga">
+							<image :src="haddaimg"></image>
+							<view class="tit">业务申报</view>
+							<view class="txt">在线填写</view>
+						</view>
+						<view class="adda bgb">
+							<image :src="haddbimg"></image>
+							<view class="tit">暂存申报</view>
+							<view class="txt">继续填报</view>
+						</view>
+						<view class="adda bgc">
+							<image :src="haddcimg"></image>
+							<view class="tit">我的申报</view>
+							<view class="txt">查看进度</view>
+						</view>
+						<view class="adda bgd">
+							<image :src="hadddimg"></image>
+							<view class="tit">回收站</view>
+							<view class="txt">一键找回</view>
+						</view>
+					</view>
+					<view class="flexcj tabt pb12">
+						<view class="left">待办提醒(<text>8</text>)</view>
+						<view class="right flexc">更多<image :src="rimg"></image></view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 代办提醒 -->
+		<view class="hnbox">
+			<view class="hntabs flexc" :class="fixedflag?'tabfix':''"  :style="fixedflag?'top:'+nvaHeight+'px;':''">
+				<block v-for="(ite,idx) in tabList" :key="idx">
+					<!-- v-if="checkPermi([ite.limit])" -->
+					<view class="tit"   :class="tabval==ite.val?'act':''" @click="getTab(ite.val)">{{ite.tit}}</view>
 				</block>
-			</uni-nav-bar>
+			</view>
+			<view style="height:98rpx;" v-if="fixedflag"></view>
+			<!-- 列表 -->
+			<view class="mt2 plr12" :style="'min-height: ' + minheight + 'px;'">
+				<wait-list :datalist="list" :wtdt="wtdt"  @getDetail="getDetail"></wait-list>
+			</view>
 		</view>
-		<image :src="bgimg" class="bgimg"></image>
-		
-	<footers v-if="isfootflag" :footlist="footlist" :footerindex="footerindex" :color_checked="color_checked" :color_nochecked="color_nochecked" :isHomeIndex="true"></footers>
+	<footers v-if="isfootflag"  :footerindex="footerindex"  :isHomeIndex="true"></footers>
   </view>
 </template>
 
 <script>
 	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
-	import yList from "@/components/order/list.vue"
+	import waitList from "@/components/wait/list.vue"
 	let { calendar } = require("@/components/lunc-calendar/calendar.js");
-	import {getReservatcountl,getReservatList,getReservatDel,getReservatSh} from "@/api/mine/order.js"
+	// import {getReservatcountl,getReservatList,getReservatDel,getReservatSh} from "@/api/mine/order.js"
 	import {getDictionaryFn} from "@/api/mine/register.js"
+	import banner from "@/components/toptab/banner.vue"
+	import hNotice from '@/components/swiper/notice.vue'
 	import footers from '@/components/footer/footer.vue'
   export default {
-	components:{yList,footers},
+	components:{banner,hNotice,waitList,footers},
 	data(){
 		return{
-			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:'home',
 			isfootflag:true,
 			backgroundColor:'transparent',
 			bgimg:require("@/static/images/navbg.png"),
-			titimg:require("@/static/images/home/tit.png"),
+			adrimg:require("@/static/images/home/adr.png"),
 			noticeimg:require("@/static/images/home/notice.png"),
+			secimg:require("@/static/images/home/search.png"),
+			topaimg:require("@/static/images/home/topa.png"),
+			topbimg:require("@/static/images/home/topb.png"),
+			topcimg:require("@/static/images/home/topc.png"),
+			topdimg:require("@/static/images/home/topd.png"),
+			topeimg:require("@/static/images/home/tope.png"),
+			topfimg:require("@/static/images/home/topa.png"),
+			topgimg:require("@/static/images/home/topg.png"),
+			tophimg:require("@/static/images/home/toph.png"),
+			haddaimg:require("@/static/images/home/hadda.png"),
+			haddbimg:require("@/static/images/home/haddb.png"),
+			haddcimg:require("@/static/images/home/haddc.png"),
+			hadddimg:require("@/static/images/home/haddd.png"),
+			rimg:require("@/static/images/home/rimg.png"),
+			noticelist:[{noticeTitle:'安徽嘉欣医疗用品有限公司项目评…',issuerTime:'04-07'},{noticeTitle:'2安徽嘉欣医疗用品有限公司项目评…',issuerTime:'04-07'},],
+			autoplay:false,
 			
-			list:[],
+			list:[{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},
+				{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},
+				{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},{tit:'【申报审核】— 潜山弘立新型建材有限公司…',time:'04-07'},
+			],
 			pageSize: 10,
 			pageNum: 1,
 			reachflag: true,
-			wtdt:'',
+			wtdt:'加载更多',
 			nvaHeight:44,
-			
+			minheight:0,
+			listTop:0,//距离顶部的距离
+			fixedflag:false,
+			tabval:0,
+			tabList:[{tit:'全部',val:0},{tit:'申报审核',val:1},{tit:'担保初审',val:2},{tit:'尽职调查',val:3},{tit:'评审会',val:4},],
+			usename:'',
+			bannerlist:[{path:require("@/static/images/home/banner.png"),},{path:require("@/static/images/navbg.png"),}],
 		}
 	},
 	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(4, 145, 253, ${opacity})`
 			this.backgroundColor = color // 更新盒子背景颜色
 		} else {
-			this.backgroundColor = '#0491fd'
+			this.backgroundColor = '#00A9F0'
+		}
+		if(scrollTop>listTop){
+			this.fixedflag=true
+		}else{
+			this.fixedflag=false
 		}
 	},
 	onLoad: function() {
@@ -70,13 +190,16 @@
 		// 	this.pageNum=1;
 		// 	this.list=[];
 		// 	this.getDataFn();
-		// 	// this.getcount();
 		// })
 		
 		// this.init()
-		// // this.getcount()
 		// this.getDataFn()
-		this.nvaHeight=uni.getSystemInfoSync().statusBarHeight+44;
+		uni.getSystemInfo({
+			success: (e) => {
+				this.nvaHeight = Number(e.statusBarHeight)+44;
+				this.minheight = e.screenHeight - Number(this.nvaHeight)- 100;
+			}
+		})
 	},
 	onUnload() {
 		uni.$off('refreshdatalist')
@@ -87,6 +210,7 @@
 		// this.time();
 	},
 	mounted() {
+		this.getHeightFn()
 	},
 	// 上拉触底加载更多触发事件
 	onReachBottom() {
@@ -97,6 +221,31 @@
 	},
 	methods:{
 		checkPermi, checkRole,
+		getConfirm(){
+			// this.$tab.navigateTo("/pages/order/list")
+			// this.init()
+		},
+		getNoticeDet(){
+			
+		},
+		getTab(idx){
+			this.tabval=idx;
+		},
+		getHeightFn(){
+			let query = uni.createSelectorQuery().in(this);
+			//需要给黄色区域设置一个id标识，在这里是demo
+			query.select('.zxtop').boundingClientRect(data => {
+				var top=data.top<0 ? -data.top : data.top;
+				this.listTop = data.height//赋值，待会要用
+				if (top <=this.nvaHeight) {
+					const opacity = top / 100 // 计算透明度值
+					const color = `rgba(4, 145, 253, ${opacity})`
+					this.backgroundColor = color // 更新盒子背景颜色
+				} else {
+					this.backgroundColor = '#00A9F0'
+				}
+			}).exec();
+		},
 		init(){
 			// 记录来源
 			getDictionaryFn('jluly').then(res=>{
@@ -113,46 +262,6 @@
 		getMoreFn(){
 			this.$tab.navigateTo("/pages/order/list")
 		},
-		getDelFn(id){
-			var that=this;
-			getReservatDel(id).then(res=>{
-				if(res.code==200){
-					that.$toast('删除成功')
-					setTimeout(function(){
-						that.reachflag=true;
-						that.pageNum=1;
-						that.list=[];
-						that.getDataFn();
-						// that.getcount();
-					},1500)
-					
-				}else{
-					that.$toast(res.msg)
-				}
-			})
-		},
-		gettypeFn(ite){
-			var that=this;
-			var params={
-				reservatId:ite.id,
-				visitType:ite.type
-			}
-			getReservatSh(params).then(res=>{
-				if(res.code==200){
-					that.$toast('审核成功')
-					setTimeout(function(){
-						that.reachflag=true;
-						that.pageNum=1;
-						that.list=[];
-						that.getDataFn();
-						// that.getcount();
-					},1500)
-					
-				}else{
-					that.$toast(res.msg)
-				}
-			})
-		},
 		time() {
 			var date = new Date();
 			var y = date.getFullYear();
@@ -171,18 +280,8 @@
 			// 	'0' + s) : s);
 			// this.kaTime = yearStr + ' ' + timeStr;
 		},
-		getcount(){
-			
-			getReservatcountl().then(res=>{
-				if(res.code==200){
-					this.conuntinfo=res.data
-				}else{
-					this.$toast(res.msg)
-				}
-			})
-		},
 		getDetail(data){
-			this.$tab.navigateTo('/pages/order/staffcode?type=look&id='+data)
+			// this.$tab.navigateTo('/pages/order/staffcode?type=look&id='+data)
 		},
 		getDataFn(){
 			var params={
@@ -222,18 +321,78 @@
 </script>
 
 <style lang="scss" scoped>
+page{background-color: #FFFFFF;}
+.navbox /deep/ .uni-navbar__header-container {align-items: center;padding-left: 0;}
 .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;}
+	.topl{padding-left: 16rpx;overflow: hidden;
+		image{width: 30rpx;height: 38rpx;margin-right: 18rpx;flex: 0 0 auto;}
+		view{font-weight: bold;font-size: 26rpx;color: #FFFFFF;}	
+	}
+	.topc{border-radius: 34rpx;height:68rpx;box-sizing: border-box;padding:0 32rpx 0 32rpx ;position: relative;flex:1;background-color: #FFFFFF;
+	 input{font-weight: 500;font-size: 26rpx;color: #222327;}
+	 image{width: 30rpx;height: 30rpx;margin-right: 24rpx;}
+	 }
+	.topr{width: 48rpx;height: 38rpx;position: relative;margin-right: 10rpx;
+		image{width: 32rpx;height: 38rpx;margin: 0 auto;}
+		.cir{background: #FF4747;font-size: 14rpx;color: #FFFFFF;border-radius: 50%;border: 2rpx solid #FFFFFF;min-width: 20rpx;height: 20rpx;
+			position: absolute;right: -5rpx;top: -5rpx;text-align: center;line-height: 16rpx;
+		}
+		// .cir{width: 14rpx;height: 14rpx;background: #DF0024;border-radius: 50%;position: absolute;right: -7rpx;top: -7rpx;}
 	}
 }
 
 .zxbox{
-	.bgimg{width: 100%;height: 420rpx;}
+	.bgimg{width: 100%;height: 450rpx;}
 	.zxmain{
+		margin-top: -270rpx;
+		.banbox{width: 678rpx;height: 246rpx;margin: 0 auto;}
+		.grid{
+			display: flex;align-items: center;flex-wrap: wrap;
+			.grid-item-box {display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 24rpx 0 36rpx;width: 25%;box-sizing: border-box;
+				.img{width: 46rpx;height: 46rpx;display: flex;align-items: center;justify-content: center;margin-bottom: 22rpx;
+					.imga{width: 46rpx;height: 46rpx;}
+					.imgb{width: 46rpx;height: 40rpx;}
+					.imgc{width: 44rpx;height: 46rpx;}
+					.imgd{width: 40rpx;height: 46rpx;}
+					.imge{width: 42rpx;height: 46rpx;}
+					.imgf{width: 44rpx;height: 40rpx;}
+				}
+				view{font-weight: bold;font-size: 26rpx;color: #222327;}
+			}
+		}
 		
+		.mlrbox{margin: 8rpx 36rpx 0;}
+		.addbox{
+			display: flex;
+			.adda{width: 154rpx;height: 190rpx;border-radius: 20rpx;box-sizing: border-box;padding: 28rpx 0 0 20rpx;margin-right: 22rpx;
+				&.bga{background: #FFF6F5;}
+				&.bgb{background: #F6F8FF;}
+				&.bgc{background: #FFF6E7;}
+				&.bgd{background: #EFF9F6;}
+				&:nth-child(4n){margin-right: 0;}
+				image{width: 52rpx;height: 52rpx;margin-bottom: 12rpx;}
+				.tit{font-weight: bold;font-size: 28rpx;color: #222327;margin-bottom: 4rpx;}
+				.txt{font-size: 22rpx;color: #AAAAAA;}
+			}
+		}
+		.tabt{
+			.left{font-weight: bold;font-size: 36rpx;color: #222327;
+				text{color: #FF6969;font-size: 30rpx;}
+			}
+			.right{font-size: 26rpx;color: #AAAAAA;
+				image{width: 12rpx;height: 18rpx;margin-left: 14rpx;}
+			}
+		}
+	}
+	.hnbox{background-color: #ffffff;padding-bottom: 32rpx;
+		.hntabs{padding:20rpx 12rpx 20rpx 34rpx;background-color: #ffffff;overflow: auto;
+			&.tabfix{position: fixed;left: 0;right: 0;z-index: 4;box-shadow:  0rpx 4rpx 12rpx 0rpx rgba(196,191,191,0.22);}
+			.tit{font-weight: 500;font-size: 26rpx;color: #252736;position: relative;margin-right: 22rpx;height: 58rpx;text-align: center;padding: 0 26rpx;background: #F6F6F6;
+				border-radius: 30rpx;flex: 0 0 auto;line-height: 58rpx;
+				&.act{font-weight: 500;color: #FFFFFF;background: #00A9F0;
+				}
+			}
+		}
 	}
 }
 </style>

pages/index/notice.vue

@@ -0,0 +1,74 @@
+<template>
+	<view class="notice" :style="'padding-top:' + height + 'rpx;'">
+		<view class="pfixed">
+			<tab-list :tablist="tablist" :height="height" :tabidx="tabidx" @getCheck="getCheck"></tab-list>
+		</view>
+		<view class="mt12">
+			<view class="cards">
+				<view class="top flexc">
+					<view class="cir bga"></view>
+					<view class="tit">系统通知</view>
+					<view class="time">2024-04-10 18:32</view>
+				</view>
+				<view class="ctxt">
+					<view>
+						您好，皖源融资担保管理系统现已更新版本，请尽快前 往更新，以免造成您的使用不便。
+					</view>
+					<view class="tzhu">祝您生活愉快！</view>
+				</view>
+			</view>
+			<view class="cards">
+				<view class="top flexc">
+					<view class="cir bgb"></view>
+					<view class="tit">待办通知</view>
+					<view class="time">2024-04-10 18:32</view>
+				</view>
+				<view class="ctxt">
+					<view>
+						您有<text class="cof6">1</text>条来自【潜山弘立新型建材有限公司】的申报信 息，请您前往审核。
+					</view>
+					<view class="tzhu">祝您生活愉快！</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
+	import tabList from '@/components/toptab/tab.vue'
+	export default{
+		components:{tabList},
+		data(){
+			return{
+				tablist:[{tit:'全部',val:0},{tit:'未读',val:1},{tit:'已读',val:2}],
+				tabidx:0,
+				height:100
+			}
+		},
+		methods:{
+			checkPermi, checkRole,
+			getCheck(val){
+				this.tabidx=val
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.cards{width: 702rpx;background: #FFFFFF;border-radius: 10rpx;margin: 0 auto 24rpx;
+	.top{padding: 26rpx 34rpx;
+		.cir{width: 20rpx;height: 20rpx;flex: 0 0 auto;margin-right: 20rpx;border-radius: 20rpx;
+			&.bga{background: #28C529;}
+			&.bgb{background: #FF6969;}
+		}
+		.tit{flex: 1;font-weight: bold;font-size: 26rpx;color: #343434;line-height: 36rpx;}
+		.time{font-weight: 500;font-size: 26rpx;flex: 0 0 auto;margin-right: 20rpx;color: #222327;}
+	}
+	.ctxt{font-weight: 500;font-size: 26rpx;color: #666666;border-top: 2rpx solid #E5E5E5;padding: 34rpx;
+		view{line-height: 36rpx;}
+		.tzhu{margin-top: 28rpx;}
+	}
+
+}
+</style>

pages/indexs.vue

@@ -0,0 +1,25 @@
+<template>
+	<view>
+		
+		
+	</view>
+</template>
+
+<script>
+	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
+	export default{
+		components:{},
+		data(){
+			return{
+				
+			}
+		},
+		methods:{
+			checkPermi, checkRole,
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

pages/mine/index.vue

@@ -1,363 +1,448 @@
 <template>
-  <view class="mine-container" >
-    <!--顶部个人信息栏-->
-		<view class="home_top">
-		  <uni-nav-bar title="我的" :background-color="backgroundColor" :border="navborder" statusBar='true' fixed="true">
-			  <!-- checkPermi(['system:notice:list']) -->
-			  <!-- <block slot="left" >
-			  		<view class="min_top" @click="getMessage">
-			  			<image :src="noticimg"></image>
-						<view class="circ"></view>
-			  		</view>
-			  </block> -->
-		  </uni-nav-bar> 
-	  </view>
-	  <image :src="abg" class="abg"></image>
-	 
-	<view style="margin-top: -487rpx;position: relative;padding:0 34rpx 20rpx;">
-		<view class="header_top flexc mb6" @click="handleToinfo">
-			<image v-if="avatar" @click.stop="handleToAvatar" :src="avatar" class="flex0 limg" mode="aspectFill"></image>
-			<image v-else @click.stop="handleToAvatar" :src="avatarimg" class="flex0 limg" mode="aspectFill"></image>
-			<view class="flex1 hcen">
-				<view class="f17 fw c16 mb8 flexc">{{name}}
-				<!-- <text v-if="choseroles=='teacher'">老师</text>
-				<text v-if="choseroles=='school'">学校管理员</text>
-				<text v-if="choseroles=='parents'">家长</text> -->
+	<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">99+</view>
+						<!-- <block v-if="noticenum>99">99+</block>
+						<block v-else>{{noticenum}}</block> -->
+					</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="flexc pr">
+						<image :src="headl"></image>
+						<view class="txt">超级管理员</view>
+						<image :src="headr"></image>
+					</view>
 				</view>
-				<!-- <view class="f15 co6" v-if="choseroles=='teacher'">{{schoolName}}/{{discipline}}</view>
-				<view class="f15 co6" v-else-if="choseroles!='parents'" >{{schoolName}}</view> -->
+				<image :src="wrimg" class="rimg"></image>
 			</view>
-			<image :src="rimg" class="flex0 rimg"></image>
-		</view>
-		<view class="mnbox">
-			<view class="mn_tit">账号设置</view>
-			<view class="mn_list">
-				<view class="mlist flexc"  @click="handleUpassword">
-					<view class="mlistl"><image :src="miconj" class="imgh"></image></view>
-					<view class="mlistc">修改密码</view>
+			<view class="conts">
+				<view class="conta">
+					<view class="flexcj mb19">
+						<view class="f15 fw co23 flex0 ml8">季度放款统计 <text class="coa ml4">/万元</text></view>
+						<view class="f12 coa fw5 flexc">2024年第二季度
+							<image :src="rimg" class="rimg"></image>
+						</view>
+					</view>
+					<view class="flexc">
+						<view class="contn">
+							<view class="img">
+								<image :src="mconta" class="imga"></image>
+							</view>
+							<view class="ctit">待放款</view>
+							<view class="ctxt co1l">1230</view>
+						</view>
+						<view class="line"></view>
+						<view class="contn">
+							<view class="img">
+								<image :src="mcontb" class="imgb"></image>
+							</view>
+							<view class="ctit">已放款</view>
+							<view class="ctxt co1l">4731</view>
+						</view>
+					</view>
+				</view>
+				<view class="conta">
+					<view class="flexcj mb19">
+						<view class="f15 fw co23 flex0 ml8">年度申报<text class="coa ml4">/个</text></view>
+						<view class="f12 coa fw5 flexc">2024年度
+							<image :src="rimg" class="rimg"></image>
+						</view>
+					</view>
+					<view class="flexc">
+						<view class="contn">
+							<view class="img">
+								<image :src="mcontc" class="imgc"></image>
+							</view>
+							<view class="ctit">待完成</view>
+							<view class="ctxt co1y">11</view>
+						</view>
+						<view class="line"></view>
+						<view class="contn">
+							<view class="img">
+								<image :src="mcontd" class="imgd"></image>
+							</view>
+							<view class="ctit">已归档</view>
+							<view class="ctxt co1y">56</view>
+						</view>
+					</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="handleToAddNews" v-if="checkPermi(['zxConference:conference:add'])">
+					<view class="limg">
+						<image :src="listimgb" class="imga"></image>
+					</view>
+					<view class="tit flex1">我的申报</view>
+					<image :src="rimg" class="rimg"></image>
+				</view>
+				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['proposalInfo:info:list'])">
+					<view class="limg">
+						<image :src="listimgc" class="imga"></image>
+					</view>
+					<view class="tit flex1">待办事项</view>
+					<image :src="rimg" class="rimg"></image>
+				</view>
+				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['sqmyInfo:info:list'])">
+					<view class="limg">
+						<image :src="listimgd" class="imga"></image>
+					</view>
+					<view class="tit flex1">我的暂存</view>
+					<image :src="rimg" class="rimg"></image>
+				</view>
+				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['member:info:list'])">
+					<view class="limg">
+						<image :src="listimge" class="imgb"></image>
+					</view>
+					<view class="tit flex1">回收站</view>
+					<image :src="rimg" class="rimg"></image>
 				</view>
-				<view class="mlist flexc"  @click="handlePrivacy">
-					<view class="mlistl"><image :src="miconf" class="imgd"></image></view>
-					<view class="mlistc">用户协议</view>
+			</view>
+			<view class="mbgbox">
+				
+				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['zxConference:conference:list'])">
+					<view class="limg">
+						<image :src="listimgf" class="imga"></image>
+					</view>
+					<view class="tit flex1">台账表</view>
+					<image :src="rimg" class="rimg"></image>
+				</view>
+				<view class="flexc mine_list" @click="handleToAddNews" v-if="checkPermi(['zxConference:conference:list'])">
+					<view class="limg">
+						<image :src="listimgg" class="imga"></image>
+					</view>
+					<view class="tit flex1">担保材料清单</view>
+					<image :src="rimg" class="rimg"></image>
 				</view>
-				<view class="mlist flexc"  @click="onlineWgt">
-					<view class="mlistl"><image :src="micong" class="imgg"></image></view>
-					<view class="mlistc">版本更新</view>
+			</view>
+			<view class="mbgbox">
+				<view class="flexc mine_list" @click="handleUpassword">
+					<view class="limg">
+						<image :src="listimgh" class="imga"></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="listimgi" class="imga"></image>
+					</view>
+					<view class="tit flex1">版本号</view>
+					 <view  class="txt">{{wgtcode}}</view>
+
 				</view>
-				<view class="mlist flexc"  @click="handleLogout">
-					<view class="mlistl"><image :src="miconl" class="imgc"></image></view>
-					<view class="mlistc">退出登录</view>
+				<view class="flexc mine_list" @click="handleLogout">
+					<view class="limg">
+						<image :src="listimgj" class="imga"></image>
+					</view>
+					<view class="tit flex1">退出登录</view>
+					<image :src="rimg" class="rimg"></image>
 				</view>
 			</view>
 		</view>
+		<view class="ztit">安徽中新云计算有限公司提供支持</view>
+		<footers v-if="isfootflag" :footerindex="footerindex" :isHomeIndex="false"></footers>
+
 	</view>
-	<footers v-if="isfootflag" :footlist="footlist" :footerindex="footerindex" :color_checked="color_checked" :color_nochecked="color_nochecked" :isHomeIndex="true"></footers>
- </view>
 </template>
 
 <script>
+	import storage from '@/utils/storage'
 	import footers from '@/components/footer/footer.vue'
-  import config from '@/config'
-  const baseUrl = config.baseUrl
-  import storage from '@/utils/storage'
-  import {findVersion} from "@/api/system/user.js"
-  import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
-  import {getInfo } from '@/api/login'
-  
-  export default {
-	components:{footers},
-    data() {
-      return {
-		  footlist:[
-		  	{module:'home',title:'首页',icon_checked:require('@/static/images/tabbar/home_.png'),icon_nochecked:require('@/static/images/tabbar/home.png')},
-		  	{module:'mine',title:'我的',icon_checked:require('@/static/images/tabbar/mine_.png'),icon_nochecked:require('@/static/images/tabbar/mine.png')},
-		  	],
-		  footerindex:'mine',
-		  isfootflag:true,
-		  color_checked :'161616',
-		  color_nochecked :'666666',
-		  abg:require('@/static/images/mine/habg.png'),
-		  noticimg:require('@/static/images/mine/mnotic.png'),
-		  rimg:require('@/static/images/mine/rimg.png'),
-		  wrimg:require('@/static/images/mine/wrimg.png'),	 
-		  miconf:require('@/static/images/mine/miconf.png'),
-		  miconj:require('@/static/images/mine/miconj.png'),
-		  miconl:require('@/static/images/mine/miconl.png'),
-		  micong:require('@/static/images/mine/micong.png'),
-		
-		type:0,
-		confdat:{tit:'系统提示',txt:"确定注销并退出系统吗？",closetxt:'取消',suretxt:'确认'},
-		  backgroundColor:"transparent",
-		  navborder:false,
-		  timetit:'',
-		  timelist:[],
-		  timetype:'',
-		  discipline:'',
-		  schoolName:'',
-		  schoolId:'',
-		  classId:'',
-		  
-		  teacherClass:[],
-		  roles:'',
-		  baseUrl:'',
-        name: this.$store.state.user.name,
-		avatarimg:require("@/static/images/mine/profile.png"),
-		platform:'Android',  
-        // version: getApp().globalData.config.appInfo.version
-      }
-    },
-    computed: {
-      avatar() {
-        return this.$store.state.user.avatar
-      },
-	  choseroles() {
-	    return this.$store.state.user.choseroles
-	  },
-      windowHeight() {
-        return uni.getSystemInfoSync().windowHeight - 50
-      }
-    },
-	onShow() {
-	},
-	onLoad() {
-		this.baseUrl=baseUrl;
-	},
-	onPageScroll(e) {
-		var scrollTop=Number(e.scrollTop);
-		if(scrollTop>0){
-			this.backgroundColor='#c4defb'
-		}else{
-			this.backgroundColor='transparent'
-		}
-	},
-    methods: {
-		checkPermi, checkRole,
-		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()
+	// 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/profile.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'),
+				listimgj: require('@/static/images/mine/minej.png'),
+				
+				headl:require('@/static/images/mine/headl.png'),
+				headr:require('@/static/images/mine/headr.png'),
+				wrimg:require("@/static/images/mine/wrimg.png"),
+				rimg:require("@/static/images/mine/rimg.png"),
+				border: false,
+				backgroundColor: 'transparent',
+
+				name: this.$store.state.user.name,
+				// version: getApp().globalData.config.appInfo.version,
+				footerindex: 'mine',
+				isfootflag: true,
+				noticenum: 0,
+				deptId: this.$store.state.user.deptId,
+				wgtcode: this.$store.state.user.wgtcode,
+				platform: 'Android',
+				nvaHeight:44,
+			}
 		},
-		comparisonVersionNo(versionCode) {
-			
-			let that = this;
-			// console.log("aaaaaaa===versionCode", versionCode);
-			const parmas = {
-				model: that.platform
+		components: {
+			footers
+		},
+		computed: {
+			avatar() {
+				return this.$store.state.user.avatar
+			},
+			windowHeight() {
+				return uni.getSystemInfoSync().windowHeight - 50
 			}
-			console.log(parmas)
-			findVersion(parmas).then(res => {
-				console.log(res,2)
-				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('该版本已是最新版')
+		},
+		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 = '#00A9F0'
+			}
+		}, 
+		onLoad() {
+			this.nvaHeight=uni.getSystemInfoSync().statusBarHeight+44;
+			if (checkPermi(['system:notice:number'])) {
+				// this.getNoticenumber()
+			}
+		},
+		mounted() {
+			this.getHeightFn()
+		}, 
+		
+		methods: {
+			checkPermi,
+			checkRole,
+			getHeightFn(){
+				let query = uni.createSelectorQuery().in(this);
+				//需要给黄色区域设置一个id标识，在这里是demo
+				query.select('.zxbox').boundingClientRect(data => {
+					var top=data.top<0 ? -data.top : data.top;
+					this.listTop = data.height//赋值，待会要用
+					if (top <=this.nvaHeight) {
+						const opacity = top / 100 // 计算透明度值
+						const color = `rgba(4, 145, 253, ${opacity})`
+						this.backgroundColor = color // 更新盒子背景颜色
+					} else {
+						this.backgroundColor = '#00A9F0'
 					}
+				}).exec();
+			},
+			// 修改密码
+			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
 				}
-			}).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();
+				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('用户点击取消');
+									}
+								}
 							});
-						}, function(e) {
-							that.showwri = false;
-							plus.nativeUI.alert("更新失败，请稍后再试");
-						});
+						} 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
 				}
-			});
-			downloadTask.onProgressUpdate((res) => { //下载文件的进度
-				that.totalBytesWritten = res.totalBytesWritten; //当前下载大小
-				that.progress = res.progress; //当前下载比例
-				that.totalBytesExpectedToWrite = res.totalBytesExpectedToWrite; //
-			});
-		},
-		getConfirm(){
-			this.$store.dispatch('LogOut').then(() => {
-			  this.$tab.reLaunch('/pages/index/index')
-			})
-		},
-		handlePrivacy(){
-			this.$tab.navigateTo(`/pages/agreement`)  
-		},
-		handleUpassword(){
-			this.$tab.navigateTo(`/pages/mine/pwd/index`)  
-		},
-	
-		
-		handleToAvatar() {
-		  this.$tab.navigateTo('/pages/mine/avatar/index')
-		},
-      handleToinfo() {
-        this.$tab.navigateTo('/pages/mine/info/index')
-      },
-      
-      handleLogout() {
-        this.$modal.confirm('确定注销并退出系统吗？').then(() => {
-          this.$store.dispatch('LogOut').then(() => {
-            this.$tab.reLaunch('/pages/index/index')
-          })
-        })
-      },
-    }
-  }
+				getNoticenumber(params).then(res => {
+					if (res.code == 200) {
+						this.noticenum = Number(res.data)
+					} else {
+						this.$toast(res.msg)
+					}
+				})
+			},
+		}
+	}
 </script>
 
 <style lang="scss">
-  page {
-    background-color: #f5f6f7;
-  }
-  .home_top /deep/ .uni-navbar__placeholder{height: 0 !important;}
-.abg{width: 100%;height: 622rpx;}
-.min_top{position: relative;width: 40rpx;height: 40rpx;display: flex;align-items: center;justify-content: center;
-	image{width: 32rpx;height: 32rpx;}
-	.circ{width: 12rpx;height: 12rpx;background: #EB5663;border-radius: 50%;position: absolute;right: 4rpx;top: 4rpx;}
-}
-.header_top{padding: 34rpx 26rpx;
-	.limg{width: 120rpx;height: 120rpx;border-radius: 50%;margin-right: 26rpx;}
-	.rimg{width: 14rpx;height: 24rpx;margin-left: 26rpx;}
-	.hcen{
-		text{height: 34rpx;background: #89A8F6;border-radius: 16rpx;line-height: 34rpx;font-weight: normal;font-size: 24rpx;color: #ffffff;display: inline-block;min-width: 78rpx;padding: 0 10rpx;box-sizing: border-box;margin-left: 24rpx;}
-	}
-}
-.bgf{
-	.mlist{padding:30rpx 34rpx;
-		.mlistl{width: 40rpx;height: 40rpx;display: flex;align-items: center;justify-content: center;margin-right: 16rpx;
-			.imga{width: 38rpx;height: 38rpx;}
-			.imgb{width: 32rpx;height: 32rpx;}
-			.imgc{width: 30rpx;height: 30rpx;}
-			.imgd{width: 32rpx;height: 34rpx;}
-			.imge{width: 32rpx;height: 26rpx;}
-			.imgf{width: 32rpx;height: 30rpx;}
-			.imgg{width: 34rpx;height: 34rpx;}
-			.imgi{width: 34rpx;height: 34rpx;}
-			.imgk{width: 32rpx;height: 30rpx;}
+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{background: #FF4747;font-size: 14rpx;color: #FFFFFF;border-radius: 50%;border: 2rpx solid #FFFFFF;min-width: 20rpx;height: 20rpx;
+			position: absolute;right: -5rpx;top: -5rpx;text-align: center;line-height: 16rpx;
 		}
-		.mlistc{flex: 1;font-size: 32rpx;font-weight: 500;
-	color: #161616;}
-		.mlistr{width: 14rpx;height: 24rpx;marign-left:16rpx}
-	}
+		// .cir{width: 14rpx;height: 14rpx;background: #DF0024;border-radius: 50%;position: absolute;right: -7rpx;top: -7rpx;}
+	}	
 }
-
-.mnbox{
-	background: #FFFFFF;border-radius: 18rpx;margin-bottom: 24rpx;padding: 40rpx 0 16rpx;
-	.mn_tit{font-size: 32rpx;font-weight: bold;
-color: #161616;padding-left: 68rpx;position: relative;margin-bottom: 12rpx;
-		&::before{width: 6rpx;background: $com-cd3;border-radius: 4rpx;position: absolute;left: 36rpx;top: 4rpx;content: '';bottom: 4rpx;}
-	}
-	.mn_list{display: flex;flex-wrap: wrap;
-		.mlist{width: 25%;box-sizing: border-box;display: flex;flex-direction: column;align-items: center;padding: 26rpx 0;
-			.mlistl{width: 50rpx;height: 50rpx;display: flex;align-items: center;justify-content: center;margin-bottom: 16rpx;
-				.imga{width: 42rpx;height: 44rpx;}
-				.imgb{width: 44rpx;height: 44rpx;}
-				.imgc{width: 44rpx;height: 42rpx;}
-				.imgd{width: 42rpx;height: 44rpx;}
-				.imge{width: 44rpx;height: 42rpx;}
-				.imgf{width: 32rpx;height: 30rpx;}
-				.imgg{width: 44rpx;height: 44rpx;}
-				.imgh{width: 40rpx;height: 44rpx;}
-				.imgk{width: 40rpx;height: 42rpx;}
+.zxbox{ 
+	.bgimg{width: 100%;height: 680rpx;}
+	.mbox{margin-top: -540rpx;padding: 0 36rpx;z-index: 1;position: relative;
+		.infobox{margin-bottom: 60rpx;
+			.limg{width: 140rpx;height: 140rpx;flex: 0 0 auto;margin-right: 26rpx;border-radius: 50%;}
+			.cbox{flex: 1;z-index: 1;
+				image{width: 32rpx;height: 38rpx;}
+				.tit{font-weight: bold;font-size: 40rpx;color: #ffffff;margin-bottom: 14rpx;}
+				.txt{font-weight: bold;font-size: 24rpx;background-color: #2973C7;color: #FFFFFF;height: 38rpx;line-height: 38rpx;margin: 0 -2rpx;padding:0 2rpx;}
+			}
+			.rimg{width: 12rpx;height: 20rpx;flex: 0 0 auto;margin-left: 20rpx;}
+		}
+		.conts{margin-bottom: 24rpx;background: #FFFFFF;box-shadow: 0px 0px 10rpx 0px rgba(216,216,216,0.4);border-radius: 20rpx;
+			padding: 0 20rpx;box-sizing: border-box;
+			.conta{border-bottom: 2rpx dashed #E6E6E6;padding: 38rpx 0 44rpx;
+				.rimg{width: 16rpx;height: 22rpx;margin-left: 22rpx;flex: 0 0 auto;}
+				.contn{
+					display: flex;align-items: center;flex: 0 0 auto;width: 286rpx;
+					.img{width: 42rpx;height: 40rpx;display: flex;align-items: center;justify-content: center;margin-right: 18rpx;flex: 0 0 auto;
+						.imga{width: 42rpx;height: 40rpx;}
+						.imgb{width: 30rpx;height: 40rpx;}
+						.imgc{width: 38rpx;height: 40rpx;}
+						.imgd{width: 34rpx;height: 40rpx;}
+					}
+					.ctit{font-weight: 500;font-size: 26rpx;color: #222327;flex: 0 0 auto;}
+					.ctxt{flex: 1;text-align: right;font-weight: bold;font-size: 32rpx;word-break: break-all;}
+				}
+				.line{width: 2rpx;height: 28rpx;background: #E6E6E6;margin: 0 32rpx;flex: 0 0 auto;}
+			}
+		}
+		.mbgbox{width: 100%;background: #FFFFFF;border-radius: 10rpx;margin-bottom: 24rpx;
+			.mine_list{
+				padding: 34rpx 22rpx;
+				.limg{flex: 0 0 auto;width: 42rpx;height: 42rpx;margin-right: 26rpx;display: flex;align-items: center;justify-content: center;
+					.imga{width: 40rpx;height: 40rpx;}
+					.imgb{width: 38rpx;height: 40rpx;}
+				}
+				.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: 16rpx;height: 22rpx;margin-left: 20rpx;flex: 0 0 auto;}
 			}
-			.mlistc{flex: 1;font-size: 30rpx;font-weight: 500;color: #666666;}
 		}
 	}
-	
 }
 
+.ztit{font-size: 24rpx;color:#c6c6c9;text-align: center;flex:0 0 auto;margin-bottom: 28rpx;margin-top: 40rpx;}
 
-  .mine-container {
-    width: 100%;
-    height: 100%;
-
-
-    .header-section {
-      padding: 15px 15px 45px 15px;
-      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>

pages/mine/info/index.vue

@@ -1,13 +1,40 @@
 <template>
   <view class="container">
-    <uni-list>
+	<view class="lists mb12" @click.stop="handleToAvatar">
+		<view class="tit">头像照片</view>
+		<view class="txt"></view>
+		<image v-if="avatar" :src="avatar" class="avaimg" mode="aspectFill"></image>
+		<image v-else  :src="avatarimg" class="avaimg" mode="aspectFill"></image>
+		<image :src="rimg" class="rimg"></image>
+	</view>
+	<view class="lists">
+		<view class="tit">用户名称</view>
+		<view class="txt">{{user.nickName}}</view>
+		<image :src="rimg" class="rimg"></image>
+	</view>
+	<view class="lists">
+		<view class="tit">职 务</view>
+		<view class="txt">{{postGroup}}</view>
+		<image :src="rimg" class="rimg"></image>
+	</view>
+	<view class="lists">
+		<view class="tit">联系方式</view>
+		<view class="txt">{{user.phonenumber}}</view>
+		<image :src="rimg" class="rimg"></image>
+	</view>
+	<view class="lists">
+		<view class="tit">角色</view>
+		<view class="txt">{{roleGroup}}</view>
+		<image :src="rimg" class="rimg"></image>
+	</view>
+    <!-- <uni-list>
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="昵称" :rightText="user.nickName" />
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'phone-filled'}" title="手机号码" :rightText="user.phonenumber" />
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'email-filled'}" title="邮箱" :rightText="user.email" />
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'auth-filled'}" title="岗位" :rightText="postGroup" />
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'staff-filled'}" title="角色" :rightText="roleGroup" />
       <uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="创建日期" :rightText="user.createTime" />
-    </uni-list>
+    </uni-list> -->
   </view>
 </template>
 
@@ -19,9 +46,16 @@
       return {
         user: {},
         roleGroup: "",
-        postGroup: ""
+        postGroup: "",
+		avatarimg:require("@/static/images/mine/profile.png"),
+		rimg:require("@/static/images/mine/rimg.png"),
       }
     },
+	computed: {
+		avatar() {
+			return this.$store.state.user.avatar
+		},
+	},
     onLoad() {
       this.getUser()
     },
@@ -32,13 +66,23 @@
           this.roleGroup = response.roleGroup
           this.postGroup = response.postGroup
         })
-      }
+      },
+	  handleToAvatar() {
+	  	this.$tab.navigateTo('/pages/mine/avatar/index')
+	  },
     }
   }
 </script>
 
 <style lang="scss">
   page {
-    background-color: #ffffff;
+    background-color: #E6E6E6;
+  }
+  .lists{background-color: #ffffff;min-height: 120rpx;box-sizing: border-box;
+	  display: flex;align-items: center;padding: 30rpx 36rpx 30rpx 34rpx;border-bottom: 2rpx solid #E6E6E6;
+	  .tit{font-weight: bold;font-size: 30rpx;color: #343434;flex: 0 0 auto;}
+	  .rimg{flex: 0 0 auto;width: 16rpx;height: 22rpx;margin-left: 28rpx;}
+	  .txt{flex: 1;text-align: right;margin-left: 28rpx;font-weight: 500;font-size: 30rpx;color: #343434;}
+		.avaimg{width: 110rpx;height: 110rpx;border-radius:10rpx;flex: 0 0 auto;}
   }
 </style>

pages/work/index.vue

@@ -1,28 +1,23 @@
 <template>
 	<view class="zan">
-		<!-- <view @click="geta">保安</view>
-		<view @click="getb">被访者</view> -->
-		<view @click="getc">来访者</view>
+		
+		<footers v-if="isfootflag"  :footerindex="footerindex"  :isHomeIndex="true"></footers>
 	</view>
 </template>
 
 <script>
+	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
+	import footers from '@/components/footer/footer.vue'
 	export default{
+		components:{footers},
 		data(){
 			return{
-				
+				footerindex:'work',
+				isfootflag:true,
 			}
 		},
 		methods:{
-			geta(){
-				this.$tab.navigateTo('/pages/order/staff')
-			},
-			getb(){
-				this.$tab.navigateTo('/pages/order/notice')
-			},
-			getc(){
-				this.$tab.navigateTo('/pages/order/come')
-			},
+			checkPermi, checkRole,
 		}
 	}
 </script>

static/style.css

@@ -39,15 +39,31 @@ image{display: block;}
 .regbox .rimg image{width: 18rpx;height: 30rpx;}
 .regbox .apllytxt{font-size: 30rpx;font-weight: 500;color: #DF0024;margin-top: 26rpx;color: #AAAAAA;text-align: center;}
 .regbox .apllytxt	text{color: #DF0024;padding-right: 16rpx;font-size: 30rpx;}
+.shax {font-size: 30rpx;color: #666;text-align: center;padding: 20rpx 0;}
 
 .pregbox{padding: 160rpx 56rpx 160rpx;}
 
+.mt4{margin-top: 8rpx;}
+.mt12{margin-top: 24rpx;}
 .mt50{margin-top: 100rpx;}
 
+.mb12{margin-bottom: 24rpx !important;}
+.mb19{margin-bottom: 38rpx;}
+.mb22{margin-bottom: 44rpx;}
 .mb24{margin-bottom: 48rpx;}
-
+.mb26{margin-bottom: 52rpx;}
+.ml4{margin-left: 8rpx;}
+.ml8{margin-left: 16rpx;}
+.pb12{padding-bottom: 24rpx;}
 
 .fw{font-weight: bold;}
 .fw5{font-weight: 500;}
 .fwn{font-weight: normal;}
 
+.f12{font-size: 24rpx;}
+.f15{font-size: 30rpx;}
+.co23{color: #222327;}
+.coa{color: #AAAAAA;}
+.co1y{color: #17CF5F !important;}
+.co1l{color: #1792E5 !important;}
+.cof6{color: #FF6969;}

uni_modules/uni-grid/changelog.md

@@ -0,0 +1,13 @@
+## 1.4.0（2021-11-19）
+- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
+- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-grid](https://uniapp.dcloud.io/component/uniui/uni-grid)
+## 1.3.2（2021-11-09） 
+- 新增 提供组件设计资源，组件样式调整
+## 1.3.1（2021-07-30）
+- 优化 vue3下事件警告的问题
+## 1.3.0（2021-07-13）
+- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.2.4（2021-05-12）
+- 新增 组件示例地址
+## 1.2.3（2021-02-05）
+- 调整为uni_modules目录规范

uni_modules/uni-grid/components/uni-grid-item/uni-grid-item.vue

@@ -0,0 +1,127 @@
+<template>
+	<view v-if="width" :style="'width:'+width+';'+(square?'height:'+width:'')" class="uni-grid-item">
+		<view :class="{ 'uni-grid-item--border': showBorder,  'uni-grid-item--border-top': showBorder && index < column, 'uni-highlight': highlight }"
+		 :style="{'border-right-color': borderColor ,'border-bottom-color': borderColor ,'border-top-color': borderColor }"
+		 class="uni-grid-item__box" @click="_onClick">
+			<slot />
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * GridItem 宫格
+	 * @description 宫格组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=27
+	 * @property {Number} index 子组件的唯一标识 ，点击gird会返回当前的标识
+	 */
+	export default {
+		name: 'UniGridItem',
+		inject: ['grid'],
+		props: {
+			index: {
+				type: Number,
+				default: 0
+			}
+		},
+		data() {
+			return {
+				column: 0,
+				showBorder: true,
+				square: true,
+				highlight: true,
+				left: 0,
+				top: 0,
+				openNum: 2,
+				width: 0,
+				borderColor: '#e5e5e5'
+			}
+		},
+		created() {
+			this.column = this.grid.column
+			this.showBorder = this.grid.showBorder
+			this.square = this.grid.square
+			this.highlight = this.grid.highlight
+			this.top = this.hor === 0 ? this.grid.hor : this.hor
+			this.left = this.ver === 0 ? this.grid.ver : this.ver
+			this.borderColor = this.grid.borderColor
+			this.grid.children.push(this)
+			// this.grid.init()
+			this.width = this.grid.width
+		},
+		beforeDestroy() {
+			this.grid.children.forEach((item, index) => {
+				if (item === this) {
+					this.grid.children.splice(index, 1)
+				}
+			})
+		},
+		methods: {
+			_onClick() {
+				this.grid.change({
+					detail: {
+						index: this.index
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" >
+	.uni-grid-item {
+		/* #ifndef APP-NVUE */
+		height: 100%;
+		display: flex;
+		/* #endif */
+		/* #ifdef H5 */
+		cursor: pointer;
+		/* #endif */
+	}
+
+	.uni-grid-item__box {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		width: 100%;
+		/* #endif */
+		position: relative;
+		flex: 1;
+		flex-direction: column;
+		// justify-content: center;
+		// align-items: center;
+	}
+
+	.uni-grid-item--border {
+		position: relative;
+		/* #ifdef APP-NVUE */
+		border-bottom-color: #D2D2D2;
+		border-bottom-style: solid;
+		border-bottom-width: 0.5px;
+		border-right-color: #D2D2D2;
+		border-right-style: solid;
+		border-right-width: 0.5px;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		z-index: 0;
+		border-bottom: 1px #D2D2D2 solid;
+		border-right: 1px #D2D2D2 solid;
+		/* #endif */
+	}
+	.uni-grid-item--border-top {
+		position: relative;
+		/* #ifdef APP-NVUE */
+		border-top-color: #D2D2D2;
+		border-top-style: solid;
+		border-top-width: 0.5px;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		border-top: 1px #D2D2D2 solid;
+		z-index: 0;
+		/* #endif */
+	}
+
+
+	.uni-highlight:active {
+		background-color: #f1f1f1;
+	}
+</style>

uni_modules/uni-grid/components/uni-grid/uni-grid.vue

@@ -0,0 +1,142 @@
+<template>
+	<view class="uni-grid-wrap">
+		<view :id="elId" ref="uni-grid" class="uni-grid" :class="{ 'uni-grid--border': showBorder }" :style="{ 'border-left-color':borderColor}">
+			<slot />
+		</view>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const dom = uni.requireNativePlugin('dom');
+	// #endif
+
+	/**
+	 * Grid 宫格
+	 * @description 宫格组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=27
+	 * @property {Number} column 每列显示个数
+	 * @property {String} borderColor 边框颜色
+	 * @property {Boolean} showBorder 是否显示边框
+	 * @property {Boolean} square 是否方形显示
+	 * @property {Boolean} Boolean 点击背景是否高亮
+	 * @event {Function} change 点击 grid 触发，e={detail:{index:0}}，index 为当前点击 gird 下标
+	 */
+	export default {
+		name: 'UniGrid',
+		emits:['change'],
+		props: {
+			// 每列显示个数
+			column: {
+				type: Number,
+				default: 3
+			},
+			// 是否显示边框
+			showBorder: {
+				type: Boolean,
+				default: true
+			},
+			// 边框颜色
+			borderColor: {
+				type: String,
+				default: '#D2D2D2'
+			},
+			// 是否正方形显示,默认为 true
+			square: {
+				type: Boolean,
+				default: true
+			},
+			highlight: {
+				type: Boolean,
+				default: true
+			}
+		},
+		provide() {
+			return {
+				grid: this
+			}
+		},
+		data() {
+			const elId = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
+			return {
+				elId,
+				width: 0
+			}
+		},
+		created() {
+			this.children = []
+		},
+		mounted() {
+			this.$nextTick(()=>{
+				this.init()
+			})
+		},
+		methods: {
+			init() {
+				setTimeout(() => {
+					this._getSize((width) => {
+						this.children.forEach((item, index) => {
+							item.width = width
+						})
+					})
+				}, 50)
+			},
+			change(e) {
+				this.$emit('change', e)
+			},
+			_getSize(fn) {
+				// #ifndef APP-NVUE
+				uni.createSelectorQuery()
+					.in(this)
+					.select(`#${this.elId}`)
+					.boundingClientRect()
+					.exec(ret => {
+						this.width = parseInt((ret[0].width - 1) / this.column) + 'px'
+						fn(this.width)
+					})
+				// #endif
+				// #ifdef APP-NVUE
+				dom.getComponentRect(this.$refs['uni-grid'], (ret) => {
+					this.width = parseInt((ret.size.width - 1) / this.column) + 'px'
+					fn(this.width)
+				})
+				// #endif
+			}
+		}
+	}
+</script>
+
+<style lang="scss" >
+	.uni-grid-wrap {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: column;
+		/* #ifdef H5 */
+		width: 100%;
+		/* #endif */
+	}
+
+	.uni-grid {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		// flex: 1;
+		flex-direction: row;
+		flex-wrap: wrap;
+	}
+
+	.uni-grid--border {
+		position: relative;
+		/* #ifdef APP-NVUE */
+		border-left-color: #D2D2D2;
+		border-left-style: solid;
+		border-left-width: 0.5px;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		z-index: 1;
+		border-left: 1px #D2D2D2 solid;
+		/* #endif */
+	}
+</style>

uni_modules/uni-grid/package.json

@@ -0,0 +1,86 @@
+{
+  "id": "uni-grid",
+  "displayName": "uni-grid 宫格",
+  "version": "1.4.0",
+  "description": "Grid 宫格组件，提供移动端常见的宫格布局，如九宫格。",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "九宫格",
+    "表格"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "category": [
+      "前端组件",
+      "通用组件"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": ["uni-scss","uni-icons"],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}

uni_modules/uni-grid/readme.md

@@ -0,0 +1,11 @@
+
+
+## Grid 宫格
+> **组件名：uni-grid**
+> 代码块： `uGrid`
+
+
+宫格组件。
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-grid)
+#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839