hs_hzl_uniapp_ml/pages/user/card.vue

<template>
	<view>
		<view class="view1">
			<view class="cardView">
				<u-row>
					<u-col span="5">
						<view class="lableStyle">
							卡片编号：
						</view>
					</u-col>
					<u-col span="7">
						<view class="cardNoValue">
							{{cardInfo.cardCode}}
						</view>
					</u-col>
				</u-row>
				<u-row>
					<u-col span="5">
						<view class="lableStyle">
							当前积分：
						</view>
					</u-col>
					<u-col span="7">
						<view class="integralValue">
							{{cardInfo.integral}}
						</view>
					</u-col>
				</u-row>
			</view>
		</view>
		<view class="view2">
			<u--text class="payMode1" text="所属机构" :size="26" bold block></u--text>
			<u--text class="payMode2" :text="cardInfo.orgName" :size="18" bold color="#b4b4b4"></u--text>
		</view>
		<view class="view3">
			<view class="payCodeView">
				<u--image :showLoading="true" :src="imgSrc"></u--image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cardInfo: {
					cardCode: '',
					integral: '',
					orgName: '',
				},
				imgSrc: "../../static/uview/willalpImg/750x560-.png",
				from: {
					userName: uni.getStorageSync('userInfo').userName,
					organizationCode: uni.getStorageSync('orgInfo').organizationCode,
				}
			}
		},
		onLoad() {
			this.getCardInfo()
		},
		methods: {
			async getCardInfo() {
				const orgInfo = uni.getStorageSync("orgInfo")
				this.from.organizationName = orgInfo.organizationName
				this.from.userName = uni.getStorageSync('userInfo').userName
				this.from.organizationCode = orgInfo.organizationCode
				// 发送请求
				const {
					data: res
				} = await this.$httpRequest({
					url: '/app/getCardInfo',
					data: this.from,
					urlType: this.$getUrlType()
				});
				if (res.code === 200) {
					if (!res.data.cardCode) {
						uni.showToast({
							duration: 2000,
							title: '没有绑定卡片',
							icon: 'error'
						});
						setTimeout(() => {
							this.$goBack()
						}, 1000)
						return;
					}
					this.cardInfo.cardCode = res.data.cardCode
					this.cardInfo.integral = uni.getStorageSync('userInfo').integral
				}
			}
		}
	}
</script>

<style>
	.view1 {
		margin: 0 10px;
		border-radius: 10px 10px 0 0;
		padding: 5%;
		padding-bottom: 30px;
		background: linear-gradient(to bottom right, #89c7c5, #f1fef9);
	}

	.view2 {
		margin: 0 10px;
		border-radius: 0 0 20px 20px;
		background-color: #f1f1f1;
	}

	.view3 {
		border-radius: 20px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		margin: 10px 10px;
		padding: 5px;
		background-color: #eaeaea;
	}

	.lableStyle {
		color: #555555;
		font-size: 26px;
		font-weight: bold;
	}

	.cardNoValue {
		color: #555555;
		font-size: 26px;
		font-weight: bold;
	}

	.integralValue {
		color: #ff6c6c;
		font-size: 26px;
		font-weight: bold;
	}

	.cardView {
		/* 		padding: 10px;
		height: 40%;
		display: flex;
		flex-direction: row;
		justify-content: center; */
	}

	.sxButton {
		width: 100px;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.payMode1 {
		padding: 10px 0 5px 30px;
	}

	.payMode2 {
		padding: 5px 0 15px 30px;
	}
</style>