Commit 8c715dd6 authored by XieZhiXiong's avatar XieZhiXiong

完善路由

parent 52e890ab
export default {
'/api': {
'target': 'http://10.0.0.10:8100/',
'target': 'http://10.0.0.25:8100/',
'changeOrigin': true,
'pathRewrite': { '^/api': '' },
}
......
......@@ -194,6 +194,13 @@ const MemberRoute: RouterChild = {
hideInMenu: true,
component: '@/pages/member/memberLevel/addEquity',
},
// 会员等级-详情
{
path: '/memberCenter/memberAbility/manage/level/detail',
name: 'editMemberLevel',
hideInMenu: true,
component: '@/pages/member/memberLevel/equityDetail',
},
]
},
// 会员信息查询
......
import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import {
Button,
Popconfirm,
Card,
Input,
Slider,
Spin,
message,
} from 'antd';
import classNames from 'classnames';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { ContainerOutlined } from '@ant-design/icons';
import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import { PublicApi } from '@/services/api';
import StatusSwitch from '@/components/StatusSwitch';
import { EditableCellTable } from '@/components/PolymericTable';
import { EditableCellProps, EditableColumns } from '@/components/PolymericTable/interface';
import { GetMemberAbilityLevelGetResponse } from '@/services';
import styles from './addEquity.less';
import DetailInfo from './components/DetailInfo';
const AddEquity: React.FC<[]> = () => {
const AddEquity: React.FC = () => {
const { id } = usePageStatus();
const [levelInfo, setLevelInfo] = useState<GetMemberAbilityLevelGetResponse>(null);
const [thresholdValue, setThresholdValue] = useState(100);
const [infoLoading, setInfoLoading] = useState(true);
const [submitLoading, setSubmitLoading] = useState(false);
const marks = {
0: '0',
5000: '5000',
10000: '10000',
15000: '15000',
20000: '20000',
50000: '50000',
};
const getMemberLevelInfo = () => {
setInfoLoading(true);
PublicApi.getMemberAbilityLevelGet({
id,
}).then(res => {
if (res.code === 1000) {
const { point = 0 } = res.data;
setLevelInfo(res.data);
setThresholdValue(point);
}
}).finally(() => {
setInfoLoading(false);
});
};
const handleChangeStatus = record => {
const disabled = record.status === 0;
PublicApi.postMemberAbilityRightUpdatestatus({
id: record.id,
status: disabled ? 1 : 0,
}, {
ctlType: 'none',
}).then(res => {
if (res.code === 1000) {
const msg = disabled ? '启用成功' : '禁用成功'
message.success(msg);
getMemberLevelInfo();
}
});
};
const columns: EditableColumns[] = [
{
title: 'ID',
dataIndex: 'id',
align: 'center',
},
{
title: '会员权益名称',
dataIndex: 'name',
align: 'center',
},
{
title: '会员权益说明',
dataIndex: 'remark',
align: 'center',
},
{
title: '权益获取方式',
dataIndex: 'acquireWay',
align: 'center',
},
{
title: '参数设置方式',
dataIndex: 'paramWay',
align: 'center',
},
{
title: '参数',
dataIndex: 'param',
align: 'center',
width: '20%',
editable: true,
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
render: (_, record: any) => (
<StatusSwitch
handleConfirm={() => handleChangeStatus(record)}
record={record}
fieldNames="status"
/>
)
}
];
useEffect(() => {
getMemberLevelInfo();
}, []);
const handleThresholdChange = e => {
const { value } = e.target;
setThresholdValue(+value);
};
// 重新保存 dataSource
const handleSave = row => {
const { rights = [] } = levelInfo;
const newData = [...rights];
const index = newData.findIndex(item => item.id === row.id);
const item = newData[index];
newData.splice(index, 1, {
...item,
...row,
param: +row.param,
});
setLevelInfo({
...levelInfo,
rights: newData,
});
};
const updateThreshold = () => {
return PublicApi.postMemberAbilityLevelUpdatepoint({
id,
point: thresholdValue,
}, {
ctlType: 'none',
});
};
const updateRightsParam = () => {
if (!levelInfo.rights || !levelInfo.rights.length) {
return;
}
const payload = levelInfo.rights.map(item => ({
id: item.id,
param: item.param,
}));
return PublicApi.postMemberAbilityRightUpdateparam({
items: payload,
}, {
ctlType: 'none',
});
};
const handleSubmit = async () => {
const promises = [updateThreshold(), updateRightsParam()];
setSubmitLoading(true);
try {
const resArr = await Promise.all(promises);
if (resArr.every((item: { code: number }) => item.code === 1000)) {
message.success('保存成功');
getMemberLevelInfo();
}
} catch (errInfo) {
}
setSubmitLoading(false);
};
const newColumns: any = columns.map(col => {
if (!col.editable) {
return col;
}
return {
...col,
onCell: (record, index): EditableCellProps => ({
onSave: handleSave,
record,
index,
dataIndex: col.dataIndex,
title: col.title,
editable: col.editable || false,
rules: [
{
required: true,
message: '请输入相应值',
},
{
pattern: /^([0]|[1-9]+[0-9]*)(\.[0-9]+)?$/,
message: '请输入整数或小数',
},
],
addonAfter: '%',
}),
};
});
return (
<Spin spinning={infoLoading}>
<PageHeaderWrapper
onBack={() => history.goBack()}
title={
<>
<div className={styles.headerTop}>
<div className={styles['headerTop-icon']}>
{ levelInfo && levelInfo.levelTag.length ? levelInfo.levelTag[0] : '' }
</div>
<div className={styles['headerTop-level']}>{ levelInfo?.levelTag }</div>
<div className={styles['headerTop-identity']}>{ levelInfo?.memberLevelTypeName }</div>
</div>
</>
}
content={
<div className={styles.headerMain}>
<div className={styles['headerMain-left']}>
<div className={styles['headerMain-left-option']}>
<div>会员等级:</div>
<div>{ levelInfo?.level }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>升级分值标签:</div>
<div>{ levelInfo?.scoreTag }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>角色类型:</div>
<div>{ levelInfo?.roleTypeName }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员等级说明:</div>
<div>{ levelInfo?.levelRemark }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员角色名称:</div>
<div>{ levelInfo?.roleName }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员类型:</div>
<div>{ levelInfo?.memberTypeName }</div>
</div>
</div>
<div className={styles['headerMain-right']}>
<Button
type="primary"
icon={<ContainerOutlined />}
loading={submitLoading}
onClick={handleSubmit}
>
保存
</Button>
</div>
</div>
}
>
<Card
title="升级阀值"
headStyle={{
borderBottom: 'none',
}}
bordered={false}
>
<div className={styles.extra}>
<div className={styles['extra-main']}>
<div className={classNames(styles['extra-main-content'], styles.left)}>
<div className={styles.icon}>当前阀值</div>
<div className={styles.input}>
<div className={styles['input-main']}>
<Input
className={styles['input-main-com']}
value={`${thresholdValue}`}
onChange={handleThresholdChange}
/>
</div>
</div>
</div>
{/* <div className={classNames(styles['extra-main-content'], styles.right)}>
<Slider
marks={marks}
max={50000}
value={thresholdValue}
disabled
/>
</div> */}
</div>
</div>
</Card>
<Card
title="会员权益"
headStyle={{
borderBottom: 'none',
}}
style={{
marginTop: 24,
}}
bordered={false}
>
<EditableCellTable
dataSource={levelInfo?.rights}
columns={newColumns}
loading={false}
pagination={null}
/>
</Card>
</PageHeaderWrapper>
</Spin>
)
}
<DetailInfo id={id} isEdit />
);
};
export default AddEquity;
\ No newline at end of file
.headerTop {
display: flex;
align-items: center;
font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
&-icon {
width: 48px;
height: 48px;
line-height: 48px;
border-radius: 4px;
border: 1px solid #DFE1E6;
color: #fff;
text-align: center;
background-color: #8777D9;
}
&-level {
color: #303133;
margin: 0 8px 0 12px;
}
&-identity {
width: 72px;
height: 24px;
line-height: 24px;
background-color: #FFEBE6;
border-radius: 4px;
color: #E63F3B;
font-size: 12px;
font-weight: 400;
text-align: center;
}
}
.headerMain {
display: flex;
&-left {
flex: 6;
display: flex;
flex-wrap: wrap;
padding-left: 90px;
&-option {
display: flex;
width: calc(100% / 3);
margin-bottom: 17px;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #909399;
padding-right: 20px;
&:nth-of-type(n + 4) {
margin: 0;
}
div {
flex: 1;
&:nth-last-of-type(1) {
flex: 2;
}
}
}
}
&-right {
flex: 1;
text-align: right;
}
}
.extra {
&-main {
display: flex;
&-content {
position: relative;
flex: 1;
&:nth-last-of-type(1) {
flex: 2.5;
}
}
.left {
display: flex;
align-items: center;
padding: 35px 0 28px 8%;
background: rgba(250, 251, 252, 1);
border-radius: 4px;
.icon {
position: absolute;
left: 0;
top: 0;
width: 72px;
height: 24px;
color: #fff;
background-color: #606266;
border-radius: 4px 0px 4px 0px;
text-align: center;
}
.input {
display: flex;
justify-content: center;
&-main {
position: relative;
width: 128px;
height: 38px;
padding-bottom: 8px;
&::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
background-color: #DFE1E6;
}
// :global {
// .ant-input {
// border: none;
// box-shadow: none;
// background-color: transparent;
// }
// }
&-com {
width: 100%;
height: 100%;
border: 0;
outline: none;
background-color: rgba(0, 0, 0, 0);
font-size: 32px;
font-weight: 500;
color: #303133;
&:focus {
border: none;
box-shadow: none;
background-color: transparent;
}
}
}
}
}
.right {
padding: 27px 40px;
}
}
}
import React, { useState, useEffect } from 'react';
import { history } from 'umi';
import {
Button,
Popconfirm,
Card,
Input,
Slider,
Spin,
message,
} from 'antd';
import classNames from 'classnames';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { ContainerOutlined } from '@ant-design/icons';
import { PublicApi } from '@/services/api';
import StatusSwitch from '@/components/StatusSwitch';
import { EditableCellTable } from '@/components/PolymericTable';
import { EditableCellProps, EditableColumns } from '@/components/PolymericTable/interface';
import { GetMemberAbilityLevelGetResponse } from '@/services';
import styles from './index.less';
interface DetailInfoProps {
id?: number;
// 是否是编辑的
isEdit?: boolean;
};
const DetailInfo: React.FC<DetailInfoProps> = ({
id,
isEdit = false,
}) => {
const [levelInfo, setLevelInfo] = useState<GetMemberAbilityLevelGetResponse>(null);
const [thresholdValue, setThresholdValue] = useState(100);
const [infoLoading, setInfoLoading] = useState(true);
const [submitLoading, setSubmitLoading] = useState(false);
const marks = {
0: '0',
5000: '5000',
10000: '10000',
15000: '15000',
20000: '20000',
50000: '50000',
};
const getMemberLevelInfo = () => {
setInfoLoading(true);
PublicApi.getMemberAbilityLevelGet({
id: `${id}`,
}).then(res => {
if (res.code === 1000) {
const { point = 0 } = res.data;
setLevelInfo(res.data);
setThresholdValue(point);
}
}).finally(() => {
setInfoLoading(false);
});
};
const handleChangeStatus = record => {
if (!isEdit) {
return;
}
const disabled = record.status === 0;
PublicApi.postMemberAbilityRightUpdatestatus({
id: record.id,
status: disabled ? 1 : 0,
}, {
ctlType: 'none',
}).then(res => {
if (res.code === 1000) {
const msg = disabled ? '启用成功' : '禁用成功'
message.success(msg);
getMemberLevelInfo();
}
});
};
const columns: EditableColumns[] = [
{
title: 'ID',
dataIndex: 'id',
align: 'center',
},
{
title: '会员权益名称',
dataIndex: 'name',
align: 'center',
},
{
title: '会员权益说明',
dataIndex: 'remark',
align: 'center',
},
{
title: '权益获取方式',
dataIndex: 'acquireWay',
align: 'center',
},
{
title: '参数设置方式',
dataIndex: 'paramWay',
align: 'center',
},
{
title: '参数',
dataIndex: 'param',
align: 'center',
width: '20%',
editable: isEdit,
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
render: (_, record: any) => (
isEdit ? (
<StatusSwitch
handleConfirm={() => handleChangeStatus(record)}
record={record}
fieldNames="status"
/>
) : (
_ === 1 ? '有效' : '失效'
)
)
}
];
useEffect(() => {
getMemberLevelInfo();
}, []);
const handleThresholdChange = e => {
const { value } = e.target;
setThresholdValue(+value);
};
// 重新保存 dataSource
const handleSave = row => {
const { rights = [] } = levelInfo;
const newData = [...rights];
const index = newData.findIndex(item => item.id === row.id);
const item = newData[index];
newData.splice(index, 1, {
...item,
...row,
param: +row.param,
});
setLevelInfo({
...levelInfo,
rights: newData,
});
};
const updateThreshold = () => {
return PublicApi.postMemberAbilityLevelUpdatepoint({
id,
point: thresholdValue,
}, {
ctlType: 'none',
});
};
const updateRightsParam = () => {
if (!levelInfo.rights || !levelInfo.rights.length) {
return;
}
const payload = levelInfo.rights.map(item => ({
id: item.id,
param: item.param,
}));
return PublicApi.postMemberAbilityRightUpdateparam({
items: payload,
}, {
ctlType: 'none',
});
};
const handleSubmit = async () => {
if (!isEdit) {
return;
}
const promises = [updateThreshold(), updateRightsParam()];
setSubmitLoading(true);
try {
const resArr = await Promise.all(promises);
if (resArr.every((item: { code: number }) => item.code === 1000)) {
message.success('保存成功');
getMemberLevelInfo();
}
} catch (errInfo) {
}
setSubmitLoading(false);
};
const newColumns: any = columns.map(col => {
if (!col.editable) {
return col;
}
return {
...col,
onCell: (record, index): EditableCellProps => ({
onSave: handleSave,
record,
index,
dataIndex: col.dataIndex,
title: col.title,
editable: col.editable || false,
rules: [
{
required: true,
message: '请输入相应值',
},
{
pattern: /^([0]|[1-9]+[0-9]*)(\.[0-9]+)?$/,
message: '请输入整数或小数',
},
],
addonAfter: '%',
}),
};
});
return (
<Spin spinning={infoLoading}>
<PageHeaderWrapper
onBack={() => history.goBack()}
title={
<>
<div className={styles.headerTop}>
<div className={styles['headerTop-icon']}>
{ levelInfo && levelInfo.levelTag.length ? levelInfo.levelTag[0] : '' }
</div>
<div className={styles['headerTop-level']}>{ levelInfo?.levelTag }</div>
<div className={styles['headerTop-identity']}>{ levelInfo?.memberLevelTypeName }</div>
</div>
</>
}
content={
<div className={styles.headerMain}>
<div className={styles['headerMain-left']}>
<div className={styles['headerMain-left-option']}>
<div>会员等级:</div>
<div>{ levelInfo?.level }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>升级分值标签:</div>
<div>{ levelInfo?.scoreTag }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>角色类型:</div>
<div>{ levelInfo?.roleTypeName }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员等级说明:</div>
<div>{ levelInfo?.levelRemark }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员角色名称:</div>
<div>{ levelInfo?.roleName }</div>
</div>
<div className={styles['headerMain-left-option']}>
<div>会员类型:</div>
<div>{ levelInfo?.memberTypeName }</div>
</div>
</div>
<div className={styles['headerMain-right']}>
{isEdit && (
<Button
type="primary"
icon={<ContainerOutlined />}
loading={submitLoading}
onClick={handleSubmit}
>
保存
</Button>
)}
</div>
</div>
}
>
<Card
title="升级阀值"
headStyle={{
borderBottom: 'none',
}}
bordered={false}
>
<div className={styles.extra}>
<div className={styles['extra-main']}>
<div className={classNames(styles['extra-main-content'], styles.left)}>
<div className={styles.icon}>当前阀值</div>
<div className={styles.input}>
<div className={styles['input-main']}>
<Input
className={styles['input-main-com']}
value={`${thresholdValue}`}
onChange={handleThresholdChange}
disabled={!isEdit}
/>
</div>
</div>
</div>
{/* <div className={classNames(styles['extra-main-content'], styles.right)}>
<Slider
marks={marks}
max={50000}
value={thresholdValue}
disabled
/>
</div> */}
</div>
</div>
</Card>
<Card
title="会员权益"
headStyle={{
borderBottom: 'none',
}}
style={{
marginTop: 24,
}}
bordered={false}
>
<EditableCellTable
dataSource={levelInfo?.rights}
columns={newColumns}
loading={false}
pagination={null}
/>
</Card>
</PageHeaderWrapper>
</Spin>
)
}
export default DetailInfo;
\ No newline at end of file
import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const EquityDetail: React.FC = () => {
const { id } = usePageStatus();
return (
<DetailInfo id={id} />
);
};
export default EquityDetail;
\ No newline at end of file
......@@ -49,7 +49,7 @@ const MemberLevel: React.FC<[]> = () => {
key: 'levelTag',
render: (text: any, record: any) => (
<EyePreview
url={`/memberCenter/memberAbility/manage/level/edit?id=${record.id}&preview=1`}
url={`/memberCenter/memberAbility/manage/level/detail?id=${record.id}`}
>
{text}
</EyePreview>
......
......@@ -2,7 +2,7 @@ import React from 'react';
import { usePageStatus } from '@/hooks/usePageStatus';
import DetailInfo from './components/DetailInfo';
const PrComfirmDetail: React.FC = () => {
const AuditPrComfirm: React.FC = () => {
const { id, validateId, pageStatus } = usePageStatus();
return (
......@@ -10,4 +10,4 @@ const PrComfirmDetail: React.FC = () => {
);
};
export default PrComfirmDetail;
\ No newline at end of file
export default AuditPrComfirm;
\ No newline at end of file
......@@ -41,7 +41,7 @@ const QuotaMenage: React.FC = () => {
align: 'center',
render: (text, record) => (
<>
{/* 未申请过,并且授信状态为未申请 或者 申请中 */}
{/* 未申请过,并且授信状态为未申请 或者 申请中 则显示文本 */}
{(!record.isHasApply && (record.status === CREDIT_STATUS_NOT_APPLIED || record.status === CREDIT_STATUS_APPLYING)) ? (
text
) : (
......@@ -94,7 +94,7 @@ const QuotaMenage: React.FC = () => {
render: (text, record) => (
<Progress
type="circle"
percent={Math.floor(record.useQuota / record.quota)}
percent={Math.floor(record.useQuota / record.quota) * 100}
strokeColor="#41CC9E"
strokeWidth={12}
width={40}
......
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