Commit d922d3bd authored by XieZhiXiong's avatar XieZhiXiong

对接中

parent fe5903e5
......@@ -122,6 +122,22 @@ export const VIP_RULE_COMMENT = 3; // 评论
// 会员状态
export const MEMBER_STATUS_NORMAL = 1; // 正常的
export const MEMBER_STATUS_FROZEN = 2; // 冻结的
export const MEMBER_STATUS = {
[MEMBER_STATUS_NORMAL]: '正常',
[MEMBER_STATUS_FROZEN]: '冻结',
};
// 会员类型
export const MEMBER_TYPE_CORPORATE = 1; // 企业会员
export const MEMBER_TYPE_INDIVIDUAL = 2; // 个人会员
export const MEMBER_TYPE_CHANNEL_CORPORATE = 3; // 渠道企业会员
export const MEMBER_TYPE_CHANNEL_INDIVIDUAL = 4; // 渠道个人会员
export const MEMBER_TYPE = {
[MEMBER_TYPE_CORPORATE]: '企业会员',
[MEMBER_TYPE_INDIVIDUAL]: '个人会员',
[MEMBER_TYPE_CHANNEL_CORPORATE]: '渠道企业会员',
[MEMBER_TYPE_CHANNEL_INDIVIDUAL]: '渠道个人会员',
};
export const ORDER_TYPE = ['',
'询价采购',
......
......@@ -7,25 +7,33 @@ import MellowCard from '@/components/MellowCard';
import styles from './index.less';
interface AuditProcessProp {
single?: string
outerVerifySteps?: { step: number, stepName: string, roleName: string }[];
innerVerifySteps?: { step: number, stepName: string, roleName: string }[];
};
const AuditProcess: React.FC<{}> = () => (
const AuditProcess: React.FC<AuditProcessProp> = ({ outerVerifySteps = [], innerVerifySteps = [] }) => (
<MellowCard>
<Tabs onChange={() => {}}>
<Tabs.TabPane tab="外部审核流程" key="1">
<Steps style={{ marginTop: 30 }} progressDot current={2}>
<Steps.Step title="会员" description="申请注册" />
<Steps.Step title="平台" description="审核会员" />
<Steps.Step title="完成" description="" />
{outerVerifySteps.map(item => (
<Steps.Step
key={item.step}
title={item.stepName}
description={item.roleName}
/>
))}
</Steps>
</Tabs.TabPane>
<Tabs.TabPane tab="内部审核流程" key="2">
<Steps style={{ marginTop: 30 }} progressDot current={2}>
<Steps.Step title="提交审核会员" description="运营经理" />
<Steps.Step title="审核会员" description="运营经理" />
<Steps.Step title="审核会员" description="副总经理" />
<Steps.Step title="确认会员审核结果" description="运营人员" />
{innerVerifySteps.map(item => (
<Steps.Step
key={item.step}
title={item.roleName}
description={item.stepName}
/>
))}
</Steps>
</Tabs.TabPane>
</Tabs>
......
......@@ -10,11 +10,32 @@ import MellowCard from '@/components/MellowCard';
import styles from './index.less';
interface FlowRecordsProps {
export interface InnerHistoryItem {
createTime?: string,
id?: number;
operatorName?: string;
operatorOrgName?: string;
operatorJobTitle?: string;
operation?: string;
innerStatusName?: string;
remark?: string;
};
export interface OuterHistoryItem {
createTime?: string,
id?: number;
operation?: string;
operatorRoleName?: string;
remark?: string;
statusDescription?: string;
};
interface FlowRecordsProps {
outerHistory?: OuterHistoryItem[];
innerHistory?: InnerHistoryItem[];
};
const FlowRecords: React.FC<{}> = () => {
const FlowRecords: React.FC<FlowRecordsProps> = ({ outerHistory = [], innerHistory = [] }) => {
const columns: EditableColumns[] = [
{
......@@ -25,29 +46,29 @@ const FlowRecords: React.FC<{}> = () => {
},
{
title: '操作角色',
dataIndex: 'role',
dataIndex: 'operatorRoleName',
align: 'center',
},
{
title: '状态',
dataIndex: 'status',
dataIndex: 'statusDescription',
align: 'center',
render: text => <Badge color={STATUS_COLOR_MAP[text]} text={STATUS_COLOR_TXT[text]} />,
},
{
title: '操作',
dataIndex: 'action',
dataIndex: 'operation',
align: 'center',
},
{
title: '操作时间',
dataIndex: 'created',
dataIndex: 'createTime',
align: 'center',
ellipsis: true,
},
{
title: '审核意见',
dataIndex: 'opinion',
dataIndex: 'remark',
align: 'center',
ellipsis: true,
},
......@@ -62,39 +83,39 @@ const FlowRecords: React.FC<{}> = () => {
},
{
title: '操作人',
dataIndex: 'operator',
dataIndex: 'operatorName',
align: 'center',
},
{
title: '部门',
dataIndex: 'department',
dataIndex: 'operatorOrgName',
align: 'center',
},
{
title: '职位',
dataIndex: 'job',
dataIndex: 'operatorJobTitle',
align: 'center',
},
{
title: '状态',
dataIndex: 'status',
dataIndex: 'innerStatusName',
align: 'center',
render: text => <Badge color={STATUS_COLOR_MAP[text]} text={STATUS_COLOR_TXT[text]} />,
render: text => <Badge color={STATUS_COLOR_MAP[text]} text={text} />,
},
{
title: '操作',
dataIndex: 'action',
dataIndex: 'operation',
align: 'center',
},
{
title: '操作时间',
dataIndex: 'created',
dataIndex: 'createTime',
align: 'center',
ellipsis: true,
},
{
title: '审核意见',
dataIndex: 'opinion',
dataIndex: 'remark',
align: 'center',
ellipsis: true,
},
......@@ -105,16 +126,7 @@ const FlowRecords: React.FC<{}> = () => {
<Tabs onChange={() => {}}>
<Tabs.TabPane tab="流转记录" key="1">
<PolymericTable
dataSource={[
{
id: 1,
role: '供应商',
status: 0,
action: '申请注册',
created: '2020-05-12 08:08',
opinion: '同意',
},
]}
dataSource={outerHistory}
columns={columns}
loading={false}
pagination={null}
......@@ -122,18 +134,7 @@ const FlowRecords: React.FC<{}> = () => {
</Tabs.TabPane>
<Tabs.TabPane tab="内部单据流转记录" key="2">
<PolymericTable
dataSource={[
{
id: 1,
operator: '供应商',
department: '运营部',
job: '运营人员',
status: 0,
action: '提交审核会员',
created: '2020-05-12 08:08',
opinion: '同意',
},
]}
dataSource={innerHistory}
columns={columns2}
loading={false}
pagination={null}
......
......@@ -13,7 +13,7 @@ export interface HeadInfoProps {
const HeadInfo: React.FC<HeadInfoProps> = ({ info, extra }) => (
<div className={styles.head}>
<div className={styles['head-prefix']}>
{ info && info.name.length ? info.name[0] : '' }
{ info && info.name && info.name.length ? info.name[0] : '' }
</div>
<div className={styles['head-name']}>
{info.name || ''}
......
import { MEMBER_STATUS_NORMAL, MEMBER_STATUS_FROZEN } from '@/constants';
export const STATUS_COLOR_MAP = {
0: '#669EDE',
1: '#41CC9E',
......@@ -9,3 +11,8 @@ export const STATUS_COLOR_TXT = {
1: '审核通过',
2: '冻结',
};
export const MEMBER_STATUS_TAG_MAP = {
MEMBER_STATUS_NORMAL: 'default',
MEMBER_STATUS_FROZEN: 'success'
};
\ No newline at end of file
......@@ -18,7 +18,14 @@ import { GetMemberAbilitySubGetResponse } from '@/services/MemberApi';
import { initDetailSchema } from './schema';
const formActions = createFormActions();
const { onFormInit$, onFieldValueChange$, onFieldInit$ } = FormEffectHooks;
const {
onFormInit$,
onFormInitialValueChange$,
onFieldValueChange$,
onFieldInit$,
onFieldInputChange$,
onFieldInitialValueChange$,
} = FormEffectHooks;
const addMember: React.FC<any> = props => {
const { id, validateId } = usePageStatus();
......@@ -39,12 +46,28 @@ const addMember: React.FC<any> = props => {
}
const {
memberTypeEnum,
groups,
groups = [],
areaCodes,
...rest
}: any = (res.data || {});
// 注册资料处理
const detail = {};
for (let i = 0; i < groups.length; i++) {
const item = groups[i];
if (item.elements) {
for (let j = 0; j < item.elements.length; j++) {
const ele = item.elements[j];
detail[ele.fieldName] = ele.fieldValue;
}
}
}
setMemberInfo({
memberTypeId: memberTypeEnum,
...rest,
areas: areaCodes,
...detail,
});
}).finally(() => {
setInfoLoading(false);
......@@ -116,52 +139,25 @@ const addMember: React.FC<any> = props => {
return {};
};
// 获取会员等级下拉框
const getPageitemsRole = (id: string) => {
return new Promise((resolve, reject) => {
PublicApi.getMemberAbilitySubPageitemsRole({
memberTypeId: id,
}).then(res => {
if (res.code === 1000) {
const { data = [] }: any = res;
resolve(data.map(item => ({ label: item.roleName, value: item.roleId })));
}
resolve([]);
}).catch(err => {
reject(err);
});
});
};
const beforeUpload = (file: any) => {
const isJpgOrPng =
file.type === 'image/jpeg' ||
file.type === 'image/png' ||
file.type === 'image/jpg';
if (!isJpgOrPng) {
message.error('仅支持上传JPEG/JPG/PNG文件!');
}
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
message.error('上传图片不超过2MB!');
}
return isJpgOrPng && isLt2M;
};
const useAsyncLinkageEffect = () => {
const linkage = useLinkageUtils();
let areasData = [];
// 手动触发改变的话重置角色、等级下拉框
onFieldInputChange$('memberTypeId').subscribe(() => {
console.log('onFieldInputChange')
linkage.value('roleId', undefined);
linkage.enum('roleId', []);
linkage.value('levelId', undefined);
linkage.enum('levelId', []);
});
// 根据会员类型
onFieldValueChange$('memberTypeId').subscribe(fieldState => {
if (!fieldState.value) {
return;
}
// 查询角色下拉
linkage.value('roleId', undefined);
linkage.enum('roleId', []);
linkage.value('levelId', undefined);
linkage.enum('levelId', []);
linkage.loading('roleId');
PublicApi.getMemberAbilitySubPageitemsRole({
memberTypeId: fieldState.value,
......@@ -200,15 +196,15 @@ const addMember: React.FC<any> = props => {
const channelType = channelTypes.map(item => ({ label: item.channelTypeName, value: item.channelTypeId }))
if (areasOptions.length) {
formActions.setFieldState('tabs.tab-2.MEGA_LAYOUT1.areas.*.pcode', state => {
formActions.setFieldState('areas.*.pcode', state => {
FormPath.setIn(state, 'props.enum', areasOptions);
});
}
formActions.setFieldState('tabs.tab-2.MEGA_LAYOUT1.channelLevel', state => {
formActions.setFieldState('channelLevel', state => {
FormPath.setIn(state, 'value', channelLevelTag);
});
formActions.setFieldState('tabs.tab-2.MEGA_LAYOUT1.channelTypeId', state => {
formActions.setFieldState('channelTypeId', state => {
FormPath.setIn(state, 'props.enum', channelType);
});
......@@ -231,6 +227,12 @@ const addMember: React.FC<any> = props => {
});
});
// 手动触发改变的话重置等级下拉框
onFieldInputChange$('*(memberTypeId,roleId)').subscribe(() => {
linkage.value('levelId', undefined);
linkage.enum('levelId', []);
});
// 根据会员类型和角色,查询等级下拉
onFieldValueChange$('*(memberTypeId,roleId)').subscribe(fieldState => {
const selfName = fieldState.name;
......@@ -239,8 +241,6 @@ const addMember: React.FC<any> = props => {
const otherValue = formActions.getFieldState(otherName, state => state.value);
if (selfValue && otherValue) {
linkage.value('levelId', undefined);
linkage.enum('levelId', []);
linkage.loading('levelId');
PublicApi.getMemberAbilitySubPageitemsLevel({
......@@ -259,14 +259,14 @@ const addMember: React.FC<any> = props => {
});
// 渠道信息省级变化,筛选出对应的市级数据
onFieldValueChange$('tabs.tab-2.MEGA_LAYOUT1.areas.*.pcode').subscribe(fieldState => {
onFieldValueChange$('areas.*.pcode').subscribe(fieldState => {
const province = areasData.find(item => item.code === fieldState.value);
if (!province) {
return;
}
const city = (province.children || []).map(item => ({ label: item.name, value: item.code }));
formActions.setFieldState(
FormPath.transform(fieldState.name, /\d/, $1 => `tabs.tab-2.MEGA_LAYOUT1.areas.${$1}.ccode`),
FormPath.transform(fieldState.name, /\d/, $1 => `areas.${$1}.ccode`),
state => {
FormPath.setIn(state, 'value', undefined);
FormPath.setIn(state, 'props.enum', city);
......@@ -297,7 +297,7 @@ const addMember: React.FC<any> = props => {
<NiceForm
onSubmit={handleSubmit}
actions={formActions}
initialValues={memberInfo}
initialValues={memberInfo || {}}
effects={($, actions) => {
useStateFilterSearchLinkageEffect(
$,
......
......@@ -135,7 +135,6 @@ const memberMaintain: React.FC<[]> = () => {
) : (
''
)} */}
{record.outerStatusName === '待审核' ? (
<>
<Button
type="link"
......@@ -149,7 +148,6 @@ const memberMaintain: React.FC<[]> = () => {
<Button type="link">删除</Button>
</Popconfirm>
</>
) : null}
</>
),
},
......
import React, { useState, useEffect, useRef, ReactNode } from 'react';
import { history } from 'umi';
import { Badge, Button, Card, message } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { SaveOutlined } from '@ant-design/icons';
import { createFormActions } from '@formily/antd';
import { ColumnType } from 'antd/lib/table/interface';
import ReutrnEle from '@/components/ReturnEle';
import NiceForm from '@/components/NiceForm';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { initDetailSchema } from './schema';
import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect';
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect';
import { PublicApi } from '@/services/api';
const formActions = createFormActions();
const addMember: React.FC<any> = props => {
const ref = useRef<any>({});
const [memberItems, setMemberItems] = useState<any>({});
const data = [
{
key: '1',
sn: '1',
roleName: '供应商',
status: '1',
operation: '申请注册',
useTime: '2020-05-12 08:08',
result: '无',
},
];
const columns: ColumnType<any>[] = [
{
title: '序号',
dataIndex: 'sn',
align: 'center',
key: 'sn',
},
{
title: '操作角色',
dataIndex: 'roleName',
align: 'center',
key: 'roleName',
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
key: 'status',
render: (text: any, record: any) => {
let component: ReactNode = null;
component = <Badge color="#FFC400" text="待审核" />;
return component;
},
},
{
title: '操作',
dataIndex: 'operation',
align: 'center',
key: 'operation',
},
{
title: '操作时间',
dataIndex: 'useTime',
align: 'center',
key: 'useTime',
},
{
title: '审核意见',
dataIndex: 'result',
align: 'center',
key: 'result',
},
];
useEffect(() => {
PublicApi.getMemberMaintenanceAddpageitems().then(res => {
setMemberItems(res.data);
});
}, []);
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
const queryResult = data.find(v => v.key === params.keywords);
setTimeout(() => {
resolve({
code: 200,
message: '',
data: queryResult ? [queryResult] : data,
});
}, 1000);
});
};
const handleSubmit = (values: any) => {
console.log(values);
};
// 会员类型、会员角色、会员等级选项
const fetchSelectOptions = async () => {
const { data } = await PublicApi.getMemberMaintenanceAddpageitems();
return {
memberTypeId: fetchSomeOptions(data.memberTypes),
roleId: fetchSomeOptions(data.memberRoles),
level: fetchSomeOptions(data.memberLevels),
};
};
// 获取手机code
const fetchTelCode = async () => {
const { data } = await PublicApi.getManageGetTelCode();
return data;
};
const fetchSomeOptions = data => {
return data.map(v => ({ label: v.text, value: v.id }));
};
const beforeUpload = (file: any) => {
const isJpgOrPng =
file.type === 'image/jpeg' ||
file.type === 'image/png' ||
file.type === 'image/jpg';
if (!isJpgOrPng) {
message.error('仅支持上传JPEG/JPG/PNG文件!');
}
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
message.error('上传图片不超过2MB!');
}
return isJpgOrPng && isLt2M;
};
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />}
title={
props.location.query.type === 'add'
? '新建会员'
: props.location.query.type === 'change'
? '编辑会员'
: '查看会员'
}
extra={[
<Button
key="1"
type="primary"
icon={<SaveOutlined />}
onClick={() => formActions.submit()}
>
保存
</Button>,
]}
>
<Card>
<NiceForm
onSubmit={handleSubmit}
actions={formActions}
effects={($, actions) => {
useStateFilterSearchLinkageEffect(
$,
actions,
'name',
FORM_FILTER_PATH,
);
useAsyncInitSelect(
['memberTypeId', 'roleId', 'level'],
fetchSelectOptions,
);
useAsyncSelect('telCode', fetchTelCode);
}}
schema={initDetailSchema(memberItems)}
/>
</Card>
</PageHeaderWrapper>
);
};
export default addMember;
This diff is collapsed.
import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { PageHeader, Tag, Descriptions, Button, Modal, Spin } from 'antd';
import { PageHeader, Tag, Descriptions, Button, Modal, Badge, Spin } from 'antd';
import { SettingOutlined, StopOutlined } from '@ant-design/icons';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { STATUS_COLOR_MAP, STATUS_COLOR_TXT } from '../constant';
import { usePageStatus } from '@/hooks/usePageStatus';
import { PublicApi } from '@/services/api';
import { GetMemberAbilityMaintenanceDetailBasicResponse } from '@/services/MemberApi';
import { MEMBER_STATUS_NORMAL, MEMBER_STATUS_FROZEN } from '@/constants';
import {
MEMBER_STATUS_NORMAL,
MEMBER_STATUS_FROZEN,
MEMBER_TYPE_CHANNEL_CORPORATE,
MEMBER_TYPE_CHANNEL_INDIVIDUAL,
} from '@/constants';
import NiceForm from '@/components/NiceForm';
import { auditModalSchema } from './schema';
import HeadInfo from '../components/HeadInfo';
......@@ -34,7 +39,7 @@ const maintainDetail: React.FC<{}> = () => {
memberId: id,
validateId,
}).then(res => {
if (res.code === 100) {
if (res.code === 1000) {
setDetailed(res.data);
}
}).finally(() => {
......@@ -51,7 +56,7 @@ const maintainDetail: React.FC<{}> = () => {
return PublicApi.postMemberMaintenanceStatus({
memberId: id,
validateId: validateId,
status: detailed.status === MEMBER_STATUS_NORMAL ? MEMBER_STATUS_FROZEN : MEMBER_STATUS_NORMAL,
status: detailed && detailed.status === MEMBER_STATUS_NORMAL ? MEMBER_STATUS_FROZEN : MEMBER_STATUS_NORMAL,
remark: values.remark || '',
}).then(res => {
if (res.code === 1000) {
......@@ -71,14 +76,14 @@ const maintainDetail: React.FC<{}> = () => {
title={
<HeadInfo
info={{
name: '广州市极致皮具有限公司',
name: detailed?.name,
level: 1,
}}
/>
}
extra={(
<>
{detailed.status === MEMBER_STATUS_NORMAL ? (
{detailed && detailed.status === MEMBER_STATUS_NORMAL ? (
<Button
icon={<StopOutlined />}
onClick={() => {}}
......@@ -104,14 +109,17 @@ const maintainDetail: React.FC<{}> = () => {
padding: '0 32px',
}}
>
<Descriptions.Item label="会员类型">{123}</Descriptions.Item>
<Descriptions.Item label="会员角色" span={2}>{123}</Descriptions.Item>
<Descriptions.Item label="会员类型">{detailed?.memberTypeName}</Descriptions.Item>
<Descriptions.Item label="会员角色" span={2}>{detailed?.roleName}</Descriptions.Item>
<Descriptions.Item label="会员状态">
{/* <Tag color={STATUS_COLOR_MAP[1]}>{STATUS_COLOR_TXT[1]}</Tag> */}
<StatusTag type="success" title="正常" />
</Descriptions.Item>
<Descriptions.Item label="外部状态">
<Tag color={STATUS_COLOR_MAP[2]}>{STATUS_COLOR_TXT[2]}</Tag>
<StatusTag type="success" title={detailed?.innerStatusName} />
</Descriptions.Item>
<Descriptions.Item label="内部状态">
<Badge color={STATUS_COLOR_MAP[2]} text={detailed?.outerStatusName} />
</Descriptions.Item>
</Descriptions>
</PageHeader>
......@@ -123,13 +131,33 @@ const maintainDetail: React.FC<{}> = () => {
marginBottom: 24,
}}
>
<AuditProcess />
<AuditProcess
outerVerifySteps={detailed?.outerVerifySteps}
innerVerifySteps={detailed?.innerVerifySteps}
/>
</div>
<BasicInfo />
<BasicInfo
basic={{
account: detailed?.account,
phone: detailed?.phone,
email: detailed?.email,
created: detailed?.createTime,
}}
channel={{
memberType: detailed?.memberTypeEnum,
level: detailed?.channelLevelTag,
type: detailed?.channelTypeName,
areas: detailed?.areas,
desc: detailed?.remark,
}}
extra={detailed?.groups}
outerHistory={detailed?.outerHistory}
innerHistory={detailed?.innerHistory}
/>
<Modal
title={detailed.status === 1 ? '会员解冻' : '会员冻结'}
title={detailed && detailed.status === 1 ? '会员解冻' : '会员冻结'}
visible={modalVisible}
onOk={() => formActions.submit()}
onCancel={() => setModalVisible(false)}
......@@ -140,7 +168,7 @@ const maintainDetail: React.FC<{}> = () => {
effects={($, { setFieldState }) => {
FormEffectHooks.onFieldInit$('remark').subscribe(state => {
setFieldState('remark', targetState => {
targetState.props.title = `会员${detailed.status === 1 ? '解冻' : '冻结'}原因`;
targetState.props.title = `会员${detailed && detailed.status === 1 ? '解冻' : '冻结'}原因`;
});
});
}}
......
......@@ -29,27 +29,27 @@ export const maintianSchema: ISchema = {
properties: {
memberType: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员类型(全部)',
defaultValue: undefined,
},
enum: [],
},
roleId: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员角色(全部)',
defaultValue: undefined,
},
enum: [],
},
level: {
type: 'string',
default: undefined,
enum: [],
'x-component-props': {
placeholder: '会员等级(全部)',
defaultValue: undefined,
},
enum: [],
},
source: {
type: 'string',
......@@ -86,10 +86,11 @@ export const maintianSchema: ISchema = {
timeRange: {
type: 'string',
'x-component-props': {
placeholder: '时间范围(全部)',
placeholder: '请选择',
defaultValue: undefined,
},
enum: [
{ label: '时间范围(全部)', value: 0 },
{ label: '今天', value: 1 },
{ label: '一周内', value: 2 },
{ label: '一个月内', value: 3 },
......
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