@@ -6,21 +6,20 @@ import type {
} from '#/adapter/vxe-table' ;
import type { AgentApi } from '#/api/agent' ;
import { computed } from 'vue' ;
import { computed , ref } from 'vue' ;
import { useRoute , useRouter } from 'vue-router' ;
import { Page , useVbenDrawer , useVbenModal } from '@vben/common-ui' ;
import { Button , Card , Dropdown , Menu } from 'ant-design-vue' ;
import { Button , Card , Dropdown , Form , Input , Menu , Modal , message } from 'ant-design-vue' ;
import { useVbenVxeGrid } from '#/adapter/vxe-table' ;
import { getAgentList } from '#/api/agent' ;
import { getAgentList , updateAgentMobile } from '#/api/agent' ;
import { useColumns , useGridFormSchema } from './data' ;
import CommissionModal from './modules/commission-modal.vue' ;
import Form from './modules/form.vue' ;
import FormDrawerContent from './modules/form.vue' ;
import LinkModal from './modules/link-modal.vue' ;
import MobileEditModal from './modules/mobile-edit-modal.vue' ;
import OrderModal from './modules/order-modal.vue' ;
import RebateModal from './modules/rebate-modal.vue' ;
import DowngradeModal from './modules/downgrade-modal.vue' ;
@@ -32,7 +31,7 @@ const router = useRouter();
// 表单抽屉
const [ FormDrawer , formDrawerApi ] = useVbenDrawer ( {
connectedComponent : Form ,
connectedComponent : FormDrawerContent ,
destroyOnClose : true ,
} ) ;
@@ -72,11 +71,48 @@ const [WithdrawalModalComponent, withdrawalModalApi] = useVbenModal({
destroyOnClose : true ,
} ) ;
// 修改手机号弹窗
const [ M obileEditModalComponent , mobileEditModalApi ] = useVbenModal ( {
connectedComponent : MobileEditModal ,
destroyOnClose : true ,
} ) ;
// 修改手机号:本页 Modal + 表单
const m obileEditVisible = ref ( false ) ;
const mobileEditRow = ref < AgentApi .AgentListItem | null > ( null ) ;
const mobileEditNewMobile = ref ( '' ) ;
const mobileEditLoading = ref ( false ) ;
function openMobileEdit ( row : AgentApi . AgentListItem ) {
mobileEditRow . value = row ;
mobileEditNewMobile . value = row . mobile ? ? '' ;
mobileEditVisible . value = true ;
}
function closeMobileEdit ( ) {
mobileEditVisible . value = false ;
mobileEditRow . value = null ;
mobileEditNewMobile . value = '' ;
}
async function submitMobileEdit ( ) {
const row = mobileEditRow . value ;
if ( ! row ) return ;
const mobile = mobileEditNewMobile . value ? . trim ( ) ;
if ( ! mobile ) {
message . warning ( '请输入新手机号' ) ;
return ;
}
if ( ! /^1[3-9]\d{9}$/ . test ( mobile ) ) {
message . warning ( '请输入正确的11位手机号' ) ;
return ;
}
mobileEditLoading . value = true ;
try {
await updateAgentMobile ( { agent _id : String ( row . id ) , mobile } ) ;
message . success ( '手机号修改成功' ) ;
closeMobileEdit ( ) ;
onRefresh ( ) ;
} catch {
message . error ( '手机号修改失败' ) ;
} finally {
mobileEditLoading . value = false ;
}
}
// 代理降级弹窗
const [ DowngradeModalComponent , downgradeModalApi ] = useVbenModal ( {
@@ -196,10 +232,6 @@ function onActionClick(
onViewCommission ( e . row ) ;
break ;
}
case 'edit-mobile' : {
onEditMobile ( e . row ) ;
break ;
}
case 'edit' : {
onEdit ( e . row ) ;
break ;
@@ -295,7 +327,6 @@ function onRefresh() {
< Page auto -content -height >
< FormDrawer @success ="onRefresh" / >
< LinkModalComponent / >
< MobileEditModalComponent @success ="onRefresh" / >
< DowngradeModalComponent @success ="onRefresh" / >
< CommissionModalComponent / >
< RebateModalComponent / >
@@ -320,6 +351,9 @@ function onRefresh() {
< Button type = "link" @click ="onActionClick({ code: 'view-sub-agent', row })" >
查看下级
< / Button >
< Button type = "link" @click ="openMobileEdit(row)" >
修改手机号
< / Button >
< ! - - < Button
type = "link"
@click ="onActionClick({ code: 'order-record', row })"
@@ -329,15 +363,33 @@ function onRefresh() {
< Dropdown >
< Button type = "link" > 更多操作 < / Button >
< template # overlay >
< Menu
:items = "getMoreMenuItems(row)"
@click ="(e) => onActionClick({ code: String(e.key), row })"
/ >
< Menu :items = "getMoreMenuItems(row)" @click ="(e) => onActionClick({ code: String(e.key), row })" / >
< / template >
< / Dropdown >
< / div >
< / template >
< / Grid >
<!-- 修改手机号弹窗 : 直接表单 -- >
< Modal v -model :open = "mobileEditVisible" title = "修改手机号" width = "420px" :footer = "null" destroy -on -close
@cancel ="closeMobileEdit" >
< Form layout = "vertical" class = "pt-2" >
< Form .Item label = "当前手机号" >
< Input :value = "mobileEditRow?.mobile" disabled / >
< / F o r m . I t e m >
< Form .Item label = "新手机号" required >
< Input v -model :value = "mobileEditNewMobile" placeholder = "请输入11位手机号" :maxlength = "11" allow -clear / >
< / F o r m . I t e m >
< Form .Item class = "mb-0" >
< div class = "flex justify-end gap-2" >
< Button @click ="closeMobileEdit" > 取消 < / Button >
< Button type = "primary" :loading = "mobileEditLoading" @click ="submitMobileEdit" >
确定
< / Button >
< / div >
< / Form.Item >
< / Form >
< / Modal >
< / Page >
< / template >