admin/verify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 使用shadcn NumberField组件并限制宽度

Browse Source 
- 使用NumberField组件替代Input
- 限制宽度为w-32
- 配置货币格式显示

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
admin
2026-05-09 19:58:38 +08:00
parent 8385329056
commit 0a0f23ab0c
2 changed files with 30 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/admin/agent-apps/[id].vue
+15 -13
View File
@@ -6,7 +6,7 @@ import { useRoute, useRouter } from 'vue-router'
import { toast } from 'vue-sonner' import { toast } from 'vue-sonner'
import { BasicPage } from '@/components/global-layout' import { BasicPage } from '@/components/global-layout'
import { Input } from '@/components/ui/input' import { NumberField, NumberFieldContent, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput } from '@/components/ui/number-field'
import api from '@/services/api' import api from '@/services/api'
const router = useRouter() const router = useRouter()
@@ -246,18 +246,20 @@ onMounted(() => {
</div> </div>
<div class="space-y-2"> <div class="space-y-2">
<UiLabel for="price">{{ t('admin.agentApps.createForm.price') }} <span class="text-destructive">*</span></UiLabel> <UiLabel>{{ t('admin.agentApps.createForm.price') }} <span class="text-destructive">*</span></UiLabel>
<div class="relative"> <NumberField
<span class="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground">¥</span> v-model="formData.price"
<Input :min="0"
id="price" :format-options="{ style: 'currency', currency: 'CNY', currencyDisplay: 'symbol' }"
v-model="formData.price" :disabled="saving"
type="number" class="w-32"
class="pl-7" >
:placeholder="t('admin.agentApps.createForm.pricePlaceholder')" <NumberFieldContent>
:disabled="saving" <NumberFieldDecrement />
/> <NumberFieldInput />
</div> <NumberFieldIncrement />
</NumberFieldContent>
</NumberField>
</div> </div>
</UiCardContent> </UiCardContent>
</UiCard> </UiCard>
frontend/src/pages/admin/agent-apps/create.vue
+15 -13
View File
@@ -6,7 +6,7 @@ import { useRouter } from 'vue-router'
import { toast } from 'vue-sonner' import { toast } from 'vue-sonner'
import { BasicPage } from '@/components/global-layout' import { BasicPage } from '@/components/global-layout'
import { Input } from '@/components/ui/input' import { NumberField, NumberFieldContent, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput } from '@/components/ui/number-field'
import api from '@/services/api' import api from '@/services/api'
const router = useRouter() const router = useRouter()
@@ -232,18 +232,20 @@ onMounted(() => {
</div> </div>
<div class="space-y-2"> <div class="space-y-2">
<UiLabel for="price">{{ t('admin.agentApps.createForm.price') }} <span class="text-destructive">*</span></UiLabel> <UiLabel>{{ t('admin.agentApps.createForm.price') }} <span class="text-destructive">*</span></UiLabel>
<div class="relative"> <NumberField
<span class="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground">¥</span> v-model="formData.price"
<Input :min="0"
id="price" :format-options="{ style: 'currency', currency: 'CNY', currencyDisplay: 'symbol' }"
v-model="formData.price" :disabled="saving"
type="number" class="w-32"
class="pl-7" >
:placeholder="t('admin.agentApps.createForm.pricePlaceholder')" <NumberFieldContent>
:disabled="saving" <NumberFieldDecrement />
/> <NumberFieldInput />
</div> <NumberFieldIncrement />
</NumberFieldContent>
</NumberField>
</div> </div>
<div class="space-y-2"> <div class="space-y-2">