Skip to content

A
admin
提交 c0d94d57 作者: ZhangLingKun
操作

功能：客户列表变更

上级 1e1ed168
正在显示 包含 350 行增加 和 5 行删除
src/api/modules/couponManage.ts
......@@ -7,7 +7,6 @@ import {
CouponPageListType,
CouponSaveType,
CouponShutDownType,
ListBrandInfoType,
SplitCouponAddType,
SplitCouponListType,
} from '~/api/interface/couponManage';
......
src/components/search-box/index.scss
......@@ -9,9 +9,12 @@
//.ant-select-selector {
// min-width: 200px;
//}
.ant-form-item {
margin-inline-end: 20px;
}
.ant-row {
//margin-bottom:10px;
//margin-bottom:5px;
}
.add-button {
......
src/pages/customManage/customList/comp/changeModal/index.tsx 0 → 100644
import { FC, useEffect, useState } from 'react';
import { Form, Modal, Select } from 'antd';
// import { tagLevelEntity } from "@/api/modules/user";
// import { UserAPI } from "@/api";
interface PropsType {
visible: boolean;
closed: any;
data: any;
state: any;
}
// 修改等级标签
interface tagLevelForm {
channelLevelId: number;
mallOperator: number;
mallSaleManager: number;
}
export const ChangeModal: FC<PropsType> = (props) => {
// 父组件传参
const { visible, closed, data, state } = props;
// 个人等级标签
const [tagLevelForm] = Form.useForm<tagLevelForm>();
// 相关运营列表
const [operationList] = useState([]);
// 关闭事件
const handleClosed = () => {
tagLevelForm.resetFields();
closed();
};
// 提交数据
const handleSubmit = () => {
tagLevelForm.validateFields().then(async (value: tagLevelForm) => {
// 提交表单数据
const SubmitFuc = async () => {
// const res: any = await UserAPI.mallUserChangeInfo({
// ...value,
// userAccountId: data.id,
// });
// if (res.code === '200') {
// message.success('修改成功');
// handleClosed();
// } else {
// message.warning(res.message);
// }
};
// 如果之前填过等级标签，现在又删除了的话，调用删除等级标签的接口
if (data.channelClass && !value.channelLevelId) {
// 删除等级标签
// const res: any = await UserAPI.mallUserDeleteInfo({
// userAccountId: data.id,
// });
// if (res && res.code === '200') {
// await SubmitFuc();
// } else {
// message.warning(res.message);
// }
} else {
await SubmitFuc();
}
});
};
// 获取运营人员列表
const getListOperate = () => {
// UserAPI.getKbtUserList({ keyword: '' }).then(({ result }) => {
// if (result) {
// setOperationList(
// result.map((i: any) => {
// return {
// label: `${i.userName || i.nickName}(${i.uid})`,
// value: i.id,
// };
// }),
// );
// }
// });
};
// 组件启动
useEffect(() => {
if (data) {
getListOperate();
tagLevelForm.setFieldsValue({
channelLevelId: data.channelClass || undefined,
mallOperator: data.mallOperator || undefined,
mallSaleManager: data.mallSaleManager || undefined,
});
}
}, [data]);
return (
<Modal open={visible} title='变更' onCancel={handleClosed} destroyOnClose onOk={handleSubmit}>
<Form form={tagLevelForm} labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
<Form.Item label='等级标签' name='channelLevelId'>
<Select
placeholder='请选择等级标签'
disabled={!data?.realAuthStatus && !data?.entAuthStatus}
allowClear
>
{state.levelTags.map((item: any, index: number) => (
<Select.Option value={item.id} key={index}>
{item.tagName}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item label='相关运营' name='mallOperator'>
<Select placeholder='请选择相关运营' allowClear>
{operationList.map((item: any, index: number) => (
<Select.Option value={item.value} key={index}>
{item.label}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item label='相关销售' name='mallSaleManager'>
<Select placeholder='请选择相关销售' allowClear>
{operationList.map((item: any, index: number) => (
<Select.Option value={item.value} key={index}>
{item.label}
</Select.Option>
))}
</Select>
</Form.Item>
</Form>
</Modal>
);
};
src/pages/customManage/customList/index.tsx
import React from 'react';
import { useState } from 'react';
import SearchBox from '~/components/search-box';
import { Button, Table } from 'antd';
import { ColumnsType } from 'antd/es/table';
import { ChangeModal } from '~/pages/customManage/customList/comp/changeModal';
// 表格数据类型
type TableType = any;
function CustomListView() {
return <div>CustomList</div>;
// 是否打开变更弹窗
const [isChangeVisModal, setIsChangeVisModal] = useState<boolean>(false);
// 表格分页配置
const [pagination] = useState({
total: 0,
pageSize: 10,
current: 1,
totalPage: 0,
});
// 表格数据
const [tableData] = useState<TableType>([{ id: 1 }]);
// 需要编辑的数据
const [editData] = useState<TableType[0]>();
// 表格结构
const columns: ColumnsType<TableType[0]> = [
{
title: '用户UID',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '用户名称',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '手机号',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '认证企业',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '企业认证',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '电子签约认证',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '用户来源',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '创建时间',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '账号类型',
dataIndex: 'userName',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '渠道等级',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '上级推荐人',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '推荐伙伴',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '相关运营',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '相关销售',
dataIndex: 'remark',
align: 'center',
render: (_text, _record) => `--`,
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
fixed: 'right',
width: '150px',
render: (_text, _record) => (
<>
<Button
type={'link'}
onClick={() => {
setIsChangeVisModal(true);
}}
>
变更
</Button>
<Button type={'link'} danger>
删除
</Button>
</>
),
},
];
return (
<>
<SearchBox
search={[
{
label: '用户名称',
name: 'keyword',
type: 'input',
placeholder: '请输入UID、用户名称',
},
{
label: '手机号',
name: 'phoneNum',
type: 'input',
placeholder: '请输入用户账号',
},
{
label: '来源',
name: 'form',
type: 'Select',
placeholder: '请选择相关来源',
options: [
{ value: 1, label: '自然流' },
{ value: 2, label: '海报' },
{ value: 3, label: '抖音' },
{ value: 4, label: '公众号' },
{ value: 5, label: '社群' },
{ value: 6, label: '招投标' },
],
},
{
label: '创建时间',
name: 'time',
type: 'rangePicker',
placeholder: '请选择创建时间',
},
{
label: '企业认证',
name: 'enterprise',
type: 'Select',
placeholder: '请选择是否认证',
options: [
{ value: 1, label: '未认证' },
{ value: 2, label: '已认证' },
],
},
{
label: '电子签约认证',
name: 'contract',
type: 'Select',
placeholder: '请选择是否认证',
options: [
{ value: 1, label: '未认证' },
{ value: 2, label: '已认证' },
],
},
]}
searchData={(e: any) => console.log('提交数据 --->', e)}
/>
<Table
size='small'
dataSource={tableData}
columns={columns}
rowKey='id'
scroll={{ x: 1200 }}
pagination={{
total: pagination.total,
pageSize: pagination.pageSize,
current: pagination.current,
showSizeChanger: true,
showQuickJumper: true,
// onChange: (page: number, pageSize: number) =>
// paginationChange(page, pageSize),
showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
}}
// rowSelection={{ selectedRowKeys, onChange: onSelectChange }}
/>
<ChangeModal
visible={isChangeVisModal}
closed={() => {
setIsChangeVisModal(false);
}}
data={editData}
state={{ levelTags: [] }}
/>
</>
);
}
export default CustomListView;
src/router/router.tsx
......@@ -13,6 +13,7 @@ import {
CreditCardOutlined,
SmileOutlined,
TeamOutlined,
SolutionOutlined,
} from '@ant-design/icons';
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
......@@ -233,7 +234,7 @@ export const routerList: Array<RouteObjectType> = [
meta: {
id: 26100,
title: '客户列表',
icon: <BarsOutlined />,
icon: <SolutionOutlined />,
},
},
],
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论