ihotel-h5/pages/myself/myself.vue

<template>
	<view class="content">
		<view class="person">
			<image class="person_touxiang" src="../../static/my/touxiang.svg"></image>
			<text class="person_name">{{cardName}}
				<text class="person_identity">
					<text v-if="cardIdentity==0">其他</text>
					<text v-if="cardIdentity==1">学生</text>
					<text v-if="cardIdentity==4">教职工</text>
					<text v-if="cardIdentity==5">校友</text>
				</text>
			</text>
			<text class="person_phone">卡号：{{cardNum}}</text>
		</view>
		<!-- 第二部分，我的订单 -->
		<view class="my_order">
			<view class="order_title">我的订单</view>
			<view class="order_all" @click="navigateToAll">全部＞</view>
			<view class="item-list">
			  <view class="item-list-one" @click="navigateToDaizhifu">
			    <image src="../../static/my/no_zhifu.svg" class="img-btn"></image>
			    <text class="list-txt">待支付</text>
			  </view>
			  <view class="item-list-one" @click="navigateToDairuzhu">
			    <image src="../../static/my/dairuzhu.svg" class="img-btn"></image>
			    <text class="list-txt">待入住</text>
			  </view>
			  <view class="item-list-one" @click="navigateToYiruzhu">
			    <image src="../../static/my/yiruzhu.svg" class="img-btn"></image>
			    <text class="list-txt">已入住</text>
			  </view>
			  <view class="item-list-one" @click="navigateToYiquxiao">
			    <image src="../../static/my/yiquxiao.svg" class="img-btn"></image>
			    <text class="list-txt">已取消</text>
			  </view>
			</view>
			<view class="item-list">
			  <view class="item-list-one" @click="navigateToDaijiezhang">
			    <image src="../../static/my/no_pay.svg" class="img-btn"></image>
			    <text class="list-txt">待结账</text>
			  </view>
			  <view class="item-list-one" @click="navigateToYiwancheng">
			    <image src="../../static/my/wancheng.svg" class="img-btn"></image>
			    <text class="list-txt">已完成</text>
			  </view>
			</view>
		</view>
		<!-- 第三部分，我的服务 -->
		<view class="my_help">
			<view class="help_title">我的服务</view>
			<view class="item-list">
			  <view class="item-list-one" @click="telphone(phone)">
			    <image src="../../static/my/person_phone.svg" class="img-btn"></image>
			    <text class="list-txt">人工热线</text>
			  </view>
			  <!-- <view class="item-list-one" @click="navigateToBaoxiu">
			    <image src="../../static/my/baoxiu.svg" class="img-btn"></image>
			    <text class="list-txt">房间报修</text>
			  </view> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone:'0791-82293574',//客服热线电话
				cardName:'',//用户名
				cardIdentity:'',//身份
				cardNum:'',//卡号
			}
		},
		onLoad() {
			this.getUserInfo()
		},
		methods: {
			// 获取用户信息
			getUserInfo() {
				  let _self = this
				  this.$axios.get("/ihotel/hotelUser/userInfo",
				  {
					  headers:{
						  'user_token':localStorage.getItem('token')
					  }
				  }).then(res => {
					res = res.data
					if (res.success) {
						if (res.data.statu == '1') {
						  _self.cardName=res.data.name
						  _self.cardIdentity=res.data.identityType
						  _self.cardNum=res.data.cardNumber
						}else {
							alert('您没有权限，请联系客服')
						}
					} else {
					  console.log('获取用户信息失败')
					}
				  });
			},
			//跳转到全部订单
			navigateToAll(){
				uni.navigateTo({
					url:"../my_orderlist/my_orderlist?Inv=6"
				})
			},
			//跳转到待支付订单
			navigateToDaizhifu(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=1",
				})
			},
			//跳转到待入住订单
			navigateToDairuzhu(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=2"
				})
			},
			//跳转到已入住订单
			navigateToYiruzhu(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=3"
				})
			},
			//跳转到已取消订单
			navigateToYiquxiao(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=0"
				})
			},
			//跳转到待结账订单
			navigateToDaijiezhang(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=4"
				})
			},
			//跳转到已完成订单
			navigateToYiwancheng(){
				uni.navigateTo({ 
					url: "../my_orderlist/my_orderlist?Inv=5"
				})
			},
			//拨打人工热线
			telphone(phone){
				uni.makePhoneCall({ phoneNumber: phone }) // 传参带入号码即可
			},
			//跳转到房间报修
			navigateToBaoxiu(){
				window.location.href='https://jtishfw.ncjti.edu.cn/baoxiu/repair-h5/#/'
			}
		}
	}
</script>

<style>
	@import url("./css/myself.css");
</style>