import React, { useEffect, useReducer, useRef } from "react";
import {
Button,
Drawer,
message,
Form,
Popconfirm,
Switch,
Tabs,
Card,
Row,
Col,
Tooltip,
Checkbox,
Divider,
} from "antd";
import AutoTable from "@/components/AutoTable";
import getPrem from "@/utils/getPrem"; //权限判断fn
import InitForm from "@/components/InitForm";
import { useRequest } from "umi";
import { waitFields, schedulingFields, tableFields } from "./fields";
import moment from "moment";
import { doFetch } from "@/utils/doFetch";
import {
productionLineSelectByShop,
shiftSelectByShopId,
} from "@/services/system";
const CheckboxGroup = Checkbox.Group;
const initState = {
schedulingLeftData: [],
schedulingCheckedData: [],
searchLoading: false,
indeterminate: false,
topfields: {},
bottomfields: {},
checkAll: false,
lastFields: {},
addloading: false,
};
function reducer(state, action) {
let { type } = action,
newState = {};
switch (type) {
case "changeLeftData":
newState = {
...state,
schedulingLeftData: action.schedulingLeftData,
};
break;
case "changeSearchLoading":
newState = {
...state,
searchLoading: action.searchLoading,
};
break;
case "checkItem":
newState = {
...state,
indeterminate: action.indeterminate,
schedulingCheckedData: action.schedulingCheckedData,
checkAll: action.checkAll,
};
break;
case "checkAllData":
newState = {
...state,
indeterminate: false,
schedulingCheckedData: action.schedulingCheckedData,
checkAll: action.checked,
};
break;
case "changetopfields":
newState = {
...state,
topfields: action.topfields,
};
break;
case "changebottomfields":
newState = {
...state,
bottomfields: action.bottomfields,
};
break;
case "changeaddloading":
newState = {
...state,
addloading: action.addloading,
};
break;
case "changelastFields":
newState = {
...state,
lastFields: action.lastFields,
};
break;
case "close":
newState = {
schedulingLeftData: [],
schedulingCheckedData: [],
searchLoading: false,
indeterminate: false,
topfields: {},
bottomfields: {},
checkAll: false,
lastFields: {},
addloading: false,
};
break;
}
return newState;
}
const Scheduling = ({ reset, schedulingVisible }) => {
const [state, dispatch] = useReducer(reducer, initState),
{
schedulingLeftData,
schedulingCheckedData,
topfields,
bottomfields,
searchLoading,
indeterminate,
checkAll,
lastFields,
addloading,
} = state,
[leftFormRef] = Form.useForm(),
[rightFormRef] = Form.useForm(),
[tableFormRef] = Form.useForm();
useEffect(() => {
dispatch({ type: "changetopfields", topfields: { ...waitFields } });
dispatch({
type: "changebottomfields",
bottomfields: { ...schedulingFields },
});
for (let i in tableFields) {
tableFields[i].value = [];
}
dispatch({ type: "changelastFields", lastFields: { ...tableFields } });
}, []);
const { run, loading } = useRequest(doFetch, {
manual: true,
formatResult: (res) => res,
onSuccess: (result, params) => {
if (result.code == "0000") {
reset && reset();
dispatch({ type: "close" });
}
},
});
return (
<div style={{ display: "flex", height: "100%" }}>
<div
style={{
flex: 1,
height: "100%",
display: "flex",
flexDirection: "column",
width: "100%",
overflow: "hidden",
}}
>
<div>
<InitForm
fields={topfields}
submitData={(values, fn) => {}}
onChange={(changedValues, allValues) => {
for (let i in changedValues) {
if (i == "shopId") {
for (let j in schedulingFields) {
if (!changedValues[i]) {
if (j == "productionLineId" || j == "shiftId") {
schedulingFields[j].options = [];
rightFormRef.setFieldsValue({ [j]: "" });
}
} else {
if (j == "productionLineId") {
schedulingFields[j].options = {
database: productionLineSelectByShop,
params: {
shopId: changedValues[i],
},
};
}
if (j == "shiftId") {
schedulingFields[j].options = {
database: shiftSelectByShopId,
params: {
shopId: changedValues[i],
},
};
}
}
}
dispatch({
type: "changebottomfields",
bottomfields: { ...schedulingFields },
});
}
}
}}
actions={(form, submitBtn) => {
return (
<Button
loading={searchLoading}
style={{ marginLeft: 12 }}
type="primary"
onClick={() => {
form
.validateFields()
.then((values) => {
dispatch({
type: "changeSearchLoading",
searchLoading: true,
});
let newFields = JSON.parse(JSON.stringify(values));
newFields.dateTimeList =
newFields.dateTimeList?.length > 0
? [
moment(newFields.dateTimeList[0]).format(
"YYYY-MM-DD"
),
moment(newFields.dateTimeList[1]).format(
"YYYY-MM-DD"
),
]
: [];
doFetch({
url: "/ngic-production/emPlanOrder/querySchedulingList",
params: { ...newFields },
}).then((res) => {
if (res.code == "0000") {
let data = res?.data?.dataList ?? [];
dispatch({
type: "changeLeftData",
schedulingLeftData: data,
});
dispatch({
type: "checkAllData",
schedulingCheckedData: [],
checked: false,
});
for (let i in tableFields) {
tableFields[i].value = [];
tableFormRef.setFieldsValue({ [i]: [] });
}
dispatch({
type: "changelastFields",
lastFields: { ...tableFields },
});
for (let i in schedulingFields) {
schedulingFields[i].value = "";
rightFormRef.setFieldsValue({ [i]: "" });
}
dispatch({
type: "changebottomfields",
bottomfields: { ...schedulingFields },
});
}
dispatch({
type: "changeSearchLoading",
searchLoading: false,
});
});
})
.catch((error) => {});
}}
>
查询
</Button>
);
}}
formRef={leftFormRef}
></InitForm>
</div>
<div
style={{
marginTop: 12,
display: "flex",
justifyContent: "space-between",
}}
>
<div>待排产计划</div>
<Checkbox
indeterminate={indeterminate}
checked={checkAll}
onChange={(e) => {
dispatch({
type: "checkAllData",
schedulingCheckedData: e.target.checked
? [...schedulingLeftData]
: [],
checked: e.target.checked,
});
}}
>
全选
</Checkbox>
</div>
<div
className="scheduling"
style={{
flex: 1,
overflowY: "auto",
overflowX: "hidden",
width: "100%",
}}
>
<CheckboxGroup
value={schedulingCheckedData.map((it) => it.id)}
style={{ width: "100%" }}
onChange={(list) => {
dispatch({
type: "checkItem",
indeterminate:
!!list.length && list.length < schedulingLeftData.length,
schedulingCheckedData:
list.length == 0
? []
: schedulingLeftData.filter(
(it) => list.indexOf(it.id) > -1
),
checkAll: list.length == schedulingLeftData.length,
});
}}
>
{schedulingLeftData.map((it) => {
return (
<div
key={it.id}
style={{
width: "100%",
border: "1px solid #d9d9d9",
borderRadius: 4,
padding: 6,
marginTop: 12,
}}
>
<Checkbox value={it.id} style={{ width: "100%" }}>
<div style={{ width: "100%", overflow: "hidden" }}>
<Tooltip title={`车间计划编号：${it.shopPlanNo}`}>
<div className="oneText" style={{ marginBottom: 2 }}>
车间计划编号：{it.shopPlanNo}
</div>
</Tooltip>
<Tooltip
title={`物料：${it.materieCode}-${it.materieName}-${it.productionUnitName}`}
>
<div className="oneText" style={{ marginBottom: 2 }}>
物料：
{`${it.materieCode}-${it.materieName}-${it.productionUnitName}`}
</div>
</Tooltip>
<Tooltip title={`未排数：${it.unscheduledQuantity}`}>
<div className="oneText" style={{ marginBottom: 2 }}>
未排数：{it.unscheduledQuantity}
</div>
</Tooltip>
<Tooltip
title={`计划时间：${it.planStartDate}~${it.planEndDate}`}
>
<div className="oneText">
计划时间：{`${it.planStartDate}~${it.planEndDate}`}
</div>
</Tooltip>
</div>
</Checkbox>
</div>
);
})}
</CheckboxGroup>
</div>
</div>
<Divider type="vertical" style={{ height: "100%", margin: "0 15px" }} />
<div
style={{
flex: 3,
display: "flex",
flexDirection: "column",
height: "100%",
}}
>
<div>
<InitForm
fields={bottomfields}
submitData={(values, fn) => {}}
onChange={(changedValues, allValues) => {
for (let i in allValues) {
tableFields["list"].value = [];
tableFormRef.setFieldsValue({ list: [] });
dispatch({
type: "changelastFields",
lastFields: { ...tableFields },
});
}
}}
actions={(form, submitBtn) => {
return (
<Button
style={{ marginLeft: 12 }}
type="primary"
onClick={() => {
dispatch({ type: "changeaddloading", addloading: true });
form
.validateFields()
.then((values) => {
for (let i in tableFields) {
tableFields[i].value = schedulingCheckedData;
tableFormRef.setFieldsValue({
[i]: schedulingCheckedData,
});
}
dispatch({
type: "changelastFields",
lastFields: { ...tableFields },
});
dispatch({
type: "changeaddloading",
addloading: false,
});
})
.catch((error) => {});
}}
>{` 已选中${schedulingCheckedData.length}个车间计划`}</Button>
);
}}
formRef={rightFormRef}
></InitForm>
</div>
<div
style={{
marginTop: 15,
flex: 1,
overflow: "hidden",
overflowY: "auto",
}}
>
{!addloading && (
<InitForm
fields={lastFields}
submitData={(values, fn) => {}}
onChange={(changedValues, allValues) => {}}
actions={(form, submitBtn) => {
return (
<Button
style={{ marginLeft: 12 }}
type="primary"
onClick={() => {
rightFormRef
.validateFields()
.then((values) => {
let newFields = form.getFieldsValue(),
rightForms = JSON.parse(JSON.stringify(values));
for (let i = 0; i < newFields.list.length; i++) {
if (!newFields.list[i].scheduledNum) {
return message.warning("排产数量需大于0！");
}
}
let params = newFields.list.map((it) => {
return {
productionLineId: rightForms.productionLineId,
productionDate: moment(
rightForms.productionDate
).format("YYYY-MM-DD"),
shiftId: rightForms.shiftId,
scheduledNum: it.scheduledNum,
id: it.id,
};
});
run({
url: "/ngic-production/emPlanOrder/save",
params,
});
})
.catch((error) => {});
}}
>
生成派工单
</Button>
);
}}
formRef={tableFormRef}
submitting={loading || !schedulingVisible}
></InitForm>
)}
</div>
</div>
</div>
);
};
export default Scheduling;