snapshot-wx/pages/CareTabBar/IntServ.vue

<template>
	<view class="container">
		<view class="intServBtnBox">
			<view class="intServBtn" @tap="onSafeVolunteerTo">
				<image src="https://www.zgsafesp.cn/doc/安全志愿.png" class="intServBtnBGImg" mode="widthFix"></image>
			</view>
			<view class="intServBtn">
				<picker @change="bindAreaChange" :value="indexArea" :range="AreaData" range-key="areaName">
					<image src="https://www.zgsafesp.cn/doc/用工服务.png" class="intServBtnBGImg" mode="widthFix"></image>
				</picker>
			</view>
			<view class="intServBtn" @tap="onNoticeTo">
				<image src="https://www.zgsafesp.cn/doc/宣传学习.png" class="intServBtnBGImg" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	var that
	export default {
		options: {
		    styleIsolation: 'isolated'
		},
		data() {
			return {
				selectAllAreaData: [],
				AreaData: [],
				indexArea: -1,
				isVolunteer: null
			}
		},
		methods: {
			getData(){
				that = this;
				that.onGetAreaData();
			},
			init(){
				that.isVolunteer = uni.getStorageSync('userInfo').isVolunteer;
			},
			onGetAreaData(fun) {
				that.$admin.reqDirect({
					method: 'GET',
					url: '/api/v1/Snapshot/area/tree'
				}).then(res => {
					if (res && res.length > 0) {
						that.selectAllAreaData = res;
						let firstData = [];
						let secondData = [];
						res.forEach((item, index) => {
							if (item.id == '510300') {
								firstData = item.children;
							}
						});
						firstData.forEach((item, index) => {
							if (index == 0) {
								res.forEach((allItem, allIndex) => {
									if (allItem.parentId == item.id) {
										secondData.push(allItem)
									}
								});
							}
						});
						that.AreaData = firstData;
					}
					typeof fun === 'function' && fun();
				})
			},
			onSafeVolunteerTo(){
				if (!uni.getStorageSync('userInfo').openID){
					that.$util.msg("请先登录", function(){
						uni.switchTab({
							url: "/pages/Index/Mine"
						})
					});
				}else {
					if (that.isVolunteer){
						uni.navigateTo({
							url: '/pagesCare/SafeVolunteer/Index'
						});
					}else{
						that.$util.msg('很抱歉，您没有访问权限')
					}
				}
			},
			bindAreaChange(e){
				that.indexArea = e.detail.value;
				if (that.indexArea != -1){
					uni.navigateTo({
						url: '/pagesCare/Employ/Index?areaID=' + encodeURIComponent(that.AreaData[that.indexArea].id) + '&areaName=' + encodeURIComponent(that.AreaData[that.indexArea].areaName)
					})
				}else {
					that.$util.msg("请选择您要查看的区域");
				}
			},
			onNoticeTo() {
				uni.navigateTo({
					url: '/pagesCare/Notice/Index'
				})
			},
		}
	}
</script>

<style>
	.container {
		background-color: #fff;
	}
	
	.intServBtnBox{
		padding: 50rpx 0 20rpx;
		text-align: center;
		line-height: 1;
	}
	
	.intServBtn {
		display: inline-block;
		width: calc(100% - 60rpx);
		height: 100%;
		text-align: center;
		border-radius: 14rpx;
		position: relative;
		margin-bottom: 30rpx;
	}
	
	.intServBtnBGImg {
		width: 100%;
		height: 100%;
	}
</style>