feat(充值代理页): 新增每月一号“选择用户转账金额限制”按钮功能，计时设置为每1h检查一次
This commit is contained in:
hzj
parent
f779c349df
commit
d7e88de707
@ -34,10 +34,16 @@
|
||||
src="../../assets/icon/identity/coinSeller.png"
|
||||
alt=""
|
||||
height="20px"
|
||||
style="margin-left: 10px"
|
||||
style="display: block; margin-left: 10px"
|
||||
/>
|
||||
</div>
|
||||
<img @click="goToRecords" src="../../assets/icon/records.png" height="20px" alt="" />
|
||||
<img
|
||||
@click="goToRecords"
|
||||
src="../../assets/icon/records.png"
|
||||
height="20px"
|
||||
alt=""
|
||||
style="display: block; object-fit: cover"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 用户信息卡片 -->
|
||||
@ -82,6 +88,55 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 设置最小接收金额 -->
|
||||
<div
|
||||
style="
|
||||
background-color: white;
|
||||
padding: 16px;
|
||||
border-radius: 12px;
|
||||
margin-bottom: 16px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
"
|
||||
>
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; gap: 4px">
|
||||
<div style="font-weight: 600">Minimum amount of transfers accepted:</div>
|
||||
<img
|
||||
src="../../assets/icon/help.png"
|
||||
height="20px"
|
||||
alt=""
|
||||
style="display: block; object-fit: cover"
|
||||
@click="showHelpTip = true"
|
||||
/>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-around; align-items: center; gap: 10px">
|
||||
<div
|
||||
v-for="amountItem in AmountList"
|
||||
style="
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
align-self: stretch;
|
||||
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
|
||||
|
||||
padding: 10px;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
"
|
||||
:style="amountStyle(amountItem)"
|
||||
@click="selectAmount(amountItem)"
|
||||
>
|
||||
<div style="font-weight: 700">{{ amountItem.type }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 用户搜索部分 -->
|
||||
<div class="user-section">
|
||||
<div style="margin-bottom: 12px; font-weight: 600; color: #333">
|
||||
@ -163,19 +218,119 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 遮罩层 -->
|
||||
<maskLayer :maskLayerShow="maskLayerShow" @click="closedPopup">
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<!-- 帮助提示弹窗 -->
|
||||
<div
|
||||
v-if="showHelpTip"
|
||||
style="
|
||||
width: 80%;
|
||||
border-radius: 12px;
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
"
|
||||
@click.stop
|
||||
>
|
||||
<div style="position: relative; width: 100%">
|
||||
<div style="text-align: center; color: rgba(0, 0, 0, 0.8); font-weight: 800">
|
||||
{{ t('tips') }}
|
||||
</div>
|
||||
|
||||
<!-- 关闭按钮 -->
|
||||
<div style="position: absolute; top: 0; right: 0" @click="closedPopup">X</div>
|
||||
</div>
|
||||
<div style="color: rgba(0, 0, 0, 0.5); font-weight: 600; text-align: center">
|
||||
Recharge agents can choose the minimumamount they can accept from user transfers,which
|
||||
can be modifed on the frst of eachmonth. (For example, if a recharge agentchanges to
|
||||
only accept transfers of $10 or more,users with single transfers below $10 will not
|
||||
beable to transfer funds to that recharge agent.)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 设置转账确认弹窗 -->
|
||||
<div
|
||||
v-if="showTransfersTip"
|
||||
style="
|
||||
width: 80%;
|
||||
border-radius: 12px;
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
"
|
||||
@click.stop
|
||||
>
|
||||
<div style="color: rgba(0, 0, 0, 0.8); font-weight: 800">{{ t('tips') }}</div>
|
||||
<div style="color: rgba(0, 0, 0, 0.5); font-weight: 600; text-align: center">
|
||||
Are you sure you want to select this transfer amount limit?
|
||||
</div>
|
||||
<div
|
||||
style="width: 100%; display: flex; justify-content: space-around; align-items: center"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
padding: 12px 20px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #e6e6e6;
|
||||
color: rgba(0, 0, 0, 0.4);
|
||||
font-weight: 800;
|
||||
"
|
||||
@click="Cancel"
|
||||
>
|
||||
{{ t('cancel') }}
|
||||
</div>
|
||||
<div
|
||||
style="
|
||||
padding: 12px 20px;
|
||||
border-radius: 12px;
|
||||
background: linear-gradient(
|
||||
152deg,
|
||||
rgba(198, 112, 255, 0.6) 7.01%,
|
||||
rgba(119, 38, 255, 0.6) 92.99%
|
||||
);
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-weight: 800;
|
||||
"
|
||||
@click="Confirm"
|
||||
>
|
||||
{{ t('confirm') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</maskLayer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { ref, computed, onMounted, onUnmounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import GeneralHeader from '@/components/GeneralHeader.vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { setDocumentDirection } from '@/locales/i18n'
|
||||
import { getSelectedUser } from '@/utils/coinSellerStore.js'
|
||||
import { checkFreightDealer, getFreightBalance, freightRecharge } from '@/api/wallet.js'
|
||||
import { showError, showSuccess } from '@/utils/toast.js'
|
||||
import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
|
||||
import { setDocumentDirection } from '@/locales/i18n'
|
||||
|
||||
import { checkFreightDealer, getFreightBalance, freightRecharge } from '@/api/wallet.js'
|
||||
|
||||
import GeneralHeader from '@/components/GeneralHeader.vue'
|
||||
import maskLayer from '@/components/MaskLayer.vue'
|
||||
|
||||
const { t, locale } = useI18n()
|
||||
const router = useRouter()
|
||||
@ -191,12 +346,97 @@ const checkingAccess = ref(true)
|
||||
const coinsAmount = ref('0')
|
||||
const loadingBalance = ref(false)
|
||||
|
||||
const AmountList = ref([
|
||||
{
|
||||
id: 1,
|
||||
type: '>$0',
|
||||
selectedStatus: true,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: '>=$10',
|
||||
selectedStatus: false,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: '>=$20',
|
||||
selectedStatus: false,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: '>=$50',
|
||||
selectedStatus: false,
|
||||
},
|
||||
])
|
||||
const selectedAmount = ref({})
|
||||
// 是否为每月一号
|
||||
const isFirstDay = ref(false)
|
||||
|
||||
// 更新是否为每月一号
|
||||
const updateIsFirstDay = () => {
|
||||
const today = new Date()
|
||||
isFirstDay.value = today.getDate() === 1
|
||||
}
|
||||
|
||||
// 选项样式
|
||||
const amountStyle = (amountItem) => {
|
||||
if (amountItem.selectedStatus) {
|
||||
return 'border: 1px solid #7726ff;background: #fff;'
|
||||
} else if (isFirstDay.value) {
|
||||
return 'border: 1px solid transparent;background: transparent;'
|
||||
} else {
|
||||
return 'border: 1px solid transparent;background: rgba(0, 0, 0, 0.2);'
|
||||
}
|
||||
}
|
||||
|
||||
// 弹窗提示
|
||||
const showHelpTip = ref(false) //帮助提示弹窗
|
||||
const showTransfersTip = ref(false) //设置转账确认弹窗
|
||||
const maskLayerShow = computed(() => {
|
||||
return showHelpTip.value || showTransfersTip.value
|
||||
})
|
||||
|
||||
// 选中的用户
|
||||
const selectedUser = ref({
|
||||
id: '',
|
||||
name: '',
|
||||
})
|
||||
|
||||
// 关闭弹窗
|
||||
const closedPopup = () => {
|
||||
showHelpTip.value = false
|
||||
showTransfersTip.value = false
|
||||
}
|
||||
|
||||
// 选择限制转账金额
|
||||
const selectAmount = (amountItem) => {
|
||||
// 非每月一号
|
||||
if (!isFirstDay.value || amountItem.selectedStatus) return
|
||||
|
||||
console.log('选择限制转账金额', amountItem)
|
||||
selectedAmount.value = amountItem //设置选中的金额
|
||||
showTransfersTip.value = true //展示确认弹窗
|
||||
}
|
||||
|
||||
// 取消选择
|
||||
const Cancel = () => {
|
||||
console.log('取消选择')
|
||||
|
||||
selectedAmount.value = {} //清空选中的金额
|
||||
closedPopup()
|
||||
}
|
||||
|
||||
// 确认选择
|
||||
const Confirm = () => {
|
||||
console.log('确认选择')
|
||||
|
||||
// 发送接口
|
||||
try {
|
||||
} catch (error) {}
|
||||
|
||||
closedPopup()
|
||||
}
|
||||
|
||||
// 校验销售商权限
|
||||
const checkDealerAccess = async () => {
|
||||
try {
|
||||
@ -242,7 +482,7 @@ const fetchFreightBalance = async () => {
|
||||
const defaultAvatarUrl = (e) => {
|
||||
console.log('头像资源出错')
|
||||
e.target.onerror = null //防止循环
|
||||
e.target.src = new URL('/src/assets/images/WeeklyStar/defaultAvatar.png', import.meta.url).href
|
||||
e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
|
||||
}
|
||||
|
||||
// 初始化用户信息
|
||||
@ -337,6 +577,22 @@ const { userInfo } = usePageInitializationWithConfig('COIN_SELLER', {
|
||||
initializeUser()
|
||||
},
|
||||
})
|
||||
|
||||
// 定时检查（可选）
|
||||
let dayCheckInterval = null
|
||||
|
||||
onMounted(() => {
|
||||
// 初始化
|
||||
updateIsFirstDay()
|
||||
// 每小时检查一次是否进入新一天
|
||||
dayCheckInterval = setInterval(updateIsFirstDay, 60 * 60 * 1000)
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
if (dayCheckInterval) {
|
||||
clearInterval(dayCheckInterval)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user