import React, { memo, useEffect, useRef, useState, useReducer } from "react";
import {
Image,
Divider,
Menu,
Dropdown,
Button,
Modal,
Row,
Col,
Tooltip,
Drawer,
Form,
Input,
message,
Typography,
} from "antd";
import { connect, useRequest } from "umi";
import AutoTable from "@/components/Tableform/mtable";
import getPrem from "@/utils/getPrem"; //权限判断fn
import InitForm from "@/components/InitForm";
import { doFetch } from "@/utils/doFetch";
import { tableField } from "./fields";
import moment from "moment";
import {
factorySelect,
zuzhi,
allDepartment,
allShop,
depart,
selectionBoxAll,
roleList,
currentUserList,
} from "@/services/system";
const { TextArea } = Input,
{ Paragraph } = Typography;
const initState = {
vs: false,
tableFields: {},
iftype: {},
tableData: [],
hidesTitle: true,
hidesContent: true,
formFields: {},
tableLoading: false,
variableVisible: false,
variableExtraparams: "",
},
sendToArr = [
{
label: "可操作人员",
value: 1,
},
{
label: "创建人",
value: 2,
},
{
label: "（上个通知人员）上级领导",
value: 3,
},
{
label: "选择角色",
value: 4,
},
{
label: "选择人员",
value: 5,
},
],
unitArr = [
{
label: "分钟",
value: 1,
},
{
label: "小时",
value: 2,
},
{
label: "天",
value: 3,
},
],
sendProcessArr = [
{
label: "一级通知",
value: 1,
},
{
label: "二级通知",
value: 2,
},
{
label: "三级通知",
value: 3,
},
{
label: "四级通知",
value: 4,
},
{
label: "五级通知",
value: 5,
},
{
label: "六级通知",
value: 6,
},
{
label: "七级通知",
value: 7,
},
{
label: "八级通知",
value: 8,
},
];
function reducer(state, action) {
if (action.type == "add") {
return {
...state,
vs: true,
tableFields: { ...action.tableFields },
iftype: {
val: "add",
title: "新增基础设置",
id: "",
},
};
} else if (action.type == "edit") {
return {
...state,
vs: true,
tableFields: { ...action.tableFields },
iftype: {
val: "edit",
title: "修改基础设置",
id: action.curitem.id,
},
};
} else if (action.type == "changeHideTitle") {
return {
...state,
hidesTitle: action.hidesTitle,
};
} else if (action.type == "changeHideContent") {
return {
...state,
hidesContent: action.hidesContent,
};
} else if (action.type == "changeFormFields") {
return {
...state,
formFields: { ...action.formFields },
};
} else if (action.type == "start") {
return {
...state,
formFields: { ...action.formFields },
tableData: [...action.tableData],
};
} else if (action.type == "changeTableFields") {
return {
...state,
tableFields: { ...action.tableFields },
};
} else if (action.type == "changeTableData") {
return {
...state,
tableData: [...action.tableData],
vs: false,
tableLoading: false,
};
} else if (action.type == "changeLoading") {
return {
...state,
tableLoading: true,
};
} else if (action.type == "changeShown") {
return {
...state,
shown: action.shown,
};
} else if (action.type == "openVariable") {
return {
...state,
variableVisible: true,
variableExtraparams: action.variableExtraparams,
};
} else if (action.type == "close") {
return {
...state,
vs: false,
iftype: {},
tableFields: {},
variableVisible: false,
variableExtraparams: "",
};
}
}
const Variable = (props) => {
const { businessMsgSceneId, dispatch } = props;
return (
<div>
<AutoTable
withCard={false}
columns={[
{
title: "变量名",
dataIndex: "variableName",
key: "variableName",
width: 120,
},
{
title: "变量代码",
dataIndex: "variableCode",
key: "variableCode",
search: false,
},
{
title: "复制",
valueType: "option",
search: false,
render: (_, row) => {
return (
<Paragraph
copyable={{
text: row.variableCode,
onCopy: () => {
dispatch({ type: "close" });
},
}}
>
复制
</Paragraph>
);
},
},
]}
bordered={false}
path="/ngic-base-business/paBusinessMsgSceneVariable/queryPageBySceneId"
extraparams={{ businessMsgSceneId }}
x={"100%"}
></AutoTable>
</div>
);
};
const Formpage = (props) => {
const { rowMessage, reset, iftypeParent } = props;
let actionRef = useRef(),
ChildRef = null;
function reload() {
actionRef?.current?.reload();
ChildRef?.onRefresh();
}
useEffect(() => {
if (iftypeParent.val == "add") {
for (let i in fields) {
fields[i].hides = false;
fields[i].value = null;
}
} else if (iftypeParent.val == "edit") {
let database = getdatabase(rowMessage["fitField"]);
for (let i in fields) {
fields[i].value = rowMessage[i];
if (i == "sendMethodType") {
showTitleorContent(rowMessage[i]);
form.setFieldsValue({
sendTitle: rowMessage.sendTitle,
sendContent: rowMessage.sendContent,
});
}
if (i == "fieldId" && rowMessage["fitField"] == 1) {
fields[i].hides = true;
} else if (i == "fieldId" && rowMessage["fitField"] != 1) {
fields[i].hides = false;
fields[i].options = {
database,
params: {},
};
}
}
}
dispatch({
type: "start",
formFields: { ...fields },
tableData: iftypeParent.val == "add" ? [] : rowMessage?.detailList,
});
}, [fields]);
const { fields } = props,
[form] = Form.useForm(),
[forms] = Form.useForm(),
[tableFormRef] = Form.useForm(),
[state, dispatch] = useReducer(reducer, initState),
{
vs,
tableFields,
iftype,
tableData,
hidesTitle,
hidesContent,
formFields,
tableLoading,
variableVisible,
shown,
variableExtraparams,
} = state,
columns = [
{
title: "推送流程",
dataIndex: "sendProcessName",
key: "sendProcessName",
search: false,
},
{
title: "推送对象",
dataIndex: "sendToName",
key: "sendToName",
search: false,
},
{
title: "选择对象",
dataIndex: "targetNames",
key: "targetNames",
search: false,
},
{
title: "初始触发时长",
dataIndex: "initialTime",
key: "initialTime",
search: false,
},
{
title: "初始触发时长单位",
dataIndex: "initialUnitName",
key: "initialUnitName",
search: false,
},
{
title: "间隔时长",
dataIndex: "intervalTime",
key: "intervalTime",
search: false,
},
{
title: "间隔时长单位",
dataIndex: "intervalUnitName",
key: "intervalUnitName",
search: false,
},
{
title: "触发次数",
dataIndex: "sendNum",
key: "sendNum",
search: false,
},
{
title: "操作",
valueType: "option",
width: 150,
render: (text, row, _, action) => extraAction(text, row, _, action),
},
],
{ run, loading } = useRequest(doFetch, {
manual: true,
formatResult: (res) => res,
onSuccess: (result, params) => {
if (result.code == "0000") {
reset && reset();
}
},
});
let extrarender = [
<Button
size={"middle"}
type="primary"
onClick={() => {
for (let i in tableField) {
tableField[i].value = null;
if (i == "targetIdList") {
tableField[i].hides = true;
tableField[i].value = [];
}
if (i == "initialTime") {
tableField[i].value = 0;
}
if (i == "intervalTime") {
tableField[i].value = 1;
}
if (i == "sendNum") {
tableField[i].value = 1;
}
}
dispatch({ type: "add", tableFields: tableField });
}}
>
新增
</Button>,
];
function extraAction(text, record, _, action) {
return (
<div>
{getPrem(true, null, "修改", () => {
for (let j in tableField) {
tableField[j].value = record[j];
if (j == "targetIdList") {
if (record.sendTo != 4 && record.sendTo != 5) {
tableField[j].hides = true;
} else {
let database = getformdatabase(record.sendTo);
tableField[j].hides = false;
tableField[j].options = {
database,
params: {},
};
}
}
dispatch({
type: "edit",
tableFields: tableField,
curitem: record,
});
}
})}
<Divider type="vertical" />
{getPrem(true, "red", "删除", null, {
title: "确认删除该基础配置？",
onConfirm: () => {
let newData = tableData.filter((it) => it.id != record.id);
dispatch({ type: "changeTableData", tableData: newData });
},
})}
</div>
);
}
let saveData = (values, fn) => {
dispatch({ type: "changeLoading" });
const {
sendTo,
targetIdList,
sendProcess,
initialUnit,
initialTime,
intervalTime,
intervalUnit,
sendNum,
} = values;
let targetNames = [];
let all = async () => {
if (sendTo == 4) {
let data = await roleList({});
return {
newArr: data?.data?.dataList || [],
};
} else if (sendTo == 5) {
let data = await currentUserList({});
return {
newArr: data?.data?.dataList || [],
};
} else {
return {
newArr: [],
};
}
};
all().then((res) => {
let dataArr = res.newArr;
targetNames =
dataArr
?.filter((it) => targetIdList?.indexOf(it.value) > -1)
?.map((it) => it.label)
?.join(",") || "";
let params = {
sendTo,
targetNames,
sendProcess,
sendProcessName:
sendProcessArr.filter((it) => it.value == sendProcess).length > 0
? sendProcessArr.filter((it) => it.value == sendProcess)[0]
.label
: "",
initialUnit,
initialTime,
intervalTime,
intervalUnit,
sendNum,
targetIdList,
id: iftype.id
? iftype.id
: moment().valueOf() +
Math.floor(Math.random() * (9999 - 1000)) +
1000,
sendToName:
sendToArr.filter((it) => it.value == sendTo).length > 0
? sendToArr.filter((it) => it.value == sendTo)[0].label
: "",
initialUnitName:
unitArr.filter((it) => it.value == initialUnit).length > 0
? unitArr.filter((it) => it.value == initialUnit)[0].label
: "",
intervalUnitName:
unitArr.filter((it) => it.value == intervalUnit).length > 0
? unitArr.filter((it) => it.value == intervalUnit)[0].label
: "",
},
newTable;
if (iftype.val == "edit") {
newTable = tableData.map((it) => {
if (it.id == iftype.id) {
it = { ...params };
}
return it;
});
} else {
newTable = [...tableData];
newTable.unshift(params);
}
dispatch({ type: "changeTableData", tableData: newTable });
});
},
saveForm = () => {
let editId = rowMessage ? { id: rowMessage.id } : {},
all = async () => {
let values = await forms.validateFields(),
valuesc = await form.validateFields();
return {
values,
valuesc,
};
};
all().then((res) => {
if (!tableData.length) {
return message.warning("基础配置不可为空！");
}
let detailList = tableData.map((it) => {
if (iftypeParent.val == "edit") {
return {
sendProcess: it.sendProcess,
sendTo: it.sendTo,
targetIdList: it.targetIdList,
initialTime: it.initialTime,
initialUnit: it.initialUnit,
intervalTime: it.intervalTime,
intervalUnit: it.intervalUnit,
sendNum: it.sendNum,
id: it.id && typeof it.id == "number" ? "" : it.id,
};
} else {
return {
sendProcess: it.sendProcess,
sendTo: it.sendTo,
targetIdList: it.targetIdList,
initialTime: it.initialTime,
initialUnit: it.initialUnit,
intervalTime: it.intervalTime,
intervalUnit: it.intervalUnit,
sendNum: it.sendNum,
};
}
}),
params = {
...res.values,
...res.valuesc,
detailList,
...editId,
};
run({
url: "/ngic-base-business/paBusinessMsgOption/save",
params: { ...params },
});
});
};
function showTitleorContent(val) {
if (val == 4) {
dispatch({ type: "changeHideTitle", hidesTitle: false });
} else {
dispatch({ type: "changeHideTitle", hidesTitle: false });
}
if (val == 2) {
dispatch({ type: "changeHideContent", hidesContent: false });
} else {
dispatch({ type: "changeHideContent", hidesContent: false });
}
}
function getdatabase(val) {
let database;
switch (val) {
case 2:
database = factorySelect;
break;
case 3:
database = zuzhi;
break;
case 4:
database = selectionBoxAll;
break;
}
return database;
}
function getformdatabase(val) {
let database;
switch (val) {
case 4:
database = roleList;
break;
case 5:
database = currentUserList;
break;
}
return database;
}
return (
<div>
<InitForm
fields={formFields}
onChange={(changedValues, allValues) => {
for (let i in changedValues) {
if (i == "sendMethodType") {
showTitleorContent(changedValues[i]);
}
if (i == "fitField") {
let database = getdatabase(changedValues[i]);
for (let j in formFields) {
if (j == "fieldId" && changedValues[i] == 1) {
formFields[j].hides = true;
} else if (j == "fieldId" && changedValues[i] != 1) {
formFields[j].hides = false;
formFields[j].options = {
database,
params: {},
};
formFields[j].type =
changedValues[i] == 3 ? "treeselect" : "select";
forms.setFieldsValue({ fieldId: "" });
}
}
dispatch({ type: "changeFormFields", formFields: formFields });
}
}
}}
actions={(form, submitBtn) => {
return null;
}}
formRef={forms}
></InitForm>
<Form form={form}>
{!hidesTitle && (
<Form.Item
name="sendTitle"
rules={[
{
required: true,
message: "请输入推送标题",
},
]}
>
<div>
<div>
<span style={{ color: "#ff4d4f" }}>*</span> 推送标题
</div>
<TextArea
rows={4}
defaultValue={
iftypeParent.val == "edit" ? rowMessage.sendTitle : ""
}
/>
</div>
</Form.Item>
)}
{(!hidesTitle || !hidesContent) && (
<Button
type="primary"
style={{ marginBottom: 15 }}
onClick={() => {
let params = forms.getFieldValue("businessMsgSceneId");
dispatch({ type: "openVariable", variableExtraparams: params });
}}
>
查看变量
</Button>
)}
{!hidesContent && (
<Form.Item
name="sendContent"
rules={[
{
required: true,
message: "请输入推送内容",
},
]}
>
<div>
<div>
<span style={{ color: "#ff4d4f" }}>*</span> 推送内容
</div>
<TextArea
rows={4}
defaultValue={
iftypeParent.val == "edit" ? rowMessage.sendContent : ""
}
/>
</div>
</Form.Item>
)}
</Form>
{!tableLoading && (
<AutoTable
pagetitle="基础设置"
pageextra={extrarender}
columns={columns}
actionRef={actionRef}
onRef={(node) => (ChildRef = node)}
dataSource={tableData}
></AutoTable>
)}
<div style={{ display: "flex", marginTop: 15 }}>
<Button
loading={loading}
type="primary"
size="large"
style={{ flex: 1 }}
onClick={saveForm}
>
提交
</Button>
</div>
<Modal
maskClosable={false}
title={iftype.title}
visible={vs}
onCancel={() => dispatch({ type: "close" })}
style={{ top: 20 }}
footer={false}
width="1000px"
destroyOnClose={true}
>
<InitForm
fields={tableFields}
submitData={(values, fn) => {
saveData(values, fn);
}}
formRef={tableFormRef}
onChange={(changedValues, allValues) => {
for (let i in changedValues) {
if (i == "sendTo") {
for (let j in tableField) {
if (j == "targetIdList") {
tableFormRef.setFieldsValue({ targetIdList: [] });
tableField[j].value = [];
if (changedValues[i] != 4 && changedValues[i] != 5) {
tableField[j].hides = true;
} else {
let database = getformdatabase(changedValues[i]);
tableField[j].hides = false;
tableField[j].options = {
database,
params: {},
};
}
}
}
dispatch({
type: "changeTableFields",
tableFields: tableField,
});
}
}
}}
></InitForm>
</Modal>
<Drawer
title={"查看变量"}
closable={true}
visible={variableVisible}
onClose={() => dispatch({ type: "close" })}
destroyOnClose={true}
afterVisibleChange={(v) => {
dispatch({ type: "changeShown", shown: v });
}}
width="40%"
>
{shown && (
<Variable
businessMsgSceneId={variableExtraparams}
dispatch={dispatch}
/>
)}
</Drawer>
</div>
);
};
export default Formpage;