import React, { useState, useEffect, useRef } from 'react'; import SiteModal from '@/components/Modal/SiteModa'; import { Form, Input, notification, Select, Checkbox, message, Button } from 'antd'; import BaseForm from '@/components/BaseForm/index'; import { Switch } from 'react-router'; import { iteratee } from 'lodash'; import styles from './EditModal.less'; import v from 'voca'; import VisibleRoleModal from './RolseSelect/VisibleRoleModal'; import VisibleIISAgentConfig from './IISAgentConfig/VisibleIISAgentConfig'; import { GetMessageTemplate } from '@/services/messagemanage/messagemanage'; import moment from 'moment'; import { UpdateMessageConfig, InsertMessageConfig, AddIISAgentConfig, } from '@/services/messagemanage/messagemanage'; const { Item } = Form; const EditModal = props => { const [form] = Form.useForm(); const [loading, setLoading] = useState(false); const [isStart, setIsStart] = useState(false); const [IISConfig, setIISConfig] = useState(null); const { template, confirmModal } = props; const [currentTrench, setCurrentTrench] = useState({ isMessageShow: false, isAPPShow: false, isWEBShow: false, isWXShow: false, }); const plainOptions = ['平台弹框', '短信推送', '公众号推送']; const [APP_ITEMS, setAPP_ITEMS] = useState([]); const [WEB_ITEMS, setWEB_ITEMS] = useState([]); const [WX_ITEMS, setWX_ITEMS] = useState([]); const [MES_ITEMS, setMES_ITEMS] = useState([]); useEffect(() => { GetMessageTemplate().then(res => { if (res.code === 0) { let arr1 = []; let arr2 = []; let arr3 = []; let arr4 = []; res.data.map((item, index) => { if (item.Type === '公众号') { arr1.push(item); } if (item.Type === '短信') { arr2.push(item); } if (item.Type === 'APP') { arr3.push(item); } if (item.Type === 'WEB') { arr4.push(item); } }); setAPP_ITEMS(arr3); setMES_ITEMS(arr2); setWX_ITEMS(arr1); setWEB_ITEMS(arr4); } }); }, []); useEffect(() => { if (template.ThemeName) { console.log(template); form.setFieldsValue({ name: template.MsgType, isStart: template.IsStarted === '0' ? '关闭' : '开启', to_person: template.PushGroup, push_plan: template.MsgType, push_mode: template.PushMode === null ? '' : template.PushMode.split(','), app_template: template.AppTemplateID, app_path: template.AppFunctionPath, wx_template: parseInt(template.PublicTemplateID), h5_path: template.PublicPath, miniprogram_path: template.MiniAppRoute, web_template: template.WebTemplateID, web_path: template.WebFunctionPath, message_template: template.MsgTemplateID, }); setCurrentTrench({ isAPPShow: template.PushMode && template.PushMode.split(',').indexOf('平台弹框') > -1 ? true : false, isWXShow: template.PushMode && template.PushMode.split(',').indexOf('公众号推送') > -1 ? true : false, isWEBShow: template.PushMode && template.PushMode.split(',').indexOf('平台弹框') > -1 ? true : false, isMessageShow: template.PushMode && template.PushMode.split(',').indexOf('短信推送') > -1 ? true : false, }); } }, [props]); const onNameChange = e => { form.setFieldsValue({ push_plan: e.target.value, }); }; const onSubmit = () => { console.log(form.getFieldValue()); let fv = form.getFieldValue(); if (template.ThemeName) { console.log('fv.wx_template', fv.wx_template); console.log('fv.push_mode.toString()', fv.push_mode.toString()); let a = { ID: template.ID, ThemeName: template.ThemeName, MsgType: fv.name, PublicTemplateID: fv.wx_template.toString(), PublicConfig: template.PublicConfig, PublicPath: fv.h5_path, MsgTemplateName: template.MsgTemplateName, MsgTemplateCode: template.MsgTemplateCode, MsgConfig: template.MsgConfig, MiniAppRoute: fv.miniprogram_path, AppFunctionPath: fv.app_path, AppConfig: template.AppConfig, WebFunctionPath: fv.web_path, WebConfig: template.WebConfig, IsDelete: template.IsDelete, InputTime: moment().format('YYYY-MM-DD HH:mm:ss'), Pusher: template.Pusher, PushMode: fv.push_mode.toString(), PushPath: template.PushPath, IsStarted: fv.isStart, MsgTemplateID: fv.message_template, AppTemplateID: fv.app_template, WebTemplateID: fv.web_template, PushGroup: fv.to_person.toString(), }; console.log(a); UpdateMessageConfig(a).then(res => { if (res.code === 0) { if (IISConfig) { AddIISAgentConfig(IISConfig).then(res => { if (res.code === 0) { message.success('保存成功'); confirmModal(); } }); } else { message.success('保存成功'); confirmModal(); } } }); } else { console.log('fv.push_mode.toString()', fv.push_mode.toString()); let b = { ThemeName: '定时推送', MsgType: fv.name, PublicTemplateID: fv.wx_template, PublicConfig: template.PublicConfig, PublicPath: fv.h5_path, MsgTemplateName: template.MsgTemplateName, MsgTemplateCode: template.MsgTemplateCode, MsgConfig: template.MsgConfig, MiniAppRoute: fv.miniprogram_path, AppFunctionPath: fv.app_path, AppConfig: template.AppConfig, WebFunctionPath: fv.web_path, WebConfig: template.WebConfig, IsDelete: template.IsDelete, InputTime: moment().format('YYYY-MM-DD HH:mm:ss'), Pusher: template.Pusher, PushMode: fv.push_mode.toString(), PushPath: template.PushPath, IsStarted: fv.isStart, MsgTemplateID: fv.message_template, AppTemplateID: fv.app_template, WebTemplateID: fv.web_template, PushGroup: fv.to_person.toString(), }; InsertMessageConfig(b).then(res => { if (res.code === 0) { if (IISConfig) { AddIISAgentConfig(IISConfig).then(res => { if (res.code === 0) { message.success('保存成功'); confirmModal(); } }); } else { message.success('保存成功'); confirmModal(); } } }); } }; const operateProject = () => {}; const onTypeChange = value => { setCurrentTrench({ isAPPShow: value.indexOf('平台弹框') > -1 ? true : false, isWXShow: value.indexOf('公众号推送') > -1 ? true : false, isWEBShow: value.indexOf('平台弹框') > -1 ? true : false, isMessageShow: value.indexOf('短信推送') > -1 ? true : false, }); }; const onIISAgentSubmit = value => { console.log(value, 'IIS配置'); setIISConfig(value); }; const onPushSubmit = value => { console.log(value, 'onPushSubmit'); }; return ( <SiteModal {...props} title={template.ThemeName ? '编辑推送方案' : '新增推送方案'} bodyStyle={{ width: '100%', minHeight: '100px' }} style={{ top: 200, borderRadius: '20px' }} width="1200px" destroyOnClose cancelText="取消" okText="确认" onOk={() => onSubmit()} confirmLoading={loading} > <div className={styles.editModal_container}> <Form form={form} labelCol={{ span: 4 }}> <Item label="方案名称" name="name" rules={[ { required: true, message: '请输入方案名称', }, ]} > <Input placeholder="请输入方案名称" disabled={template.ThemeName ? true : false} onChange={onNameChange} /> </Item> <Item label="是否开启" name="isStart"> <Select> <Option value="1">开启</Option> <Option value="0">关闭</Option> </Select> </Item> <Item label="推送人" name="to_person"> <VisibleRoleModal onSubmit={onPushSubmit} title={'推送人员'} /> </Item> <Item label="定时计划" name="push_plan"> <VisibleIISAgentConfig agentConfig={template.item && template.item.AgentConfig} onIISAgentSubmit={onIISAgentSubmit} /> </Item> <Item label="推送方式" name="push_mode"> <Checkbox.Group options={plainOptions} onChange={onTypeChange} /> </Item> <div className={styles.push_trench}> {currentTrench.isAPPShow && ( <div className={styles.trench_card}> <div className={styles.card_title}> <div className={styles.lable}>APP</div> </div> <div className={styles.card_body}> <Item label="模板" name="app_template"> <Select> {APP_ITEMS.map((item, idx) => { return ( <Option value={item.Id} key={idx}> {item.LikeName} </Option> ); })} </Select> </Item> <Item label="功能路径" name="app_path"> <Input placeholder="请输入功能路径" /> </Item> </div> </div> )} {currentTrench.isWXShow && ( <div className={styles.trench_card}> <div className={styles.card_title}> <div className={styles.lable}>微信</div> </div> <div className={styles.card_body}> <Item label="模板" name="wx_template"> <Select> {WX_ITEMS.map((item, idx) => { return ( <Option value={item.Id} key={idx}> {item.LikeName} </Option> ); })} </Select> </Item> <Item label="H5路由" name="h5_path"> <Input placeholder="请输入功能路径" /> </Item> <Item label="小程序路由" name="miniprogram_path"> <Input placeholder="请输入功能路径" /> </Item> </div> </div> )} {currentTrench.isWEBShow && ( <div className={styles.trench_card}> <div className={styles.card_title}> <div className={styles.lable}>WEB</div> </div> <div className={styles.card_body}> <Item label="模板" name="web_template"> <Select> {WEB_ITEMS.map((item, idx) => { return ( <Option value={item.Id} key={idx}> {item.LikeName} </Option> ); })} </Select> </Item> <Item label="功能路径" name="web_path"> <Input placeholder="请输入功能路径" /> </Item> </div> </div> )} {currentTrench.isMessageShow && ( <div className={styles.trench_card}> <div className={styles.card_title}> <div className={styles.lable}>短信</div> </div> <div className={styles.card_body}> <Item label="模板" name="message_template"> <Select> {MES_ITEMS.map((item, idx) => { return ( <Option value={item.Id} key={idx}> {item.LikeName} </Option> ); })} </Select> </Item> </div> </div> )} </div> </Form> </div> </SiteModal> ); }; export default EditModal;