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>
......
......@@ -5,15 +5,47 @@ import {
Descriptions,
} from 'antd';
import MellowCard from '@/components/MellowCard';
import {
MEMBER_TYPE_CHANNEL_CORPORATE,
MEMBER_TYPE_CHANNEL_INDIVIDUAL,
} from '@/constants';
import PicWrap from '../PicWrap';
import FlowRecords from '../FlowRecords';
import FlowRecords, { InnerHistoryItem, OuterHistoryItem } from '../FlowRecords';
import styles from './index.less';
interface PageProps {
detailData: any;
interface BasicInfoProps {
basic?: {
account?: string,
phone?: string,
email?: string,
created?: string,
};
channel?: {
memberType?: number,
level?: string,
type?: string,
areas?: string[],
desc?: string,
};
extra?: {
groupName: string,
elements: {
fieldCNName?: string,
fieldType?: string,
fieldValue?: any,
}[],
}[];
outerHistory?: OuterHistoryItem[];
innerHistory?: InnerHistoryItem[];
}
const BasicInfo: React.FC<{}> = props => {
const BasicInfo: React.FC<BasicInfoProps> = ({
basic = {},
channel = {},
extra = [],
outerHistory = [],
innerHistory = [],
}) => {
return (
<div className={styles.basicInfo}>
......@@ -23,128 +55,94 @@ const BasicInfo: React.FC<{}> = props => {
title="基本信息"
>
<Descriptions column={2} className={styles.descriptions}>
<Descriptions.Item label="登录账户">185 2929 6547</Descriptions.Item>
<Descriptions.Item label="注册手机号">1810000000</Descriptions.Item>
<Descriptions.Item label="注册邮箱">kuaimeizheng@163.com</Descriptions.Item>
<Descriptions.Item label="申请时间">2020-12-26 13:45</Descriptions.Item>
<Descriptions.Item label="登录账户">{basic.account}</Descriptions.Item>
<Descriptions.Item label="注册手机号">{basic.phone}</Descriptions.Item>
<Descriptions.Item label="注册邮箱">{basic.email}</Descriptions.Item>
<Descriptions.Item label="申请时间">{basic.created}</Descriptions.Item>
</Descriptions>
</MellowCard>
</Col>
{
(
channel.memberType === MEMBER_TYPE_CHANNEL_CORPORATE ||
channel.memberType === MEMBER_TYPE_CHANNEL_INDIVIDUAL
) && (
<Col span={24}>
<MellowCard
title="渠道信息"
>
<Descriptions column={2} className={styles.descriptions}>
<Descriptions.Item label="渠道级别">二级</Descriptions.Item>
<Descriptions.Item label="渠道类型">电商渠道</Descriptions.Item>
<Descriptions.Item label="渠道级别">{channel.level}</Descriptions.Item>
<Descriptions.Item label="渠道类型">{channel.type}</Descriptions.Item>
<Descriptions.Item label="代理地市">
<Row gutter={[16, 16]}>
<Col span={12}>广东省/广州市</Col>
<Col span={12}>广东省/广州市</Col>
<Col span={12}>广东省/广州市</Col>
<Col span={12}>广东省/广州市</Col>
{
channel.areas ?
channel.areas.map(item => (
<Col key={item} span={12}>{item}</Col>
)) :
null
}
</Row>
</Descriptions.Item>
<Descriptions.Item label="渠道描述">门店</Descriptions.Item>
<Descriptions.Item label="渠道描述">{channel.desc}</Descriptions.Item>
</Descriptions>
</MellowCard>
</Col>
)
}
<Col span={24}>
{extra.map((item, index) => (
<Col key={index} span={24}>
<MellowCard
title="营业执照"
title={item.groupName}
>
<Row gutter={20}>
<Col span={12}>
<Descriptions column={1} className={styles.descriptions}>
<Descriptions.Item label="公司名称">温州市隆昌皮业有限公司</Descriptions.Item>
<Descriptions.Item label="企业类型">
股份有限公司(非上市)
</Descriptions.Item>
<Descriptions.Item label="住所">中国浙江省温州市</Descriptions.Item>
<Descriptions.Item label="法定代表人">张三</Descriptions.Item>
<Descriptions.Item label="注册资本">壹仟万元整</Descriptions.Item>
<Descriptions.Item label="成立日期">2010-06-14</Descriptions.Item>
<Descriptions.Item label="营业期限">2010-06-14 至 长期有效</Descriptions.Item>
<Descriptions.Item label="经营范围">
经营全粒面牛皮,修面皮,漆色皮,打腊皮,水腊皮,疯马皮,珠光变色,大小荔枝纹,打腊水腊皮,
高光变色皮,胎牛皮、小牛纳帕皮、磨砂皮、镜面皮、开边珠、自然摔、烧焦打蜡皮,牛巴革,混种
羊面皮,山羊里皮,仿鹿皮,羊皮羊反绒系列
</Descriptions.Item>
</Descriptions>
</Col>
<Col span={12}>
<Descriptions column={1} className={styles.descriptions}>
<Descriptions.Item label="登记机关">广州市工商局</Descriptions.Item>
<Descriptions.Item label="登记时间">2010-06-14</Descriptions.Item>
<Descriptions.Item label="统一社会信用代码">4324324325425435</Descriptions.Item>
<Descriptions.Item label="营业执照">
{item.elements.map((ele, index) => index % 2 !== 0 ? (
<Descriptions.Item key={index} label={ele.fieldCNName}>
{
ele.fieldType !== 'upload' ?
ele.fieldValue :
(
<PicWrap
pics={[
'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598594727734&di=20420459d5a6f2c95dd9bc5c47786e98&imgtype=0&src=http%3A%2F%2Fa3.att.hudong.com%2F14%2F75%2F01300000164186121366756803686.jpg',
'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598594742248&di=b76fef1833c6566d330ac88f6dbe9bae&imgtype=0&src=http%3A%2F%2Fa1.att.hudong.com%2F05%2F00%2F01300000194285122188000535877.jpg',
]}
pics={[ele.fieldValue]}
/>
)
}
</Descriptions.Item>
</Descriptions>
</Col>
</Row>
</MellowCard>
</Col>
<Col span={24}>
<MellowCard
title="法定代表人信息"
>
<Row gutter={20}>
<Col span={12}>
<Descriptions column={1} className={styles.descriptions}>
<Descriptions.Item label="法人姓名">张三</Descriptions.Item>
<Descriptions.Item label="法人手机号">
+86 186 7700 2345
</Descriptions.Item>
<Descriptions.Item label="法人身份证号">440911198809076654</Descriptions.Item>
) : null)}
</Descriptions>
</Col>
<Col span={12}>
<Descriptions column={1} className={styles.descriptions}>
<Descriptions.Item label="法人身份证信息">
{item.elements.map((ele, index) => index % 2 === 0 ? (
<Descriptions.Item key={index} label={ele.fieldCNName}>
{
ele.fieldType !== 'upload' ?
ele.fieldValue :
(
<PicWrap
pics={[
'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598594727734&di=20420459d5a6f2c95dd9bc5c47786e98&imgtype=0&src=http%3A%2F%2Fa3.att.hudong.com%2F14%2F75%2F01300000164186121366756803686.jpg',
'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598594742248&di=b76fef1833c6566d330ac88f6dbe9bae&imgtype=0&src=http%3A%2F%2Fa1.att.hudong.com%2F05%2F00%2F01300000194285122188000535877.jpg',
]}
pics={[ele.fieldValue]}
/>
)
}
</Descriptions.Item>
) : null)}
</Descriptions>
</Col>
</Row>
</MellowCard>
</Col>
<Col span={24}>
<MellowCard
title="联系信息"
>
<Descriptions column={2} className={styles.descriptions}>
<Descriptions.Item label="联系人">张三</Descriptions.Item>
<Descriptions.Item label="地址">中国浙江省温州市</Descriptions.Item>
<Descriptions.Item label="固定联系电话">
021 33232424
</Descriptions.Item>
<Descriptions.Item label="邮编">510222</Descriptions.Item>
<Descriptions.Item label="手机号码">+86 186 77003245</Descriptions.Item>
<Descriptions.Item label="网址">www.shushangyun.com</Descriptions.Item>
<Descriptions.Item label="传真号码">021 43434353</Descriptions.Item>
<Descriptions.Item label="邮箱">kuaimeizheng@163.com</Descriptions.Item>
</Descriptions>
</MellowCard>
</Col>
))}
<Col span={24}>
<FlowRecords />
<FlowRecords
outerHistory={outerHistory}
innerHistory={innerHistory}
/>
</Col>
</Row>
</div>
......
......@@ -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;
......@@ -19,58 +19,28 @@ import {
import { StandardTable } from 'god';
import { ColumnType } from 'antd/lib/table/interface';
import { createFormActions, FormEffectHooks } from '@formily/antd';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import EyePreview from '@/components/EyePreview';
import StatusSwitch from '@/components/StatusSwitch';
import UploadModal from '@/components/UploadModal';
import NiceForm from '@/components/NiceForm';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { maintianSchema, auditModalSchema } from './schema';
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect';
import { PublicApi } from '@/services/api';
import LevelBrand from '../components/LevelBrand';
import StatusTag from '../components/StatusTag';
import { coverColFiltersItem } from '../utils';
const mock = [
{
memberId: 1,
validateId: 1,
name: '模拟会员1',
memberTypeName: '模拟会员类型1',
roleName: '模拟角色',
sourceName: '2020.08.28 15:14:00',
memberStatus: '正常',
status: 1,
outerStatusName: '待审核',
innerStatusName: '审核通过',
},
{
memberId: 2,
validateId: 2,
name: '模拟会员1',
memberTypeName: '模拟会员类型1',
roleName: '模拟角色',
sourceName: '2020.08.28 15:14:00',
memberStatus: '正常',
status: 0,
outerStatusName: '待审核',
innerStatusName: '待提交审核',
},
];
import { PublicApi } from '@/services/api';
import { MEMBER_STATUS_NORMAL, MEMBER_STATUS_FROZEN, MEMBER_STATUS } from '@/constants';
import { MEMBER_STATUS_TAG_MAP } from '../constant';
import { maintianSchema } from './schema';
const formActions = createFormActions();
const fetchListData = async (params: any) => {
const fetchData = async (params: any) => {
let res = await PublicApi.getMemberAbilityMaintenancePage(params);
return res.data;
};
const memberMaintain: React.FC<[]> = () => {
const ref = useRef<any>({});
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([]);
const [visibleModal, setVisibleModal] = useState(false);
const [modalVisible, setModalVisible] = useState(false);
const [currentItem, setCurrentItem] = useState<any>({});
const defaultColumns: ColumnType<any>[] = [
{
......@@ -82,25 +52,30 @@ const memberMaintain: React.FC<[]> = () => {
title: '会员名称',
dataIndex: 'name',
align: 'center',
render: (text: any, record: any) => (
render: (text, record) => (
<>
<EyePreview
url={`/memberCenter/memberAbility/manage/maintainDetail?id=${record.memberId}&validateId=${record.validateId}&preview=1`}
>
{text}
</EyePreview>
<div>
<LevelBrand level={1} />
</div>
</>
),
},
{
title: '会员类型',
dataIndex: 'memberTypeName',
align: 'center',
render: (text: any, record: any) => <>{text}</>,
render: (text, record) => <>{text}</>,
},
{
title: '会员角色',
dataIndex: 'roleName',
align: 'center',
render: (text: any, record: any) => <>{text}</>,
render: (text, record) => <>{text}</>,
},
{
title: '申请来源/时间',
......@@ -121,81 +96,49 @@ const memberMaintain: React.FC<[]> = () => {
},
{
title: '会员状态',
dataIndex: 'statusName',
dataIndex: 'status',
align: 'center',
filters: [],
onFilter: (value, record) => record.status === value,
filterMultiple: false,
render: (text: any, record: any) => (
<StatusTag type="success" title="正常" />
// <StatusSwitch
// handleConfirm={() => handleModify(record)}
// record={record}
// fieldNames="status"
// />
),
render: (text, record) => <StatusTag type={MEMBER_STATUS_TAG_MAP[text]} title={MEMBER_STATUS[text]} />,
},
{
title: '外部状态',
dataIndex: 'outerStatusName',
align: 'center',
filters: [],
onFilter: (value, record) => record.outerStatusName === value,
filterMultiple: false,
render: (text: any, record: any) => <StatusTag type="warnning" title="待审核" />,
render: (text, record) => <Badge color="#FFC400" text={text} />,
},
{
title: '内部状态',
title: '内部状态状态',
dataIndex: 'innerStatusName',
align: 'center',
filters: [],
onFilter: (value, record) => record.innerStatusName === value,
filterMultiple: false,
render: (text: any, record: any) => <Badge color="#FFC400" text={text} />,
render: (text, record) => <Badge color="#FFC400" text={text} />,
},
{
title: '操作',
dataIndex: 'option',
align: 'center',
render: (text: any, record: any) => {
let component: ReactNode = null;
component = (
render: (text, record) => (
<>
{record.innerStatusName === '审核通过' ? (
{/* 暂时用中文,已与后台商量 */}
{record.innerStatusName === '审核通过' && (
<Button
type="link"
onClick={() => {
setCurrentItem(record), setModalVisible(true);
}}
onClick={() => {}}
style={{ color: '#00B37A' }}
>
{record.status === 1 ? '解冻' : '冻结'}
{record.status === MEMBER_STATUS_NORMAL ? '冻结' : '解冻'}
</Button>
) : (
''
)}
</>
);
return component;
},
),
},
];
const rowSelection = {
onChange: (selectedRowKeys: any, selectedRows: any) => {
setSelectedRowKeys(selectedRowKeys);
},
selectedRowKeys: selectedRowKeys,
};
const menu = (
<Menu onClick={e => handleMenuClick(e)}>
<Menu.Item key="1" icon={<DeleteOutlined />}>
删除导入批次
</Menu.Item>
</Menu>
);
const [columns, setColumns] = useState<any[]>(defaultColumns);
// 更改会员状态
......@@ -209,10 +152,6 @@ const memberMaintain: React.FC<[]> = () => {
});
};
const handleMenuClick = (e: any) => {
console.log('menu', e);
};
// 初始化高级筛选选项
const fetchSelectOptions = async () => {
const res = await PublicApi.getMemberAbilityMaintenancePageitems();
......@@ -229,81 +168,32 @@ const memberMaintain: React.FC<[]> = () => {
sources = [],
} = data;
const newColumns = columns.slice();
// filter 0 过滤掉全部选项
coverColFiltersItem(
newColumns,
'statusName',
status.map(item => ({ text: item.text, value: item.id })).filter(item => item.value !== 0),
);
coverColFiltersItem(
newColumns,
'outerStatusName',
outerStatus.map(item => ({ text: item.text, value: item.id })).filter(item => item.value !== 0),
);
coverColFiltersItem(
newColumns,
'innerStatusName',
innerStatus.map(item => ({ text: item.text, value: item.id })).filter(item => item.value !== 0),
);
setColumns(newColumns);
return {
innerStatus: innerStatus.map(item => ({ label: item.text, value: item.id })),
outerStatus: outerStatus.map(item => ({ label: item.text, value: item.id })),
status: status.map(item => ({ label: item.text, value: item.id })),
memberType: memberTypes.map(item => ({ label: item.memberTypeName, value: item.memberTypeId })),
roleId: memberRoles.map(item => ({ label: item.roleName, value: item.roleId })),
level: memberLevels.map(item => ({ label: item.levelTag, value: item.level })),
source: sources.map(item => ({ label: item.text, value: item.id })),
innerStatus: innerStatus.map(item => ({ label: item.text, value: item.id })),
outerStatus: outerStatus.map(item => ({ label: item.text, value: item.id })),
status: status.map(item => ({ label: item.text, value: item.id })),
};
}
return {};
};
const controllerBtns = (
<Space>
<Button
type="primary"
onClick={() =>
history.push(`/memberCenter/memberAbility/manage/addMember`)
}
>
<PlusOutlined />
新建
</Button>
<Button onClick={() => setVisibleModal(true)}>导入</Button>
<Dropdown.Button
overlay={menu}
trigger={['click']}
icon={<DownOutlined />}
>
更多
</Dropdown.Button>
</Space>
);
return (
<Card>
<StandardTable
tableProps={{
rowKey: 'memberId',
// onChange: (pagination: any, filter: any) => handleSearch(filter),
dataSource: mock,
}}
columns={columns}
currentRef={ref}
fetchTableData={(params: any) => fetchListData(params)}
rowSelection={rowSelection}
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<NiceForm
actions={formActions}
onSubmit={values => ref.current.reload(values)}
expressionScope={{
controllerBtns,
}}
effects={($, actions) => {
useStateFilterSearchLinkageEffect(
$,
......@@ -312,7 +202,7 @@ const memberMaintain: React.FC<[]> = () => {
FORM_FILTER_PATH,
);
useAsyncInitSelect(
['innerStatus', 'outerStatus', 'status', 'memberType', 'roleId', 'level', 'source'],
['memberType', 'roleId', 'level', 'source', 'innerStatus', 'outerStatus', 'status'],
fetchSelectOptions,
);
}}
......@@ -320,12 +210,6 @@ const memberMaintain: React.FC<[]> = () => {
/>
}
/>
<UploadModal
visibleModal={visibleModal}
fileText="会员资料"
onCancel={() => setVisibleModal(false)}
/>
</Card>
);
};
......
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