LifePaymentFront.git

New file
			@@ -0,0 +1,110 @@
			<template>
			<ContentView>
			<div class="promotion-qrcode-content" :style="barStyle">
			<div
			class="promotion-qrcode-content-qrcode"
			:style="{ backgroundImage: `url(${OssAssets.common.PromotionQrcodeContentBG})` }"
			>
			<ShareQrcodeView :channles-num="userChannles[0]?.channlesNum" :size="148" />
			<div class="promotion-qrcode-content-qrcode-tips">长按二维码分享好友</div>
			</div>
			<div class="promotion-qrcode-content-btn">点击下载二维码</div>
			</div>
			</ContentView>
			</template>

			<script setup lang="ts">
			import { ShareQrcodeView, ResultWithoutBG } from '@life-payment/components';
			import { useLifeRechargeContext } from '@life-payment/core-vue';
			import { isWeb } from '@/utils/env';
			import { useSystemStore } from '@/stores/modules/system';
			import { CSSProperties } from 'vue';
			import { OssAssets } from '@/constants';

			defineOptions({
			name: 'InnerPage',
			});

			// const { virtualUserInfo } = useUser();
			const { blLifeRecharge } = useLifeRechargeContext();

			const userChannles = computed(() =>
			(blLifeRecharge.accountModel.userChannles ?? []).filter(
			(x) => x.switchType !== blLifeRecharge.constants.LifePaySwitchTypeEnum.微信小程序
			)
			);

			const channlesType = ref(userChannles.value[0]?.channlesNum ?? '');

			watch(userChannles, (val) => {
			channlesType.value = val?.[0]?.channlesNum ?? '';
			});

			const systemStore = useSystemStore();

			const barStyle = computed(
			() =>
			({
			paddingTop: systemStore.info.statusBarHeight + 'px',
			backgroundImage: `url(${OssAssets.common.PromotionQrcodeContentBG})`,
			} as CSSProperties)
			);
			</script>

			<style lang="scss">
			@import '@/styles/common.scss';

			.promotion-qrcode-page-wrapper {
			.promotion-qrcode-content {
			margin-top: 306px;
			width: 100%;
			height: 788px;
			background-size: 100% 100%;
			background-repeat: no-repeat;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			}

			.promotion-qrcode-content-qrcode {
			width: 432px;
			height: 432px;
			display: flex;
			flex-direction: column;
			align-items: center;
			background-size: 100% 100%;
			background-repeat: no-repeat;
			position: relative;
			}

			.promotion-qrcode-content-qrcode-tips {
			font-size: 32px;
			font-weight: bold;
			position: absolute;
			bottom: -22px;
			background: linear-gradient(0.25turn, #63654c 0%, #101f23 39%, #101f23 55%, #0082d3 100%);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			}

			.promotion-qrcode-content-btn {
			width: 432px;
			height: 96px;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: boleGetCssVar('color', 'primary');
			margin-top: 70px;
			border-radius: 12px;
			font-size: 38px;
			font-weight: 500;
			color: #ffffff;
			}

			.share-qrcode-view {
			margin-top: 60px;
			padding: 0;
			}
			}
			</style>