<v-card>

<v-card-title>

<v-colcols="8">

<v-colcols="8"sm="3">

<v-menu

ref="menu"

v-model="menu"

<v-icon>mdi-plus</v-icon>

</v-btn>

</v-col>

<v-colclass="overflow-x-auto"cols="12"sm="8">

<divclass="summary">

<divclass="mr-4">

<tableclass="text-right">

<tr>

<td>収入：</td>

<td>{{ separate(sum.income) }}</td>

</tr>

<tr>

<td>支出：</td>

<td>{{ separate(sum.outgo) }}</td>

</tr>

<tr>

<td>収支差：</td>

<td>{{ separate(sum.income - sum.outgo) }}</td>

</tr>

</table>

</div>

<divv-for="category in sum.categories":key="category[0]">

<v-progress-circular

class="mr-2"

:rotate="-90"

:size="60"

:width="5"

:value="category[1]"

color="teal"

>

{{ category[0] }}

</v-progress-circular>

</div>

</div>

</v-col>

<v-colcols="12">

<v-colcols="12"sm="4">

<v-text-field

v-model="search"

append-icon="mdi-magnify"

</script>

<style>

</style>