QML – Сортировка TableModel с использованием Python backend

В проекте Qt 6.8, использующем QML для фронтенда и Python для бэкенда, я пытаюсь реализовать систему фильтров для TableModel/ListModel. Я прочитал документацию по QSortFilterProxyModel, но не нашел работающий пример на Python.

Как я мог бы модифицировать упрощенный код ниже, чтобы интегрировать метод фильтрации модели через бэкенд моего приложения и связать его с панелью поиска?

Вот мой текущий код:

main.py:

import sys
from pathlib import Path
from PySide6.QtCore import QtMsgType, qInstallMessageHandler
from PySide6.QtGui import QGuiApplication
from PySide6.QtQml import QQmlApplicationEngine

def handle_qml_message(msg_type, context, message):
    print(f"QML: {message}")

if __name__ == "__main__":
    qInstallMessageHandler(handle_qml_message)

    app = QGuiApplication(sys.argv)
    engine = QQmlApplicationEngine()

    qml_file = Path(__file__).resolve().parent / "main.qml"
    engine.load(qml_file)
    if not engine.rootObjects():
        sys.exit(-1)
    sys.exit(app.exec())

main.qml:

import QtQuick
import QtQuick.Window
import Qt.labs.qmlmodels
import QtQuick.Controls

Window {
    width: 640
    height: 480
    visible: true

    TextField {
        id: textField
        anchors {
            top: parent.top
            left: parent.left
        }
        width: 300
        height: 30
        placeholderText: "Поиск ..."
        onTextChanged: print(text)
    }

    HorizontalHeaderView {
        id: horizontalHeader
        z: 2
        syncView: tableView
        anchors {
            top: textField.bottom
            left: parent.left
        }
        resizableColumns: false
        model: ["Имя", "Цвет"]
        delegate: Rectangle {
            implicitHeight: 50
            implicitWidth: 50
            color: "lightblue"

            Text {
                anchors.centerIn: parent
                text: modelData
            }
        }
    }

    TableView {
        id: tableView
        anchors {
            top: horizontalHeader.bottom
            bottom: parent.bottom
            left: parent.left
            right: parent.right
        }
        columnSpacing: 1
        rowSpacing: 1
        clip: true

        model: TableModel {
            TableModelColumn { display: "name" }
            TableModelColumn { display: "color" }

            rows: [
                { "name": "кот", "color": "черный" },
                { "name": "собака", "color": "коричневый" },
                { "name": "птица", "color": "белый" },
                { "name": "рыба", "color": "синий" },
                { "name": "кролик", "color": "серый" },
                { "name": "лошадь", "color": "коричневый" },
                { "name": "змея", "color": "зеленый" },
                { "name": "хомяк", "color": "золотистый" },
                { "name": "черепаха", "color": "зеленый" },
                { "name": "попугай", "color": "красный" },
                { "name": "лягушка", "color": "зеленый" },
                { "name": "ящерица", "color": "коричневый" },
                { "name": "бабочка", "color": "многоцветный" },
                { "name": "пчела", "color": "желтый" },
                { "name": "овца", "color": "белый" },
                { "name": "коза", "color": "черный" },
                { "name": "свинья", "color": "розовый" },
                { "name": "корова", "color": "черно-белый" },
                { "name": "утка", "color": "желтый" },
                { "name": "лебедь", "color": "белый" },
                { "name": "орел", "color": "коричневый" },
                { "name": "сова", "color": "серый" },
                { "name": "павлин", "color": "синий и зеленый" },
                { "name": "олень", "color": "коричневый" },
                { "name": "медведь", "color": "темно-коричневый" },
                { "name": "волк", "color": "серый" },
                { "name": "лис", "color": "оранжевый" },
                { "name": "лев", "color": "золотистый" },
                { "name": "тигр", "color": "оранжевый с полосами" },
                { "name": "слон", "color": "серый" }
            ]
        }

        delegate: Rectangle {
            implicitWidth: 100
            implicitHeight: 50
            border.width: 1

            Text {
                text: display
                anchors.centerIn: parent
            }
        }
    }
}