parking_pda/pages/index/index.vue

<template>
	<view>
		<view class="header">
			<view class="u-flex user-box u-m-b-24">
				<view class="u-m-r-10" @click="login($store.state.vuex_hasLogin)">
					<u-avatar :src="userInfo.headImgUrl || userInfo.avatar||pic" size="140"></u-avatar>
				</view>
				<view class="u-flex-1" @click="login($store.state.vuex_hasLogin)">
					<view class="u-font-18 u-p-b-20"><b>{{ userInfo.payeeName || '智慧停车' }}</b><span class="payee-no">工号：{{ userInfo.payeeNo || '请登录' }}</span></view>
					<view class="addr u-flex">
						<u-icon name="map-fill" color="#fff" size="38"></u-icon>
						{{ theRoad.roadName || '暂无' }}
					</view>
				</view>
				<view class="u-m-l-10 u-p-10" @click="openPage('/pages/roadlist/roadlist')">
					<u-icon name="arrow-right" color="rgba(255,255,255,.7)" size="28"></u-icon>
				</view>
			</view>	
			<view class="header-total u-flex wrap">
				<view class="u-p-r-60">
					车位：{{ spaceInfo.spaceBusy }}/{{ spaceInfo.spaceTotal}}
				</view>
				<view class="" @click="openPage('/pages/getout/getout')">
					需确认：{{ spaceInfo.spaceConfirm}}
				</view>
			</view>
		</view>
		<view class="wrap">
			<view class="notice u-flex u-p-l-35 u-p-r-40">
				<u-image width="113rpx" height="83rpx" src="/static/img/tip.png"></u-image>
				<view class="notice-wrap u-flex-1">
					<u-notice-bar mode="vertical" :list="noticeList" :more-icon="true" :volume-icon="false" bg-color="#fff" color="#373737"></u-notice-bar>
				</view>
			</view>
			<view class="feature-list u-flex u-flex-wrap u-row-between">				
				<view class="feature-item" @click="openPage('/pages/parking/parking')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-05.png"></u-image>
					<view class="feature-item-text">车辆入场</view>
				</view>
				<view class="feature-item" @click="openPage('/pages/getout/getout')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-06.png"></u-image>
					<view class="feature-item-text">车辆出场</view>
				</view>
				<view class="feature-item" @click="openPage('/pages/attence/attence')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-01.png"></u-image>
					<view class="feature-item-text">签到打卡</view>
				</view>
				<view class="feature-item" @click="openPage('/pages/ownersquery/ownersquery')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-10.png"></u-image>
					<view class="feature-item-text">车主查询</view>
				</view>	
				<view class="feature-item" @click="openPage('/pages/performance/performance')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-11.png"></u-image>
					<view class="feature-item-text">我的业绩</view>
				</view>	
				<view class="feature-item" @click="openPage('/pages/setting/setting')">
					<u-image width="160rpx" height="160rpx" src="/static/img/index-feature-08.png"></u-image>
					<view class="feature-item-text">设置</view>
				</view>		
			</view>
			<u-bottom color="#949494" :static="true"></u-bottom>
		</view>
		
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	//#ifdef APP-PLUS
	var ALog = uni.requireNativePlugin("AndroidLog")
	var location = uni.requireNativePlugin("Location")
	var speak = uni.requireNativePlugin("SpeechPlug")
	var device = uni.requireNativePlugin("DeviceInfo")
	//#endif
	export default {
		data() {
			return {
				pic:'/static/img/default-portrait.png',
				userInfo:[],
				noticeList:['智慧停车车主端V0.1版本发布','智慧停车PDA端V0.1版本发布'],
				theRoad:[],
				spaceInfo:new Object,
			}
		},
		onLoad() {			
			this.getLocation();
		},
		onBackPress(options) {
			 // uni.showModal({
			 //   title: '温馨提示',  
			 //   content: '已经到头了',  
			 //   showCancel: false,
			 //   success: (res) => { }  
			 // })  
			 // 禁止默认返回  
			 return true  
		},
		onShow() {
			if(this.$store.state.vuex_hasLogin){
				this.userInfo = this.$store.state.vuex_user;
				this.theRoad = this.$store.state.vuex_user?.roadList?.[0]||[];
				if(this.theRoad.roadNo){
					console.log('this.theRoad.roadNo',this.theRoad.roadNo)
					this.handleGetIndex(this.theRoad.roadNo);
				};
				console.log('this.theRoad',this.theRoad);
				console.log('this.userInfo',this.userInfo);
			}else{
				this.userInfo = [];
				this.openPage('/pages/login/login');
			};
			
		},
		methods: {
			speaks(msg){
				speak.speakAction(msg)
			},
			onPrint(){
				this.$u.api.printIn({orderId:'550110630002380800'})
				.then(res=>{
					device.print(res.data);
				}).catch(err=>{
					
				});
				
			},
			getLocation(){
				uni.getLocation({
					type:"gcj02",
					success : function (res) {
						var dst = '26.58751,106.78329';
						var src = res.latitude + ',' + res.longitude;
						//#ifdef APP-PLUS
						var locRet = location.distance(src, dst)
						//#endif
					},
					fail: function(res){

					}
				})
			},
			openPage(path) {
				uni.navigateTo({
				    url: path
				});
			},
			//登录判断
			login(status){
				if(!status){
					console.log('config',this.config);
					this.openPage('/pages/login/login');
					// window.location.replace(this.config.loginUrl)
				}
			},
			handleGetIndex(roadNo){
				this.$u.api.getIndex({roadNo:roadNo})
				.then(res=>{
					// this.$refs.uToast.show({
					// 	title: res.msg,
					// 	type: 'success',
					// });
					this.spaceInfo = res.data.spaceInfo;
					console.log('this.spaceInfo',this.spaceInfo)
				}).catch(err=>{
					if(err.errMsg){
						this.$refs.uToast.show({
							title: '请检查网络',
							type: 'error',
						});
						return false;
					};
					this.$refs.uToast.show({
						title: err.msg,
						type: 'error',
					});
					console.log('handleGetIndex ',err)
				});
			},
			

		}
	}
</script>

<style lang="scss" >
	@import "./index.scss";
</style>