feat: 使用新的头部组件，对接语言切换功能并调整布局
This commit is contained in:
hzj
parent
972264b755
commit
7a91f448c0
@ -1,22 +1,13 @@
|
||||
<template>
|
||||
<div style="position: relative; width: 100%">
|
||||
<img :src="bgUrl" alt="" width="100%" style="display: block" />
|
||||
<div
|
||||
style="
|
||||
width: 48%;
|
||||
height: 40%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 3%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<img :src="bgUrl" alt="" width="100%" style="display: block" class="flipImg" />
|
||||
<div class="status">
|
||||
<div
|
||||
style="width: 50%; height: 50%; display: flex; justify-content: center; align-items: center"
|
||||
>
|
||||
<div style="color: #fff; font-weight: 600" :style="{ fontSize }">{{ type }}</div>
|
||||
<div style="color: #fff; font-weight: 600" :style="{ fontSize }">
|
||||
{{ getTypeText(type) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: absolute; inset: 0; padding: 3% 4%">
|
||||
@ -25,20 +16,21 @@
|
||||
>
|
||||
<slot name="content"></slot>
|
||||
</div>
|
||||
<div
|
||||
v-if="type == 'Completed'"
|
||||
class="moreBt"
|
||||
style="position: absolute; top: 40%; right: 4%; color: #bb92ff; font-weight: 500"
|
||||
@click="btMore"
|
||||
>
|
||||
More >
|
||||
</div>
|
||||
<div v-if="type == 'Completed'" class="moreBt" @click="btMore">{{ t('more') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { setDocumentDirection } from '@/locales/i18n'
|
||||
|
||||
const { t, locale } = useI18n()
|
||||
|
||||
// 监听语言变化并设置文档方向
|
||||
locale.value && setDocumentDirection(locale.value)
|
||||
|
||||
const progress = new URL('@/assets/images/BDCenter/progress.png', import.meta.url).href
|
||||
const completed = new URL('@/assets/images/BDCenter/completed.png', import.meta.url).href
|
||||
const progressLong = new URL('@/assets/images/BDCenter/progressLong.png', import.meta.url).href
|
||||
@ -91,6 +83,24 @@ watch(
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
// 根据状态文本返回翻译后的文本
|
||||
const getTypeText = (type) => {
|
||||
console.log('type:', type)
|
||||
|
||||
switch (type) {
|
||||
case 'In Progress':
|
||||
return t('in_progress')
|
||||
case 'Completed':
|
||||
return t('completed')
|
||||
case 'Out of account':
|
||||
return t('out_of_account')
|
||||
case 'Pending':
|
||||
return t('pending')
|
||||
default:
|
||||
return type
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -110,6 +120,36 @@ watch(
|
||||
|
||||
.moreBt {
|
||||
font-size: 1em;
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
right: 4%;
|
||||
color: #bb92ff;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.status {
|
||||
width: 48%;
|
||||
height: 40%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 3%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
[dir='rtl'] .status {
|
||||
right: auto;
|
||||
left: 3%;
|
||||
}
|
||||
|
||||
[dir='rtl'] .flipImg {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
[dir='rtl'] .moreBt {
|
||||
right: auto;
|
||||
left: 4%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 360px) {
|
||||
|
||||
@ -95,6 +95,7 @@
|
||||
"succeed": "ينجح",
|
||||
"seller_records": "سجل البائع",
|
||||
"bd_center": "مركز bd",
|
||||
"bd_leader_center": "مركز القيادة BD",
|
||||
"total_team_salary": "إجمالي رواتب الفريق：",
|
||||
"last_month": "الشهر الماضي",
|
||||
"this_month": "هذا الشهر",
|
||||
|
||||
@ -95,6 +95,7 @@
|
||||
"succeed": "Succeed",
|
||||
"seller_records": "Seller Records",
|
||||
"bd_center": "BD Center",
|
||||
"bd_leader_center": "BD Leader Center",
|
||||
"total_team_salary": "Total team salary：",
|
||||
"last_month": "Last month：",
|
||||
"this_month": "This month：",
|
||||
|
||||
@ -95,6 +95,7 @@
|
||||
"succeed": "成功",
|
||||
"seller_records": "卖家记录",
|
||||
"bd_center": "BD中心",
|
||||
"bd_leader_center": "BD中心",
|
||||
"total_team_salary": "团队总工资",
|
||||
"last_month": "上个月",
|
||||
"this_month": "这个月",
|
||||
|
||||
@ -1,7 +1,13 @@
|
||||
<template>
|
||||
<div class="bd-center gradient-background-circles">
|
||||
<!-- 顶部导航 -->
|
||||
<MobileHeader title="BD Center" :isHomePage="true" />
|
||||
<GeneralHeader
|
||||
:title="t('bd_center')"
|
||||
:isHomePage="true"
|
||||
:showLanguageList="true"
|
||||
color="black"
|
||||
style="box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); z-index: 999"
|
||||
/>
|
||||
|
||||
<!-- 主要内容 -->
|
||||
<div
|
||||
@ -26,7 +32,7 @@
|
||||
<!-- APP连接状态指示 -->
|
||||
<div v-if="isInApp() && !appConnected" class="app-status connecting">
|
||||
<div class="status-indicator"></div>
|
||||
<span>正在连接APP...</span>
|
||||
<span>{{ t('loading') }}...</span>
|
||||
</div>
|
||||
|
||||
<!-- 用户信息 -->
|
||||
@ -86,7 +92,7 @@
|
||||
@click="gotoIncome"
|
||||
>
|
||||
<span style="font-weight: 600; color: #1f2937">
|
||||
Available income:${{ salaryInfo.currentSalary }}
|
||||
{{ t('available_salaries') }} ${{ salaryInfo.currentSalary }}
|
||||
</span>
|
||||
<img src="../assets/icon/arrow.png" alt="" style="display: block; width: 20px" />
|
||||
</div>
|
||||
@ -111,7 +117,7 @@
|
||||
@click="goToInviteAgency"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<span style="font-weight: 600; color: #1f2937"> Invite User To Become Agency</span>
|
||||
<span style="font-weight: 600; color: #1f2937"> {{ t('invite_become_agent') }}</span>
|
||||
<img src="../assets/icon/arrow.png" alt="" style="display: block; width: 20px" />
|
||||
</div>
|
||||
</div>
|
||||
@ -144,7 +150,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 600">
|
||||
Team total recharge: ${{ BDData.totalRecharge }} Team total salary: ${{
|
||||
{{ t('team_recharge') }}: ${{ BDData.totalRecharge }} {{ t('total_team_salary') }}: ${{
|
||||
BDData.totalSalary
|
||||
}}
|
||||
</div>
|
||||
@ -207,12 +213,14 @@
|
||||
style="width: 40%; display: flex; flex-direction: column; justify-content: space-around"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Salary: ${{ BDInfo.teamSalaryAmount }}
|
||||
{{ t('salary') }}: ${{ BDInfo.teamSalaryAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Recharge: ${{ BDInfo.teamRechargeAmount }}
|
||||
{{ t('recharge') }}: ${{ BDInfo.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('host') }}:{{ BDInfo.teamMemberCount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Host:{{ BDInfo.teamMemberCount }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -252,10 +260,10 @@
|
||||
<div>
|
||||
<div style="display: grid; gap: 4px">
|
||||
<div style="font-size: 0.9em; font-weight: 600">
|
||||
Total income:${{ BDSalary.totalIncome }}
|
||||
{{ t('total_income') }}: ${{ BDSalary.totalIncome }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em; font-weight: 600">
|
||||
Previous period income:${{ BDSalary.previousPeriodIncome }}
|
||||
{{ t('last_month') }}: ${{ BDSalary.previousPeriodIncome }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -272,9 +280,13 @@
|
||||
>
|
||||
<template v-if="income.statusText == 'In Progress'" v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div style="font-size: 0.9em">Number of teams: {{ income.agencyNumber }}</div>
|
||||
<div style="font-size: 0.9em">
|
||||
{{ t('agency_number') }}: {{ income.agencyNumber }}
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">Team salary: ${{ income.teamSalaryAmount }}</div>
|
||||
<div style="font-size: 0.9em">
|
||||
{{ t('team_salary') }}: ${{ income.teamSalaryAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (salary): ${{ income.bdIncomeSalary || 0 }} ({{
|
||||
income.bdRatioSalary || 0
|
||||
@ -283,7 +295,7 @@
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">
|
||||
Team top-up: ${{ income.teamRechargeAmount }}
|
||||
{{ t('team_recharge') }}: ${{ income.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (top-up): ${{ income.bdIncomeRecharge || 0 }} ({{
|
||||
@ -295,10 +307,12 @@
|
||||
|
||||
<template v-else v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div style="font-size: 0.9em">Number Of Teams: {{ income.agencyNumber }}</div>
|
||||
<div style="font-size: 0.9em">
|
||||
{{ t('agency_number') }}: {{ income.agencyNumber }}
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">
|
||||
Team top-up: ${{ income.teamRechargeAmount }}
|
||||
{{ t('team_recharge') }}: ${{ income.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (top-up): ${{ income.bdIncomeRecharge || 0 }} ({{
|
||||
@ -329,9 +343,8 @@
|
||||
>
|
||||
<div style="font-weight: 600">{{ BDSalaryMore.period }}</div>
|
||||
<div style="font-size: 0.7em; font-weight: 600">
|
||||
Team total recharge: ${{ BDSalaryMore.teamTotalRecharge }}, Team total salary: ${{
|
||||
BDSalaryMore.teamTotalSalary
|
||||
}}
|
||||
{{ t('team_recharge') }}: ${{ BDSalaryMore.teamTotalRecharge }},
|
||||
{{ t('total_team_salary') }}: ${{ BDSalaryMore.teamTotalSalary }}
|
||||
</div>
|
||||
<div
|
||||
v-for="member in BDSalaryMore.memberDetails"
|
||||
@ -394,9 +407,15 @@
|
||||
justify-content: space-around;
|
||||
"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Salary: ${{ member.salary }}</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Recharge: ${{ member.recharge }}</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Host:{{ member.hostCount }}</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('salary') }}: ${{ member.salary }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('recharge') }}: ${{ member.recharge }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('host') }}:{{ member.hostCount }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -407,8 +426,9 @@
|
||||
|
||||
<script setup>
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useRouter } from 'vue-router'
|
||||
import MobileHeader from '@/components/MobileHeader.vue'
|
||||
import GeneralHeader from '@/components/GeneralHeader.vue'
|
||||
import { getAgentMonthLastTarget, getAgentMonthTarget, getBdAgentList } from '@/api/teamBill.js'
|
||||
import { getBdMemberBillList, getBdHistory, getBdHistoryMore } from '@/api/bdCenter.js'
|
||||
import { getTeamId } from '@/utils/userStore.js'
|
||||
@ -417,9 +437,14 @@ import { isInApp } from '@/utils/appBridge.js'
|
||||
import { clearSelectedPayee } from '@/utils/payeeStore.js'
|
||||
import maskLayer from '@/components/MaskLayer.vue'
|
||||
import historySalary from '@/components/historySalary.vue'
|
||||
import { setDocumentDirection } from '@/locales/i18n'
|
||||
|
||||
const { t, locale } = useI18n()
|
||||
const router = useRouter()
|
||||
|
||||
// 监听语言变化并设置文档方向
|
||||
locale.value && setDocumentDirection(locale.value)
|
||||
|
||||
// 当前身份
|
||||
const teamMemberCount = ref(0)
|
||||
const showHistory = ref(false) //历史弹窗
|
||||
@ -541,6 +566,9 @@ onMounted(() => {
|
||||
.bd-center {
|
||||
max-height: 100vh;
|
||||
overflow-y: auto;
|
||||
font-family: -apple-system, BlinkMacSystemFont, sans-serif;
|
||||
background-color: #ffffff;
|
||||
background-image: url(../assets/images/secondBg.png);
|
||||
}
|
||||
|
||||
.bd-center::-webkit-scrollbar {
|
||||
@ -612,4 +640,14 @@ onMounted(() => {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
/* RTL支持 */
|
||||
[dir='rtl'] .avatar {
|
||||
margin-right: 0;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
[dir='rtl'] .user-info {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,7 +1,13 @@
|
||||
<template>
|
||||
<div class="bd-center gradient-background-circles">
|
||||
<!-- 顶部导航 -->
|
||||
<MobileHeader title="BD Leader Center" :isHomePage="true" />
|
||||
<GeneralHeader
|
||||
:title="t('bd_leader_center')"
|
||||
:isHomePage="true"
|
||||
:showLanguageList="true"
|
||||
color="black"
|
||||
style="box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); z-index: 999"
|
||||
/>
|
||||
|
||||
<!-- 主要内容 -->
|
||||
<div
|
||||
@ -26,7 +32,7 @@
|
||||
<!-- APP连接状态指示 -->
|
||||
<div v-if="isInApp() && !appConnected" class="app-status connecting">
|
||||
<div class="status-indicator"></div>
|
||||
<span>正在连接APP...</span>
|
||||
<span>{{ t('loading') }}...</span>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; align-items: center">
|
||||
@ -81,7 +87,7 @@
|
||||
@click="gotoIncome"
|
||||
>
|
||||
<span style="font-weight: 600; color: #1f2937">
|
||||
Available income: ${{ salaryInfo.currentSalary }}
|
||||
{{ t('available_salaries') }} ${{ salaryInfo.currentSalary }}
|
||||
</span>
|
||||
<img src="../../assets/icon/arrow.png" alt="" style="display: block; width: 20px" />
|
||||
</div>
|
||||
@ -103,7 +109,7 @@
|
||||
@click="goToInviteAgency"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<span style="font-weight: 600; color: #1f2937"> Invite User To Become Agency</span>
|
||||
<span style="font-weight: 600; color: #1f2937"> {{ t('invite_become_agent') }}</span>
|
||||
<img src="../../assets/icon/arrow.png" alt="" style="display: block; width: 20px" />
|
||||
</div>
|
||||
</div>
|
||||
@ -122,7 +128,9 @@
|
||||
@click="goToInviteBD"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<span style="font-weight: 600; color: #1f2937"> Invite User To Become BD</span>
|
||||
<span style="font-weight: 600; color: #1f2937">
|
||||
{{ t('invite') }} User To Become BD</span
|
||||
>
|
||||
<img src="../../assets/icon/arrow.png" alt="" style="display: block; width: 20px" />
|
||||
</div>
|
||||
</div>
|
||||
@ -159,7 +167,7 @@
|
||||
{{ tab.name }}
|
||||
</button>
|
||||
<!-- 移动下划线 -->
|
||||
<div
|
||||
<!-- <div
|
||||
:style="{
|
||||
position: 'absolute',
|
||||
bottom: '0',
|
||||
@ -169,7 +177,7 @@
|
||||
width: `${100 / tabs.length}%`,
|
||||
left: `${(activeTab - 1) * (100 / tabs.length)}%`,
|
||||
}"
|
||||
></div>
|
||||
></div> -->
|
||||
</div>
|
||||
|
||||
<!-- BD 标签内容 -->
|
||||
@ -184,7 +192,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 600; margin-bottom: 12px">
|
||||
Team total recharge: ${{ BDData.totalRecharge }}, Team total salary: ${{
|
||||
{{ t('team_recharge') }}: ${{ BDData.totalRecharge }}, {{ t('total_team_salary') }}: ${{
|
||||
BDData.totalSalary
|
||||
}}
|
||||
</div>
|
||||
@ -251,13 +259,13 @@
|
||||
"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Salary: ${{ BDInfo.teamSalaryAmount }}
|
||||
{{ t('salary') }}: ${{ BDInfo.teamSalaryAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Recharge: ${{ BDInfo.teamRechargeAmount }}
|
||||
{{ t('recharge') }}: ${{ BDInfo.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Host:{{ BDInfo.teamMemberCount }}
|
||||
{{ t('host') }}:{{ BDInfo.teamMemberCount }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -276,9 +284,8 @@
|
||||
/>
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 600; margin-bottom: 12px">
|
||||
Team total recharge: ${{ BDLeaderData.totalRecharge || 0 }}, Team total salary: ${{
|
||||
BDLeaderData.totalSalary || 0
|
||||
}}
|
||||
{{ t('team_recharge') }}: ${{ BDLeaderData.totalRecharge || 0 }},
|
||||
{{ t('total_team_salary') }}: ${{ BDLeaderData.totalSalary || 0 }}
|
||||
</div>
|
||||
|
||||
<!-- 团队成员列表 -->
|
||||
@ -343,10 +350,10 @@
|
||||
"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Team Salary: ${{ BDInfo.teamSalaryAmount }}
|
||||
{{ t('team_salary') }}: ${{ BDInfo.teamSalaryAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Agencies: {{ BDInfo.teamMemberCount }}
|
||||
{{ t('agency') }}: {{ BDInfo.teamMemberCount }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -391,12 +398,12 @@
|
||||
<div>
|
||||
<div style="display: grid; gap: 4px">
|
||||
<div style="font-size: 0.9em; font-weight: 600">
|
||||
Total income: ${{
|
||||
{{ t('total_income') }}: ${{
|
||||
currentHistoryType === 'bd' ? BDSalary.totalIncome : BDLeaderSalary.totalIncome
|
||||
}}
|
||||
</div>
|
||||
<div style="font-size: 0.9em; font-weight: 600">
|
||||
Previous period income: ${{
|
||||
{{ t('last_month') }}: ${{
|
||||
currentHistoryType === 'bd'
|
||||
? BDSalary.previousPeriodIncome
|
||||
: BDLeaderSalary.previousPeriodIncome
|
||||
@ -419,10 +426,12 @@
|
||||
>
|
||||
<template v-if="income.statusText == 'In Progress'" v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div style="font-size: 0.9em">Number of teams: {{ income.agencyNumber }}</div>
|
||||
<div style="font-size: 0.9em">
|
||||
{{ t('agency_number') }}: {{ income.agencyNumber }}
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">
|
||||
Team salary: ${{ income.teamSalaryAmount }}
|
||||
{{ t('team_salary') }}: ${{ income.teamSalaryAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (salary): ${{ income.bdIncomeSalary || 0 }} ({{
|
||||
@ -432,7 +441,7 @@
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">
|
||||
Team top-up: ${{ income.teamRechargeAmount }}
|
||||
{{ t('team_recharge') }}: ${{ income.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (top-up): ${{ income.bdIncomeRecharge || 0 }} ({{
|
||||
@ -444,10 +453,12 @@
|
||||
|
||||
<template v-else v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div style="font-size: 0.9em">Number Of Teams: {{ income.agencyNumber }}</div>
|
||||
<div style="font-size: 0.9em">
|
||||
{{ t('agency_number') }}: {{ income.agencyNumber }}
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 0.9em">
|
||||
Team top-up: ${{ income.teamRechargeAmount }}
|
||||
{{ t('team_recharge') }}: ${{ income.teamRechargeAmount }}
|
||||
</div>
|
||||
<div style="font-size: 0.9em">
|
||||
BD income (top-up): ${{ income.bdIncomeRecharge || 0 }} ({{
|
||||
@ -470,15 +481,15 @@
|
||||
<template v-if="income.statusText == 'In Progress'" v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px">
|
||||
<div>Number Of BDs: {{ income.bdNumber }}</div>
|
||||
<div>Team Salary: ${{ income.teamSalaryAmount }}</div>
|
||||
<div>{{ t('bd_number') }}: {{ income.bdNumber }}</div>
|
||||
<div>{{ t('team_salary') }}: ${{ income.teamSalaryAmount }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else v-slot:content>
|
||||
<div>{{ income.billTitle }}</div>
|
||||
<div>Number Of Teams: {{ income.bdNumber }}</div>
|
||||
<div>Team Top-Up: ${{ income.teamSalaryAmount }}</div>
|
||||
<div>{{ t('agent_number') }}: {{ income.bdNumber }}</div>
|
||||
<div>{{ t('team_recharge') }}: ${{ income.teamSalaryAmount }}</div>
|
||||
</template>
|
||||
</historySalary>
|
||||
</template>
|
||||
@ -505,9 +516,8 @@
|
||||
>
|
||||
<div style="font-weight: 600">{{ SalaryMore.period }}</div>
|
||||
<div style="font-size: 0.7em; font-weight: 600">
|
||||
Team total recharge: ${{ SalaryMore.teamTotalRecharge }}, Team total salary: ${{
|
||||
SalaryMore.teamTotalSalary
|
||||
}}
|
||||
{{ t('team_recharge') }}: ${{ SalaryMore.teamTotalRecharge }},
|
||||
{{ t('total_team_salary') }}: ${{ SalaryMore.teamTotalSalary }}
|
||||
</div>
|
||||
<div
|
||||
v-for="member in SalaryMore.memberDetails"
|
||||
@ -568,11 +578,15 @@
|
||||
justify-content: space-around;
|
||||
"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Salary: ${{ member.salary }}</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Recharge: ${{ member.recharge }}
|
||||
{{ t('salary') }}: ${{ member.salary }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('recharge') }}: ${{ member.recharge }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('host') }}:{{ member.hostCount }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Host:{{ member.hostCount }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -594,7 +608,9 @@
|
||||
>
|
||||
<div style="font-weight: 600">{{ SalaryMore.period }}</div>
|
||||
<div style="font-size: 0.7em; font-weight: 600">
|
||||
Team Salary: ${{ SalaryMore.teamSalary }}, BD number:{{ SalaryMore.bdNumber }}
|
||||
{{ t('team_salary') }}: ${{ SalaryMore.teamSalary }}, {{ t('bd_number') }}:{{
|
||||
SalaryMore.bdNumber
|
||||
}}
|
||||
</div>
|
||||
<div
|
||||
v-for="member in SalaryMore.memberDetails"
|
||||
@ -655,9 +671,11 @@
|
||||
justify-content: space-around;
|
||||
"
|
||||
>
|
||||
<div style="font-size: 0.8em; font-weight: 500">Salary: ${{ member.salary }}</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
Agencies:{{ member.agencyCount }}
|
||||
{{ t('salary') }}: ${{ member.salary }}
|
||||
</div>
|
||||
<div style="font-size: 0.8em; font-weight: 500">
|
||||
{{ t('agency') }}:{{ member.agencyCount }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -670,8 +688,9 @@
|
||||
|
||||
<script setup>
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useRouter } from 'vue-router'
|
||||
import MobileHeader from '@/components/MobileHeader.vue'
|
||||
import GeneralHeader from '@/components/GeneralHeader.vue'
|
||||
import { isInApp } from '@/utils/appBridge.js'
|
||||
import maskLayer from '@/components/MaskLayer.vue'
|
||||
import { clearSelectedPayee } from '@/utils/payeeStore.js'
|
||||
@ -679,9 +698,14 @@ import historySalary from '@/components/historySalary.vue'
|
||||
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
|
||||
import { getBdMemberBillList, getBdHistory, getBdHistoryMore } from '@/api/bdCenter.js'
|
||||
import { getBdLeaderHistory, getBdLeaderHistoryMore } from '@/api/bdLeaderCenter'
|
||||
import { setDocumentDirection } from '@/locales/i18n'
|
||||
|
||||
const { t, locale } = useI18n()
|
||||
const router = useRouter()
|
||||
|
||||
// 监听语言变化并设置文档方向
|
||||
locale.value && setDocumentDirection(locale.value)
|
||||
|
||||
// 标签页数据
|
||||
const tabs = ref([
|
||||
{ id: 1, name: 'BD' },
|
||||
@ -857,6 +881,9 @@ onMounted(() => {
|
||||
.bd-center {
|
||||
max-height: 100vh;
|
||||
overflow-y: auto;
|
||||
font-family: -apple-system, BlinkMacSystemFont, sans-serif;
|
||||
background-color: #ffffff;
|
||||
background-image: url(../../assets/images/secondBg.png);
|
||||
}
|
||||
|
||||
.bd-center::-webkit-scrollbar {
|
||||
@ -910,4 +937,14 @@ onMounted(() => {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
/* RTL支持 */
|
||||
[dir='rtl'] .avatar {
|
||||
margin-right: 0;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
[dir='rtl'] .user-info {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user