LpRealName/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" v-for="(item,index) in menuList" :key="index" @click="goModule(item.name)">
 						<view>
 							<image class="img1" :src="`/static/realName/${item.css}.png`"
 								style="width: 70rpx;height: 70rpx;" alt="">
 						</view>
 						<view style="font-size: 26rpx;">{{item.name}}</view>
 					</view>

 					<!-- 				<view class="view-item" @click="goClock">
					<view><image class="img1" src="@/static/realName/attendance.png" style="width: 80rpx;height: 80rpx;" alt=""></view>
					<view style="font-size: 28rpx;">考勤打卡</view>
				</view>
				<view class="view-item" @click="goStatistics">
					<view><image class="img1" src="@/static/realName/attendance_statistics.png" style="width: 80rpx;height: 80rpx;" alt=""></view>
					<view style="font-size: 28rpx;">考勤统计</view>
				</view>
				
				<view class="view-item" @click="goManagementClock">
					<view><image class="img1" src="@/static/realName/attendance.png" style="width: 80rpx;height: 80rpx;" alt=""></view>
					<view style="font-size: 28rpx;">管理人员打卡</view>
				</view> -->



 					<view class="view-item" @click="goTempClock" v-if="type.indexOf('3')>-1">
 						<view>
 							<image class="img1" src="@/static/realName/attendance.png"
 								style="width: 80rpx;height: 80rpx;" alt="">
 						</view>
 						<view style="font-size: 28rpx;">临时人员打卡</view>
 					</view>


 					<!-- <view class="view-item">
					<view><image class="img1" src="@/static/realName/update_face.png" style="width: 80rpx;height: 80rpx;" alt=""></view>
					<view style="font-size: 28rpx;">更新人脸库</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: [],
 				menuList: [],
 				permissionList: uni.getStorageSync('realNamePermissions')
 				// userName: uni.getStorageSync('userName'),
 				// className: uni.getStorageSync('className'),
 				// facePath: config.fileUrl + uni.getStorageSync('facePath'),
 				// token: uni.getStorageSync('access_token')
 			}
 		},
 		onLoad() {
 			this.getPermission()
 			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: {
 			getPermission() {
 				this.permissionList.forEach((item, index) => {
 					if (item.type == 4) {
 						this.menuList.push(item)
 					}
 				})
 				console.log(this.menuList)
 			},
 			goModule(name) {
 				if (name == '考勤统计') {
 					uni.navigateTo({ //考勤统计
 						url: `/pages/realName/workAttendance/statistics/index`
 					})
 				} else if (name == '考勤打卡') {
 					uni.navigateTo({ //考勤打卡
 						url: `/pages/realName/workAttendance/clock/index`
 					})
 				} else if (name == '管理人员考勤') {
 					uni.navigateTo({ //考勤打卡-管理人员 
 						url: `/pages/realName/workAttendance/managementClock/index`
 					})
 				} else if (name == '更新人脸库') {
 					uni.showToast({
 						title: "人脸库更新中...",
 						icon: 'none',
 						duration: 2000
 					})
 				} else if (name == '工资查看') {
 					uni.navigateTo({
 						url: `/pages/realName/workbench/wageRecord/index`
 					})
 				}
 			},

 			goTempClock() {
 				uni.navigateTo({ //考勤打卡-临时人员
 					url: `/pages/realName/workAttendance/tempClock/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>