Commit 0e075d4b authored by 前端-钟卫鹏's avatar 前端-钟卫鹏

Merge branch 'v2-220318' of http://10.0.0.22:3000/lingxi/lingxi-business-paltform into v2-220318

parents f3a59d7f c9bbdb7e
......@@ -208,6 +208,7 @@ const AddressLayout: React.FC<addressProps> = (props: addressProps) => {
if (type === ADDED_DELIVERY) {
onChange(context.receiveAddress, ADDED_DELIVERY)
setAddressList(context.receiveAddress)
console.log(context.receiveAddress, 10086)
} else if (type === ADDED_DISPATCH) {
onChange(context.deliverAddress, ADDED_DISPATCH)
setAddressList(context.deliverAddress)
......
import React, { Fragment, useEffect, useState } from 'react';
import { Col, Form, message, Radio, Row, Skeleton } from 'antd';
import { Col, Empty, Form, message, Radio, Row, Skeleton } from 'antd';
import { history, getIntl } from 'umi';
import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import { getMemberOrgTree, getMemberStoreDetail } from '@/services/MemberV220318Api';
......@@ -133,23 +133,26 @@ const ProtalSystemDetail: React.FC<{}> = (props: any) => {
title={intl.formatMessage({ id: 'portalSystem.shouhuodizhi', defaultMessage: '收货地址' })}
>
<div className={style.addressList}>
<Radio.Group style={{ display: 'block' }}>
<Row gutter={[48, 24]}>
<Col span={12}>
<div className={style.addressLayout}>
<Radio checked disabled>
<div className={style.addressInfo}>
<div className={style.info}>
<div className={style.name}>{dataSource?.receiveAddress?.receiverName}&nbsp;{dataSource?.receiveAddress?.phone}</div>
{dataSource?.receiveAddress?.isDefault ? <div className={style.default}>{intl.formatMessage({ id: 'portalSystem.morendizhi', defaultMessage: '默认地址' })}</div> : null}
{dataSource?.receiveAddress ?
<Radio.Group style={{ display: 'block' }}>
<Row gutter={[48, 24]}>
<Col span={12}>
<div className={style.addressLayout}>
<Radio checked disabled>
<div className={style.addressInfo}>
<div className={style.info}>
<div className={style.name}>{dataSource?.receiveAddress?.receiverName}&nbsp;{dataSource?.receiveAddress?.phone}</div>
{dataSource?.receiveAddress?.isDefault ? <div className={style.default}>{intl.formatMessage({ id: 'portalSystem.morendizhi', defaultMessage: '默认地址' })}</div> : null}
</div>
<div className={style.address}>{handleMosaic(dataSource?.receiveAddress?.provinceName, dataSource?.receiveAddress?.cityName, dataSource?.receiveAddress?.districtName, dataSource?.receiveAddress?.address, dataSource?.receiveAddress?.streetName)}</div>
</div>
<div className={style.address}>{handleMosaic(dataSource?.receiveAddress?.provinceName, dataSource?.receiveAddress?.cityName, dataSource?.receiveAddress?.districtName, dataSource?.receiveAddress?.address, dataSource?.receiveAddress?.streetName)}</div>
</div>
</Radio>
</div>
</Col>
</Row>
</Radio.Group>
</Radio>
</div>
</Col>
</Row>
</Radio.Group> :
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
}
</div>
</CardLayout>
<CardLayout
......@@ -157,23 +160,27 @@ const ProtalSystemDetail: React.FC<{}> = (props: any) => {
title={intl.formatMessage({ id: 'portalSystem.fahuozitidizhi', defaultMessage: '发货(自提)地址' })}
>
<div className={style.addressList}>
<Radio.Group style={{ display: 'block' }}>
<Row gutter={[48, 24]}>
<Col span={12}>
<div className={style.addressLayout}>
<Radio checked disabled>
<div className={style.addressInfo}>
<div className={style.info}>
<div className={style.name}>{dataSource?.deliverAddress?.deliverName}&nbsp;{dataSource?.deliverAddress?.phone}</div>
{dataSource?.deliverAddress?.isDefault ? <div className={style.default}>{intl.formatMessage({ id: 'portalSystem.morendizhi', defaultMessage: '默认地址' })}</div> : null}
{dataSource?.deliverAddress ?
<Radio.Group style={{ display: 'block' }}>
<Row gutter={[48, 24]}>
<Col span={12}>
<div className={style.addressLayout}>
<Radio checked disabled>
<div className={style.addressInfo}>
<div className={style.info}>
<div className={style.name}>{dataSource?.deliverAddress?.deliverName}&nbsp;{dataSource?.deliverAddress?.phone}</div>
{dataSource?.deliverAddress?.isDefault ? <div className={style.default}>{intl.formatMessage({ id: 'portalSystem.morendizhi', defaultMessage: '默认地址' })}</div> : null}
</div>
<div className={style.address}>{handleMosaic(dataSource?.deliverAddress?.provinceName, dataSource?.deliverAddress?.cityName, dataSource?.deliverAddress?.districtName, dataSource?.deliverAddress?.address, dataSource?.deliverAddress?.streetName)}</div>
</div>
<div className={style.address}>{handleMosaic(dataSource?.deliverAddress?.provinceName, dataSource?.deliverAddress?.cityName, dataSource?.deliverAddress?.districtName, dataSource?.deliverAddress?.address, dataSource?.deliverAddress?.streetName)}</div>
</div>
</Radio>
</div>
</Col>
</Row>
</Radio.Group>
</Radio>
</div>
</Col>
</Row>
</Radio.Group> :
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
}
</div>
</CardLayout>
</Form>
......
import React from 'react';
import { Form, Button } from 'antd';
import React, { Fragment, useEffect, useMemo, useRef, useState } from 'react';
import { Button, Col, Input, message, Popconfirm, Row } from 'antd';
import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import BasicLayout from './components/basicLayout';
import ManageLayout from './components/manageLayout';
import CardLayout from '@/pages/transaction/components/card';
import NiceForm from '@/components/NiceForm';
import { createFormActions } from '@formily/antd';
import { PageStatus, usePageStatus } from '@/hooks/usePageStatus';
import { useIntl, history } from 'umi';
import { getMemberAbilitySalesChannel, getMemberAbilitySalesChannelPage, getMemberAbilitySalesSelect, postMemberAbilitySalesChannelBind, postMemberAbilitySalesChannelUnbind } from '@/services/MemberV2Api';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import Search from '@/components/NiceForm/components/Search';
import Submit from '@/components/NiceForm/components/Submit';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import StandardTable from '@/components/StandardTable';
import { useRowSelectionTable } from '@/hooks/useRowSelectionTable';
import ModalTable from '@/components/ModalTable';
export const Tablink = [
{ id: 'basicLayout', title: '基本信息' },
{ id: 'manageLayout', title: '管理下级会员' },
]
export const layout: any = {
colon: false,
labelCol: { style: { width: "144px" } },
labelAlign: "left"
};
const formAction = createFormActions();
const fetchMemberAbilitySelect = async (params) => {
const { data } = await getMemberAbilitySalesSelect(params)
return data
}
const SalesmanBindAdded = (props) => {
const ref = useRef<any>({})
const staticData = useRef<any>([])
const [rowSelection, rowCtl] = useRowSelectionTable({ customKey: 'memberId' })
const [realRowSelection, realRowCtl] = useRowSelectionTable({ customKey: 'relationId' })
const [memberVisible, setMemberVisible] = useState(false)
const { pageStatus, id } = usePageStatus()
const [tableData, setTableData] = useState<any[]>([])
const [keywordName, setKeywordName] = useState<string>('')
const intl = useIntl()
const fliterTableData = useMemo(() => {
if (!keywordName) {
return tableData
}
return tableData.filter(v => v.name.toString().includes(keywordName))
}, [tableData, keywordName])
useEffect(() => {
if (id) {
fetchSaleChannel()
}
}, [id])
const fetchSaleChannel = async () => {
getMemberAbilitySalesChannel({
userId: id,
current: '1',
pageSize: '20',
name: keywordName,
}).then((res) => {
if (res.code === 1000) {
formAction.setFieldValue('userId', [res.data])
// 添加一个remote标识, 带有此标识的 将会调用接口解绑
setTableData(res.data.data.map(v => ({ ...v, isRemote: true })))
}
})
}
const handleSearchChannel = () => {
}
useEffect(() => {
staticData.current = realRowCtl.selectedRowKeys
}, [realRowCtl.selectedRowKeys])
useEffect(() => {
rowCtl.setSelectedRowKeys(tableData.map(v => v.memberId))
rowCtl.setSelectRow([...tableData])
realRowCtl.setSelectedRowKeys(tableData.filter(v => !staticData.current.includes(v)))
}, [tableData])
const cacelConnect = (record) => {
unBindMember(record)
}
const abilityColumns: any[] = [
{
key: 'userId',
dataIndex: 'userId',
title: intl.formatMessage({ id: 'channel.member.table.userId' }),
align: 'center'
},
{
key: 'name',
dataIndex: 'name',
title: intl.formatMessage({ id: 'channel.member.table.name' }),
align: 'center'
},
{
key: 'phone',
dataIndex: 'phone',
title: intl.formatMessage({ id: 'channel.member.table.phone' }),
align: 'center'
},
{
key: 'orgName',
dataIndex: 'orgName',
title: intl.formatMessage({ id: 'channel.member.table.orgName' }),
align: 'center'
},
{
key: 'jobTitle',
dataIndex: 'jobTitle',
title: intl.formatMessage({ id: 'channel.member.table.jobTitle' }),
align: 'center'
}
]
const connectMemberColumns: any[] = [
{
key: 'memberId',
dataIndex: 'memberId',
title: intl.formatMessage({ id: 'channel.member.table.memberId' }),
align: 'center'
},
{
key: 'name',
dataIndex: 'name',
title: intl.formatMessage({ id: 'channel.member.table.memberName' }),
align: 'center'
},
{
key: 'memberTypeName',
dataIndex: 'memberTypeName',
title: intl.formatMessage({ id: 'channel.member.table.memberTypeName' }),
align: 'center'
},
{
key: 'roleName',
dataIndex: 'roleName',
title: intl.formatMessage({ id: 'channel.member.table.roleName' }),
align: 'center'
},
{
key: 'createTime',
dataIndex: 'createTime',
title: intl.formatMessage({ id: 'channel.member.table.createTime' }),
align: 'center'
},
{
key: 'levelTag',
dataIndex: 'levelTag',
title: intl.formatMessage({ id: 'channel.member.table.levelTag' }),
align: 'center'
},
{
key: 'statusName',
dataIndex: 'statusName',
title: intl.formatMessage({ id: 'channel.member.table.statusName' }),
align: 'center'
},
{
key: 'ctl',
dataIndex: 'ctl',
title: intl.formatMessage({ id: 'common.table.action' }),
align: 'center',
render: (_, record) => {
return <Popconfirm disabled={pageStatus === PageStatus.PREVIEW} title={intl.formatMessage({ id: 'channel.member.relieve.confirm' })} onConfirm={() => cacelConnect(record)}>
<Button type='link' disabled={pageStatus === PageStatus.PREVIEW}>{intl.formatMessage({ id: 'channel.member.relieve' })}</Button>
</Popconfirm>
}
}
]
const modalMemberColumns: any[] = [
{
title: intl.formatMessage({ id: 'channel.member.table.memberId' }),
dataIndex: 'memberId',
key: 'memberId',
align: 'center'
},
{
title: intl.formatMessage({ id: 'channel.member.table.memberName' }),
dataIndex: 'name',
key: 'name',
align: 'center'
},
{
title: intl.formatMessage({ id: 'channel.member.table.memberTypeName' }),
dataIndex: 'memberTypeName',
key: 'memberTypeName',
align: 'center'
},
{
title: intl.formatMessage({ id: 'channel.member.table.roleName' }),
dataIndex: 'roleName',
key: 'roleName',
align: 'center'
},
{
title: intl.formatMessage({ id: 'channel.member.table.levelTag' }),
dataIndex: 'levelTag',
key: 'levelTag',
align: 'center'
},
]
const fetchTableData = async (params) => {
const { data } = await getMemberAbilitySalesChannelPage(params)
return data
}
const handleConfirm = () => {
setMemberVisible(false)
setTableData(tableData => {
return [...tableData, ...rowCtl.selectRow.filter(v => !tableData.find(j => j.memberId === v.memberId))]
})
}
const validateMember = () => {
const userInfo = formAction.getFieldValue('userId')
return userInfo && userInfo.length > 0
}
const unBindMember = async (options?) => {
const relationIds = []
if (options) {
// 单选
const { relationId, isRemote } = options
if (pageStatus === PageStatus.ADD || !isRemote) {
// 新增或者编辑时是未保存状态的渠道业务员则无需调用接口 直接删除
setTableData(d => d.filter(v => v.relationId !== relationId))
return false
}
relationIds.push(relationId)
} else {
// 批量
if (pageStatus === PageStatus.ADD) {
// 新增情况下 删除本地数据
setTableData(d => {
return d.filter(v => !realRowCtl.selectedRowKeys.includes(v.relationId))
})
return false
}
const localRow = realRowCtl.selectRow.filter(v => !v.isRemote)
const localRowKey = localRow.map(v => v.relationId)
const remoteRowKey = realRowCtl.selectRow.filter(v => v.isRemote).map(v => v.relationId)
setTableData(d => {
return d.filter(v => !localRow.find(l => l.relationId === v.relationId))
})
if (remoteRowKey.length === 0) {
clearRealRowCtl(localRowKey)
return false
}
relationIds.push(...remoteRowKey)
}
if (validateMember()) {
const userInfo = formAction.getFieldValue('userId')
const userId = userInfo[0].userId
const { code } = await postMemberAbilitySalesChannelUnbind({
userId,
relationIds: relationIds
})
if (code === 1000) {
setTableData(d => {
clearRealRowCtl(relationIds)
return d.filter(v => !relationIds.includes(v.relationId))
})
}
} else {
message.error(intl.formatMessage({ id: 'channel.member.select' }))
}
}
const clearRealRowCtl = (ids: any[]) => {
realRowCtl.setSelectRow([...realRowCtl.selectRow.filter(v => !ids.includes(v.relationId))])
realRowCtl.setSelectedRowKeys([...realRowCtl.selectedRowKeys.filter(v => !ids.includes(v))])
}
const handleSubmit = async () => {
const userInfo = formAction.getFieldValue('userId')
if (userInfo && userInfo.length > 0) {
const userId = userInfo[0].userId
const result = await postMemberAbilitySalesChannelBind({
userId,
relationIds: tableData.map(v => v.relationId)
})
if (result.code === 1000) {
history.goBack()
}
}
};
return (
<PeripheralLayout
hideBreak
detail={props.route.name}
tabLink={Tablink}
effect={<Button type='primary'>保存</Button>}
effect={
<Button
type="primary"
disabled={pageStatus === PageStatus.PREVIEW}
onClick={handleSubmit}
>
{intl.formatMessage({ id: 'common.button.save' })}
</Button>
}
components={
<Form {...layout}>
<BasicLayout />
<ManageLayout />
</Form>
<Fragment>
<CardLayout
id='basicLayout'
title='基本信息'
>
<NiceForm
labelCol={4}
wrapperCol={12}
labelAlign="left"
actions={formAction}
editable={pageStatus !== PageStatus.PREVIEW}
previewPlaceholder=" "
schema={{
type: 'object',
properties: {
userId: {
type: 'string',
title: intl.formatMessage({ id: 'channel.form.salesman' }),
'x-component': 'CustomRelevance',
'x-component-props': {
title: intl.formatMessage({ id: 'common.text.select' }),
modalProps: {
title: intl.formatMessage({ id: 'channel.form.modal.salesman.title' }),
},
columns: abilityColumns,
fetchTableData: fetchMemberAbilitySelect,
formilyProps: {
ctx: {
schema: {
type: 'object',
properties: {
name: {
type: 'string',
"x-component": 'SearchFilter',
'x-component-props': {
placeholder: intl.formatMessage({ id: 'common.form.name.placeholder' }),
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
inline: true,
rowStyle: {
justifyContent: 'flex-start'
},
colStyle: {
marginRight: 20
}
},
properties: {
orgName: {
type: 'string',
'x-component-props': {
placeholder: intl.formatMessage({ id: 'channel.form.orgName.placeholder' }),
}
},
"jobTitle": {
type: 'string',
"x-component-props": {
placeholder: intl.formatMessage({ id: 'channel.form.orgName.jobTitle' })
}
},
submit: {
'x-component': 'Submit',
'x-component-props': {
children: intl.formatMessage({ id: 'common.button.query' }),
},
},
},
},
}
},
components: {
Search,
Submit
},
effects: ($, actions) => {
useStateFilterSearchLinkageEffect(
$,
actions,
'name',
FORM_FILTER_PATH,
);
},
inline: false,
},
},
tableProps: {
rowKey: 'userId',
lableKey: 'name',
},
},
'x-mega-props': {
wrapperCol: 12,
},
'x-rules': [
{
required: true,
message: intl.formatMessage({ id: 'channel.form.salesman.placeholder' }),
},
],
},
},
}}
/>
</CardLayout>
<CardLayout
id='manageLayout'
title='管理下级会员'
>
<Row justify='space-between' style={{ marginBottom: 20 }}>
<Col>
<Button type='default' onClick={() => unBindMember()} disabled={pageStatus === PageStatus.PREVIEW}>{intl.formatMessage({ id: 'channel.member.relieve.batch' })}</Button>
</Col>
<Col style={{ display: 'flex' }}>
<Input.Search placeholder={intl.formatMessage({ id: 'channel.form.memberName.placeholder' })} value={keywordName} onChange={e => setKeywordName(e.target.value)} onPressEnter={handleSearchChannel} />
<Button type='default' style={{ marginLeft: 20 }} onClick={() => setKeywordName('')}>{intl.formatMessage({ id: 'common.button.reset' })}</Button>
</Col>
</Row>
<Button block type='dashed' onClick={() => setMemberVisible(true)} disabled={pageStatus === PageStatus.PREVIEW}>{intl.formatMessage({ id: 'channel.member.wait.bind.select' })}</Button>
<StandardTable
columns={connectMemberColumns}
rowSelection={pageStatus !== PageStatus.PREVIEW && realRowSelection}
rowKey='relationId'
tableProps={{
dataSource: fliterTableData
}}
/>
</CardLayout>
<ModalTable
confirm={handleConfirm}
cancel={() => setMemberVisible(false)}
visible={memberVisible}
width={960}
modalTitle={intl.formatMessage({ id: 'channel.modal.member.select' })}
rowSelection={rowSelection}
columns={modalMemberColumns}
fetchTableData={fetchTableData}
rowKey={'memberId'}
forceRender
formilyProps={{
ctx: {
schema: {
type: 'object',
properties: {
name: {
type: 'string',
"x-component": "Search",
"x-component-props": {
placeholder: intl.formatMessage({ id: 'channel.form.name.placeholder' })
}
}
}
}
}
}}
/>
</Fragment>
}
/>
)
......
import React from 'react';
import { Form, Row, Col, Input, Button } from 'antd';
import CardLayout from '@/pages/transaction/components/card';
import { LinkOutlined } from '@ant-design/icons';
import { ColumnType } from 'antd/lib/table/interface';
import TableModal from '@/pages/transaction/components/tableModal';
import { FORM_FILTER_PATH } from '@/formSchema/const';
const BasicLayout = () => {
const [visible, setVisible] = React.useState<boolean>(false);
const columns: ColumnType<any>[] = [
{
title: '序号',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '姓名',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '手机号',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '所属机构',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '职位',
ellipsis: true,
key: '',
dataIndex: '',
},
]
const fetchData = () => {
return new Promise(resolve => {
resolve({
code: 1000,
data: []
})
})
}
return (
<React.Fragment>
<CardLayout
id='basicLayout'
title='基本信息'
>
<Row gutter={[48, 24]}>
<Col span={12}>
<Form.Item
label='业务员'
name=''
rules={[
{ required: true, message: '请选择业务员' }
]}
>
<Input.Search placeholder='请选择业务员' readOnly enterButton={<Button style={{ backgroundColor: '#00a98f' }} type='primary' icon={<LinkOutlined />} />} />
</Form.Item>
</Col>
</Row>
</CardLayout>
<TableModal
width={800}
modalType='Drawer'
visible={visible}
title='选择业务员'
mode='checkbox'
schema={{
type: "object",
properties: {
megalayout: {
type: "object",
"x-component": "mega-layout",
properties: {
inquiryListNo: {
type: "string",
"x-component": "Search",
"x-mega-props": {},
"x-component-props": {
placeholder: '姓名',
align: "flex-left",
}
}
}
},
[FORM_FILTER_PATH]: {
type: "object",
"x-component": "flex-layout",
"x-component-props": {
rowStyle: {
justifyContent: "flex-start",
flexWrap: "nowrap"
},
colStyle: {//改变间隔
marginRight: 20
}
},
properties: {
PRO_LAYOUT: {
type: "object",
"x-component": "mega-layout",
"x-mega-props": {
span: 5
},
"x-component-props": {
inline: true
},
properties: {
details: {
type: "string",
"x-component-props": {
placeholder: '所属机构'
}
},
memberName: {
type: "string",
"x-component-props": {
placeholder: '职位'
}
},
}
},
sumbit: {
"x-component": "Submit",
"x-mega-props": {
span: 1
},
"x-component-props": {
children: '查询'
}
}
}
}
}
}}
columns={columns}
fetchData={fetchData}
onClose={() => setVisible(false)}
onOk={() => setVisible(false)}
/>
</React.Fragment>
)
}
export default BasicLayout
import React, { CSSProperties } from 'react';
import { Form, Button, Table, Space, Input } from 'antd';
import { ColumnType } from 'antd/lib/table/interface';
import CardLayout from '@/pages/transaction/components/card';
import { PlusOutlined } from '@ant-design/icons';
import TableModal from '@/pages/transaction/components/tableModal';
const styles: CSSProperties = {
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
marginBottom: '16px'
}
const ManageLayout = () => {
const [visible, setVisible] = React.useState<boolean>(false);
const columns: ColumnType<any>[] = [
{
title: '会员ID',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员名称',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员类型',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员角色',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '申请时间',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员等级',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员状态',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '操作',
ellipsis: true,
key: '',
dataIndex: '',
},
]
const tableModalColumns: ColumnType<any>[] = [
{
title: '会员ID',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员名称',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员类型',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员角色',
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员等级',
ellipsis: true,
key: '',
dataIndex: '',
},
]
const fetchData = () => {
return new Promise(resolve => {
resolve({
code: 1000,
data: []
})
})
}
return (
<React.Fragment>
<CardLayout
id='manageLayout'
title='管理下级会员'
>
<div style={styles}>
<Button>批量解除绑定关系</Button>
<Space size={16}>
<Input.Search placeholder='会员姓名' />
<Button>重置</Button>
</Space>
</div>
<Button block type="dashed" style={{ marginBottom: "16px" }} icon={<PlusOutlined />}>选择待绑定下级会员</Button>
<Form.Item
name=''
rules={[
{ required: true, message: '请绑定下级会员' }
]}
>
<Table
rowSelection={{}}
columns={columns}
dataSource={[]}
/>
</Form.Item>
</CardLayout>
<TableModal
modalType='Drawer'
visible={visible}
title='选择会员'
mode='checkbox'
schema={{
type: "object",
properties: {
megalayout: {
type: "object",
"x-component": "mega-layout",
properties: {
inquiryListNo: {
type: "string",
"x-component": "Search",
"x-mega-props": {},
"x-component-props": {
placeholder: '会员名称',
align: "flex-left",
advanced: false,
}
}
}
}
}
}}
columns={tableModalColumns}
fetchData={fetchData}
onClose={() => setVisible(false)}
onOk={() => setVisible(false)}
/>
</React.Fragment>
)
}
export default ManageLayout
import React from 'react';
import { Form, Button, Row, Col, Typography } from 'antd';
import React, { useEffect, useMemo, useState } from 'react';
import { Form, Button, Row, Col, Typography, Input } from 'antd';
import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import CardLayout from '@/pages/transaction/components/card';
import StandardTable from '@/components/StandardTable';
......@@ -8,10 +8,19 @@ import NiceForm from '@/components/NiceForm';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { searchSelectGetSelectCategoryOptionEffect } from '@/pages/transaction/effect';
import { layout } from './add';
import { useIntl } from 'umi';
import { getMemberAbilitySalesChannel } from '@/services/MemberV2Api';
import { usePageStatus } from '@/hooks/usePageStatus';
const formActions = createFormActions()
export const layout: any = {
colon: false,
labelCol: { style: { width: "144px" } },
labelAlign: "left"
};
export const Tablink = [
{ id: 'basicLayout', title: '基本信息' },
{ id: 'manageLayout', title: '管理下级会员' },
......@@ -19,50 +28,59 @@ export const Tablink = [
const SalesmanBindDetail = (props) => {
const ref = React.useRef<any>(null);
const intl = useIntl();
const { pageStatus, id } = usePageStatus()
const [tableData, setTableData] = useState<any[]>([])
const [data, setData] = useState<any>({})
const [keywordName, setKeywordName] = useState<string>('')
const columns: ColumnType<any>[] = [
{
title: '会员ID',
key: 'memberId',
dataIndex: 'memberId',
title: intl.formatMessage({ id: 'channel.member.table.memberId' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员名称',
key: 'name',
dataIndex: 'name',
title: intl.formatMessage({ id: 'channel.member.table.memberName' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员类型',
key: 'memberTypeName',
dataIndex: 'memberTypeName',
title: intl.formatMessage({ id: 'channel.member.table.memberTypeName' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员角色',
key: 'roleName',
dataIndex: 'roleName',
title: intl.formatMessage({ id: 'channel.member.table.roleName' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '申请时间',
key: 'createTime',
dataIndex: 'createTime',
title: intl.formatMessage({ id: 'channel.member.table.createTime' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员等级',
key: 'levelTag',
dataIndex: 'levelTag',
title: intl.formatMessage({ id: 'channel.member.table.levelTag' }),
ellipsis: true,
key: '',
dataIndex: '',
},
{
title: '会员状态',
key: 'statusName',
dataIndex: 'statusName',
title: intl.formatMessage({ id: 'channel.member.table.statusName' }),
ellipsis: true,
key: '',
dataIndex: '',
},
]
const fetchData = (params?: any) => {
return new Promise((resolve, reject) => {
resolve({
......@@ -77,6 +95,35 @@ const SalesmanBindDetail = (props) => {
ref.current.reload(values)
}
const fliterTableData = useMemo(() => {
if (!keywordName) {
return tableData
}
return tableData.filter(v => v.name.toString().includes(keywordName))
}, [tableData, keywordName])
const fetchSaleChannel = async () => {
getMemberAbilitySalesChannel({
userId: id,
current: '1',
pageSize: '20',
name: keywordName,
}).then((res) => {
if (res.code === 1000) {
setData(res.data)
setTableData(res.data.data);
}
})
}
useEffect(() => {
fetchSaleChannel()
}, [])
const handleSearchChannel = () => {
}
return (
<PeripheralLayout
hideBreak
......@@ -92,19 +139,19 @@ const SalesmanBindDetail = (props) => {
<Col span={12}>
<Form {...layout}>
<Form.Item label='业务员'>
<Typography.Text>张三</Typography.Text>
<Typography.Text>{data?.name}</Typography.Text>
</Form.Item>
<Form.Item label='所属机构'>
<Typography.Text>广州总部-业务部-华南区-广东省</Typography.Text>
<Typography.Text>{data?.orgName}</Typography.Text>
</Form.Item>
<Form.Item label='职位'>
<Typography.Text>业务员</Typography.Text>
<Typography.Text>{data?.jobTitle }</Typography.Text>
</Form.Item>
<Form.Item label='所属角色'>
<Typography.Text>业务员-广东省</Typography.Text>
<Typography.Text>{data?.memberRoleName}</Typography.Text>
</Form.Item>
<Form.Item label='绑定后手机号'>
<Typography.Text>+86 18677665544</Typography.Text>
<Typography.Text>{data?.phone}</Typography.Text>
</Form.Item>
</Form>
</Col>
......@@ -114,43 +161,18 @@ const SalesmanBindDetail = (props) => {
id='manageLayout'
title='管理下级会员'
>
<Row justify='space-between' style={{ marginBottom: 20 }}>
<Col style={{ display: 'flex' }}>
<Input.Search placeholder={intl.formatMessage({ id: 'channel.form.memberName.placeholder' })} value={keywordName} onChange={e => setKeywordName(e.target.value)} onPressEnter={handleSearchChannel} />
<Button type='default' style={{ marginLeft: 20 }} onClick={() => setKeywordName('')}>{intl.formatMessage({ id: 'common.button.reset' })}</Button>
</Col>
</Row>
<StandardTable
tableProps='id'
columns={columns}
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<NiceForm
actions={formActions}
onSubmit={values => search(values)}
effects={($, actions) => {
useStateFilterSearchLinkageEffect($, actions, 'name', 'FORM_FILTER_PATH')
FormEffectHooks.onFieldChange$('category').subscribe(state => {
searchSelectGetSelectCategoryOptionEffect(actions, 'category')
})
}}
schema={{
type: "object",
properties: {
megalayout: {
type: "object",
"x-component": "mega-layout",
properties: {
name: {
type: "string",
"x-component": "Search",
"x-mega-props": {},
"x-component-props": {
placeholder: '会员名称',
align: "flex-left",
advanced: false,
}
}
}
}
}
}}
/>
}
rowKey='relationId'
tableProps={{
dataSource: fliterTableData
}}
/>
</CardLayout>
</React.Fragment>
......
......@@ -6,47 +6,77 @@ import { FORM_FILTER_PATH } from '@/formSchema/const';
import { ColumnType } from 'antd/lib/table/interface';
import EyePreview from '@/components/EyePreview';
import { PlusOutlined } from '@ant-design/icons';
import { getMemberAbilitySalesPage } from '@/services/MemberV220318Api';
import { postMemberAbilitySalesDelete } from '@/services/MemberV2Api';
const intl = getIntl()
const PortalSystem = () => {
const tableRef = useRef<any>({});
const updateItem = (record) => {
history.push(`/memberCenter/systemSetting/salesmanManage/salesmanBind/edit?id=${record.userId}`)
}
const deleteItem = async (record) => {
// 删除该项
await postMemberAbilitySalesDelete({
userId: record.userId
})
tableRef.current.reload()
}
const columns: ColumnType<any>[] = [
{
title: '登录帐号',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.account' }),
key: 'account',
dataIndex: 'account'
},
{
title: '姓名',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.name' }),
key: 'name',
dataIndex: 'name',
render: (text, record) => <EyePreview url={`/memberCenter/systemSetting/salesmanManage/salesmanBind/detail?id=${record.userId}`}>{text}</EyePreview>
},
{
title: '所属机构',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.orgName' }),
key: 'orgName',
dataIndex: 'orgName'
},
{
title: '绑定手机号',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.bindphone' }),
key: 'phone',
dataIndex: 'phone'
},
{
title: '职位',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.jobTitle' }),
key: 'jobTitle',
dataIndex: 'jobTitle'
},
{
title: '所属角色',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'channel.member.table.memberRoleName' }),
key: 'memberRoleName',
dataIndex: 'memberRoleName'
},
{
title: '操作',
key: '',
dataIndex: ''
title: intl.formatMessage({ id: 'common.table.action' }),
key: 'options',
dataIndex: 'options',
render: (text:any, record:any) => {
return <>
<Button type='link' onClick={()=>updateItem(record)}>{intl.formatMessage({ id: 'common.button.modify' })}</Button>
{
<Popconfirm
title={intl.formatMessage({ id: 'common.tip.option.confirm' })}
onConfirm={() => deleteItem(record)}
okText={intl.formatMessage({ id: 'common.button.yes' })}
cancelText={intl.formatMessage({ id: 'common.button.no' })}
>
<Button type='link'>{intl.formatMessage({ id: 'common.button.delete' })}</Button>
</Popconfirm>
}
</>
}
},
]
......@@ -54,8 +84,9 @@ const PortalSystem = () => {
<TableLayout
reload={tableRef}
columns={columns}
effects="name"
fetch={[]}
effects="account"
rowKey='userId'
fetch={getMemberAbilitySalesPage}
schema={{
type: "object",
properties: {
......@@ -70,7 +101,7 @@ const PortalSystem = () => {
type: "object",
"x-component": "controllerBtns",
},
name: {
account: {
type: 'string',
'x-component': 'Search',
'x-component-props': {
......@@ -101,7 +132,7 @@ const PortalSystem = () => {
inline: true
},
properties: {
contactName: {
name: {
type: 'string',
'x-component-props': {
placeholder: '姓名',
......@@ -134,7 +165,7 @@ const PortalSystem = () => {
icon={<PlusOutlined />}
onClick={() => history.push(`/memberCenter/systemSetting/salesmanManage/salesmanBind/add`)}
>
{intl.formatMessage({id: 'portalSystem.added', defaultMessage: '新增'})}
{intl.formatMessage({ id: 'portalSystem.added', defaultMessage: '新增' })}
</Button>
</Space>
</Col>
......
......@@ -9,7 +9,7 @@ import { isEmpty } from '@formily/shared';
import { ENTERPRISE_CENTER_URL } from '@/constants'
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { getMemberAbilityInfoPage, getMemberManagePlatformProviderPage } from '@/services/MemberV220318Api';
import { getMemberManagePlatformProviderPage, getMemberManageUpperProviderMerchantPage } from '@/services/MemberV220318Api';
import { postManageWebShopWebAll } from '@/services/ManageV2Api';
import { getIntl } from 'umi';
import { getEnableMultiTenancy } from '@/utils/auth';
......@@ -33,8 +33,8 @@ const BasicInfoLayout: React.FC<BasicInfoLayoutProps> = (props: any) => {
const columns: any = [
{
title: 'ID',
dataIndex: enableMultiTenancy ? 'validateId' : 'id',
key: enableMultiTenancy ? 'validateId' : 'id',
dataIndex: 'id',
key: 'id',
},
{
title: intl.formatMessage({id: 'dealAbility.huiyuanmingcheng'}),
......@@ -59,7 +59,7 @@ const BasicInfoLayout: React.FC<BasicInfoLayoutProps> = (props: any) => {
]
const handleFetchData = useCallback((params: any) => {
let getMemberApi = (enableMultiTenancy ? getMemberAbilityInfoPage : getMemberManagePlatformProviderPage)
let getMemberApi = (enableMultiTenancy ? getMemberManageUpperProviderMerchantPage : getMemberManagePlatformProviderPage)
return new Promise(resolve => {
getMemberApi({ ...params }).then(res => {
if (res.code !== 1000) {
......@@ -143,9 +143,9 @@ const BasicInfoLayout: React.FC<BasicInfoLayoutProps> = (props: any) => {
title={intl.formatMessage({id: 'dealAbility.xuanzehuiyuan'})}
mode="radio"
tableProps={{
rowKey: enableMultiTenancy ? 'validateId' : 'id',
rowKey: 'id',
}}
customKey={enableMultiTenancy ? 'validateId' : 'id'}
customKey='id'
fetchData={handleFetchData}
onClose={() => toggle(false)}
onOk={handleLogisticOnOk}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment