zls

config/routes.js

@@ -39,6 +39,30 @@ export default [
             hideInMenu: true,
             component: './channel/edit',
           },
+          {
+            path: '/contact',
+            name: '联系人管理',
+            component: '../layouts/BlankLayout',
+            routes: [
+              {
+                path: '/contact/contact/list',
+                name: '联系人',
+                component: './contact/contact/list',
+              },
+              {
+                path: '/contact/contact/add',
+                name: '新增',
+                hideInMenu: true,
+                component: './contact/contact/add',
+              },
+              {
+                path: '/contact/contact/detail',
+                name: '详情',
+                hideInMenu: true,
+                component: './contact/contact/detail',
+              },
+            ],
+          },
           {
             path: '/sample',
             name: 'H5样例管理',
@@ -49,11 +73,23 @@ export default [
                 name: 'H5样例',
                 component: './sample/h5/index',
               },
+              {
+                path: '/sample/h5/edit',
+                name: 'H5样例编辑',
+                hideInMenu: true,
+                component: './sample/h5/edit',
+              },
               {
                 path: '/sample/demand/list',
                 name: 'H5需求单',
                 component: './sample/demand/index',
               },
+              {
+                path: '/sample/demand/edit',
+                name: 'H5需求单详情',
+                hideInMenu: true,
+                component: './sample/demand/edit',
+              },
             ],
           },
           {

package.json

@@ -61,7 +61,8 @@
     "umi": "^2.8.7",
     "umi-plugin-pro-block": "^1.3.2",
     "umi-plugin-react": "^1.9.5",
-    "umi-request": "^1.0.8"
+    "umi-request": "^1.0.8",
+    "wangeditor": "^3.1.1"
   },
   "devDependencies": {
     "@ant-design/colors": "^3.1.0",

src/components/Wangedit/Wangedit.jsx

@@ -0,0 +1,108 @@
+import React from 'react';
+import E from 'wangeditor';
+import { fetch, apis } from '../../utils/request';
+
+/**
+ * @param {*} props
+ * @returns
+ */
+class Wangedit extends React.Component {
+  constructor(props, context) {
+    super(props, context);
+    this.state = {
+      html: undefined,
+      contenteditable: props.contenteditable == false ? false : true
+    }
+    this.editor = undefined;
+  }
+
+  render() {
+    return (
+      <div ref="editorElem" style={{ textAlign: 'left' }}>
+      </div>
+    );
+  }
+
+  componentDidMount() {
+    const elem = this.refs.editorElem
+    this.editor = new E(elem)
+    // 使用 onchange 函数监听内容的变化
+    this.editor.customConfig.onchange = html => {
+      this.setState({ html })
+
+      if (typeof this.props.onChange === 'function') {
+        this.props.onChange(html)
+      }
+    }
+    this.editor.customConfig.zIndex = 100
+    this.editor.customConfig.uploadImgMaxLength = 1
+    this.editor.customConfig.customUploadImg = function (files, insert) {
+      if (!files.length) return
+      
+      const data = new FormData()
+      data.append('file', files[0])
+
+      fetch(apis.image.upload)({data}).then(insert)
+    }
+    this.editor.customConfig.menus = [
+      'head',  // 标题
+      'bold',  // 粗体
+      'fontSize',  // 字号
+      'fontName',  // 字体
+      'italic',  // 斜体
+      'underline',  // 下划线
+      'strikeThrough',  // 删除线
+      'foreColor',  // 文字颜色
+      'backColor',  // 背景颜色
+      'list',  // 列表
+      'justify',  // 对齐方式
+      'quote',  // 引用
+      'image',  // 插入图片
+      'undo',  // 撤销
+      'redo'  // 重复
+    ]
+    
+    // 过滤 word 字符
+    this.editor.customConfig.pasteFilterStyle = false
+    this.editor.customConfig.pasteTextHandle = function(content) {
+      const regs = [
+        /<!--\[if [\s\S]*?endif\]-->/ig,
+        /<[a-zA-Z0-9]+\:[^>]+>[^>]*<\/[a-zA-Z0-9]+\:[^>]+>/ig,
+        /<[a-zA-Z0-9]+\:[^>]+\/>/ig,
+        /<style>[\s\S]*?<\/style>/ig,
+      ]
+
+      return regs.reduce((acc, reg) => {
+        return acc.replace(reg, '')
+      }, content)
+    }
+
+    this.editor.create()
+    this.editor.$textElem.attr('contenteditable',this.state.contenteditable);
+    this.editor.customConfig.uploadImgShowBase64 = true
+    this.editor.txt.html(this.props.value)
+  }
+
+  componentDidUpdate(props, state) {
+    if (this.props.value && !state.html) {
+      if (this.editor) {
+        this.editor.txt.html(this.props.value)
+      }
+    }
+  }
+
+  /**
+   *增加这个 shouldComponentUpdate 生命函数
+    处理自动聚焦到富文本上
+   *
+   * @param {*} nextProps
+   * @returns
+   * @memberof Wangedit
+   */
+  shouldComponentUpdate(nextProps) {
+    return nextProps.value !== this.editor.txt.html()
+  }
+}
+
+export default Wangedit
+

src/pages/contact/contact/add.jsx

@@ -0,0 +1,205 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Modal, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import XForm, { FieldTypes } from '../../../components/XForm';
+import router from 'umi/router';
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+import moment from 'moment';
+
+
+
+const header = props => {
+
+    const [data, setData] = useState({})
+
+    const [datas, setDatas] = useState([])//表格数据
+    const [visible, setVisible] = useState()
+    const [formsdate, setFormsDate] = useState({})
+    //   const [page, changePage] = useState({})
+    useEffect(() => {
+
+        setVisible(false)
+
+    }, [])
+    const ModalData = props => {
+
+        const data = [];
+        return (
+            <>
+                <div>
+                </div>
+            </>
+        )
+    }
+
+    const onSelectBusiness = (e) => {
+        console.log('11111')
+
+    }
+
+    const fields = [
+        {
+            label: '姓名',
+            name: 'contactName',
+            type: FieldTypes.Text,
+            value: data.contactName,
+            rules: [
+                { required: true, message: '请输入通知标题' },
+                { max: 6, message: '通知标题名称不超过6个字符' }
+            ]
+        },
+        {
+            label: '性别',
+            name: 'sex',
+            type: FieldTypes.Select,
+            value: data.sex,
+            dict: [{
+                name: '男',
+                value: '1',
+            },
+            {
+                name: '女',
+                value: '2',
+            }],
+            rules: [
+                { required: false, message: '请选择性别' }
+            ]
+        },
+        {
+            label: '头像',
+            name: 'avatar',
+            type: FieldTypes.ImageUploader,
+            value: data.avatar,
+            rules: [
+                { required: false, message: '请选择头像' },
+            ],
+            help: '建议尺寸：Npx*Npx，比例：1:1，格式：jpg，大小：不超过300KB，用于客户查看',
+        },
+        {
+            label: '对外头衔',
+            name: 'appellation',
+            type: FieldTypes.Text,
+            value: data.appellation,
+            rules: [
+                { required: false, message: '请输入对外头衔' },
+                { max: 20, message: '对外头衔不能超过20个字符' }
+            ]
+        },
+        {
+            label: '固话',
+            name: 'telephone',
+            type: FieldTypes.Text,
+            value: data.telephone,
+            rules: [
+                { required: false, message: '请输入固话' },
+                { max: 20, message: '固话内容不能超过20个字符' }
+            ]
+        },
+        {
+            label: '手机号',
+            name: 'phone',
+            type: FieldTypes.Text,
+            value: data.phone,
+            rules: [
+                { required: true, message: '请输入手机号' },
+                // { max: 20, message: '' }
+            ]
+        },
+        {
+            label: '微信号',
+            name: 'wxCardImg',
+            type: FieldTypes.ImageUploader,
+            value: data.wxCardImg,
+            rules: [
+                { required: false, message: '请上传微信号' },
+            ],
+            help: '联系人的微信二维码名片，请到手机端微信-我-顶部微信号中保存后上传',
+        },
+        {
+            label: '邮箱',
+            name: 'mail',
+            type: FieldTypes.Text,
+            value: data.mail,
+            rules: [
+                { required: false, message: '请输入邮箱' },
+                { max: 20, message: '邮箱不能超过20个字符' }
+            ]
+        },
+        {
+            label: '联系地址*',
+            name: 'address',
+            type: FieldTypes.Text,
+            value: data.address,
+            rules: [
+                { required: false, message: '请输入联系地址' },
+                { max: 40, message: '邮箱不能超过40个字符' }
+            ]
+        },
+        {
+            label: '内部岗位*',
+            name: 'job',
+            type: FieldTypes.Text,
+            value: data.job,
+            rules: [
+                { required: false, message: '请输入内部岗位' },
+                { max: 20, message: '内部岗位不能超过20个字符' }
+            ]
+        },
+        {
+            label: '权重',
+            name: 'orderNo',
+            type: FieldTypes.Number,
+            value: data.orderNo,
+
+            help: '用于列表排序，越大越靠前'
+        },
+    ]
+
+    const handleSubmit = (values) => {
+        console.log | ("开始提交 联系人")
+        let submitValues = values;
+        props.form.validateFields((err, values) => {
+            console.log(values)
+            if (!err) {
+                request({ ...apis.contact.taContactAdd, data: { ...submitValues }, }).then((data) => {
+                    //   message.info("保存成功,请上传房源")
+                    router.push({
+                        pathname: '/contact/contact/list',
+                        query: {
+                            //   salesBatchId: data.salesBatchId,
+                            //   buildingId: data.buildingId,
+                        },
+                    });
+                }).catch((err) => {
+                    message.info(err.msg || err.message)
+                })
+            }
+        });
+    }
+    //model
+    const handleShowModel = val => {
+        setVisible(true);
+    }
+
+    const handleCancel = val => {
+        setVisible(false);
+    }
+
+    const cancelPage = () => {
+        router.push({
+            pathname: '/contact/pathname',
+        });
+    }
+
+    return (
+        <>
+            <div>
+                <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
+            </div>
+        </>
+    )
+}
+
+const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+export default WrappedNormalLoginForm

src/pages/contact/contact/detail.jsx

@@ -0,0 +1,211 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Modal, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import XForm, { FieldTypes } from '../../../components/XForm';
+import router from 'umi/router';
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+import moment from 'moment';
+
+
+
+const header = props => {
+    const [data, setData] = useState({})
+    const contactId = props.location.query.id
+    if (contactId) {
+        useEffect(() => {
+            getData(contactId);
+        }, [])
+
+        // 查询列表
+        const getData = (contactId) => {
+            request({
+                ...apis.contact.taContactGet,
+                urlData: { id: contactId }
+            }).then((data) => {
+                setData(data)
+            }).catch((err) => {
+                message.error(err.msg || err.message)
+            })
+        }
+    }
+
+    const [datas, setDatas] = useState([])//表格数据
+    const [visible, setVisible] = useState()
+    const [formsdate, setFormsDate] = useState({})
+    //   const [page, changePage] = useState({})
+    useEffect(() => {
+
+        setVisible(false)
+
+    }, [])
+    const ModalData = props => {
+
+        const data = [];
+        return (
+            <>
+                <div>
+                </div>
+            </>
+        )
+    }
+
+    const onSelectBusiness = (e) => {
+        console.log('11111')
+
+    }
+
+    const fields = [
+        {
+            label: '姓名',
+            name: 'contactName',
+            type: FieldTypes.Text,
+            value: data.contactName,
+            rules: [
+                { required: true, message: '请输入通知标题' },
+                { max: 6, message: '通知标题名称不超过6个字符' }
+            ]
+        },
+        {
+            label: '性别',
+            name: 'sex',
+            type: FieldTypes.Select,
+            value: data.sex === 1 ? '男' : '女',
+            dict: [{
+                name: '男',
+                value: '1',
+            },
+            {
+                name: '女',
+                value: '2',
+            }],
+            rules: [
+                { required: false, message: '请选择性别' }
+            ]
+        },
+        {
+            label: '头像',
+            name: 'avatar',
+            type: FieldTypes.ImageUploader,
+            value: data.avatar,
+            rules: [
+                { required: false, message: '请选择头像' },
+            ],
+            help: '建议尺寸：Npx*Npx，比例：1:1，格式：jpg，大小：不超过300KB，用于客户查看',
+        },
+        {
+            label: '对外头衔',
+            name: 'appellation',
+            type: FieldTypes.Text,
+            value: data.appellation,
+            rules: [
+                { required: false, message: '请输入对外头衔' },
+                { max: 20, message: '对外头衔不能超过20个字符' }
+            ]
+        },
+        {
+            label: '固话',
+            name: 'telephone',
+            type: FieldTypes.Text,
+            value: data.telephone,
+            rules: [
+                { required: false, message: '请输入固话' },
+                { max: 20, message: '固话内容不能超过20个字符' }
+            ]
+        },
+        {
+            label: '手机号',
+            name: 'phone',
+            type: FieldTypes.Text,
+            value: data.phone,
+            rules: [
+                { required: true, message: '请输入手机号' },
+                // { max: 20, message: '' }
+            ]
+        },
+        {
+            label: '微信号',
+            name: 'wxCardImg',
+            type: FieldTypes.ImageUploader,
+            value: data.wxCardImg,
+            rules: [
+                { required: false, message: '请上传微信号' },
+            ],
+            help: '联系人的微信二维码名片，请到手机端微信-我-顶部微信号中保存后上传',
+        },
+        {
+            label: '邮箱',
+            name: 'mail',
+            type: FieldTypes.Text,
+            value: data.mail,
+            rules: [
+                { required: false, message: '请输入邮箱' },
+                { max: 20, message: '邮箱不能超过20个字符' }
+            ]
+        },
+        {
+            label: '联系地址*',
+            name: 'address',
+            type: FieldTypes.Text,
+            value: data.address,
+            rules: [
+                { required: false, message: '请输入联系地址' },
+                { max: 40, message: '邮箱不能超过40个字符' }
+            ]
+        },
+        {
+            label: '内部岗位*',
+            name: 'job',
+            type: FieldTypes.Text,
+            value: data.job,
+            rules: [
+                { required: false, message: '请输入内部岗位' },
+                { max: 20, message: '内部岗位不能超过20个字符' }
+            ]
+        },
+        {
+            label: '权重',
+            name: 'orderNo',
+            type: FieldTypes.Number,
+            value: data.orderNo,
+
+            help: '用于列表排序，越大越靠前'
+        },
+    ]
+
+    const handleSubmit = (values) => {
+        if (contactId) {
+            values.contactId = contactId
+            request({ ...apis.contact.taContactUpdate, urlData: { id: contactId }, data: { ...values } }).then((data) => {
+                cancelPage();
+            }).catch((err) => {
+                message.error(err.msg || err.message)
+            })
+        }
+    }
+    //model
+    const handleShowModel = val => {
+        setVisible(true);
+    }
+
+    const handleCancel = val => {
+        setVisible(false);
+    }
+
+    const cancelPage = () => {
+        router.push({
+            pathname: '/contact/contact/list',
+        });
+    }
+
+    return (
+        <>
+            <div>
+                <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
+            </div>
+        </>
+    )
+}
+
+const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+export default WrappedNormalLoginForm

src/pages/contact/contact/list.jsx

@@ -0,0 +1,220 @@
+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 router from 'umi/router';
+import moment from 'moment';
+import styles from './style.less';
+import { fetch, apis } from '../../../utils/request';
+import request from '../../../utils/request';
+import AuthButton from '@/components/AuthButton';
+
+function header(props) {
+
+    const [data, setData] = useState([])
+    const [contactList, setContactList] = useState([])
+
+    useEffect(() => {
+        getList({ pageNum: 1, pageSize: 10 });
+    }, [])
+    // 查询列表
+    const getList = params => {
+        request({ ...apis.contact.listContactByCondition, params: { ...params } }).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 });
+    }
+
+    const toDel = rowData => () => {
+        if (contactList.length < 1) {
+            openNotificationWithIcon('error', '请先选择需要删除的联系人')
+            return
+        }
+
+        Modal.confirm({
+            title: '确定联系人信息吗',
+            okText: '确定',
+            cancelText: '取消',
+            onOk() {
+                request({ ...apis.contact.batchDeleteContact, data: contactList, }).then((data) => {
+                    message.info("操作成功")
+                    getList({ pageNum: 1, pageSize: 10 });
+                }).catch((err) => {
+                    
+                })
+            },
+        });
+    }
+
+    const rowSelection = {
+        onChange: (selectedRowKeys, selectedRows) => {
+            console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
+            setContactList(selectedRows)
+        },
+    };
+
+    const changePageNum = pageNumber => {
+        getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+    }
+
+    const columns = [
+        {
+            title: '姓名',
+            dataIndex: 'contactName',
+            key: 'contactName',
+            align: 'center',
+
+        },
+        {
+            title: '性别',
+            dataIndex: 'sex',
+            key: 'sex',
+            align: 'center',
+            render: (sex) => <span>{sex === 1 ? '男' : '女'}</span>,
+        },
+        {
+            title: '头像',
+            dataIndex: 'avatar',
+            key: 'avatar',
+            align: 'center',
+            render: (text, record) => <img src={record.avatar} className={styles.touxiang} />,
+        },
+        {
+            title: '固话',
+            dataIndex: 'telephone',
+            key: 'telephone',
+            align: 'center',
+        },
+        {
+            title: '手机号',
+            dataIndex: 'phone',
+            key: 'phone',
+            align: 'center',
+        },
+        {
+            title: '内部岗位',
+            dataIndex: 'job',
+            key: 'job',
+            align: 'center',
+
+        },
+        {
+            title: '权重',
+            dataIndex: 'orderNo',
+            key: 'orderNo',
+            align: 'center',
+        },
+        {
+            title: '操作',
+            dataIndex: 'handle',
+            key: 'handle',
+            align: 'center',
+            render: (x, row) => (
+                <>
+                    <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEdit(row.contactId)}>
+                        编辑<Icon type="form" className={styles.edit} />
+                    </span>
+                </>
+            ),
+        },
+    ];
+
+    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>
+
+                <Button type="primary" className={styles.addBtn} onClick={toDel()} style={{ marginLeft: '30px' }} >删除</Button>
+
+                <Table rowSelection={rowSelection} rowKey="goodsList" 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>
+            </div>
+        </>
+    )
+}
+
+const WrappedHeader = Form.create({ name: 'header' })(header);
+
+export default WrappedHeader

src/pages/contact/contact/style.less

@@ -0,0 +1,48 @@
+.addBtn {
+    padding: 0 40px;
+    height: 36px;
+    margin: 30px 0;
+  }
+  
+  .touxiang {
+    width: 93px;
+    height: 93px;
+  }
+  
+  .imgPerfect {
+    width: 120px;
+    height: 40px;
+  }
+  
+  .imgIndex {
+    width: 150px;
+    height: 92.7px;
+  }
+  
+  .imgSmall {
+    width: 128px;
+    height: 192px;
+  }
+  
+  .propaganda {
+    width: 240px;
+    height: 60px;
+  }
+  
+  .ant-table-column-title {
+    font-weight: 600;
+  }
+  
+  .shoppingCart {
+    // color: #dcdcdc;
+    color: #bebebe;
+    margin-left: 6px;
+    font-size: 16px;
+  }
+  
+  .edit {
+    // color: #dcdcdc;
+    color: #bebebe;
+    margin-left: 6px;
+    font-size: 15px;
+  }

src/pages/resource/openScreen/index.jsx

@@ -109,7 +109,7 @@ function header(props) {
             dataIndex: 'status',
             key: 'status',
             align: 'center',
-            render: (status) => <><span>{status == 1 ? '是' : '否'}</span></>
+            render: (status) => <><span>{status === 1 ? '已上架' : status === 0 ? '已下架':'删除'}</span></>
         },
         {
             title: '自动下架时间',

src/pages/sample/demand/edit.jsx

@@ -0,0 +1,113 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import XForm, { FieldTypes } from '../../../components/XForm';
+import router from 'umi/router';
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+import Wangedit from '../../../components/Wangedit/Wangedit'
+import moment from 'moment';
+
+
+const header = props => {
+    const demandId = props.location.query.id
+  
+    const [ data, setData ] = useState({})
+    if(demandId){
+      useEffect(() => {
+        getDemandData(demandId);
+      },[])
+  
+    // 查询列表
+    const getDemandData = (demandId) => {
+      request({
+          ...apis.sample.get,
+          urlData: { id: demandId }
+      }).then((data) => {
+        setData(data)
+      }).catch((err) => {
+        message.error(err.msg || err.message)
+      })
+    }
+    }
+  
+    const fields = [
+      {
+        label: '样例名',
+        name: 'sampleName',
+        type: FieldTypes.Text,
+        value: data.sampleName,
+      },    
+      {
+        label: '下单组织',
+        name: 'orgName',
+        type: FieldTypes.Text,
+        value: data.orgName,
+      },
+      {
+        label: '下单人',
+        name: 'orderer',
+        value: data.orderer,
+        type: FieldTypes.Text,
+      },
+      {
+        label: '联系方式',
+        name: 'phone',
+        value: data.phone,
+        type: FieldTypes.Text,
+      },
+      {
+        label: '下单时间',
+        name: 'createDate',
+        type: FieldTypes.DatePicker ,
+        value: data.createDate != null ? moment(data.createDate, 'YYYY-MM-DD') : null,
+      },
+      {
+        label: '需求单状态',
+        name: 'demandStatus',
+        value: data.demandStatus+'',
+        render: <Select style={{ width: '180px' }} placeholder="需求单状态">
+                  <Select.Option value="1">已提交</Select.Option>
+                  <Select.Option value="2">处理中</Select.Option>
+                  <Select.Option value="3">已交付</Select.Option>
+                  <Select.Option value="4">作废</Select.Option>
+                </Select>,
+      },
+      {
+        label: '备注',
+        name: 'remark',
+        type: FieldTypes.Text,
+        value: data.remark,
+      },
+      {
+        label: '需求描述',
+        name: 'demandContent',
+        value: data.demandContent,
+        render: <Wangedit />
+      },
+    ]
+  
+     
+    const handleSubmit = (values) => {
+      if(demandId){
+          request({ ...apis.sample.update, urlData: { id: demandId }, data: { ...values }}).then((data) => {
+            cancelPage();
+          }).catch((err) => {
+            message.error(err.msg || err.message)
+          })
+        }
+    }
+  
+    const cancelPage = () => {
+      router.push({
+        pathname: '/sample/demand/list',
+      });
+    }
+  
+    return (
+      <XForm onSubmit={handleSubmit} onCancel={cancelPage} fields={fields}></XForm>
+    )
+  }
+  
+  const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+  export default WrappedNormalLoginForm

src/pages/sample/demand/index.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { Form, Pagination, Card, Button, Icon, Tooltip, message,   notification, Modal, Table } from 'antd';
+import { Form, Pagination, Card, Button, Icon, Tooltip, message,   notification, Modal, Table, Select, Input, DatePicker } from 'antd';
 import router from 'umi/router';
 import moment from 'moment';
 import className from 'classnames';
@@ -10,11 +10,12 @@ import { fetch, apis } from '../../../utils/request';
 import request from '../../../utils/request';
 import AuthButton from '@/components/AuthButton';
 
-
+const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
 
 function header(props) {
   // 获取初始化数据
   const [ data, setData ] = useState({})
+  const [demandIdList, setDemandIdList] = useState([])
 
   useEffect(() => {
     getList({ pageNum: 1, pageSize: 10 });
@@ -22,7 +23,7 @@ function header(props) {
 
   // 查询列表
   const getList = (params) => {
-    request({ ...apis.channel.list, params: { ...params } }).then((data) => {
+    request({ ...apis.sample.list, params: { ...params } }).then((data) => {
         console.log(data)
         setData(data)
     })
@@ -34,7 +35,16 @@ function header(props) {
     e.preventDefault();
     props.form.validateFields((err, values) => {
       if (!err) {
-        getList({ pageNum: 1, pageSize: 10, ...values })
+        let {createDate, ...submitValue} = values
+        if(null != createDate && createDate.length > 0){
+          const [startCreateDate, endCreateDate] = createDate
+          submitValue.startCreateDate = moment(startCreateDate).format('YYYY-MM-DD');
+          submitValue.endCreateDate = moment(endCreateDate).format('YYYY-MM-DD');
+        }else{
+          submitValue.startCreateDate = null
+          submitValue.endCreateDate = null
+        }
+        getList({ pageNum: 1, pageSize: 10, ...submitValue })
       }
     });
   }
@@ -43,11 +53,18 @@ function header(props) {
     getList({ pageNum: pageNumber, pageSize: 10 })
   }
 
+  const rowSelection = {
+    onChange: (selectedRowKeys, selectedRows) => {
+      console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
+      setDemandIdList(selectedRows)
+    },
+  };
+
 
   // 跳转到编辑资讯
-  const toEditNews = (id) => () => {
+  const toEditDemand = (id) => () => {
     router.push({
-      pathname: '/channel/edit',
+      pathname: '/sample/demand/edit',
       query: {
         id
       },
@@ -55,31 +72,25 @@ function header(props) {
   }
 
   
-  const changeNewsStatus = (row, newsId) => () => {
-    const title = row.status === 0 ? '确定启用吗': '停用后，此账号将无法登录渠道代理商后台'
+  const changeStatus = () => {
+    if(demandIdList.length < 1){
+      message.error('请先选择要删除的数据！')
+      return
+    }
+    const title = '确认将所选的' + demandIdList.length + '条数据删除？可删除条件：需求单阶段 为 作废。'
     Modal.confirm({
       title: title,
       okText: '确认',
       cancelText: '取消',
       onOk() {
-        if(row.status === 0){
-          request({ ...apis.channel.put, urlData: { id: newsId }, data: { ...row, status: 1 } }).then((data) => {
-            message.info('操作成功！')
-            getList({ pageNum: 1, pageSize: 10 });
-          }).catch((err) => {
-            console.log(err)
-            message.info(err.msg || err.message)
-          })
-        }else{
-          request({ ...apis.channel.put, urlData: { id: newsId }, data: { ...row, status: 0 } }).then((data) => {
-            message.info('操作成功！')
-            getList({ pageNum: 1, pageSize: 10 });
-          }).catch((err) => {
-            console.log(err)
-            message.info(err.msg || err.message)
-          })
-        }
-        
+        request({ ...apis.sample.put, data: { ids: demandIdList.map(x => x.demandId) } }).then((data) => {
+          const resultMessage = '操作成功，其中'+data.successNum+'条成功删除，'+data.failNum+'条非作废状态未删除。'
+          message.info(resultMessage)
+          getList({ pageNum: 1, pageSize: 10 });
+        }).catch((err) => {
+          console.log(err)
+          message.info(err.msg || err.message)
+        })
       }
     });
   }
@@ -91,45 +102,43 @@ function header(props) {
    */
   const columns = [
     {
-      title: '渠道代理',
-      dataIndex: 'channelProxyName',
-      key: 'channelProxyName',
+      title: '样例名',
+      dataIndex: 'sampleName',
+      key: 'sampleName',
       align: 'center',
     },
     {
-      title: '账号名',
-      dataIndex: 'userName',
-      key: 'userName',
+      title: '下单组织',
+      dataIndex: 'orgName',
+      key: 'orgName',
       align: 'center',
-      render: (x, row) => <span>{row.userName === null || row.userName === '' ? row.channelTel : row.userName}</span>,
     },
     {
-      title: '小程序总数',
-      dataIndex: 'appMaxNum',
-      key: 'appMaxNum',
+      title: '下单人',
+      dataIndex: 'orderer',
+      key: 'orderer',
       align: 'center',
 
     },
     {
-      title: '现有小程序',
-      dataIndex: 'appCurrentNum',
-      key: 'appCurrentNum',
+      title: '联系方式',
+      dataIndex: 'phone',
+      key: 'phone',
       align: 'center',
-      render: (appCurrentNum) => <span>{appCurrentNum === 0 || appCurrentNum == null ? 0 : appCurrentNum}</span>,
     },
     {
-      title: '服务到期时间',
-      dataIndex: 'expireDate',
-      key: 'expireDate',
+      title: '下单时间',
+      dataIndex: 'createDate',
+      key: 'createDate',
       align: 'center',
-      render: (x, row) => <><span>{`${moment(row.expireDate).format('YYYY-MM-DD')}`}</span></>,
+      render: (x, row) => <><span>{`${moment(row.createDate).format('YYYY-MM-DD')}`}</span></>,
     },
     {
-      title: '状态',
-      dataIndex: 'status',
-      key: 'status',
+      title: '需求单状态',
+      dataIndex: 'demandStatus',
+      key: 'demandStatus',
       align: 'center',
-      render: (status) => <span>{status === 1 ? '启动' : '停用'}</span>,
+      render: (demandStatus) => <span>{demandStatus === 1 ? '已提交' : demandStatus === 2 ? '处理中' : demandStatus === 3 ? '已交付' : demandStatus === 4 ? '作废' : ''}</span>,
     },
     {
       title: '操作',
@@ -137,18 +146,9 @@ function header(props) {
       key: 'handle',
       align: 'center',
       render: (x, row) => (
-        <>
-          <AuthButton name="admin.taNewsType.id.delete" noRight={null}>
-            <span style={{ color: '#EF273A', marginRight: '20px', cursor: 'pointer' }} onClick={changeNewsStatus(row, row.channelId)}>
-              {row.status == 1 ? '停用' : '启用'}<Icon type="shopping-cart" className={styles.shoppingCart} />
-            </span>
-          </AuthButton>
-          <AuthButton name="admin.taNewsType.id.put" noRight={null}>
-            <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEditNews(row.channelId)}>
-              编辑<Icon type="form" className={styles.edit} />
-            </span>
-          </AuthButton>
-        </>
+        <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEditDemand(row.demandId)}>
+          查看详情<Icon type="form" className={styles.edit} />
+        </span>
       ),
     },
   ];
@@ -161,10 +161,68 @@ function header(props) {
   return (
 
     <>
+    <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
+        <Form.Item>
+          {getFieldDecorator('sampleName')(
+            <Input
+              prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+              placeholder="样例名"
+            />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('orgName')(
+            <Input
+              prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+              placeholder="下单组织"
+            />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('orderer')(
+            <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>
+            <span style={{marginRight:'10px'}}>下单时间段：</span>
+                {getFieldDecorator('createDate')(
+                  <RangePicker placeholder={['开始时间','结束时间']} />
+                )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('demandStatus')(
+            <Select style={{ width: '180px' }} placeholder="需求单状态">
+              <Select.Option value="1">已提交</Select.Option>
+              <Select.Option value="2">处理中</Select.Option>
+              <Select.Option value="3">已交付</Select.Option>
+              <Select.Option value="4">作废</Select.Option>
+            </Select>,
+          )}
+        </Form.Item>
+        <Form.Item>
+          <Button type="primary" htmlType="submit" className={styles.searchBtn}>
+            搜索
+          </Button>
+          <Button style={{ marginLeft: 8 }} onClick={handleReset}>
+              重置
+          </Button>
+        </Form.Item>
+      </Form>
       <AuthButton name="admin.taNewsType.post" noRight={null}>
-        <Button type="danger" className={styles.addBtn} onClick={toEditNews()}>新增</Button>
+        <Button type="danger" className={styles.addBtn} onClick={changeStatus}>删除</Button>
       </AuthButton>
-      <Table rowKey="newsType" dataSource={data.records} columns={columns} pagination={false} />
+      <Table rowSelection={rowSelection} rowKey="newsType" 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>

src/pages/sample/h5/components/H5Card.jsx

@@ -0,0 +1,24 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert, Card } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import router from 'umi/router';
+import apis from '../../../../services/apis';
+import request from '../../../../utils/request';
+import Wangedit from '../../../../components/Wangedit/Wangedit'
+import moment from 'moment';
+
+const { Meta } = Card
+
+const H5Card = props => {
+    return (
+    <Card
+      hoverable
+      style={{ width: 240 }}
+      cover={<img alt="example" src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png" />}
+    >
+      <Meta title="Europe Street beat" description="www.instagram.com" />
+    </Card>
+    )
+  }
+ 
+  export default H5Card

src/pages/sample/h5/components/SelectContact.jsx

@@ -0,0 +1,208 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Select, Modal, Button, Table, Divider, Tag, Input,Row,Col,Icon,Pagination } from 'antd';
+import request from '../../../../utils/request';
+import apis from '../../../../services/apis';
+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: '请选择' })
+  const [selectedData, setSelectedData ] = useState([]);
+
+  useEffect(() => {
+    if (props.value && props.value != selectedData) {
+      setSelectedData(props.value)
+    }
+  }, [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 handleChange = val => {
+  }
+
+  const selectData = val => {
+    const list = selectedData.filter(x => x.contactId !== val.contactId).concat(val)
+    setSelectedData(list)
+    props.onSelected(list)
+    setVisible(false)
+  }
+
+  
+  // 提交事件
+  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 })
+  }
+
+  const removeSelected = (val) => {
+    const list = selectedData.filter(x => x.contactId !== val.contactId)
+    setSelectedData(list)
+    props.onSelected(list)
+  }
+
+  const columns = [
+    {
+      title: '姓名',
+      dataIndex: 'contactName',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '性别',
+      dataIndex: 'sex',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '头像',
+      dataIndex: 'avatar',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '固话',
+      dataIndex: 'telephone',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '手机号',
+      dataIndex: 'phone',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '内部岗位',
+      dataIndex: 'job',
+      key: 'drainageId',
+      align: 'center',
+      ellipsis: true,
+      render: text => <a>{text}</a>,
+    },
+    {
+      title: '操作',
+      align: 'center',
+      width: '20%',
+      render: (text, record) => (
+        <span>
+          <a onClick={() => selectData(record)} style={{ color: 'blue' }}>选择</a>
+        </span>
+      ),
+    },
+  ];
+
+  const { getFieldDecorator } = props.form
+
+  return (
+    <div>
+      <Row gutter={24}>
+        <Col span={2}><div onClick={() => setVisible(true)}>{group.groupName}</div></Col>
+        <Col span={16}><div>
+        {selectedData.map(x => {
+          return <Tag size="large" key={x.contactId} closable onClose={() => removeSelected(x)}>{x.contactName}</Tag>
+        })}
+      </div></Col>
+      </Row>     
+      
+      <Modal
+        title="请选择"
+        width="1200px"
+        visible={visible}
+        onCancel={() => setVisible(false)}
+        footer={[]}
+      >
+      
+        <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('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>
+    
+          <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/sample/h5/edit.jsx

@@ -0,0 +1,169 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Menu, Dropdown, Button, Icon, message, Table, Divider, Tag, Select, Form, Alert, Radio } from 'antd';
+import { FormattedMessage } from 'umi-plugin-react/locale';
+import XForm, { FieldTypes } from '../../../components/XForm';
+import router from 'umi/router';
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+import Wangedit from '../../../components/Wangedit/Wangedit'
+import ImageUpload from '../../../components/XForm/ImageUpload'
+import SelectContact from './components/SelectContact';
+import moment from 'moment';
+
+const formItemLayout = {
+  labelCol: {
+    xs: { span: 24 },
+    sm: { span: 2 },
+  },
+  wrapperCol: {
+    xs: { span: 24 },
+    sm: { span: 16 },
+  },
+};
+
+const header = props => {
+    const sampleId = props.location.query.id
+  
+    const [ data, setData ] = useState({})
+    const [typeState, setTypeState] = useState("rich")
+
+    if(sampleId){
+      useEffect(() => {
+        getH5Data(sampleId);
+      },[])
+  
+    // 查询列表
+    const getH5Data = (sampleId) => {
+      request({
+          ...apis.sample.get,
+          urlData: { id: sampleId }
+      }).then((data) => {
+        setData(data)
+      }).catch((err) => {
+        message.error(err.msg || err.message)
+      })
+    }
+    }
+     
+    const handleSubmit = (e) => {
+      e.preventDefault();
+      // e.stopPropagation();
+      props.form.validateFieldsAndScroll((err, values) => {
+        console.log(values,"valuesvaluesvaluesvaluesvaluesvaluesvalues")
+        debugger
+        if (!err) {
+          console.log(values,"h5Sample/addh5Sample/add")
+          if(sampleId){
+            request({ ...apis.sample.update, urlData: { id: sampleId }, data: { ...values }}).then((data) => {
+              cancelPage();
+            }).catch((err) => {
+              message.error(err.msg || err.message)
+            })
+          }else{
+            request({ ...apis.sample.addh5, data: { ...values }}).then((data) => {
+              cancelPage();
+            }).catch((err) => {
+              message.error(err.msg || err.message)
+            })
+          }
+        }
+      });
+      
+    }
+  
+    const cancelPage = () => {
+      router.push({
+        pathname: '/sample/h5/list',
+      });
+    }
+
+    function sampleTypeChange(e) {
+      setTypeState(e.target.value)
+    }
+  
+    const { getFieldDecorator } = props.form;
+    return (
+      <Form {...formItemLayout} onSubmit={handleSubmit}>
+            
+          <Form.Item label="样例名" >
+            {getFieldDecorator('sampleName',{
+              rules: [{ required: true, message: '请输入样例名' },
+              { max: 20, message: '样例名不超过20个字符' }],
+            })(<Input placeholder="H5活动主题或目的，如植树节引流活动"/>)}
+          </Form.Item>
+          <Form.Item label="样例体验链接" >
+            {getFieldDecorator('sampleTryLink',{
+              rules: [{ max: 300, message: '样例体验链接不超过300个字符' }],
+            })(<Input placeholder="若样例暂未发布到小程序，可直接粘贴网页链接"/>)}
+          </Form.Item>
+          <Form.Item label="样例体验二维码/小程序码" >
+            {getFieldDecorator('sampleTryCode')(
+              <ImageUpload />,
+            )}
+          </Form.Item>
+          <Form.Item label="封面图" help="建议尺寸：495*330px，比例：3:2，格式：jpg，大小：不超过300KB，用于样例列表封面">
+            {getFieldDecorator('coverImg', {
+              rules: [{ required: true, message: '请选择列表图' }],
+            })(
+              <ImageUpload />,
+            )}
+          </Form.Item>
+          <Form.Item label="方案/报价/技术联系人" >
+            {getFieldDecorator('taContactList',{
+              trigger: 'onSelected'
+            })(<SelectContact />)}
+          </Form.Item>
+          <Form.Item label="发布状态" >
+            {getFieldDecorator('status', {
+              initialValue: "1",
+            })(
+            <Select style={{ width: '180px' }}>
+              <Select.Option value="1">是</Select.Option>
+              <Select.Option value="0">否</Select.Option>
+            </Select>)}
+          </Form.Item>
+          <Form.Item label="权重" help="数值越大越靠前">
+            {getFieldDecorator('orderNo')(<Input />)}
+          </Form.Item>
+          <Form.Item label="标签" help="标签长度6个字，最多3个标签">
+            {getFieldDecorator('tags')(
+              <Select mode="tags" placeholder="输入后选中" style={{ width: '1016px' }}>
+
+              </Select>,
+            )}
+          </Form.Item>
+          <Form.Item label="样例类型">
+            {getFieldDecorator('sampleType',{
+              initialValue: "rich",
+            })(
+            <Radio.Group onChange={e => sampleTypeChange(e)}>
+              <Radio value="rich">富文本</Radio>
+              <Radio value="link">外部链接</Radio>
+            </Radio.Group>,
+            )}
+          </Form.Item>
+          {typeState === 'link' && <Form.Item label="外部链接">
+            {getFieldDecorator('sampleContentLink',{
+              rules: [{ max: 300, message: '外部链接不超过300个字符' }],
+            })(<Input placeholder="填写外部链接，如公众号链接或135编辑器生成的页面链接" />)}
+          </Form.Item>}
+          {typeState === 'rich' && <Form.Item label="样例内容" >
+            {getFieldDecorator('sampleContent')(
+              <Wangedit />,
+            )}
+          </Form.Item> }
+          <Form.Item style={{ width: '400px', margin: 'auto', display: 'flex', justifyContent: 'space-between' }}>
+            <Button type="primary" htmlType="submit">
+                确定
+            </Button>
+            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+            <Button onClick={() => router.go(-1)}>
+                取消
+            </Button>
+          </Form.Item>
+        </Form>
+    )
+  }
+  
+  const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+  export default WrappedNormalLoginForm

src/pages/sample/h5/index.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { Form, Pagination, Card, Button, Icon, Tooltip, message,   notification, Modal, Table } from 'antd';
+import { Form, Pagination, Card, Button, Icon, Tooltip, message,   notification, Modal, Table, Select,Input, DatePicker  } from 'antd';
 import router from 'umi/router';
 import moment from 'moment';
 import className from 'classnames';
@@ -9,8 +9,9 @@ import styles from './style.less';
 import { fetch, apis } from '../../../utils/request';
 import request from '../../../utils/request';
 import AuthButton from '@/components/AuthButton';
+import H5Card from './components/H5Card';
 
-
+const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
 
 function header(props) {
   // 获取初始化数据
@@ -22,7 +23,7 @@ function header(props) {
 
   // 查询列表
   const getList = (params) => {
-    request({ ...apis.channel.list, params: { ...params } }).then((data) => {
+    request({ ...apis.sample.h5list, params: { ...params } }).then((data) => {
         console.log(data)
         setData(data)
     })
@@ -45,9 +46,9 @@ function header(props) {
 
 
   // 跳转到编辑资讯
-  const toEditNews = (id) => () => {
+  const toEditH5 = (id) => () => {
     router.push({
-      pathname: '/channel/edit',
+      pathname: '/sample/h5/edit',
       query: {
         id
       },
@@ -83,75 +84,7 @@ function header(props) {
       }
     });
   }
-  /**
-   *
-   *
-   * @param {*} props
-   * @returns
-   */
-  const columns = [
-    {
-      title: '渠道代理',
-      dataIndex: 'channelProxyName',
-      key: 'channelProxyName',
-      align: 'center',
-    },
-    {
-      title: '账号名',
-      dataIndex: 'userName',
-      key: 'userName',
-      align: 'center',
-      render: (x, row) => <span>{row.userName === null || row.userName === '' ? row.channelTel : row.userName}</span>,
-    },
-    {
-      title: '小程序总数',
-      dataIndex: 'appMaxNum',
-      key: 'appMaxNum',
-      align: 'center',
-
-    },
-    {
-      title: '现有小程序',
-      dataIndex: 'appCurrentNum',
-      key: 'appCurrentNum',
-      align: 'center',
-      render: (appCurrentNum) => <span>{appCurrentNum === 0 || appCurrentNum == null ? 0 : appCurrentNum}</span>,
-    },
-    {
-      title: '服务到期时间',
-      dataIndex: 'expireDate',
-      key: 'expireDate',
-      align: 'center',
-      render: (x, row) => <><span>{`${moment(row.expireDate).format('YYYY-MM-DD')}`}</span></>,
-    },
-    {
-      title: '状态',
-      dataIndex: 'status',
-      key: 'status',
-      align: 'center',
-      render: (status) => <span>{status === 1 ? '启动' : '停用'}</span>,
-    },
-    {
-      title: '操作',
-      dataIndex: 'handle',
-      key: 'handle',
-      align: 'center',
-      render: (x, row) => (
-        <>
-          <AuthButton name="admin.taNewsType.id.delete" noRight={null}>
-            <span style={{ color: '#EF273A', marginRight: '20px', cursor: 'pointer' }} onClick={changeNewsStatus(row, row.channelId)}>
-              {row.status == 1 ? '停用' : '启用'}<Icon type="shopping-cart" className={styles.shoppingCart} />
-            </span>
-          </AuthButton>
-          <AuthButton name="admin.taNewsType.id.put" noRight={null}>
-            <span style={{ color: '#FF925C', cursor: 'pointer' }} onClick={toEditNews(row.channelId)}>
-              编辑<Icon type="form" className={styles.edit} />
-            </span>
-          </AuthButton>
-        </>
-      ),
-    },
-  ];
+   
   function handleReset() {
     props.form.resetFields();
     getList({ pageNum: 1, pageSize: 10 })
@@ -161,10 +94,70 @@ function header(props) {
   return (
 
     <>
-      <AuthButton name="admin.taNewsType.post" noRight={null}>
-        <Button type="danger" className={styles.addBtn} onClick={toEditNews()}>新增</Button>
-      </AuthButton>
-      <Table rowKey="newsType" dataSource={data.records} columns={columns} pagination={false} />
+    <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
+        <Form.Item>
+          {getFieldDecorator('sampleName')(
+            <Input
+              prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+              placeholder="样例名"
+            />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('orgName')(
+            <Input
+              prefix={<Icon type="text" style={{ color: 'rgba(0,0,0,.25)' }} />}
+              placeholder="下单组织"
+            />,
+          )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('orderer')(
+            <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>
+            <span style={{marginRight:'10px'}}>下单时间段：</span>
+                {getFieldDecorator('createDate')(
+                  <RangePicker placeholder={['开始时间','结束时间']} />
+                )}
+        </Form.Item>
+        <Form.Item>
+          {getFieldDecorator('demandStatus')(
+            <Select style={{ width: '180px' }} placeholder="需求单状态">
+              <Select.Option value="1">已提交</Select.Option>
+              <Select.Option value="2">处理中</Select.Option>
+              <Select.Option value="3">已交付</Select.Option>
+              <Select.Option value="4">作废</Select.Option>
+            </Select>,
+          )}
+        </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={toEditH5()}>新增</Button>
+ 
+      {(data.records || []).map(x => (
+          <H5Card />
+        ))}
       <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
         <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current}/>
       </div>

src/services/apis.js

@@ -64,6 +64,45 @@ const apis = {
       action: 'channel',
     },
   },
+  sample: {
+    list: {
+      url: `${prefix}/taH5Demand`,
+      method: 'GET',
+      action: 'channel',
+    },
+    put: {
+      url: `${prefix}/taH5Demand/batch`,
+      method: 'PUT',
+      action: 'channel',
+    },
+    get: {
+      url: `${prefix}/taH5Demand/:id`,
+      method: 'GET',
+      action: 'channel',
+    },
+    update: {
+      url: `${prefix}/taH5Demand/update/:id`,
+      method: 'PUT',
+      action: 'channel',
+    },
+    h5list: {
+      url: `${prefix}/h5Sample/list`,
+      method: 'GET',
+      action: 'channel',
+    },
+    addh5: {
+      url: `${prefix}/h5Sample/add`,
+      method: 'POST',
+      action: 'channel',
+    },
+  },
+  contact: {
+    list: {
+      url: `${prefix}/taContact`,
+      method: 'GET',
+      action: 'channel',
+    },
+  },
   image: {
     uploadForAnt: {
       url: `${prefix}/antd/image`,
@@ -113,6 +152,33 @@ const apis = {
     // /api/admin/ListH5SampleByCondition
   },
   
+  contact:{
+    listContactByCondition: {
+      url: `${prefix}/listContactByCondition`,
+      method: 'GET',
+      action: 'center',
+    },
+    taContactAdd: {
+      url: `${prefix}/taContact`,
+      method: 'POST',
+      action: 'center',
+    },
+    batchDeleteContact: {
+      url: `${prefix}/taContact/batchDelete`,
+      method: 'PUT',
+      action: 'center',
+    },
+    taContactGet: {
+      url: `${prefix}/taContact/:id`,
+      method: 'GET',
+      action: 'center',
+    },
+    taContactUpdate: {
+      url: `${prefix}/taContact/:id`,
+      method: 'PUT',
+      action: 'center',
+    },
+  }
   
 }