YNUtdPlatform/pages/realName/workAttendance/index.vue

 <template>
   <view class="page">
 	<u-navbar title="考勤" placeholder bgColor="#00337A" @leftClick="leftClick" leftIconColor="#fff" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }">
		<view class="u-nav-slot" slot="left">
			<u-icon name="grid" size="24"  color="#FFF" v-if="type.indexOf('4')>-1"></u-icon> 
		</view>
	</u-navbar>
    <view style="width: 100%;height: 84vh;">
		<scroll-view scroll-y="true">
			<view class="view-box">
				<view class="view-item" @click="goClock">
					<view><image class="img1" src="@/static/realName/attendanceIcon.png" style="width: 60rpx;height: 60rpx;" alt=""></view>
					<view style="font-size: 24rpx;">考勤打卡</view>
				</view>
				
				<view class="view-item" @click="goStatistics">
					<view><image class="img1" src="@/static/realName/attendance_statistics.png" style="width: 60rpx;height: 60rpx;" alt=""></view>
					<view style="font-size: 24rpx;">考勤统计</view>
				</view>
				<view class="view-item" @click="goTempClock">
					<view><image class="img1" src="@/static/realName/attendanceIcon.png" style="width: 60rpx;height: 60rpx;" alt=""></view>
					<view style="font-size: 24rpx;">临时人员打卡</view>
				</view>
				<view class="view-item" @click="goManagementClock">
					<view><image class="img1" src="@/static/realName/attendanceIcon.png" style="width: 60rpx;height: 60rpx;" alt=""></view>
					<view style="font-size: 24rpx;">管理人员打卡</view>
				</view>
				<!-- <view class="view-item">
					<view><image class="img1" src="@/static/realName/update_face.png" style="width: 60rpx;height: 60rpx;" alt=""></view>
					<view style="font-size: 24rpx;">更新人脸库</view>
				</view> -->
			</view>
		</scroll-view>
	</view>
	
	<!-- 弹窗 -->
	<u-popup :show="showPopup" mode="center" @close="closePopup">
		<view style="width:500rpx;height: auto%;position: relative;background-color: #fff;">
			<view style="width: 100%;height: 80rpx;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;background-color: #fff;"> 
				<view style="width: 50%;height: 80rpx;line-height: 80rpx;font-weight: bold;margin-left: 40rpx;">选择工程</view>
				<u-icon style="width: 10%;" name="close" color="#000" size="24" @click="closePopup"></u-icon>
			</view>
			<scroll-view style="width: 100%;height: 50vh;background-color: #fff;" scroll-y="true">
				<view v-for="(item,index) in proList" :key="index" style="padding: 20rpx;" v-if="item.isActive==1" @click="chosenPro(item)">{{item.abbreviation}}</view>
			</scroll-view>
		</view>
	</u-popup>
	
	
	
	<m-tabbar fixed fill :current="2" :tabbar="tabbar"></m-tabbar>
   </view>
 </template>
 
 <script>
 import TabbarConfig from '../util/tabbar.js'
 import config from '@/config'
 
 export default {
   data() {
     return {
		tabbar: TabbarConfig,
		type:uni.getStorageSync('realNameUser').type,
		subId:uni.getStorageSync('realNameUser').subId,
		showPopup:false,
		proList:[]
 		// userName: uni.getStorageSync('userName'),
 		// className: uni.getStorageSync('className'),
 		// facePath: config.fileUrl + uni.getStorageSync('facePath'),
 		// token: uni.getStorageSync('access_token')
     }
   },
   onLoad() {
	   if(this.type.indexOf("4")>-1){//监督端
		   this.getPro()
	   }
    },
	onShow() {
		if(this.type.indexOf("4")>-1){ //监督端
		   let hasChosenPro=uni.getStorageSync('hasChosenPro')
		   if(!hasChosenPro){
			   this.showPopup=true
		   }
		}
	},
   methods: {
		goClock(){
			uni.navigateTo({//考勤打卡
				url: `/pages/realName/workAttendance/clock/index` 
			})
		},
		goTempClock(){
			uni.navigateTo({//考勤打卡-临时人员
				url: `/pages/realName/workAttendance/tempClock/index` 
			})
		},
		goManagementClock(){
			uni.navigateTo({//考勤打卡-管理人员
				url: `/pages/realName/workAttendance/managementClock/index` 
			})
		},
		goStatistics(){
			uni.navigateTo({//考勤统计
				url: `/pages/realName/workAttendance/statistics/index`
			})
		},
		getPro(){
			let param={
				id:-1,
				subId:this.subId
			}
			console.log(param)
			uni.request({
			  url: config.realAppUrl + '/offLine/getPro',
			  method: 'post',
			  data: param,
			  header: {
				'Content-Type': 'application/x-www-form-urlencoded',
				Authorization: uni.getStorageSync('realNameToken')
			  },
			  success: res => {
				console.log(res)
				res = res.data;
				if(res.code==200){
					this.proList = res.data;
				}
			  },
			  fail: err => {
				console.log(err)
			  }
			})
		},
		leftClick() {
			if(this.type.indexOf("4")>-1){
			   this.showPopup=true;
			}
		},
		chosenPro(item){
			let obj = uni.getStorageSync('realNameUser')
			obj.proId=item.id
			uni.setStorageSync('realNameUser', obj)
			uni.setStorageSync('hasChosenPro', "1")
			this.showPopup=false;
			//跳转首页
		},
		closePopup() {
			this.showPopup=false;
		},
	 
   }
 }
 </script>
 
 <style lang="scss">
 .page {
   width: 100%;
   height: 100vh;
   
   // box-sizing: border-box;
   // padding: 15vh 8vw;
   .view-box{
	   width: 100%;height: auto;display: flex;flex-wrap: wrap;flex-direction: row;
	   margin-bottom: 100rpx;
   }
   .view-item{
	   width: 33%;height: 200rpx;display: flex;flex-direction:column;align-items: center;justify-content: center;
   }
 }
 </style>