mirror of
https://github.com/soybeanjs/soybean-admin.git
synced 2025-12-27 02:05:57 +08:00
feat(projects): pro-naive-ui 示例支持多语言
This commit is contained in:
@@ -2,6 +2,7 @@
|
||||
import { ref } from 'vue';
|
||||
import { useMessage } from 'naive-ui';
|
||||
import { createProForm } from 'pro-naive-ui';
|
||||
import { $t } from '@/locales';
|
||||
|
||||
const step = ref(1);
|
||||
const submiting = ref(false);
|
||||
@@ -37,24 +38,28 @@ function delay(time: number) {
|
||||
|
||||
<template>
|
||||
<div class="color-#fff">
|
||||
<ProCard title="分步表单" :segmented="{ content: true }" :show-collapse="false">
|
||||
<ProCard :title="$t('page.proNaive.form.step.title')" :segmented="{ content: true }" :show-collapse="false">
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<NSteps :current="step" class="mb-50px ml-200px w-60%">
|
||||
<NStep title="表单1" />
|
||||
<NStep title="表单2" />
|
||||
<NStep :title="$t('page.proNaive.form.step.step1.title')" />
|
||||
<NStep :title="$t('page.proNaive.form.step.step2.title')" />
|
||||
</NSteps>
|
||||
<template v-if="step === 1">
|
||||
<ProForm :form="form" label-placement="left">
|
||||
<ProInput title="表单1字段" path="form1Field" required />
|
||||
<NButton @click="toNextStepAfterValidated">下一步</NButton>
|
||||
<ProInput :title="$t('page.proNaive.form.step.step1.field')" path="form1Field" required />
|
||||
<NButton @click="toNextStepAfterValidated">{{ $t('page.proNaive.form.step.step1.nextStep') }}</NButton>
|
||||
</ProForm>
|
||||
</template>
|
||||
<template v-if="step === 2">
|
||||
<ProForm :form="form2" :loading="submiting" label-placement="left">
|
||||
<ProInput title="表单2字段" path="form2Field" required />
|
||||
<ProInput :title="$t('page.proNaive.form.step.step2.field')" path="form2Field" required />
|
||||
<NFlex>
|
||||
<NButton :disabled="submiting" @click="step -= 1">上一步</NButton>
|
||||
<NButton type="primary" attr-type="submit" :loading="submiting">提交</NButton>
|
||||
<NButton :disabled="submiting" @click="step -= 1">
|
||||
{{ $t('page.proNaive.form.step.step2.prevStep') }}
|
||||
</NButton>
|
||||
<NButton type="primary" attr-type="submit" :loading="submiting">
|
||||
{{ $t('page.proNaive.form.step.step2.submit') }}
|
||||
</NButton>
|
||||
</NFlex>
|
||||
</ProForm>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user