chore(邀请新用户页): 调整字体大小
This commit is contained in:
hzj
parent
b9269a7c93
commit
f40a1b1798
@ -13,7 +13,7 @@
|
||||
<!-- 确认邀请码 -->
|
||||
<div class="leftBt">
|
||||
<img
|
||||
v-if="showBindingBt"
|
||||
v-if="leftBtType === 'enterCode'"
|
||||
v-smart-img
|
||||
:src="imageUrl(getImgName('enterCode'))"
|
||||
alt=""
|
||||
@ -22,7 +22,7 @@
|
||||
style="display: block"
|
||||
/>
|
||||
<img
|
||||
v-else-if="myInviter.inviterInfo?.userId"
|
||||
v-else-if="leftBtType === 'privateChat'"
|
||||
v-smart-img
|
||||
:src="imageUrl(getImgName('privateChat'))"
|
||||
alt=""
|
||||
@ -58,8 +58,9 @@
|
||||
gap: 4px;
|
||||
"
|
||||
>
|
||||
<div style="font-weight: 590">{{ myInviteInfo.inviteCode || '' }}</div>
|
||||
<div style="font-weight: 590; font-size: 1.1em">{{ myInviteInfo.inviteCode || '' }}</div>
|
||||
<img
|
||||
v-if="myInviteInfo.inviteCode"
|
||||
v-smart-img
|
||||
src="../../assets/icon/copy.png"
|
||||
alt=""
|
||||
@ -130,8 +131,10 @@
|
||||
padding: 2vw;
|
||||
"
|
||||
>
|
||||
<div>{{ t('total_invitations') }}</div>
|
||||
<div>{{ myInviteIncome.validInviteCount || 0 }}</div>
|
||||
<div style="font-weight: 700; font-size: 0.9em">{{ t('total_invitations') }}</div>
|
||||
<div style="font-weight: 600; font-size: 1.2em">
|
||||
{{ myInviteIncome.validInviteCount || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 今日邀请人数 -->
|
||||
@ -144,8 +147,10 @@
|
||||
padding: 2vw;
|
||||
"
|
||||
>
|
||||
<div>{{ t('todays_invitation') }}</div>
|
||||
<div>{{ myInviteIncome.todayInviteCount || 0 }}</div>
|
||||
<div style="font-weight: 700; font-size: 0.9em">{{ t('todays_invitation') }}</div>
|
||||
<div style="font-weight: 600; font-size: 1.2em">
|
||||
{{ myInviteIncome.todayInviteCount || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 总收入 -->
|
||||
@ -158,16 +163,17 @@
|
||||
padding: 2vw;
|
||||
"
|
||||
>
|
||||
<div>{{ t('invitation_total_income') }}</div>
|
||||
<div style="font-weight: 700; font-size: 0.9em">{{ t('invitation_total_income') }}</div>
|
||||
<div style="display: flex; align-items: center">
|
||||
<img
|
||||
v-smart-img
|
||||
src="/src/assets/icon/coin.png"
|
||||
alt=""
|
||||
width="10%"
|
||||
style="display: block"
|
||||
style="display: block; width: 1.5em"
|
||||
/>
|
||||
<div style="font-weight: 590">{{ myInviteIncome.totalIncome || 0 }}</div>
|
||||
<div style="font-weight: 600; font-size: 1.2em">
|
||||
{{ myInviteIncome.totalIncome || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -181,16 +187,17 @@
|
||||
padding: 2vw;
|
||||
"
|
||||
>
|
||||
<div>{{ t('todays_income') }}</div>
|
||||
<div style="font-weight: 700; font-size: 0.9em">{{ t('todays_income') }}</div>
|
||||
<div style="display: flex; align-items: center">
|
||||
<img
|
||||
v-smart-img
|
||||
src="/src/assets/icon/coin.png"
|
||||
alt=""
|
||||
width="10%"
|
||||
style="display: block"
|
||||
style="display: block; width: 1.5em"
|
||||
/>
|
||||
<div style="font-weight: 590">{{ myInviteIncome.todayIncome || 0 }}</div>
|
||||
<div style="font-weight: 600; font-size: 1.2em">
|
||||
{{ myInviteIncome.todayIncome || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</itemCenter>
|
||||
@ -217,7 +224,12 @@
|
||||
>
|
||||
<!-- 头部 -->
|
||||
<div style="width: 100%; display: flex; align-items: center">
|
||||
<div style="flex: 1; font-weight: 590; font-size: 0.85em">{{ t('users') }}</div>
|
||||
<!-- user项 -->
|
||||
<div style="flex: 1; font-weight: 590; font-size: 1em; text-align: center">
|
||||
{{ t('users') }}
|
||||
</div>
|
||||
|
||||
<!-- 时间项 -->
|
||||
<div
|
||||
style="
|
||||
flex: 1;
|
||||
@ -227,6 +239,7 @@
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<!-- 分割线 -->
|
||||
<div
|
||||
style="
|
||||
width: 1px;
|
||||
@ -238,7 +251,12 @@
|
||||
);
|
||||
"
|
||||
></div>
|
||||
<div style="font-weight: 590; font-size: 0.82em">{{ t('remaining_time') }}</div>
|
||||
|
||||
<div style="font-weight: 590; font-size: 1em; text-align: center">
|
||||
{{ t('remaining_time') }}
|
||||
</div>
|
||||
|
||||
<!-- 分割线 -->
|
||||
<div
|
||||
style="
|
||||
width: 1px;
|
||||
@ -251,7 +269,17 @@
|
||||
"
|
||||
></div>
|
||||
</div>
|
||||
<div style="flex: 1; font-weight: 590; text-align: end; font-size: 0.82em">
|
||||
|
||||
<!-- 收入项 -->
|
||||
<div
|
||||
style="
|
||||
flex: 1;
|
||||
font-weight: 590;
|
||||
text-align: end;
|
||||
font-size: 1em;
|
||||
text-align: center;
|
||||
"
|
||||
>
|
||||
{{ t('prowide_income') }}
|
||||
</div>
|
||||
</div>
|
||||
@ -262,7 +290,7 @@
|
||||
v-for="user in myInviteUsers"
|
||||
style="width: 100%; display: flex; align-items: center"
|
||||
>
|
||||
<div style="flex: 1; font-weight: 590; font-size: 0.7em">
|
||||
<div style="flex: 1; font-weight: 590; font-size: 1em; text-align: center">
|
||||
{{ t('user_id_prefix') }}{{ user.invitedUserAccount || '-' }}
|
||||
</div>
|
||||
<div
|
||||
@ -285,7 +313,7 @@
|
||||
);
|
||||
"
|
||||
></div>
|
||||
<div style="font-weight: 590; font-size: 0.7em">
|
||||
<div style="font-weight: 590; font-size: 1em">
|
||||
{{ user.remainingDays || 0 }}{{ t('day_unit') }}
|
||||
</div>
|
||||
<div
|
||||
@ -304,13 +332,18 @@
|
||||
style="
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
"
|
||||
>
|
||||
<img v-smart-img src="/src/assets/icon/coin.png" alt="" width="15%" />
|
||||
<div style="color: #ffb627; font-size: 0.8em; font-weight: 590">
|
||||
<img
|
||||
v-smart-img
|
||||
src="/src/assets/icon/coin.png"
|
||||
alt=""
|
||||
style="display: block; width: 1.1em"
|
||||
/>
|
||||
<div style="color: #ffb627; font-size: 1em; font-weight: 590">
|
||||
{{ user.provideIncome || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
@ -513,8 +546,24 @@ const bindingUserRewards = ref([]) //绑定用户奖励
|
||||
|
||||
const showModule = ref('process') //显示模块
|
||||
|
||||
const showBindingBt = computed(() => {
|
||||
return !myInviter.value.myInfo?.expired && !myInviter.value.inviterInfo
|
||||
const leftBtType = computed(() => {
|
||||
// 数据还未加载完成
|
||||
if (!myInviter.value || Object.keys(myInviter.value).length === 0) {
|
||||
return null
|
||||
}
|
||||
|
||||
// 优先级1: 如果有邀请人信息且有userId，则显示私聊按钮
|
||||
if (myInviter.value.inviterInfo?.userId) {
|
||||
return 'privateChat'
|
||||
}
|
||||
|
||||
// 优先级2: 如果没有过期且没有邀请人，则显示输入邀请码按钮
|
||||
if (!myInviter.value.myInfo?.expired && !myInviter.value.inviterInfo) {
|
||||
return 'enterCode'
|
||||
}
|
||||
|
||||
// 其他情况不显示按钮
|
||||
return null
|
||||
})
|
||||
|
||||
// 展示遮罩层
|
||||
@ -728,7 +777,7 @@ onMounted(() => {
|
||||
<style lang="scss" scoped>
|
||||
* {
|
||||
color: white;
|
||||
font-family: 'SF Pro Text';
|
||||
font-family: 'Baloo 2';
|
||||
}
|
||||
|
||||
.fullPage {
|
||||
@ -749,29 +798,6 @@ onMounted(() => {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 360px) {
|
||||
* {
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 360px) {
|
||||
* {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
* {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
* {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
.leftBt {
|
||||
position: absolute;
|
||||
top: 75vw;
|
||||
@ -793,6 +819,30 @@ onMounted(() => {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 360px) {
|
||||
* {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 360px) {
|
||||
* {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
* {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
* {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
[dir='rtl'] .leftBt {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user