FlutterArtist Debug Filter Model Inspector

FilterModel
FilterCriteria

Debug Filter Model Inspector là một công cụ cho phép bạn xem xét trạng thái và dữ liệu của một FilterModel. Công cụ này được mở thông qua một button trên FilterControlBar hoặc thông qua code.

Mở Debug Filter Model Inspector thông qua code:

FilterModel filterModel = ...;

filterModel.showDebugFilterModelInspector();

lutterArtist Debug Filter Criteria Inspector
FlutterArtist Debug Form Model Inspector

1. FilterModel

Trước hết hãy xem một lớp FilterModel đơn giản với hai tiêu chí được định nghĩa.

product77a_filter_model.dart (*)

...
@override
FilterModelStructure defineFilterModelStructure() {
  return FilterModelStructure(
    criteriaStructure: FilterCriteriaStructure(
      simpleCriterionDefs: [
        SimpleFilterCriterionDef<double>(criterionBaseName: "price"),
      ],
      multiOptCriterionDefs: [
        // Multi Options Single Selection Criterion.
        MultiOptFilterCriterionDef<CategoryInfo>.singleSelection(
          criterionBaseName: "category",
          fieldName: 'categoryId',
          toFieldValue: (CategoryInfo? rawValue) {
            return SimpleVal.ofInt(rawValue?.id);
          },
        ),
      ],
    ),
    conditionStructure: FilterConditionStructure(
      connector: FilterConnector.and,
      conditionDefs: [
        FilterConditionDef.simple(
          tildeCriterionName: "category~",
          operator: FilterOperator. equalTo,
        ),
        FilterConditionDef.simple(
          tildeCriterionName: "price~min",
          operator: FilterOperator.equalTo,
        ),
        FilterConditionDef.simple(
          tildeCriterionName: "price~max",
          operator: FilterOperator.equalTo,
        ),
      ],
    ),
  );
}

Criteria

Trên Debug Filter Model Inspector bạn có thể nhìn thấy định nghĩa kiểu dữ liệu của các tiêu chí này.

tildeCriterionName

Trong FlutterArtist, tildeCriterionName là một cái tên đặc biệt đại diện cho một điều kiện lọc, một tiêu chí có thể có một hoặc nhiều tildeCriterionName(s). Mỗi tildeCriterionName tương ứng 1-1 với một trường đầu vào (Input-Field) trên FilterPanel.

tildeCriterionName sẽ bao gồm bên trong nó một ký tự "ngã" (~) chẳng hạn thế này:

category~
price~min
price~max

tildeCriterionName = criterionBaseName + suffix

Trên giao diện (FilterPanel) người dùng có thể nhập hoặc lựa chọn giá trị cho các thành phần giao diện tương ứng với các tildeCriterionName(s).

Tilde-Based JSON là một cấu trúc điều kiện ghi lại chính xác những gì người dùng nhìn thấy trên giao diện. Mỗi TildeFilterCriterion tương ứng với một trường đầu vào trên giao diện.
Criteria-Based JSON là một cấu trúc điều kiện đơn giản hoá của Tilde-Based JSON với các tildeCriterionName(s) được thay bởi các criterionName(s) và các giá trị logic của chúng.

Tilde-Based JSON

{
    "connector": "AND",
    "conditions": [
        {
            "tildeCriterionName": "category~",
            "value": "CategoryInfo(1, Electric Cars)",
            "operator": "equalTo"
        },
        {
            "tildeCriterionName": "price~min",
            "value": 1000,
            "operator": "greaterThan"
        },
        {
            "tildeCriterionName": "price~max",
            "value": 20000,
            "operator": "lessThan"
        }
    ]
}

Criteria-Based JSON

{
    "connector": "AND",
    "conditions": [
        {
            "criterionName": "category",
            "value": "CategoryInfo(1, Electric Cars)",
            "operator": "equalTo"
        },
        {
            "criterionName": "price",
            "value": 1000,
            "operator": "greaterThan"
        },
        {
            "criterionName": "price",
            "value": 20000,
            "operator": "lessThan"
        }
    ]
}

Ở mức thứ ba, chúng ta có Field-Based JSON, đây là quá trình tuần tự hoá cuối cùng. Đây là lúc mà phương thức toFieldValue() được gọi để chuyển đổi một kiểu dữ liệu phức tạp thành kiểu dữ liệu đơn giản (int, double, String, bool). Field-Based JSON chính là sản phẩm để gửi tới máy chủ cho việc truy vấn và lọc dữ liệu.

Field-Based JSON

{
    "connector": "AND",
    "conditions": [
        {
            "field": "categoryId",
            "operator": "equalTo",
            "value": 1
        },
        {
            "field": "price",
            "operator": "greaterThan",
            "value": 1000
        },
        {
            "field": "price",
            "operator": "lessThan",
            "value": 20000
        }
    ]
}

Tildes

Current

Tab này cho phép bạn xem giá trị hiện thời của tất cả các tildeCriterionName(s). Các giá trị này sẽ được truyền vào phương thức FilterModel.createNewFilterCriteria() để tạo mới một đối tượng FilterCriteria.

@override
Song02aFilterCriteria createNewFilterCriteria({
  required Map<String, dynamic> criteriaMap,
}) {
  return Song02aFilterCriteria(
    album: criteriaMap["album~"],
    searchText: criteriaMap["searchText~"],
  );
}

{ } Tilde-Based JSON

Tab này hiển thị một JSON - kết quả của việc kết hợp của cấu trúc điều kiện và dữ liệu hiện thời của các TildeCriterion(s).

{ } Criteria-Based JSON

Tab này hiển thị một JSON - kết quả của việc kết hợp giữa cấu trúc điều kiện, các criterionBaseName(s) và dữ liệu hiện thời của các TildeCriterion(s).

{ } Field-Based JSON

Tab này hiển thị một JSON - kết quả của việc kết hợp giữa cấu trúc điều kiện và các field(s) với các dữ liệu hiện thời của chúng.

Field-Based JSON là một JSON hoàn chỉnh mà bạn có thể sử dụng nó để gửi tới máy chủ cho việc lọc dữ liệu. Chú ý: Trước khi thực hiện việc truy vấn dữ liệu một FilterCriterion được tạo ra tự động từ FilterModel, mà bạn có thể thu được JSON này từ nó.

Block.performQuery()

@override
Future<ApiResult<PageData<ProductInfo>?>> performQuery({
  required Object? parentBlockCurrentItem,
  required Product77aFilterCriteria filterCriteria,
  required SortableCriteria sortableCriteria,
  required Pageable pageable,
}) async {
  return await productRestProvider.queryWithFieldBasedJSON(
    pageable: pageable,
    fieldBasedJSON: filterCriteria.fieldBasedJSON,
  );
}

toFieldValue()

Chú ý: Kiểu dữ liệu của các trường (Field) là kiểu đơn giản (String, int, double, bool), vì vậy trong một vài trường hợp bạn cần cung cấp hàm chuyển đổi toFieldValue() giống như trường hợp dưới đây:

defineFilterModelStructure()

@override
FilterModelStructure defineFilterModelStructure() {
  return FilterModelStructure(
    criteriaStructure: FilterCriteriaStructure(
      simpleCriterionDefs: [
        SimpleFilterCriterionDef<double>(criterionBaseName: "price"),
      ],
      multiOptCriterionDefs: [
        // Multi Options Single Selection Criterion.
        MultiOptFilterCriterionDef<CategoryInfo>.singleSelection(
          criterionBaseName: "category",
          fieldName: 'categoryId',
          toFieldValue: (CategoryInfo? rawValue) { // <---------
            return SimpleVal.ofInt(rawValue?.id);
          },
        ),
      ],
    ),
    ...
  );
}

2. FilterCriteria

Để xem thông tin Debug cho FilterCriteria bạn có thể sử dụng Debug Filter Criteria Inspector:
lutterArtist Debug Filter Criteria Inspector

No ADS

FlutterArtist Debug Filter Model Inspector

1. FilterModel

2. FilterCriteria

FlutterArtist

FlutterArtist

Newest Articles