79 lines
2.3 KiB
Vue
79 lines
2.3 KiB
Vue
<script lang="ts"></script>
|
|
|
|
<script setup lang="tsx">
|
|
import type { ToastMessageOptions } from 'primevue/toast';
|
|
import { openConfirm, openDialog } from './fns';
|
|
</script>
|
|
|
|
<template>
|
|
<div class="primevue py-4 flex items-start flex-wrap gap-6">
|
|
<ProgressSpinner class="w-6! h-6! m-0!" />
|
|
<FloatLabel>
|
|
<InputText default-value="DEFAULT_VALUE" id="username" />
|
|
<label for="username">Username</label>
|
|
</FloatLabel>
|
|
|
|
<FloatLabel>
|
|
<Select
|
|
:options="[
|
|
{ name: '纽约', code: 'NY' },
|
|
{ name: '罗马', code: 'RM' },
|
|
{ name: '伦敦', code: 'LDN' },
|
|
{ name: '伊斯坦布尔', code: 'IST' },
|
|
{ name: '巴黎', code: 'PRS' },
|
|
]"
|
|
optionLabel="name"
|
|
class="min-w-[200px]"
|
|
/>
|
|
<label>SELECT</label>
|
|
</FloatLabel>
|
|
|
|
<FloatLabel w-full>
|
|
<UploadDemo />
|
|
<label>FileUpload</label>
|
|
</FloatLabel>
|
|
|
|
<FloatLabel>
|
|
<FileUpload name="demo[]" url="/api/upload" :maxFileSize="1000000" />
|
|
<label>FileUpload</label>
|
|
</FloatLabel>
|
|
|
|
<FloatLabel>
|
|
<DatePicker showButtonBar dateFormat="dd/mm/yy" :default-value="new Date()" />
|
|
<label>DatePicker</label>
|
|
</FloatLabel>
|
|
|
|
<!-- <Button @click="openToast">提示服务</Button> -->
|
|
<Card>
|
|
<template #title>提示服务</template>
|
|
<template #content>
|
|
<div flex="~ wrap" gap="4">
|
|
<!-- oastService.add({ severity: 'info', summary: '提示', life: 3000, detail: '消息内容' }); -->
|
|
<!-- oastService.add({ severity: 'info', summary: '提示', life: 0, detail: '消息内容' }); -->
|
|
<Button
|
|
outlined
|
|
v-for="severity in [
|
|
'success',
|
|
'info',
|
|
'warn',
|
|
'error',
|
|
'secondary',
|
|
'contrast',
|
|
undefined,
|
|
] satisfies ToastMessageOptions['severity'][]"
|
|
:key="severity"
|
|
@click="
|
|
ToastService.add({ severity: severity, summary: `severity: ${severity}`, life: 5000, detail: '消息内容' })
|
|
"
|
|
>
|
|
{{ `${severity}` }}
|
|
</Button>
|
|
</div>
|
|
</template>
|
|
</Card>
|
|
|
|
<Button @click="openDialog">对话框服务</Button>
|
|
<Button @click="openConfirm">确认服务</Button>
|
|
</div>
|
|
</template>
|