filter.vp.tsx

/** @jsx h */
// AUTO-GENERATED by export-examples-tsx —— 由同名 .vpproj.json 导出的 VP-TSX 配对视图（已回编译等值验证）。
// 修改请改 JSON 后重跑导出脚本，或改本文件后用 compile.mts 重编 JSON——保持两者一致。
import { defineProject, h } from '../scripts/vptsx/runtime'

export default defineProject({
  name: "数据筛选示例",
  connections: [
    {
      "uid": "conn_demo",
      "name": "示例数据",
      "type": "json",
      "connectorType": "json",
      "config": {
        "copyToRoot": true,
        "fileName": ""
      },
      "tables": [
        {
          "uid": "tbl_demo",
          "name": "示例数据",
          "fields": [
            {
              "uid": "分类",
              "alias": "分类",
              "type": "string"
            },
            {
              "uid": "值",
              "alias": "值",
              "type": "number"
            }
          ]
        }
      ]
    }
  ],
  connectionData: {
    "conn_demo": [
      {
        "tableId": "tbl_demo",
        "tableName": "示例数据",
        "fields": [
          {
            "uid": "分类",
            "alias": "分类",
            "type": "string"
          },
          {
            "uid": "值",
            "alias": "值",
            "type": "number"
          }
        ],
        "rows": [
          {
            "分类": "示例 1",
            "值": 1048
          },
          {
            "分类": "示例 2",
            "值": 735
          },
          {
            "分类": "示例 3",
            "值": 580
          },
          {
            "分类": "示例 4",
            "值": 1005
          },
          {
            "分类": "示例 5",
            "值": 700
          }
        ]
      }
    ]
  },
  screen: (
    <screen
      uid={"screen_main"}
      name={"主页面"}
      fullscreen-mode={"fill-uniform"} fill-auto-expand={true}
      size={[1920,1080]}
      background-color={"#0c0d0e"}
      stateOverrides={{}}
    >
      <basic-text
        uid={"w_title"}
        position={[120,70]}
        size={[1400,60]}
        text={"数据筛选：左表显示全部，右表用「筛选数据源指定条数」从第2行起取3条"}
        text-font={{"size":28,"color":"#ffffff"}}
        text-position={"left"}
        stateOverrides={{}}
      />
      <basic-table
        uid={"w_table_all"}
        name={"全部数据"}
        position={[120,180]}
        size={[560,360]}
        row-count={6}
        table-data-fields={[["conn_demo","tbl_demo","分类"],["conn_demo","tbl_demo","值"]]}
        stateOverrides={{}}
      />
      <basic-table
        uid={"w_table_filtered"}
        name={"筛选后(第2~4条)"}
        position={[760,180]}
        size={[560,360]}
        row-count={6}
        filter={true}
        row-filter-mode={"data-rows"}
        row-filter-start-index={2}
        row-filter-row-count={3}
        table-data-fields={[["conn_demo","tbl_demo","分类"],["conn_demo","tbl_demo","值"]]}
        stateOverrides={{}}
      />
      <chart-bar
        uid={"w_bar_row1"}
        name={"只看第1行"}
        position={[1380,180]}
        size={[440,360]}
        title={"筛选指定行=第1行"}
        show-label={true}
        filter={true}
        row-filter-mode={"data-row"}
        row-filter-row-index={1}
        category-field={[["conn_demo","tbl_demo","分类"]]}
        metric-fields={[["conn_demo","tbl_demo","值"]]}
        stateOverrides={{}}
      />
    </screen>
  ),
})