重构主导航栏父子菜单选中态与树形分支样式

This commit is contained in:
yml2213
2026-08-04 11:25:27 +08:00
parent e6f09eaf14
commit aa2eac8d51
3 changed files with 33 additions and 90 deletions
+4 -75
View File
@@ -14,21 +14,13 @@ import {
Typography,
message,
} from 'antd'
import { GiftOutlined, PlusOutlined, ReloadOutlined, TeamOutlined, WalletOutlined } from '@ant-design/icons'
import { GiftOutlined, PlusOutlined, ReloadOutlined, WalletOutlined } from '@ant-design/icons'
import type { ColumnsType } from 'antd/es/table'
import { useNavigate } from 'react-router-dom'
import { platformApi } from '../api'
import type { Merchant, MerchantMember, PageResult, ProductCatalogItem, WalletAccount } from '../types'
import type { Merchant, PageResult, ProductCatalogItem, WalletAccount } from '../types'
import { formatDateTime } from '../utils/time'
import { PageHeader } from '../components/PageHeader'
const memberRoleOptions = [
{ value: 'owner', label: '负责人' },
{ value: 'operator', label: '运营' },
{ value: 'finance', label: '财务' },
{ value: 'viewer', label: '只读' },
]
const featureOptions = [
{ value: 'products', label: '商品' },
{ value: 'orders', label: '订单' },
@@ -38,12 +30,10 @@ const featureOptions = [
]
export default function PlatformMerchants() {
const navigate = useNavigate()
const [data, setData] = useState<PageResult<Merchant>>({ list: [], total: 0, page: 1, size: 10 })
const [loading, setLoading] = useState(false)
const [createOpen, setCreateOpen] = useState(false)
const [settingsOpen, setSettingsOpen] = useState(false)
const [memberOpen, setMemberOpen] = useState(false)
const [assignOpen, setAssignOpen] = useState(false)
const [assignLoading, setAssignLoading] = useState(false)
const [assignSubmitting, setAssignSubmitting] = useState(false)
@@ -57,7 +47,6 @@ export default function PlatformMerchants() {
const [adjustWallet, setAdjustWallet] = useState<WalletAccount | null>(null)
const [createForm] = Form.useForm()
const [settingsForm] = Form.useForm()
const [memberForm] = Form.useForm()
const [adjustForm] = Form.useForm()
const load = useCallback(async (page = data.page, size = data.size) => {
@@ -117,22 +106,6 @@ export default function PlatformMerchants() {
}
}
const submitMember = async () => {
if (!selectedMerchant) return
const values = await memberForm.validateFields()
try {
await platformApi.addMember(selectedMerchant.id, {
user_id: values.user_id,
role: values.role as MerchantMember['role'],
is_default: values.is_default,
})
message.success('成员已添加')
setMemberOpen(false)
} catch (e) {
message.error(e instanceof Error ? e.message : '添加失败')
}
}
const openAdjust = async (record: Merchant) => {
setSelectedMerchant(record)
setAdjustOpen(true)
@@ -259,21 +232,10 @@ export default function PlatformMerchants() {
{
title: '操作',
key: 'action',
width: 240,
width: 180,
fixed: 'right',
render: (_, record) => (
<Space size={0}>
<Button
type="link"
size="small"
onClick={() => {
localStorage.setItem('merchant_id', String(record.id))
message.success('当前商户已切换')
navigate('/merchant-center')
}}
>
</Button>
<Button
type="link"
size="small"
@@ -306,19 +268,6 @@ export default function PlatformMerchants() {
>
</Button>
<Button
type="link"
size="small"
icon={<TeamOutlined />}
onClick={() => {
setSelectedMerchant(record)
memberForm.resetFields()
memberForm.setFieldsValue({ role: 'operator', is_default: false })
setMemberOpen(true)
}}
>
</Button>
</Space>
),
},
@@ -328,7 +277,7 @@ export default function PlatformMerchants() {
<div>
<PageHeader
title="平台商户管理"
subtitle="平台管理员维护各分销商户租户、分配商品库、配置手续费费率与授权成员"
subtitle="平台管理员维护各分销商户租户、分配商品库、配置手续费费率与积分调整"
breadcrumbs={[{ title: '商户管理' }]}
extra={
<Space>
@@ -508,26 +457,6 @@ export default function PlatformMerchants() {
</Spin>
</Modal>
<Modal
title={selectedMerchant ? `添加成员:${selectedMerchant.name}` : '添加成员'}
open={memberOpen}
onOk={submitMember}
onCancel={() => setMemberOpen(false)}
destroyOnClose
>
<Form form={memberForm} layout="vertical" style={{ marginTop: 16 }}>
<Form.Item name="user_id" label="用户 ID" rules={[{ required: true }]}>
<InputNumber min={1} precision={0} style={{ width: '100%' }} />
</Form.Item>
<Form.Item name="role" label="角色" rules={[{ required: true }]}>
<Select options={memberRoleOptions} />
</Form.Item>
<Form.Item name="is_default" label="默认商户">
<Select options={[{ value: true, label: '是' }, { value: false, label: '否' }]} />
</Form.Item>
</Form>
</Modal>
<Modal
title={selectedMerchant ? `分配商品:${selectedMerchant.name}` : '分配商品'}
open={assignOpen}