Commit 5206453f authored by XieZhiXiong's avatar XieZhiXiong

chore: 完善组件

parent 25f32eb4
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-05-18 16:27:14
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-06-29 15:37:48
* @LastEditTime: 2021-07-12 16:47:43
* @Description: 会员基础信息
*/
import React from 'react';
......@@ -131,4 +131,4 @@ const MemberBasicInfo: React.FC<BasicInfoProps> = (props: BasicInfoProps) => {
);
};
export default MemberBasicInfo;
export default React.memo(MemberBasicInfo);
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2021-07-09 11:09:36
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-07-09 14:29:29
* @LastEditTime: 2021-07-12 15:56:22
* @Description: 会员详情信息
*/
import React from 'react';
......@@ -26,6 +26,7 @@ import {
MEMBER_OUTER_COLUMNS,
MEMBER_INNER_COLUMNS,
} from '../../constant';
import { renderFieldTypeContent } from '../../utils';
import MemberBasicInfo from '../MemberBasicInfo';
import MemberChannelInfo from '../MemberChannelInfo';
import MemberDocIncomingInfo from '../MemberDocIncomingInfo';
......@@ -48,15 +49,20 @@ interface IProps {
/**
* 拓展区域
*/
extra?: React.ReactNode,
extra?: (info: DetailType) => React.ReactNode,
/**
* 是否展示渠道信息,默认 true
*/
showChannelInfo?: boolean,
}
const MemberProfile: React.FC<IProps> = (props) => {
const { dataSource, loading, extra } = props;
const {
basicInfo,
channelInfo,
} = dataSource;
dataSource,
loading,
extra,
showChannelInfo = true,
} = props;
const anchorsArr = [
{
......@@ -68,8 +74,11 @@ const MemberProfile: React.FC<IProps> = (props) => {
name: '基本信息',
},
(
basicInfo?.memberTypeEnum === MEMBER_TYPE_CHANNEL_CORPORATE
|| basicInfo?.memberTypeEnum === MEMBER_TYPE_CHANNEL_INDIVIDUAL
showChannelInfo
&& (
dataSource?.memberTypeEnum === MEMBER_TYPE_CHANNEL_CORPORATE
|| dataSource?.memberTypeEnum === MEMBER_TYPE_CHANNEL_INDIVIDUAL
)
? {
key: 'channelInfo',
name: '渠道信息',
......@@ -87,7 +96,6 @@ const MemberProfile: React.FC<IProps> = (props) => {
(
dataSource
&& dataSource.depositDetails
&& dataSource.depositDetails.length
? {
key: 'incomingInfo',
name: '入库信息',
......@@ -130,20 +138,23 @@ const MemberProfile: React.FC<IProps> = (props) => {
},
].filter(Boolean);
const depositDetails = dataSource?.depositDetailTexts || dataSource?.depositDetails || [];
return (
<Spin spinning={loading}>
<AnchorPage
title={(
<AvatarWrap
info={{
name: basicInfo?.name,
name: dataSource?.name,
}}
extra={(
<LevelBrand level={basicInfo?.level} />
<LevelBrand level={dataSource?.level} />
)}
/>
)}
anchors={anchorsArr}
extra={extra ? extra(dataSource) : null}
>
<Row gutter={[16, 16]}>
{/* 会员审核流程 */}
......@@ -161,17 +172,17 @@ const MemberProfile: React.FC<IProps> = (props) => {
<Col span={24}>
<MemberBasicInfo
dataSource={{
memberId: basicInfo?.memberId,
memberTypeName: basicInfo?.memberTypeName,
account: basicInfo?.account,
name: basicInfo?.name,
roleName: basicInfo?.roleName,
phone: basicInfo?.phone,
outerStatus: basicInfo?.outerStatus,
outerStatusName: basicInfo?.outerStatusName,
levelTag: basicInfo?.levelTag,
email: basicInfo?.email,
createTime: basicInfo?.createTime,
memberId: dataSource?.memberId,
memberTypeName: dataSource?.memberTypeName,
account: dataSource?.account,
name: dataSource?.name,
roleName: dataSource?.roleName,
phone: dataSource?.phone,
outerStatus: dataSource?.outerStatus,
outerStatusName: dataSource?.outerStatusName,
levelTag: dataSource?.levelTag,
email: dataSource?.email,
createTime: dataSource?.registerTime,
}}
id="basicInfo"
/>
......@@ -179,16 +190,19 @@ const MemberProfile: React.FC<IProps> = (props) => {
{/* 渠道信息 */}
{
basicInfo?.memberTypeEnum === MEMBER_TYPE_CHANNEL_CORPORATE
|| basicInfo?.memberTypeEnum === MEMBER_TYPE_CHANNEL_INDIVIDUAL
showChannelInfo
&& (
dataSource?.memberTypeEnum === MEMBER_TYPE_CHANNEL_CORPORATE
|| dataSource?.memberTypeEnum === MEMBER_TYPE_CHANNEL_INDIVIDUAL
)
? (
<Col span={24}>
<MemberChannelInfo
dataSource={{
level: channelInfo?.level,
type: channelInfo?.type,
areas: channelInfo?.areas,
desc: channelInfo?.desc,
level: dataSource?.channelLevelTag,
type: dataSource?.channelTypeName,
areas: dataSource?.areaCodes as string[],
desc: dataSource?.remark,
}}
id="channelInfo"
/>
......@@ -207,15 +221,7 @@ const MemberProfile: React.FC<IProps> = (props) => {
data={(
item.elements.map((ele) => ({
title: ele.fieldLocalName,
value: (
ele.fieldType !== 'upload'
? ele.fieldValue
: (
<PicWrap
pics={[ele.fieldValue]}
/>
)
),
value: renderFieldTypeContent(ele.fieldType, ele.fieldValue),
}))
)}
id={`group${index}`}
......@@ -226,10 +232,10 @@ const MemberProfile: React.FC<IProps> = (props) => {
}
{/* 入库信息 */}
{dataSource && dataSource.depositDetails && dataSource.depositDetails.length ? (
{depositDetails ? (
<Col span={24}>
<MemberDocIncomingInfo
dataSource={dataSource?.depositDetails}
dataSource={depositDetails}
id="incomingInfo"
/>
</Col>
......
......@@ -91,6 +91,11 @@ export type CategoriesItemType = {
taxPoint: string,
}
export type AreaCodeType = {
provinceCode: string,
cityCode: string,
}
export type DetailType = {
/**
* 内部流转
......@@ -109,9 +114,91 @@ export type DetailType = {
*/
currentOuterStep: number,
/**
* 基础信息
* 会员id
*/
memberId: number,
/**
* 会员类型
*/
memberTypeName: string,
/**
* 登录账号
*/
account: string,
/**
* 会员名称
*/
name: string,
/**
* 会员角色
*/
roleName: string,
/**
* 注册手机号
*/
phone: string,
/**
* 上级会员列表
*/
upperMembers?: {
/**
* 上级会员关系Id
*/
upperRelationId: number
/**
* 上级会员公司名称+角色名称
*/
name: string
}[],
/**
* 渠道类型列表
*/
channelTypes?: {
/**
* 渠道类型Id
*/
channelTypeId: number
/**
* 渠道类型名称
*/
channelTypeName: string
}[],
/**
* 上级渠道id
*/
upperRelationId?: number,
/**
* 渠道类型Id
*/
channelTypeId?: number
/**
* 外部状态
*/
outerStatus: number,
/**
* 外部状态名称
*/
outerStatusName: string,
/**
* 等级
*/
level?: number,
/**
* 会员等级
*/
levelTag: string,
/**
* 注册邮箱
*/
email: string,
/**
* 申请时间
*/
registerTime: string,
/**
* 会员类型枚举,前端不展示,当值为3或4时,展示渠道信息
*/
basicInfo: BasicInfoProps['dataSource'],
memberTypeEnum?: number,
/**
* 注册信息
*/
......@@ -126,9 +213,21 @@ export type DetailType = {
elements: ElementsItemType[],
}[],
/**
* 渠道信息
* 渠道信息-渠道级别
*/
channelLevelTag: string,
/**
* 渠道信息-渠道级别
*/
channelTypeName?: string,
/**
* 渠道信息-代理地市
*/
areaCodes?: (string | AreaCodeType)[],
/**
* 渠道信息-渠道描述
*/
channelInfo: ChannelInfoProps['dataSource'],
remark: string,
/**
* 入库信息,表单用
*/
......@@ -145,7 +244,7 @@ export type DetailType = {
/**
* 入库信息,展示用
*/
depositDetailTexts: {
depositDetailTexts?: {
/**
* 分组名称
*/
......@@ -162,11 +261,11 @@ export type DetailType = {
/**
* 考察信息
*/
inspection: InvestigateInfoProps['dataSource'],
inspection?: InvestigateInfoProps['dataSource'],
/**
* 分类信息
*/
classification: DocCategoryProps['dataSource'],
classification?: DocCategoryProps['dataSource'],
/**
* 内部流转记录
*/
......
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