新需求

src/pages/fundManagement/Finance.jsx

@@ -125,7 +125,7 @@ function header(props) {
             okText: '确定',
             cancelText: '取消',
             onOk() {
-                request({ ...apis.fund.delContact, data: contactList, }).then((data) => {
+                request({ ...apis.fund.delContact, data: contactList, params: {contactType: "finance"} }).then((data) => {
                     message.info("操作成功")
                     getList({ pageNum: 1, pageSize: 10 });
                     setContactList([])

src/pages/fundManagement/components/SelectContact.jsx

@@ -58,7 +58,7 @@ const SelectContact = props => {
     }
 
     const selectData = (record) => {
-        request({ ...apis.fund.addContact, urlData: { id: record.contactId } }).then((data) => {
+        request({ ...apis.fund.addContact, urlData: { id: record.contactId }, params: {contactType: "finance"} }).then((data) => {
             message.success('新增成功!');
             props.onClick()
             setVisible(false)

src/pages/promote/components/SelectContact.jsx

@@ -0,0 +1,197 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Modal, Button, Table, message, Input, Icon, Pagination } from 'antd';
+import request from '../../../utils/request';
+import apis from '../../../services/apis';
+import router from 'umi/router';
+import styles from './style.less'
+
+const { Column, ColumnGroup } = Table;
+const SelectContact = props => {
+
+    const [data, setData] = useState([]);
+    const [visible, setVisible] = useState(false);
+    const [group, setGroup] = useState({ groupId: undefined, groupName: '新增' })
+
+    useEffect(() => {
+
+    }, [props.value])
+
+    // 查询列表
+    const getList = (params) => {
+        request({ ...apis.contact.list, params: { ...params } }).then((data) => {
+            console.log(data)
+            setData(data)
+        })
+    }
+
+    useEffect(() => {
+        getList({ pageNum: 1, pageSize: 10, })
+    }, []);
+
+
+
+
+    // 提交事件
+    const handleSubmit = (e, props) => {
+        e.preventDefault();
+        e.stopPropagation();
+        props.form.validateFields((err, values) => {
+            if (!err) {
+                getList({ pageNum: 1, pageSize: 10, ...values })
+            }
+        });
+    }
+
+    function handleReset() {
+        props.form.resetFields();
+        getList({ pageNum: 1, pageSize: 10 })
+    }
+
+    const changePageNum = (pageNumber) => {
+        getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+    }
+
+    const toAdd = () => {
+        router.push({
+            pathname: '/contact/contact/add',
+        });
+    }
+
+    const selectData = (record) => {
+        request({ ...apis.fund.addContact, urlData: { id: record.contactId }, params: {contactType: "promote"} }).then((data) => {
+            message.success('新增成功!');
+            props.onClick()
+            setVisible(false)
+        })
+    }
+
+
+    const columns = [
+        {
+            title: '姓名',
+            dataIndex: 'contactName',
+            key: 'contactName',
+            align: 'center',
+            ellipsis: true,
+        },
+        {
+            title: '性别',
+            dataIndex: 'sex',
+            key: 'sex',
+            align: 'center',
+            ellipsis: true,
+            render: text => <span>{text == 1 ? '男' : text == 2 ? '女' : ''}</span>,
+        },
+        {
+            title: '头像',
+            dataIndex: 'avatar',
+            key: 'avatar',
+            align: 'center',
+            ellipsis: true,
+            render: text => <img src={text} width="40px" height="40px" />,
+        },
+        {
+            title: '固话',
+            dataIndex: 'telephone',
+            key: 'telephone',
+            align: 'center',
+            ellipsis: true,
+        },
+        {
+            title: '手机号',
+            dataIndex: 'phone',
+            key: 'phone',
+            align: 'center',
+            ellipsis: true,
+        },
+        {
+            title: '对外头衔',
+            dataIndex: 'appellation',
+            key: 'appellation',
+            align: 'center',
+            ellipsis: true,
+        },
+        {
+            title: '操作',
+            align: 'center',
+            width: '20%',
+            render: (text, record) => (
+                <span>
+                    <a onClick={() => selectData(record)} style={{ color: 'blue' }}>选择</a>
+                </span>
+            ),
+        },
+    ];
+
+    const { getFieldDecorator } = props.form
+
+    return (
+        <div >
+
+            <Button type="danger" onClick={() => setVisible(true)} className={styles.addBtn} >{group.groupName}
+                {/* <SelectContact type="danger" onClick={() => getList({ pageNum: 1, pageSize: 10 })} /> */}
+            </Button>
+            {/* <div style={{ color: '#fff', padding: '0 15px', height: '32px', lineHeight: '32px' }} onClick={() => setVisible(true)}>{group.groupName}</div> */}
+
+            <Modal
+                title="选择联系人"
+                width="1200px"
+                visible={visible}
+                onCancel={() => setVisible(false)}
+                footer={[]}
+            >
+
+                <Form layout="inline" onSubmit={e => handleSubmit(e, props)} style={{ marginBottom: '16px' }}>
+                    <Form.Item>
+                        {getFieldDecorator('contactName')(
+                            <Input
+                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                                placeholder="姓名"
+                            />,
+                        )}
+                    </Form.Item>
+                    <Form.Item>
+                        {getFieldDecorator('telephone')(
+                            <Input
+                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                                placeholder="固话"
+                            />,
+                        )}
+                    </Form.Item>
+                    <Form.Item>
+                        {getFieldDecorator('phone')(
+                            <Input
+                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                                placeholder="手机号"
+                            />,
+                        )}
+                    </Form.Item>
+                    <Form.Item>
+                        {getFieldDecorator('appellation')(
+                            <Input
+                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                                placeholder="对外头衔"
+                            />,
+                        )}
+                    </Form.Item>
+                    <Form.Item>
+                        <Button type="primary" htmlType="submit" >
+                            搜索
+              </Button>
+                        <Button style={{ marginLeft: 8 }} onClick={handleReset}>
+                            重置
+              </Button>
+                    </Form.Item>
+                </Form>
+                <div style={{ marginBottom: '20px', textAlign: 'right' }}>没有想要的联系人? <a onClick={() => toAdd()}>去新增</a> </div>
+                <Table dataSource={data.records || []} columns={columns} pagination={false} />
+                <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+                    <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current} />
+                </div>
+            </Modal>
+        </div>
+    )
+}
+
+const WrappedRegistrationForm = Form.create()(SelectContact);
+export default WrappedRegistrationForm;

src/pages/promote/components/style.less

@@ -0,0 +1,109 @@
+  .mask{
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba(0,0,0,0.32);
+    position: fixed;
+    z-index: 999;
+    top: 0;
+    left: 0;
+}
+
+.content{
+    width: 32vw;
+    min-width: 757px;
+    height: 21.3vw;
+    min-height: 504px;
+    position: absolute;
+    left: 50%;
+    top: 110px;
+    transform: translateX(-50%);
+    border-radius: 10px;
+    .close{
+        width: 40px;
+        height: 40px;
+        position: absolute;
+        top: -22px;
+        right: -22px;
+        z-index: 9;
+    }
+}
+
+.dots{
+    position: absolute;
+    bottom: 11px;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    list-style: none;
+    text-align: center;
+    li {
+        position: relative;
+        display: inline-block;
+        width: 14px;
+        height: 2px;
+        margin: 0 3px;
+        padding: 0;
+        cursor: pointer;
+        background: #fff;
+        opacity: 0.6;
+        &.active{
+            width: 16px;
+            height: 3px;
+            background: #fff;
+            opacity: 1;
+        }
+    }
+}
+.carousel {
+    width: 32vw;
+    min-width: 757px;
+    height: 21.3vw;
+    min-height: 504px;
+    border-radius: 10px;
+    // overflow: hidden;
+    
+    .carouselItem{
+        width: 32vw;
+        min-width: 757px;
+        height: 21.3vw;
+        min-height: 504px;
+        position: relative;
+        display: inline-block;
+        .title{
+            font-size: 0.12rem;
+            color: #fff;
+            position: absolute;
+            display: block;
+            width: 100%;
+            height: 0.16rem;
+            bottom: 30px ;
+            padding: 0 40px;
+            text-align: center;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+
+        }
+    }
+}
+
+.swiperImg{
+    max-height: 504px;
+     border-radius: 10px;
+     object-fit: contain;
+}
+
+.ant-carousel .slick-slide {
+    
+    text-align: center;
+    width: 32vw;
+    min-width: 757px;
+    height: 21.3vw;
+    min-height: 504px;
+    background: #364d79;
+    overflow: hidden;
+  }
+  
+  .ant-carousel .slick-slide h3 {
+    color: #fff;
+  }

src/pages/promote/contact.jsx

@@ -1,108 +1,73 @@
 import React, { useState, useEffect } from 'react';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, Breadcrumb } from 'antd';
+import { Form, Pagination, Button, Icon, message, Modal, Table, Input } from 'antd';
 import router from 'umi/router';
 import moment from 'moment';
+import className from 'classnames';
+import Cell from '../../components/Cell';
 import styles from './style.less';
 import { fetch, apis } from '../../utils/request';
 import request from '../../utils/request';
 import AuthButton from '@/components/AuthButton';
+import SelectContact from './components/SelectContact';
 
-function header(props) {
 
-    const [data, setData] = useState([])
+function header(props) {
+    // 获取初始化数据
+    const [data, setData] = useState({})
     const [contactList, setContactList] = useState([])
+
     useEffect(() => {
         getList({ pageNum: 1, pageSize: 10 });
     }, [])
+
     // 查询列表
-    const getList = params => {
-        request({ ...apis.contact.list, params: { ...params } }).then(data => {
+    const getList = (params) => {
+        request({ ...apis.fund.contactList, params: { ...params, contentType: 'promote' } }).then((data) => {
             console.log(data)
             setData(data)
         })
     }
 
-    const toAdd = (id) => () => {
-        router.push({
-            pathname: '/contact/contact/add',
-            //   query: {
-            //     id
-            //   },
-        });
-    }
-
-    const toEdit = (id) => () => {
-        router.push({
-            pathname: '/contact/contact/detail',
-            query: {
-                id
-            },
-        });
-    }
 
+    // 提交事件
     const handleSubmit = (e, props) => {
-        console.log(e)
         e.preventDefault();
         props.form.validateFields((err, values) => {
             if (!err) {
-                getList({ pageNum: 1, pageSize: 10, ...values })
-            }
-        });
-    }
-
-    function handleReset() {
-        props.form.resetFields();
-        getList({ pageNum: 1, pageSize: 10 });
-    }
+                let { ...submitValue } = values
 
-    const toDel = rowData => () => {
-        if (contactList.length < 1) {
-            message.info('请至少选择一条数据')
-            return
-        }
-
-        Modal.confirm({
-            title: '确定删除联系人信息吗',
-            okText: '确定',
-            cancelText: '取消',
-            onOk() {
-                request({ ...apis.contact.batchDeleteContact, data: contactList, }).then((data) => {
-                    message.info("操作成功")
-                    getList({ pageNum: 1, pageSize: 10 });
-                }).catch((err) => {
-
-                })
-            },
-            onCancel() { },
+                getList({ pageNum: 1, pageSize: 10, ...submitValue })
+            }
         });
     }
 
-    const rowSelection = {
-        onChange: (selectedRowKeys, selectedRows) => {
-            console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
-            setContactList(selectedRows)
-        },
-    };
+    const changePageNum = (pageNumber) => {
+        let { ...submitValue } = props.form.getFieldsValue()
 
-    const changePageNum = pageNumber => {
-        getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+        getList({ pageNum: pageNumber, pageSize: 10, ...submitValue })
     }
 
+    /**
+     *
+     *
+     * @param {*} props
+     * @returns
+     */
     const columns = [
         {
             title: '姓名',
             dataIndex: 'contactName',
             key: 'contactName',
             align: 'center',
-
         },
         {
             title: '性别',
             dataIndex: 'sex',
             key: 'sex',
             align: 'center',
-            render: (sex) => <span>{sex != null ? (sex === 1 ? '男' : '女') : ""}</span>,
+            render: (text, record) => <span>{record.sex == '1' ? '男' : record.sex == '2' ? '女' : '未知'}</span>
+
         },
         {
             title: '头像',
@@ -124,11 +89,10 @@ function header(props) {
             align: 'center',
         },
         {
-            title: '内部岗位',
-            dataIndex: 'job',
-            key: 'job',
+            title: '对外头衔',
+            dataIndex: 'appellation',
+            key: 'appellation',
             align: 'center',
-
         },
         {
             title: '权重',
@@ -136,83 +100,99 @@ function header(props) {
             key: 'orderNo',
             align: 'center',
         },
-        {
-            title: '操作',
-            dataIndex: 'handle',
-            key: 'handle',
-            align: 'center',
-            render: (x, row) => (
-                <>
-                    <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEdit(row.contactId)}>
-                        删除 
-                    </span>
-                </>
-            ),
-        },
+
     ];
+    function handleReset() {
+        props.form.resetFields();
+        getList({ pageNum: 1, pageSize: 10 })
+    }
+
+
+    const rowSelection = {
+        onChange: (selectedRowKeys, selectedRows) => {
+            console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
+            setContactList(selectedRows)
+        },
+    };
 
+    const toDel = () => {
+        if (contactList.length < 1) {
+            message.info('请至少选择一条数据')
+            return
+        }
+        Modal.confirm({
+            title: `确认将所选的${contactList.length}条数据删除`,
+            okText: '确定',
+            cancelText: '取消',
+            onOk() {
+                request({ ...apis.fund.delContact, data: contactList,params: {contactType: 'promote'} }).then((data) => {
+                    message.info("操作成功")
+                    getList({ pageNum: 1, pageSize: 10 });
+                    setContactList([])
+                }).catch((err) => {
+
+                })
+            },
+            onCancel() { },
+        });
+    }
     const { getFieldDecorator } = props.form
     return (
 
         <>
-            <div>
-                <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
-                    <Form.Item>
-                        {getFieldDecorator('contactName')(
-                            <Input
-                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
-                                placeholder="姓名"
-                            />,
-                        )}
-                    </Form.Item>
-                    <Form.Item>
-                        {getFieldDecorator('telephone')(
-                            <Input style={{ width: '180px' }} placeholder="固话">
-
-                            </Input>,
-                        )}
-                    </Form.Item>
-
-                    <Form.Item>
-                        {getFieldDecorator('phone')(
-                            <Input
-                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
-                                placeholder="手机号"
-                            />,
-                        )}
-                    </Form.Item>
-                    <Form.Item>
-                        {getFieldDecorator('job')(
-                            <Input
-                                prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
-                                placeholder="内部岗位"
-                            />,
-                        )}
-                    </Form.Item>
-                    <Form.Item>
-
-                        <Button type="primary" htmlType="submit" className={styles.searchBtn}>
-                            搜索
-              </Button>
-                        {/*  */}
-                        <Button style={{ marginLeft: 8 }} onClick={handleReset}>
-                            重置
-            </Button>
-                    </Form.Item>
-                </Form>
-
-                <Button type="danger" className={styles.addBtn} onClick={toAdd()}>选择联系人</Button>
-
-                <Table rowSelection={rowSelection} rowKey={r => r.contactId} dataSource={data.records} columns={columns} pagination={false} />
-
-                <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
-                    {<Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={e => changePageNum(e)} current={data.current} />}
-                </div>
+            <Form layout="inline" onSubmit={e => handleSubmit(e, props)} >
+                <Form.Item>
+                    {getFieldDecorator('contactName')(
+                        <Input
+                            prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                            placeholder="姓名"
+                        />,
+                    )}
+                </Form.Item>
+                <Form.Item>
+                    {getFieldDecorator('telephone')(
+                        <Input
+                            prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                            placeholder="固话"
+                        />,
+                    )}
+                </Form.Item>
+                <Form.Item>
+                    {getFieldDecorator('phone')(
+                        <Input
+                            prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                            placeholder="手机号"
+                        />,
+                    )}
+                </Form.Item>
+                <Form.Item>
+                    {getFieldDecorator('appellation')(
+                        <Input
+                            prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+                            placeholder="对外头衔"
+                        />,
+                    )}
+                </Form.Item>
+                <Form.Item>
+                    <Button type="primary" htmlType="submit" className={styles.searchBtn}>
+                        搜索
+                    </Button>
+                    <Button style={{ marginLeft: 8 }} onClick={handleReset}>
+                        重置
+                    </Button>
+                </Form.Item>
+            </Form>
+            <div style={{ margin: '10px 0 16px 0', display: 'flex' }}>
+                <SelectContact type="danger" onClick={() => getList({ pageNum: 1, pageSize: 10 })} />
+                <Button type="primary" onClick={() => toDel()} style={{ marginLeft: '30px' }} >删除</Button>
+            </div>
+            <Table rowSelection={rowSelection} rowKey={r => r.contactId} dataSource={data.records} columns={columns} pagination={false} />
+            <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+                <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current} />
             </div>
         </>
     )
 }
-
 const WrappedHeader = Form.create({ name: 'header' })(header);
 
 export default WrappedHeader