Commit 60dbb23a authored by XieZhiXiong's avatar XieZhiXiong

feat: 对接 申请会员 相关

parent 35e88105
...@@ -28,7 +28,7 @@ const schema = new Schema({ ...@@ -28,7 +28,7 @@ const schema = new Schema({
properties: { properties: {
file: { file: {
type: 'string', type: 'string',
'x-component': 'QualificationUpload', 'x-component': 'QualitiesUpload',
'x-component-props': { 'x-component-props': {
action: '/api/file/file/upload/prefix', action: '/api/file/file/upload/prefix',
data: { data: {
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-06-01 20:03:23 * @Date: 2021-06-01 20:03:23
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2021-06-04 17:33:30 * @LastEditTime: 2021-06-04 20:47:18
* @Description: 补充资质证明抽屉 * @Description: 补充资质证明抽屉
*/ */
import React from 'react'; import React from 'react';
...@@ -16,7 +16,7 @@ import { ...@@ -16,7 +16,7 @@ import {
import { DatePicker, Checkbox } from '@formily/antd-components' import { DatePicker, Checkbox } from '@formily/antd-components'
import NiceForm from '@/components/NiceForm'; import NiceForm from '@/components/NiceForm';
import { schema } from './schema'; import { schema } from './schema';
import QualificationUpload from '../../../components/QualitiesUpload'; import QualitiesUpload from '../../../components/QualitiesUpload';
import QualificationUploadFormItem from '../../../components/QualificationUploadFormItem'; import QualificationUploadFormItem from '../../../components/QualificationUploadFormItem';
export type FileType = { export type FileType = {
...@@ -120,7 +120,7 @@ const UploadQualificationsDrawer: React.FC<IProps> = (props: IProps) => { ...@@ -120,7 +120,7 @@ const UploadQualificationsDrawer: React.FC<IProps> = (props: IProps) => {
DatePicker, DatePicker,
Checkbox, Checkbox,
CheckboxGroup: Checkbox.Group, CheckboxGroup: Checkbox.Group,
QualificationUpload, QualitiesUpload,
QualificationUploadFormItem, QualificationUploadFormItem,
}} }}
effects={() => { effects={() => {
......
...@@ -2,35 +2,80 @@ ...@@ -2,35 +2,80 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-05-27 10:51:52 * @Date: 2021-05-27 10:51:52
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2021-05-27 11:20:54 * @LastEditTime: 2021-06-04 20:06:51
* @Description: 注册信息 * @Description: 注册信息
*/ */
import React from 'react'; import React, { useState, useEffect } from 'react';
import { Spin } from 'antd';
import { PublicApi } from '@/services/api';
import { GetMemberAbilityInfoApplyDetailResponse } from '@/services/MemberV2Api';
import CustomizeColumn from '@/components/CustomizeColumn'; import CustomizeColumn from '@/components/CustomizeColumn';
import PicWrap from '../../../../components/PicWrap';
import styles from './index.less'; import styles from './index.less';
const RegisterInfo = () => { interface IProps {
const data = [ /**
{ * 上级会员id
title: '公司名称', */
value: '温州市隆昌皮业有限公司', upperMemberId: number,
}, /**
{ * 上级会员角色Id
title: '登记机关', */
value: '广州市工商局', upperRoleId: number,
}, }
{
title: '营业执照', const RegisterInfo: React.FC<IProps> = (props: IProps) => {
value: '广州市工商局', const {
}, upperMemberId,
]; upperRoleId,
} = props;
const [registerInfo, setRegisterInfo] = useState<GetMemberAbilityInfoApplyDetailResponse>();
const [loading, setLoading] = useState(false);
const getRegisterInfo = async () => {
if (!upperMemberId || !upperRoleId) {
return;
}
setLoading(true);
const res = await PublicApi.getMemberAbilityInfoApplyDetail({
upperMemberId: `${upperMemberId}`,
upperRoleId: `${upperRoleId}`,
});
if (res.code === 1000) {
setRegisterInfo(res.data);
}
setLoading(false);
};
useEffect(() => {
getRegisterInfo();
}, [props.upperMemberId, props.upperRoleId]);
return ( return (
<CustomizeColumn <Spin spinning={loading}>
title={( {registerInfo?.registerDetails.map((item) => (
<div className={styles['card-box-title']}>营业执照信息</div> <CustomizeColumn
)} key={item.groupName}
data={data} title={(
/> <div className={styles['card-box-title']}>{item.groupName}</div>
)}
data={(
item.elements.map((ele) => ({
title: ele.fieldLocalName,
value: (
ele.fieldType !== 'upload'
? ele.fieldValue
: (
<PicWrap
pics={[ele.fieldValue]}
/>
)
),
}))
)}
/>
))}
</Spin>
); );
}; };
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-05-26 16:52:48 * @Date: 2021-05-26 16:52:48
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2021-06-01 18:11:27 * @LastEditTime: 2021-06-04 21:13:44
* @Description: 申请会员 * @Description: 申请会员
*/ */
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
...@@ -21,14 +21,51 @@ import { usePageStatus } from '@/hooks/usePageStatus'; ...@@ -21,14 +21,51 @@ import { usePageStatus } from '@/hooks/usePageStatus';
import ReutrnEle from '@/components/ReturnEle'; import ReutrnEle from '@/components/ReturnEle';
import NiceForm from '@/components/NiceForm'; import NiceForm from '@/components/NiceForm';
import MellowCard from '@/components/MellowCard'; import MellowCard from '@/components/MellowCard';
// import { PublicApi } from '@/services/api'; import { PublicApi } from '@/services/api';
// import { GetMemberAbilitySubGetResponse } from '@/services/MemberApi'; import { GetMemberAbilityInfoApplyDepositDetailResponse } from '@/services/MemberV2Api';
import schema from './schema'; import schema from './schema';
import ComingAgreement from './components/ComingAgreement'; import ComingAgreement from './components/ComingAgreement';
import RegisterInfo from './components/RegisterInfo'; import RegisterInfo from './components/RegisterInfo';
import SubmitSuccess from './components/SubmitSuccess'; import SubmitSuccess from './components/SubmitSuccess';
import QualitiesUpload from '../../components/QualitiesUpload';
import QualificationUploadFormItem from '../../components/QualificationUploadFormItem'; import QualificationUploadFormItem from '../../components/QualificationUploadFormItem';
type ValueType = {
step3: { [key: string]: any },
step4: {
/**
* 资质文件
*/
qualities: {
/**
* 到期时间
*/
expireDay: string,
/**
* 是否长期有限
*/
permanent: number[],
/**
* 文件
*/
file: {
/**
* 文件名
*/
name: string,
/**
* 路径
*/
url: string,
/**
* 状态
*/
status: string,
},
}[],
},
}
let countDownLen = 3; let countDownLen = 3;
const formActions = createFormActions(); const formActions = createFormActions();
...@@ -39,11 +76,13 @@ const onStepNext$ = createEffectHook('onStepNext'); ...@@ -39,11 +76,13 @@ const onStepNext$ = createEffectHook('onStepNext');
const onStepPrevious$ = createEffectHook('onStepPrevious'); const onStepPrevious$ = createEffectHook('onStepPrevious');
const MemberQueryApplyMember: React.FC = () => { const MemberQueryApplyMember: React.FC = () => {
const { memberTypeId, roleId } = usePageStatus(); const { upperMemberId, upperRoleId } = usePageStatus();
const [ticktack, setTicktack] = useState(countDownLen); const [ticktack, setTicktack] = useState(countDownLen);
const [currenStep, setCurrenStep] = useState(0); const [currenStep, setCurrenStep] = useState(0);
const [submitLoading, setSubmitLoading] = useState(false); const [submitLoading, setSubmitLoading] = useState(false);
const [unsaved, setUnsaved] = useState(false); const [unsaved, setUnsaved] = useState(false);
const [depositInfo, setDepositInfo] = useState<GetMemberAbilityInfoApplyDepositDetailResponse>();
const [loading, setLoading] = useState(false);
const stepRef = useRef(0); const stepRef = useRef(0);
...@@ -70,35 +109,64 @@ const MemberQueryApplyMember: React.FC = () => { ...@@ -70,35 +109,64 @@ const MemberQueryApplyMember: React.FC = () => {
} }
}, []); }, []);
const handleSubmit = (values: any) => { const getDepositInfo = async () => {
if (!memberTypeId || !roleId) { if (!upperMemberId || !upperRoleId) {
return;
}
setLoading(true);
const res = await PublicApi.getMemberAbilityInfoApplyDepositDetail({
upperMemberId: `${upperMemberId}`,
upperRoleId: `${upperRoleId}`,
});
if (res.code === 1000) {
setDepositInfo(res.data);
}
setLoading(false);
};
useEffect(() => {
getDepositInfo();
}, []);
const handleSubmit = (values: ValueType) => {
if (!upperMemberId || !upperRoleId) {
return; return;
} }
const {
step3,
step4: {
qualities = [],
},
} = values;
setSubmitLoading(true); setSubmitLoading(true);
const msg = message.loading({ const msg = message.loading({
content: '正在保存,请稍候...', content: '正在保存,请稍候...',
duration: 0, duration: 0,
}); });
// PublicApi.postMemberAbilityInfoAddrole({ PublicApi.postMemberAbilityInfoApply({
// memberTypeId, upperMemberId,
// roleId, upperRoleId,
// detail: values, depositDetails: step3,
// }).then(res => { qualities: qualities.map((item) => ({
// if (res.code !== 1000) { expireDay: item.expireDay,
// return; permanent: item.permanent[0] || 0,
// } url: item.file.url,
// setUnsaved(false); name: item.file.name,
// setTimeout(() => { })),
// history.goBack(); }).then(res => {
// }, 800); if (res.code !== 1000) {
// }).finally(() => { return;
// msg(); }
// setSubmitLoading(false); setUnsaved(false);
// }); formActions.dispatch('onStepNext', {})
}).finally(() => {
msg();
setSubmitLoading(false);
});
}; };
return ( return (
<Spin spinning={false}> <Spin spinning={loading}>
<PageHeaderWrapper <PageHeaderWrapper
style={{ style={{
padding: 24, padding: 24,
...@@ -154,8 +222,9 @@ const MemberQueryApplyMember: React.FC = () => { ...@@ -154,8 +222,9 @@ const MemberQueryApplyMember: React.FC = () => {
</Button> </Button>
<Button <Button
type="primary" type="primary"
onClick={() => { onClick={async () => {
formActions.dispatch('onStepNext', {}) await formActions.validate('step3.*');
formActions.dispatch('onStepNext', {});
}} }}
> >
下一步:上传资质证明 下一步:上传资质证明
...@@ -178,8 +247,9 @@ const MemberQueryApplyMember: React.FC = () => { ...@@ -178,8 +247,9 @@ const MemberQueryApplyMember: React.FC = () => {
</Button> </Button>
<Button <Button
type="primary" type="primary"
loading={submitLoading}
onClick={() => { onClick={() => {
formActions.dispatch('onStepNext', {}) formActions.submit()
}} }}
> >
确认提交 确认提交
...@@ -198,12 +268,13 @@ const MemberQueryApplyMember: React.FC = () => { ...@@ -198,12 +268,13 @@ const MemberQueryApplyMember: React.FC = () => {
Checkbox, Checkbox,
CheckboxGroup: Checkbox.Group, CheckboxGroup: Checkbox.Group,
DatePicker, DatePicker,
QualitiesUpload,
QualificationUploadFormItem, QualificationUploadFormItem,
}} }}
expressionScope={{ expressionScope={{
currenStep, currenStep,
ComingAgreement: <ComingAgreement />, ComingAgreement: <ComingAgreement />,
RegisterInfo: <RegisterInfo />, RegisterInfo: <RegisterInfo upperMemberId={upperMemberId} upperRoleId={upperRoleId} />,
SubmitSuccess: <SubmitSuccess />, SubmitSuccess: <SubmitSuccess />,
}} }}
effects={($, actions) => { effects={($, actions) => {
...@@ -223,7 +294,7 @@ const MemberQueryApplyMember: React.FC = () => { ...@@ -223,7 +294,7 @@ const MemberQueryApplyMember: React.FC = () => {
} }
}); });
}} }}
schema={schema} schema={schema(depositInfo?.depositDetails)}
/> />
</MellowCard> </MellowCard>
</PageHeaderWrapper> </PageHeaderWrapper>
......
...@@ -2,205 +2,159 @@ ...@@ -2,205 +2,159 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-05-26 17:00:39 * @Date: 2021-05-26 17:00:39
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2021-06-01 16:53:42 * @LastEditTime: 2021-06-04 20:31:47
* @Description: * @Description:
*/ */
import { ISchema } from '@formily/antd'; import { ISchema } from '@formily/antd';
import { createMemberSchema, ElementType } from '../../utils';
const schema: ISchema = { export type GroupItem = {
type: 'object', /**
properties: { * 组名
STEP_LAYOUT: { */
groupName: string,
/**
* 元素
*/
elements: ElementType[],
};
const schema = (groups: GroupItem[]): ISchema => {
const depositSchema: ISchema = {
type: 'object',
properties: {},
};
(groups || []).forEach((item, index) => {
depositSchema.properties[`CARD_BOX_${index}`] = {
type: 'object', type: 'object',
'x-component': 'step', 'x-component': 'CardBox',
'x-component-props': { 'x-component-props': {
style: { title: item.groupName,
padding: '12px 16px', wrapProps: {
backgroundColor: '#FAFBFC', style: {
}, padding: '24px 16px',
current: '{{currenStep}}',
dataSource: [
{
title: '会员入库协议',
name: 'step1',
},
{
title: '确认注册信息',
name: 'step2',
},
{
title: '填写入库信息',
name: 'step3',
},
{
title: '上传资质证明',
name: 'step4',
}, },
{
title: '完成',
name: 'step5',
},
],
},
},
step1: {
type: 'object',
properties: {
agreement: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{ComingAgreement}}'
},
}, },
}, },
},
step2: {
type: 'object',
properties: { properties: {
registerInfo: { MEGA_LAYOUT: {
type: 'object', type: 'object',
'x-component': 'Children', 'x-component': 'Mega-Layout',
'x-component-props': { 'x-component-props': {
children: '{{RegisterInfo}}' grid: true,
}, full: true,
autoRow: true,
columns: 2,
labelCol: 6,
wrapperCol: 18,
labelAlign: 'left',
},
properties: createMemberSchema(item.elements),
}, },
}, },
}, };
step3: { });
type: 'object',
properties: { return {
INCOMING_INFO: { type: 'object',
type: 'object', properties: {
'x-component': 'CardBox', STEP_LAYOUT: {
'x-component-props': { type: 'object',
title: '填写入库信息', 'x-component': 'step',
wrapProps: { 'x-component-props': {
style: { style: {
padding: '24px 16px', padding: '12px 16px',
}, backgroundColor: '#FAFBFC',
},
}, },
properties: { current: '{{currenStep}}',
MEGA_LAYOUT: { dataSource: [
type: 'object', {
'x-component': 'Mega-Layout', title: '会员入库协议',
'x-component-props': { name: 'step1',
grid: true, },
full: true, {
autoRow: true, title: '确认注册信息',
columns: 2, name: 'step2',
labelCol: 6,
wrapperCol: 18,
labelAlign: 'left',
},
properties: {
mode: {
type: 'string',
title: '商业模式',
enum: [],
'x-component-props': {},
},
description: {
type: 'string',
title: '公司简介',
'x-component': 'textarea',
'x-component-props': {
placeholder: '',
rows: 5,
},
},
industry: {
type: 'string',
title: '主营行业',
'x-component-props': {
placeholder: '',
},
},
partner: {
type: 'string',
title: '合作伙伴',
'x-component-props': {
placeholder: '',
},
},
category: {
type: 'string',
title: '主营品类',
'x-component-props': {
placeholder: '',
},
},
project: {
type: 'string',
title: '代表性合作项目',
'x-component-props': {
placeholder: '',
},
},
scale: {
type: 'string',
title: '公司规模',
'x-component-props': {
placeholder: '',
},
},
brand: {
type: 'string',
title: '代理品牌',
'x-component-props': {
placeholder: '',
},
},
size: {
type: 'string',
title: '工厂面积',
'x-component-props': {
placeholder: '',
},
},
},
}, },
{
title: '填写入库信息',
name: 'step3',
},
{
title: '上传资质证明',
name: 'step4',
},
{
title: '完成',
name: 'step5',
},
],
},
},
step1: {
type: 'object',
properties: {
agreement: {
type: 'object',
'x-component': 'Children',
'x-component-props': {
children: '{{ComingAgreement}}'
},
}, },
}, },
}, },
}, step2: {
step4: { type: 'object',
type: 'object', properties: {
properties: { registerInfo: {
INCOMING_INFO: { type: 'object',
type: 'object', 'x-component': 'Children',
'x-component': 'CardBox', 'x-component-props': {
'x-component-props': { children: '{{RegisterInfo}}'
title: '上传资质证明', },
wrapProps: { },
style: { },
padding: '24px 16px', },
step3: depositSchema,
step4: {
type: 'object',
properties: {
INCOMING_INFO: {
type: 'object',
'x-component': 'CardBox',
'x-component-props': {
title: '上传资质证明',
wrapProps: {
style: {
padding: '24px 16px',
},
}, },
}, },
}, properties: {
properties: { qualities: {
mode: { type: 'array',
type: 'array', 'x-component': 'QualificationUploadFormItem',
'x-component': 'QualificationUploadFormItem', },
}, },
}, },
}, },
}, },
}, step5: {
step5: { type: 'object',
type: 'object', properties: {
properties: { submitSuccess: {
submitSuccess: { type: 'object',
type: 'object', 'x-component': 'Children',
'x-component': 'Children', 'x-component-props': {
'x-component-props': { children: '{{SubmitSuccess}}'
children: '{{SubmitSuccess}}' },
}, },
}, },
}, },
}, },
}, }
}; };
export default schema; export default schema;
\ No newline at end of file
...@@ -62,7 +62,7 @@ const MemberBasicInfo: React.FC<MemberBasicInfoProps> = ({ ...@@ -62,7 +62,7 @@ const MemberBasicInfo: React.FC<MemberBasicInfoProps> = ({
outerStatusName: memberInfo?.outerStatusName, outerStatusName: memberInfo?.outerStatusName,
levelTag: memberInfo?.levelTag, levelTag: memberInfo?.levelTag,
email: memberInfo?.email, email: memberInfo?.email,
createTime: memberInfo?.createTime, createTime: memberInfo?.registerTime,
}} }}
id="basicInfo" id="basicInfo"
/> />
...@@ -90,14 +90,14 @@ const MemberBasicInfo: React.FC<MemberBasicInfoProps> = ({ ...@@ -90,14 +90,14 @@ const MemberBasicInfo: React.FC<MemberBasicInfoProps> = ({
{/* 其他注册信息 */} {/* 其他注册信息 */}
{ {
memberInfo && memberInfo.groups memberInfo && memberInfo.registerDetails
? memberInfo.groups.map((item, index) => ( ? memberInfo.registerDetails.map((item, index) => (
<Col span={24} key={`group${index}`}> <Col span={24} key={`group${index}`}>
<CustomizeColumn <CustomizeColumn
title={item.groupName} title={item.groupName}
data={( data={(
item.elements.map((ele) => ({ item.elements.map((ele) => ({
title: ele.fieldCNName, title: ele.fieldLocalName,
value: ( value: (
ele.fieldType !== 'upload' ele.fieldType !== 'upload'
? ele.fieldValue ? ele.fieldValue
......
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