CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-vant

Mobile UI Components library built on Vue 3 with 100+ components

74

1.07x
Overview
Eval results
Files

rubric.jsonevals/scenario-8/

{
  "context": "This evaluation assesses how effectively the engineer uses the Vant DatePicker component to implement a date selection interface with future date filtering. The focus is on correct usage of the DatePicker API, including component import, state management, date filtering, and event handling.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "DatePicker Import",
      "description": "Correctly imports the DatePicker component from the vant package (e.g., import { DatePicker } from 'vant' or using van-date-picker)",
      "max_score": 10
    },
    {
      "name": "DatePicker Usage",
      "description": "Uses the DatePicker component in the template with appropriate v-model binding to track the selected date value",
      "max_score": 20
    },
    {
      "name": "Visibility Control",
      "description": "Implements show/visible state control for the DatePicker using v-model:show or similar visibility prop to open and close the picker",
      "max_score": 15
    },
    {
      "name": "Date Filtering",
      "description": "Implements the filter prop or min-date prop to prevent selection of today and past dates, ensuring only future dates (tomorrow onwards) are selectable",
      "max_score": 25
    },
    {
      "name": "Confirm Event Handling",
      "description": "Handles the confirm event (@confirm or onConfirm) to capture the selected date and close the picker when the user confirms their selection",
      "max_score": 20
    },
    {
      "name": "Date Display",
      "description": "Properly displays the selected date from the DatePicker in YYYY-MM-DD format or shows appropriate placeholder text when no date is selected",
      "max_score": 10
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-vant

tile.json