/**
 * 工单基础信息管理
 * @param Page
 * @returns
 */
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { CheckCard, FooterToolbar, ProForm, ProFormSelect, ProFormText, ProTable } from '@ant-design/pro-components';
import { Button, Modal, Form, Input, message, Popconfirm, Tag, DatePicker as TDatePicker, Select, Steps, StepsProps, Popover, ConfigProvider, List, Space, Radio, Card, Row, Col, Flex, Empty, Badge, Divider } from 'antd';
import { useEffect, useRef, useState } from 'react';
import WorkInfoAPI from '@/api/workService';
import FinalAPI from '@/api/finalService';
import ProductLineAPI from '@/api/productlineService';
import productlineInfoStepsAPI from '@/api/productlinesteps/service'
import styles from "./index.less";
import dayjs from 'dayjs'
import workService from '@/api/workService';
import workplanApi from '@/api/work/plan/service'





const DatePicker: any = TDatePicker;
const Stepitems = [
  {
    title: '草稿',
    description: '',
  },
  {
    title: '已下发',
    description: '',
  },
  {
    title: '已接受',
    description: '',
  },
  {
    title: '已启动',
    description: '',
  },
  {
    title: '已完成',
    description: '',
  }
];
const BatchStepitems = [
  {
    title: '草稿',
    description: '',
  },
  {
    title: '已下发',
    description: '',
  },
  {
    title: '已接受',
    description: '',
  },
  {
    title: '已启动',
    description: '',
  },
  {
    title: '已完成',
    description: '',
  }
];

export default () => {


  //表单
  const [typeForm] = Form.useForm();
  const [batchForm] = Form.useForm();
  const [modelTitle, setModelTitle] = useState<string>();
  const [finalPlan, setfinalPlan] = useState<any[]>([])
  const [finalData, setFinalData] = useState<MySelectType.Select[]>([])
  const [lineData, setLineData] = useState<MySelectType.Select[]>([])
  const [workStatusList, setWorkStatusList] = useState([])

  //获取产线工艺流程
  const [lineProcessList, setLineProcessList] = useState<any[]>([])
  const [selectfinal, setSelectFinal] = useState<any>();

  const [lineDeviceData, setLineDeviceData] = useState<any[]>([])

  const [selectItemRow, setSelectItemRow] = useState<WorkInfoTypes.WorkInfoOutput>();

  const [selectBatchItemRow, setSelectBatchItemRow] = useState<any>();

  const [itemparams, setitemparams] = useState<any>();

  //编辑/新增弹窗
  const [isModalOpen, setIsModalOpen] = useState(false);
  const [isBatchModalOpen, setIsBatchModalOpen] = useState(false);
  const [isModalPublishOpen, setIsModalPublishOpen] = useState(false);
  const [isModalStatusOpen, setIsModalStatusOpen] = useState(false);
  const actionRef = useRef<ActionType>();
  const batchActionRef = useRef<ActionType>();
  const [itemData, setItemData] = useState<WorkInfoTypes.WorkInfoOutput[]>([]);
  const [itemLoading, SetItemLoading] = useState<boolean>(false)
  const finalIdFlag = Form.useWatch('finalId', typeForm);
  const columns: ProColumns<WorkInfoTypes.WorkInfoOutput>[] = [
    {
      title: '工单编码',
      dataIndex: 'id',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '线路名称',
      dataIndex: 'lineName',
      ellipsis: true,
      hideInSearch: true,
      align: 'center',
    },
    // {
    //   title: '炒锅名称',
    //   dataIndex: 'deviceName',
    //   ellipsis: true,
    //   hideInSearch: true,
    //   align: 'center',
    //   renderText(text, record, index, action) {
    //     return <>{record.deviceName ? record.deviceName : "自动分配"}</>
    //   },
    // },
    {
      title: '成品名称',
      dataIndex: 'finalName',
      align: 'center',
      hideInSearch: true,
      ellipsis: true,
    },
    {
      title: '下料(锅)',
      dataIndex: 'number',
      ellipsis: true,
      hideInSearch: true,
      align: 'center',
      width:80
    },
    {
      dataIndex: 'batchId',
      align: 'center',
      hideInSearch: true,
      ellipsis: true,
      hideInTable: true
    },
    {
      title: '进度',
      dataIndex: 'status',
      width:300,
      hideInSearch: true,
      align:'center',
      fixed:'right',
      render(_, record) {
        return <ConfigProvider
          theme={{
            components: {
              Steps: {
                navArrowColor: 'red',
                descriptionMaxWidth: 50
              },
            },
          }}
        >
          <Steps
            progressDot
            direction='horizontal'
            style={{padding:'18px'}}
            type='default'
            current={record.status}
            size='small'
            items={Stepitems}
          />
        </ConfigProvider>
      },
    },
   
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      fixed: 'right',
      render: (_, record) => {
        switch (record.status) {
          case 0:

            return [
              <Button
                key="edit"
                type="primary" size='small'
                onClick={async () => {
                  console.log(record);
                  typeForm.resetFields()
                  setModelTitle('编辑信息');
                  FinalAPI.FinishLineList(record.finalId).then((res: MyResponse.Content) => {
                    if (res.statusCode === 200) {
                      setLineData(res.data)
                    }
                  })

                  workService.EditDetail(record.id).then((res: MyResponse.Content) => {
                    if (res.statusCode === 200) {
                      setIsModalOpen(true);
                      UpdateGY(res.data.lineId, record.finalId);
                      setTimeout(() => {
                        res.data.number = record.number
                        res.data.finaId = record.finalId
                        res.data.id = record.id
                        res.data.workDevices.map((item: any) => {
                          res.data["pro:" + item.processId] = item.deviceId
                        })
                        console.log(res.data);
                        typeForm.setFieldsValue(res.data);
                      }, 500);
                    }
                  })

                }}
              >
                编辑工单
              </Button>,
              <Popconfirm
                key="workdel"
                title="确定要删除此工单吗？"
                onConfirm={() => {
                  const EnablejsonData: WorkInfoTypes.WorkInfoDelInput = {
                    id: record.id,
                  };
                  WorkInfoAPI.Del(EnablejsonData).then((r) => {
                    if (r.statusCode === 200) {
                      message.success(r.statusCode === 200 ? '删除成功' : r.message);
                      batchActionRef.current?.reload();

                    }
                  });
                }}
                onCancel={() => {
                  message.info('已取消删除');
                }}
                okText="确认"
                cancelText="关闭"
              >
                <Button type="primary" danger size='small'>删除</Button>
              </Popconfirm>
              ,
              <Popconfirm
                key="workedit"
                title="确定要下发此工单吗？"
                onConfirm={() => {
                  setSelectItemRow(record)
                  const jsonData = {
                    workId: record.id!
                  }
                  WorkInfoAPI.Publish(jsonData).then((r) => {
                    if (r.statusCode === 200) {
                      message.success(r.statusCode === 200 ? '下发成功' : r.message);


                      batchActionRef.current?.reload();
                    }
                  });
                }}
                onCancel={() => {
                  message.info('已取消操作');
                }}
                okText="确认"
                cancelText="关闭"
              >
                <Button type="primary" size='small'>下发</Button>
              </Popconfirm>]
          case 1:
            return [
              <Popconfirm
                key="workedit"
                title="确定要下发此工单吗？"
                onConfirm={() => {
                  console.log('ssssssssddd', record);

                  setSelectItemRow(record)
                  const jsonData = {
                    workId: record.id!
                  }
                  WorkInfoAPI.Publish(jsonData).then((r) => {
                    if (r.statusCode === 200) {
                      message.success(r.statusCode === 200 ? '下发成功' : r.message);


                      batchActionRef.current?.reload();
                    }
                  });
                }}
                onCancel={() => {
                  message.info('已取消操作');
                }}
                okText="确认"
                cancelText="关闭"
              >
                <Button type="primary" size='small' >继续下发</Button>
              </Popconfirm>,
              <Popconfirm
                key="forcedend"
                title="确定要强制结束此工单吗？"
                onConfirm={() => {
                  WorkInfoAPI.ForcedEnd(record.id).then((r) => {
                    if (r.statusCode === 200) {
                      message.success(r.statusCode === 200 ? '强制结束成功' : r.message);
                      batchActionRef.current?.reload();

                    }
                  });
                }}
                onCancel={() => {
                  message.info('已取消操作');
                }}
                okText="确认"
                cancelText="关闭"
              >
                <Button type="primary" danger size='small'>强制结束</Button>
              </Popconfirm>]
          case 2:
            return [<Popconfirm
              key="forcedend"
              title="确定要强制结束此工单吗？"
              onConfirm={() => {
                WorkInfoAPI.ForcedEnd(record.id).then((r) => {
                  if (r.statusCode === 200) {
                    message.success(r.statusCode === 200 ? '强制结束成功' : r.message);

                  }
                });
              }}
              onCancel={() => {
                message.info('已取消操作');
              }}
              okText="确认"
              cancelText="关闭"
            >
              <Button type="primary" danger ghost>强制结束</Button>
            </Popconfirm>]
          case 3:
            return [<Popconfirm
              key="forcedend"
              title="确定要强制结束此工单吗？"
              onConfirm={() => {
                WorkInfoAPI.ForcedEnd(record.id).then((r) => {
                  if (r.statusCode === 200) {
                    message.success(r.statusCode === 200 ? '强制结束成功' : r.message);

                  }
                });
              }}
              onCancel={() => {
                message.info('已取消操作');
              }}
              okText="确认"
              cancelText="关闭"
            >
              <Button type="primary" danger ghost>强制结束</Button>
            </Popconfirm>]
          case 4:
            return [<Button key="workStatusUpdate" type="primary" ghost onClick={() => {
              setIsModalStatusOpen(true)
              WorkInfoAPI.UpdateStatusList(record.id).then((res: MyResponse.Content) => {
                if (res.statusCode === 200) {
                  setWorkStatusList(res.data)
                }
              })
            }}>状态变更记录</Button>]
          default:
            return []
        }
      }
    },
  ];

  const batchColumns: ProColumns<any>[] = [
    {
      title: '批次编码',
      dataIndex: 'id',
      width: 160,
      align: 'center',
    },
    {
      title: '批次名称',
      dataIndex: 'name',
      ellipsis: true,
      hideInSearch: true,
      align: 'center',
      width: 180
    },
    {
      title: '工单个数',
      dataIndex: 'count',
      ellipsis: true,
      hideInSearch: true,
      align: 'center',
      width: 80
    },
    {
      title: '状态',
      dataIndex: 'status',
      ellipsis: true,
      hideInSearch: true,
      align: 'center',
      valueEnum: {
        0: {
          text: '草稿'
        },
        1: {
          text: '已下发',
        },
        2: {
          text: '已接受',
        },
        3: {
          text: '已启动',
        },
        4: {
          text: '已完成',
        }
      },
      width: 180
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',

      render(dom, entity, index, action, schema) {
        return <>{dayjs(entity.createTime).format('YYYY-MM-DD HH:mm:ss')}</>
      },
      align: 'center',
      valueType: 'dateRange',
      ellipsis: true,
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      fixed:'right',
      render: (_, record) => {
        switch (record.status) {
          case 0:

            return (
              [
                <Button
                  key="edit"
                  type="primary" 
                  size='small'
                  onClick={async () => {
                    // setIsModalOpen(true);
                    // setModelTitle('编辑信息');
                    // const copyFormData = JSON.parse(JSON.stringify(record));
                    // //  copyFormData.repairDate =dayjs(record.repairDate)
                    // console.log('record', record);

                    // typeForm.setFieldsValue(copyFormData);
                    typeForm.resetFields();
                    typeForm.setFieldValue("number", "1")
                    setIsModalOpen(true);
                    setSelectBatchItemRow(record);
                    setitemparams({ batchId: record.id })
                    setExpandedRowKeys((prevKeys: any) => {
                      return [record.id]; // 假设record.id是唯一key
                    });
                    setModelTitle('新增信息');
                  }}
                >
                  新增工单
                </Button>,
                record.count > 0 ?
                  <Popconfirm
                    key="workedit"
                    title="确定要下发全部工单吗？"
                    onConfirm={() => {
                      setSelectItemRow(record)
                      var jsonData: any = {
                        batchId: record.id
                      }
                      workService.publishs(jsonData).then((res: MyResponse.Content) => {
                        if (res.statusCode === 200) {

                          batchActionRef.current?.reload()
                        }
                      })
                    }}
                    onCancel={() => {
                      message.info('已取消操作');
                    }}
                    okText="确认"
                    cancelText="关闭"
                  >
                    <Button type="primary" 
                  size='small'>批次下发</Button>
                  </Popconfirm> : ""
                ,
                <Popconfirm
                  key="workdel"
                  title="确定要删除此工单吗？"
                  onConfirm={() => {
                    const EnablejsonData: WorkInfoTypes.WorkInfoDelInput = {
                      id: record.id,
                    };
                    WorkInfoAPI.DelBatch(EnablejsonData).then((r) => {
                      if (r.statusCode === 200) {
                        message.success(r.statusCode === 200 ? '删除成功' : r.message);
                        batchActionRef.current?.reload();
                      }
                    });
                  }}
                  onCancel={() => {
                    message.info('已取消删除');
                  }}
                  okText="确认"
                  cancelText="关闭"
                >
                  <Button type="primary" 
                  size='small' danger >删除</Button>
                </Popconfirm>,
              ]
            )
          case 1:
            return (
              [
                <Button
                  key="edit"
                  type="primary" 
                  size='small'
                  onClick={async () => {
                    // setIsModalOpen(true);
                    // setModelTitle('编辑信息');
                    // const copyFormData = JSON.parse(JSON.stringify(record));
                    // //  copyFormData.repairDate =dayjs(record.repairDate)
                    // console.log('record', record);

                    // typeForm.setFieldsValue(copyFormData);
                    typeForm.resetFields();
                    setIsModalOpen(true);
                    setSelectBatchItemRow(record);
                    setModelTitle('新增信息');
                  }}
                >
                  新增工单
                </Button>,

                <Popconfirm
                  key="workedit"
                  title="确定要下发全部工单吗？"
                  onConfirm={() => {
                    setSelectItemRow(record)
                    var jsonData: any = {
                      batchId: record.id
                    }
                    workService.publishs(jsonData).then((res: MyResponse.Content) => {
                      if (res.statusCode === 200) {

                        batchActionRef.current?.reload()
                      }
                    })
                  }}
                  onCancel={() => {
                    message.info('已取消操作');
                  }}
                  okText="确认"
                  cancelText="关闭"
                >
                  <Button type="primary" 
                  size='small'>继续下发</Button>
                </Popconfirm>
                ,
                <Popconfirm
                  key="workdel"
                  title="确定要删除此批次计划吗？"
                  onConfirm={() => {
                    const EnablejsonData: WorkInfoTypes.WorkInfoDelInput = {
                      id: record.id,
                    };
                    WorkInfoAPI.DelBatch(EnablejsonData).then((r) => {
                      if (r.statusCode === 200) {
                        message.success(r.statusCode === 200 ? '删除成功' : r.message);
                        batchActionRef.current?.reload();
                      }
                    });
                  }}
                  onCancel={() => {
                    message.info('已取消删除');
                  }}
                  okText="确认"
                  cancelText="关闭"
                >
                  <Button type="primary" danger size='small'>删除</Button>
                </Popconfirm>,
              ]
            )
          case 2:
            return []
          default:
            return []
        }
      }
    }
  ]
  //初始化
  useEffect(() => {
    FinalAPI.SelectList().then((res: MyResponse.Content) => {
      if (res.statusCode === 200) {
        setFinalData(res.data)
      }
    })
    workplanApi.List({}).then((res: MyResponse.Content) => {
      if (res.statusCode === 200) {
        setfinalPlan(res.data)
      }
    });
    // ProductLineAPI.f().then((res: MyResponse.Content) => {
    //   if (res.statusCode === 200) {
    //     setLineData(res.data)
    //   }
    // })
  }, [])
  const UpdateGY = (lineId: string, finalId: string) => {
    productlineInfoStepsAPI.List({ lineId: lineId, finalId: finalId }).then((res: MyResponse.Content) => {
      if (res.statusCode === 200) {
        setLineProcessList(res.data);
      }
    })
  }
  // const GetItemData=async (jsonData:any)=>{
  //   setItemData([])
  //   SetItemLoading(true)
  //   const response = await WorkInfoAPI.List(jsonData);
  //      if (response.statusCode === 200) {
  //         setItemData( response.data)
  //       } else {
  //         setItemData([])
  //       }
  //       SetItemLoading(false)
  // }

  /*
  *
  *提交
  *
  */
  const OnBatchSubmit = async (values: any) => {
    if (values.id) {
      const response = await WorkInfoAPI.UpdateBatch(values);
      if (response.statusCode === 200) {
        message.success('修改成功');
        batchActionRef.current?.reload();
        setIsBatchModalOpen(false);
      } else {
        message.error(JSON.stringify(response.errors) || '修改失败');
      }
    } else {
      const response = await WorkInfoAPI.AddBatch(values);
      console.log('response', response);
      if (response.statusCode === 200) {
        message.success('添加成功');
        batchActionRef.current?.reload();

        setIsBatchModalOpen(false);
      } else {
        message.error(JSON.stringify(response.errors) || '添加失败');
      }
    }
  }

  /*
   *表单提交
   */
  const OnSubmit = async (values: any) => {

    values.batchId = selectBatchItemRow?.id
   

    const WorkDeviceAddInputs: any[] = []

    Object.keys(values).forEach((item: string) => {
      if (item.includes('pro')) {
        console.log(item);
        const WorkDeviceAddInput: any = {
          processId: item.split(':')[1],
          deviceId: values[item]
        }
        WorkDeviceAddInputs.push(WorkDeviceAddInput)
      }
    })
    values.workDevices = WorkDeviceAddInputs;
    console.log(values);
    if (values.id) {
      const response = await WorkInfoAPI.Update(values);
      if (response.statusCode === 200) {
        message.success('修改成功');

        setIsModalOpen(false);
      } else {
        message.error(JSON.stringify(response.errors) || '修改失败');
      }
    } else {
      const response = await WorkInfoAPI.Add(values);
      console.log('response', response);
      if (response.statusCode === 200) {
        message.success('添加成功');
        batchActionRef.current?.reload();

        setIsModalOpen(false);
      } else {
        message.error(JSON.stringify(response.errors) || '添加失败');
      }
    }
  };
  const [expandedRowKeys, setExpandedRowKeys] = useState<any>([]);
  const expandedRowRender = (data: WorkInfoTypes.Info) => {
    console.log('data', data.workList);
    var res = data.workList;
    // setitemparams({batchId:data.id})
    return (
      <ProTable<WorkInfoTypes.WorkInfoOutput>
        search={false}
        columns={columns}
        actionRef={actionRef}
        cardBordered
        style={{
          background: "burlywood",
        }}
        rowClassName={styles.rowHeight}
        loading={itemLoading}
        params={itemparams}
        dataSource={res}
        // request={async (params = {
        //   }) => {
        //    console.log('sssss',params);

        //   const jsonData: WorkInfoTypes.Page = {
        //     pageIndex: params.current || 1,
        //     pageSize: params.pageSize || 10,
        //     name: params.name || '',
        //     code: params.code,
        //     batchId:params.batchId
        //   };
        //   const response = await WorkInfoAPI.List(jsonData);
        //   if (response.statusCode === 200) {
        //     return {
        //       data: response.data,
        //       success: true,
        //       total: response.data.total,
        //     };
        //   } else {
        //     return {
        //       data: [],
        //       success: false,
        //       total: 0,
        //     };
        //   }
        // }}
        rowKey="id"
        pagination={false}
        // {
        //   pageSize: 10,
        //   style:{margin: "auto",width:"300px",height:"50px",padding:'20px'}
        // }
        dateFormatter="string"
        headerTitle="工单列表"
        toolBarRender={false
          //   () => [
          //   <Button
          //     key="button"
          //     type="primary"
          //     onClick={() => {
          //       typeForm.resetFields();
          //       setIsModalOpen(true);
          //       setModelTitle('新增信息');
          //     }}
          //   >
          //     新建工单
          //   </Button>,
          // ]
        }
      />
    );
  };
  return (
    <>
      <ProTable<WorkInfoTypes.WorkInfoOutput>
        key="myBatchTable"
        cardBordered
        bordered
        scroll={{ x: true }}
        rowClassName={(record: any, index: number, indent: number) => {
          if (index % 2 === 0) {
            return ''; // 偶数行的类名
          } else {
            return 'even-row-background'; // 奇数行的类名
          }
        }}
        expandable={{
          expandedRowRender, expandedRowKeys: expandedRowKeys, onExpand: (expanded: boolean, record: WorkInfoTypes.WorkInfoOutput) => {
            //  if (expanded) {
            //   const jsonData = {
            //     batchId:record.id
            //   };
            //     GetItemData(jsonData)
            //     setitemparams({batchId:record.id})
            //  }
            // 如果当前正在展开，且已有其他嵌套数据展开，则收起它们
            setExpandedRowKeys((prevKeys: any) => {
              if (expanded) {
                return [record.id]; // 假设record.id是唯一key
              }
              return []; // 如果不展开，清空数组
            });
          }
        }}

        columns={batchColumns}
        actionRef={batchActionRef}

        request={async (params = {}) => {
          const jsonData: WorkInfoTypes.Page = {
            pageIndex: params.current || 1,
            pageSize: params.pageSize || 10,
            id: params.id,
            endTime: params.createTime ? dayjs(params.createTime[1]) : null,
            startTime: params.createTime ? dayjs(params.createTime[0]) : null
          };
          const response = await WorkInfoAPI.WorkBatchPagedList(jsonData);
          if (response.statusCode === 200) {

            return {
              data: response.data.items,
              success: true,
              total: response.data.total,
            };
          } else {
            return {
              data: [],
              success: false,
              total: 0,
            };
          }
        }}
        rowKey="id"
        pagination={{
          pageSize: 10,
          showTitle: true,
          showSizeChanger: false
        }}
        dateFormatter="string"
        headerTitle="批次计划列表"
        toolBarRender={
          () => [
            <Button
              key="button"
              type="primary"
              onClick={() => {
                batchForm.resetFields();
                batchForm.setFieldValue("name", dayjs().format("YYYYMMDDHHmmss") + "批次任务")
                setIsBatchModalOpen(true);
                // setModelTitle('新增信息');
              }}
            >
              新建批次
            </Button>,
          ]
        }
      />
      <Modal
        maskClosable={false}
        width={1200}
        title={<Tag color="#cd201f">{modelTitle}</Tag>}
        open={isModalOpen}
        onCancel={() => {
          setIsModalOpen(false);
        }}
        footer={[
          <Button
            key="back"
            onClick={() => {
              setIsModalOpen(false);
            }}
          >
            返回
          </Button>,
          <Button key="submit" form="workInfoForm" type="primary" htmlType="submit">
            提交
          </Button>,
        ]}
      >
        <ProForm
          form={typeForm}
          name="basic"
          id="workInfoForm"
          submitter={{
            render: (_, dom) => <FooterToolbar>{dom}</FooterToolbar>,
          }}
          onFinish={OnSubmit}
          autoComplete="off"
        >
          <ProFormText
            width="md" label="id" name="id" hidden>
          </ProFormText>

          <ProFormSelect
            colProps={{ xl: 8, md: 12 }}
            label="生产计划"
            name="planId"
            options={finalPlan}
            fieldProps={{
              fieldNames: {
                label: "name",
                value: "id"
              }
            }}
            rules={[{ required: true, message: '此项为必填项!' }]}
            onChange={(v: string) => {
              // const finalId = finalPlan.find(x => x.id == v)?.finalId;
              // const name = finalData.find(x => x.key == finalId)?.value;
              // const quantity = finalPlan.find(x => x.id == v)?.quantity;
              typeForm.setFieldValue('lineId', '')
              workplanApi.Detail(v).then((res: MyResponse.Content) => {
                if (res.statusCode === 200) {
                  setSelectFinal({ name: res.data.finalName, finalId: res.data.finalId, quantity: res.data.quantity })
                  typeForm.setFieldValue('finalName', res.data.finalName)
                  typeForm.setFieldValue('quantity',  res.data.quantity)
                  setLineProcessList([])
                  FinalAPI.FinishLineList(res.data.finalId).then((res: MyResponse.Content) => {
                    if (res.statusCode === 200) {
                      setLineData(res.data)
                    }
                  })
                }
              })

            }}
          >

          </ProFormSelect>
          <Row gutter={18}>
            <Col xl={6} md={12} sm={24}>
            <Form.Item name='finalId' hidden
                label="成品"  >
                <Input readOnly disabled value={selectfinal?.id}></Input>
              </Form.Item>
              <Form.Item name='finalName'
                label="成品"  >
                <Input readOnly disabled value={selectfinal?.name}></Input>
              </Form.Item>
            </Col>
            <Col xl={6} md={12} sm={24}>
              <Form.Item label="数量" name='quantity'  >
                <Input readOnly disabled value={selectfinal?.quantity}></Input>
              </Form.Item>
            </Col>
          </Row>
          <Form.Item label="产线" name="lineId" rules={[{ required: true, message: '此项为必填项!' }]}>
            <Select onChange={(e) => {
              console.log('selectfinal', selectfinal);

              UpdateGY(e, selectfinal?.finalId)
              typeForm.setFieldValue("deviceId", "")
              var jsonData: ProductlineTypes.ProductionlineQuery = {
                lineId: e
              }
              ProductLineAPI.devicelist(jsonData).then((res: MyResponse.Content) => {
                if (res.statusCode === 200) {
                  setLineDeviceData(res.data)
                }
              })
            }}>
              {lineData.map((item, index) => {
                return <Select.Option value={item.key} key={item.key}>
                  <span>{item.value}</span>
                </Select.Option>
              })}
            </Select>
          </Form.Item>

          <Card title={'产线工序路线'}>
            <div className={styles.gongyi_tag}>
              <Flex wrap gap="small">
                {lineProcessList.map((item, index) => (
                  <div className={styles.gongyi_tag_box} key={index} >
                    <div

                      className={styles.gongyi_tag_item}>
                      <Space size="middle">
                        <div color="#2db7f5" style={{ fontSize: '22px' }}> {index + 1}-{item.processName}</div>
                      </Space>
                    </div>
                    <Card title='选择设备' size="small" bordered={false} style={{ height: '200px', overflowY: 'auto', overflowX: 'hidden' }} className={styles.gongyi_tag_device}>

                      <Form.Item name={'pro:' + item.id}  rules={[{ required: item.devicesInfo.length > 0, message: '此项为必选项!' }]} >
                        <CheckCard.Group  >
                          {
                            item.devicesInfo.length > 0 ?
                              <Space title='设备' direction="vertical">
                                {item.devicesInfo.map((devicesItem: any, devicesIndex: number) => (
                                  <CheckCard onClick={(v) => {
                                  }} size='small' title={devicesItem.name} value={devicesItem.id} />
                                ))}
                              </Space>
                              : <Empty />
                          }
                        </CheckCard.Group>
                      </Form.Item>

                    </Card>
                    {/* <Card title='备注' size="small" style={{ height: '150px' }}>
                          <Input aria-label='备注' />
                        </Card> */}

                    <Divider />
                  </div>

                ))}
              </Flex>
            </div>

          </Card>

          <Form.Item label="下料(锅)" name="number" rules={[{ required: true, message: '此项为必填项!' }]} >
            <Input type='number' min={1} />
          </Form.Item>
        </ProForm>
      </Modal>
      <Modal
        maskClosable={false}
        key="workStatusList"
        width={800}
        title={<Tag color="#cd201f">状态变更记录</Tag>}
        open={isModalStatusOpen}
        footer={false}
        onCancel={() => {
          setIsModalStatusOpen(false);
        }}
      >

        <List
          size="large"
          dataSource={workStatusList}
          renderItem={(item: any, index) => (
            <div>
              <List.Item>
                <Space>
                  {dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss')}
                  {item.statusName}
                  {item.remark}
                </Space>
              </List.Item>
            </div>
          )}
        >

        </List>

      </Modal>

      <Modal maskClosable={false}
        key="01"
        width={800}
        title={<Tag color="#cd201f">工单下发-选择区域</Tag>}
        open={isModalPublishOpen}
        onCancel={() => {
          setIsModalPublishOpen(false);
        }}
        footer={[
          <Button
            key="back"
            onClick={() => {
              setIsModalPublishOpen(false);
            }}
          >
            返回
          </Button>,
          <Button key="submit" form="deviceqy" type="primary" htmlType='submit' >
            提交
          </Button>,
        ]}
      >
        <Card>
          <Form id='deviceqy' onFinish={(v) => {
            console.log(v);
            if (v.group) {

              const jsonData = {
                workId: selectItemRow?.id!,
                deviceId: v.group
              }
              WorkInfoAPI.Publish(jsonData).then((r) => {
                if (r.statusCode === 200) {
                  message.success(r.statusCode === 200 ? '下发成功' : r.message);
                  batchActionRef.current?.reload();

                  setIsModalPublishOpen(false);
                }
              });
            } else {
              const jsonData = {
                workId: selectItemRow?.id!
              }
              WorkInfoAPI.Publish(jsonData).then((r) => {
                if (r.statusCode === 200) {
                  message.success(r.statusCode === 200 ? '下发成功' : r.message);
                  batchActionRef.current?.reload();

                  //  GetItemData({batchId:selectBatchItemRow?.id});
                  setIsModalPublishOpen(false);
                }
              });
            }
          }
          }>
            <Form.Item name="group" >
              <Radio.Group name="radiogroup" defaultValue="">
                <Space direction="vertical">
                  <Radio value="">自动(系统根据设备使用情况自动分配)</Radio>
                  {lineDeviceData.map((item, index) => (
                    <Radio key={index} value={item.deviceId}>{item.deviceName}</Radio>
                  ))}
                </Space>
              </Radio.Group>
            </Form.Item>
          </Form>
        </Card>
      </Modal>

      <Modal maskClosable={false}
        destroyOnClose
        width={800}
        title="批次计划"
        open={isBatchModalOpen}
        onCancel={() => {
          setIsBatchModalOpen(false);
        }}
        footer={[
          <Button
            key="back"
            onClick={() => {
              setIsBatchModalOpen(false);
            }}
          >
            返回
          </Button>,
          <Button key="submit" form="batchForm" type="primary" htmlType="submit">
            提交
          </Button>,
        ]}
      >
        <Form
          form={batchForm}
          name="basic"
          id="batchForm"

          onFinish={OnBatchSubmit}
          autoComplete="off"
        >
          <Form.Item label="id" name="id" hidden>
            <Input />
          </Form.Item>

          <Form.Item
            label="批次名称"
            name="name"
            rules={[{ required: true, message: '此项为必填项!' }]}
          >
            <Input defaultValue={dayjs().format("YYYYMMDDHHmmss") + "批次任务"} />
          </Form.Item>
        </Form>
      </Modal>
    </>
  );
};
