helios-web-vue/components/TransactionList.vue

<template>
  <v-list rounded="lg" lines="two">
    <TransactionListItem v-for="v in transactions" :transaction-item="v"/>
  </v-list>
</template>
<script lang="ts" setup>
let transactions = [
{
    "id": "20842",
    "description": "aaa",
    "category": {
      "id": "10087241",
      "name": "Category1",
    },
    "amount": {
      "value": "135.33",
      "currency": "CNY",
    },
    "time": "1738564519",
    "tags": [
      {
        "id": "1742004",
        "name": "t1",
      },
      {
        "id": "1742932",
        "name": "t3",
      },
    ],
  },
  {
    "id": "20845",
    "description": "bbb",
    "category": {
      "id": "10088823",
      "name": "Category2",
    },
    "amount": {
      "value": "77.99",
      "currency": "CNY",
    },
    "time": "1738564519",
    "tags": [
      {
        "id": "1742004",
        "name": "t1",
      },
      {
        "id": "1742932",
        "name": "t3",
      },
    ],
  }
]
let items = [
        { type: 'subheader', title: 'Group #1' },
        {
          title: 'Item #1',
          value: 1,
        },
        {
          title: 'Item #2',
          value: 2,
        },
        {
          title: 'Item #3',
          value: 3,
        },
        { type: 'divider' },
        { type: 'subheader', title: 'Group #2' },
        {
          title: 'Item #4',
          value: 4,
        },
        {
          title: 'Item #5',
          value: 5,
        },
        {
          title: 'Item #6',
          value: 6,
        },
      ];
    
</script>