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