GroupItem.tsx

import React, { useEffect } from 'react';
import { Form } from 'antd';
import WorkItem from '@/pages/Ops/Staff/Workforce/schedule/WorkItem';

type GroupItemProps = {
  scheduleNames: string;
  workData: any[]
}

const GroupItem: React.FC<GroupItemProps> = (props) => {
  const [form] = Form.useForm();
  const {scheduleNames, workData} = props;

  useEffect(() => {
    form.setFieldsValue(workData)
  }, [workData])


  const hasContent = workData?.some(item => item?.mgVos?.length > 0)

  return hasContent ? (
    <div style={{marginTop: 15}}>
      {scheduleNames || ''}
      <Form form={form}>
        { workData?.map((item, index) => (
          <WorkItem type="info" key={index} identify={index}/>
        ))}
      </Form>
    </div>
  ): <div/>;
};

export default GroupItem;