import React, { useState, useRef, useReducer } from "react";
import {
Modal,
Button,
Drawer,
Tooltip,
Popconfirm,
message,
Switch,
} from "antd";
import AutoTable from "@/components/AutoTable";
import getPrem from "@/utils/getPrem"; //权限判断fn
import InitForm from "@/components/InitForm";
import { useRequest } from "umi";
import defaultFields from "./fields";
import { doFetch } from "@/utils/doFetch";
import { deviceprovideDetail, deleteProvideCheck } from "@/services/device";
import { usercusDetails } from "@/utils/detailTotalCard";
import Details from "@/components/Details";
import { useAsyncEffect } from "ahooks";
import tempfields from "@/utils/tempfields";
const initState = {
vs: false,
fields: {},
iftype: {},
details: {
dataSource: {},
totalCard: [],
},
visible: false,
};
function reducer(state, action) {
let { type } = action,
newState = {};
switch (type) {
case "add":
newState = {
...state,
vs: true,
iftype: {
title: "新增客户",
val: type,
},
fields: { ...action.fields },
};
break;
case "edit":
newState = {
...state,
vs: true,
iftype: {
title: "编辑客户",
val: type,
},
fields: { ...action.fields },
};
break;
case "cdetails":
let n = 1,
dataSource = action.dataSource;
let special = action?.dataSource?.customerCharList?.map?.((it) => {
n++;
let key = n.toString();
dataSource[key] = it?.fieldRealValue;
return {
title: it?.fieldName,
key: key,
};
});
let extraspecial = [
{
cardTitle: "特殊属性",
itemData: special,
},
];
newState = {
...state,
details: {
dataSource: action.dataSource,
totalCard: [...usercusDetails, ...extraspecial],
},
visible: true,
};
break;
case "close":
newState = {
vs: false,
fields: {},
iftype: {},
details: {
dataSource: {},
totalCard: [],
},
visible: false,
};
break;
}
return newState;
}
const Deviceprovide = (props) => {
let actionRef = useRef(),
ChildRef = null;
function reload() {
actionRef?.current?.reload();
ChildRef?.onRefresh();
}
const [state, dispatch] = useReducer(reducer, initState),
{ vs, fields, iftype, details, visible } = state,
columns = [
{
title: "客户编号",
dataIndex: "customerNo",
key: "customerNo",
},
{
title: "客户名称",
dataIndex: "customerName",
key: "customerName",
render: (_, row) => {
return (
<div
style={{
padding: "3px 0",
overflow: "hidden",
whiteSpace: "nowrap",
textOverflow: "ellipsis",
}}
>
<Tooltip title={row.customerName}>
<a
onClick={() => {
doFetch({
url: "/ngic-auth/sysCustomer/query/detail",
params: { id: row.id },
}).then((res) => {
let data = res?.data?.data || {};
dispatch({ type: "cdetails", dataSource: data });
});
}}
>
{row.customerName}
</a>
</Tooltip>
</div>
);
},
},
{
title: "联系电话",
dataIndex: "telephone",
key: "telephone",
},
{
title: "邮箱",
dataIndex: "email",
key: "email",
},
{
title: "地址",
dataIndex: "address",
key: "address",
search: false,
},
{
title: "备注",
dataIndex: "remark",
key: "remark",
search: false,
},
{
title: "评分",
dataIndex: "score",
key: "score",
render: (_, row) => {
return <div>{row.score}星</div>;
},
},
{
title: "状态",
dataIndex: "status",
key: "status",
valueType: "select",
options: [
{
label: "启用",
value: 1,
},
{
label: "关闭",
value: 0,
},
],
render: (text, row, _, action) => {
return (
<Popconfirm
title="是否开启或关闭客户?"
onConfirm={() => {
run({
url: "/ngic-auth/sysCustomer/update/status",
params: { id: row.id, status: row.status == 1 ? 0 : 1 },
});
}}
onCancel={() => {}}
okText="确定"
cancelText="取消"
disabled={!getPrem("equipmentCustomer_updatestatus", "ifs")}
>
<Switch
checked={row.status == 1 ? true : false}
checkedChildren="开启"
unCheckedChildren="关闭"
defaultChecked={false}
/>
</Popconfirm>
);
},
},
{
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") {
message.success("操作成功！");
reload();
dispatch({ type: "close" });
}
},
});
const [extrafields, setextrafields] = useState({});
const [subdata, setsubdata] = useState([]);
const [curitem, setcuritem] = useState({});
function extraAction(text, record, _, action) {
return [
getPrem("equipmentCustomer_save", action, "修改", async () => {
await setcuritem({
...record,
key: "edit",
});
}),
getPrem("equipmentCustomer_deleteById", action, "删除", null, {
title: "确认删除该客户？",
onConfirm: () => {
run({
url: "/ngic-auth/sysCustomer/deleteById",
params: { id: record.id },
});
},
}),
];
}
let saveData = (values, fn) => {
let newfields = JSON.parse(JSON.stringify(values));
//新增&修改
let difrid = iftype.val == "edit" ? { id: curitem.id } : {};
let customerUserList = newfields?.customerUserList?.map((it) => {
delete it.id;
return it;
});
let customerCharList = subdata.map((it, i) => {
let key = "field" + i.toString();
it.fieldRealValue = values[key];
delete newfields[key];
return it;
});
let params = {
...newfields,
customerUserList,
customerCharList,
};
run({
url: "/ngic-auth/sysCustomer/save",
params: { ...params, ...difrid },
});
};
let extrarender = [
<Button
disabled={!getPrem("equipmentCustomer_save", "ifs")}
type="primary"
onClick={async () => {
let result = await tempfields(
"/ngic-auth/sysCustomerChar/queryCommonList",
{}
);
for (let i in defaultFields) {
defaultFields[i].value = null;
if (i == "customerUserList") {
defaultFields[i].value = [];
}
if (i == "status") {
defaultFields[i].value = 1;
}
}
for (let i in extrafields) {
extrafields[i].value = null;
if (extrafields[i]["multiple"] == true) {
extrafields[i].value = [];
}
}
dispatch({
type: "add",
fields: { ...defaultFields, ...result?.fields },
});
}}
>
新增
</Button>,
];
useAsyncEffect(async () => {
let result = await tempfields(
"/ngic-auth/sysCustomerChar/queryCommonList",
{ id: curitem.id }
);
await setextrafields(result?.fields);
await setsubdata(result?.data);
if (curitem.key == "edit") {
doFetch({
url: "/ngic-auth/sysCustomer/query/detail",
params: { id: curitem.id },
}).then((res) => {
if (res.code == "0000") {
let data = res?.data?.data || {};
for (let i in defaultFields) {
defaultFields[i].value = data[i];
}
dispatch({
type: "edit",
fields: { ...defaultFields, ...result?.fields },
});
}
});
}
}, [curitem]);
return (
<div>
<AutoTable
pagetitle={props.route.name} //页面标题
pageextra={extrarender} //页面操作 新增or批量删除
columns={columns}
path="/ngic-auth/sysCustomer/queryList"
actionRef={actionRef}
onRef={(node) => (ChildRef = node)}
></AutoTable>
<Modal
maskClosable={false}
title={iftype.title}
visible={vs}
onCancel={() => dispatch({ type: "close" })}
footer={false}
destroyOnClose={true}
width={1000}
>
<InitForm
fields={fields}
submitData={(values) => {
saveData(values);
}}
onChange={(changedValues, allValues) => {
//联动操作
}}
submitting={loading || !vs}
></InitForm>
</Modal>
<Details
title="客户详情"
closable={true}
visible={visible}
onClose={() => dispatch({ type: "close" })}
destroyOnClose={true}
afterVisibleChange={(v) => {}}
width="100%"
className="drawerDetails"
{...details}
></Details>
</div>
);
};
export default Deviceprovide;