refactor: table column field model

packages/core/client/src/flow/flowSetting/DateTimeFormat.tsx

@@ -158,7 +158,7 @@ export const DateTimeFormat = {
     ctx.model.setComponentProps({ ...params });
   },
   defaultParams: (ctx) => {
-    const { showTime, dateFormat, timeFormat, picker } = ctx.model.field.componentProps;
+    const { showTime, dateFormat, timeFormat, picker } = ctx.model.field.componentProps || {};
     return {
       picker: picker || 'date',
       dateFormat: dateFormat || 'YYYY-MM-DD',

packages/core/client/src/flow/models/table/fields/AssociationSelectFieldModel/index.tsx

@@ -107,7 +107,7 @@ const AssociationSelectReadPretty = (props) => {
   return <span style={ellipsis ? null : { whiteSpace: 'normal' }}>{items}</span>;
 };
 
-export class AssociationSelectReadPrettyFieldModel extends TableColumnModel {
+export class AssociationSelectColumnFieldModel extends TableColumnModel {
   public static readonly supportedFieldInterfaces = [
     'm2m',
     'm2o',
@@ -156,7 +156,7 @@ export class AssociationSelectReadPrettyFieldModel extends TableColumnModel {
 // });
 
 //标题字段设置 todo 复用
-AssociationSelectReadPrettyFieldModel.registerFlow({
+AssociationSelectColumnFieldModel.registerFlow({
   key: 'fieldNames',
   auto: true,
   sort: 200,

packages/core/client/src/flow/models/table/fields/CheckboxFieldMode.tsx

@@ -24,7 +24,7 @@ const ReadPretty: FC<CheckboxReadPrettyProps> = (props) => {
   return props.showUnchecked ? <CloseOutlined style={{ color: '#ff4d4f' }} /> : <Checkbox disabled />;
 };
 
-export class CheckboxFieldMode extends TableColumnModel {
+export class CheckboxColumnFieldModel extends TableColumnModel {
   public static readonly supportedFieldInterfaces = ['checkbox'];
 
   render() {

packages/core/client/src/flow/models/table/fields/DateTimeFieldModel.tsx

@@ -29,7 +29,7 @@ const ReadPretty = (props: any) => {
   };
   return <div className={cls(prefixCls, props.className)}>{getLabels()}</div>;
 };
-export class DateTimeReadPrettyFieldModel extends TableColumnModel {
+export class DateTimeColumnFieldModel extends TableColumnModel {
   public static readonly supportedFieldInterfaces = [
     'date',
     'datetimeNoTz',
@@ -50,7 +50,7 @@ export class DateTimeReadPrettyFieldModel extends TableColumnModel {
   }
 }
 
-DateTimeReadPrettyFieldModel.registerFlow({
+DateTimeColumnFieldModel.registerFlow({
   key: 'key3',
   auto: true,
   sort: 1000,

packages/core/client/src/flow/models/table/fields/NumberFieldModel.tsx

@@ -14,7 +14,7 @@ import { useTranslation } from 'react-i18next';
 import { TableColumnModel } from '../../TableColumnModel';
 import { InputNumberReadPretty } from '../components/InputNumberReadPretty';
 
-export class NumberReadPrettyFieldModel extends TableColumnModel {
+export class NumberColumnFieldModel extends TableColumnModel {
   public static readonly supportedFieldInterfaces = ['number', 'integer'];
   render() {
     return (value, record, index) => {
@@ -45,7 +45,7 @@ const UnitConversion = () => {
   );
 };
 
-NumberReadPrettyFieldModel.registerFlow({
+NumberColumnFieldModel.registerFlow({
   key: 'format',
   sort: 100,
   title: 'Specific properties',
@@ -136,7 +136,7 @@ NumberReadPrettyFieldModel.registerFlow({
       },
       defaultParams: (ctx) => {
         const { formatStyle, unitConversion, unitConversionType, separator, step, addonBefore, addonAfter } =
-          ctx.model.getProps().componentProps;
+          ctx.model.getComponentProps();
         const { step: prescition } = ctx.model.field?.getComponentProps() || {};
         return {
           formatStyle: formatStyle || 'normal',

packages/core/client/src/flow/models/table/fields/PercentFieldModel.tsx

@@ -21,7 +21,7 @@ const toValue = (value: any, callback: (v: number) => number) => {
   }
   return null;
 };
-export class PercentReadPrettyFieldModel extends TableColumnModel {
+export class PercentColumnFieldModel extends TableColumnModel {
   public static readonly supportedFieldInterfaces = ['percent'];
   render() {
     return (value, record, index) => {

packages/core/client/src/flow/models/table/fields/RadioGroupFieldModel.tsx

@@ -1,46 +0,0 @@
-/**
- * This file is part of the NocoBase (R) project.
- * Copyright (c) 2020-2024 NocoBase Co., Ltd.
- * Authors: NocoBase Team.
- *
- * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
- * For more information, please refer to: https://www.nocobase.com/agreement.
- */
-
-import React, { FC } from 'react';
-import { Tag } from 'antd';
-import { TableColumnModel } from '../../TableColumnModel';
-
-const ReadPretty: FC<any> = (props) => {
-  const { value, dataSource } = props;
-
-  if (!value) {
-    return;
-  }
-  return (
-    <div>
-      {dataSource
-        .filter((option) => option.value == value)
-        .map((option, key) => (
-          <Tag key={key} color={option.color} icon={option.icon}>
-            {option.label}
-          </Tag>
-        ))}
-    </div>
-  );
-};
-
-export class RadioGroupReadPrettyFieldModel extends TableColumnModel {
-  public static readonly supportedFieldInterfaces = ['radioGroup'];
-
-  render() {
-    return (value, record, index) => {
-      return (
-        <>
-          {<ReadPretty value={value} {...this.getComponentProps()} />}
-          {this.renderQuickEditButton(record)}
-        </>
-      );
-    };
-  }
-}

packages/core/client/src/flow/models/table/fields/SelectFieldModel.tsx

@@ -18,8 +18,8 @@ const fieldNames = {
   color: 'color',
   icon: 'icon',
 };
-export class SelectReadPrettyFieldModel extends TableColumnModel {
+export class SelectColumnFieldModel extends TableColumnModel {
-  public static readonly supportedFieldInterfaces = ['select', 'multipleSelect'];
+  public static readonly supportedFieldInterfaces = ['select', 'multipleSelect', 'radioGroup', 'checkboxGroup'];
 
   render() {
     return (value, record, index) => {

packages/core/client/src/flow/models/table/fields/index.tsx

@@ -12,5 +12,5 @@ export * from './NumberFieldModel';
 export * from './PercentFieldModel';
 export * from './AssociationSelectFieldModel';
 export * from './CheckboxFieldMode';
-export * from './RadioGroupFieldModel';
+// export * from './RadioGroupFieldModel';
 export * from './DateTimeFieldModel';