hotelorder_student_h5/pages/myself/myself.vue

<template>
	<view class="content">
		<view class="person">
			<view class="person-left">
				<image class="person_touxiang" v-if="touxiang == ''" src="../../static/my/touxiang.svg"></image>
				<image class="person_touxiang" v-else :src="touxiang"></image>
				<view class="person-info">
					<view>
						<text class="person_name">{{ cardName }}</text>
						<text class="person_identity">{{ cardIdentity }}</text>
					</view>
					<text class="person_phone">{{cardNum}}</text>
				</view>
			</view>
			<view class="person-right">
				<button @tap="shouquan()">重新授权</button>
			</view>
		</view>
		<!-- 第二部分，我的订单 -->
		<view class="my_order">
			<view class="order_title">我的订单</view>
			<view class="order_all" @tap="navigateToDingdan(0)">全部＞</view>
			<view class="item-list">
				<view class="item-list-one" @tap="navigateToDingdan(1)">
					<image src="../../static/my/no_zhifu.svg" class="img-btn"></image>
					<text class="list-txt">待支付</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(2)">
					<image src="../../static/my/dairuzhu.svg" class="img-btn"></image>
					<text class="list-txt">已支付</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(3)">
					<image src="../../static/my/yiruzhu.svg" class="img-btn"></image>
					<text class="list-txt">已入住</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(4)">
					<image src="../../static/my/yiquxiao.svg" class="img-btn"></image>
					<text class="list-txt">已取消</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(7)">
					<image src="../../static/my/dairuzhu.svg" class="img-btn"></image>
					<text class="list-txt">退款中</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(5)">
					<image src="../../static/my/wancheng.svg" class="img-btn"></image>
					<text class="list-txt">已退款</text>
				</view>
				<view class="item-list-one" @tap="navigateToDingdan(6)">
					<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-service">
				<view class="item-list-one" @tap="telphone()">
					<image src="../../static/my/person_phone.svg" class="img-btn"></image>
					<text class="list-txt">人工热线</text>
				</view>
				<view class="item-list-one" @tap="navigateToXuzhi">
					<image src="../../static/my/xuzhi.svg" class="img-btn"></image>
					<text class="list-txt">入住须知</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { accredit } from '@/static/shared.js';
	
	export default {
		data() {
			return {
				phone: '19807957890', //客服热线电话
				cardName: '', //用户名
				cardIdentity: '', //身份
				cardNum: '', //卡号
				touxiang: '',
			}
		},
		onLoad() {
			// 获取用户信息
			this.getUserInfo()
		},
		methods: {
			// 授权
			shouquan() {
				accredit()
			},
			// 跳转到入住须知
			navigateToXuzhi() {
				uni.navigateTo({
					url: "/pages/ruzhuxuzhi/ruzhuxuzhi",
				});
			},
			// 获取用户信息
			getUserInfo() {
				var that = this
				var tempCardNumber = that.$utils.getEncryptedData('cardNumber')
				if (that.$utils.isEmpty(tempCardNumber)) {
					uni.showToast({
						title: '用户卡号为空'
					});
					return;
				}
				that.cardNumber = tempCardNumber;
				that.$myRequest({
					url: '/hotelReservation/zhotel/appuser.action?card_number=' + that.cardNumber,
				}).then(res => {
					// console.log(res);
					let data = res.data.data
					if (res.data.code === 200) {
						that.cardName = data.user_name
						that.cardPhone = data.user_phone
						that.cardNum = data.card_number
						if (data.identity_type === 0) {
							that.cardIdentity = '其它'
						} else if (data.identity_type === 1) {
							that.cardIdentity = '学生'
						} else if (data.identity_type === 4) {
							that.cardIdentity = '教职工'
						} else if (data.identity_type === 5) {
							that.cardIdentity = '校友'
						} else if (data.identity_type === 6) {
							that.cardIdentity = '访客'
						} else {
							that.cardIdentity = '临时人员'
						}
					} else {
						alert('未获得用户数据')
					}
				});
			},
			// 跳转到订单
			navigateToDingdan(index) {
				uni.navigateTo({
					url: "/pages/my_orderlist/my_orderlist?Inv=" + index,
				})
			},
			// 拨打人工热线
			telphone() {
				var that = this
				uni.makePhoneCall({
					phoneNumber: that.phone
				}) // 传参带入号码即可
			},
			// 跳转到房间报修
			navigateToBaoxiu() {
				window.location.href = 'https://jtishfw.ncjti.edu.cn/baoxiu/repair-h5/#/'
			}
		}
	}
</script>

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