Our flexible Kanban board for managing tasks with drag drop


Post by yingtao »

I use 'bodyItems‘ to return task content.In bodyItems I use web components.The wewb womponents has arguments. When I drag the task,the arguments is disappear.


Post by mats »

Can you please share some code indicating where the problem is for you?


Post by yingtao »


export const renderBodyItem = (
  tableConfig: TableConfig,
  fieldsConfig: FieldsConfig,
  viewController: ViewController,
  viewConfig: GalleryViewConfig
) => {
  return {
    item_id: {
      type: 'template',
      field: '2200000137798571',
      template: (props: any) => {
        const { taskRecord } = props;

    return `<display-task taskRecord ={taskRecord } fieldsConfig={fieldsConfig} viewConfig={viewConfig} item={item}/>`;// web compoent
  },
},
  };
};

const galleryConfig: BryntumTaskBoardProps = {
  ...baseConfig,
  bodyItems: renderBodyItem(tableConfig, fieldsConfig, viewController, viewConfig),
  project: {
    tasks: handleSourceList(props),
  },
};

  return (
    <div className={Styles['gallery-view-container']}>
      <BryntumTaskBoard
        ref={taskBoardRef}
        {...galleryConfig}
        onTaskClick={(props: any) => {
          console.log(props, 'click');
        }}
      />
    </div>
  );

task content (React componet convert webcomponet):

export const DispalyTaskRender = (props: any) => {
  console.log(props, 'props')                // when I drag, props is {}.
  const { taskRecord , fieldsConfig, viewConfig} = props; 
  console.log(taskRecord , fieldsConfig, viewConfig)    
...... return ( <div>...</div> ); };

Post by marcio »

Hey Ying,

Could you please share a more detailed example, that we can run and debug?

With only pieces of code, it's difficult to reproduce the behavior you described, and that way we can't help you properly.

Best regards,
Márcio


Post by yingtao »

Thank you, I find the problem.


Post Reply