refactor(stage-*): use new InputFileCard

This commit is contained in:
Neko Ayaka
2026-04-10 03:40:10 +08:00
parent 14f8275fa7
commit 90294ce15c
4 changed files with 9 additions and 9 deletions
@@ -2,7 +2,7 @@
import type { PreTrainedModel, Processor } from '@huggingface/transformers'
import { AutoModel, AutoProcessor, env, RawImage } from '@huggingface/transformers'
import { Button, Checkbox, InputFile } from '@proj-airi/ui'
import { Button, Checkbox, InputFileCard } from '@proj-airi/ui'
import { check } from 'gpuu/webgpu'
import { computed, onMounted, ref, watch } from 'vue'
@@ -222,7 +222,7 @@ function hidePreview() {
<!-- Main content -->
<template v-else>
<!-- File upload area -->
<InputFile v-model="imageFiles" accept="image/*" multiple w-full />
<InputFileCard v-model="imageFiles" accept="image/*" multiple w-full />
<!-- Controls -->
<div flex flex-wrap items-center justify-between gap-4>
@@ -2,7 +2,7 @@
import type { PreTrainedModel, Processor } from '@huggingface/transformers'
import { AutoModel, AutoProcessor, env, RawImage } from '@huggingface/transformers'
import { Button, Checkbox, InputFile } from '@proj-airi/ui'
import { Button, Checkbox, InputFileCard } from '@proj-airi/ui'
import { check } from 'gpuu/webgpu'
import { computed, onMounted, ref, watch } from 'vue'
@@ -222,7 +222,7 @@ function hidePreview() {
<!-- Main content -->
<template v-else>
<!-- File upload area -->
<InputFile v-model="imageFiles" accept="image/*" multiple w-full />
<InputFileCard v-model="imageFiles" accept="image/*" multiple w-full />
<!-- Controls -->
<div flex flex-wrap items-center justify-between gap-4>
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { InputFile } from '@proj-airi/ui'
import { InputFileCard } from '@proj-airi/ui'
import { Vibrant } from 'node-vibrant/browser'
import { ref, watch } from 'vue'
@@ -49,7 +49,7 @@ watch(files, (files) => {
{{ colorsDebug }}
</div>
<div flex gap-2>
<InputFile v-model="files" h-60 w-full />
<InputFileCard v-model="files" h-60 w-full />
</div>
<div
h-60
@@ -3,7 +3,7 @@ import type { ccv3 } from '@proj-airi/ccc'
import { Alert } from '@proj-airi/stage-ui/components'
import { useAiriCardStore } from '@proj-airi/stage-ui/stores/modules/airi-card'
import { InputFile } from '@proj-airi/ui'
import { InputFileCard } from '@proj-airi/ui'
import { ComboboxSelect } from '@proj-airi/ui/components/form'
import { storeToRefs } from 'pinia'
import { computed, ref, watch } from 'vue'
@@ -223,7 +223,7 @@ function getModuleShortName(id: string, module: 'consciousness' | 'voice') {
:class="{ 'grid grid-cols-[repeat(auto-fill,minmax(280px,1fr))] gap-4 grid-auto-rows-[minmax(min-content,max-content)] grid-auto-flow-dense sm:grid-cols-[repeat(auto-fill,minmax(240px,1fr))] sm:gap-5 md:grid-cols-[repeat(auto-fill,minmax(220px,1fr))] lg:grid-cols-[repeat(auto-fill,minmax(250px,1fr))]': cards.size > 0 }"
>
<!-- Upload card -->
<InputFile v-model="inputFiles" accept="*.json">
<InputFileCard v-model="inputFiles" accept="*.json">
<template #default="{ isDragging }">
<template v-if="!isDragging">
<div flex flex-col items-center>
@@ -245,7 +245,7 @@ function getModuleShortName(id: string, module: 'consciousness' | 'voice') {
</div>
</template>
</template>
</InputFile>
</InputFileCard>
<!-- Create card -->
<CardCreate @click="handleCardCreationDialog" />