Skip to content

C
CivManage
Commit 2bc8f01a authored by 皮倩雯's avatar 皮倩雯
Browse files
Options

优化消息平台功能

parent f6b7cc32
Pipeline #31027 skipped with stages
        Hide whitespace changes
        Inline Side-by-side
        Showing with 424 additions and 228 deletions
        src/pages/platformCenter/messageManage/templateManage/TemplateManage.jsx
        View file @ 2bc8f01a
        ...@@ -8,7 +8,8 @@ import { ...@@ -8,7 +8,8 @@ import {
        Select, Select,
        Popconfirm, Popconfirm,
        message, message,
        Tooltip Tooltip,
        notification
        } from 'antd'; } from 'antd';
        import { PlusCircleOutlined, EditTwoTone, DeleteOutlined} from '@ant-design/icons'; import { PlusCircleOutlined, EditTwoTone, DeleteOutlined} from '@ant-design/icons';
        ...@@ -35,11 +36,12 @@ const TemplateManage = () => { ...@@ -35,11 +36,12 @@ const TemplateManage = () => {
        const [currentTemplate, setCurrentTempalte] = useState({}); const [currentTemplate, setCurrentTempalte] = useState({});
        const [data, setData] = useState([]) const [data, setData] = useState([])
        const [flag,setFlag] = useState(0) const [flag,setFlag] = useState(0)
        const [option, setOption] = useState([]); // 下拉列表数据
        useEffect(() => { useEffect(() => {
        getTemplateList() getTemplateList()
        selectFocus()
        }, [flag]) }, [flag])
        const getTemplateList = (obj) => { const getTemplateList = (obj) => {
        ...@@ -65,6 +67,30 @@ const TemplateManage = () => { ...@@ -65,6 +67,30 @@ const TemplateManage = () => {
        } }
        ) )
        } }
        const selectFocus = (obj) => {
        setOption([]);
        GetThirdpartyTemplates(obj).then(res => {
        if (res.msg==="Ok") {
        console.log(res.data);
        setOption(res.data);
        console.log(2)
        } else {
        console.log(1);
        notification.error({
        message: '提示',
        duration: 15,
        description: res.message,
        });
        setOption([]);
        }
        })
        .catch(err => {
        console.log(3)
        console.error(err);
        });
        };
        const columns = [ const columns = [
        { {
        title: '编号', title: '编号',
        ...@@ -291,12 +317,15 @@ const TemplateManage = () => { ...@@ -291,12 +317,15 @@ const TemplateManage = () => {
        visible={visibleParams.editVisible} visible={visibleParams.editVisible}
        template={currentTemplate} template={currentTemplate}
        onCancel={() => handleShowModal('editVisible', false)} onCancel={() => handleShowModal('editVisible', false)}
        option={option}
        confirmModal={editModal} confirmModal={editModal}
        onSubmit={ onSubmit} onSubmit={ onSubmit}
        /> />
        <AddModal <AddModal
        visible={visibleParams.addVisible} visible={visibleParams.addVisible}
        template={currentTemplate}
        onCancel={() => handleShowModal('addVisible', false)} onCancel={() => handleShowModal('addVisible', false)}
        option={option}
        confirmModal={addModal} confirmModal={addModal}
        onSubmit={ onAddSubmit} onSubmit={ onAddSubmit}
        /> />
        ......
        src/pages/platformCenter/messageManage/templateManage/TemplateManage.less
        View file @ 2bc8f01a
        .template_container{ .template_container{
        width: 100%; width: 100%;
        height: calc(100vh - 124px); height: calc(100vh - 124px);
        .operate_bar{ .operate_bar{
        width: 100%; width: 100%;
        height: 60px; height: 60px;
        ...@@ -35,6 +34,16 @@ ...@@ -35,6 +34,16 @@
        } }
        } }
        } }
        .ant-modal-body ant-form{
        width: 100%;
        }
        .ant-popover-message {
        margin-bottom: 10px !important;
        }
        .anticon svg {
        margin-top: -5px;
        }
        .list_view{ .list_view{
        width: 100%; width: 100%;
        height: calc(100vh - 184px); height: calc(100vh - 184px);
        ...@@ -49,4 +58,8 @@ ...@@ -49,4 +58,8 @@
        .ant-col ant-form-item-control{ .ant-col ant-form-item-control{
        margin-top: 0; margin-top: 0;
        } }
        } .ant-table-body{
        \ No newline at end of file max-height: 610px !important;
        }
        }
        src/pages/platformCenter/messageManage/templateManage/components/AddModal.jsx
        View file @ 2bc8f01a
        import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
        import SiteModal from '@/components/Modal/SiteModa'; import SiteModal from '@/components/Modal/SiteModa';
        import { Form, Input, notification, Select } from 'antd' import { Form, Input, notification, Select, Row, Col } from 'antd'
        const { Item } = Form; const { Item } = Form;
        const { TextArea } = Input; const { TextArea } = Input;
        const AddModal = props => {
        const AddModal = props => {
        const { option } = props;
        const [form] = Form.useForm(); const [form] = Form.useForm();
        const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
        const onSubmit = () => { const onSubmit = () => {
        form.submit() form.submit()
        } }
        const onSubmitSuccess = () => { const onSubmitSuccess = () => {
        const result = form.getFieldValue() const result = form.getFieldValue()
        props.onSubmit & props.onSubmit({ Id: props.template.Id, ...result }) props.onSubmit & props.onSubmit({ Id: props.template.Id, ...result })
        } }
        const layout = {
        layout: 'horizontal',
        labelCol: {
        span: 10,
        },
        wrapperCol: {
        span: 19,
        },
        };
        // useEffect(()=>{ // useEffect(()=>{
        // },[props.template]) // },[props.template])
        const onChange = value => {
        const { length } = value;
        form.setFieldsValue({
        dbName: value[length - 1],
        });
        };
        return ( return (
        <SiteModal <SiteModal
        {...props} {...props}
        ...@@ -36,96 +50,158 @@ const AddModal = props => { ...@@ -36,96 +50,158 @@ const AddModal = props => {
        onOk={() => onSubmit()} onOk={() => onSubmit()}
        confirmLoading={loading} confirmLoading={loading}
        > >
        <div style={{ width: "750px", height: "400px", overflowY: "scroll" }}> <div style={{ width: "750px", height: "400px", overflowY: "scroll", overflowX: "hidden" }}>
        <Form form={form} labelCol={{ span: 4 }} onFinish={onSubmitSuccess}> <Form form={form} {...layout} onFinish={onSubmitSuccess}>
        <Item <Row gutter={24}>
        label="模板名称" <Col span={11}>
        name="name" <Item
        rules={[ label="模板名称"
        { name="name"
        required: true,
        message: '请输入模板名称', rules={[
        }, {
        ]} required: true,
        > message: '请输入模板名称',
        <Input placeholder="请输入模板名称" /> },
        </Item> ]}
        <Item >
        label="模板类型" <Input placeholder="请输入模板名称" width='100px' />
        name="type" </Item>
        rules={[ </Col>
        { <Col span={11}>
        required: true, <Item
        message: '请选择模板类型', label="模板类型"
        }, name="type"
        ]} rules={[
        > {
        <Select defaultValue={"公众号"}> required: true,
        <Option value="公众号">公众号</Option> message: '请选择模板类型',
        <Option value="短信">短信</Option> },
        </Select> ]}
        </Item> >
        <Item <Select defaultValue={"公众号"}>
        label="第三方模板名称" <Option value="公众号">公众号</Option>
        name="third_name" <Option value="短信">短信</Option>
        rules={[ </Select>
        { </Item>
        required: true, </Col>
        message: '请输入第三方模板名称', </Row>
        }, <Row gutter={24}>
        ]} <Col span={11}>
        > <Item
        <Input placeholder="请输入模板名称" /> label="第三方模板名称"
        </Item> name="third_name"
        <Item rules={[
        label="第三方模板编号" {
        name="third_id" required: true,
        rules={[ message: '请输入第三方模板名称',
        { },
        required: true, ]}
        message: '请输入第三方模板编号', >
        }, {/* <Input placeholder="请输入模板名称" /> */}
        ]} <Select
        > placeholder="请选择模板名称"
        <Input placeholder="请输入模板名称" /> // onFocus={() => {
        </Item> // selectFocus();
        <Item // }}
        label="模板参数" onChange={e => {
        name="params" onChange(e);
        rules={[ }}
        { >
        required: true, {option &&
        message: '请输入模板参数', option.length > 0 &&
        }, option.map((item, index) => (
        ]} <Option value={item.Name} key={item.Name + index}>
        > {item.Name}
        <TextArea rows={4} placeholder="请输入模板参数" /> </Option>
        </Item> ))}
        <Item </Select>
        label="参数说明" </Item>
        name="desc" </Col>
        rules={[ <Col span={11}>
        { <Item
        required: true, label="第三方模板编号"
        message: '请输入参数说明', name="third_id"
        }, rules={[
        ]} {
        > required: true,
        <TextArea rows={4} placeholder="请输入参数说明" /> message: '请输入第三方模板编号',
        </Item> },
        <Item ]}
        label="参数解析" >
        name="analysis_params" <Input placeholder="请输入模板名称" />
        rules={[ </Item>
        { </Col>
        required: true, </Row>
        message: '请输入参数解析', <Row gutter={24}>
        }, <Col span={1}>
        ]} <Item>
        >
        <TextArea rows={4} placeholder="请输入参数解析" /> </Item>
        </Item> </Col>
        <Col span={23}>
        <Item
        label="模板参数"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        name="params"
        rules={[
        {
        required: true,
        message: '请输入模板参数',
        },
        ]}
        >
        <TextArea rows={4} placeholder="first|Second|Third|Four" />
        </Item>
        </Col>
        </Row>
        <Row gutter={24}>
        <Col span={1}>
        <Item>
        </Item>
        </Col>
        <Col span={23}>
        <Item
        label="参数说明"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        name="desc"
        rules={[
        {
        required: true,
        message: '请输入参数说明',
        },
        ]}
        >
        <TextArea rows={4} placeholder="first: 标题信息|Second: 展示内容|Third: 时间|Four: 备注信息" />
        </Item>
        </Col>
        </Row>
        <Row gutter={24}>
        <Col span={1}>
        <Item>
        </Item>
        </Col>
        <Col span={23}>
        <Item
        label="参数解析"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        name="analysis_params"
        rules={[
        {
        required: true,
        message: '请输入参数解析',
        },
        ]}
        >
        <TextArea rows={4} placeholder="param1|param2|param3|param4" />
        </Item>
        </Col>
        </Row>
        </Form> </Form>
        </div> </div>
        ......
        src/pages/platformCenter/messageManage/templateManage/components/EditModal.jsx
        View file @ 2bc8f01a
        import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
        import SiteModal from '@/components/Modal/SiteModa'; import SiteModal from '@/components/Modal/SiteModa';
        import { Form, Input, notification, Select } from 'antd' import { Form, Input, notification, Select, Row, Col } from 'antd'
        const { Item } = Form; const { Item } = Form;
        const { TextArea } = Input; const { TextArea } = Input;
        const EditModal = props => { const EditModal = props => {
        const { option } = props;
        const [form] = Form.useForm(); const [form] = Form.useForm();
        const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
        const onSubmit = () => { const onSubmit = () => {
        form.submit() form.submit()
        } }
        const onSubmitSuccess =()=>{ const onSubmitSuccess = () => {
        const result = form.getFieldValue() const result = form.getFieldValue()
        props.onSubmit & props.onSubmit({ Id: props.template.Id, ...result }) props.onSubmit & props.onSubmit({ Id: props.template.Id, ...result })
        } }
        ...@@ -31,6 +31,24 @@ const EditModal = props => { ...@@ -31,6 +31,24 @@ const EditModal = props => {
        analysis_params: props.template.analysis_params, analysis_params: props.template.analysis_params,
        }) })
        }, [props.template]) }, [props.template])
        const layout = {
        layout: 'horizontal',
        labelCol: {
        span: 10,
        },
        wrapperCol: {
        span: 19,
        },
        };
        const onChange = value => {
        const { length } = value;
        form.setFieldsValue({
        dbName: value[length - 1],
        });
        };
        return ( return (
        <SiteModal <SiteModal
        {...props} {...props}
        ...@@ -44,96 +62,157 @@ const EditModal = props => { ...@@ -44,96 +62,157 @@ const EditModal = props => {
        onOk={() => onSubmit()} onOk={() => onSubmit()}
        confirmLoading={loading} confirmLoading={loading}
        > >
        <div style={{width:"750px",height:"400px",overflowY:"scroll"}}> <div style={{ width: "750px", height: "400px", overflowY: "scroll", overflowX: "hidden" }}>
        <Form form={form} labelCol={{ span: 4 }} onFinish={onSubmitSuccess}> <Form form={form} {...layout} onFinish={onSubmitSuccess}>
        <Item <Row gutter={24}>
        label="模板名称" <Col span={11}>
        name="name" <Item
        rules={[ label="模板名称"
        { name="name"
        required: true, rules={[
        message: '请输入模板名称', {
        }, required: true,
        ]} message: '请输入模板名称',
        > },
        <Input placeholder="请输入模板名称" /> ]}
        </Item> >
        <Item <Input placeholder="请输入模板名称" />
        label="模板类型" </Item>
        name="type" </Col>
        rules={[ <Col span={11}>
        { <Item
        required: true, label="模板类型"
        message: '请选择模板类型', name="type"
        }, rules={[
        ]} {
        > required: true,
        <Select > message: '请选择模板类型',
        <Option value="公众号">公众号</Option> },
        <Option value="短信">短信</Option> ]}
        </Select> >
        </Item> <Select >
        <Item <Option value="公众号">公众号</Option>
        label="第三方模板名称" <Option value="短信">短信</Option>
        name="third_name" </Select>
        rules={[ </Item>
        { </Col>
        required: true, </Row>
        message: '请输入第三方模板名称', <Row gutter={24}>
        }, <Col span={11}>
        ]} <Item
        > label="第三方模板名称"
        <Input placeholder="请输入模板名称" /> name="third_name"
        </Item> rules={[
        <Item {
        label="第三方模板编号" required: true,
        name="third_id" message: '请输入第三方模板名称',
        rules={[ },
        { ]}
        required: true, >
        message: '请输入第三方模板编号', {/* <Input placeholder="请输入模板名称" /> */}
        }, <Select
        ]} placeholder="请选择模板名称"
        > // onFocus={() => {
        <Input placeholder="请输入模板名称" /> // selectFocus();
        </Item> // }}
        <Item onChange={e => {
        label="模板参数" onChange(e);
        name="params" }}
        rules={[ >
        { {option &&
        required: true, option.length > 0 &&
        message: '请输入模板参数', option.map((item, index) => (
        }, <Option value={item.Name} key={item.Name + index}>
        ]} {item.Name}
        > </Option>
        <TextArea rows={4} placeholder="请输入模板参数" /> ))}
        </Item> </Select>
        <Item </Item>
        label="参数说明" </Col>
        name="desc" <Col span={11}>
        rules={[ <Item
        { label="第三方模板编号"
        required: true, name="third_id"
        message: '请输入参数说明', rules={[
        }, {
        ]} required: true,
        > message: '请输入第三方模板编号',
        <TextArea rows={4} placeholder="请输入参数说明" /> },
        </Item> ]}
        <Item >
        label="参数解析" <Input placeholder="请输入模板名称" />
        name="analysis_params" </Item>
        rules={[ </Col>
        { </Row>
        required: true, <Row gutter={24}>
        message: '请输入参数解析', <Col span={1}>
        }, <Item>
        ]}
        > </Item>
        <TextArea rows={4} placeholder="请输入参数解析" /> </Col>
        </Item> <Col span={23}>
        <Item
        label="模板参数"
        name="params"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        rules={[
        {
        required: true,
        message: '请输入模板参数',
        },
        ]}
        >
        <TextArea rows={4} placeholder="first|Second|Third|Four" />
        </Item>
        </Col>
        </Row>
        <Row gutter={24}>
        <Col span={1}>
        <Item>
        </Item>
        </Col>
        <Col span={23}>
        <Item
        label="参数说明"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        name="desc"
        rules={[
        {
        required: true,
        message: '请输入参数说明',
        },
        ]}
        >
        <TextArea rows={4} placeholder="first: 标题信息|Second: 展示内容|Third: 时间|Four: 备注信息" />
        </Item>
        </Col>
        </Row>
        <Row gutter={24}>
        <Col span={1}>
        <Item>
        </Item>
        </Col>
        <Col span={23}>
        <Item
        label="参数解析"
        labelCol="{span:10}"
        style={{ marginLeft: '1.4rem' }}
        name="analysis_params"
        rules={[
        {
        required: true,
        message: '请输入参数解析',
        },
        ]}
        >
        <TextArea rows={4} placeholder="param1|param2|param3|param4" />
        </Item>
        </Col>
        </Row>
        </Form> </Form>
        </div> </div>
        </SiteModal> </SiteModal>
        ......
        src/pages/userCenter/userManage/UserManage.less
        View file @ 2bc8f01a
        ...@@ -81,6 +81,29 @@ ...@@ -81,6 +81,29 @@
        border-bottom: 1px solid #ccc; border-bottom: 1px solid #ccc;
        } }
        .userManageContainer{ .userManageContainer{
        .ant-form-item {
        vertical-align: top;
        }
        .ant-form-item-label > label {
        align-items:middle;
        }
        .ant-modal-body{
        padding-bottom:0px;
        padding-right:40px;
        padding-left:40px;
        .ant-form{
        width: 90%;
        }
        }
        .anticon svg {
        margin-top: -3px;
        }
        .ant-popover-message {
        position: relative;
        padding: 0px 0 0px;
        color: rgba(0, 0, 0, 0.85);
        font-size: 14px;
        }
        .ant-tree-treenode{ .ant-tree-treenode{
        width: 100% !important; width: 100% !important;
        .ant-tree-node-content-wrapper{ .ant-tree-node-content-wrapper{
        ...@@ -102,6 +125,9 @@ ...@@ -102,6 +125,9 @@
        display: inline-block; display: inline-block;
        } }
        } }
        .ant-radio-group {
        margin: 0px !important;
        }
        .contentContainer{ .contentContainer{
        display: flex; display: flex;
        width: 100%; width: 100%;
        ...@@ -146,6 +172,9 @@ ...@@ -146,6 +172,9 @@
        top: 0; top: 0;
        width: 26px; width: 26px;
        } }
        .ant-popover-message-title {
        padding-left: 20px;
        }
        .userContainer{ .userContainer{
        height: calc(100vh - 74px) !important; height: calc(100vh - 74px) !important;
        z-index: 999; z-index: 999;
        ...@@ -223,14 +252,7 @@ ...@@ -223,14 +252,7 @@
        height: 50vh; height: 50vh;
        } }
        } }
        .ant-modal-body{
        padding-bottom:0px;
        padding-right:40px;
        padding-left:40px;
        .ant-form{
        width: 90%;
        }
        }
        .ant-modal-content{ .ant-modal-content{
        border-radius: 5px; border-radius: 5px;
        } }
        ...@@ -287,27 +309,8 @@ ...@@ -287,27 +309,8 @@
        .ant-popover-inner-content { .ant-popover-inner-content {
        padding: 10px 10px; padding: 10px 10px;
        } }
        .ant-popover-message {
        position: relative;
        padding: 0px 0 0px;
        color: rgba(0, 0, 0, 0.85);
        font-size: 14px;
        }
        .ant-popover-message {
        padding: 0px 0 0px;
        }
        .ant-popover-message-title {
        padding-left: 20px;
        }
        .ant-form-item {
        vertical-align: top;
        }
        .ant-form-item-label > label {
        align-items:middle;
        }
        .ant-radio-group {
        margin: 8px;
        }
        .ant-popover-message > .anticon { .ant-popover-message > .anticon {
        top: 7.0005px top: 7.0005px
        } }
        ...@@ -316,7 +319,4 @@ ...@@ -316,7 +319,4 @@
        // height: calc(100vh - 150px); // height: calc(100vh - 150px);
        // } // }
        .anticon svg {
        margin-top: -3px;
        }
        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