数据表单 ​
使用类型化 schema 与控件注册表组合字段、依赖和数据来源。
基础用法 ​
示例通过 createAsamSchema
类型化 Schema 与插槽
<template>
<div class="demo-root-layout">
<AsamForm v-model="model" :schema="schema" @search="submitted = $event">
<template #field-keyword="{ value, update }">
<AsamInput
:model-value="value"
placeholder="输入关键词"
@update:model-value="update(String($event))"
/>
</template>
<template #actions="{ search, reset }">
<AsamButton type="default" native-type="button" @click="search">查询</AsamButton>
<AsamButton type="default" native-type="button" @click="reset">重置</AsamButton>
</template>
</AsamForm>
<pre>{{ model }}</pre>
<pre>{{ submitted }}</pre>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamFormBasicDemo' });
import { ref } from 'vue';
import { AsamButton, AsamForm, AsamInput, asamFormControls, createAsamSchema } from '@asam-ui/ui';
interface Model {
keyword: string;
}
const model = ref<Model>({ keyword: '' });
const submitted = ref<Model>({ keyword: '' });
const builder = createAsamSchema<Model>()(asamFormControls);
const schema = [
builder.field({ field: 'keyword', component: 'Input', label: '关键词', defaultValue: () => '' })
];
</script>
<style scoped>
.demo-root-layout {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
margin-block: 0;
}
</style>
<template>
<div class="demo-root-layout">
<AsamForm v-model="model" :schema="schema" @search="submitted = $event">
<template #field-keyword="{ value, update }">
<AsamInput
:model-value="value"
placeholder="输入关键词"
@update:model-value="update(String($event))"
/>
</template>
<template #actions="{ search, reset }">
<AsamButton type="default" native-type="button" @click="search">查询</AsamButton>
<AsamButton type="default" native-type="button" @click="reset">重置</AsamButton>
</template>
</AsamForm>
<pre>{{ model }}</pre>
<pre>{{ submitted }}</pre>
</div>
</template>
<script setup>
defineOptions({ name: 'AsamFormBasicDemo' });
import { ref } from 'vue';
import { AsamButton, AsamForm, AsamInput, asamFormControls, createAsamSchema } from '@asam-ui/ui';
const model = ref({ keyword: '' });
const submitted = ref({ keyword: '' });
const builder = createAsamSchema()(asamFormControls);
const schema = [
builder.field({ field: 'keyword', component: 'Input', label: '关键词', defaultValue: () => '' })
];
</script>
<style scoped>
.demo-root-layout {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
margin-block: 0;
}
</style>
Schema 与控件覆盖 ​
schema 配合 registry 使用;createAsamSchema 的 field 校验字段名、模型类型和对应控件。 完整说明。
内置控件已自动注册。asamFormControls 提供给 createAsamSchema 做类型检查,不作为 registry prop 再传一次;registry 只接收由 defineAsamControl 创建的新 custom: 名称,不能覆盖内置控件。
表单标量日期与时间 ​
注册表的 DatePicker、TimePicker 和 TimeSelect 使用 string|null 协议。 完整说明。
表单标量日期、时间与空值
<template>
<div class="demo-root-layout">
<!-- prettier-ignore -->
<AsamForm
ref="form"
v-model="model"
:schema="schema"
@reset="resetModel = $event"
/>
<AsamButton type="default" native-type="button" @click="form?.resetFields()"
>重置日期字段</AsamButton
>
<pre data-testid="scalar-date-model">{{ JSON.stringify(model) }}</pre>
<pre>{{ JSON.stringify(resetModel) }}</pre>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { AsamButton, AsamForm, asamFormControls, createAsamSchema } from '@asam-ui/ui';
import type { AsamFormExpose } from '@asam-ui/ui';
defineOptions({ name: 'AsamFormScalarDateTimeDemo' });
interface Model {
date: string | null;
time: string | null;
timeSelect: string | null;
}
const model = ref<Model>({ date: '2026-10-08', time: '09:30:00', timeSelect: '09:30' });
const resetModel = ref<Model>();
const form = ref<AsamFormExpose<Model>>();
const builder = createAsamSchema<Model>()(asamFormControls);
const schema = [
builder.field({
field: 'date',
component: 'DatePicker',
label: '日期',
componentProps: { clearable: true, placeholder: '表单日期' }
}),
builder.field({
field: 'time',
component: 'TimePicker',
label: '时间',
componentProps: { clearable: true, placeholder: '表单时间' }
}),
builder.field({
field: 'timeSelect',
component: 'TimeSelect',
label: '时间选项',
componentProps: { clearable: true, placeholder: '表单时间选项' }
})
];
</script>
<style scoped>
.demo-root-layout {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
margin-block: 0;
}
</style>
<template>
<div class="demo-root-layout">
<!-- prettier-ignore -->
<AsamForm
ref="form"
v-model="model"
:schema="schema"
@reset="resetModel = $event"
/>
<AsamButton type="default" native-type="button" @click="form?.resetFields()"
>重置日期字段</AsamButton
>
<pre data-testid="scalar-date-model">{{ JSON.stringify(model) }}</pre>
<pre>{{ JSON.stringify(resetModel) }}</pre>
</div>
</template>
<script setup>
import { ref } from 'vue';
import { AsamButton, AsamForm, asamFormControls, createAsamSchema } from '@asam-ui/ui';
defineOptions({ name: 'AsamFormScalarDateTimeDemo' });
const model = ref({ date: '2026-10-08', time: '09:30:00', timeSelect: '09:30' });
const resetModel = ref();
const form = ref();
const builder = createAsamSchema()(asamFormControls);
const schema = [
builder.field({
field: 'date',
component: 'DatePicker',
label: '日期',
componentProps: { clearable: true, placeholder: '表单日期' }
}),
builder.field({
field: 'time',
component: 'TimePicker',
label: '时间',
componentProps: { clearable: true, placeholder: '表单时间' }
}),
builder.field({
field: 'timeSelect',
component: 'TimeSelect',
label: '时间选项',
componentProps: { clearable: true, placeholder: '表单时间选项' }
})
];
</script>
<style scoped>
.demo-root-layout {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
margin-block: 0;
}
</style>
依赖与隐藏规则 ​
dependsOn 声明前置字段;resolveDataSource 从只读模型派生来源。 完整说明。
插槽与实例 ​
field-字段名 插槽提供 field、model、value、update 和 updateValue;使用更新函数写回对应字段。 完整说明。
默认与布局 ​
本组件设置 inline=true、labelWidth=auto、showSearch=true、showReset=true、labelMode=visible,searchText 为“搜 索”、resetText 为“重置”。基础表单能力通过显式公开类型关联;model 由 modelValue 接管。
本站继承关系 ​
- AsamBaseForm:适用的基础展示、交互与公开 API。
本页数据来源、模型、事件和实例的覆盖规则优先;本站链接不扩大本组件公开契约。尺寸使用基础组件的 ASAM 尺寸规则,示例使用 default。
依赖来源、隐藏与重置 ​
完整示例按地区派生成员 API 来源,在地区变化时清除旧成员;隐藏备注时清除备注并暂停其验证,重新显示后恢复 required 规则。 完整说明。
同一示例可切换 onDependencyChange 与 onHide 的 retain/clear 策略:retain 保留当前模型,clear 使用注册控件的空值。 完整说明。
成员字段也可独立切换必填、枚举规则、布尔/函数隐藏和禁用;固定来源与派生来源使用相同字段策略。 完整说明。
成员显示配置可切换 schema 的 label 与 componentProps.placeholder,并恢复原标签和占位文案。 完整说明。
固定来源分支禁止再传 resolveDataSource,派生来源分支禁止再传 dataSource;类型检查会拒绝这两种组合。绕过类型后同时传入两者时,Form 在挂载控件或发起请求前显示互斥配置错误,并保留原模型。只传固定来源或只传 resolver 均可正常建立字段。
依赖来源、隐藏清除与校验重置
<template>
<section class="demo-layout-1">
<fieldset class="demo-spacing-1">
<legend>字段依赖策略</legend>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainDependency">保留依赖值</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainHidden">保留隐藏值</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="hideNote">隐藏备注开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="disableNote">禁用备注开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="defaultMemo">非空默认备注</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="extraRule">追加长度规则</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="booleanHidden = true"
>布尔隐藏策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanHidden = false"
>函数隐藏策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanDisabled = true"
>布尔禁用策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanDisabled = false"
>函数禁用策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="fixedSourceMode = true"
>固定成员来源</AsamButton
>
<AsamButton type="default" native-type="button" @click="fixedSourceMode = false"
>依赖成员来源</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'east' })"
>
切换东区
</AsamButton>
<AsamButton type="default" native-type="button" @click="resetSchemaDefaults"
>使用schema默认值重置</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: '' })"
>
清空地区来源
</AsamButton>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="requiredMember">成员必填</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="extraMemberRule">成员枚举规则</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="hideMember">隐藏成员开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="disableMember">禁用成员开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainMemberHide">保留隐藏成员</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="defaultMember">非空默认成员</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="booleanMemberHidden = true"
>成员布尔隐藏</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberHidden = false"
>成员函数隐藏</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberDisabled = true"
>成员布尔禁用</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberDisabled = false"
>成员函数禁用</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ member: null })"
>
清空成员值
</AsamButton>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ member: 'west-alpha' })"
>
设置西区成员值
</AsamButton>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'hide-member' })"
>
成员隐藏地区
</AsamButton>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="alternateMemberPresentation">成员显示配置</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="inspectMember"
>读取成员配置</AsamButton
>
</fieldset>
<AsamForm
ref="form"
v-model="model"
:schema="schema"
:inline="false"
size="default"
:show-search="false"
:show-reset="false"
@search="submitted = $event"
@reset="resetCount++"
@validate="validateCount++"
>
<template #actions="{ search, reset }">
<AsamButton type="default" native-type="button" @click="search"
>提交模型</AsamButton
>
<AsamButton type="default" native-type="button" @click="reset">重置模型</AsamButton>
</template>
</AsamForm>
<AsamButton type="default" native-type="button" @click="validate">执行校验</AsamButton>
<AsamButton type="default" native-type="button" @click="form?.clearValidate()"
>清除校验</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'hide' })"
>隐藏备注</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'west' })"
>切换西区</AsamButton
>
<AsamButton type="default" native-type="button" @click="resetInitial"
>设置初始值并重置</AsamButton
>
<AsamButton type="default" native-type="button" @click="inspect">读取公开字段</AsamButton>
<p class="example-paragraph" role="status">
校验:{{ validation }};校验事件:{{ validateCount }};重置:{{ resetCount }}
</p>
<pre data-testid="form-model">{{ JSON.stringify(model) }}</pre>
<pre data-testid="form-submitted">{{ JSON.stringify(submitted) }}</pre>
<pre data-testid="form-fields">{{ JSON.stringify(fields) }}</pre>
<pre data-testid="form-member-context">{{ JSON.stringify(memberContext) }}</pre>
</section>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamFormDependenciesDemo' });
import { computed, ref } from 'vue';
import {
AsamCheckboxItem,
AsamButton,
AsamForm,
asamFormControls,
createAsamSchema,
defineAsamOptions
} from '@asam-ui/ui';
import type { AsamFormExpose, AsamValue, AsamOptionsSource } from '@asam-ui/ui';
interface Model {
region: string;
note: string;
member: AsamValue | null;
}
interface Member {
label: string;
value: string;
}
const model = ref<Model>({ region: 'east', note: '', member: null });
const submitted = ref<Model | null>(null);
const form = ref<AsamFormExpose<Model>>();
const retainDependency = ref(false);
const retainHidden = ref(false);
const hideNote = ref(false);
const disableNote = ref(false);
const booleanHidden = ref(false);
const booleanDisabled = ref(true);
const fixedSourceMode = ref(false);
const defaultMemo = ref(false);
const extraRule = ref(false);
const alternateMemberPresentation = ref(false);
const memberContext = ref({
present: false,
propMatches: false,
listContainsField: false,
count: 0
});
const requiredMember = ref(false);
const extraMemberRule = ref(false);
const hideMember = ref(false);
const disableMember = ref(false);
const retainMemberHide = ref(true);
const defaultMember = ref(false);
const booleanMemberHidden = ref(false);
const booleanMemberDisabled = ref(true);
const validation = ref('未执行');
const validateCount = ref(0);
const resetCount = ref(0);
const fields = ref<{ count: number; hasRegion: boolean }>({ count: 0, hasRegion: false });
const sources = new Map<string, AsamOptionsSource<string, Member, 'api'>>();
function sourceFor(region: string) {
if (!region) return undefined;
return ensureSource(region);
}
function ensureSource(region: string) {
let source = sources.get(region);
if (!source) {
source = defineAsamOptions<string, Member>().api({
api: async (_params: undefined, context) => {
await new Promise<void>((done) => setTimeout(done, 100));
context.signal.throwIfAborted();
return [{ label: region + ' Alpha', value: region + '-alpha' }];
},
params: undefined,
transform: (rows) => rows,
fieldNames: { label: 'label', value: 'value' }
});
sources.set(region, source);
}
return source;
}
const builder = createAsamSchema<Model>()(asamFormControls);
const schema = computed(() => {
const hidden = hideNote.value;
const disabled = disableNote.value;
const memo = defaultMemo.value;
const memberHidden = hideMember.value;
const memberDisabled = disableMember.value;
const memberDefault = defaultMember.value;
const memberLabel = alternateMemberPresentation.value ? '地区成员' : '成员';
const memberPlaceholder = alternateMemberPresentation.value ? '请选择地区成员' : '选择地区成员';
return [
builder.field({
field: 'region',
component: 'Input',
label: '地区',
required: true,
defaultValue: () => 'east'
}),
builder.field({
field: 'note',
component: 'Input',
label: '备注',
required: true,
rules: extraRule.value ? [{ min: 2, message: '至少两个字符', trigger: 'blur' }] : [],
dependsOn: ['region'],
hidden: booleanHidden.value ? hidden : (current) => hidden || current.region === 'hide',
disabled: booleanDisabled.value
? disabled
: (current) => disabled && current.region === 'west',
onHide: retainHidden.value ? 'retain' : 'clear',
defaultValue: () => (memo ? '工厂默认备注' : '')
}),
fixedSourceMode.value
? builder.field({
field: 'member',
component: 'RemoteSelect',
label: memberLabel,
required: requiredMember.value,
rules: extraMemberRule.value
? [
{
type: 'enum',
enum: ['east-alpha'],
message: '仅东区成员',
trigger: 'change'
}
]
: [],
hidden: booleanMemberHidden.value
? memberHidden
: (current) => memberHidden || current.region === 'hide-member',
disabled: booleanMemberDisabled.value
? memberDisabled
: (current) => memberDisabled && current.region === 'west',
onHide: retainMemberHide.value ? 'retain' : 'clear',
dependsOn: ['region'],
dataSource: ensureSource('fixed'),
onDependencyChange: retainDependency.value ? 'retain' : 'clear',
componentProps: { teleported: false, placeholder: memberPlaceholder },
defaultValue: () => (memberDefault ? 'east-alpha' : null)
})
: builder.field({
field: 'member',
component: 'RemoteSelect',
label: memberLabel,
required: requiredMember.value,
rules: extraMemberRule.value
? [
{
type: 'enum',
enum: ['east-alpha'],
message: '仅东区成员',
trigger: 'change'
}
]
: [],
hidden: booleanMemberHidden.value
? memberHidden
: (current) => memberHidden || current.region === 'hide-member',
disabled: booleanMemberDisabled.value
? memberDisabled
: (current) => memberDisabled && current.region === 'west',
onHide: retainMemberHide.value ? 'retain' : 'clear',
dependsOn: ['region'],
resolveDataSource: (current) => sourceFor(current.region),
onDependencyChange: retainDependency.value ? 'retain' : 'clear',
componentProps: { teleported: false, placeholder: memberPlaceholder },
defaultValue: () => (memberDefault ? 'east-alpha' : null)
})
];
});
async function validate() {
try {
validation.value = (await form.value?.validate()) ? '有效' : '无效';
} catch {
validation.value = '无效';
}
}
function resetInitial() {
form.value?.setInitialValues({ region: 'west', note: '初始备注', member: null });
form.value?.resetFields();
}
function resetSchemaDefaults() {
form.value?.setInitialValues({});
form.value?.resetFields();
}
function inspectMember() {
const field = form.value?.getField('member');
memberContext.value = {
present: !!field,
propMatches: field?.prop === 'member',
listContainsField: !!field && (form.value?.fields ?? []).includes(field),
count: form.value?.fields.length ?? 0
};
}
function inspect() {
fields.value = {
count: form.value?.fields.length ?? 0,
hasRegion: !!form.value?.getField('region')
};
}
</script>
<style scoped>
.demo-layout-1 {
display: grid;
gap: var(--asam-space-md);
}
</style>
<style scoped>
.demo-spacing-1 {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
</style>
<style scoped>
p:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
</style>
<template>
<section class="demo-layout-1">
<fieldset class="demo-spacing-1">
<legend>字段依赖策略</legend>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainDependency">保留依赖值</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainHidden">保留隐藏值</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="hideNote">隐藏备注开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="disableNote">禁用备注开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="defaultMemo">非空默认备注</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="extraRule">追加长度规则</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="booleanHidden = true"
>布尔隐藏策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanHidden = false"
>函数隐藏策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanDisabled = true"
>布尔禁用策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanDisabled = false"
>函数禁用策略</AsamButton
>
<AsamButton type="default" native-type="button" @click="fixedSourceMode = true"
>固定成员来源</AsamButton
>
<AsamButton type="default" native-type="button" @click="fixedSourceMode = false"
>依赖成员来源</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'east' })"
>
切换东区
</AsamButton>
<AsamButton type="default" native-type="button" @click="resetSchemaDefaults"
>使用schema默认值重置</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: '' })"
>
清空地区来源
</AsamButton>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="requiredMember">成员必填</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="extraMemberRule">成员枚举规则</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="hideMember">隐藏成员开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="disableMember">禁用成员开关</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="retainMemberHide">保留隐藏成员</AsamCheckboxItem>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="defaultMember">非空默认成员</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="booleanMemberHidden = true"
>成员布尔隐藏</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberHidden = false"
>成员函数隐藏</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberDisabled = true"
>成员布尔禁用</AsamButton
>
<AsamButton type="default" native-type="button" @click="booleanMemberDisabled = false"
>成员函数禁用</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ member: null })"
>
清空成员值
</AsamButton>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ member: 'west-alpha' })"
>
设置西区成员值
</AsamButton>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'hide-member' })"
>
成员隐藏地区
</AsamButton>
<!-- prettier-ignore -->
<AsamCheckboxItem v-model="alternateMemberPresentation">成员显示配置</AsamCheckboxItem>
<AsamButton type="default" native-type="button" @click="inspectMember"
>读取成员配置</AsamButton
>
</fieldset>
<AsamForm
ref="form"
v-model="model"
:schema="schema"
:inline="false"
size="default"
:show-search="false"
:show-reset="false"
@search="submitted = $event"
@reset="resetCount++"
@validate="validateCount++"
>
<template #actions="{ search, reset }">
<AsamButton type="default" native-type="button" @click="search"
>提交模型</AsamButton
>
<AsamButton type="default" native-type="button" @click="reset">重置模型</AsamButton>
</template>
</AsamForm>
<AsamButton type="default" native-type="button" @click="validate">执行校验</AsamButton>
<AsamButton type="default" native-type="button" @click="form?.clearValidate()"
>清除校验</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'hide' })"
>隐藏备注</AsamButton
>
<AsamButton
type="default"
native-type="button"
@click="form?.setFieldsValue({ region: 'west' })"
>切换西区</AsamButton
>
<AsamButton type="default" native-type="button" @click="resetInitial"
>设置初始值并重置</AsamButton
>
<AsamButton type="default" native-type="button" @click="inspect">读取公开字段</AsamButton>
<p class="example-paragraph" role="status">
校验:{{ validation }};校验事件:{{ validateCount }};重置:{{ resetCount }}
</p>
<pre data-testid="form-model">{{ JSON.stringify(model) }}</pre>
<pre data-testid="form-submitted">{{ JSON.stringify(submitted) }}</pre>
<pre data-testid="form-fields">{{ JSON.stringify(fields) }}</pre>
<pre data-testid="form-member-context">{{ JSON.stringify(memberContext) }}</pre>
</section>
</template>
<script setup>
defineOptions({ name: 'AsamFormDependenciesDemo' });
import { computed, ref } from 'vue';
import {
AsamCheckboxItem,
AsamButton,
AsamForm,
asamFormControls,
createAsamSchema,
defineAsamOptions
} from '@asam-ui/ui';
const model = ref({ region: 'east', note: '', member: null });
const submitted = ref(null);
const form = ref();
const retainDependency = ref(false);
const retainHidden = ref(false);
const hideNote = ref(false);
const disableNote = ref(false);
const booleanHidden = ref(false);
const booleanDisabled = ref(true);
const fixedSourceMode = ref(false);
const defaultMemo = ref(false);
const extraRule = ref(false);
const alternateMemberPresentation = ref(false);
const memberContext = ref({
present: false,
propMatches: false,
listContainsField: false,
count: 0
});
const requiredMember = ref(false);
const extraMemberRule = ref(false);
const hideMember = ref(false);
const disableMember = ref(false);
const retainMemberHide = ref(true);
const defaultMember = ref(false);
const booleanMemberHidden = ref(false);
const booleanMemberDisabled = ref(true);
const validation = ref('未执行');
const validateCount = ref(0);
const resetCount = ref(0);
const fields = ref({ count: 0, hasRegion: false });
const sources = new Map();
function sourceFor(region) {
if (!region) return undefined;
return ensureSource(region);
}
function ensureSource(region) {
let source = sources.get(region);
if (!source) {
source = defineAsamOptions().api({
api: async (_params, context) => {
await new Promise((done) => setTimeout(done, 100));
context.signal.throwIfAborted();
return [{ label: region + ' Alpha', value: region + '-alpha' }];
},
params: undefined,
transform: (rows) => rows,
fieldNames: { label: 'label', value: 'value' }
});
sources.set(region, source);
}
return source;
}
const builder = createAsamSchema()(asamFormControls);
const schema = computed(() => {
const hidden = hideNote.value;
const disabled = disableNote.value;
const memo = defaultMemo.value;
const memberHidden = hideMember.value;
const memberDisabled = disableMember.value;
const memberDefault = defaultMember.value;
const memberLabel = alternateMemberPresentation.value ? '地区成员' : '成员';
const memberPlaceholder = alternateMemberPresentation.value ? '请选择地区成员' : '选择地区成员';
return [
builder.field({
field: 'region',
component: 'Input',
label: '地区',
required: true,
defaultValue: () => 'east'
}),
builder.field({
field: 'note',
component: 'Input',
label: '备注',
required: true,
rules: extraRule.value ? [{ min: 2, message: '至少两个字符', trigger: 'blur' }] : [],
dependsOn: ['region'],
hidden: booleanHidden.value ? hidden : (current) => hidden || current.region === 'hide',
disabled: booleanDisabled.value
? disabled
: (current) => disabled && current.region === 'west',
onHide: retainHidden.value ? 'retain' : 'clear',
defaultValue: () => (memo ? '工厂默认备注' : '')
}),
fixedSourceMode.value
? builder.field({
field: 'member',
component: 'RemoteSelect',
label: memberLabel,
required: requiredMember.value,
rules: extraMemberRule.value
? [
{
type: 'enum',
enum: ['east-alpha'],
message: '仅东区成员',
trigger: 'change'
}
]
: [],
hidden: booleanMemberHidden.value
? memberHidden
: (current) => memberHidden || current.region === 'hide-member',
disabled: booleanMemberDisabled.value
? memberDisabled
: (current) => memberDisabled && current.region === 'west',
onHide: retainMemberHide.value ? 'retain' : 'clear',
dependsOn: ['region'],
dataSource: ensureSource('fixed'),
onDependencyChange: retainDependency.value ? 'retain' : 'clear',
componentProps: { teleported: false, placeholder: memberPlaceholder },
defaultValue: () => (memberDefault ? 'east-alpha' : null)
})
: builder.field({
field: 'member',
component: 'RemoteSelect',
label: memberLabel,
required: requiredMember.value,
rules: extraMemberRule.value
? [
{
type: 'enum',
enum: ['east-alpha'],
message: '仅东区成员',
trigger: 'change'
}
]
: [],
hidden: booleanMemberHidden.value
? memberHidden
: (current) => memberHidden || current.region === 'hide-member',
disabled: booleanMemberDisabled.value
? memberDisabled
: (current) => memberDisabled && current.region === 'west',
onHide: retainMemberHide.value ? 'retain' : 'clear',
dependsOn: ['region'],
resolveDataSource: (current) => sourceFor(current.region),
onDependencyChange: retainDependency.value ? 'retain' : 'clear',
componentProps: { teleported: false, placeholder: memberPlaceholder },
defaultValue: () => (memberDefault ? 'east-alpha' : null)
})
];
});
async function validate() {
try {
validation.value = (await form.value?.validate()) ? '有效' : '无效';
} catch {
validation.value = '无效';
}
}
function resetInitial() {
form.value?.setInitialValues({ region: 'west', note: '初始备注', member: null });
form.value?.resetFields();
}
function resetSchemaDefaults() {
form.value?.setInitialValues({});
form.value?.resetFields();
}
function inspectMember() {
const field = form.value?.getField('member');
memberContext.value = {
present: !!field,
propMatches: field?.prop === 'member',
listContainsField: !!field && (form.value?.fields ?? []).includes(field),
count: form.value?.fields.length ?? 0
};
}
function inspect() {
fields.value = {
count: form.value?.fields.length ?? 0,
hasRegion: !!form.value?.getField('region')
};
}
</script>
<style scoped>
.demo-layout-1 {
display: grid;
gap: var(--asam-space-md);
}
</style>
<style scoped>
.demo-spacing-1 {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
</style>
<style scoped>
p:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
</style>
布局、自定义注册和兼容字段 ​
完整示例用 custom:status 注册真正只发出 yes/no 的包装控件,componentProps.caption 为必填;宽 Input 不能代替窄枚举控件。 完整说明。
新表单使用带类型检查的 schema;旧 fields 仅用于兼容,不与 schema 同时提供。 完整说明。
完整布局场景记录四个公开事件:update:modelValue、search、reset 保留具体模型快照,validate 保留字段、布尔结果和消息。 完整说明。
在同一模型下切换布局、标签和尺寸,并控制内置操作按钮。 完整说明。
布局、兼容字段与自定义窄枚举
<template><StandaloneDemo /></template>
<script lang="ts" setup>
import * as __external0 from "vue";
import * as __external1 from "@asam-ui/ui";
const __external: any = {"vue": { ...__external0, __esModule: true },
"@asam-ui/ui": { ...__external1, __esModule: true }};
const __modules: any = {
"Demo.vue": (module: any, exports: any, require: any) => {
"use strict";
var __importDefault: any = function (mod?: any) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1: any = require("vue");
const vue_2: any = require("vue");
const _hoisted_1: any = { class: "demo-root-layout" };
const _hoisted_2: any = {
key: 0,
class: "demo-layout-1",
"data-testid": "options-state-contract-case"
};
const _hoisted_3: any = { "data-testid": "options-state-contract-result" };
const _hoisted_4: any = {
key: 1,
class: "demo-layout-2",
"data-testid": "source-contract-case"
};
const _hoisted_5: any = { "data-testid": "source-contract-result" };
const _hoisted_6: any = {
key: 2,
class: "demo-layout-3",
"data-testid": "normalizer-contract-case"
};
const _hoisted_7: any = { "data-testid": "normalizer-contract-result" };
const _hoisted_8: any = {
key: 3,
class: "demo-layout-4",
"data-testid": "mock-contract-case"
};
const _hoisted_9: any = { "data-testid": "mock-contract-result" };
const _hoisted_10: any = {
key: 4,
class: "demo-layout-5",
"data-testid": "runtime-contract-case"
};
const _hoisted_11: any = { "data-testid": "runtime-contract-result" };
const _hoisted_12: any = {
key: 5,
class: "demo-layout-6",
"data-testid": "control-source-types-case"
};
const _hoisted_13: any = { "data-testid": "control-source-types-registration" };
const _hoisted_14: any = { "data-testid": "control-source-types-load" };
const _hoisted_15: any = { "data-testid": "control-source-types-model" };
const _hoisted_16: any = { "data-testid": "control-source-types-settlement" };
const _hoisted_17: any = {
key: 6,
class: "demo-layout-7",
"data-testid": "reserved-props-case"
};
const _hoisted_18: any = { "data-testid": "reserved-props-state" };
const _hoisted_19: any = { "data-testid": "reserved-props-settlement" };
const _hoisted_20: any = {
key: 7,
class: "demo-layout-8",
"data-testid": "schema-union-case"
};
const _hoisted_21: any = { "data-testid": "schema-union-state" };
const _hoisted_22: any = { "data-testid": "schema-union-settlement" };
const _hoisted_23: any = {
key: 8,
class: "demo-layout-9",
"data-testid": "control-factory-case"
};
const _hoisted_24: any = { "data-testid": "control-factory-definition" };
const _hoisted_25: any = { "data-testid": "control-factory-constraints" };
const _hoisted_26: any = { "data-testid": "control-factory-model" };
const _hoisted_27: any = { "data-testid": "control-factory-settlement" };
const _hoisted_28: any = { class: "demo-layout-10" };
const _hoisted_29: any = {
key: 0,
class: "demo-layout-11",
"data-testid": "native-rule-case"
};
const _hoisted_30: any = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_31: any = { class: "demo-slot-layout" };
const _hoisted_32: any = { class: "demo-slot-actions" };
const _hoisted_33: any = { "data-testid": "native-rule-state" };
const _hoisted_34: any = { "data-testid": "native-rule-settlement" };
const _hoisted_35: any = { "data-testid": "native-rule-callback" };
const _hoisted_36: any = { "data-testid": "native-rule-fields" };
const _hoisted_37: any = {
key: 1,
class: "demo-layout-12",
"data-testid": "native-size-case"
};
const _hoisted_38: any = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_39: any = { class: "demo-slot-layout" };
const _hoisted_40: any = { class: "demo-slot-actions" };
const _hoisted_41: any = { "data-testid": "native-size-state" };
const _hoisted_42: any = {
key: 2,
class: "demo-layout-13",
"data-testid": "native-basic-case"
};
const _hoisted_43: any = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_44: any = { class: "demo-slot-layout" };
const _hoisted_45: any = { class: "demo-slot-actions" };
const _hoisted_46: any = { "data-testid": "native-basic-state" };
const _hoisted_47: any = {
key: 3,
class: "demo-layout-14",
"data-testid": "native-inline-case"
};
const _hoisted_48: any = { "data-testid": "native-inline-state" };
const _hoisted_49: any = {
key: 4,
class: "demo-layout-15",
"data-testid": "dynamic-case"
};
const _hoisted_50: any = { class: "demo-slot-layout" };
const _hoisted_51: any = { "data-testid": "dynamic-state" };
const _hoisted_52: any = { "data-testid": "dynamic-settlement" };
const _hoisted_53: any = { "data-testid": "dynamic-callback" };
const _hoisted_54: any = { "data-testid": "dynamic-fields" };
const _hoisted_55: any = {
key: 5,
class: "demo-layout-16",
"data-testid": "alignment-case"
};
const _hoisted_56: any = {
role: "radiogroup",
"aria-label": "标签位置"
};
const _hoisted_57: any = {
role: "radiogroup",
"aria-label": "项目标签位置"
};
const _hoisted_58: any = { "data-testid": "alignment-state" };
const _hoisted_59: any = {
key: 6,
class: "demo-layout-17",
"data-testid": "accessibility-case"
};
const _hoisted_60: any = { class: "demo-slot-layout" };
const _hoisted_61: any = { "data-testid": "accessibility-state" };
const _hoisted_62: any = {
key: 7,
class: "demo-layout-18",
"data-testid": "validation-case"
};
const _hoisted_63: any = { "data-testid": "validation-case-state" };
const _hoisted_64: any = { "data-testid": "validation-case-settlement" };
const _hoisted_65: any = { "data-testid": "validation-case-callback" };
const _hoisted_66: any = { "data-testid": "validation-case-fields" };
const _hoisted_67: any = { class: "demo-spacing-1" };
const _hoisted_68: any = { class: "demo-spacing-2" };
const _hoisted_69: any = { class: "demo-spacing-3" };
const _hoisted_70: any = {
class: "demo-layout-19",
"data-testid": "layout-scroll-host",
style: { "max-height": "280px", "overflow-y": "auto" }
};
const _hoisted_71: any = { "data-testid": "layout-native-item-label" };
const _hoisted_72: any = { "data-testid": "layout-native-item-error" };
const _hoisted_73: any = { "data-testid": "layout-form-native-fields" };
const _hoisted_74: any = { "data-testid": "layout-form-native-subset" };
const _hoisted_75: any = { "data-testid": "layout-form-native-subset-callback" };
const _hoisted_76: any = { "data-testid": "layout-native-item-state" };
const _hoisted_77: any = { "data-testid": "layout-native-item-settlement" };
const _hoisted_78: any = { "data-testid": "layout-native-item-callback" };
const _hoisted_79: any = {
class: "example-paragraph",
role: "status",
"data-testid": "layout-form-status"
};
const _hoisted_80: any = {
class: "form-events",
"data-testid": "layout-form-events"
};
const _hoisted_81: any = { "data-testid": "layout-form-validation-settlement" };
const _hoisted_82: any = { "data-testid": "layout-form-callback" };
const _hoisted_83: any = { "data-testid": "layout-form-state" };
const ui_1: any = require("@asam-ui/ui");
const vue_3: any = require("vue");
const ui_2: any = require("@asam-ui/ui");
const ui_3: any = require("@asam-ui/ui");
const ui_4: any = require("@asam-ui/ui");
const vue_4: any = require("vue");
const vue_5: any = require("vue");
const ui_5: any = require("@asam-ui/ui");
const ui_6: any = require("@asam-ui/ui");
const NarrowChoice_vue_1: any = __importDefault(require("./NarrowChoice.vue"));
exports.default = (0, vue_1.defineComponent)({
...{ name: 'AsamFormLayoutRegistryDemo' },
__name: 'Demo',
setup(__props?: any) {
const model: any = (0, vue_5.ref)({ name: '', status: 'no' });
const form: any = (0, vue_5.ref)();
const builtinActions: any = (0, vue_5.ref)(false);
const showSearch: any = (0, vue_5.ref)(false);
const showReset: any = (0, vue_5.ref)(false);
const customActionText: any = (0, vue_5.ref)(false);
const labelWidth: any = (0, vue_5.ref)(120);
const labelSuffixEnabled: any = (0, vue_5.ref)(false);
const hideRequiredAsterisk: any = (0, vue_5.ref)(false);
const asteriskRight: any = (0, vue_5.ref)(false);
const hideMessages: any = (0, vue_5.ref)(false);
const inlineMessage: any = (0, vue_5.ref)(false);
const statusIcon: any = (0, vue_5.ref)(false);
const disabled: any = (0, vue_5.ref)(false);
const singleNativeRule: any = (0, vue_5.ref)(false);
const validateOnRuleChange: any = (0, vue_5.ref)(true);
const legacy: any = (0, vue_5.ref)(false);
const inline: any = (0, vue_5.ref)(false);
const labelPosition: any = (0, vue_5.ref)('right');
const labelMode: any = (0, vue_5.ref)('visible');
const size: any = (0, vue_5.ref)('default');
const scrollToError: any = (0, vue_5.ref)(true);
const omitScrollError: any = (0, vue_5.ref)(false);
const scrollMode: any = (0, vue_5.ref)('object');
const scrollIntoViewOptions: any = (0, vue_5.computed)(() => {
if (scrollMode.value === 'true')
return true;
if (scrollMode.value === 'false')
return false;
if (scrollMode.value === 'object')
return { behavior: 'auto', block: 'center' };
return undefined;
});
const scrollOptionsBinding: any = (0, vue_5.computed)(() => scrollMode.value === 'omitted' ? {} : { scrollIntoViewOptions: scrollIntoViewOptions.value });
// Runtime-only native omission/undefined probe; normal typed usage omits an absent value.
const nativeScrollBinding: any = (0, vue_5.computed)(() => ({
...scrollOptionsBinding.value,
...(omitScrollError.value ? {} : { scrollToError: scrollToError.value })
}));
const validationSettlement: any = (0, vue_5.ref)();
const result: any = (0, vue_5.ref)('');
const events: any = (0, vue_5.ref)([]);
function recordModel(name?: any, value?: any) {
events.value.push({ name, payload: { ...value } });
}
const callback: any = (0, vue_5.ref)();
const validated: any = (0, vue_5.ref)([]);
const narrow: any = (0, ui_6.defineAsamControl)({
component: NarrowChoice_vue_1.default,
emptyValue: () => 'no',
sourceKinds: []
});
const registry: any = { 'custom:status': narrow };
const builder: any = (0, ui_6.createAsamSchema)()({ ...ui_6.asamFormControls, ...registry });
const schema: any = [
builder.field({ field: 'name', component: 'Input', label: '姓名', defaultValue: () => '' }),
builder.field({
field: 'status',
component: 'custom:status',
label: '状态',
componentProps: { caption: '窄枚举状态' }
})
];
const fields: any = [
{ key: 'name', label: '姓名', type: 'input', defaultValue: '' },
{
key: 'status',
label: '状态',
type: 'select',
defaultValue: 'no',
options: [
{ label: '是', value: 'yes' },
{ label: '否', value: 'no' }
]
}
];
const rules: any = {
name: [
{ required: true, message: '请输入姓名', trigger: 'change' },
{ min: 2, message: '姓名至少两个字符', trigger: 'change' }
]
};
const nativeRules: any = (0, vue_5.computed)(() => singleNativeRule.value
? { name: { min: 5, message: '姓名至少五个字符', trigger: 'change' } }
: rules);
const onValidate: any = (...args: any) => {
validated.value.push({ field: String(args[0]), valid: args[1] });
events.value.push({
name: 'validate',
payload: { field: args[0], valid: args[1], message: args[2] }
});
};
const nativeSubsetSettlement: any = (0, vue_5.ref)();
const nativeSubsetCallback: any = (0, vue_5.ref)();
const nativeFieldsSnapshot: any = (0, vue_5.ref)();
let nativeSubsetSequence: any = 0;
function readNativeFields() {
const fields: any = form.value?.fields ?? [];
const name: any = form.value?.getField('name');
const status: any = form.value?.getField('status');
nativeFieldsSnapshot.value = {
count: fields.length,
keys: fields.map((field?: any) => Array.isArray(field.prop) ? field.prop.join('.') : field.prop),
sameArrayAndStringLookup: name !== undefined && name === form.value?.getField(['name']),
nameInFields: name !== undefined && fields.includes(name),
statusInFields: status !== undefined && fields.includes(status),
missingIsUndefined: form.value?.getField('missing') === undefined,
nameValue: name?.fieldValue,
statusValue: status?.fieldValue
};
}
async function validateNativeSubset(selector: any = undefined) {
const id: any = ++nativeSubsetSequence;
const selectorLabel: any = selector === undefined
? 'all'
: typeof selector === 'string'
? selector
: JSON.stringify(selector);
try {
const fulfilledValue: any = await form.value?.validateField(selector);
nativeSubsetSettlement.value = {
id,
selector: selectorLabel,
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error: any) {
nativeSubsetSettlement.value = {
id,
selector: selectorLabel,
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
async function validateNativeSubsetCallback() {
const id: any = ++nativeSubsetSequence;
const fulfilledValue: any = await form.value?.validateField(['name'], (valid?: any, fields?: any) => {
nativeSubsetCallback.value = { valid, fields: Object.keys(fields ?? {}) };
});
nativeSubsetSettlement.value = {
id,
selector: 'callback-name',
settledKind: 'fulfilled',
fulfilledValue
};
}
const nativeItemEnabled: any = (0, vue_5.ref)(false);
const nativeItem: any = (0, vue_5.ref)();
const itemArrayPath: any = (0, vue_5.ref)(false);
const itemLabelSlot: any = (0, vue_5.ref)(false);
const itemErrorSlot: any = (0, vue_5.ref)(false);
const itemRulesEnabled: any = (0, vue_5.ref)(true);
const itemRequired: any = (0, vue_5.ref)(true);
const itemLabelText: any = (0, vue_5.ref)('嵌套昵称');
const itemRequiredMode: any = (0, vue_5.ref)('explicit');
// Runtime-only native omission/undefined probe, outside the typed component-props contract.
const itemRequiredBinding: any = (0, vue_5.computed)(() => itemRequiredMode.value === 'omitted'
? {}
: { required: itemRequiredMode.value === 'undefined' ? undefined : itemRequired.value });
const itemArrayRules: any = (0, vue_5.ref)(false);
const itemHideMessage: any = (0, vue_5.ref)(false);
const itemInlineMessage: any = (0, vue_5.ref)(false);
const itemExternalError: any = (0, vue_5.ref)(false);
const itemForcedSuccess: any = (0, vue_5.ref)(false);
const itemLabelPosition: any = (0, vue_5.ref)('right');
const itemLabelWidth: any = (0, vue_5.ref)(120);
const itemSize: any = (0, vue_5.ref)('default');
const itemRules: any = (0, vue_5.computed)(() => !itemRulesEnabled.value
? undefined
: itemArrayRules.value
? [
{ required: true, message: '昵称必填', trigger: ['blur', 'change'] },
{ min: 3, message: '昵称至少三个字符', trigger: 'change' }
]
: { required: true, message: '昵称必填', trigger: 'blur' });
const nativeItemSnapshot: any = (0, vue_5.ref)();
const nativeItemSettlement: any = (0, vue_5.ref)();
const nativeItemCallback: any = (0, vue_5.ref)();
let nativeItemSequence: any = 0;
function enableNativeItem() {
model.value = { ...model.value, profile: { nickname: '' } };
nativeItemEnabled.value = true;
}
function disableNativeItem() {
nativeItemEnabled.value = false;
model.value = { name: model.value.name, status: model.value.status };
}
function updateNickname(value?: any) {
model.value = { ...model.value, profile: { nickname: String(value) } };
}
function readNativeItem() {
const field: any = form.value?.getField('profile.nickname');
nativeItemSnapshot.value = {
size: nativeItem.value?.size ?? '',
message: nativeItem.value?.validateMessage ?? '',
state: nativeItem.value?.validateState ?? '',
count: form.value?.fields.length ?? 0,
sameNestedLookup: field !== undefined && field === form.value?.getField(['profile', 'nickname']),
nestedInFields: field !== undefined && (form.value?.fields.includes(field) ?? false),
nestedMissingIsUndefined: form.value?.getField('profile.missing') === undefined &&
form.value?.getField(['profile', 'missing']) === undefined,
nativeContextState: field?.validateState ?? '',
nativeContextMessage: field?.validateMessage ?? '',
nameState: form.value?.getField('name')?.validateState ?? '',
nameMessage: form.value?.getField('name')?.validateMessage ?? '',
nameInitialKind: typeof form.value?.getField('name')?.getInitialValue(),
statusInitialKind: typeof form.value?.getField('status')?.getInitialValue(),
nestedInitialKind: typeof field?.getInitialValue(),
value: field?.fieldValue,
model: {
...model.value,
...(model.value.profile ? { profile: { ...model.value.profile } } : {})
}
};
}
async function validateNativeNestedCallback() {
const id: any = ++nativeSubsetSequence;
const fulfilledValue: any = await form.value?.validateField([['profile', 'nickname']], (valid?: any, fields?: any) => {
nativeSubsetCallback.value = { valid, fields: Object.keys(fields ?? {}) };
});
nativeSubsetSettlement.value = {
id,
selector: 'callback-nested',
settledKind: 'fulfilled',
fulfilledValue
};
}
async function validateNativeItem(trigger?: any, withCallback: any = false) {
const id: any = ++nativeItemSequence;
try {
const fulfilledValue: any = await nativeItem.value?.validate(trigger, withCallback
? (valid?: any, fields?: any) => {
nativeItemCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
nativeItemSettlement.value = {
id,
selector: trigger,
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error: any) {
nativeItemSettlement.value = {
id,
selector: trigger,
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
const validationCase: any = (0, vue_5.ref)();
const validationModel: any = (0, vue_5.ref)({ password: '', confirm: '', age: '' });
const validationForm: any = (0, vue_5.ref)();
const validationCaseSettlement: any = (0, vue_5.ref)();
const validationCaseCallback: any = (0, vue_5.ref)();
const validationCaseFields: any = (0, vue_5.ref)([]);
const validationEvents: any = (0, vue_5.ref)([]);
const ageValidationPending: any = (0, vue_5.ref)(false);
const confirmRevalidation: any = (0, vue_5.ref)();
let validationCaseSequence: any = 0;
function openValidationCase(kind?: any) {
validationModel.value = { password: '', confirm: '', age: '' };
validationCase.value = kind;
}
const onValidationCaseEvent: any = (...args: any) => {
validationEvents.value.push({ field: String(args[0]), valid: args[1], message: args[2] });
};
function updateValidationText(field?: any, value?: any) {
validationModel.value = { ...validationModel.value, [field]: String(value) };
}
function updateValidationAge(value?: any) {
const parsed: any = Number.parseFloat(String(value));
validationModel.value = {
...validationModel.value,
age: Number.isNaN(parsed) ? String(value) : parsed
};
}
async function revalidateConfirmation() {
try {
const fulfilledValue: any = await validationForm.value?.validateField('confirm');
confirmRevalidation.value = { settledKind: 'fulfilled', fulfilledValue };
}
catch (error: any) {
confirmRevalidation.value = {
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
const validatePassword: any = (_rule?: any, value?: any, callback?: any) => {
if (typeof value !== 'string' || value.length < 6)
return callback(new Error('密码至少六个字符'));
callback();
if (validationModel.value.confirm !== '')
void revalidateConfirmation();
};
const validateConfirmation: any = (_rule?: any, value?: any, callback?: any) => {
if (value === '')
callback(new Error('请输入确认密码'));
else if (value !== validationModel.value.password)
callback(new Error('两次密码不一致'));
else
callback();
};
const validateAge: any = (_rule?: any, value?: any, callback?: any) => {
if (value === '')
return callback(new Error('请输入年龄'));
ageValidationPending.value = true;
setTimeout(() => {
ageValidationPending.value = false;
if (!Number.isInteger(value))
callback(new Error('年龄必须为整数'));
else if (Number(value) < 18)
callback(new Error('年龄必须至少十八岁'));
else
callback();
}, 500);
};
const validationRules: any = (0, vue_5.computed)(() => validationCase.value === 'number'
? {
age: [
{ required: true, message: '年龄必填', trigger: 'blur' },
{ type: 'number', message: '年龄必须是数字', trigger: 'blur' }
]
}
: {
password: [{ validator: validatePassword, trigger: 'blur' }],
confirm: [{ validator: validateConfirmation, trigger: 'blur' }],
age: [{ validator: validateAge, trigger: 'blur' }]
});
function readValidationCase() {
validationCaseFields.value = (validationForm.value?.fields ?? []).map((field?: any) => ({
field: field.propString,
state: field.validateState,
message: field.validateMessage
}));
}
async function validateCase(withCallback?: any) {
const id: any = ++validationCaseSequence;
try {
const fulfilledValue: any = await validationForm.value?.validate(withCallback
? (valid?: any, fields?: any) => {
validationCaseCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
validationCaseSettlement.value = {
id,
selector: withCallback ? 'callback' : 'all',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error: any) {
validationCaseSettlement.value = {
id,
selector: 'all',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
const compositionCase: any = (0, vue_5.ref)();
const alignmentModel: any = (0, vue_5.ref)({ name: '', region: '', type: '' });
const alignmentFormPositions: any = [
'left',
'right',
'top'
];
const alignmentItemPositions: any = [
'',
'left',
'right',
'top'
];
const alignmentFormPosition: any = (0, vue_5.ref)('right');
const alignmentItemPosition: any = (0, vue_5.ref)('');
const alignmentFields: any = [
{ key: 'name', label: '姓名' },
{ key: 'region', label: '活动区域' },
{ key: 'type', label: '活动表单' }
];
function updateAlignment(field?: any, value?: any) {
alignmentModel.value = { ...alignmentModel.value, [field]: String(value) };
}
const accessibilityModel: any = (0, vue_5.ref)({ fullName: '', firstName: '', lastName: '' });
function updateAccessibility(field?: any, value?: any) {
accessibilityModel.value = { ...accessibilityModel.value, [field]: String(value) };
}
const dynamicCase: any = (0, vue_5.ref)(false);
const dynamicModel: any = (0, vue_5.ref)({ email: '', domains: [{ key: 1, value: '' }] });
const dynamicForm: any = (0, vue_5.ref)();
const dynamicSettlement: any = (0, vue_5.ref)();
const dynamicCallback: any = (0, vue_5.ref)();
const dynamicEvents: any = (0, vue_5.ref)([]);
const dynamicFields: any = (0, vue_5.ref)();
let dynamicKey: any = 1;
let dynamicSequence: any = 0;
const dynamicRules: any = (0, vue_5.computed)(() => ({
email: [
{ required: true, message: '请输入邮箱地址', trigger: 'blur' },
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}
]
}));
function updateDynamicEmail(value?: any) {
dynamicModel.value = { ...dynamicModel.value, email: String(value) };
}
function updateDynamicDomain(key?: any, value?: any) {
dynamicModel.value = {
...dynamicModel.value,
domains: dynamicModel.value.domains.map((domain?: any) => domain.key === key ? { ...domain, value: String(value) } : domain)
};
}
function addDynamicDomain() {
dynamicModel.value = {
...dynamicModel.value,
domains: [...dynamicModel.value.domains, { key: ++dynamicKey, value: '' }]
};
}
function removeDynamicDomain(key?: any) {
dynamicModel.value = {
...dynamicModel.value,
domains: dynamicModel.value.domains.filter((domain?: any) => domain.key !== key)
};
}
const onDynamicValidate: any = (...args: any) => {
dynamicEvents.value.push({ field: args[0], valid: args[1], message: args[2] });
};
function readDynamicFields() {
const field: any = dynamicForm.value?.getField('domains.0.value');
dynamicFields.value = {
fields: (dynamicForm.value?.fields ?? []).map((field?: any) => ({
prop: field.propString,
state: field.validateState,
message: field.validateMessage,
value: field.fieldValue
})),
sameSegmentedLookup: field !== undefined && field === dynamicForm.value?.getField(['domains', '0', 'value']),
removedIndexMissing: dynamicForm.value?.getField('domains.' + dynamicModel.value.domains.length + '.value') === undefined
};
}
async function validateDynamic(withCallback?: any) {
const id: any = ++dynamicSequence;
try {
const fulfilledValue: any = await dynamicForm.value?.validate(withCallback
? (valid?: any, fields?: any) => {
dynamicCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
dynamicSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error: any) {
dynamicSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
async function validate() {
try {
const fulfilledValue: any = await form.value?.validate();
validationSettlement.value = { settledKind: 'fulfilled', fulfilledValue };
result.value = fulfilledValue ? 'valid' : 'invalid';
}
catch (error: any) {
validationSettlement.value = {
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
result.value = 'invalid';
}
}
async function validateWithCallback() {
result.value = (await form.value?.validate((valid?: any, fields?: any) => {
callback.value = { valid, fields: Object.keys(fields ?? {}) };
}))
? 'valid'
: 'invalid';
}
const nativeComposition: any = (0, vue_5.ref)();
const nativeZones: any = [
{ value: 'shanghai', label: '区域一', raw: { city: 'shanghai' } },
{ value: 'beijing', label: '区域二', raw: { city: 'beijing' } }
];
const nativeActivityTypes: any = [
'Online activities',
'Promotion activities',
'Offline activities',
'Simple brand exposure'
];
const basicActivity: any = (0, vue_5.ref)({
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
});
const inlineActivity: any = (0, vue_5.ref)({ user: '', region: '', date: '' });
const basicSubmissions: any = (0, vue_5.ref)([]), inlineSubmissions: any = (0, vue_5.ref)([]);
function updateBasicActivity(patch?: any) {
basicActivity.value = { ...basicActivity.value, ...patch };
}
function updateInlineActivity(patch?: any) {
inlineActivity.value = { ...inlineActivity.value, ...patch };
}
function submitBasicActivity() {
basicSubmissions.value.push({ ...basicActivity.value, type: [...basicActivity.value.type] });
}
function submitInlineActivity() {
inlineSubmissions.value.push({ ...inlineActivity.value });
}
function nativeDateFacts(value?: any) {
return value instanceof Date
? {
kind: 'Date',
year: value.getFullYear(),
month: value.getMonth() + 1,
day: value.getDate(),
hours: value.getHours(),
minutes: value.getMinutes(),
seconds: value.getSeconds()
}
: { kind: value === null ? 'null' : typeof value, value };
}
const nativeSizes: any = ['large', 'big', 'default', 'small'];
const nativeSizeTypes: any = ['Online activities', 'Promotion activities'];
const nativeSize: any = (0, vue_5.ref)('default');
const nativeSizePosition: any = (0, vue_5.ref)('right');
const sizeActivity: any = (0, vue_5.ref)({
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
});
const sizeSubmissions: any = (0, vue_5.ref)([]);
function updateNativeSize(value?: any) {
if (value === 'large' || value === 'big' || value === 'default' || value === 'small')
nativeSize.value = value;
}
function updateNativeSizePosition(value?: any) {
if (value === 'left' || value === 'right' || value === 'top')
nativeSizePosition.value = value;
}
function updateSizeActivity(patch?: any) {
sizeActivity.value = { ...sizeActivity.value, ...patch };
}
function submitSizeActivity() {
sizeSubmissions.value.push({ ...sizeActivity.value, type: [...sizeActivity.value.type] });
}
const nativeRuleModel: any = (0, vue_5.ref)({
name: 'Hello',
region: '',
count: '',
date1: '',
date2: '',
delivery: false,
location: '',
type: [],
resource: '',
desc: ''
});
const nativeRuleForm: any = (0, vue_5.ref)();
const nativeCountOptions: any = Array.from({ length: 10000 }, (_?: any, index?: any) => ({
value: String(index + 1),
label: String(index + 1),
raw: { count: index + 1 }
}));
const nativeLocations: any = ['Home', 'Company', 'School'];
const nativeRuleRules: any = {
name: [
{ required: true, message: '请输入活动名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度应为 3 到 5 个字符', trigger: 'blur' }
],
region: [{ required: true, message: '请选择活动区域', trigger: 'change' }],
count: [{ required: true, message: '请选择活动人数', trigger: 'change' }],
date1: [{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }],
date2: [{ type: 'date', required: true, message: '请选择时间', trigger: 'change' }],
location: [{ required: true, message: '请选择地点', trigger: 'change' }],
type: [
{
type: 'array',
required: true,
message: '请至少选择一种活动类型',
trigger: 'change'
}
],
resource: [{ required: true, message: '请选择活动资源', trigger: 'change' }],
desc: [{ required: true, message: '请输入活动说明', trigger: 'blur' }]
};
const nativeRuleSettlement: any = (0, vue_5.ref)(), nativeRuleCallback: any = (0, vue_5.ref)();
const nativeRuleFields: any = (0, vue_5.ref)([]), nativeRuleEvents: any = (0, vue_5.ref)([]), nativeRuleSubmissions: any = (0, vue_5.ref)([]);
let nativeRuleSequence: any = 0;
function updateNativeRule(patch?: any) {
nativeRuleModel.value = { ...nativeRuleModel.value, ...patch };
}
const onNativeRuleValidate: any = (...args: any) => {
nativeRuleEvents.value.push({ field: args[0], valid: args[1], message: args[2] });
};
function readNativeRuleFields() {
nativeRuleFields.value = (nativeRuleForm.value?.fields ?? []).map((field?: any) => ({
prop: field.propString,
state: field.validateState,
message: field.validateMessage,
value: field.fieldValue
}));
}
async function validateNativeRule(withCallback?: any) {
const id: any = ++nativeRuleSequence;
try {
const fulfilledValue: any = await nativeRuleForm.value?.validate(withCallback
? (valid?: any, fields?: any) => {
nativeRuleCallback.value = { valid, fields: Object.keys(fields ?? {}) };
if (valid)
nativeRuleSubmissions.value.push({
...nativeRuleModel.value,
type: [...nativeRuleModel.value.type]
});
}
: undefined);
nativeRuleSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error: any) {
nativeRuleSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
const protocolSourceKinds: any = [], protocolRequiredProps: any = ['placeholder'];
const protocolControl: any = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: protocolSourceKinds,
requiredProps: protocolRequiredProps,
suspendable: false
});
const protocolRegistry: any = Object.freeze({ 'custom:code': protocolControl });
const protocolBuilder: any = (0, ui_6.createAsamSchema)()(protocolRegistry);
const protocolFieldConfig: any = {
field: 'code',
component: 'custom:code',
label: '注册编码',
componentProps: { placeholder: '输入注册编码' },
defaultValue: () => 'Default',
rules: [
{ required: true, message: '请输入注册编码', trigger: 'blur' },
{ min: 3, message: '编码至少三位', trigger: 'blur' }
]
};
const protocolField: any = protocolBuilder.field(protocolFieldConfig);
const protocolSchema: any = [protocolField], protocolModel: any = (0, vue_5.ref)({ code: 'Seed' }), protocolForm: any = (0, vue_5.ref)();
const protocolEmptyArrays: any = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => [],
sourceKinds: [],
suspendable: true
});
const firstProtocolEmpty: any = protocolEmptyArrays.emptyValue(), secondProtocolEmpty: any = protocolEmptyArrays.emptyValue();
firstProtocolEmpty.push('changed');
protocolRequiredProps.push('placeholder');
const protocolDefinition: any = {
controlFrozen: Object.isFrozen(protocolControl),
kindsFrozen: Object.isFrozen(protocolControl.sourceKinds),
requiredFrozen: Object.isFrozen(protocolControl.requiredProps),
requiredProps: [...(protocolControl.requiredProps ?? [])],
kinds: [...protocolControl.sourceKinds],
inputComponentIdentity: protocolControl.component === ui_6.AsamInput,
suspendable: protocolControl.suspendable,
emptyValue: protocolControl.emptyValue(),
schemaIdentity: protocolField === protocolFieldConfig,
schemaComponentPropsIdentity: protocolField.componentProps === protocolFieldConfig.componentProps,
originalModel: { code: 'Seed' },
firstEmpty: firstProtocolEmpty,
secondEmpty: secondProtocolEmpty,
emptyArraysIndependent: firstProtocolEmpty !== secondProtocolEmpty
};
const protocolConstraints: any = (0, vue_5.ref)([]);
function checkProtocolRegistration() {
const valid: any = { component: ui_6.AsamInput, emptyValue: () => '', sourceKinds: [] };
const invalid: any = [
['null', null],
['component-missing', { ...valid, component: undefined }],
['component-string', { ...valid, component: 'input' }],
['component-number', { ...valid, component: 1 }],
['emptyValue-missing', { ...valid, emptyValue: undefined }],
['emptyValue-value', { ...valid, emptyValue: '' }],
['suspendable-string', { ...valid, suspendable: 'true' }],
['sourceKinds-missing', { ...valid, sourceKinds: undefined }],
['sourceKinds-unknown', { ...valid, sourceKinds: ['other'] }],
['sourceKinds-duplicate', { ...valid, sourceKinds: ['static', 'static'] }],
['requiredProps-string', { ...valid, requiredProps: 'placeholder' }],
['requiredProps-duplicate', { ...valid, requiredProps: ['placeholder', 'placeholder'] }],
['requiredProps-empty-key', { ...valid, requiredProps: [''] }],
['requiredProps-number', { ...valid, requiredProps: [1] }]
];
protocolConstraints.value = invalid.map(([name, config]: any) => {
try {
(Reflect.apply(ui_6.defineAsamControl, undefined, [config]) as any);
return { name, rejected: false, kind: undefined, message: '' };
}
catch (error: any) {
return {
name,
rejected: true,
kind: error !== null && typeof error === 'object'
? Reflect.get(error, 'kind')
: undefined,
message: error instanceof Error ? error.message : String(error)
};
}
});
}
const protocolSettlement: any = (0, vue_5.ref)(), protocolValidateId: any = (0, vue_5.ref)(0);
async function validateProtocolControl() {
const id: any = ++protocolValidateId.value;
await protocolForm.value?.validate((valid?: any, fields?: any) => {
protocolSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...protocolModel.value }
};
});
}
const unionCommon: any = {
field: 'code',
label: '协议编码',
defaultValue: () => 'UnionDefault',
required: true,
rules: [{ min: 3, message: '协议编码至少三位', trigger: 'blur' }]
};
const fixedOptionalUnion: any = {
...unionCommon,
component: 'Input'
};
const derivedOptionalUnion: any = {
...unionCommon,
component: 'Input',
resolveDataSource: () => undefined
};
const fixedRequiredUnion: any = {
...unionCommon,
component: 'custom:code',
componentProps: { placeholder: '协议必填占位' }
};
const derivedRequiredUnion: any = {
...unionCommon,
component: 'custom:code',
componentProps: { placeholder: '协议必填占位' },
resolveDataSource: () => undefined
};
const unionSourceMode: any = (0, vue_5.ref)('fixed'), unionPropsMode: any = (0, vue_5.ref)('optional');
const unionSchema: any = (0, vue_5.computed)(() => [
unionPropsMode.value === 'optional'
? unionSourceMode.value === 'fixed'
? fixedOptionalUnion
: derivedOptionalUnion
: unionSourceMode.value === 'fixed'
? fixedRequiredUnion
: derivedRequiredUnion
]);
const unionModel: any = (0, vue_5.ref)({ code: 'Seed' }), unionForm: any = (0, vue_5.ref)(), unionId: any = (0, vue_5.ref)(0), unionSettlement: any = (0, vue_5.ref)();
async function validateUnionField() {
const id: any = ++unionId.value;
await unionForm.value?.validate((valid?: any, fields?: any) => {
unionSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...unionModel.value }
};
});
}
const reservedPropKeys: any = [
'modelValue',
'update:modelValue',
'onUpdate:modelValue',
'options',
'api',
'request',
'dictType',
'dataSource',
'transform',
'multiple',
'valueMode',
'multipleValueMode',
'separator'
];
const safeReservedProps: any = {
placeholder: '合法控件属性',
maxlength: 40,
clearable: true
};
const reservedControl: any = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: [],
requiredProps: ['placeholder']
});
const reservedRegistry: any = Object.freeze({ 'custom:reservedCode': reservedControl });
// Raw schema input demonstrates runtime rejection of externally supplied componentProps.
const reservedProps: any = (0, vue_5.ref)(safeReservedProps), reservedAttempt: any = (0, vue_5.ref)();
const reservedModel: any = (0, vue_5.ref)({ code: 'ReservedSeed' }), reservedForm: any = (0, vue_5.ref)();
let reservedResolverCalls: any = 0, reservedStateId: any = 0, reservedValidationId: any = 0;
const reservedSchema: any = (0, vue_5.computed)(() => [
{
field: 'code',
component: 'custom:reservedCode',
label: '属性编码',
required: true,
defaultValue: () => 'ReservedDefault',
componentProps: reservedProps.value,
resolveDataSource: () => {
reservedResolverCalls++;
return undefined;
}
}
]);
const reservedState: any = (0, vue_5.ref)();
const reservedSettlement: any = (0, vue_5.ref)();
function attemptReservedProp(key?: any) {
reservedAttempt.value = key;
reservedProps.value = { ...safeReservedProps, [key]: 'Forbidden' };
}
function restoreReservedProps() {
reservedAttempt.value = undefined;
reservedProps.value = safeReservedProps;
}
function captureReservedState() {
reservedState.value = {
id: ++reservedStateId,
model: { ...reservedModel.value },
keys: Object.keys(reservedProps.value),
...(reservedAttempt.value === undefined ? {} : { attempt: reservedAttempt.value }),
resolverCalls: reservedResolverCalls
};
}
async function validateReservedForm() {
const id: any = ++reservedValidationId;
await reservedForm.value?.validate((valid?: any, fields?: any) => {
reservedSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...reservedModel.value }
};
});
}
const controlSourceKeys: any = ['static', 'api', 'request', 'dict'];
const controlSourceCalls: any = { api: 0, request: 0, dict: 0 };
const sourceTypeRuntime: any = (0, ui_4.createAsamDataRuntime)({
scope: 'complete-control-source-types',
provider: {
request: async (_config?: any, context?: any) => {
context.signal.throwIfAborted();
controlSourceCalls.request++;
return [{ label: 'Request option', value: 'request-value' }];
},
dict: {
get: async (_type?: any, context?: any) => {
context.signal.throwIfAborted();
controlSourceCalls.dict++;
return [{ label: 'Dict option', value: 'dict-value' }];
}
}
}
});
(0, vue_4.onBeforeUnmount)(() => sourceTypeRuntime.invalidate());
const controlSources: any = {
static: (0, ui_4.defineAsamOptions)().static({
options: [{ label: 'Static option', value: 'static-value' }]
}),
api: (0, ui_4.defineAsamOptions)().api({
api: async (_params?: any, context?: any) => {
context.signal.throwIfAborted();
controlSourceCalls.api++;
return [{ label: 'Api option', value: 'api-value' }];
},
params: undefined
}),
request: (0, ui_4.defineAsamOptions)().request({
request: { method: 'get', url: '/local-control-types' }
}),
dict: (0, ui_4.defineAsamDictSource)({ dictType: 'local-control-types' })
};
const sourceTypeOptions: any = (0, vue_5.ref)([]), sourceTypeModel: any = (0, vue_5.ref)({ choice: null }), sourceTypeForm: any = (0, vue_5.ref)();
const sourceTypeBuilder: any = (0, ui_6.createAsamSchema)()(ui_6.asamFormControls);
const sourceTypeSchema: any = (0, vue_5.computed)(() => [
sourceTypeBuilder.field({
field: 'choice',
component: 'Select',
label: '来源选项',
required: true,
defaultValue: () => null,
dataSource: (0, ui_4.defineAsamOptions)().static({
options: sourceTypeOptions.value,
fieldNames: { label: 'label', value: 'value' }
}),
componentProps: { teleported: false, placeholder: '选择解析结果' }
})
]);
let sourceTypeLoadId: any = 0, sourceTypeValidationId: any = 0;
const controlSourceLoad: any = (0, vue_5.ref)();
const sourceTypeSettlement: any = (0, vue_5.ref)();
async function loadControlSource(kind?: any) {
const context: any = sourceTypeRuntime.createContext();
try {
const source: any = controlSources[kind], options: any = await (0, ui_4.resolveAsamOptions)(source, {
...(sourceTypeRuntime.provider ? { provider: sourceTypeRuntime.provider } : {}),
context
});
sourceTypeOptions.value = options;
controlSourceLoad.value = {
id: ++sourceTypeLoadId,
kind,
scope: context.scope,
sourceFrozen: Object.isFrozen(source),
optionsFrozen: Object.isFrozen(options) && options.every((item?: any) => Object.isFrozen(item)),
options: options.map(({ label, value }: any) => ({ label, value })),
calls: { ...controlSourceCalls }
};
}
finally {
sourceTypeRuntime.release(context);
}
}
async function validateSourceTypeForm() {
const id: any = ++sourceTypeValidationId;
await sourceTypeForm.value?.validate((valid?: any, fields?: any) => {
sourceTypeSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...sourceTypeModel.value }
};
});
}
function makeControlSourceOrders() {
return [
['static', 'api', 'request', 'dict'],
['static', 'api', 'dict', 'request'],
['static', 'request', 'api', 'dict'],
['static', 'request', 'dict', 'api'],
['static', 'dict', 'api', 'request'],
['static', 'dict', 'request', 'api'],
['api', 'static', 'request', 'dict'],
['api', 'static', 'dict', 'request'],
['api', 'request', 'static', 'dict'],
['api', 'request', 'dict', 'static'],
['api', 'dict', 'static', 'request'],
['api', 'dict', 'request', 'static'],
['request', 'static', 'api', 'dict'],
['request', 'static', 'dict', 'api'],
['request', 'api', 'static', 'dict'],
['request', 'api', 'dict', 'static'],
['request', 'dict', 'static', 'api'],
['request', 'dict', 'api', 'static'],
['dict', 'static', 'api', 'request'],
['dict', 'static', 'request', 'api'],
['dict', 'api', 'static', 'request'],
['dict', 'api', 'request', 'static'],
['dict', 'request', 'static', 'api'],
['dict', 'request', 'api', 'static']
];
}
const controlSourceRegistration: any = (0, vue_5.ref)();
function registerControlSourceOrders() {
const registered: any = makeControlSourceOrders().map((order?: any) => {
const expected: any = [...order], control: any = (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.Select.component,
emptyValue: () => null,
sourceKinds: order
});
(Reflect.apply(Array.prototype.pop, order, []) as any);
return {
expected,
actual: control.sourceKinds,
frozen: Object.isFrozen(control.sourceKinds),
externalAfter: [...order]
};
});
const rejected: any = [];
for (const sourceKinds of ([['api', 'api'], ['unknown'], { api: true }] as any)) {
try {
(Reflect.apply(ui_6.defineAsamControl, undefined, [
{ component: ui_6.AsamInput, emptyValue: () => null, sourceKinds }
]) as any);
}
catch (cause: any) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
rejected.push({ kind: cause.kind, message: cause.message });
}
}
const empty: any = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: []
});
const singleton: any = (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.RemoteSelect.component,
emptyValue: () => null,
sourceKinds: ['api']
});
const pairs: any = [['api', 'request'], ['request', 'api']].map((sourceKinds?: any) => (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.RemoteSelect.component,
emptyValue: () => null,
sourceKinds
}).sourceKinds);
controlSourceRegistration.value = {
orders: registered,
rejected,
empty: empty.sourceKinds,
singleton: singleton.sourceKinds,
pairs
};
}
const runtimeContractResult: any = (0, vue_5.ref)([]);
function runRuntimeContract() {
const observations: any = [];
const record: any = (phase?: any, state?: any) => observations.push({ phase, state });
const configFailure: any = (action?: any) => {
try {
action();
throw Error('Expected configuration rejection');
}
catch (cause: any) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return { kind: cause.kind, message: cause.message };
}
};
const emptyRuntime: any = (0, ui_4.createAsamDataRuntime)();
record('runtime-default-construction', {
scope: emptyRuntime.scope,
epoch: emptyRuntime.epoch,
providerAbsent: emptyRuntime.provider === undefined,
frozen: Object.isFrozen(emptyRuntime)
});
const hostCause: any = {}, failureCause: any = {}, calls: any = { request: 0, hook: 0, notify: 0 };
let recursive: any = false;
const provider: any = {
request: async () => {
calls.request++;
return [];
},
isErrorNotified: (cause?: any) => {
calls.hook++;
return cause === hostCause;
},
onError: (error?: any) => {
calls.notify++;
recursive = runtime.reportError(error, errorContext) === error;
}
};
const runtime: any = (0, ui_4.createAsamDataRuntime)({ scope: 'runtime-a' });
runtime.install(provider);
runtime.install(provider);
const replacement: any = configFailure(() => runtime.install({}));
record('runtime-late-install-same-identity-and-replacement-guard', {
providerIdentity: runtime.provider === provider,
scope: runtime.scope,
epoch: runtime.epoch,
requestCalls: calls.request,
replacement
});
const a: any = runtime.createContext(), b: any = runtime.createContext(), foreign: any = { ...a };
runtime.release(foreign);
record('runtime-context-identity-readonly-and-foreign-release', {
ids: [a.requestId, b.requestId],
scopes: [a.scope, b.scope],
epochs: [a.epoch, b.epoch],
frozen: [Object.isFrozen(a), Object.isFrozen(b)],
current: [runtime.isCurrent(a), runtime.isCurrent(b), runtime.isCurrent(foreign)],
aborted: [a.signal.aborted, b.signal.aborted],
runtimeFrozen: Object.isFrozen(runtime)
});
runtime.release(a);
runtime.release(a);
record('runtime-idempotent-release', {
current: [runtime.isCurrent(a), runtime.isCurrent(b)],
aborted: [a.signal.aborted, b.signal.aborted],
epoch: runtime.epoch
});
const events: any = [], unsubscribeA: any = runtime.onInvalidate(() => events.push('A')), unsubscribeB: any = runtime.onInvalidate(() => events.push('B'));
runtime.setScope('runtime-a');
record('runtime-same-scope-no-invalidation', {
scope: runtime.scope,
epoch: runtime.epoch,
current: runtime.isCurrent(b),
events: [...events]
});
runtime.setScope('runtime-b');
record('runtime-scope-change-synchronous-abort-and-all-listeners', {
scope: runtime.scope,
epoch: runtime.epoch,
current: runtime.isCurrent(b),
aborted: b.signal.aborted,
events: [...events]
});
const c: any = runtime.createContext();
runtime.invalidate();
record('runtime-explicit-invalidation', {
context: { id: c.requestId, scope: c.scope, epoch: c.epoch },
epoch: runtime.epoch,
current: runtime.isCurrent(c),
aborted: c.signal.aborted,
events: [...events]
});
unsubscribeB();
unsubscribeB();
const d: any = runtime.createContext();
runtime.invalidate();
record('runtime-unsubscribe-one-idempotently', {
id: d.requestId,
contextEpoch: d.epoch,
epoch: runtime.epoch,
aborted: d.signal.aborted,
current: runtime.isCurrent(d),
events: [...events]
});
unsubscribeA();
runtime.invalidate();
record('runtime-unsubscribe-all', { epoch: runtime.epoch, events: [...events] });
const errorContext: any = runtime.createContext(), original: any = new ui_4.AsamDataFailure('request', 'owned runtime request failure', failureCause), reported: any = runtime.reportError(original, errorContext);
record('runtime-normal-error-notification-recursion-and-dedup', {
id: errorContext.requestId,
scope: errorContext.scope,
epoch: errorContext.epoch,
kind: reported.kind,
message: reported.message,
causePreserved: reported.cause === failureCause,
requestId: reported.requestId,
notified: reported.notified,
frozen: Object.isFrozen(reported),
sameInput: runtime.reportError(original, errorContext) === reported,
sameOutput: runtime.reportError(reported, errorContext) === reported,
recursive,
calls: { ...calls }
});
const owned: any = runtime.reportError(new ui_4.AsamDataFailure('response', 'host handled', hostCause), errorContext);
record('runtime-host-owned-error-skips-on-error', {
notified: owned.notified,
kind: owned.kind,
causePreserved: owned.cause === hostCause,
calls: { ...calls }
});
const marked: any = {
kind: 'transform',
message: 'already notified',
cause: failureCause,
notified: true,
requestId: 999
}, preNotified: any = runtime.reportError(marked, errorContext);
record('runtime-pre-notified-error-skips-both-hooks', {
notified: preNotified.notified,
kind: preNotified.kind,
message: preNotified.message,
requestId: preNotified.requestId,
causePreserved: preNotified.cause === failureCause,
calls: { ...calls }
});
const sameEpoch: any = runtime.createContext();
record('runtime-epoch-wide-error-cache', {
contextId: sameEpoch.requestId,
sameResult: runtime.reportError(original, sameEpoch) === reported,
requestId: reported.requestId,
calls: { ...calls }
});
runtime.release(sameEpoch);
runtime.release(errorContext);
const stale: any = new ui_4.AsamDataFailure('request', 'stale', failureCause);
record('runtime-stale-and-foreign-error-return-original', {
aborted: errorContext.signal.aborted,
current: runtime.isCurrent(errorContext),
staleIdentity: runtime.reportError(stale, errorContext) === stale,
foreignIdentity: runtime.reportError(stale, foreign) === stale,
calls: { ...calls }
});
runtime.invalidate();
const nextContext: any = runtime.createContext(), fresh: any = runtime.reportError(original, nextContext);
record('runtime-invalidation-clears-notification-cache', {
epoch: runtime.epoch,
id: nextContext.requestId,
newResult: fresh !== reported,
requestId: fresh.requestId,
notified: fresh.notified,
causePreserved: fresh.cause === failureCause,
calls: { ...calls }
});
runtime.release(nextContext);
const noHookContext: any = emptyRuntime.createContext(), unhandled: any = emptyRuntime.reportError(original, noHookContext);
record('runtime-provider-absent-error-normalization', {
kind: unhandled.kind,
causePreserved: unhandled.cause === failureCause,
notified: unhandled.notified,
requestId: unhandled.requestId,
frozen: Object.isFrozen(unhandled),
deduplicated: emptyRuntime.reportError(original, noHookContext) === unhandled
});
emptyRuntime.release(noHookContext);
const invalidScopes: any = ['', ' ', 0, null].map((scope?: any) => ({
input: scope,
constructor: configFailure(() => (Reflect.apply(ui_4.createAsamDataRuntime, undefined, [{ scope }]) as any)),
setter: configFailure(() => (Reflect.apply(runtime.setScope, undefined, [scope]) as any))
}));
record('runtime-invalid-scope-constructor-and-setter', {
invalidScopes,
scope: runtime.scope,
epoch: runtime.epoch,
calls: { ...calls }
});
const invalidProviders: any = [
['null', null],
['scalar', 'bad'],
...['request', 'upload', 'adaptOptions', 'adaptPage', 'onError', 'isErrorNotified'].map((name?: any) => [name, { [name]: true }]),
['dict-null', { dict: null }],
['dict-get', { dict: { get: true } }],
['dict-refresh', { dict: { get: async () => [], refresh: true } }],
['pagination-null', { pagination: null }],
['pagination-empty-page', { pagination: { page: ' ', pageSize: 'size' } }],
['pagination-empty-size', { pagination: { page: 'page', pageSize: '' } }],
['pagination-scalar', { pagination: { page: 1, pageSize: 'size' } }],
['pagination-duplicate', { pagination: { page: 'same', pageSize: 'same' } }]
];
const rejectedProviders: any = invalidProviders.map(([name, value]: any) => ({
name,
constructor: configFailure(() => (Reflect.apply(ui_4.createAsamDataRuntime, undefined, [{ provider: value }]) as any)),
installer: configFailure(() => (Reflect.apply(runtime.install, undefined, [value]) as any))
}));
record('runtime-invalid-providers-preserve-installed-provider', {
rejectedProviders,
providerIdentity: runtime.provider === provider,
scope: runtime.scope,
epoch: runtime.epoch,
calls: { ...calls }
});
runtime.invalidate();
emptyRuntime.invalidate();
record('runtime-final-cleanup-and-zero-transport', {
epoch: runtime.epoch,
emptyEpoch: emptyRuntime.epoch,
current: runtime.isCurrent(nextContext),
aborted: nextContext.signal.aborted,
events: [...events],
calls: { ...calls }
});
runtimeContractResult.value = observations;
}
const mockContractResult: any = (0, vue_5.ref)([]), mockContractRunning: any = (0, vue_5.ref)(false);
async function runMockContract() {
mockContractRunning.value = true;
const observations: any = [];
const record: any = (phase?: any, state?: any) => observations.push({ phase, state });
const rejected: any = async (action?: any) => {
try {
await action();
throw Error('Expected mock rejection');
}
catch (cause: any) {
return cause;
}
};
const typedFailure: any = (cause?: any) => {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeAbsent: cause.cause === undefined,
notified: cause.notified,
name: cause.name,
errorInstance: cause instanceof Error
};
};
const deeplyFrozen: any = (value?: any) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key?: any) => deeplyFrozen(Reflect.get(value, key))));
const gate: any = () => {
let release: any = () => { }, reject: any = (_cause?: any) => {
void _cause;
};
const wait: any = new Promise((resolve?: any, fail?: any) => {
release = resolve;
reject = fail;
});
return { wait, release, reject };
};
const runtime: any = (0, ui_4.createAsamDataRuntime)({ scope: 'mock-contract' }), context: any = runtime.createContext(), defaultProvider: any = (0, ui_3.createAsamMockProvider)();
if (!defaultProvider.request || !defaultProvider.dict)
throw Error('Public mock methods missing');
record('mock-default-absent-refresh-and-zero-calls', {
frozen: Object.isFrozen(defaultProvider),
dictFrozen: Object.isFrozen(defaultProvider.dict),
calls: defaultProvider.calls.length,
refreshAbsent: defaultProvider.dict.refresh === undefined,
uploadAbsent: defaultProvider.upload === undefined
});
const requestCause: any = { code: 'request-owned' }, dictCause: any = { code: 'dict-owned' }, refreshCause: any = { code: 'refresh-owned' }, hostData: any = { value: 1, nested: { ids: [1] } }, requestSteps: any = [{ data: hostData }, { error: requestCause }], dictSteps: any = [
{ data: [{ label: 'One', value: 1, children: [{ label: 'Leaf', value: 2 }] }] },
{ error: dictCause }
], refreshSteps: any = [{ data: undefined }, { error: refreshCause }];
const options: any = {
requests: { 'get /items': requestSteps, 'post /items': [{ data: 'posted' }] },
dictionaries: { items: dictSteps },
refresh: refreshSteps
}, provider: any = (0, ui_3.createAsamMockProvider)(options);
if (!provider.request || !provider.dict?.refresh)
throw Error('Configured mock methods missing');
const request: any = provider.request, dict: any = provider.dict, refresh: any = provider.dict.refresh;
requestSteps.push({ data: 'external-step' });
dictSteps.push({ data: [] });
refreshSteps.push({ data: undefined });
record('mock-option-queues-copied-at-construction', {
frozen: Object.isFrozen(provider),
dictFrozen: Object.isFrozen(dict),
calls: provider.calls.length,
originalLengths: [requestSteps.length, dictSteps.length, refreshSteps.length]
});
const hostConfig: any = { url: '/items', params: { limit: 1, nested: { ids: [1] } } }, response: any = await request(hostConfig, context), firstCalls: any = provider.calls, firstCall: any = firstCalls[0];
if (!firstCall)
throw Error('Mock call missing');
hostConfig.params.limit = 2;
hostConfig.params.nested.ids.push(2);
hostData.value = 2;
hostData.nested.ids.push(2);
record('mock-default-get-request-and-deep-snapshots', {
response,
request: firstCall.request,
key: firstCall.key,
kind: firstCall.kind,
contextIdentity: firstCall.context === context,
callsFrozen: Object.isFrozen(firstCalls),
callFrozen: Object.isFrozen(firstCall),
requestFrozen: Object.isFrozen(firstCall.request),
responseFrozen: Object.isFrozen(response),
requestDeepFrozen: deeplyFrozen(firstCall.request),
responseDeepFrozen: deeplyFrozen(response),
hostConfig,
hostData
});
record('mock-error-step-preserves-original-cause', {
identity: (await rejected(() => request({ url: '/items' }, context))) === requestCause
});
record('mock-request-exhaustion-without-implicit-repeat', {
failure: typedFailure(await rejected(() => request({ url: '/items' }, context)))
});
record('mock-explicit-method-route', {
result: await request({ url: '/items', method: 'post' }, context),
key: provider.calls.at(-1)?.key
});
record('mock-unconfigured-method-and-route', {
method: typedFailure(await rejected(() => request({ url: '/items', method: 'put' }, context))),
route: typedFailure(await rejected(() => request({ url: '/missing' }, context)))
});
const dictionary: any = await dict.get('items', context);
record('mock-dictionary-success-and-frozen-children', {
dictionary,
frozen: Object.isFrozen(dictionary) &&
dictionary.every((item?: any) => Object.isFrozen(item) && Object.isFrozen(item.children)),
deepFrozen: deeplyFrozen(dictionary),
call: provider.calls.at(-1)?.kind,
key: provider.calls.at(-1)?.key
});
record('mock-dictionary-error-step-preserves-original-cause', {
identity: (await rejected(() => dict.get('items', context))) === dictCause
});
record('mock-dictionary-exhaustion', {
failure: typedFailure(await rejected(() => dict.get('items', context)))
});
record('mock-refresh-success-undefined', {
undefinedResult: (await refresh(context)) === undefined,
kind: provider.calls.at(-1)?.kind,
key: provider.calls.at(-1)?.key
});
record('mock-refresh-error-step-preserves-original-cause', {
identity: (await rejected(() => refresh(context))) === refreshCause
});
record('mock-refresh-exhaustion', {
failure: typedFailure(await rejected(() => refresh(context)))
});
const emptyRefresh: any = (0, ui_3.createAsamMockProvider)({ refresh: [] });
if (!emptyRefresh.dict?.refresh)
throw Error('Empty configured refresh must exist');
record('mock-empty-refresh-is-configured-but-exhausted', {
exists: true,
failure: typedFailure(await rejected(() => emptyRefresh.dict.refresh(context)))
});
const combinedCause: any = { code: 'mixed-owned' }, precedence: any = (0, ui_3.createAsamMockProvider)({
requests: {
'get /mixed': [{ data: 'discarded', error: combinedCause }, { error: undefined }]
}
});
if (!precedence.request)
throw Error('Mixed request missing');
const mixedRequest: any = precedence.request;
record('mock-data-and-error-step-priority-and-undefined-cause', {
errorWins: (await rejected(() => mixedRequest({ url: '/mixed' }, context))) === combinedCause,
undefinedCausePreserved: (await rejected(() => mixedRequest({ url: '/mixed' }, context))) === undefined,
calls: precedence.calls.length
});
const delays: any = gate(), rejection: any = gate(), abort: any = gate(), waitCause: any = { code: 'wait-owned' }, gated: any = (0, ui_3.createAsamMockProvider)({
requests: {
'get /gate': [{ data: 'released', wait: delays.wait }, { data: 'next' }],
'get /reject': [{ data: 'unused', wait: rejection.wait }],
'get /abort': [
{ data: 'cancelled-data', wait: abort.wait },
{ data: 'after-abort' }
],
'get /pre': [{ data: 'not-consumed' }]
}
});
if (!gated.request)
throw Error('Gated request missing');
const gatedRequest: any = gated.request;
let settled: any = false;
const pending: any = gatedRequest({ url: '/gate' }, context).then((value?: any) => {
settled = true;
return value;
});
await Promise.resolve();
record('mock-wait-gate-pending-with-recorded-call', {
settled,
calls: gated.calls.length,
key: gated.calls[0]?.key
});
delays.release();
record('mock-wait-gate-release-and-next-step', {
result: await pending,
next: await gatedRequest({ url: '/gate' }, context),
settled
});
const rejectedWait: any = rejected(() => gatedRequest({ url: '/reject' }, context));
rejection.reject(waitCause);
record('mock-wait-gate-rejection-preserves-original', {
identity: (await rejectedWait) === waitCause
});
const abortContext: any = runtime.createContext(), abortedWait: any = rejected(() => gatedRequest({ url: '/abort' }, abortContext));
runtime.release(abortContext);
record('mock-wait-gate-aborts-before-release', {
identity: (await abortedWait) === abortContext.signal.reason,
aborted: abortContext.signal.aborted,
current: runtime.isCurrent(abortContext)
});
abort.release();
await Promise.resolve();
record('mock-aborted-wait-consumes-exactly-one-step', {
result: await gatedRequest({ url: '/abort' }, context)
});
const preContext: any = runtime.createContext();
runtime.release(preContext);
const preAborted: any = await rejected(() => gatedRequest({ url: '/pre' }, preContext));
record('mock-pre-aborted-context-does-not-consume-step', {
identity: preAborted === preContext.signal.reason,
result: await gatedRequest({ url: '/pre' }, context)
});
const failureKinds: any = [
'config',
'request',
'response',
'transform',
'upload'
];
record('mock-public-data-failure-full-kind-contract', {
failures: failureKinds.map((kind?: any) => {
const failure: any = new ui_4.AsamDataFailure(kind, 'public ' + kind, requestCause);
return {
kind: failure.kind,
message: failure.message,
name: failure.name,
causePreserved: failure.cause === requestCause,
notified: failure.notified,
errorInstance: failure instanceof Error,
stackString: typeof failure.stack === 'string',
frozen: Object.isFrozen(failure)
};
}),
optionalCauseAbsent: new ui_4.AsamDataFailure('request', 'without cause').cause === undefined
});
record('mock-call-snapshots-fresh-frozen-and-context-linked', {
calls: provider.calls.map((call?: any) => ({
kind: call.kind,
key: call.key,
contextId: call.context.requestId,
contextScope: call.context.scope,
requestPresent: call.request !== undefined,
frozen: Object.isFrozen(call)
})),
firstSnapshotLength: firstCalls.length,
currentLength: provider.calls.length,
freshArray: provider.calls !== provider.calls,
gatedKeys: gated.calls.map((call?: any) => call.key),
originalQueueLengths: [requestSteps.length, dictSteps.length, refreshSteps.length]
});
runtime.invalidate();
record('mock-final-cleanup-historical-context-observes-abort', {
contextAborted: provider.calls.every((call?: any) => call.context.signal.aborted),
epoch: runtime.epoch,
current: runtime.isCurrent(context),
providerCalls: provider.calls.length,
gatedCalls: gated.calls.length
});
mockContractResult.value = observations;
mockContractRunning.value = false;
}
const normalizerContractResult: any = (0, vue_5.ref)([]);
function runNormalizerContract() {
const observations: any = [];
const record: any = (phase?: any, state?: any) => observations.push({ phase, state });
const frozen: any = (value?: any) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key?: any) => frozen(Reflect.get(value, key))));
const failure: any = (action?: any) => {
try {
action();
throw Error('Expected normalization rejection');
}
catch (cause: any) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeKind: cause.cause instanceof ui_4.AsamDataFailure ? cause.cause.kind : null,
causeName: cause.cause instanceof Error ? cause.cause.name : null
};
}
};
const values: any = [1, '1', true, false, 0, '', -2.5], input: any = values.map((value?: any, i?: any) => ({ label: 'Value-' + i, value })), options: any = (0, ui_2.normalizeAsamOptions)(input);
record('normalizer-default-seven-typed-identities', {
values: options.map((o?: any) => o.value),
types: options.map((o?: any) => typeof o.value),
frozen: frozen(options),
rawIndependent: options.every((o?: any, i?: any) => o.raw !== input[i]),
empty: (0, ui_2.normalizeAsamOptions)([])
});
const host: any = [
{ label: '', value: '', disabled: undefined, children: undefined },
{ label: 'Host', value: 2, meta: { count: 1 } }
], snapshot: any = (0, ui_2.normalizeAsamOptions)(host);
host[1].meta.count = 2;
record('normalizer-empty-label-undefined-optionals-and-host-snapshot', {
options: snapshot,
hostCount: host[1].meta.count,
frozen: frozen(snapshot)
});
const fields: any = {
label: 'name.label',
value: 'id',
disabled: 'locked',
children: 'nodes'
}, treeRules: any = { tree: true }, tree: any = (0, ui_2.normalizeAsamOptions)([
{
'name.label': 'Parent',
id: 0,
locked: false,
nodes: [{ 'name.label': 'Leaf', id: false }]
}
], fields, treeRules);
record('normalizer-own-dotted-field-mapping-and-tree', {
tree,
frozen: frozen(tree),
flatEmptyChildren: (0, ui_2.normalizeAsamOptions)([{ label: 'Leaf', value: 'leaf', children: [] }]),
sameKeyMapping: (0, ui_2.normalizeAsamOptions)([{ same: 'same' }], { label: 'same', value: 'same' })
});
const policies: any = [
{ valuePolicy: { multiple: false, valueMode: 'value' } },
{ valuePolicy: { multiple: false, valueMode: 'object' } },
{ valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'array' } },
{ valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' } },
{ valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'array' } }
];
record('normalizer-five-legal-selection-policies', {
values: policies.map((rule?: any) => (0, ui_2.normalizeAsamOptions)([{ label: 'One', value: 1 }], undefined, rule)[0]?.value),
separatorWhole: (0, ui_2.normalizeAsamOptions)([{ label: 'Colon', value: 'a:b' }], undefined, {
valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' },
separator: '::'
})[0]?.value
});
const dictCases: any = [
['string', [1, false, 'x'], 'string'],
['number', ['+1.5e2', '-.5', '2.', '1E-2'], 'number'],
['boolean', [true, 1, 'true', '1', false, 0, 'false', '0'], 'boolean']
];
record('normalizer-dictionary-value-conversion-and-original-raw', {
cases: dictCases.map(([kind, values, type]: any) => {
const result: any = values.flatMap((value?: any, i?: any) => (0, ui_2.normalizeAsamOptions)([{ label: 'Dict-' + i, value }], undefined, {}, type));
return {
kind,
values: result.map((o?: any) => o.value),
raw: result.map((o?: any) => o.raw.value),
frozen: result.every((o?: any) => frozen(o))
};
})
});
const row: any = (value?: any) => ({ label: 'Option', value }), cycle: any = {
label: 'Cycle',
value: 1
};
cycle.children = [cycle];
const responseCases: any = [
['null', null],
['undefined', undefined],
['object', {}],
['wrapper', { data: [] }],
['null-item', [null]],
['scalar-item', [1]],
['sparse', new Array(2)],
['inherited', [Object.create({ label: 'Inherited', value: 1 })]],
['numeric-label', [{ label: 1, value: 1 }]],
['missing-value', [{ label: 'Missing' }]],
['nan', [row(NaN)]],
['infinity', [row(Infinity)]],
['null-value', [row(null)]],
['object-value', [row({})]],
['disabled-string', [{ ...row(1), disabled: 'false' }]],
['children-object', [{ ...row(1), children: {} }]],
['flat-tree', [{ ...row(1), children: [row(2)] }]],
['zero-collision', [row(0), row(-0)]],
['boolean-duplicate', [row(false), row(false)]],
['cycle', [cycle], undefined, { tree: true }],
[
'tree-global-duplicate',
[{ ...row(1), children: [row(2)] }, row(2)],
undefined,
{ tree: true }
],
['dict-number-boolean', [row(true)], undefined, {}, 'number'],
['dict-number-text', [row('bad')], undefined, {}, 'number'],
['dict-boolean-case', [row('True')], undefined, {}, 'boolean'],
['dict-invalid-input', [row(Infinity)], undefined, {}, 'string'],
['dict-number-alias-collision', [row(1), row('1')], undefined, {}, 'number'],
['dict-boolean-alias-collision', [row(true), row(1)], undefined, {}, 'boolean']
];
record('normalizer-twenty-seven-response-rejections', {
cases: responseCases.map(([name, ...args]: any) => ({
name,
failure: failure(() => (Reflect.apply(ui_2.normalizeAsamOptions, undefined, args) as any))
}))
});
const stringRules: any = {
valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' },
separator: '::'
}, stringCases: any = [
['identity-collision', [1, '1']],
['empty-token', ['']],
['whole-separator', ['a::b']]
];
record('normalizer-string-token-ambiguity', {
cases: stringCases.map(([name, values]: any) => ({
name,
failure: failure(() => (Reflect.apply(ui_2.normalizeAsamOptions, undefined, [
values.map(row),
undefined,
stringRules
]) as any))
}))
});
const configCases: any = [
['fields-null', null, {}],
['fields-array', [], {}],
['label-missing', { value: 'value' }, {}],
['value-missing', { label: 'label' }, {}],
['label-number', { label: 1, value: 'value' }, {}],
['value-null', { label: 'label', value: null }, {}],
['disabled-empty', { label: 'label', value: 'value', disabled: '' }, {}],
['children-empty', { label: 'label', value: 'value', children: '' }, {}],
['tree-string', undefined, { tree: 'true' }],
['policy-scalar', undefined, { valuePolicy: 'bad' }],
['multiple-missing', undefined, { valuePolicy: { valueMode: 'value' } }],
['multiple-number', undefined, { valuePolicy: { multiple: 1, valueMode: 'value' } }],
['mode-invalid', undefined, { valuePolicy: { multiple: false, valueMode: 'wrong' } }],
['multi-mode-missing', undefined, { valuePolicy: { multiple: true, valueMode: 'value' } }],
[
'single-extra-mode',
undefined,
{ valuePolicy: { multiple: false, valueMode: 'value', multipleValueMode: 'array' } }
],
[
'object-string',
undefined,
{ valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'string' } }
],
['separator-empty', undefined, { separator: '' }],
['separator-number', undefined, { separator: 1 }]
];
record('normalizer-eighteen-configuration-rejections', {
cases: configCases.map(([name, fields, rules]: any) => ({
name,
failure: failure(() => (Reflect.apply(ui_2.normalizeAsamOptions, undefined, [[], fields, rules]) as any))
}))
});
const hostPage: any = { list: [{ id: 1, meta: { count: 1 } }], total: 4 }, page: any = (0, ui_2.normalizeAsamPage)(hostPage);
hostPage.list[0].meta.count = 2;
hostPage.total = 5;
record('normalizer-page-shape-copy-freeze-and-empty-pages', {
page,
host: hostPage,
frozen: frozen(page),
zero: (0, ui_2.normalizeAsamPage)({ list: [], total: 0 }),
laterEmpty: (0, ui_2.normalizeAsamPage)({ list: [], total: 4 }),
maxSafe: (0, ui_2.normalizeAsamPage)({ list: [], total: Number.MAX_SAFE_INTEGER }).total
});
const pageCases: any = [
['null', null],
['array', []],
['wrapper', { data: { list: [], total: 0 } }],
['inherited-list', Object.create({ list: [], total: 0 })],
['list-null', { list: null, total: 0 }],
['list-scalar', { list: ['row'], total: 1 }],
['list-array-row', { list: [[]], total: 1 }],
['list-hole', { list: new Array(2), total: 2 }],
['total-missing', { list: [] }],
['total-inherited', Object.assign(Object.create({ total: 0 }), { list: [] })],
['total-string', { list: [], total: '0' }],
['total-negative', { list: [], total: -1 }],
['total-fraction', { list: [], total: 1.5 }],
['total-nan', { list: [], total: NaN }],
['total-infinite', { list: [], total: Infinity }],
['total-unsafe', { list: [], total: Number.MAX_SAFE_INTEGER + 1 }],
['zero-with-rows', { list: [{ id: 1 }], total: 0 }]
];
record('normalizer-seventeen-page-rejections', {
cases: pageCases.map(([name, value]: any) => ({
name,
failure: failure(() => (0, ui_2.normalizeAsamPage)(value))
}))
});
const calls: any = { transform: 0, adapter: 0 }, envelope: any = { rows: [{ id: 1 }], count: 2 }, transformed: any = (0, ui_2.resolveAsamPage)(envelope, (value?: any) => {
calls.transform++;
return { list: value.rows, total: value.count };
}), adapted: any = (0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
calls.adapter++;
return { list: envelope.rows, total: envelope.count };
}
}), direct: any = (0, ui_2.resolveAsamPage)({ list: [{ id: 3 }], total: 1 });
envelope.rows[0].id = 2;
record('normalizer-page-two-public-overloads-and-default', {
transformed,
adapted,
direct,
calls: { ...calls },
host: envelope,
frozen: frozen(transformed) && frozen(adapted) && frozen(direct)
});
const explicit: any = (Reflect.apply(ui_2.resolveAsamPage, undefined, [
{ rows: [{ id: 4 }], count: 1 },
(value?: any) => {
calls.transform++;
return { list: value.rows, total: value.count };
},
{
adaptPage: () => {
calls.adapter++;
throw Error('Unexpected adapter');
}
}
]) as any);
record('normalizer-dynamic-transform-precedence-over-adapter', {
page: explicit,
calls: { ...calls },
frozen: frozen(explicit)
});
const transformCause: any = Error('owned page transform'), adapterCause: any = Error('owned page adapter');
const transformFailure: any = failure(() => (0, ui_2.resolveAsamPage)(envelope, () => {
throw transformCause;
})), adapterFailure: any = failure(() => (0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
throw adapterCause;
}
}));
record('normalizer-page-error-stage-and-original-cause', {
transform: transformFailure,
adapter: adapterFailure,
transformCausePreserved: (() => {
try {
(0, ui_2.resolveAsamPage)(envelope, () => {
throw transformCause;
});
return false;
}
catch (cause: any) {
return cause instanceof ui_4.AsamDataFailure && cause.cause === transformCause;
}
})(),
adapterCausePreserved: (() => {
try {
(0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
throw adapterCause;
}
});
return false;
}
catch (cause: any) {
return cause instanceof ui_4.AsamDataFailure && cause.cause === adapterCause;
}
})(),
malformedDefault: failure(() => (0, ui_2.resolveAsamPage)({ data: [] })),
malformedTransform: failure(() => (Reflect.apply(ui_2.resolveAsamPage, undefined, [envelope, () => ({ list: null, total: 0 })]) as any))
});
normalizerContractResult.value = observations;
}
const sourceContractResult: any = (0, vue_5.ref)([]);
const sourceContractBusy: any = (0, vue_5.ref)(false);
async function runSourceContract() {
sourceContractBusy.value = true;
sourceContractResult.value = [];
const observations: any = [];
const record: any = (phase?: any, state?: any) => observations.push({ phase, state });
const context: any = (signal: any = new AbortController().signal) => ({
signal,
requestId: 7,
scope: 'source-example',
epoch: 2
});
const frozen: any = (value?: any) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key?: any) => frozen(Reflect.get(value, key))));
const failure: any = (cause?: any, original?: any) => {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeKind: cause.cause instanceof ui_4.AsamDataFailure ? cause.cause.kind : null,
originalCause: original === undefined ? null : cause.cause === original,
notified: cause.notified
};
};
const rejectSync: any = (action?: any) => {
try {
action();
}
catch (cause: any) {
return failure(cause);
}
throw Error('Expected source construction rejection');
};
const rejectAsync: any = async (action?: any, original?: any) => {
try {
await action();
}
catch (cause: any) {
return failure(cause, original);
}
throw Error('Expected source resolution rejection');
};
try {
const factory: any = (0, ui_4.defineAsamOptions)();
const typed: any = (0, ui_4.defineAsamOptions)();
const host: any = [{ title: 'Initial', id: 1, meta: { count: 1 } }], fields: any = { label: 'title', value: 'id' }, source: any = factory.static({ options: host, fieldNames: fields });
const cache: any = { ttlMs: 1000, key: () => 'owned-key' };
const apiSource: any = factory.api({ api: async () => [], params: undefined, cache });
const requestSource: any = factory.request({ request: { url: '/source-example' } }), dictSource: any = (0, ui_4.defineAsamDictSource)({ dictType: 'source-example' });
const kinds: any = [
source.kind,
apiSource.kind,
requestSource.kind,
dictSource.kind
];
record('source-factory-four-kinds-and-opaque-frozen-identity', {
kinds,
sourcesFrozen: [source, apiSource, requestSource, dictSource].every(Object.isFrozen),
keys: [source, apiSource, requestSource, dictSource].map(Object.keys),
symbols: Object.getOwnPropertySymbols(source).length,
factoryKeys: Object.keys(factory),
distinct: source !==
typed.static({ options: host, fieldNames: { label: 'title', value: 'id' } }),
cacheHostFrozen: Object.isFrozen(cache)
});
fields.label = 'wrong';
const first: any = await (0, ui_4.resolveAsamOptions)(source, { context: context() });
host[0].title = 'Changed';
host[0].meta.count = 2;
const second: any = await (0, ui_4.resolveAsamOptions)(source, { context: context() });
record('source-static-fields-copy-host-live-read-and-frozen-result', {
first,
second,
firstFrozen: frozen(first),
secondFrozen: frozen(second),
hostFrozen: Object.isFrozen(host) || Object.isFrozen(host[0]),
rawIndependent: first[0].raw !== host[0],
changedFieldIgnored: fields.label
});
const params: any = { query: 'before' }, apiContext: any = context(), call: any = { sameParams: false, sameContext: false, transform: 0, adapter: 0 };
const typedApi: any = (0, ui_4.defineAsamOptions)().api({
api: async (input?: any, current?: any) => {
call.sameParams = input === params;
call.sameContext = current === apiContext;
return { rows: [{ title: input.query, id: 2 }] };
},
params,
transform: (response?: any) => {
call.transform++;
return response.rows;
},
fieldNames: { label: 'title', value: 'id' }
});
params.query = 'after';
const apiResult: any = await (0, ui_4.resolveAsamOptions)(typedApi, {
context: apiContext,
provider: {
adaptOptions: () => {
call.adapter++;
return [];
}
}
});
record('source-typed-api-param-context-and-transform-precedence', {
options: apiResult,
calls: call,
frozen: frozen(apiResult),
paramsFrozen: Object.isFrozen(params)
});
let apiCalls: any = 0, adapterCalls: any = 0, cacheKeyCalls: any = 0;
const defaultApi: any = factory.api({
api: async () => {
apiCalls++;
return { rows: [{ label: 'Adapted', value: true }] };
},
params: undefined,
cache: {
ttlMs: 1000,
key: () => {
cacheKeyCalls++;
return 'same';
}
}
});
const beforeCalls: any = apiCalls;
const adapted1: any = await (0, ui_4.resolveAsamOptions)(defaultApi, {
context: context(),
provider: {
adaptOptions: () => {
adapterCalls++;
return [{ label: 'Adapted', value: true }];
}
}
});
const adapted2: any = await (0, ui_4.resolveAsamOptions)(defaultApi, {
context: context(),
provider: {
adaptOptions: () => {
adapterCalls++;
return [{ label: 'Adapted', value: true }];
}
}
});
const direct: any = await (0, ui_4.resolveAsamOptions)(factory.api({
api: async () => [{ label: 'Direct', value: false }],
params: undefined
}), { context: context() });
record('source-default-api-adapter-raw-and-no-one-shot-cache', {
beforeCalls,
apiCalls,
adapterCalls,
cacheKeyCalls,
adapted1,
adapted2,
direct,
distinctSnapshots: adapted1 !== adapted2
});
const requests: any = [], requestParams: any = { q: 1 }, requestData: any = { body: 2 };
for (const method of ([undefined, 'get', 'post', 'put', 'delete'] as any)) {
const request: any = {
url: '/source-method',
...(method === undefined ? {} : { method }),
params: requestParams,
...(method === undefined || method === 'get' ? {} : { data: requestData })
};
const current: any = context(), result: any = await (0, ui_4.resolveAsamOptions)(factory.request({ request }), {
context: current,
provider: {
request: async (input?: any, received?: any) => {
requests.push({
method: input.method,
url: input.url,
copiedConfig: input !== request,
sameParams: input.params === requestParams,
sameData: input.data === request.data,
sameContext: received === current
});
return [{ label: 'URL', value: 'url' }];
}
}
});
if (!frozen(result))
throw Error('Request result must be frozen');
}
record('source-url-default-get-and-four-method-context-identity', {
requests,
paramsFrozen: Object.isFrozen(requestParams),
dataFrozen: Object.isFrozen(requestData)
});
record('source-provider-requirements-before-transport', {
request: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(requestSource, { context: context() })),
dict: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(dictSource, { context: context() }))
});
let mutableCalls: any = 0;
const mutableRequest: any = { url: '/valid' }, mutableSource: any = factory.request({ request: mutableRequest });
mutableRequest.url = ' ';
record('source-url-revalidation-guards-mutated-host-before-transport', {
failure: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(mutableSource, {
context: context(),
provider: {
request: async () => {
mutableCalls++;
return [];
}
}
})),
calls: mutableCalls
});
const dictionaries: any = [];
for (const kind of ([undefined, 'string', 'number', 'boolean'] as any)) {
const current: any = context(), value: any = kind === 'boolean' ? '1' : 3, dict: any = (0, ui_4.defineAsamDictSource)({
dictType: ' spaced ',
...(kind === undefined ? {} : { dictValueType: kind })
});
let sameContext: any = false, receivedType: any = '';
const options: any = await (0, ui_4.resolveAsamOptions)(dict, {
context: current,
provider: {
dict: {
get: async (type?: any, received?: any) => {
sameContext = current === received;
receivedType = type;
return [{ label: 'Dict', value }];
}
}
}
});
dictionaries.push({
kind: kind ?? 'default',
value: options[0]?.value,
raw: options[0]?.raw.value,
sameContext,
receivedType,
frozen: frozen(options)
});
}
record('source-dictionary-default-and-three-conversions', { dictionaries });
const forged: any = [{ kind: 'static' }, { ...source }, new Proxy(source, {})];
record('source-opaque-forged-copy-proxy-rejections', {
failures: await Promise.all(forged.map((value?: any) => rejectAsync(() => (Reflect.apply(ui_4.resolveAsamOptions, undefined, [
value,
{ context: context() }
]) as any))))
});
const constructors: any = [];
for (const [name, method, valid] of ([
['static', factory.static, { options: [] }],
['api', factory.api, { api: async () => [], params: undefined }],
['request', factory.request, { request: { url: '/valid' } }],
['dict', ui_4.defineAsamDictSource, { dictType: 'valid' }]
] as any)) {
for (const [suffix, input] of ([
['null', null],
['array', []],
['missing', {}],
['wrong', { data: [] }],
['multiple', { ...valid, data: [] }],
[
'null-source',
{
...valid,
[name === 'static' ? 'options' : name === 'dict' ? 'dictType' : name]: null
}
],
['extra', { ...valid, foreign: 1 }]
] as any))
constructors.push([
name + '-' + suffix,
() => (Reflect.apply(method, undefined, [input]) as any)
]);
}
for (const kind of (['api', 'request'] as any)) {
const method: any = factory[kind], valid: any = kind === 'api'
? { api: async () => [], params: undefined }
: { request: { url: '/valid' } };
for (const [suffix, extra] of ([
['cache-null', { cache: null }],
['cache-zero', { cache: { ttlMs: 0 } }],
['cache-negative', { cache: { ttlMs: -1 } }],
['cache-fraction', { cache: { ttlMs: 1.5 } }],
['cache-infinite', { cache: { ttlMs: Infinity } }],
['cache-unsafe', { cache: { ttlMs: Number.MAX_SAFE_INTEGER + 1 } }],
['cache-key', { cache: { ttlMs: 1, key: 1 } }],
['transform', { transform: 1 }],
['fields-without-transform', { fieldNames: { label: 'label', value: 'value' } }],
['fields-null', { fieldNames: null }]
] as any))
constructors.push([
kind + '-' + suffix,
() => (Reflect.apply(method, undefined, [{ ...valid, ...extra }]) as any)
]);
}
for (const [suffix, input] of ([
['api-nonfunction', { api: 1 }],
['static-bad-fields', { options: [], fieldNames: { label: '', value: 'value' } }]
] as any))
constructors.push([
suffix,
() => (Reflect.apply(suffix.startsWith('api') ? factory.api : factory.static, undefined, [input]) as any)
]);
for (const [suffix, request] of ([
['url-empty', { url: '' }],
['url-numeric', { url: 1 }],
['method-upper', { url: '/x', method: 'GET' }],
['get-data', { url: '/x', data: {} }],
['params-array', { url: '/x', params: [] }]
] as any))
constructors.push([
'request-' + suffix,
() => (Reflect.apply(factory.request, undefined, [{ request }]) as any)
]);
for (const [suffix, input] of ([
['empty', { dictType: '' }],
['whitespace', { dictType: ' ' }],
['numeric', { dictType: 1 }],
['null-value-type', { dictType: 'x', dictValueType: null }],
['unknown-value-type', { dictType: 'x', dictValueType: 'other' }],
['cache', { dictType: 'x', cache: { ttlMs: 1 } }]
] as any))
constructors.push([
'dict-' + suffix,
() => (Reflect.apply(ui_4.defineAsamDictSource, undefined, [input]) as any)
]);
record('source-complete-constructor-config-rejections', {
cases: constructors.map(([name, action]: any) => ({ name, failure: rejectSync(action) })),
allowedUndefinedExtra: factory.static({ options: [], ...{ foreign: undefined } }).kind,
allowedInheritedSource: (Reflect.apply(factory.static, undefined, [
Object.create({ options: [] })
]) as any).kind
});
let guardedCalls: any = 0;
const guardedProvider: any = {
request: async () => {
guardedCalls++;
return [];
},
dict: {
get: async () => {
guardedCalls++;
return [];
}
}
};
const guardedApi: any = factory.api({
api: async () => {
guardedCalls++;
return [];
},
params: undefined
});
record('source-rules-validation-before-all-remote-io', {
failures: await Promise.all([guardedApi, requestSource, dictSource].map((current?: any) => rejectAsync(() => (Reflect.apply(ui_4.resolveAsamOptions, undefined, [
current,
{ context: context(), provider: guardedProvider, separator: '' }
]) as any)))),
calls: guardedCalls
});
const transportCases: any = [];
for (const kind of (['api', 'request', 'dict'] as any))
for (const mode of (['throw', 'reject', 'non-promise'] as any)) {
const original: any = Error(kind + '-' + mode), run: any = () => {
if (mode === 'throw')
throw original;
return mode === 'reject' ? Promise.reject(original) : [];
};
const selected: any = kind === 'api'
? (Reflect.apply(factory.api, undefined, [{ api: run, params: undefined }]) as any)
: kind === 'request'
? requestSource
: dictSource;
transportCases.push({
kind,
mode,
failure: await rejectAsync(() => (Reflect.apply(ui_4.resolveAsamOptions, undefined, [
selected,
{
context: context(),
provider: { request: run, dict: { get: run } }
}
]) as any), mode === 'non-promise' ? undefined : original)
});
}
record('source-nine-transport-failures-and-original-causes', { cases: transportCases });
const stages: any = [];
for (const stage of (['transform', 'adapter'] as any))
for (const mode of (['throw', 'async-resolve', 'async-reject', 'malformed'] as any)) {
const original: any = Error(stage + '-' + mode), parse: any = () => {
if (mode === 'throw')
throw original;
if (mode === 'async-reject')
return Promise.reject(original);
if (mode === 'async-resolve')
return Promise.resolve([]);
return {};
};
const selected: any = (Reflect.apply(factory.api, undefined, [
{
api: async () => [],
params: undefined,
...(stage === 'transform' ? { transform: parse } : {})
}
]) as any);
stages.push({
stage,
mode,
failure: await rejectAsync(() => (Reflect.apply(ui_4.resolveAsamOptions, undefined, [
selected,
{
context: context(),
provider: stage === 'adapter' ? { adaptOptions: parse } : undefined
}
]) as any), mode === 'throw' ? original : undefined)
});
}
record('source-eight-transform-adapter-sync-guards-and-error-stages', { cases: stages });
record('source-static-config-versus-remote-response-failures', {
static: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(factory.static({ options: [{ label: 'Bad', value: {} }] }), {
context: context()
})),
api: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(factory.api({ api: async () => ({}), params: undefined }), {
context: context()
})),
dictionary: await rejectAsync(() => (0, ui_4.resolveAsamOptions)((0, ui_4.defineAsamDictSource)({ dictType: 'invalid', dictValueType: 'number' }), {
context: context(),
provider: {
dict: { get: async () => [{ label: 'Bad', value: 'not-number' }] }
}
})),
staticConstructionRemainsLazy: factory.static({
options: [{ label: 'Bad', value: {} }]
}).kind
});
const aborted: any = new AbortController(), reason: any = { owned: 'pre-abort' };
aborted.abort(reason);
let abortedCalls: any = 0;
const abortApi: any = factory.api({
api: async () => {
abortedCalls++;
return [];
},
params: undefined
});
const preAborts: any = [];
for (const current of ([source, abortApi, requestSource, dictSource] as any)) {
try {
await (0, ui_4.resolveAsamOptions)(current, {
context: context(aborted.signal),
provider: {
request: async () => {
abortedCalls++;
return [];
},
dict: {
get: async () => {
abortedCalls++;
return [];
}
}
}
});
}
catch (cause: any) {
preAborts.push(cause === reason);
}
}
record('source-pre-abort-exact-reason-four-kinds-zero-io', {
preAborts,
calls: abortedCalls
});
const lateResults: any = [];
for (const mode of (['resolve', 'reject'] as any)) {
const controller: any = new AbortController(), abortReason: any = { mode }, lateCause: any = Error('late-' + mode);
let release: any = () => {
throw Error('Missing release');
}, reject: any = () => {
throw Error('Missing rejection');
}, transforms: any = 0, calls: any = 0;
const gated: any = factory.api({
api: () => {
calls++;
return new Promise((done?: any, fail?: any) => {
release = done;
reject = fail;
});
},
params: undefined,
transform: () => {
transforms++;
return [];
}
});
const pending: any = (0, ui_4.resolveAsamOptions)(gated, { context: context(controller.signal) }).then(() => false, (cause?: any) => cause === abortReason);
controller.abort(abortReason);
const promptExactReason: any = await pending;
if (mode === 'resolve')
release([]);
else
reject(lateCause);
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
lateResults.push({ mode, promptExactReason, calls, transforms });
}
record('source-prompt-abort-ignored-transport-and-late-settlement', { cases: lateResults });
sourceContractResult.value = observations;
}
catch (cause: any) {
sourceContractResult.value = [
...observations,
{
phase: 'source-contract-unexpected-failure',
state: { message: cause instanceof Error ? cause.message : String(cause) }
}
];
}
finally {
sourceContractBusy.value = false;
}
}
const optionsStateInjectionTarget: any = (0, vue_5.ref)();
const optionsStateContractResult: any = (0, vue_5.ref)([]);
const optionsStateContractBusy: any = (0, vue_5.ref)(false);
async function runOptionsStateContract() {
optionsStateContractBusy.value = true;
optionsStateContractResult.value = [];
const observations: any = [], scopes: any = [];
const record: any = (phase?: any, state?: any) => observations.push({ phase, state });
const attach: any = (config?: any, kind: any = 'remote') => {
const scope: any = (0, vue_3.effectScope)();
scopes.push(scope);
const state: any = scope.run(() => kind === 'remote' ? (0, ui_1.useAsamRemoteOptions)(config) : (0, ui_1.useAsamDictOptions)(config));
if (!state)
throw Error('Missing scoped options state');
return { state, scope };
};
const snapshot: any = (state?: any) => ({
values: state.data.value.map((o?: any) => o.value),
loading: state.loading.value,
error: state.error.value?.kind ?? null,
errorMessage: state.error.value?.message ?? null,
stale: state.stale.value,
hasSucceeded: state.hasSucceeded.value,
empty: state.empty.value,
dataKeySet: state.dataKey.value !== null,
requestKeySet: state.requestKey.value !== null,
keysMatch: state.dataKey.value !== null && state.dataKey.value === state.requestKey.value
});
const settle: any = async (check?: any) => {
for (let i: any = 0; i < 100 && !check(); i++)
await Promise.resolve();
if (!check())
throw Error('Options state did not settle within microtasks');
};
const gate: any = () => {
let release: any = () => {
throw Error('Missing gate');
}, reject: any = () => {
throw Error('Missing gate');
};
const promise: any = new Promise((done?: any, fail?: any) => {
release = done;
reject = fail;
});
return { promise, release, reject };
};
try {
const factory: any = (0, ui_4.defineAsamOptions)(), firstGate: any = gate(), failedGate: any = gate(), emptyGate: any = gate(), jobs: any = [firstGate, failedGate, emptyGate];
let calls: any = 0, success: any = 0, localErrors: any = 0, notifications: any = 0, successSame: any = false, errorSame: any = false;
const runtime: any = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
notifications++;
}
}
}), source: any = factory.api({ api: () => jobs[calls++].promise, params: undefined });
const attached: any = attach({
source,
runtime,
immediate: false,
onSuccess: (data?: any) => {
success++;
successSame = data === current?.data.value;
},
onError: (error?: any) => {
localErrors++;
errorSame = error === current?.error.value;
}
});
const current: any = attached.state;
record('options-state-all-public-members-and-manual-initial-state', {
members: Object.keys(current),
snapshot: snapshot(current),
calls
});
const first: any = current.reload();
record('options-state-held-loading-before-first-success', {
snapshot: snapshot(current),
calls
});
firstGate.release([{ label: 'One', value: 1 }]);
const firstResult: any = await first;
record('options-state-success-frozen-data-keys-and-callbacks', {
snapshot: snapshot(current),
status: firstResult.status,
fromCache: firstResult.status === 'success' ? firstResult.fromCache : null,
success,
localErrors,
notifications,
successSame,
frozen: Object.isFrozen(current.data.value) &&
Object.isFrozen(current.data.value[0]) &&
Object.isFrozen(current.data.value[0]?.raw)
});
const original: any = Error('owned hook request failure'), failed: any = current.reload();
failedGate.reject(original);
const failedResult: any = await failed;
record('options-state-request-failure-retains-stale-success-and-error-hooks', {
snapshot: snapshot(current),
status: failedResult.status,
originalCause: current.error.value?.cause === original,
notified: current.error.value?.notified,
success,
localErrors,
notifications,
errorSame
});
const empty: any = current.reload();
emptyGate.release([]);
const emptyResult: any = await empty;
record('options-state-empty-success-clears-error-stale-and-restores-callback', {
snapshot: snapshot(current),
status: emptyResult.status,
success,
localErrors,
notifications
});
attached.scope.stop();
record('options-state-disposal-removes-consumer-and-cancels-reload', {
status: (await current.reload()).status,
calls,
snapshot: snapshot(current)
});
const active: any = (0, vue_5.ref)(false);
let activeCalls: any = 0;
const activeSource: any = factory.api({
api: async () => {
activeCalls++;
return [{ label: 'Active', value: 2 }];
},
params: undefined
}), activeState: any = attach({
source: activeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
active,
immediate: false
}).state;
const inactiveInitial: any = snapshot(activeState), inactiveReload: any = (await activeState.reload()).status;
active.value = true;
const enabledBeforeReload: any = snapshot(activeState);
await activeState.reload();
active.value = false;
const disabledAfterSuccess: any = snapshot(activeState), inactiveAfterSuccess: any = (await activeState.reload()).status;
active.value = true;
const restored: any = snapshot(activeState);
record('options-state-reactive-active-retention-and-immediate-false', {
inactiveInitial,
inactiveReload,
enabledBeforeReload,
disabledAfterSuccess,
inactiveAfterSuccess,
restored,
calls: activeCalls
});
const obsolete: any = gate(), latest: any = gate();
let raceCalls: any = 0, lateCallbacks: any = 0;
const raceRuntime: any = (0, ui_4.createAsamDataRuntime)(), query: any = (0, vue_5.ref)('old'), raceApi: any = (input?: any) => {
raceCalls++;
return input.query === 'old' ? obsolete.promise : latest.promise;
}, raceSource: any = (0, vue_5.computed)(() => factory.api({ api: raceApi, params: { query: query.value } })), raceState: any = attach({
source: raceSource,
runtime: raceRuntime,
immediate: false,
onSuccess: () => {
lateCallbacks++;
}
}).state;
const oldJob: any = raceState.reload(), oldKey: any = raceState.requestKey.value;
query.value = 'new';
const cancelledOld: any = await oldJob, newJob: any = raceState.reload(), changedKey: any = raceState.requestKey.value !== oldKey;
latest.release([{ label: 'New', value: 'new' }]);
await newJob;
obsolete.release([{ label: 'Obsolete', value: 'old' }]);
await settle(() => !raceState.loading.value);
record('options-state-source-replacement-cancels-old-and-blocks-late-write', {
cancelledOld: cancelledOld.status,
changedKey,
snapshot: snapshot(raceState),
calls: raceCalls,
successCallbacks: lateCallbacks
});
const cancelGate: any = gate();
let cancelCalls: any = 0, cancelCallbacks: any = 0;
const cancelOwner: any = attach({
source: factory.api({
api: () => {
cancelCalls++;
return cancelGate.promise;
},
params: undefined
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
onSuccess: () => {
cancelCallbacks++;
}
}), cancelState: any = cancelOwner.state, cancelJob: any = cancelState.reload();
cancelState.cancel();
const cancelled: any = await cancelJob;
cancelGate.release([{ label: 'Late', value: 9 }]);
await settle(() => !cancelState.loading.value);
record('options-state-explicit-cancel-settles-pending-without-success', {
status: cancelled.status,
snapshot: snapshot(cancelState),
calls: cancelCalls,
successCallbacks: cancelCallbacks
});
const sharedGate: any = gate();
let sharedCalls: any = 0;
const sharedApi: any = () => {
sharedCalls++;
return sharedGate.promise;
}, sharedSource: any = factory.api({
api: sharedApi,
params: { q: 1 },
cache: { ttlMs: 10000 }
}), sharedRuntime: any = (0, ui_4.createAsamDataRuntime)(), sharedA: any = attach({
source: sharedSource,
runtime: sharedRuntime,
immediate: false
}).state, sharedB: any = attach({
source: sharedSource,
runtime: sharedRuntime,
immediate: false
}).state;
const sharedJobA: any = sharedA.reload(), sharedJobB: any = sharedB.reload();
const joined: any = {
calls: sharedCalls,
sameRequestKey: sharedA.requestKey.value === sharedB.requestKey.value,
bothLoading: sharedA.loading.value && sharedB.loading.value
};
sharedA.cancel();
const detached: any = await sharedJobA;
sharedGate.release([{ label: 'Shared', value: 3 }]);
await sharedJobB;
const cached: any = await sharedA.reload();
record('options-state-cache-shared-flight-independent-cancel-and-rejoin', {
joined,
detached: detached.status,
fromCache: cached.status === 'success' ? cached.fromCache : null,
calls: sharedCalls,
sameSnapshot: sharedA.data.value === sharedB.data.value,
a: snapshot(sharedA),
b: snapshot(sharedB)
});
let isolatedCalls: any = 0;
const isolatedApi: any = async () => {
isolatedCalls++;
return [];
}, isolatedSource: any = factory.api({ api: isolatedApi, params: { q: 1 } }), isolatedRuntime: any = (0, ui_4.createAsamDataRuntime)(), isolatedA: any = attach({
source: isolatedSource,
runtime: isolatedRuntime,
immediate: false
}).state, isolatedB: any = attach({
source: isolatedSource,
runtime: isolatedRuntime,
immediate: false
}).state;
await Promise.all([isolatedA.reload(), isolatedB.reload()]);
record('options-state-uncached-remote-consumers-have-isolated-jobs', {
calls: isolatedCalls,
differentRequestKey: isolatedA.requestKey.value !== isolatedB.requestKey.value,
a: snapshot(isolatedA),
b: snapshot(isolatedB)
});
const ordinaryGate: any = gate(), forceGate: any = gate();
let forceCalls: any = 0;
const forceSource: any = factory.api({
api: () => [ordinaryGate, forceGate][forceCalls++].promise,
params: undefined,
cache: { ttlMs: 10000 }
}), forceRuntime: any = (0, ui_4.createAsamDataRuntime)(), forceA: any = attach({ source: forceSource, runtime: forceRuntime, immediate: false }).state, forceB: any = attach({ source: forceSource, runtime: forceRuntime, immediate: false }).state;
const ordinary: any = forceA.reload(), forcedA: any = forceA.reload({ force: true }), forcedB: any = forceB.reload({ force: true }), ordinaryCancelled: any = await ordinary;
forceGate.release([{ label: 'Forced', value: 4 }]);
const forceResults: any = await Promise.all([forcedA, forcedB]);
ordinaryGate.release([{ label: 'Obsolete', value: 0 }]);
await settle(() => !forceA.loading.value);
record('options-state-force-replaces-normal-flight-and-shares-forced-generation', {
ordinary: ordinaryCancelled.status,
forced: forceResults.map((r?: any) => r.status),
fromCache: forceResults.map((r?: any) => (r.status === 'success' ? r.fromCache : null)),
calls: forceCalls,
sameSnapshot: forceA.data.value === forceB.data.value,
a: snapshot(forceA),
b: snapshot(forceB)
});
let scopedCalls: any = 0;
const scopedRuntime: any = (0, ui_4.createAsamDataRuntime)({ scope: 'first' }), scopedApi: any = async () => {
scopedCalls++;
return [{ label: 'Scope', value: scopedCalls }];
}, scopedState: any = attach({
source: factory.api({ api: scopedApi, params: undefined, cache: { ttlMs: 10000 } }),
runtime: scopedRuntime,
immediate: false
}).state;
await scopedState.reload();
const scopeKey: any = scopedState.requestKey.value;
scopedRuntime.setScope('second');
const clearedOnScope: any = snapshot(scopedState), scopeKeyChanged: any = scopedState.requestKey.value !== scopeKey;
await scopedState.reload();
scopedRuntime.invalidate();
const clearedOnInvalidate: any = snapshot(scopedState);
await scopedState.reload();
record('options-state-scope-epoch-invalidation-clears-data-and-cache', {
clearedOnScope,
clearedOnInvalidate,
scopeKeyChanged,
calls: scopedCalls,
snapshot: snapshot(scopedState),
scope: scopedRuntime.scope,
epoch: scopedRuntime.epoch
});
const badSource: any = (0, vue_3.shallowRef)(undefined);
let configErrors: any = 0, configNotifications: any = 0;
const badRuntime: any = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
configNotifications++;
}
}
}), badState: any = attach({
source: badSource,
runtime: badRuntime,
immediate: false,
onError: () => {
configErrors++;
}
}).state;
Reflect.set(badSource, 'value', Object.freeze({ kind: 'api' }));
const dedup: any = {
errors: configErrors,
notifications: configNotifications,
snapshot: snapshot(badState)
};
badSource.value = factory.api({ api: async () => [], params: undefined });
await badState.reload();
record('options-state-config-error-dedup-and-valid-source-recovery', {
dedup,
recovered: snapshot(badState),
errors: configErrors,
notifications: configNotifications
});
const wrongKinds: any = [];
for (const [name, kind, input] of ([
['remote-static', 'remote', factory.static({ options: [] })],
['remote-dict', 'remote', (0, ui_4.defineAsamDictSource)({ dictType: 'x' })],
['dict-api', 'dict', factory.api({ api: async () => [], params: undefined })],
['dict-url', 'dict', factory.request({ request: { url: '/x' } })]
] as any)) {
const state: any = attach({ source: input, runtime: (0, ui_4.createAsamDataRuntime)(), immediate: false }, kind).state;
wrongKinds.push({
name,
snapshot: snapshot(state),
reload: (await state.reload()).status
});
}
record('options-state-remote-dict-source-kind-restrictions', { cases: wrongKinds });
const invalidConfig: any = [];
for (const [name, extra] of ([
['negative-debounce', { debounceMs: -1 }],
['fraction-debounce', { debounceMs: 0.5 }],
['unsafe-debounce', { debounceMs: Number.MAX_SAFE_INTEGER + 1 }],
[
'bad-cache-key',
{
source: factory.api({
api: async () => [],
params: undefined,
cache: { ttlMs: 1, key: () => '' }
})
}
],
[
'throw-cache-key',
{
source: factory.api({
api: async () => [],
params: undefined,
cache: {
ttlMs: 1,
key: () => {
throw Error('owned cache key');
}
}
})
}
]
] as any)) {
const owner: any = (Reflect.apply(attach, undefined, [
{
source: factory.api({ api: async () => [], params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
...extra
}
]) as any);
invalidConfig.push({
name,
snapshot: snapshot(owner.state),
reload: (await owner.state.reload()).status
});
}
record('options-state-debounce-and-cache-key-config-guards', { cases: invalidConfig });
const treeSource: any = factory.api({
api: async () => [
{ label: 'Parent', value: 1, children: [{ label: 'Leaf', value: 2 }] }
],
params: undefined
}), treeState: any = attach({
source: treeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
tree: true,
immediate: false,
valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'array' },
separator: '::'
}).state;
await treeState.reload();
const flatState: any = attach({
source: treeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await flatState.reload();
record('options-state-tree-policy-separator-normalization-versus-flat-error', {
tree: snapshot(treeState),
children: treeState.data.value[0]?.children?.map((o?: any) => o.value),
flat: snapshot(flatState)
});
let dictCalls: any = 0, refreshCalls: any = 0;
const dictRuntime: any = (0, ui_4.createAsamDataRuntime)({
provider: {
dict: {
get: async () => {
dictCalls++;
return [{ label: 'Dict', value: dictCalls }];
},
refresh: async () => {
refreshCalls++;
}
}
}
}), dictInput: any = (0, ui_4.defineAsamDictSource)({ dictType: 'hook-dict', dictValueType: 'number' }), dictA: any = attach({ source: dictInput, runtime: dictRuntime, immediate: false }, 'dict').state, dictB: any = attach({ source: dictInput, runtime: dictRuntime, immediate: false }, 'dict').state;
await Promise.all([dictA.reload(), dictB.reload()]);
const beforeForce: any = {
calls: dictCalls,
refreshCalls,
sameSnapshot: dictA.data.value === dictB.data.value
};
const dictForced: any = await Promise.all([
dictA.reload({ force: true }),
dictB.reload({ force: true })
]);
record('options-state-dictionary-sharing-and-deduplicated-force-refresh', {
beforeForce,
calls: dictCalls,
refreshCalls,
statuses: dictForced.map((r?: any) => r.status),
a: snapshot(dictA),
b: snapshot(dictB),
sameSnapshot: dictA.data.value === dictB.data.value
});
const unavailable: any = attach({
source: dictInput,
runtime: (0, ui_4.createAsamDataRuntime)({ provider: { dict: { get: async () => [] } } }),
immediate: false
}, 'dict').state;
const noRefresh: any = await unavailable.reload({ force: true });
record('options-state-dictionary-force-without-refresh-config-error', {
status: noRefresh.status,
snapshot: snapshot(unavailable)
});
const disposedGate: any = gate();
let disposedCallbacks: any = 0;
const disposedOwner: any = attach({
source: factory.api({ api: () => disposedGate.promise, params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
onSuccess: () => {
disposedCallbacks++;
}
}), disposedJob: any = disposedOwner.state.reload();
disposedOwner.scope.stop();
const disposedResult: any = await disposedJob;
disposedGate.release([{ label: 'Disposed', value: 9 }]);
await settle(() => !disposedOwner.state.loading.value);
record('options-state-disposal-cancels-held-job-and-blocks-late-callback', {
status: disposedResult.status,
callbacks: disposedCallbacks,
reloadAfterDispose: (await disposedOwner.state.reload()).status,
snapshot: snapshot(disposedOwner.state)
});
const searchText: any = (0, vue_5.ref)('first'), debounceMs: any = (0, vue_5.ref)(25), searchCalls: any = [];
let searchDone: any = () => { };
const searchApi: any = async (params?: any) => {
searchCalls.push(params.q);
return [{ label: params.q, value: params.q }];
}, searchInput: any = (0, vue_5.computed)(() => factory.api({ api: searchApi, params: { q: searchText.value } })), searchOwner: any = attach({
source: searchInput,
runtime: (0, ui_4.createAsamDataRuntime)(),
searchText,
debounceMs,
onSuccess: () => searchDone()
}), searchState: any = searchOwner.state;
await settle(() => searchState.hasSucceeded.value);
const firstSearch: any = snapshot(searchState), searchReady: any = new Promise((done?: any) => {
searchDone = done;
});
searchText.value = 'second';
searchText.value = 'third';
const debouncing: any = snapshot(searchState), callsBeforeDebounce: any = [...searchCalls];
await searchReady;
const debounced: any = snapshot(searchState);
debounceMs.value = 0;
searchText.value = 'fourth';
await settle(() => searchState.data.value[0]?.value === 'fourth');
record('options-state-immediate-search-reactivity-default-debounce-and-zero', {
firstSearch,
debouncing,
callsBeforeDebounce,
debounced,
final: snapshot(searchState),
calls: searchCalls
});
let deadlineCalls: any = 0;
const deadlineSource: any = factory.api({
api: async () => {
deadlineCalls++;
return [{ label: 'TTL', value: deadlineCalls }];
},
params: undefined,
cache: { ttlMs: 200 }
}), deadlineState: any = attach({
source: deadlineSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await deadlineState.reload();
const withinDeadline: any = await deadlineState.reload();
await new Promise((done?: any) => setTimeout(done, 250));
const afterDeadline: any = await deadlineState.reload();
record('options-state-real-cache-ttl-hit-and-expiry', {
calls: deadlineCalls,
withinDeadline: withinDeadline.status === 'success' ? withinDeadline.fromCache : null,
afterDeadline: afterDeadline.status === 'success' ? afterDeadline.fromCache : null,
snapshot: snapshot(deadlineState),
expiryObservation: 'real timer after documented 200ms TTL; no clock replacement'
});
let serialCalls: any = 0;
const serialApi: any = async (_params?: any) => {
void _params;
serialCalls++;
return [];
}, serialInput: any = new Date('2030-01-01T00:00:00Z'), fallbackState: any = attach({
source: factory.api({ api: serialApi, params: serialInput }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await fallbackState.reload();
const strictState: any = attach({
source: factory.api({
api: serialApi,
params: serialInput,
cache: { ttlMs: 1000 }
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state, customKeyState: any = attach({
source: factory.api({
api: serialApi,
params: serialInput,
cache: { ttlMs: 1000, key: (input?: any) => String(input) }
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await customKeyState.reload();
record('options-state-uncached-identity-fallback-versus-cache-key-serialization', {
calls: serialCalls,
fallback: snapshot(fallbackState),
strict: snapshot(strictState),
custom: snapshot(customKeyState)
});
const policy: any = (0, vue_5.ref)({ multiple: false, valueMode: 'value' }), separator: any = (0, vue_5.ref)('::');
let policyCalls: any = 0;
const policyState: any = attach({
source: factory.api({
api: async () => {
policyCalls++;
return [
{ label: 'Numeric', value: 1 },
{ label: 'String', value: '1' }
];
},
params: undefined
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
valuePolicy: policy,
separator
}).state;
await policyState.reload();
const policyBefore: any = snapshot(policyState);
policy.value = { multiple: true, valueMode: 'value', multipleValueMode: 'string' };
await policyState.reload();
const policyRejected: any = snapshot(policyState);
policy.value = { multiple: true, valueMode: 'object', multipleValueMode: 'array' };
separator.value = '|';
await policyState.reload();
record('options-state-reactive-policy-separator-and-token-error-recovery', {
before: policyBefore,
rejected: policyRejected,
recovered: snapshot(policyState),
calls: policyCalls
});
const defaultSearch: any = (0, vue_5.ref)('initial'), defaultCalls: any = [];
let defaultDone: any = () => { };
const defaultApi: any = async (input?: any) => {
defaultCalls.push(input.q);
return [{ label: input.q, value: input.q }];
}, defaultState: any = attach({
source: (0, vue_5.computed)(() => factory.api({ api: defaultApi, params: { q: defaultSearch.value } })),
runtime: (0, ui_4.createAsamDataRuntime)(),
searchText: defaultSearch,
onSuccess: () => defaultDone()
}).state;
await settle(() => defaultState.hasSucceeded.value);
const defaultReady: any = new Promise((done?: any) => {
defaultDone = done;
});
defaultSearch.value = 'discard';
defaultSearch.value = 'default-latest';
const defaultBefore: any = [...defaultCalls];
await defaultReady;
record('options-state-default-search-debounce-retains-only-latest-input', {
before: defaultBefore,
calls: defaultCalls,
snapshot: snapshot(defaultState)
});
const suspendedActive: any = (0, vue_5.ref)(true), suspendedGate: any = gate();
let suspendedCallbacks: any = 0;
const suspendedState: any = attach({
source: factory.api({ api: () => suspendedGate.promise, params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
active: () => suspendedActive.value,
immediate: false,
onSuccess: () => {
suspendedCallbacks++;
}
}).state, suspendedJob: any = suspendedState.reload();
suspendedActive.value = false;
const suspendedResult: any = await suspendedJob;
suspendedGate.release([{ label: 'Suspended', value: 9 }]);
await settle(() => !suspendedState.loading.value);
record('options-state-active-getter-suspends-held-request-without-late-success', {
status: suspendedResult.status,
snapshot: snapshot(suspendedState),
callbacks: suspendedCallbacks
});
let refreshFailureCalls: any = 0, refreshAttempts: any = 0, refreshNotifications: any = 0;
const refreshOriginal: any = Error('owned dict refresh failure'), refreshRuntime: any = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
refreshNotifications++;
},
dict: {
get: async () => {
refreshFailureCalls++;
return [{ label: 'Refresh', value: refreshFailureCalls }];
},
refresh: async () => {
refreshAttempts++;
if (refreshAttempts === 1)
throw refreshOriginal;
}
}
}
}), refreshSource: any = (0, ui_4.defineAsamDictSource)({
dictType: 'refresh-failure',
dictValueType: 'number'
}), refreshA: any = attach({ source: refreshSource, runtime: refreshRuntime, immediate: false }, 'dict').state, refreshB: any = attach({ source: refreshSource, runtime: refreshRuntime, immediate: false }, 'dict').state;
await Promise.all([refreshA.reload(), refreshB.reload()]);
const refreshRejected: any = await Promise.all([
refreshA.reload({ force: true }),
refreshB.reload({ force: true })
]), rejectedA: any = snapshot(refreshA), rejectedB: any = snapshot(refreshB), sameError: any = refreshA.error.value === refreshB.error.value, originalRefreshCause: any = refreshA.error.value?.cause === refreshOriginal;
await Promise.all([refreshA.reload({ force: true }), refreshB.reload({ force: true })]);
record('options-state-dictionary-refresh-failure-shares-notification-and-recovers', {
rejected: refreshRejected.map((r?: any) => r.status),
rejectedA,
rejectedB,
sameError,
originalRefreshCause,
refreshNotifications,
calls: refreshFailureCalls,
refreshAttempts,
recoveredA: snapshot(refreshA),
recoveredB: snapshot(refreshB)
});
const missingRuntime: any = [];
for (const kind of (['remote', 'dict'] as any)) {
try {
attach({
source: factory.api({ api: async () => [], params: undefined }),
immediate: false
}, kind);
throw Error('Expected missing runtime');
}
catch (cause: any) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
missingRuntime.push({ kind, errorKind: cause.kind, message: cause.message });
}
}
record('options-state-both-hooks-require-runtime-outside-a-component', {
cases: missingRuntime
});
if (typeof document !== 'undefined' && optionsStateInjectionTarget.value) {
let injected: any, injectedCalls: any = 0;
let mounted: any = false;
const host: any = document.createElement('div'), app: any = (0, vue_3.createApp)((0, vue_3.defineComponent)({
setup() {
injected = (0, ui_1.useAsamRemoteOptions)({
source: factory.api({
api: async () => {
injectedCalls++;
return [{ label: 'Injected', value: 8 }];
},
params: undefined
}),
immediate: false
});
const state: any = injected;
return () => (0, vue_3.h)('output', { 'data-testid': 'options-state-injected-output' }, JSON.stringify(snapshot(state)));
}
}));
optionsStateInjectionTarget.value.append(host);
(0, ui_1.provideAsamData)(app, {});
try {
app.mount(host);
mounted = true;
if (!injected)
throw Error('Missing injected state');
const noInitialRequest: any = injectedCalls === 0, before: any = snapshot(injected);
await injected.reload();
await (0, vue_3.nextTick)();
const after: any = snapshot(injected), rendered: any = host.querySelector('output') !== null, renderedSnapshot: any = JSON.parse(host.querySelector('output')?.textContent ?? '{}');
app.unmount();
mounted = false;
const cancelledReload: any = (await injected.reload()).status;
record('options-state-mounted-app-injection-and-unmount-cleanup', {
noInitialRequest,
before,
after,
rendered,
renderedSnapshot,
calls: injectedCalls,
cancelledReload
});
}
finally {
if (mounted)
app.unmount();
host.remove();
}
}
optionsStateContractResult.value = observations;
}
catch (cause: any) {
optionsStateContractResult.value = [
...observations,
{
phase: 'options-state-contract-unexpected-failure',
state: { message: cause instanceof Error ? cause.message : String(cause) }
}
];
}
finally {
for (const scope of (scopes as any))
scope.stop();
optionsStateContractBusy.value = false;
}
}
return (_ctx?: any, _cache?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("div", _hoisted_1, [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[0] || (_cache[0] = ($event?: any) => (nativeComposition.value = 'options-state-contract'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[192] || (_cache[192] = [
(0, vue_2.createTextVNode)("打开完整选项状态示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[1] || (_cache[1] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[193] || (_cache[193] = [
(0, vue_2.createTextVNode)("关闭完整选项状态示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'options-state-contract')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_2, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: optionsStateContractBusy.value,
onClick: runOptionsStateContract
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[194] || (_cache[194] = [
(0, vue_2.createTextVNode)("验证远程字典状态与生命周期", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_2.createElementVNode)("div", {
ref_key: "optionsStateInjectionTarget",
ref: optionsStateInjectionTarget
}, null, 512 /* NEED_PATCH */),
(0, vue_2.createElementVNode)("pre", _hoisted_3, (0, vue_2.toDisplayString)(JSON.stringify(optionsStateContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[2] || (_cache[2] = ($event?: any) => (nativeComposition.value = 'source-contract'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[195] || (_cache[195] = [
(0, vue_2.createTextVNode)("打开完整来源工厂示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[3] || (_cache[3] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[196] || (_cache[196] = [
(0, vue_2.createTextVNode)("关闭完整来源工厂示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'source-contract')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_4, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: sourceContractBusy.value,
onClick: runSourceContract
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[197] || (_cache[197] = [
(0, vue_2.createTextVNode)("验证四类来源与单次解析", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_2.createElementVNode)("pre", _hoisted_5, (0, vue_2.toDisplayString)(JSON.stringify(sourceContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[4] || (_cache[4] = ($event?: any) => (nativeComposition.value = 'normalizer-contract'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[198] || (_cache[198] = [
(0, vue_2.createTextVNode)("打开选项分页规范化示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[5] || (_cache[5] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[199] || (_cache[199] = [
(0, vue_2.createTextVNode)("关闭选项分页规范化示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'normalizer-contract')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_6, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: runNormalizerContract
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[200] || (_cache[200] = [
(0, vue_2.createTextVNode)("验证映射树与分页边界", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_7, (0, vue_2.toDisplayString)(JSON.stringify(normalizerContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[6] || (_cache[6] = ($event?: any) => (nativeComposition.value = 'mock-contract'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[201] || (_cache[201] = [
(0, vue_2.createTextVNode)("打开确定性数据模拟示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[7] || (_cache[7] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[202] || (_cache[202] = [
(0, vue_2.createTextVNode)("关闭确定性数据模拟示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'mock-contract')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_8, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: mockContractRunning.value,
onClick: runMockContract
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[203] || (_cache[203] = [
(0, vue_2.createTextVNode)("验证模拟队列与等待门", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_2.createElementVNode)("pre", _hoisted_9, (0, vue_2.toDisplayString)(JSON.stringify(mockContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[8] || (_cache[8] = ($event?: any) => (nativeComposition.value = 'runtime-contract'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[204] || (_cache[204] = [
(0, vue_2.createTextVNode)("打开数据运行时示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[9] || (_cache[9] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[205] || (_cache[205] = [
(0, vue_2.createTextVNode)("关闭数据运行时示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'runtime-contract')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_10, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: runRuntimeContract
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[206] || (_cache[206] = [
(0, vue_2.createTextVNode)("验证运行时完整契约", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_11, (0, vue_2.toDisplayString)(JSON.stringify(runtimeContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[10] || (_cache[10] = ($event?: any) => (nativeComposition.value = 'control-source-types'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[207] || (_cache[207] = [
(0, vue_2.createTextVNode)("打开控件来源类型示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[11] || (_cache[11] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[208] || (_cache[208] = [
(0, vue_2.createTextVNode)("关闭控件来源类型示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'control-source-types')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_12, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: registerControlSourceOrders
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[209] || (_cache[209] = [
(0, vue_2.createTextVNode)("验证来源种类元组", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(controlSourceKeys, (kind?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
key: kind,
"native-type": "button",
onClick: ($event?: any) => (loadControlSource(kind))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)(" 解析控件来源 " + (0, vue_2.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]);
}), 64 /* STABLE_FRAGMENT */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "sourceTypeForm",
ref: sourceTypeForm,
modelValue: sourceTypeModel.value,
"onUpdate:modelValue": _cache[13] || (_cache[13] = ($event?: any) => ((sourceTypeModel).value = $event)),
schema: sourceTypeSchema.value,
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateSourceTypeForm
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[210] || (_cache[210] = [
(0, vue_2.createTextVNode)("校验来源模型", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[12] || (_cache[12] = ($event?: any) => (sourceTypeForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[211] || (_cache[211] = [
(0, vue_2.createTextVNode)("重置来源模型", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema"]),
(0, vue_2.createElementVNode)("pre", _hoisted_13, (0, vue_2.toDisplayString)(JSON.stringify(controlSourceRegistration.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_14, (0, vue_2.toDisplayString)(JSON.stringify(controlSourceLoad.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_15, (0, vue_2.toDisplayString)(JSON.stringify(sourceTypeModel.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_16, (0, vue_2.toDisplayString)(JSON.stringify(sourceTypeSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[14] || (_cache[14] = ($event?: any) => (nativeComposition.value = 'reserved-props'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[212] || (_cache[212] = [
(0, vue_2.createTextVNode)("打开控件属性边界示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[15] || (_cache[15] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[213] || (_cache[213] = [
(0, vue_2.createTextVNode)("关闭控件属性边界示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'reserved-props')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_17, [
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(reservedPropKeys, (key?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
key: key,
"native-type": "button",
onClick: ($event?: any) => (attemptReservedProp(key))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)(" 拒绝控件属性 " + (0, vue_2.toDisplayString)(key), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]);
}), 64 /* STABLE_FRAGMENT */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: restoreReservedProps
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[214] || (_cache[214] = [
(0, vue_2.createTextVNode)("恢复合法控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: captureReservedState
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[215] || (_cache[215] = [
(0, vue_2.createTextVNode)("读取属性观察", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "reservedForm",
ref: reservedForm,
modelValue: reservedModel.value,
"onUpdate:modelValue": _cache[17] || (_cache[17] = ($event?: any) => ((reservedModel).value = $event)),
schema: reservedSchema.value,
registry: (0, vue_2.unref)(reservedRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateReservedForm
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[216] || (_cache[216] = [
(0, vue_2.createTextVNode)("校验合法属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[16] || (_cache[16] = ($event?: any) => (reservedForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[217] || (_cache[217] = [
(0, vue_2.createTextVNode)("重置合法属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema", "registry"]),
(0, vue_2.createElementVNode)("pre", _hoisted_18, (0, vue_2.toDisplayString)(JSON.stringify(reservedState.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_19, (0, vue_2.toDisplayString)(JSON.stringify(reservedSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[18] || (_cache[18] = ($event?: any) => (nativeComposition.value = 'schema-union'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[218] || (_cache[218] = [
(0, vue_2.createTextVNode)("打开 schema 联合分支示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[19] || (_cache[19] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[219] || (_cache[219] = [
(0, vue_2.createTextVNode)("关闭 schema 联合分支示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'schema-union')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_20, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[20] || (_cache[20] = ($event?: any) => (unionSourceMode.value = 'fixed'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[220] || (_cache[220] = [
(0, vue_2.createTextVNode)("固定来源分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[21] || (_cache[21] = ($event?: any) => (unionSourceMode.value = 'resolver'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[221] || (_cache[221] = [
(0, vue_2.createTextVNode)("派生来源分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[22] || (_cache[22] = ($event?: any) => (unionPropsMode.value = 'optional'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[222] || (_cache[222] = [
(0, vue_2.createTextVNode)("可选控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[23] || (_cache[23] = ($event?: any) => (unionPropsMode.value = 'required'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[223] || (_cache[223] = [
(0, vue_2.createTextVNode)("必填控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "unionForm",
ref: unionForm,
modelValue: unionModel.value,
"onUpdate:modelValue": _cache[25] || (_cache[25] = ($event?: any) => ((unionModel).value = $event)),
schema: unionSchema.value,
registry: (0, vue_2.unref)(protocolRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateUnionField
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[224] || (_cache[224] = [
(0, vue_2.createTextVNode)("校验联合分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[24] || (_cache[24] = ($event?: any) => (unionForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[225] || (_cache[225] = [
(0, vue_2.createTextVNode)("重置联合分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema", "registry"]),
(0, vue_2.createElementVNode)("pre", _hoisted_21, (0, vue_2.toDisplayString)(JSON.stringify({ source: unionSourceMode.value, props: unionPropsMode.value, model: unionModel.value, component: unionSchema.value[0].component, hasComponentProps: Object.hasOwn(unionSchema.value[0], 'componentProps'), hasResolver: typeof unionSchema.value[0].resolveDataSource === 'function' })), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_22, (0, vue_2.toDisplayString)(JSON.stringify(unionSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[26] || (_cache[26] = ($event?: any) => (nativeComposition.value = 'control'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[226] || (_cache[226] = [
(0, vue_2.createTextVNode)("打开控件注册示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[27] || (_cache[27] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[227] || (_cache[227] = [
(0, vue_2.createTextVNode)("关闭控件注册示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'control')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_23, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "protocolForm",
ref: protocolForm,
modelValue: protocolModel.value,
"onUpdate:modelValue": _cache[29] || (_cache[29] = ($event?: any) => ((protocolModel).value = $event)),
schema: protocolSchema,
registry: (0, vue_2.unref)(protocolRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateProtocolControl
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[228] || (_cache[228] = [
(0, vue_2.createTextVNode)("校验注册控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[28] || (_cache[28] = ($event?: any) => (protocolForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[229] || (_cache[229] = [
(0, vue_2.createTextVNode)("重置注册控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "registry"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: checkProtocolRegistration
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[230] || (_cache[230] = [
(0, vue_2.createTextVNode)("检查注册约束", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_24, (0, vue_2.toDisplayString)(JSON.stringify(protocolDefinition)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_25, (0, vue_2.toDisplayString)(JSON.stringify(protocolConstraints.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_26, (0, vue_2.toDisplayString)(JSON.stringify(protocolModel.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_27, (0, vue_2.toDisplayString)(JSON.stringify(protocolSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createElementVNode)("section", _hoisted_28, [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[30] || (_cache[30] = ($event?: any) => (nativeComposition.value = 'validation'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[231] || (_cache[231] = [
(0, vue_2.createTextVNode)("打开原生完整规则表单", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[31] || (_cache[31] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[232] || (_cache[232] = [
(0, vue_2.createTextVNode)("关闭原生完整规则表单", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'validation')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_29, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "nativeRuleForm",
ref: nativeRuleForm,
modelValue: nativeRuleModel.value,
"onUpdate:modelValue": _cache[44] || (_cache[44] = ($event?: any) => ((nativeRuleModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
rules: nativeRuleRules,
"validate-on-rule-change": false,
"label-width": "auto",
style: { "max-width": "600px" },
onValidate: onNativeRuleValidate
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动名称",
prop: "name"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": nativeRuleModel.value.name,
"onUpdate:modelValue": _cache[32] || (_cache[32] = ($event?: any) => (updateNativeRule({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动区域",
prop: "region"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSelect), {
"model-value": nativeRuleModel.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动区域",
"onUpdate:modelValue": _cache[33] || (_cache[33] = ($event?: any) => (updateNativeRule({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动数量",
prop: "count"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSelectV2), {
"model-value": nativeRuleModel.value.count,
options: (0, vue_2.unref)(nativeCountOptions),
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动数量",
"onUpdate:modelValue": _cache[34] || (_cache[34] = ($event?: any) => (updateNativeRule({ count: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value", "options"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动时间",
required: ""
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_30, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { prop: "date1" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamDatePicker), {
"model-value": nativeRuleModel.value.date1,
"value-format": "",
type: "date",
"aria-label": "选择日期",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[35] || (_cache[35] = ($event?: any) => (updateNativeRule({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
_cache[233] || (_cache[233] = (0, vue_2.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { prop: "date2" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamTimePicker), {
"model-value": nativeRuleModel.value.date2,
"value-format": "",
"aria-label": "选择时间",
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[36] || (_cache[36] = ($event?: any) => (updateNativeRule({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
})
])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "即时配送",
prop: "delivery"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSwitch), {
"model-value": nativeRuleModel.value.delivery,
"onUpdate:modelValue": _cache[37] || (_cache[37] = ($event?: any) => (updateNativeRule({ delivery: Boolean($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动地点",
prop: "location"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSegmented), {
"model-value": nativeRuleModel.value.location,
options: nativeLocations,
"onUpdate:modelValue": _cache[38] || (_cache[38] = ($event?: any) => (updateNativeRule({ location: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动类型",
prop: "type"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamCheckboxGroup), {
"model-value": nativeRuleModel.value.type,
"onUpdate:modelValue": _cache[39] || (_cache[39] = ($event?: any) => (updateNativeRule({ type: $event.map(String) })))
}, {
default: (0, vue_2.withCtx)(() => [
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(nativeActivityTypes, (kind?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "资源",
prop: "resource"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeRuleModel.value.resource,
"onUpdate:modelValue": _cache[40] || (_cache[40] = ($event?: any) => (updateNativeRule({ resource: String($event) })))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), { value: "Sponsorship" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[234] || (_cache[234] = [
(0, vue_2.createTextVNode)("赞助", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), { value: "Venue" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[235] || (_cache[235] = [
(0, vue_2.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "活动表单",
prop: "desc"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamTextarea), {
"model-value": nativeRuleModel.value.desc,
"onUpdate:modelValue": _cache[41] || (_cache[41] = ($event?: any) => (updateNativeRule({ desc: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_31, [
(0, vue_2.createElementVNode)("div", _hoisted_32, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
onClick: _cache[42] || (_cache[42] = ($event?: any) => (validateNativeRule(true)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[236] || (_cache[236] = [
(0, vue_2.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
onClick: _cache[43] || (_cache[43] = ($event?: any) => (nativeRuleForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[237] || (_cache[237] = [
(0, vue_2.createTextVNode)(" 重置 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[45] || (_cache[45] = ($event?: any) => (validateNativeRule(false)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[238] || (_cache[238] = [
(0, vue_2.createTextVNode)("原生规则无回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeRuleFields
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[239] || (_cache[239] = [
(0, vue_2.createTextVNode)("读取完整规则字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_33, (0, vue_2.toDisplayString)(JSON.stringify({
model: nativeRuleModel.value,
date: nativeDateFacts(nativeRuleModel.value.date1),
time: nativeDateFacts(nativeRuleModel.value.date2),
optionCount: (0, vue_2.unref)(nativeCountOptions).length,
events: nativeRuleEvents.value,
submissions: nativeRuleSubmissions.value
})), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_34, (0, vue_2.toDisplayString)(JSON.stringify(nativeRuleSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_35, (0, vue_2.toDisplayString)(JSON.stringify(nativeRuleCallback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_36, (0, vue_2.toDisplayString)(JSON.stringify(nativeRuleFields.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[46] || (_cache[46] = ($event?: any) => (nativeComposition.value = 'size'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[240] || (_cache[240] = [
(0, vue_2.createTextVNode)("打开原生尺寸组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[47] || (_cache[47] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[241] || (_cache[241] = [
(0, vue_2.createTextVNode)("关闭原生尺寸组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'size')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_37, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeSize.value,
"aria-label": "尺寸控制",
"onUpdate:modelValue": updateNativeSize
}, {
default: (0, vue_2.withCtx)(() => [
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(nativeSizes, (density?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioButton), {
key: density,
value: density
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(density), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeSizePosition.value,
"aria-label": "位置控制",
"onUpdate:modelValue": updateNativeSizePosition
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioButton), { value: "left" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[242] || (_cache[242] = [
(0, vue_2.createTextVNode)("左侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioButton), { value: "right" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[243] || (_cache[243] = [
(0, vue_2.createTextVNode)("右侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioButton), { value: "top" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[244] || (_cache[244] = [
(0, vue_2.createTextVNode)("顶部", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
modelValue: sizeActivity.value,
"onUpdate:modelValue": _cache[54] || (_cache[54] = ($event?: any) => ((sizeActivity).value = $event)),
inline: false,
"label-position": nativeSizePosition.value,
size: nativeSize.value,
"show-search": false,
"show-reset": false,
"label-width": "auto",
style: { "max-width": "600px" }
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动名称" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": sizeActivity.value.name,
"onUpdate:modelValue": _cache[48] || (_cache[48] = ($event?: any) => (updateSizeActivity({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSelect), {
"model-value": sizeActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "请选择区域",
"onUpdate:modelValue": _cache[49] || (_cache[49] = ($event?: any) => (updateSizeActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_38, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": sizeActivity.value.date1,
type: "date",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[50] || (_cache[50] = ($event?: any) => (updateSizeActivity({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"]),
_cache[245] || (_cache[245] = (0, vue_2.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamTimePicker), {
"value-format": "",
"model-value": sizeActivity.value.date2,
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[51] || (_cache[51] = ($event?: any) => (updateSizeActivity({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动类型" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamCheckboxGroup), {
"model-value": sizeActivity.value.type,
"onUpdate:modelValue": _cache[52] || (_cache[52] = ($event?: any) => (updateSizeActivity({ type: $event.map(String) })))
}, {
default: (0, vue_2.withCtx)(() => [
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(nativeSizeTypes, (kind?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamCheckboxButton), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "资源" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioGroup), {
"model-value": sizeActivity.value.resource,
"onUpdate:modelValue": _cache[53] || (_cache[53] = ($event?: any) => (updateSizeActivity({ resource: String($event) })))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
border: "",
value: "Sponsor"
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[246] || (_cache[246] = [
(0, vue_2.createTextVNode)("赞助者", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
border: "",
value: "Venue"
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[247] || (_cache[247] = [
(0, vue_2.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_39, [
(0, vue_2.createElementVNode)("div", _hoisted_40, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitSizeActivity
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[248] || (_cache[248] = [
(0, vue_2.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), { type: "default" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[249] || (_cache[249] = [
(0, vue_2.createTextVNode)("取消", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "label-position", "size"]),
(0, vue_2.createElementVNode)("pre", _hoisted_41, (0, vue_2.toDisplayString)(JSON.stringify({
size: nativeSize.value,
position: nativeSizePosition.value,
model: sizeActivity.value,
date: nativeDateFacts(sizeActivity.value.date1),
time: nativeDateFacts(sizeActivity.value.date2),
submissions: sizeSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[55] || (_cache[55] = ($event?: any) => (nativeComposition.value = 'basic'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[250] || (_cache[250] = [
(0, vue_2.createTextVNode)("打开原生基础表单组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[56] || (_cache[56] = ($event?: any) => (nativeComposition.value = 'inline'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[251] || (_cache[251] = [
(0, vue_2.createTextVNode)("打开原生行内表单组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[57] || (_cache[57] = ($event?: any) => (nativeComposition.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[252] || (_cache[252] = [
(0, vue_2.createTextVNode)("关闭原生基础行内组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'basic')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_42, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
modelValue: basicActivity.value,
"onUpdate:modelValue": _cache[66] || (_cache[66] = ($event?: any) => ((basicActivity).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-width": "auto",
style: { "max-width": "600px" }
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动名称" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": basicActivity.value.name,
"onUpdate:modelValue": _cache[58] || (_cache[58] = ($event?: any) => (updateBasicActivity({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSelect), {
"model-value": basicActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "请选择区域",
"onUpdate:modelValue": _cache[59] || (_cache[59] = ($event?: any) => (updateBasicActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_43, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": basicActivity.value.date1,
type: "date",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[60] || (_cache[60] = ($event?: any) => (updateBasicActivity({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"]),
_cache[253] || (_cache[253] = (0, vue_2.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamTimePicker), {
"value-format": "",
"model-value": basicActivity.value.date2,
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[61] || (_cache[61] = ($event?: any) => (updateBasicActivity({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "即时配送" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSwitch), {
"model-value": basicActivity.value.delivery,
"onUpdate:modelValue": _cache[62] || (_cache[62] = ($event?: any) => (updateBasicActivity({ delivery: Boolean($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动类型" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamCheckboxGroup), {
"model-value": basicActivity.value.type,
"onUpdate:modelValue": _cache[63] || (_cache[63] = ($event?: any) => (updateBasicActivity({ type: $event.map(String) })))
}, {
default: (0, vue_2.withCtx)(() => [
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(nativeActivityTypes, (kind?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "资源" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamRadioGroup), {
"model-value": basicActivity.value.resource,
"onUpdate:modelValue": _cache[64] || (_cache[64] = ($event?: any) => (updateBasicActivity({ resource: String($event) })))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), { value: "Sponsor" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[254] || (_cache[254] = [
(0, vue_2.createTextVNode)("赞助者", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), { value: "Venue" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[255] || (_cache[255] = [
(0, vue_2.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动表单" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamTextarea), {
"model-value": basicActivity.value.desc,
"onUpdate:modelValue": _cache[65] || (_cache[65] = ($event?: any) => (updateBasicActivity({ desc: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_44, [
(0, vue_2.createElementVNode)("div", _hoisted_45, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitBasicActivity
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[256] || (_cache[256] = [
(0, vue_2.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), { type: "default" }, {
default: (0, vue_2.withCtx)(() => [...(_cache[257] || (_cache[257] = [
(0, vue_2.createTextVNode)("取消", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createElementVNode)("pre", _hoisted_46, (0, vue_2.toDisplayString)(JSON.stringify({
model: basicActivity.value,
date: nativeDateFacts(basicActivity.value.date1),
time: nativeDateFacts(basicActivity.value.date2),
submissions: basicSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'inline')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_47, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
modelValue: inlineActivity.value,
"onUpdate:modelValue": _cache[70] || (_cache[70] = ($event?: any) => ((inlineActivity).value = $event)),
inline: true,
"show-search": false,
"show-reset": false
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "审核人" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": inlineActivity.value.user,
placeholder: "审核人",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[67] || (_cache[67] = ($event?: any) => (updateInlineActivity({ user: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamSelect), {
"model-value": inlineActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动区域",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[68] || (_cache[68] = ($event?: any) => (updateInlineActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": inlineActivity.value.date,
type: "date",
placeholder: "选择日期",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[69] || (_cache[69] = ($event?: any) => (updateInlineActivity({ date: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitInlineActivity
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[258] || (_cache[258] = [
(0, vue_2.createTextVNode)(" 查询 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createElementVNode)("pre", _hoisted_48, (0, vue_2.toDisplayString)(JSON.stringify({
model: inlineActivity.value,
date: nativeDateFacts(inlineActivity.value.date),
submissions: inlineSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[71] || (_cache[71] = ($event?: any) => (dynamicCase.value = true))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[259] || (_cache[259] = [
(0, vue_2.createTextVNode)("打开动态字段组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[72] || (_cache[72] = ($event?: any) => (dynamicCase.value = false))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[260] || (_cache[260] = [
(0, vue_2.createTextVNode)("关闭动态字段组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(dynamicCase.value)
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_49, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
ref_key: "dynamicForm",
ref: dynamicForm,
modelValue: dynamicModel.value,
"onUpdate:modelValue": _cache[73] || (_cache[73] = ($event?: any) => ((dynamicModel).value = $event)),
"show-search": false,
"show-reset": false,
inline: false,
"label-width": "auto",
rules: dynamicRules.value,
"validate-on-rule-change": false,
onValidate: onDynamicValidate
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "电子邮箱",
prop: "email"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": dynamicModel.value.email,
"onUpdate:modelValue": updateDynamicEmail
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
((0, vue_2.openBlock)(true), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(dynamicModel.value.domains, (domain?: any, index?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamFormItem), {
key: domain.key,
label: 'Domain' + index,
prop: 'domains.' + index + '.value',
rules: {
required: true,
message: 'domain can not be null',
trigger: 'blur'
},
"data-domain-key": domain.key
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_50, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": domain.value,
"onUpdate:modelValue": ($event?: any) => (updateDynamicDomain(domain.key, $event))
}, null, 8 /* PROPS */, ["model-value", "onUpdate:modelValue"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
"aria-label": 'Delete Domain' + index,
onClick: ($event?: any) => (removeDynamicDomain(domain.key))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[261] || (_cache[261] = [
(0, vue_2.createTextVNode)(" 删除 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["aria-label", "onClick"])
])
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["label", "prop", "data-domain-key"]));
}), 128 /* KEYED_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "rules"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[74] || (_cache[74] = ($event?: any) => (validateDynamic(false)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[262] || (_cache[262] = [
(0, vue_2.createTextVNode)("动态无回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[75] || (_cache[75] = ($event?: any) => (validateDynamic(true)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[263] || (_cache[263] = [
(0, vue_2.createTextVNode)("动态回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: addDynamicDomain
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[264] || (_cache[264] = [
(0, vue_2.createTextVNode)("新增域名", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[76] || (_cache[76] = ($event?: any) => (dynamicForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[265] || (_cache[265] = [
(0, vue_2.createTextVNode)("动态重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readDynamicFields
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[266] || (_cache[266] = [
(0, vue_2.createTextVNode)("读取动态字段状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_51, (0, vue_2.toDisplayString)(JSON.stringify({ model: dynamicModel.value, events: dynamicEvents.value })), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_52, (0, vue_2.toDisplayString)(JSON.stringify(dynamicSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_53, (0, vue_2.toDisplayString)(JSON.stringify(dynamicCallback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_54, (0, vue_2.toDisplayString)(JSON.stringify(dynamicFields.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[77] || (_cache[77] = ($event?: any) => (compositionCase.value = 'alignment'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[267] || (_cache[267] = [
(0, vue_2.createTextVNode)("打开标签对齐组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[78] || (_cache[78] = ($event?: any) => (compositionCase.value = 'accessibility'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[268] || (_cache[268] = [
(0, vue_2.createTextVNode)(" 打开可访问性组合示例 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[79] || (_cache[79] = ($event?: any) => (compositionCase.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[269] || (_cache[269] = [
(0, vue_2.createTextVNode)("关闭对齐可访问性示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(compositionCase.value === 'alignment')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_55, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
modelValue: alignmentModel.value,
"onUpdate:modelValue": _cache[82] || (_cache[82] = ($event?: any) => ((alignmentModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-width": "auto",
"label-position": alignmentFormPosition.value
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "表单对齐",
"label-position": "right",
"data-testid": "alignment-form-control"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_56, [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(alignmentFormPositions, (position?: any) => {
return (0, vue_2.createElementVNode)("label", { key: position }, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
modelValue: alignmentFormPosition.value,
"onUpdate:modelValue": _cache[80] || (_cache[80] = ($event?: any) => ((alignmentFormPosition).value = $event)),
value: position
}, null, 8 /* PROPS */, ["modelValue", "value"]),
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(position), 1 /* TEXT */)
]);
}), 64 /* STABLE_FRAGMENT */))
])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "表单项对齐",
"label-position": "right",
"data-testid": "alignment-item-control"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_57, [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(alignmentItemPositions, (position?: any) => {
return (0, vue_2.createElementVNode)("label", { key: position }, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
modelValue: alignmentItemPosition.value,
"onUpdate:modelValue": _cache[81] || (_cache[81] = ($event?: any) => ((alignmentItemPosition).value = $event)),
value: position
}, null, 8 /* PROPS */, ["modelValue", "value"]),
(0, vue_2.createTextVNode)((0, vue_2.toDisplayString)(position || 'Empty'), 1 /* TEXT */)
]);
}), 64 /* STABLE_FRAGMENT */))
])
]),
_: 1 /* STABLE */
}),
((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)(vue_2.Fragment, null, (0, vue_2.renderList)(alignmentFields, (field?: any) => {
return (0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
key: field.key,
label: field.label,
"label-position": alignmentItemPosition.value,
"data-testid": 'alignment-' + field.key
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": alignmentModel.value[field.key],
"onUpdate:modelValue": ($event?: any) => (updateAlignment(field.key, $event))
}, null, 8 /* PROPS */, ["model-value", "onUpdate:modelValue"])
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["label", "label-position", "data-testid"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "label-position"]),
(0, vue_2.createElementVNode)("pre", _hoisted_58, (0, vue_2.toDisplayString)(JSON.stringify({
model: alignmentModel.value,
formPosition: alignmentFormPosition.value,
itemPosition: alignmentItemPosition.value
})), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(compositionCase.value === 'accessibility')
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_59, [
_cache[270] || (_cache[270] = (0, vue_2.createElementVNode)("p", { class: "example-paragraph" }, " Full Name 标签自动关联单个输入;Your Information 标识多输入组,每个输入仍有独立的 aria-label。placeholder 不替代可访问名称。 ", -1 /* CACHED */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamForm), {
modelValue: accessibilityModel.value,
"onUpdate:modelValue": _cache[86] || (_cache[86] = ($event?: any) => ((accessibilityModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-position": "left",
"label-width": "auto"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "完整姓名",
"data-testid": "accessibility-single"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.fullName,
"onUpdate:modelValue": _cache[83] || (_cache[83] = ($event?: any) => (updateAccessibility('fullName', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "你的信息",
"data-testid": "accessibility-group"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createElementVNode)("div", _hoisted_60, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.firstName,
"aria-label": "名",
placeholder: "名",
"onUpdate:modelValue": _cache[84] || (_cache[84] = ($event?: any) => (updateAccessibility('firstName', $event)))
}, null, 8 /* PROPS */, ["model-value"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.lastName,
"aria-label": "姓",
placeholder: "姓",
"onUpdate:modelValue": _cache[85] || (_cache[85] = ($event?: any) => (updateAccessibility('lastName', $event)))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createElementVNode)("pre", _hoisted_61, (0, vue_2.toDisplayString)(JSON.stringify(accessibilityModel.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[87] || (_cache[87] = ($event?: any) => (openValidationCase('custom')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[271] || (_cache[271] = [
(0, vue_2.createTextVNode)("打开自定义校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[88] || (_cache[88] = ($event?: any) => (openValidationCase('number')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[272] || (_cache[272] = [
(0, vue_2.createTextVNode)("打开数字校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[89] || (_cache[89] = ($event?: any) => (validationCase.value = undefined))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[273] || (_cache[273] = [
(0, vue_2.createTextVNode)("关闭校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(validationCase.value)
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_62, [
((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamForm), {
key: validationCase.value,
ref_key: "validationForm",
ref: validationForm,
modelValue: validationModel.value,
"onUpdate:modelValue": _cache[92] || (_cache[92] = ($event?: any) => ((validationModel).value = $event)),
"show-search": false,
"show-reset": false,
rules: validationRules.value,
"validate-on-rule-change": false,
"status-icon": "",
onValidate: onValidationCaseEvent
}, {
default: (0, vue_2.withCtx)(() => [
(validationCase.value === 'custom')
? ((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamFormItem), {
key: 0,
label: "密码",
prop: "password"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamPassword), {
"model-value": validationModel.value.password,
"onUpdate:modelValue": _cache[90] || (_cache[90] = ($event?: any) => (updateValidationText('password', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}))
: (0, vue_2.createCommentVNode)("v-if", true),
(validationCase.value === 'custom')
? ((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamFormItem), {
key: 1,
label: "确认密码",
prop: "confirm"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamPassword), {
"model-value": validationModel.value.confirm,
"onUpdate:modelValue": _cache[91] || (_cache[91] = ($event?: any) => (updateValidationText('confirm', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamFormItem), {
label: "年龄",
prop: "age"
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
"model-value": validationModel.value.age,
"onUpdate:modelValue": updateValidationAge
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "rules"])),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[93] || (_cache[93] = ($event?: any) => (validateCase(false)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[274] || (_cache[274] = [
(0, vue_2.createTextVNode)("示例无回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[94] || (_cache[94] = ($event?: any) => (validateCase(true)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[275] || (_cache[275] = [
(0, vue_2.createTextVNode)("示例回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[95] || (_cache[95] = ($event?: any) => (validationForm.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[276] || (_cache[276] = [
(0, vue_2.createTextVNode)("示例重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readValidationCase
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[277] || (_cache[277] = [
(0, vue_2.createTextVNode)("读取示例字段状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("pre", _hoisted_63, (0, vue_2.toDisplayString)(JSON.stringify({
kind: validationCase.value,
model: validationModel.value,
pending: ageValidationPending.value,
events: validationEvents.value,
crossValidation: confirmRevalidation.value
})), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_64, (0, vue_2.toDisplayString)(JSON.stringify(validationCaseSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_65, (0, vue_2.toDisplayString)(JSON.stringify(validationCaseCallback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_66, (0, vue_2.toDisplayString)(JSON.stringify(validationCaseFields.value)), 1 /* TEXT */)
]))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[96] || (_cache[96] = ($event?: any) => (validateNativeSubset('profile.nickname')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[278] || (_cache[278] = [
(0, vue_2.createTextVNode)(" 原生校验嵌套字符串字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[97] || (_cache[97] = ($event?: any) => (validateNativeSubset([['profile', 'nickname']])))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[279] || (_cache[279] = [
(0, vue_2.createTextVNode)(" 原生校验嵌套分段数组字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateNativeNestedCallback
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[280] || (_cache[280] = [
(0, vue_2.createTextVNode)("原生嵌套回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[98] || (_cache[98] = ($event?: any) => (form.value?.setFieldsValue({
name: 'Mixed live',
status: 'yes',
profile: { nickname: 'Nested live' }
})))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[281] || (_cache[281] = [
(0, vue_2.createTextVNode)(" 准备混合当前模型 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[99] || (_cache[99] = ($event?: any) => (form.value?.setInitialValues({
name: 'Mixed initial',
profile: { nickname: 'Mixed nested A' }
})))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[282] || (_cache[282] = [
(0, vue_2.createTextVNode)(" 混合姓名嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[100] || (_cache[100] = ($event?: any) => (form.value?.setInitialValues({
status: 'yes',
profile: { nickname: 'Mixed nested B' }
})))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[283] || (_cache[283] = [
(0, vue_2.createTextVNode)(" 混合状态嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[101] || (_cache[101] = ($event?: any) => (form.value?.setInitialValues({ name: 'Omitted nested' })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[284] || (_cache[284] = [
(0, vue_2.createTextVNode)(" 省略嵌套初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[102] || (_cache[102] = ($event?: any) => (form.value?.setInitialValues({ name: '', status: 'no', profile: { nickname: '' } })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[285] || (_cache[285] = [
(0, vue_2.createTextVNode)(" 恢复完整嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("fieldset", _hoisted_67, [
_cache[324] || (_cache[324] = (0, vue_2.createElementVNode)("legend", null, "原生嵌套 FormItem", -1 /* CACHED */)),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: enableNativeItem
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[286] || (_cache[286] = [
(0, vue_2.createTextVNode)("启用嵌套字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: disableNativeItem
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[287] || (_cache[287] = [
(0, vue_2.createTextVNode)("关闭嵌套字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemArrayPath.value,
"onUpdate:modelValue": _cache[103] || (_cache[103] = ($event?: any) => ((itemArrayPath).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[288] || (_cache[288] = [
(0, vue_2.createTextVNode)("使用分段字段路径", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemLabelSlot.value,
"onUpdate:modelValue": _cache[104] || (_cache[104] = ($event?: any) => ((itemLabelSlot).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[289] || (_cache[289] = [
(0, vue_2.createTextVNode)("使用字段标签插槽", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemErrorSlot.value,
"onUpdate:modelValue": _cache[105] || (_cache[105] = ($event?: any) => ((itemErrorSlot).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[290] || (_cache[290] = [
(0, vue_2.createTextVNode)("使用字段错误插槽", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemRulesEnabled.value,
"onUpdate:modelValue": _cache[106] || (_cache[106] = ($event?: any) => ((itemRulesEnabled).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[291] || (_cache[291] = [
(0, vue_2.createTextVNode)("使用字段规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemRequired.value,
"onUpdate:modelValue": _cache[107] || (_cache[107] = ($event?: any) => ((itemRequired).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[292] || (_cache[292] = [
(0, vue_2.createTextVNode)("字段显式必填", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemArrayRules.value,
"onUpdate:modelValue": _cache[108] || (_cache[108] = ($event?: any) => ((itemArrayRules).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[293] || (_cache[293] = [
(0, vue_2.createTextVNode)("使用数组和多触发器规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemHideMessage.value,
"onUpdate:modelValue": _cache[109] || (_cache[109] = ($event?: any) => ((itemHideMessage).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[294] || (_cache[294] = [
(0, vue_2.createTextVNode)("隐藏字段校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemInlineMessage.value,
"onUpdate:modelValue": _cache[110] || (_cache[110] = ($event?: any) => ((itemInlineMessage).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[295] || (_cache[295] = [
(0, vue_2.createTextVNode)("字段行内校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemExternalError.value,
"onUpdate:modelValue": _cache[111] || (_cache[111] = ($event?: any) => ((itemExternalError).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[296] || (_cache[296] = [
(0, vue_2.createTextVNode)("字段外部错误", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemForcedSuccess.value,
"onUpdate:modelValue": _cache[112] || (_cache[112] = ($event?: any) => ((itemForcedSuccess).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[297] || (_cache[297] = [
(0, vue_2.createTextVNode)("字段强制成功状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[113] || (_cache[113] = ($event?: any) => (itemLabelPosition.value = 'left'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[298] || (_cache[298] = [
(0, vue_2.createTextVNode)("字段左侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[114] || (_cache[114] = ($event?: any) => (itemLabelPosition.value = 'right'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[299] || (_cache[299] = [
(0, vue_2.createTextVNode)("字段右侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[115] || (_cache[115] = ($event?: any) => (itemLabelPosition.value = 'top'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[300] || (_cache[300] = [
(0, vue_2.createTextVNode)("字段顶部标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[116] || (_cache[116] = ($event?: any) => (itemLabelWidth.value = 'auto'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[301] || (_cache[301] = [
(0, vue_2.createTextVNode)("字段自动标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[117] || (_cache[117] = ($event?: any) => (itemLabelWidth.value = 120))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[302] || (_cache[302] = [
(0, vue_2.createTextVNode)("字段恢复标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[118] || (_cache[118] = ($event?: any) => (itemLabelText.value = '昵称'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[303] || (_cache[303] = [
(0, vue_2.createTextVNode)("字段短标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[119] || (_cache[119] = ($event?: any) => (itemLabelText.value = '这是较长的嵌套昵称标签'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[304] || (_cache[304] = [
(0, vue_2.createTextVNode)(" 字段长标签 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[120] || (_cache[120] = ($event?: any) => (itemLabelText.value = '嵌套昵称'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[305] || (_cache[305] = [
(0, vue_2.createTextVNode)("字段恢复标签文本", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[121] || (_cache[121] = ($event?: any) => (itemRequiredMode.value = 'explicit'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[306] || (_cache[306] = [
(0, vue_2.createTextVNode)("字段显式必填属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[122] || (_cache[122] = ($event?: any) => (itemRequiredMode.value = 'undefined'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[307] || (_cache[307] = [
(0, vue_2.createTextVNode)(" 字段未定义必填属性 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[123] || (_cache[123] = ($event?: any) => (itemRequiredMode.value = 'omitted'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[308] || (_cache[308] = [
(0, vue_2.createTextVNode)("字段省略必填属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[124] || (_cache[124] = ($event?: any) => (itemLabelWidth.value = 168))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[309] || (_cache[309] = [
(0, vue_2.createTextVNode)("字段数字标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[125] || (_cache[125] = ($event?: any) => (itemLabelWidth.value = '200px'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[310] || (_cache[310] = [
(0, vue_2.createTextVNode)("字段文本标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[126] || (_cache[126] = ($event?: any) => (itemSize.value = 'large'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[311] || (_cache[311] = [
(0, vue_2.createTextVNode)("字段 large 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[127] || (_cache[127] = ($event?: any) => (itemSize.value = 'big'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[312] || (_cache[312] = [
(0, vue_2.createTextVNode)("字段 big 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[128] || (_cache[128] = ($event?: any) => (itemSize.value = 'default'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[313] || (_cache[313] = [
(0, vue_2.createTextVNode)("字段 default 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[129] || (_cache[129] = ($event?: any) => (itemSize.value = 'small'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[314] || (_cache[314] = [
(0, vue_2.createTextVNode)("字段 small 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[130] || (_cache[130] = ($event?: any) => (validateNativeItem('blur')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[315] || (_cache[315] = [
(0, vue_2.createTextVNode)("字段 blur 校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[131] || (_cache[131] = ($event?: any) => (validateNativeItem('change')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[316] || (_cache[316] = [
(0, vue_2.createTextVNode)("字段 change 校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[132] || (_cache[132] = ($event?: any) => (validateNativeItem('blur', true)))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[317] || (_cache[317] = [
(0, vue_2.createTextVNode)("字段回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[133] || (_cache[133] = ($event?: any) => (nativeItem.value?.clearValidate()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[318] || (_cache[318] = [
(0, vue_2.createTextVNode)("字段清除校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[134] || (_cache[134] = ($event?: any) => (nativeItem.value?.setInitialValue('Item initial')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[319] || (_cache[319] = [
(0, vue_2.createTextVNode)(" 字段设置初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[135] || (_cache[135] = ($event?: any) => (nativeItem.value?.resetField()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[320] || (_cache[320] = [
(0, vue_2.createTextVNode)("字段恢复初始值", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[136] || (_cache[136] = ($event?: any) => (form.value?.setInitialValues({ profile: { nickname: 'Form nested initial' } })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[321] || (_cache[321] = [
(0, vue_2.createTextVNode)(" 表单设置嵌套初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[137] || (_cache[137] = ($event?: any) => (form.value?.resetFields(['profile.nickname'])))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[322] || (_cache[322] = [
(0, vue_2.createTextVNode)(" 表单重置嵌套字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeItem
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[323] || (_cache[323] = [
(0, vue_2.createTextVNode)("读取字段公开状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeFields
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[325] || (_cache[325] = [
(0, vue_2.createTextVNode)("读取原生表单字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[138] || (_cache[138] = ($event?: any) => (validateNativeSubset('name')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[326] || (_cache[326] = [
(0, vue_2.createTextVNode)("原生校验字符串字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[139] || (_cache[139] = ($event?: any) => (validateNativeSubset(['name', 'status'])))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[327] || (_cache[327] = [
(0, vue_2.createTextVNode)(" 原生校验数组字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[140] || (_cache[140] = ($event?: any) => (validateNativeSubset()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[328] || (_cache[328] = [
(0, vue_2.createTextVNode)("原生校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateNativeSubsetCallback
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[329] || (_cache[329] = [
(0, vue_2.createTextVNode)("原生字段回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[141] || (_cache[141] = ($event?: any) => (form.value?.setInitialValues({ name: 'Native initial', status: 'yes' })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[330] || (_cache[330] = [
(0, vue_2.createTextVNode)(" 设置原生初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[142] || (_cache[142] = ($event?: any) => (form.value?.setInitialValues({ name: '', status: 'no' })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[331] || (_cache[331] = [
(0, vue_2.createTextVNode)(" 恢复原生初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: singleNativeRule.value,
"onUpdate:modelValue": _cache[143] || (_cache[143] = ($event?: any) => ((singleNativeRule).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[332] || (_cache[332] = [
(0, vue_2.createTextVNode)("使用单条原生规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: validateOnRuleChange.value,
"onUpdate:modelValue": _cache[144] || (_cache[144] = ($event?: any) => ((validateOnRuleChange).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[333] || (_cache[333] = [
(0, vue_2.createTextVNode)("自动校验规则变更", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[145] || (_cache[145] = ($event?: any) => (labelPosition.value = 'left'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[334] || (_cache[334] = [
(0, vue_2.createTextVNode)("原生左侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[146] || (_cache[146] = ($event?: any) => (labelPosition.value = 'right'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[335] || (_cache[335] = [
(0, vue_2.createTextVNode)("原生右侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[147] || (_cache[147] = ($event?: any) => (labelPosition.value = 'top'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[336] || (_cache[336] = [
(0, vue_2.createTextVNode)("原生顶部标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[148] || (_cache[148] = ($event?: any) => (form.value?.clearValidate(['name', 'status'])))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[337] || (_cache[337] = [
(0, vue_2.createTextVNode)(" 数组清除字段校验 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("fieldset", _hoisted_68, [
_cache[345] || (_cache[345] = (0, vue_2.createElementVNode)("legend", null, "原生表单显示配置", -1 /* CACHED */)),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: labelSuffixEnabled.value,
"onUpdate:modelValue": _cache[149] || (_cache[149] = ($event?: any) => ((labelSuffixEnabled).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[338] || (_cache[338] = [
(0, vue_2.createTextVNode)("显示标签后缀", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: hideRequiredAsterisk.value,
"onUpdate:modelValue": _cache[150] || (_cache[150] = ($event?: any) => ((hideRequiredAsterisk).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[339] || (_cache[339] = [
(0, vue_2.createTextVNode)("隐藏必填星号", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: asteriskRight.value,
"onUpdate:modelValue": _cache[151] || (_cache[151] = ($event?: any) => ((asteriskRight).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[340] || (_cache[340] = [
(0, vue_2.createTextVNode)("星号放在右侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: hideMessages.value,
"onUpdate:modelValue": _cache[152] || (_cache[152] = ($event?: any) => ((hideMessages).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[341] || (_cache[341] = [
(0, vue_2.createTextVNode)("隐藏校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: inlineMessage.value,
"onUpdate:modelValue": _cache[153] || (_cache[153] = ($event?: any) => ((inlineMessage).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[342] || (_cache[342] = [
(0, vue_2.createTextVNode)("行内校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: statusIcon.value,
"onUpdate:modelValue": _cache[154] || (_cache[154] = ($event?: any) => ((statusIcon).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[343] || (_cache[343] = [
(0, vue_2.createTextVNode)("显示校验状态图标", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: disabled.value,
"onUpdate:modelValue": _cache[155] || (_cache[155] = ($event?: any) => ((disabled).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[344] || (_cache[344] = [
(0, vue_2.createTextVNode)("禁用原生表单控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"])
]),
(0, vue_2.createElementVNode)("fieldset", _hoisted_69, [
_cache[358] || (_cache[358] = (0, vue_2.createElementVNode)("legend", null, "表单顶层配置", -1 /* CACHED */)),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: builtinActions.value,
"onUpdate:modelValue": _cache[156] || (_cache[156] = ($event?: any) => ((builtinActions).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[346] || (_cache[346] = [
(0, vue_2.createTextVNode)("使用内置操作", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: showSearch.value,
"onUpdate:modelValue": _cache[157] || (_cache[157] = ($event?: any) => ((showSearch).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[347] || (_cache[347] = [
(0, vue_2.createTextVNode)("显示查询按钮", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: showReset.value,
"onUpdate:modelValue": _cache[158] || (_cache[158] = ($event?: any) => ((showReset).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[348] || (_cache[348] = [
(0, vue_2.createTextVNode)("显示重置按钮", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createCommentVNode)(" prettier-ignore "),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamCheckboxItem), {
modelValue: customActionText.value,
"onUpdate:modelValue": _cache[159] || (_cache[159] = ($event?: any) => ((customActionText).value = $event))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[349] || (_cache[349] = [
(0, vue_2.createTextVNode)("自定义操作文案", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[160] || (_cache[160] = ($event?: any) => (labelWidth.value = 'auto'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[350] || (_cache[350] = [
(0, vue_2.createTextVNode)("表单自动标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[161] || (_cache[161] = ($event?: any) => (labelWidth.value = 168))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[351] || (_cache[351] = [
(0, vue_2.createTextVNode)("数字标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[162] || (_cache[162] = ($event?: any) => (labelWidth.value = '200px'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[352] || (_cache[352] = [
(0, vue_2.createTextVNode)("文本标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[163] || (_cache[163] = ($event?: any) => (labelWidth.value = 120))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[353] || (_cache[353] = [
(0, vue_2.createTextVNode)("恢复标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[164] || (_cache[164] = ($event?: any) => (size.value = 'large'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[354] || (_cache[354] = [
(0, vue_2.createTextVNode)("表单 large 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[165] || (_cache[165] = ($event?: any) => (size.value = 'big'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[355] || (_cache[355] = [
(0, vue_2.createTextVNode)("表单 big 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[166] || (_cache[166] = ($event?: any) => (size.value = 'default'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[356] || (_cache[356] = [
(0, vue_2.createTextVNode)("表单 default 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[167] || (_cache[167] = ($event?: any) => (size.value = 'small'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[357] || (_cache[357] = [
(0, vue_2.createTextVNode)("表单 small 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[168] || (_cache[168] = ($event?: any) => (legacy.value = !legacy.value))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[359] || (_cache[359] = [
(0, vue_2.createTextVNode)("切换兼容字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[169] || (_cache[169] = ($event?: any) => (inline.value = !inline.value))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[360] || (_cache[360] = [
(0, vue_2.createTextVNode)("切换行内布局", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[170] || (_cache[170] = ($event?: any) => (labelPosition.value = labelPosition.value === 'top' ? 'right' : 'top'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[361] || (_cache[361] = [
(0, vue_2.createTextVNode)(" 切换标签位置 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[171] || (_cache[171] = ($event?: any) => (labelMode.value = labelMode.value === 'visible' ? 'sr-only' : 'visible'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[362] || (_cache[362] = [
(0, vue_2.createTextVNode)(" 切换可访问标签 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[172] || (_cache[172] = ($event?: any) => (size.value = size.value === 'default' ? 'big' : 'default'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[363] || (_cache[363] = [
(0, vue_2.createTextVNode)(" 切换表单尺寸 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validate
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[364] || (_cache[364] = [
(0, vue_2.createTextVNode)("校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateWithCallback
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[365] || (_cache[365] = [
(0, vue_2.createTextVNode)("用回调校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[173] || (_cache[173] = ($event?: any) => (form.value?.clearValidate('name')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[366] || (_cache[366] = [
(0, vue_2.createTextVNode)("清除姓名校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[174] || (_cache[174] = ($event?: any) => (form.value?.clearValidate()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[367] || (_cache[367] = [
(0, vue_2.createTextVNode)("清除全部校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[175] || (_cache[175] = ($event?: any) => (form.value?.setFieldsValue({ name: 'Patched' })))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[368] || (_cache[368] = [
(0, vue_2.createTextVNode)(" 只更新姓名模型 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[176] || (_cache[176] = ($event?: any) => (form.value?.resetFields()))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[369] || (_cache[369] = [
(0, vue_2.createTextVNode)("重置字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[177] || (_cache[177] = ($event?: any) => (form.value?.resetFields(['name'])))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[370] || (_cache[370] = [
(0, vue_2.createTextVNode)("只重置姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[178] || (_cache[178] = ($event?: any) => (form.value?.resetFields('name')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[371] || (_cache[371] = [
(0, vue_2.createTextVNode)("用字符串重置姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[179] || (_cache[179] = ($event?: any) => {
omitScrollError.value = false;
scrollToError.value = !scrollToError.value;
})
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[372] || (_cache[372] = [
(0, vue_2.createTextVNode)(" 切换校验自动滚动 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[180] || (_cache[180] = ($event?: any) => (omitScrollError.value = true))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[373] || (_cache[373] = [
(0, vue_2.createTextVNode)("省略校验自动滚动", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[181] || (_cache[181] = ($event?: any) => (scrollMode.value = 'true'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[374] || (_cache[374] = [
(0, vue_2.createTextVNode)("使用 true 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[182] || (_cache[182] = ($event?: any) => (scrollMode.value = 'false'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[375] || (_cache[375] = [
(0, vue_2.createTextVNode)("使用 false 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[183] || (_cache[183] = ($event?: any) => (scrollMode.value = 'object'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[376] || (_cache[376] = [
(0, vue_2.createTextVNode)("使用对象滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[184] || (_cache[184] = ($event?: any) => (scrollMode.value = 'omitted'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[377] || (_cache[377] = [
(0, vue_2.createTextVNode)("省略滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[185] || (_cache[185] = ($event?: any) => (scrollMode.value = 'undefined'))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[378] || (_cache[378] = [
(0, vue_2.createTextVNode)("传入 undefined 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[186] || (_cache[186] = ($event?: any) => (form.value?.scrollToField('name')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[379] || (_cache[379] = [
(0, vue_2.createTextVNode)("滚动到姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[187] || (_cache[187] = ($event?: any) => (form.value?.scrollToField('missing')))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[380] || (_cache[380] = [
(0, vue_2.createTextVNode)("滚动到不存在字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_2.createElementVNode)("div", _hoisted_70, [
_cache[386] || (_cache[386] = (0, vue_2.createElementVNode)("p", {
class: "example-paragraph",
style: { "min-height": "320px" }
}, "滚动区域从这里开始,表单字段位于下方。", -1 /* CACHED */)),
((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamForm), (0, vue_2.mergeProps)({
key: legacy.value ? 'legacy' : 'schema',
ref_key: "form",
ref: form,
modelValue: model.value,
"onUpdate:modelValue": _cache[188] || (_cache[188] = ($event?: any) => ((model).value = $event)),
inline: inline.value,
"label-position": labelPosition.value,
"label-mode": labelMode.value,
"label-width": labelWidth.value,
size: size.value,
rules: nativeRules.value,
"validate-on-rule-change": validateOnRuleChange.value,
"label-suffix": labelSuffixEnabled.value ? ':' : '',
"hide-required-asterisk": hideRequiredAsterisk.value,
"require-asterisk-position": asteriskRight.value ? 'right' : 'left',
"show-message": !hideMessages.value,
"inline-message": inlineMessage.value,
"status-icon": statusIcon.value,
disabled: disabled.value,
"show-search": showSearch.value,
"show-reset": showReset.value
}, {
...(legacy.value ? { fields: fields } : { schema: schema, registry: registry }),
...(customActionText.value
? { searchText: '筛选成员', resetText: '恢复成员' }
: {}),
...nativeScrollBinding.value
}, {
onValidate: onValidate,
"onUpdate:modelValue": _cache[189] || (_cache[189] = ($event?: any) => (recordModel('update:modelValue', $event))),
onSearch: _cache[190] || (_cache[190] = ($event?: any) => (recordModel('search', $event))),
onReset: _cache[191] || (_cache[191] = ($event?: any) => (recordModel('reset', $event)))
}), (0, vue_2.createSlots)({
default: (0, vue_2.withCtx)(() => [
_cache[382] || (_cache[382] = (0, vue_2.createElementVNode)("p", {
class: "example-paragraph",
"data-testid": "layout-form-default"
}, " 默认内容位于字段之前,不替代生成字段。 ", -1 /* CACHED */)),
(nativeItemEnabled.value)
? ((0, vue_2.openBlock)(), (0, vue_2.createBlock)((0, vue_2.unref)(ui_6.AsamFormItem), (0, vue_2.mergeProps)({
key: 0,
ref_key: "nativeItem",
ref: nativeItem,
"data-testid": "layout-native-item",
prop: itemArrayPath.value ? ['profile', 'nickname'] : 'profile.nickname',
label: itemLabelText.value,
"label-position": itemLabelPosition.value,
"label-width": itemLabelWidth.value
}, {
...itemRequiredBinding.value,
...(itemRules.value === undefined ? {} : { rules: itemRules.value })
}, {
error: itemExternalError.value ? '外部昵称错误' : '',
"show-message": !itemHideMessage.value,
"inline-message": itemInlineMessage.value,
size: itemSize.value,
for: "layout-native-item-input",
"validate-status": itemForcedSuccess.value ? 'success' : ''
}), (0, vue_2.createSlots)({
help: (0, vue_2.withCtx)(() => [
_cache[381] || (_cache[381] = (0, vue_2.createTextVNode)("嵌套字段帮助", -1 /* CACHED */))
]),
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_6.AsamInput), {
id: "layout-native-item-input",
"model-value": model.value.profile?.nickname ?? '',
"onUpdate:modelValue": updateNickname
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 2 /* DYNAMIC */
}, [
(itemLabelSlot.value)
? {
name: "label",
fn: (0, vue_2.withCtx)(({ label }: any) => [
(0, vue_2.createElementVNode)("span", _hoisted_71, (0, vue_2.toDisplayString)(label) + "插槽", 1 /* TEXT */)
]),
key: "0"
}
: undefined,
(itemErrorSlot.value)
? {
name: "error",
fn: (0, vue_2.withCtx)(({ error }: any) => [
(0, vue_2.createElementVNode)("span", _hoisted_72, (0, vue_2.toDisplayString)(error), 1 /* TEXT */)
]),
key: "1"
}
: undefined
]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["prop", "label", "label-position", "label-width", "error", "show-message", "inline-message", "size", "validate-status"]))
: (0, vue_2.createCommentVNode)("v-if", true)
]),
append: (0, vue_2.withCtx)(() => [
_cache[385] || (_cache[385] = (0, vue_2.createElementVNode)("p", {
class: "example-paragraph",
"data-testid": "layout-form-append"
}, "追加内容与字段使用同一表单实例。", -1 /* CACHED */))
]),
_: 2 /* DYNAMIC */
}, [
(!builtinActions.value)
? {
name: "actions",
fn: (0, vue_2.withCtx)(({ search, reset }: any) => [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: ($event?: any) => (search())
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[383] || (_cache[383] = [
(0, vue_2.createTextVNode)("插槽查询", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["onClick"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: ($event?: any) => (reset())
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[384] || (_cache[384] = [
(0, vue_2.createTextVNode)("插槽重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["onClick"])
]),
key: "0"
}
: undefined
]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["modelValue", "inline", "label-position", "label-mode", "label-width", "size", "rules", "validate-on-rule-change", "label-suffix", "hide-required-asterisk", "require-asterisk-position", "show-message", "inline-message", "status-icon", "disabled", "show-search", "show-reset"]))
]),
(0, vue_2.createElementVNode)("pre", _hoisted_73, (0, vue_2.toDisplayString)(JSON.stringify(nativeFieldsSnapshot.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_74, (0, vue_2.toDisplayString)(JSON.stringify(nativeSubsetSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_75, (0, vue_2.toDisplayString)(JSON.stringify(nativeSubsetCallback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_76, (0, vue_2.toDisplayString)(JSON.stringify({
...nativeItemSnapshot.value,
requiredMode: itemRequiredMode.value,
requiredOwnKey: Object.hasOwn(itemRequiredBinding.value, 'required'),
requiredValueKind: typeof itemRequiredBinding.value.required,
requiredValue: itemRequiredBinding.value.required
})), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_77, (0, vue_2.toDisplayString)(JSON.stringify(nativeItemSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_78, (0, vue_2.toDisplayString)(JSON.stringify(nativeItemCallback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("p", _hoisted_79, (0, vue_2.toDisplayString)(result.value), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_80, (0, vue_2.toDisplayString)(JSON.stringify(events.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_81, (0, vue_2.toDisplayString)(JSON.stringify(validationSettlement.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_82, (0, vue_2.toDisplayString)(JSON.stringify(callback.value)), 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_83, (0, vue_2.toDisplayString)(JSON.stringify({
model: model.value,
legacy: legacy.value,
singleNativeRule: singleNativeRule.value,
validateOnRuleChange: validateOnRuleChange.value,
labelSuffixEnabled: labelSuffixEnabled.value,
hideRequiredAsterisk: hideRequiredAsterisk.value,
asteriskRight: asteriskRight.value,
hideMessages: hideMessages.value,
inlineMessage: inlineMessage.value,
statusIcon: statusIcon.value,
disabled: disabled.value,
builtinActions: builtinActions.value,
showSearch: showSearch.value,
showReset: showReset.value,
customActionText: customActionText.value,
labelWidth: labelWidth.value,
inline: inline.value,
labelPosition: labelPosition.value,
labelMode: labelMode.value,
size: size.value,
validated: validated.value,
scrollToError: scrollToError.value,
omitScrollError: omitScrollError.value,
scrollMode: scrollMode.value,
scrollIntoViewOptions: scrollIntoViewOptions.value
})), 1 /* TEXT */)
])
]));
};
}
});
exports.default.__scopeId = "data-v-afcd5475";
},
"NarrowChoice.vue": (module: any, exports: any, require: any) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1: any = require("vue");
const vue_2: any = require("vue");
const _hoisted_1: any = { class: "demo-spacing-1" };
const ui_1: any = require("@asam-ui/ui");
exports.default = (0, vue_1.defineComponent)({
...{ name: 'AsamFormNarrowChoiceDemo' },
__name: 'NarrowChoice',
props: {
modelValue: { type: String, required: true },
caption: { type: String, required: true }
},
emits: ["update:modelValue"],
setup(__props: any, { emit: __emit }: any) {
const emit: any = __emit;
return (_ctx?: any, _cache?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("fieldset", _hoisted_1, [
(0, vue_2.createElementVNode)("legend", null, (0, vue_2.toDisplayString)(__props.caption), 1 /* TEXT */),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
name: "narrow-status",
"model-value": __props.modelValue,
value: "yes",
onChange: _cache[0] || (_cache[0] = ($event?: any) => (emit('update:modelValue', 'yes')))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
_cache[2] || (_cache[2] = (0, vue_2.createTextVNode)(" 是 ", -1 /* CACHED */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRadioItem), {
name: "narrow-status",
"model-value": __props.modelValue,
value: "no",
onChange: _cache[1] || (_cache[1] = ($event?: any) => (emit('update:modelValue', 'no')))
}, {
default: (0, vue_2.withCtx)(() => [
(0, vue_2.createCommentVNode)(" prettier-ignore "),
_cache[3] || (_cache[3] = (0, vue_2.createTextVNode)(" 否 ", -1 /* CACHED */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]));
};
}
});
exports.default.__scopeId = "data-v-c1fa034a";
},
};
const __dependencies: any = {"Demo.vue":{"./NarrowChoice.vue":"NarrowChoice.vue"},"NarrowChoice.vue":{}};
const __cache: any = Object.create(null);
function __require(id: any): any {
if (__external[id]) return __external[id];
if (__cache[id]) return __cache[id].exports;
const module: any = { exports: {} };
__cache[id] = module;
__modules[id](module, module.exports, (dependency: any) => __require(__dependencies[id][dependency] || dependency));
return module.exports;
}
const StandaloneDemo = __require('Demo.vue').default;
</script>
<style>
.form-events[data-v-afcd5475] {
max-height: 32rem;
overflow: auto;
}
.demo-layout-1[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-2[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-3[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-4[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-5[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-6[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-7[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-8[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-9[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-10[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-11[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-12[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-13[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-14[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-15[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-16[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-17[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-18[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-19[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
}
.demo-root-layout[data-v-afcd5475] {
display: flex;
gap: var(--asam-space-md);
flex-wrap: wrap;
align-items: center;
}
.demo-root-layout[data-v-afcd5475] > :is(p, pre, output) {
margin-block: 0;
}
.demo-spacing-1[data-v-afcd5475] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-spacing-2[data-v-afcd5475] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-spacing-3[data-v-afcd5475] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-slot-layout[data-v-afcd5475] {
display: grid;
gap: var(--asam-space-md);
width: 100%;
min-width: 0;
}
.demo-slot-layout > .el-button[data-v-afcd5475] {
justify-self: start;
}
.demo-slot-layout[data-v-afcd5475] > :is(p, pre, output) {
margin-block: 0;
}
.demo-slot-actions[data-v-afcd5475] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm);
}
.demo-slot-actions > .el-button + .el-button[data-v-afcd5475] {
margin-left: 0;
}
p[data-v-afcd5475]:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
.demo-spacing-1[data-v-c1fa034a] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
</style>
<template><StandaloneDemo /></template>
<script setup>
import * as __external0 from "vue";
import * as __external1 from "@asam-ui/ui";
const __external = {"vue": { ...__external0, __esModule: true },
"@asam-ui/ui": { ...__external1, __esModule: true }};
const __modules = {
"Demo.vue": (module, exports, require) => {
"use strict";
var __importDefault = function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const _hoisted_1 = { class: "demo-root-layout" };
const _hoisted_2 = {
key: 0,
class: "demo-layout-1",
"data-testid": "options-state-contract-case"
};
const _hoisted_3 = { "data-testid": "options-state-contract-result" };
const _hoisted_4 = {
key: 1,
class: "demo-layout-2",
"data-testid": "source-contract-case"
};
const _hoisted_5 = { "data-testid": "source-contract-result" };
const _hoisted_6 = {
key: 2,
class: "demo-layout-3",
"data-testid": "normalizer-contract-case"
};
const _hoisted_7 = { "data-testid": "normalizer-contract-result" };
const _hoisted_8 = {
key: 3,
class: "demo-layout-4",
"data-testid": "mock-contract-case"
};
const _hoisted_9 = { "data-testid": "mock-contract-result" };
const _hoisted_10 = {
key: 4,
class: "demo-layout-5",
"data-testid": "runtime-contract-case"
};
const _hoisted_11 = { "data-testid": "runtime-contract-result" };
const _hoisted_12 = {
key: 5,
class: "demo-layout-6",
"data-testid": "control-source-types-case"
};
const _hoisted_13 = { "data-testid": "control-source-types-registration" };
const _hoisted_14 = { "data-testid": "control-source-types-load" };
const _hoisted_15 = { "data-testid": "control-source-types-model" };
const _hoisted_16 = { "data-testid": "control-source-types-settlement" };
const _hoisted_17 = {
key: 6,
class: "demo-layout-7",
"data-testid": "reserved-props-case"
};
const _hoisted_18 = { "data-testid": "reserved-props-state" };
const _hoisted_19 = { "data-testid": "reserved-props-settlement" };
const _hoisted_20 = {
key: 7,
class: "demo-layout-8",
"data-testid": "schema-union-case"
};
const _hoisted_21 = { "data-testid": "schema-union-state" };
const _hoisted_22 = { "data-testid": "schema-union-settlement" };
const _hoisted_23 = {
key: 8,
class: "demo-layout-9",
"data-testid": "control-factory-case"
};
const _hoisted_24 = { "data-testid": "control-factory-definition" };
const _hoisted_25 = { "data-testid": "control-factory-constraints" };
const _hoisted_26 = { "data-testid": "control-factory-model" };
const _hoisted_27 = { "data-testid": "control-factory-settlement" };
const _hoisted_28 = { class: "demo-layout-10" };
const _hoisted_29 = {
key: 0,
class: "demo-layout-11",
"data-testid": "native-rule-case"
};
const _hoisted_30 = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_31 = { class: "demo-slot-layout" };
const _hoisted_32 = { class: "demo-slot-actions" };
const _hoisted_33 = { "data-testid": "native-rule-state" };
const _hoisted_34 = { "data-testid": "native-rule-settlement" };
const _hoisted_35 = { "data-testid": "native-rule-callback" };
const _hoisted_36 = { "data-testid": "native-rule-fields" };
const _hoisted_37 = {
key: 1,
class: "demo-layout-12",
"data-testid": "native-size-case"
};
const _hoisted_38 = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_39 = { class: "demo-slot-layout" };
const _hoisted_40 = { class: "demo-slot-actions" };
const _hoisted_41 = { "data-testid": "native-size-state" };
const _hoisted_42 = {
key: 2,
class: "demo-layout-13",
"data-testid": "native-basic-case"
};
const _hoisted_43 = { style: { "display": "flex", "width": "100%", "align-items": "center", "gap": "1rem" } };
const _hoisted_44 = { class: "demo-slot-layout" };
const _hoisted_45 = { class: "demo-slot-actions" };
const _hoisted_46 = { "data-testid": "native-basic-state" };
const _hoisted_47 = {
key: 3,
class: "demo-layout-14",
"data-testid": "native-inline-case"
};
const _hoisted_48 = { "data-testid": "native-inline-state" };
const _hoisted_49 = {
key: 4,
class: "demo-layout-15",
"data-testid": "dynamic-case"
};
const _hoisted_50 = { class: "demo-slot-layout" };
const _hoisted_51 = { "data-testid": "dynamic-state" };
const _hoisted_52 = { "data-testid": "dynamic-settlement" };
const _hoisted_53 = { "data-testid": "dynamic-callback" };
const _hoisted_54 = { "data-testid": "dynamic-fields" };
const _hoisted_55 = {
key: 5,
class: "demo-layout-16",
"data-testid": "alignment-case"
};
const _hoisted_56 = {
role: "radiogroup",
"aria-label": "标签位置"
};
const _hoisted_57 = {
role: "radiogroup",
"aria-label": "项目标签位置"
};
const _hoisted_58 = { "data-testid": "alignment-state" };
const _hoisted_59 = {
key: 6,
class: "demo-layout-17",
"data-testid": "accessibility-case"
};
const _hoisted_60 = { class: "demo-slot-layout" };
const _hoisted_61 = { "data-testid": "accessibility-state" };
const _hoisted_62 = {
key: 7,
class: "demo-layout-18",
"data-testid": "validation-case"
};
const _hoisted_63 = { "data-testid": "validation-case-state" };
const _hoisted_64 = { "data-testid": "validation-case-settlement" };
const _hoisted_65 = { "data-testid": "validation-case-callback" };
const _hoisted_66 = { "data-testid": "validation-case-fields" };
const _hoisted_67 = { class: "demo-spacing-1" };
const _hoisted_68 = { class: "demo-spacing-2" };
const _hoisted_69 = { class: "demo-spacing-3" };
const _hoisted_70 = {
class: "demo-layout-19",
"data-testid": "layout-scroll-host",
style: { "max-height": "280px", "overflow-y": "auto" }
};
const _hoisted_71 = { "data-testid": "layout-native-item-label" };
const _hoisted_72 = { "data-testid": "layout-native-item-error" };
const _hoisted_73 = { "data-testid": "layout-form-native-fields" };
const _hoisted_74 = { "data-testid": "layout-form-native-subset" };
const _hoisted_75 = { "data-testid": "layout-form-native-subset-callback" };
const _hoisted_76 = { "data-testid": "layout-native-item-state" };
const _hoisted_77 = { "data-testid": "layout-native-item-settlement" };
const _hoisted_78 = { "data-testid": "layout-native-item-callback" };
const _hoisted_79 = {
class: "example-paragraph",
role: "status",
"data-testid": "layout-form-status"
};
const _hoisted_80 = {
class: "form-events",
"data-testid": "layout-form-events"
};
const _hoisted_81 = { "data-testid": "layout-form-validation-settlement" };
const _hoisted_82 = { "data-testid": "layout-form-callback" };
const _hoisted_83 = { "data-testid": "layout-form-state" };
const ui_1 = require("@asam-ui/ui");
const vue_2 = require("vue");
const ui_2 = require("@asam-ui/ui");
const ui_3 = require("@asam-ui/ui");
const ui_4 = require("@asam-ui/ui");
const vue_3 = require("vue");
const vue_4 = require("vue");
const ui_5 = require("@asam-ui/ui");
const ui_6 = require("@asam-ui/ui");
const NarrowChoice_vue_1 = __importDefault(require("./NarrowChoice.vue"));
exports.default = Object.assign({ name: 'AsamFormLayoutRegistryDemo' }, {
__name: 'Demo',
setup(__props) {
const model = (0, vue_4.ref)({ name: '', status: 'no' });
const form = (0, vue_4.ref)();
const builtinActions = (0, vue_4.ref)(false);
const showSearch = (0, vue_4.ref)(false);
const showReset = (0, vue_4.ref)(false);
const customActionText = (0, vue_4.ref)(false);
const labelWidth = (0, vue_4.ref)(120);
const labelSuffixEnabled = (0, vue_4.ref)(false);
const hideRequiredAsterisk = (0, vue_4.ref)(false);
const asteriskRight = (0, vue_4.ref)(false);
const hideMessages = (0, vue_4.ref)(false);
const inlineMessage = (0, vue_4.ref)(false);
const statusIcon = (0, vue_4.ref)(false);
const disabled = (0, vue_4.ref)(false);
const singleNativeRule = (0, vue_4.ref)(false);
const validateOnRuleChange = (0, vue_4.ref)(true);
const legacy = (0, vue_4.ref)(false);
const inline = (0, vue_4.ref)(false);
const labelPosition = (0, vue_4.ref)('right');
const labelMode = (0, vue_4.ref)('visible');
const size = (0, vue_4.ref)('default');
const scrollToError = (0, vue_4.ref)(true);
const omitScrollError = (0, vue_4.ref)(false);
const scrollMode = (0, vue_4.ref)('object');
const scrollIntoViewOptions = (0, vue_4.computed)(() => {
if (scrollMode.value === 'true')
return true;
if (scrollMode.value === 'false')
return false;
if (scrollMode.value === 'object')
return { behavior: 'auto', block: 'center' };
return undefined;
});
const scrollOptionsBinding = (0, vue_4.computed)(() => scrollMode.value === 'omitted' ? {} : { scrollIntoViewOptions: scrollIntoViewOptions.value });
const nativeScrollBinding = (0, vue_4.computed)(() => ({
...scrollOptionsBinding.value,
...(omitScrollError.value ? {} : { scrollToError: scrollToError.value })
}));
const validationSettlement = (0, vue_4.ref)();
const result = (0, vue_4.ref)('');
const events = (0, vue_4.ref)([]);
function recordModel(name, value) {
events.value.push({ name, payload: { ...value } });
}
const callback = (0, vue_4.ref)();
const validated = (0, vue_4.ref)([]);
const narrow = (0, ui_6.defineAsamControl)({
component: NarrowChoice_vue_1.default,
emptyValue: () => 'no',
sourceKinds: []
});
const registry = { 'custom:status': narrow };
const builder = (0, ui_6.createAsamSchema)()({ ...ui_6.asamFormControls, ...registry });
const schema = [
builder.field({ field: 'name', component: 'Input', label: '姓名', defaultValue: () => '' }),
builder.field({
field: 'status',
component: 'custom:status',
label: '状态',
componentProps: { caption: '窄枚举状态' }
})
];
const fields = [
{ key: 'name', label: '姓名', type: 'input', defaultValue: '' },
{
key: 'status',
label: '状态',
type: 'select',
defaultValue: 'no',
options: [
{ label: '是', value: 'yes' },
{ label: '否', value: 'no' }
]
}
];
const rules = {
name: [
{ required: true, message: '请输入姓名', trigger: 'change' },
{ min: 2, message: '姓名至少两个字符', trigger: 'change' }
]
};
const nativeRules = (0, vue_4.computed)(() => singleNativeRule.value
? { name: { min: 5, message: '姓名至少五个字符', trigger: 'change' } }
: rules);
const onValidate = (...args) => {
validated.value.push({ field: String(args[0]), valid: args[1] });
events.value.push({
name: 'validate',
payload: { field: args[0], valid: args[1], message: args[2] }
});
};
const nativeSubsetSettlement = (0, vue_4.ref)();
const nativeSubsetCallback = (0, vue_4.ref)();
const nativeFieldsSnapshot = (0, vue_4.ref)();
let nativeSubsetSequence = 0;
function readNativeFields() {
const fields = form.value?.fields ?? [];
const name = form.value?.getField('name');
const status = form.value?.getField('status');
nativeFieldsSnapshot.value = {
count: fields.length,
keys: fields.map((field) => Array.isArray(field.prop) ? field.prop.join('.') : field.prop),
sameArrayAndStringLookup: name !== undefined && name === form.value?.getField(['name']),
nameInFields: name !== undefined && fields.includes(name),
statusInFields: status !== undefined && fields.includes(status),
missingIsUndefined: form.value?.getField('missing') === undefined,
nameValue: name?.fieldValue,
statusValue: status?.fieldValue
};
}
async function validateNativeSubset(selector = undefined) {
const id = ++nativeSubsetSequence;
const selectorLabel = selector === undefined
? 'all'
: typeof selector === 'string'
? selector
: JSON.stringify(selector);
try {
const fulfilledValue = await form.value?.validateField(selector);
nativeSubsetSettlement.value = {
id,
selector: selectorLabel,
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error) {
nativeSubsetSettlement.value = {
id,
selector: selectorLabel,
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
async function validateNativeSubsetCallback() {
const id = ++nativeSubsetSequence;
const fulfilledValue = await form.value?.validateField(['name'], (valid, fields) => {
nativeSubsetCallback.value = { valid, fields: Object.keys(fields ?? {}) };
});
nativeSubsetSettlement.value = {
id,
selector: 'callback-name',
settledKind: 'fulfilled',
fulfilledValue
};
}
const nativeItemEnabled = (0, vue_4.ref)(false);
const nativeItem = (0, vue_4.ref)();
const itemArrayPath = (0, vue_4.ref)(false);
const itemLabelSlot = (0, vue_4.ref)(false);
const itemErrorSlot = (0, vue_4.ref)(false);
const itemRulesEnabled = (0, vue_4.ref)(true);
const itemRequired = (0, vue_4.ref)(true);
const itemLabelText = (0, vue_4.ref)('嵌套昵称');
const itemRequiredMode = (0, vue_4.ref)('explicit');
const itemRequiredBinding = (0, vue_4.computed)(() => itemRequiredMode.value === 'omitted'
? {}
: { required: itemRequiredMode.value === 'undefined' ? undefined : itemRequired.value });
const itemArrayRules = (0, vue_4.ref)(false);
const itemHideMessage = (0, vue_4.ref)(false);
const itemInlineMessage = (0, vue_4.ref)(false);
const itemExternalError = (0, vue_4.ref)(false);
const itemForcedSuccess = (0, vue_4.ref)(false);
const itemLabelPosition = (0, vue_4.ref)('right');
const itemLabelWidth = (0, vue_4.ref)(120);
const itemSize = (0, vue_4.ref)('default');
const itemRules = (0, vue_4.computed)(() => !itemRulesEnabled.value
? undefined
: itemArrayRules.value
? [
{ required: true, message: '昵称必填', trigger: ['blur', 'change'] },
{ min: 3, message: '昵称至少三个字符', trigger: 'change' }
]
: { required: true, message: '昵称必填', trigger: 'blur' });
const nativeItemSnapshot = (0, vue_4.ref)();
const nativeItemSettlement = (0, vue_4.ref)();
const nativeItemCallback = (0, vue_4.ref)();
let nativeItemSequence = 0;
function enableNativeItem() {
model.value = { ...model.value, profile: { nickname: '' } };
nativeItemEnabled.value = true;
}
function disableNativeItem() {
nativeItemEnabled.value = false;
model.value = { name: model.value.name, status: model.value.status };
}
function updateNickname(value) {
model.value = { ...model.value, profile: { nickname: String(value) } };
}
function readNativeItem() {
const field = form.value?.getField('profile.nickname');
nativeItemSnapshot.value = {
size: nativeItem.value?.size ?? '',
message: nativeItem.value?.validateMessage ?? '',
state: nativeItem.value?.validateState ?? '',
count: form.value?.fields.length ?? 0,
sameNestedLookup: field !== undefined && field === form.value?.getField(['profile', 'nickname']),
nestedInFields: field !== undefined && (form.value?.fields.includes(field) ?? false),
nestedMissingIsUndefined: form.value?.getField('profile.missing') === undefined &&
form.value?.getField(['profile', 'missing']) === undefined,
nativeContextState: field?.validateState ?? '',
nativeContextMessage: field?.validateMessage ?? '',
nameState: form.value?.getField('name')?.validateState ?? '',
nameMessage: form.value?.getField('name')?.validateMessage ?? '',
nameInitialKind: typeof form.value?.getField('name')?.getInitialValue(),
statusInitialKind: typeof form.value?.getField('status')?.getInitialValue(),
nestedInitialKind: typeof field?.getInitialValue(),
value: field?.fieldValue,
model: {
...model.value,
...(model.value.profile ? { profile: { ...model.value.profile } } : {})
}
};
}
async function validateNativeNestedCallback() {
const id = ++nativeSubsetSequence;
const fulfilledValue = await form.value?.validateField([['profile', 'nickname']], (valid, fields) => {
nativeSubsetCallback.value = { valid, fields: Object.keys(fields ?? {}) };
});
nativeSubsetSettlement.value = {
id,
selector: 'callback-nested',
settledKind: 'fulfilled',
fulfilledValue
};
}
async function validateNativeItem(trigger, withCallback = false) {
const id = ++nativeItemSequence;
try {
const fulfilledValue = await nativeItem.value?.validate(trigger, withCallback
? (valid, fields) => {
nativeItemCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
nativeItemSettlement.value = {
id,
selector: trigger,
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error) {
nativeItemSettlement.value = {
id,
selector: trigger,
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
const validationCase = (0, vue_4.ref)();
const validationModel = (0, vue_4.ref)({ password: '', confirm: '', age: '' });
const validationForm = (0, vue_4.ref)();
const validationCaseSettlement = (0, vue_4.ref)();
const validationCaseCallback = (0, vue_4.ref)();
const validationCaseFields = (0, vue_4.ref)([]);
const validationEvents = (0, vue_4.ref)([]);
const ageValidationPending = (0, vue_4.ref)(false);
const confirmRevalidation = (0, vue_4.ref)();
let validationCaseSequence = 0;
function openValidationCase(kind) {
validationModel.value = { password: '', confirm: '', age: '' };
validationCase.value = kind;
}
const onValidationCaseEvent = (...args) => {
validationEvents.value.push({ field: String(args[0]), valid: args[1], message: args[2] });
};
function updateValidationText(field, value) {
validationModel.value = { ...validationModel.value, [field]: String(value) };
}
function updateValidationAge(value) {
const parsed = Number.parseFloat(String(value));
validationModel.value = {
...validationModel.value,
age: Number.isNaN(parsed) ? String(value) : parsed
};
}
async function revalidateConfirmation() {
try {
const fulfilledValue = await validationForm.value?.validateField('confirm');
confirmRevalidation.value = { settledKind: 'fulfilled', fulfilledValue };
}
catch (error) {
confirmRevalidation.value = {
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
const validatePassword = (_rule, value, callback) => {
if (typeof value !== 'string' || value.length < 6)
return callback(new Error('密码至少六个字符'));
callback();
if (validationModel.value.confirm !== '')
void revalidateConfirmation();
};
const validateConfirmation = (_rule, value, callback) => {
if (value === '')
callback(new Error('请输入确认密码'));
else if (value !== validationModel.value.password)
callback(new Error('两次密码不一致'));
else
callback();
};
const validateAge = (_rule, value, callback) => {
if (value === '')
return callback(new Error('请输入年龄'));
ageValidationPending.value = true;
setTimeout(() => {
ageValidationPending.value = false;
if (!Number.isInteger(value))
callback(new Error('年龄必须为整数'));
else if (Number(value) < 18)
callback(new Error('年龄必须至少十八岁'));
else
callback();
}, 500);
};
const validationRules = (0, vue_4.computed)(() => validationCase.value === 'number'
? {
age: [
{ required: true, message: '年龄必填', trigger: 'blur' },
{ type: 'number', message: '年龄必须是数字', trigger: 'blur' }
]
}
: {
password: [{ validator: validatePassword, trigger: 'blur' }],
confirm: [{ validator: validateConfirmation, trigger: 'blur' }],
age: [{ validator: validateAge, trigger: 'blur' }]
});
function readValidationCase() {
validationCaseFields.value = (validationForm.value?.fields ?? []).map((field) => ({
field: field.propString,
state: field.validateState,
message: field.validateMessage
}));
}
async function validateCase(withCallback) {
const id = ++validationCaseSequence;
try {
const fulfilledValue = await validationForm.value?.validate(withCallback
? (valid, fields) => {
validationCaseCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
validationCaseSettlement.value = {
id,
selector: withCallback ? 'callback' : 'all',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error) {
validationCaseSettlement.value = {
id,
selector: 'all',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
}
}
const compositionCase = (0, vue_4.ref)();
const alignmentModel = (0, vue_4.ref)({ name: '', region: '', type: '' });
const alignmentFormPositions = ['left', 'right', 'top'];
const alignmentItemPositions = ['', 'left', 'right', 'top'];
const alignmentFormPosition = (0, vue_4.ref)('right');
const alignmentItemPosition = (0, vue_4.ref)('');
const alignmentFields = [
{ key: 'name', label: '姓名' },
{ key: 'region', label: '活动区域' },
{ key: 'type', label: '活动表单' }
];
function updateAlignment(field, value) {
alignmentModel.value = { ...alignmentModel.value, [field]: String(value) };
}
const accessibilityModel = (0, vue_4.ref)({ fullName: '', firstName: '', lastName: '' });
function updateAccessibility(field, value) {
accessibilityModel.value = { ...accessibilityModel.value, [field]: String(value) };
}
const dynamicCase = (0, vue_4.ref)(false);
const dynamicModel = (0, vue_4.ref)({ email: '', domains: [{ key: 1, value: '' }] });
const dynamicForm = (0, vue_4.ref)();
const dynamicSettlement = (0, vue_4.ref)();
const dynamicCallback = (0, vue_4.ref)();
const dynamicEvents = (0, vue_4.ref)([]);
const dynamicFields = (0, vue_4.ref)();
let dynamicKey = 1;
let dynamicSequence = 0;
const dynamicRules = (0, vue_4.computed)(() => ({
email: [
{ required: true, message: '请输入邮箱地址', trigger: 'blur' },
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change']
}
]
}));
function updateDynamicEmail(value) {
dynamicModel.value = { ...dynamicModel.value, email: String(value) };
}
function updateDynamicDomain(key, value) {
dynamicModel.value = {
...dynamicModel.value,
domains: dynamicModel.value.domains.map((domain) => domain.key === key ? { ...domain, value: String(value) } : domain)
};
}
function addDynamicDomain() {
dynamicModel.value = {
...dynamicModel.value,
domains: [...dynamicModel.value.domains, { key: ++dynamicKey, value: '' }]
};
}
function removeDynamicDomain(key) {
dynamicModel.value = {
...dynamicModel.value,
domains: dynamicModel.value.domains.filter((domain) => domain.key !== key)
};
}
const onDynamicValidate = (...args) => {
dynamicEvents.value.push({ field: args[0], valid: args[1], message: args[2] });
};
function readDynamicFields() {
const field = dynamicForm.value?.getField('domains.0.value');
dynamicFields.value = {
fields: (dynamicForm.value?.fields ?? []).map((field) => ({
prop: field.propString,
state: field.validateState,
message: field.validateMessage,
value: field.fieldValue
})),
sameSegmentedLookup: field !== undefined && field === dynamicForm.value?.getField(['domains', '0', 'value']),
removedIndexMissing: dynamicForm.value?.getField('domains.' + dynamicModel.value.domains.length + '.value') === undefined
};
}
async function validateDynamic(withCallback) {
const id = ++dynamicSequence;
try {
const fulfilledValue = await dynamicForm.value?.validate(withCallback
? (valid, fields) => {
dynamicCallback.value = { valid, fields: Object.keys(fields ?? {}) };
}
: undefined);
dynamicSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error) {
dynamicSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
async function validate() {
try {
const fulfilledValue = await form.value?.validate();
validationSettlement.value = { settledKind: 'fulfilled', fulfilledValue };
result.value = fulfilledValue ? 'valid' : 'invalid';
}
catch (error) {
validationSettlement.value = {
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: error instanceof Error ? error.name : typeof error
};
result.value = 'invalid';
}
}
async function validateWithCallback() {
result.value = (await form.value?.validate((valid, fields) => {
callback.value = { valid, fields: Object.keys(fields ?? {}) };
}))
? 'valid'
: 'invalid';
}
const nativeComposition = (0, vue_4.ref)();
const nativeZones = [
{ value: 'shanghai', label: '区域一', raw: { city: 'shanghai' } },
{ value: 'beijing', label: '区域二', raw: { city: 'beijing' } }
];
const nativeActivityTypes = [
'Online activities',
'Promotion activities',
'Offline activities',
'Simple brand exposure'
];
const basicActivity = (0, vue_4.ref)({
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
});
const inlineActivity = (0, vue_4.ref)({ user: '', region: '', date: '' });
const basicSubmissions = (0, vue_4.ref)([]), inlineSubmissions = (0, vue_4.ref)([]);
function updateBasicActivity(patch) {
basicActivity.value = { ...basicActivity.value, ...patch };
}
function updateInlineActivity(patch) {
inlineActivity.value = { ...inlineActivity.value, ...patch };
}
function submitBasicActivity() {
basicSubmissions.value.push({ ...basicActivity.value, type: [...basicActivity.value.type] });
}
function submitInlineActivity() {
inlineSubmissions.value.push({ ...inlineActivity.value });
}
function nativeDateFacts(value) {
return value instanceof Date
? {
kind: 'Date',
year: value.getFullYear(),
month: value.getMonth() + 1,
day: value.getDate(),
hours: value.getHours(),
minutes: value.getMinutes(),
seconds: value.getSeconds()
}
: { kind: value === null ? 'null' : typeof value, value };
}
const nativeSizes = ['large', 'big', 'default', 'small'];
const nativeSizeTypes = ['Online activities', 'Promotion activities'];
const nativeSize = (0, vue_4.ref)('default');
const nativeSizePosition = (0, vue_4.ref)('right');
const sizeActivity = (0, vue_4.ref)({
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
});
const sizeSubmissions = (0, vue_4.ref)([]);
function updateNativeSize(value) {
if (value === 'large' || value === 'big' || value === 'default' || value === 'small')
nativeSize.value = value;
}
function updateNativeSizePosition(value) {
if (value === 'left' || value === 'right' || value === 'top')
nativeSizePosition.value = value;
}
function updateSizeActivity(patch) {
sizeActivity.value = { ...sizeActivity.value, ...patch };
}
function submitSizeActivity() {
sizeSubmissions.value.push({ ...sizeActivity.value, type: [...sizeActivity.value.type] });
}
const nativeRuleModel = (0, vue_4.ref)({
name: 'Hello',
region: '',
count: '',
date1: '',
date2: '',
delivery: false,
location: '',
type: [],
resource: '',
desc: ''
});
const nativeRuleForm = (0, vue_4.ref)();
const nativeCountOptions = Array.from({ length: 10000 }, (_, index) => ({
value: String(index + 1),
label: String(index + 1),
raw: { count: index + 1 }
}));
const nativeLocations = ['Home', 'Company', 'School'];
const nativeRuleRules = {
name: [
{ required: true, message: '请输入活动名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度应为 3 到 5 个字符', trigger: 'blur' }
],
region: [{ required: true, message: '请选择活动区域', trigger: 'change' }],
count: [{ required: true, message: '请选择活动人数', trigger: 'change' }],
date1: [{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }],
date2: [{ type: 'date', required: true, message: '请选择时间', trigger: 'change' }],
location: [{ required: true, message: '请选择地点', trigger: 'change' }],
type: [
{
type: 'array',
required: true,
message: '请至少选择一种活动类型',
trigger: 'change'
}
],
resource: [{ required: true, message: '请选择活动资源', trigger: 'change' }],
desc: [{ required: true, message: '请输入活动说明', trigger: 'blur' }]
};
const nativeRuleSettlement = (0, vue_4.ref)(), nativeRuleCallback = (0, vue_4.ref)();
const nativeRuleFields = (0, vue_4.ref)([]), nativeRuleEvents = (0, vue_4.ref)([]), nativeRuleSubmissions = (0, vue_4.ref)([]);
let nativeRuleSequence = 0;
function updateNativeRule(patch) {
nativeRuleModel.value = { ...nativeRuleModel.value, ...patch };
}
const onNativeRuleValidate = (...args) => {
nativeRuleEvents.value.push({ field: args[0], valid: args[1], message: args[2] });
};
function readNativeRuleFields() {
nativeRuleFields.value = (nativeRuleForm.value?.fields ?? []).map((field) => ({
prop: field.propString,
state: field.validateState,
message: field.validateMessage,
value: field.fieldValue
}));
}
async function validateNativeRule(withCallback) {
const id = ++nativeRuleSequence;
try {
const fulfilledValue = await nativeRuleForm.value?.validate(withCallback
? (valid, fields) => {
nativeRuleCallback.value = { valid, fields: Object.keys(fields ?? {}) };
if (valid)
nativeRuleSubmissions.value.push({
...nativeRuleModel.value,
type: [...nativeRuleModel.value.type]
});
}
: undefined);
nativeRuleSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'fulfilled',
fulfilledValue
};
}
catch (error) {
nativeRuleSettlement.value = {
id,
selector: withCallback ? 'callback' : 'no-callback',
settledKind: 'rejected',
rejectionFields: error !== null && typeof error === 'object' ? Object.keys(error) : [],
rejectionType: typeof error
};
}
}
const protocolSourceKinds = [], protocolRequiredProps = ['placeholder'];
const protocolControl = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: protocolSourceKinds,
requiredProps: protocolRequiredProps,
suspendable: false
});
const protocolRegistry = Object.freeze({ 'custom:code': protocolControl });
const protocolBuilder = (0, ui_6.createAsamSchema)()(protocolRegistry);
const protocolFieldConfig = {
field: 'code',
component: 'custom:code',
label: '注册编码',
componentProps: { placeholder: '输入注册编码' },
defaultValue: () => 'Default',
rules: [
{ required: true, message: '请输入注册编码', trigger: 'blur' },
{ min: 3, message: '编码至少三位', trigger: 'blur' }
]
};
const protocolField = protocolBuilder.field(protocolFieldConfig);
const protocolSchema = [protocolField], protocolModel = (0, vue_4.ref)({ code: 'Seed' }), protocolForm = (0, vue_4.ref)();
const protocolEmptyArrays = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => [],
sourceKinds: [],
suspendable: true
});
const firstProtocolEmpty = protocolEmptyArrays.emptyValue(), secondProtocolEmpty = protocolEmptyArrays.emptyValue();
firstProtocolEmpty.push('changed');
protocolRequiredProps.push('placeholder');
const protocolDefinition = {
controlFrozen: Object.isFrozen(protocolControl),
kindsFrozen: Object.isFrozen(protocolControl.sourceKinds),
requiredFrozen: Object.isFrozen(protocolControl.requiredProps),
requiredProps: [...(protocolControl.requiredProps ?? [])],
kinds: [...protocolControl.sourceKinds],
inputComponentIdentity: protocolControl.component === ui_6.AsamInput,
suspendable: protocolControl.suspendable,
emptyValue: protocolControl.emptyValue(),
schemaIdentity: protocolField === protocolFieldConfig,
schemaComponentPropsIdentity: protocolField.componentProps === protocolFieldConfig.componentProps,
originalModel: { code: 'Seed' },
firstEmpty: firstProtocolEmpty,
secondEmpty: secondProtocolEmpty,
emptyArraysIndependent: firstProtocolEmpty !== secondProtocolEmpty
};
const protocolConstraints = (0, vue_4.ref)([]);
function checkProtocolRegistration() {
const valid = { component: ui_6.AsamInput, emptyValue: () => '', sourceKinds: [] };
const invalid = [
['null', null],
['component-missing', { ...valid, component: undefined }],
['component-string', { ...valid, component: 'input' }],
['component-number', { ...valid, component: 1 }],
['emptyValue-missing', { ...valid, emptyValue: undefined }],
['emptyValue-value', { ...valid, emptyValue: '' }],
['suspendable-string', { ...valid, suspendable: 'true' }],
['sourceKinds-missing', { ...valid, sourceKinds: undefined }],
['sourceKinds-unknown', { ...valid, sourceKinds: ['other'] }],
['sourceKinds-duplicate', { ...valid, sourceKinds: ['static', 'static'] }],
['requiredProps-string', { ...valid, requiredProps: 'placeholder' }],
['requiredProps-duplicate', { ...valid, requiredProps: ['placeholder', 'placeholder'] }],
['requiredProps-empty-key', { ...valid, requiredProps: [''] }],
['requiredProps-number', { ...valid, requiredProps: [1] }]
];
protocolConstraints.value = invalid.map(([name, config]) => {
try {
Reflect.apply(ui_6.defineAsamControl, undefined, [config]);
return { name, rejected: false, kind: undefined, message: '' };
}
catch (error) {
return {
name,
rejected: true,
kind: error !== null && typeof error === 'object'
? Reflect.get(error, 'kind')
: undefined,
message: error instanceof Error ? error.message : String(error)
};
}
});
}
const protocolSettlement = (0, vue_4.ref)(), protocolValidateId = (0, vue_4.ref)(0);
async function validateProtocolControl() {
const id = ++protocolValidateId.value;
await protocolForm.value?.validate((valid, fields) => {
protocolSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...protocolModel.value }
};
});
}
const unionCommon = {
field: 'code',
label: '协议编码',
defaultValue: () => 'UnionDefault',
required: true,
rules: [{ min: 3, message: '协议编码至少三位', trigger: 'blur' }]
};
const fixedOptionalUnion = { ...unionCommon, component: 'Input' };
const derivedOptionalUnion = {
...unionCommon,
component: 'Input',
resolveDataSource: () => undefined
};
const fixedRequiredUnion = {
...unionCommon,
component: 'custom:code',
componentProps: { placeholder: '协议必填占位' }
};
const derivedRequiredUnion = {
...unionCommon,
component: 'custom:code',
componentProps: { placeholder: '协议必填占位' },
resolveDataSource: () => undefined
};
const unionSourceMode = (0, vue_4.ref)('fixed'), unionPropsMode = (0, vue_4.ref)('optional');
const unionSchema = (0, vue_4.computed)(() => [
unionPropsMode.value === 'optional'
? unionSourceMode.value === 'fixed'
? fixedOptionalUnion
: derivedOptionalUnion
: unionSourceMode.value === 'fixed'
? fixedRequiredUnion
: derivedRequiredUnion
]);
const unionModel = (0, vue_4.ref)({ code: 'Seed' }), unionForm = (0, vue_4.ref)(), unionId = (0, vue_4.ref)(0), unionSettlement = (0, vue_4.ref)();
async function validateUnionField() {
const id = ++unionId.value;
await unionForm.value?.validate((valid, fields) => {
unionSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...unionModel.value }
};
});
}
const reservedPropKeys = [
'modelValue',
'update:modelValue',
'onUpdate:modelValue',
'options',
'api',
'request',
'dictType',
'dataSource',
'transform',
'multiple',
'valueMode',
'multipleValueMode',
'separator'
];
const safeReservedProps = { placeholder: '合法控件属性', maxlength: 40, clearable: true };
const reservedControl = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: [],
requiredProps: ['placeholder']
});
const reservedRegistry = Object.freeze({ 'custom:reservedCode': reservedControl });
// Raw schema input demonstrates runtime rejection of externally supplied componentProps.
const reservedProps = (0, vue_4.ref)(safeReservedProps), reservedAttempt = (0, vue_4.ref)();
const reservedModel = (0, vue_4.ref)({ code: 'ReservedSeed' }), reservedForm = (0, vue_4.ref)();
let reservedResolverCalls = 0, reservedStateId = 0, reservedValidationId = 0;
const reservedSchema = (0, vue_4.computed)(() => [
{
field: 'code',
component: 'custom:reservedCode',
label: '属性编码',
required: true,
defaultValue: () => 'ReservedDefault',
componentProps: reservedProps.value,
resolveDataSource: () => {
reservedResolverCalls++;
return undefined;
}
}
]);
const reservedState = (0, vue_4.ref)();
const reservedSettlement = (0, vue_4.ref)();
function attemptReservedProp(key) {
reservedAttempt.value = key;
reservedProps.value = { ...safeReservedProps, [key]: 'Forbidden' };
}
function restoreReservedProps() {
reservedAttempt.value = undefined;
reservedProps.value = safeReservedProps;
}
function captureReservedState() {
reservedState.value = {
id: ++reservedStateId,
model: { ...reservedModel.value },
keys: Object.keys(reservedProps.value),
...(reservedAttempt.value === undefined ? {} : { attempt: reservedAttempt.value }),
resolverCalls: reservedResolverCalls
};
}
async function validateReservedForm() {
const id = ++reservedValidationId;
await reservedForm.value?.validate((valid, fields) => {
reservedSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...reservedModel.value }
};
});
}
const controlSourceKeys = ['static', 'api', 'request', 'dict'];
const controlSourceCalls = { api: 0, request: 0, dict: 0 };
const sourceTypeRuntime = (0, ui_4.createAsamDataRuntime)({
scope: 'complete-control-source-types',
provider: {
request: async (_config, context) => {
context.signal.throwIfAborted();
controlSourceCalls.request++;
return [{ label: 'Request option', value: 'request-value' }];
},
dict: {
get: async (_type, context) => {
context.signal.throwIfAborted();
controlSourceCalls.dict++;
return [{ label: 'Dict option', value: 'dict-value' }];
}
}
}
});
(0, vue_3.onBeforeUnmount)(() => sourceTypeRuntime.invalidate());
const controlSources = {
static: (0, ui_4.defineAsamOptions)().static({
options: [{ label: 'Static option', value: 'static-value' }]
}),
api: (0, ui_4.defineAsamOptions)().api({
api: async (_params, context) => {
context.signal.throwIfAborted();
controlSourceCalls.api++;
return [{ label: 'Api option', value: 'api-value' }];
},
params: undefined
}),
request: (0, ui_4.defineAsamOptions)().request({
request: { method: 'get', url: '/local-control-types' }
}),
dict: (0, ui_4.defineAsamDictSource)({ dictType: 'local-control-types' })
};
const sourceTypeOptions = (0, vue_4.ref)([]), sourceTypeModel = (0, vue_4.ref)({ choice: null }), sourceTypeForm = (0, vue_4.ref)();
const sourceTypeBuilder = (0, ui_6.createAsamSchema)()(ui_6.asamFormControls);
const sourceTypeSchema = (0, vue_4.computed)(() => [
sourceTypeBuilder.field({
field: 'choice',
component: 'Select',
label: '来源选项',
required: true,
defaultValue: () => null,
dataSource: (0, ui_4.defineAsamOptions)().static({
options: sourceTypeOptions.value,
fieldNames: { label: 'label', value: 'value' }
}),
componentProps: { teleported: false, placeholder: '选择解析结果' }
})
]);
let sourceTypeLoadId = 0, sourceTypeValidationId = 0;
const controlSourceLoad = (0, vue_4.ref)();
const sourceTypeSettlement = (0, vue_4.ref)();
async function loadControlSource(kind) {
const context = sourceTypeRuntime.createContext();
try {
const source = controlSources[kind], options = await (0, ui_4.resolveAsamOptions)(source, {
...(sourceTypeRuntime.provider ? { provider: sourceTypeRuntime.provider } : {}),
context
});
sourceTypeOptions.value = options;
controlSourceLoad.value = {
id: ++sourceTypeLoadId,
kind,
scope: context.scope,
sourceFrozen: Object.isFrozen(source),
optionsFrozen: Object.isFrozen(options) && options.every((item) => Object.isFrozen(item)),
options: options.map(({ label, value }) => ({ label, value })),
calls: { ...controlSourceCalls }
};
}
finally {
sourceTypeRuntime.release(context);
}
}
async function validateSourceTypeForm() {
const id = ++sourceTypeValidationId;
await sourceTypeForm.value?.validate((valid, fields) => {
sourceTypeSettlement.value = {
id,
valid,
fields: Object.keys(fields ?? {}),
model: { ...sourceTypeModel.value }
};
});
}
function makeControlSourceOrders() {
return [
['static', 'api', 'request', 'dict'],
['static', 'api', 'dict', 'request'],
['static', 'request', 'api', 'dict'],
['static', 'request', 'dict', 'api'],
['static', 'dict', 'api', 'request'],
['static', 'dict', 'request', 'api'],
['api', 'static', 'request', 'dict'],
['api', 'static', 'dict', 'request'],
['api', 'request', 'static', 'dict'],
['api', 'request', 'dict', 'static'],
['api', 'dict', 'static', 'request'],
['api', 'dict', 'request', 'static'],
['request', 'static', 'api', 'dict'],
['request', 'static', 'dict', 'api'],
['request', 'api', 'static', 'dict'],
['request', 'api', 'dict', 'static'],
['request', 'dict', 'static', 'api'],
['request', 'dict', 'api', 'static'],
['dict', 'static', 'api', 'request'],
['dict', 'static', 'request', 'api'],
['dict', 'api', 'static', 'request'],
['dict', 'api', 'request', 'static'],
['dict', 'request', 'static', 'api'],
['dict', 'request', 'api', 'static']
];
}
const controlSourceRegistration = (0, vue_4.ref)();
function registerControlSourceOrders() {
const registered = makeControlSourceOrders().map((order) => {
const expected = [...order], control = (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.Select.component,
emptyValue: () => null,
sourceKinds: order
});
Reflect.apply(Array.prototype.pop, order, []);
return {
expected,
actual: control.sourceKinds,
frozen: Object.isFrozen(control.sourceKinds),
externalAfter: [...order]
};
});
const rejected = [];
for (const sourceKinds of [['api', 'api'], ['unknown'], { api: true }]) {
try {
Reflect.apply(ui_6.defineAsamControl, undefined, [
{ component: ui_6.AsamInput, emptyValue: () => null, sourceKinds }
]);
}
catch (cause) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
rejected.push({ kind: cause.kind, message: cause.message });
}
}
const empty = (0, ui_6.defineAsamControl)({
component: ui_6.AsamInput,
emptyValue: () => '',
sourceKinds: []
});
const singleton = (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.RemoteSelect.component,
emptyValue: () => null,
sourceKinds: ['api']
});
const pairs = [
['api', 'request'],
['request', 'api']
].map((sourceKinds) => (0, ui_6.defineAsamControl)({
component: ui_6.asamFormControls.RemoteSelect.component,
emptyValue: () => null,
sourceKinds
}).sourceKinds);
controlSourceRegistration.value = {
orders: registered,
rejected,
empty: empty.sourceKinds,
singleton: singleton.sourceKinds,
pairs
};
}
const runtimeContractResult = (0, vue_4.ref)([]);
function runRuntimeContract() {
const observations = [];
const record = (phase, state) => observations.push({ phase, state });
const configFailure = (action) => {
try {
action();
throw Error('Expected configuration rejection');
}
catch (cause) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return { kind: cause.kind, message: cause.message };
}
};
const emptyRuntime = (0, ui_4.createAsamDataRuntime)();
record('runtime-default-construction', {
scope: emptyRuntime.scope,
epoch: emptyRuntime.epoch,
providerAbsent: emptyRuntime.provider === undefined,
frozen: Object.isFrozen(emptyRuntime)
});
const hostCause = {}, failureCause = {}, calls = { request: 0, hook: 0, notify: 0 };
let recursive = false;
const provider = {
request: async () => {
calls.request++;
return [];
},
isErrorNotified: (cause) => {
calls.hook++;
return cause === hostCause;
},
onError: (error) => {
calls.notify++;
recursive = runtime.reportError(error, errorContext) === error;
}
};
const runtime = (0, ui_4.createAsamDataRuntime)({ scope: 'runtime-a' });
runtime.install(provider);
runtime.install(provider);
const replacement = configFailure(() => runtime.install({}));
record('runtime-late-install-same-identity-and-replacement-guard', {
providerIdentity: runtime.provider === provider,
scope: runtime.scope,
epoch: runtime.epoch,
requestCalls: calls.request,
replacement
});
const a = runtime.createContext(), b = runtime.createContext(), foreign = { ...a };
runtime.release(foreign);
record('runtime-context-identity-readonly-and-foreign-release', {
ids: [a.requestId, b.requestId],
scopes: [a.scope, b.scope],
epochs: [a.epoch, b.epoch],
frozen: [Object.isFrozen(a), Object.isFrozen(b)],
current: [runtime.isCurrent(a), runtime.isCurrent(b), runtime.isCurrent(foreign)],
aborted: [a.signal.aborted, b.signal.aborted],
runtimeFrozen: Object.isFrozen(runtime)
});
runtime.release(a);
runtime.release(a);
record('runtime-idempotent-release', {
current: [runtime.isCurrent(a), runtime.isCurrent(b)],
aborted: [a.signal.aborted, b.signal.aborted],
epoch: runtime.epoch
});
const events = [], unsubscribeA = runtime.onInvalidate(() => events.push('A')), unsubscribeB = runtime.onInvalidate(() => events.push('B'));
runtime.setScope('runtime-a');
record('runtime-same-scope-no-invalidation', {
scope: runtime.scope,
epoch: runtime.epoch,
current: runtime.isCurrent(b),
events: [...events]
});
runtime.setScope('runtime-b');
record('runtime-scope-change-synchronous-abort-and-all-listeners', {
scope: runtime.scope,
epoch: runtime.epoch,
current: runtime.isCurrent(b),
aborted: b.signal.aborted,
events: [...events]
});
const c = runtime.createContext();
runtime.invalidate();
record('runtime-explicit-invalidation', {
context: { id: c.requestId, scope: c.scope, epoch: c.epoch },
epoch: runtime.epoch,
current: runtime.isCurrent(c),
aborted: c.signal.aborted,
events: [...events]
});
unsubscribeB();
unsubscribeB();
const d = runtime.createContext();
runtime.invalidate();
record('runtime-unsubscribe-one-idempotently', {
id: d.requestId,
contextEpoch: d.epoch,
epoch: runtime.epoch,
aborted: d.signal.aborted,
current: runtime.isCurrent(d),
events: [...events]
});
unsubscribeA();
runtime.invalidate();
record('runtime-unsubscribe-all', { epoch: runtime.epoch, events: [...events] });
const errorContext = runtime.createContext(), original = new ui_4.AsamDataFailure('request', 'owned runtime request failure', failureCause), reported = runtime.reportError(original, errorContext);
record('runtime-normal-error-notification-recursion-and-dedup', {
id: errorContext.requestId,
scope: errorContext.scope,
epoch: errorContext.epoch,
kind: reported.kind,
message: reported.message,
causePreserved: reported.cause === failureCause,
requestId: reported.requestId,
notified: reported.notified,
frozen: Object.isFrozen(reported),
sameInput: runtime.reportError(original, errorContext) === reported,
sameOutput: runtime.reportError(reported, errorContext) === reported,
recursive,
calls: { ...calls }
});
const owned = runtime.reportError(new ui_4.AsamDataFailure('response', 'host handled', hostCause), errorContext);
record('runtime-host-owned-error-skips-on-error', {
notified: owned.notified,
kind: owned.kind,
causePreserved: owned.cause === hostCause,
calls: { ...calls }
});
const marked = {
kind: 'transform',
message: 'already notified',
cause: failureCause,
notified: true,
requestId: 999
}, preNotified = runtime.reportError(marked, errorContext);
record('runtime-pre-notified-error-skips-both-hooks', {
notified: preNotified.notified,
kind: preNotified.kind,
message: preNotified.message,
requestId: preNotified.requestId,
causePreserved: preNotified.cause === failureCause,
calls: { ...calls }
});
const sameEpoch = runtime.createContext();
record('runtime-epoch-wide-error-cache', {
contextId: sameEpoch.requestId,
sameResult: runtime.reportError(original, sameEpoch) === reported,
requestId: reported.requestId,
calls: { ...calls }
});
runtime.release(sameEpoch);
runtime.release(errorContext);
const stale = new ui_4.AsamDataFailure('request', 'stale', failureCause);
record('runtime-stale-and-foreign-error-return-original', {
aborted: errorContext.signal.aborted,
current: runtime.isCurrent(errorContext),
staleIdentity: runtime.reportError(stale, errorContext) === stale,
foreignIdentity: runtime.reportError(stale, foreign) === stale,
calls: { ...calls }
});
runtime.invalidate();
const nextContext = runtime.createContext(), fresh = runtime.reportError(original, nextContext);
record('runtime-invalidation-clears-notification-cache', {
epoch: runtime.epoch,
id: nextContext.requestId,
newResult: fresh !== reported,
requestId: fresh.requestId,
notified: fresh.notified,
causePreserved: fresh.cause === failureCause,
calls: { ...calls }
});
runtime.release(nextContext);
const noHookContext = emptyRuntime.createContext(), unhandled = emptyRuntime.reportError(original, noHookContext);
record('runtime-provider-absent-error-normalization', {
kind: unhandled.kind,
causePreserved: unhandled.cause === failureCause,
notified: unhandled.notified,
requestId: unhandled.requestId,
frozen: Object.isFrozen(unhandled),
deduplicated: emptyRuntime.reportError(original, noHookContext) === unhandled
});
emptyRuntime.release(noHookContext);
const invalidScopes = ['', ' ', 0, null].map((scope) => ({
input: scope,
constructor: configFailure(() => Reflect.apply(ui_4.createAsamDataRuntime, undefined, [{ scope }])),
setter: configFailure(() => Reflect.apply(runtime.setScope, undefined, [scope]))
}));
record('runtime-invalid-scope-constructor-and-setter', {
invalidScopes,
scope: runtime.scope,
epoch: runtime.epoch,
calls: { ...calls }
});
const invalidProviders = [
['null', null],
['scalar', 'bad'],
...['request', 'upload', 'adaptOptions', 'adaptPage', 'onError', 'isErrorNotified'].map((name) => [name, { [name]: true }]),
['dict-null', { dict: null }],
['dict-get', { dict: { get: true } }],
['dict-refresh', { dict: { get: async () => [], refresh: true } }],
['pagination-null', { pagination: null }],
['pagination-empty-page', { pagination: { page: ' ', pageSize: 'size' } }],
['pagination-empty-size', { pagination: { page: 'page', pageSize: '' } }],
['pagination-scalar', { pagination: { page: 1, pageSize: 'size' } }],
['pagination-duplicate', { pagination: { page: 'same', pageSize: 'same' } }]
];
const rejectedProviders = invalidProviders.map(([name, value]) => ({
name,
constructor: configFailure(() => Reflect.apply(ui_4.createAsamDataRuntime, undefined, [{ provider: value }])),
installer: configFailure(() => Reflect.apply(runtime.install, undefined, [value]))
}));
record('runtime-invalid-providers-preserve-installed-provider', {
rejectedProviders,
providerIdentity: runtime.provider === provider,
scope: runtime.scope,
epoch: runtime.epoch,
calls: { ...calls }
});
runtime.invalidate();
emptyRuntime.invalidate();
record('runtime-final-cleanup-and-zero-transport', {
epoch: runtime.epoch,
emptyEpoch: emptyRuntime.epoch,
current: runtime.isCurrent(nextContext),
aborted: nextContext.signal.aborted,
events: [...events],
calls: { ...calls }
});
runtimeContractResult.value = observations;
}
const mockContractResult = (0, vue_4.ref)([]), mockContractRunning = (0, vue_4.ref)(false);
async function runMockContract() {
mockContractRunning.value = true;
const observations = [];
const record = (phase, state) => observations.push({ phase, state });
const rejected = async (action) => {
try {
await action();
throw Error('Expected mock rejection');
}
catch (cause) {
return cause;
}
};
const typedFailure = (cause) => {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeAbsent: cause.cause === undefined,
notified: cause.notified,
name: cause.name,
errorInstance: cause instanceof Error
};
};
const deeplyFrozen = (value) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key) => deeplyFrozen(Reflect.get(value, key))));
const gate = () => {
let release = () => { }, reject = (_cause) => {
void _cause;
};
const wait = new Promise((resolve, fail) => {
release = resolve;
reject = fail;
});
return { wait, release, reject };
};
const runtime = (0, ui_4.createAsamDataRuntime)({ scope: 'mock-contract' }), context = runtime.createContext(), defaultProvider = (0, ui_3.createAsamMockProvider)();
if (!defaultProvider.request || !defaultProvider.dict)
throw Error('Public mock methods missing');
record('mock-default-absent-refresh-and-zero-calls', {
frozen: Object.isFrozen(defaultProvider),
dictFrozen: Object.isFrozen(defaultProvider.dict),
calls: defaultProvider.calls.length,
refreshAbsent: defaultProvider.dict.refresh === undefined,
uploadAbsent: defaultProvider.upload === undefined
});
const requestCause = { code: 'request-owned' }, dictCause = { code: 'dict-owned' }, refreshCause = { code: 'refresh-owned' }, hostData = { value: 1, nested: { ids: [1] } }, requestSteps = [{ data: hostData }, { error: requestCause }], dictSteps = [
{ data: [{ label: 'One', value: 1, children: [{ label: 'Leaf', value: 2 }] }] },
{ error: dictCause }
], refreshSteps = [{ data: undefined }, { error: refreshCause }];
const options = {
requests: { 'get /items': requestSteps, 'post /items': [{ data: 'posted' }] },
dictionaries: { items: dictSteps },
refresh: refreshSteps
}, provider = (0, ui_3.createAsamMockProvider)(options);
if (!provider.request || !provider.dict?.refresh)
throw Error('Configured mock methods missing');
const request = provider.request, dict = provider.dict, refresh = provider.dict.refresh;
requestSteps.push({ data: 'external-step' });
dictSteps.push({ data: [] });
refreshSteps.push({ data: undefined });
record('mock-option-queues-copied-at-construction', {
frozen: Object.isFrozen(provider),
dictFrozen: Object.isFrozen(dict),
calls: provider.calls.length,
originalLengths: [requestSteps.length, dictSteps.length, refreshSteps.length]
});
const hostConfig = { url: '/items', params: { limit: 1, nested: { ids: [1] } } }, response = await request(hostConfig, context), firstCalls = provider.calls, firstCall = firstCalls[0];
if (!firstCall)
throw Error('Mock call missing');
hostConfig.params.limit = 2;
hostConfig.params.nested.ids.push(2);
hostData.value = 2;
hostData.nested.ids.push(2);
record('mock-default-get-request-and-deep-snapshots', {
response,
request: firstCall.request,
key: firstCall.key,
kind: firstCall.kind,
contextIdentity: firstCall.context === context,
callsFrozen: Object.isFrozen(firstCalls),
callFrozen: Object.isFrozen(firstCall),
requestFrozen: Object.isFrozen(firstCall.request),
responseFrozen: Object.isFrozen(response),
requestDeepFrozen: deeplyFrozen(firstCall.request),
responseDeepFrozen: deeplyFrozen(response),
hostConfig,
hostData
});
record('mock-error-step-preserves-original-cause', {
identity: (await rejected(() => request({ url: '/items' }, context))) === requestCause
});
record('mock-request-exhaustion-without-implicit-repeat', {
failure: typedFailure(await rejected(() => request({ url: '/items' }, context)))
});
record('mock-explicit-method-route', {
result: await request({ url: '/items', method: 'post' }, context),
key: provider.calls.at(-1)?.key
});
record('mock-unconfigured-method-and-route', {
method: typedFailure(await rejected(() => request({ url: '/items', method: 'put' }, context))),
route: typedFailure(await rejected(() => request({ url: '/missing' }, context)))
});
const dictionary = await dict.get('items', context);
record('mock-dictionary-success-and-frozen-children', {
dictionary,
frozen: Object.isFrozen(dictionary) &&
dictionary.every((item) => Object.isFrozen(item) && Object.isFrozen(item.children)),
deepFrozen: deeplyFrozen(dictionary),
call: provider.calls.at(-1)?.kind,
key: provider.calls.at(-1)?.key
});
record('mock-dictionary-error-step-preserves-original-cause', {
identity: (await rejected(() => dict.get('items', context))) === dictCause
});
record('mock-dictionary-exhaustion', {
failure: typedFailure(await rejected(() => dict.get('items', context)))
});
record('mock-refresh-success-undefined', {
undefinedResult: (await refresh(context)) === undefined,
kind: provider.calls.at(-1)?.kind,
key: provider.calls.at(-1)?.key
});
record('mock-refresh-error-step-preserves-original-cause', {
identity: (await rejected(() => refresh(context))) === refreshCause
});
record('mock-refresh-exhaustion', {
failure: typedFailure(await rejected(() => refresh(context)))
});
const emptyRefresh = (0, ui_3.createAsamMockProvider)({ refresh: [] });
if (!emptyRefresh.dict?.refresh)
throw Error('Empty configured refresh must exist');
record('mock-empty-refresh-is-configured-but-exhausted', {
exists: true,
failure: typedFailure(await rejected(() => emptyRefresh.dict.refresh(context)))
});
const combinedCause = { code: 'mixed-owned' }, precedence = (0, ui_3.createAsamMockProvider)({
requests: {
'get /mixed': [{ data: 'discarded', error: combinedCause }, { error: undefined }]
}
});
if (!precedence.request)
throw Error('Mixed request missing');
const mixedRequest = precedence.request;
record('mock-data-and-error-step-priority-and-undefined-cause', {
errorWins: (await rejected(() => mixedRequest({ url: '/mixed' }, context))) === combinedCause,
undefinedCausePreserved: (await rejected(() => mixedRequest({ url: '/mixed' }, context))) === undefined,
calls: precedence.calls.length
});
const delays = gate(), rejection = gate(), abort = gate(), waitCause = { code: 'wait-owned' }, gated = (0, ui_3.createAsamMockProvider)({
requests: {
'get /gate': [{ data: 'released', wait: delays.wait }, { data: 'next' }],
'get /reject': [{ data: 'unused', wait: rejection.wait }],
'get /abort': [
{ data: 'cancelled-data', wait: abort.wait },
{ data: 'after-abort' }
],
'get /pre': [{ data: 'not-consumed' }]
}
});
if (!gated.request)
throw Error('Gated request missing');
const gatedRequest = gated.request;
let settled = false;
const pending = gatedRequest({ url: '/gate' }, context).then((value) => {
settled = true;
return value;
});
await Promise.resolve();
record('mock-wait-gate-pending-with-recorded-call', {
settled,
calls: gated.calls.length,
key: gated.calls[0]?.key
});
delays.release();
record('mock-wait-gate-release-and-next-step', {
result: await pending,
next: await gatedRequest({ url: '/gate' }, context),
settled
});
const rejectedWait = rejected(() => gatedRequest({ url: '/reject' }, context));
rejection.reject(waitCause);
record('mock-wait-gate-rejection-preserves-original', {
identity: (await rejectedWait) === waitCause
});
const abortContext = runtime.createContext(), abortedWait = rejected(() => gatedRequest({ url: '/abort' }, abortContext));
runtime.release(abortContext);
record('mock-wait-gate-aborts-before-release', {
identity: (await abortedWait) === abortContext.signal.reason,
aborted: abortContext.signal.aborted,
current: runtime.isCurrent(abortContext)
});
abort.release();
await Promise.resolve();
record('mock-aborted-wait-consumes-exactly-one-step', {
result: await gatedRequest({ url: '/abort' }, context)
});
const preContext = runtime.createContext();
runtime.release(preContext);
const preAborted = await rejected(() => gatedRequest({ url: '/pre' }, preContext));
record('mock-pre-aborted-context-does-not-consume-step', {
identity: preAborted === preContext.signal.reason,
result: await gatedRequest({ url: '/pre' }, context)
});
const failureKinds = ['config', 'request', 'response', 'transform', 'upload'];
record('mock-public-data-failure-full-kind-contract', {
failures: failureKinds.map((kind) => {
const failure = new ui_4.AsamDataFailure(kind, 'public ' + kind, requestCause);
return {
kind: failure.kind,
message: failure.message,
name: failure.name,
causePreserved: failure.cause === requestCause,
notified: failure.notified,
errorInstance: failure instanceof Error,
stackString: typeof failure.stack === 'string',
frozen: Object.isFrozen(failure)
};
}),
optionalCauseAbsent: new ui_4.AsamDataFailure('request', 'without cause').cause === undefined
});
record('mock-call-snapshots-fresh-frozen-and-context-linked', {
calls: provider.calls.map((call) => ({
kind: call.kind,
key: call.key,
contextId: call.context.requestId,
contextScope: call.context.scope,
requestPresent: call.request !== undefined,
frozen: Object.isFrozen(call)
})),
firstSnapshotLength: firstCalls.length,
currentLength: provider.calls.length,
freshArray: provider.calls !== provider.calls,
gatedKeys: gated.calls.map((call) => call.key),
originalQueueLengths: [requestSteps.length, dictSteps.length, refreshSteps.length]
});
runtime.invalidate();
record('mock-final-cleanup-historical-context-observes-abort', {
contextAborted: provider.calls.every((call) => call.context.signal.aborted),
epoch: runtime.epoch,
current: runtime.isCurrent(context),
providerCalls: provider.calls.length,
gatedCalls: gated.calls.length
});
mockContractResult.value = observations;
mockContractRunning.value = false;
}
const normalizerContractResult = (0, vue_4.ref)([]);
function runNormalizerContract() {
const observations = [];
const record = (phase, state) => observations.push({ phase, state });
const frozen = (value) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key) => frozen(Reflect.get(value, key))));
const failure = (action) => {
try {
action();
throw Error('Expected normalization rejection');
}
catch (cause) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeKind: cause.cause instanceof ui_4.AsamDataFailure ? cause.cause.kind : null,
causeName: cause.cause instanceof Error ? cause.cause.name : null
};
}
};
const values = [1, '1', true, false, 0, '', -2.5], input = values.map((value, i) => ({ label: 'Value-' + i, value })), options = (0, ui_2.normalizeAsamOptions)(input);
record('normalizer-default-seven-typed-identities', {
values: options.map((o) => o.value),
types: options.map((o) => typeof o.value),
frozen: frozen(options),
rawIndependent: options.every((o, i) => o.raw !== input[i]),
empty: (0, ui_2.normalizeAsamOptions)([])
});
const host = [
{ label: '', value: '', disabled: undefined, children: undefined },
{ label: 'Host', value: 2, meta: { count: 1 } }
], snapshot = (0, ui_2.normalizeAsamOptions)(host);
host[1].meta.count = 2;
record('normalizer-empty-label-undefined-optionals-and-host-snapshot', {
options: snapshot,
hostCount: host[1].meta.count,
frozen: frozen(snapshot)
});
const fields = { label: 'name.label', value: 'id', disabled: 'locked', children: 'nodes' }, treeRules = { tree: true }, tree = (0, ui_2.normalizeAsamOptions)([
{
'name.label': 'Parent',
id: 0,
locked: false,
nodes: [{ 'name.label': 'Leaf', id: false }]
}
], fields, treeRules);
record('normalizer-own-dotted-field-mapping-and-tree', {
tree,
frozen: frozen(tree),
flatEmptyChildren: (0, ui_2.normalizeAsamOptions)([{ label: 'Leaf', value: 'leaf', children: [] }]),
sameKeyMapping: (0, ui_2.normalizeAsamOptions)([{ same: 'same' }], { label: 'same', value: 'same' })
});
const policies = [
{ valuePolicy: { multiple: false, valueMode: 'value' } },
{ valuePolicy: { multiple: false, valueMode: 'object' } },
{ valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'array' } },
{ valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' } },
{ valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'array' } }
];
record('normalizer-five-legal-selection-policies', {
values: policies.map((rule) => (0, ui_2.normalizeAsamOptions)([{ label: 'One', value: 1 }], undefined, rule)[0]?.value),
separatorWhole: (0, ui_2.normalizeAsamOptions)([{ label: 'Colon', value: 'a:b' }], undefined, {
valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' },
separator: '::'
})[0]?.value
});
const dictCases = [
['string', [1, false, 'x'], 'string'],
['number', ['+1.5e2', '-.5', '2.', '1E-2'], 'number'],
['boolean', [true, 1, 'true', '1', false, 0, 'false', '0'], 'boolean']
];
record('normalizer-dictionary-value-conversion-and-original-raw', {
cases: dictCases.map(([kind, values, type]) => {
const result = values.flatMap((value, i) => (0, ui_2.normalizeAsamOptions)([{ label: 'Dict-' + i, value }], undefined, {}, type));
return {
kind,
values: result.map((o) => o.value),
raw: result.map((o) => o.raw.value),
frozen: result.every((o) => frozen(o))
};
})
});
const row = (value) => ({ label: 'Option', value }), cycle = { label: 'Cycle', value: 1 };
cycle.children = [cycle];
const responseCases = [
['null', null],
['undefined', undefined],
['object', {}],
['wrapper', { data: [] }],
['null-item', [null]],
['scalar-item', [1]],
['sparse', new Array(2)],
['inherited', [Object.create({ label: 'Inherited', value: 1 })]],
['numeric-label', [{ label: 1, value: 1 }]],
['missing-value', [{ label: 'Missing' }]],
['nan', [row(NaN)]],
['infinity', [row(Infinity)]],
['null-value', [row(null)]],
['object-value', [row({})]],
['disabled-string', [{ ...row(1), disabled: 'false' }]],
['children-object', [{ ...row(1), children: {} }]],
['flat-tree', [{ ...row(1), children: [row(2)] }]],
['zero-collision', [row(0), row(-0)]],
['boolean-duplicate', [row(false), row(false)]],
['cycle', [cycle], undefined, { tree: true }],
[
'tree-global-duplicate',
[{ ...row(1), children: [row(2)] }, row(2)],
undefined,
{ tree: true }
],
['dict-number-boolean', [row(true)], undefined, {}, 'number'],
['dict-number-text', [row('bad')], undefined, {}, 'number'],
['dict-boolean-case', [row('True')], undefined, {}, 'boolean'],
['dict-invalid-input', [row(Infinity)], undefined, {}, 'string'],
['dict-number-alias-collision', [row(1), row('1')], undefined, {}, 'number'],
['dict-boolean-alias-collision', [row(true), row(1)], undefined, {}, 'boolean']
];
record('normalizer-twenty-seven-response-rejections', {
cases: responseCases.map(([name, ...args]) => ({
name,
failure: failure(() => Reflect.apply(ui_2.normalizeAsamOptions, undefined, args))
}))
});
const stringRules = {
valuePolicy: { multiple: true, valueMode: 'value', multipleValueMode: 'string' },
separator: '::'
}, stringCases = [
['identity-collision', [1, '1']],
['empty-token', ['']],
['whole-separator', ['a::b']]
];
record('normalizer-string-token-ambiguity', {
cases: stringCases.map(([name, values]) => ({
name,
failure: failure(() => Reflect.apply(ui_2.normalizeAsamOptions, undefined, [
values.map(row),
undefined,
stringRules
]))
}))
});
const configCases = [
['fields-null', null, {}],
['fields-array', [], {}],
['label-missing', { value: 'value' }, {}],
['value-missing', { label: 'label' }, {}],
['label-number', { label: 1, value: 'value' }, {}],
['value-null', { label: 'label', value: null }, {}],
['disabled-empty', { label: 'label', value: 'value', disabled: '' }, {}],
['children-empty', { label: 'label', value: 'value', children: '' }, {}],
['tree-string', undefined, { tree: 'true' }],
['policy-scalar', undefined, { valuePolicy: 'bad' }],
['multiple-missing', undefined, { valuePolicy: { valueMode: 'value' } }],
['multiple-number', undefined, { valuePolicy: { multiple: 1, valueMode: 'value' } }],
['mode-invalid', undefined, { valuePolicy: { multiple: false, valueMode: 'wrong' } }],
['multi-mode-missing', undefined, { valuePolicy: { multiple: true, valueMode: 'value' } }],
[
'single-extra-mode',
undefined,
{ valuePolicy: { multiple: false, valueMode: 'value', multipleValueMode: 'array' } }
],
[
'object-string',
undefined,
{ valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'string' } }
],
['separator-empty', undefined, { separator: '' }],
['separator-number', undefined, { separator: 1 }]
];
record('normalizer-eighteen-configuration-rejections', {
cases: configCases.map(([name, fields, rules]) => ({
name,
failure: failure(() => Reflect.apply(ui_2.normalizeAsamOptions, undefined, [[], fields, rules]))
}))
});
const hostPage = { list: [{ id: 1, meta: { count: 1 } }], total: 4 }, page = (0, ui_2.normalizeAsamPage)(hostPage);
hostPage.list[0].meta.count = 2;
hostPage.total = 5;
record('normalizer-page-shape-copy-freeze-and-empty-pages', {
page,
host: hostPage,
frozen: frozen(page),
zero: (0, ui_2.normalizeAsamPage)({ list: [], total: 0 }),
laterEmpty: (0, ui_2.normalizeAsamPage)({ list: [], total: 4 }),
maxSafe: (0, ui_2.normalizeAsamPage)({ list: [], total: Number.MAX_SAFE_INTEGER }).total
});
const pageCases = [
['null', null],
['array', []],
['wrapper', { data: { list: [], total: 0 } }],
['inherited-list', Object.create({ list: [], total: 0 })],
['list-null', { list: null, total: 0 }],
['list-scalar', { list: ['row'], total: 1 }],
['list-array-row', { list: [[]], total: 1 }],
['list-hole', { list: new Array(2), total: 2 }],
['total-missing', { list: [] }],
['total-inherited', Object.assign(Object.create({ total: 0 }), { list: [] })],
['total-string', { list: [], total: '0' }],
['total-negative', { list: [], total: -1 }],
['total-fraction', { list: [], total: 1.5 }],
['total-nan', { list: [], total: NaN }],
['total-infinite', { list: [], total: Infinity }],
['total-unsafe', { list: [], total: Number.MAX_SAFE_INTEGER + 1 }],
['zero-with-rows', { list: [{ id: 1 }], total: 0 }]
];
record('normalizer-seventeen-page-rejections', {
cases: pageCases.map(([name, value]) => ({
name,
failure: failure(() => (0, ui_2.normalizeAsamPage)(value))
}))
});
const calls = { transform: 0, adapter: 0 }, envelope = { rows: [{ id: 1 }], count: 2 }, transformed = (0, ui_2.resolveAsamPage)(envelope, (value) => {
calls.transform++;
return { list: value.rows, total: value.count };
}), adapted = (0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
calls.adapter++;
return { list: envelope.rows, total: envelope.count };
}
}), direct = (0, ui_2.resolveAsamPage)({ list: [{ id: 3 }], total: 1 });
envelope.rows[0].id = 2;
record('normalizer-page-two-public-overloads-and-default', {
transformed,
adapted,
direct,
calls: { ...calls },
host: envelope,
frozen: frozen(transformed) && frozen(adapted) && frozen(direct)
});
const explicit = Reflect.apply(ui_2.resolveAsamPage, undefined, [
{ rows: [{ id: 4 }], count: 1 },
(value) => {
calls.transform++;
return { list: value.rows, total: value.count };
},
{
adaptPage: () => {
calls.adapter++;
throw Error('Unexpected adapter');
}
}
]);
record('normalizer-dynamic-transform-precedence-over-adapter', {
page: explicit,
calls: { ...calls },
frozen: frozen(explicit)
});
const transformCause = Error('owned page transform'), adapterCause = Error('owned page adapter');
const transformFailure = failure(() => (0, ui_2.resolveAsamPage)(envelope, () => {
throw transformCause;
})), adapterFailure = failure(() => (0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
throw adapterCause;
}
}));
record('normalizer-page-error-stage-and-original-cause', {
transform: transformFailure,
adapter: adapterFailure,
transformCausePreserved: (() => {
try {
(0, ui_2.resolveAsamPage)(envelope, () => {
throw transformCause;
});
return false;
}
catch (cause) {
return cause instanceof ui_4.AsamDataFailure && cause.cause === transformCause;
}
})(),
adapterCausePreserved: (() => {
try {
(0, ui_2.resolveAsamPage)(envelope, undefined, {
adaptPage: () => {
throw adapterCause;
}
});
return false;
}
catch (cause) {
return cause instanceof ui_4.AsamDataFailure && cause.cause === adapterCause;
}
})(),
malformedDefault: failure(() => (0, ui_2.resolveAsamPage)({ data: [] })),
malformedTransform: failure(() => Reflect.apply(ui_2.resolveAsamPage, undefined, [envelope, () => ({ list: null, total: 0 })]))
});
normalizerContractResult.value = observations;
}
const sourceContractResult = (0, vue_4.ref)([]);
const sourceContractBusy = (0, vue_4.ref)(false);
async function runSourceContract() {
sourceContractBusy.value = true;
sourceContractResult.value = [];
const observations = [];
const record = (phase, state) => observations.push({ phase, state });
const context = (signal = new AbortController().signal) => ({
signal,
requestId: 7,
scope: 'source-example',
epoch: 2
});
const frozen = (value) => value === null ||
typeof value !== 'object' ||
(Object.isFrozen(value) &&
Reflect.ownKeys(value).every((key) => frozen(Reflect.get(value, key))));
const failure = (cause, original) => {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
return {
kind: cause.kind,
message: cause.message,
causeKind: cause.cause instanceof ui_4.AsamDataFailure ? cause.cause.kind : null,
originalCause: original === undefined ? null : cause.cause === original,
notified: cause.notified
};
};
const rejectSync = (action) => {
try {
action();
}
catch (cause) {
return failure(cause);
}
throw Error('Expected source construction rejection');
};
const rejectAsync = async (action, original) => {
try {
await action();
}
catch (cause) {
return failure(cause, original);
}
throw Error('Expected source resolution rejection');
};
try {
const factory = (0, ui_4.defineAsamOptions)();
const typed = (0, ui_4.defineAsamOptions)();
const host = [{ title: 'Initial', id: 1, meta: { count: 1 } }], fields = { label: 'title', value: 'id' }, source = factory.static({ options: host, fieldNames: fields });
const cache = { ttlMs: 1000, key: () => 'owned-key' };
const apiSource = factory.api({ api: async () => [], params: undefined, cache });
const requestSource = factory.request({ request: { url: '/source-example' } }), dictSource = (0, ui_4.defineAsamDictSource)({ dictType: 'source-example' });
const kinds = [source.kind, apiSource.kind, requestSource.kind, dictSource.kind];
record('source-factory-four-kinds-and-opaque-frozen-identity', {
kinds,
sourcesFrozen: [source, apiSource, requestSource, dictSource].every(Object.isFrozen),
keys: [source, apiSource, requestSource, dictSource].map(Object.keys),
symbols: Object.getOwnPropertySymbols(source).length,
factoryKeys: Object.keys(factory),
distinct: source !==
typed.static({ options: host, fieldNames: { label: 'title', value: 'id' } }),
cacheHostFrozen: Object.isFrozen(cache)
});
fields.label = 'wrong';
const first = await (0, ui_4.resolveAsamOptions)(source, { context: context() });
host[0].title = 'Changed';
host[0].meta.count = 2;
const second = await (0, ui_4.resolveAsamOptions)(source, { context: context() });
record('source-static-fields-copy-host-live-read-and-frozen-result', {
first,
second,
firstFrozen: frozen(first),
secondFrozen: frozen(second),
hostFrozen: Object.isFrozen(host) || Object.isFrozen(host[0]),
rawIndependent: first[0].raw !== host[0],
changedFieldIgnored: fields.label
});
const params = { query: 'before' }, apiContext = context(), call = { sameParams: false, sameContext: false, transform: 0, adapter: 0 };
const typedApi = (0, ui_4.defineAsamOptions)().api({
api: async (input, current) => {
call.sameParams = input === params;
call.sameContext = current === apiContext;
return { rows: [{ title: input.query, id: 2 }] };
},
params,
transform: (response) => {
call.transform++;
return response.rows;
},
fieldNames: { label: 'title', value: 'id' }
});
params.query = 'after';
const apiResult = await (0, ui_4.resolveAsamOptions)(typedApi, {
context: apiContext,
provider: {
adaptOptions: () => {
call.adapter++;
return [];
}
}
});
record('source-typed-api-param-context-and-transform-precedence', {
options: apiResult,
calls: call,
frozen: frozen(apiResult),
paramsFrozen: Object.isFrozen(params)
});
let apiCalls = 0, adapterCalls = 0, cacheKeyCalls = 0;
const defaultApi = factory.api({
api: async () => {
apiCalls++;
return { rows: [{ label: 'Adapted', value: true }] };
},
params: undefined,
cache: {
ttlMs: 1000,
key: () => {
cacheKeyCalls++;
return 'same';
}
}
});
const beforeCalls = apiCalls;
const adapted1 = await (0, ui_4.resolveAsamOptions)(defaultApi, {
context: context(),
provider: {
adaptOptions: () => {
adapterCalls++;
return [{ label: 'Adapted', value: true }];
}
}
});
const adapted2 = await (0, ui_4.resolveAsamOptions)(defaultApi, {
context: context(),
provider: {
adaptOptions: () => {
adapterCalls++;
return [{ label: 'Adapted', value: true }];
}
}
});
const direct = await (0, ui_4.resolveAsamOptions)(factory.api({
api: async () => [{ label: 'Direct', value: false }],
params: undefined
}), { context: context() });
record('source-default-api-adapter-raw-and-no-one-shot-cache', {
beforeCalls,
apiCalls,
adapterCalls,
cacheKeyCalls,
adapted1,
adapted2,
direct,
distinctSnapshots: adapted1 !== adapted2
});
const requests = [], requestParams = { q: 1 }, requestData = { body: 2 };
for (const method of [undefined, 'get', 'post', 'put', 'delete']) {
const request = {
url: '/source-method',
...(method === undefined ? {} : { method }),
params: requestParams,
...(method === undefined || method === 'get' ? {} : { data: requestData })
};
const current = context(), result = await (0, ui_4.resolveAsamOptions)(factory.request({ request }), {
context: current,
provider: {
request: async (input, received) => {
requests.push({
method: input.method,
url: input.url,
copiedConfig: input !== request,
sameParams: input.params === requestParams,
sameData: input.data === request.data,
sameContext: received === current
});
return [{ label: 'URL', value: 'url' }];
}
}
});
if (!frozen(result))
throw Error('Request result must be frozen');
}
record('source-url-default-get-and-four-method-context-identity', {
requests,
paramsFrozen: Object.isFrozen(requestParams),
dataFrozen: Object.isFrozen(requestData)
});
record('source-provider-requirements-before-transport', {
request: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(requestSource, { context: context() })),
dict: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(dictSource, { context: context() }))
});
let mutableCalls = 0;
const mutableRequest = { url: '/valid' }, mutableSource = factory.request({ request: mutableRequest });
mutableRequest.url = ' ';
record('source-url-revalidation-guards-mutated-host-before-transport', {
failure: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(mutableSource, {
context: context(),
provider: {
request: async () => {
mutableCalls++;
return [];
}
}
})),
calls: mutableCalls
});
const dictionaries = [];
for (const kind of [undefined, 'string', 'number', 'boolean']) {
const current = context(), value = kind === 'boolean' ? '1' : 3, dict = (0, ui_4.defineAsamDictSource)({
dictType: ' spaced ',
...(kind === undefined ? {} : { dictValueType: kind })
});
let sameContext = false, receivedType = '';
const options = await (0, ui_4.resolveAsamOptions)(dict, {
context: current,
provider: {
dict: {
get: async (type, received) => {
sameContext = current === received;
receivedType = type;
return [{ label: 'Dict', value }];
}
}
}
});
dictionaries.push({
kind: kind ?? 'default',
value: options[0]?.value,
raw: options[0]?.raw.value,
sameContext,
receivedType,
frozen: frozen(options)
});
}
record('source-dictionary-default-and-three-conversions', { dictionaries });
const forged = [{ kind: 'static' }, { ...source }, new Proxy(source, {})];
record('source-opaque-forged-copy-proxy-rejections', {
failures: await Promise.all(forged.map((value) => rejectAsync(() => Reflect.apply(ui_4.resolveAsamOptions, undefined, [
value,
{ context: context() }
]))))
});
const constructors = [];
for (const [name, method, valid] of [
['static', factory.static, { options: [] }],
['api', factory.api, { api: async () => [], params: undefined }],
['request', factory.request, { request: { url: '/valid' } }],
['dict', ui_4.defineAsamDictSource, { dictType: 'valid' }]
]) {
for (const [suffix, input] of [
['null', null],
['array', []],
['missing', {}],
['wrong', { data: [] }],
['multiple', { ...valid, data: [] }],
[
'null-source',
{
...valid,
[name === 'static' ? 'options' : name === 'dict' ? 'dictType' : name]: null
}
],
['extra', { ...valid, foreign: 1 }]
])
constructors.push([
name + '-' + suffix,
() => Reflect.apply(method, undefined, [input])
]);
}
for (const kind of ['api', 'request']) {
const method = factory[kind], valid = kind === 'api'
? { api: async () => [], params: undefined }
: { request: { url: '/valid' } };
for (const [suffix, extra] of [
['cache-null', { cache: null }],
['cache-zero', { cache: { ttlMs: 0 } }],
['cache-negative', { cache: { ttlMs: -1 } }],
['cache-fraction', { cache: { ttlMs: 1.5 } }],
['cache-infinite', { cache: { ttlMs: Infinity } }],
['cache-unsafe', { cache: { ttlMs: Number.MAX_SAFE_INTEGER + 1 } }],
['cache-key', { cache: { ttlMs: 1, key: 1 } }],
['transform', { transform: 1 }],
['fields-without-transform', { fieldNames: { label: 'label', value: 'value' } }],
['fields-null', { fieldNames: null }]
])
constructors.push([
kind + '-' + suffix,
() => Reflect.apply(method, undefined, [{ ...valid, ...extra }])
]);
}
for (const [suffix, input] of [
['api-nonfunction', { api: 1 }],
['static-bad-fields', { options: [], fieldNames: { label: '', value: 'value' } }]
])
constructors.push([
suffix,
() => Reflect.apply(suffix.startsWith('api') ? factory.api : factory.static, undefined, [input])
]);
for (const [suffix, request] of [
['url-empty', { url: '' }],
['url-numeric', { url: 1 }],
['method-upper', { url: '/x', method: 'GET' }],
['get-data', { url: '/x', data: {} }],
['params-array', { url: '/x', params: [] }]
])
constructors.push([
'request-' + suffix,
() => Reflect.apply(factory.request, undefined, [{ request }])
]);
for (const [suffix, input] of [
['empty', { dictType: '' }],
['whitespace', { dictType: ' ' }],
['numeric', { dictType: 1 }],
['null-value-type', { dictType: 'x', dictValueType: null }],
['unknown-value-type', { dictType: 'x', dictValueType: 'other' }],
['cache', { dictType: 'x', cache: { ttlMs: 1 } }]
])
constructors.push([
'dict-' + suffix,
() => Reflect.apply(ui_4.defineAsamDictSource, undefined, [input])
]);
record('source-complete-constructor-config-rejections', {
cases: constructors.map(([name, action]) => ({ name, failure: rejectSync(action) })),
allowedUndefinedExtra: factory.static({ options: [], ...{ foreign: undefined } }).kind,
allowedInheritedSource: Reflect.apply(factory.static, undefined, [
Object.create({ options: [] })
]).kind
});
let guardedCalls = 0;
const guardedProvider = {
request: async () => {
guardedCalls++;
return [];
},
dict: {
get: async () => {
guardedCalls++;
return [];
}
}
};
const guardedApi = factory.api({
api: async () => {
guardedCalls++;
return [];
},
params: undefined
});
record('source-rules-validation-before-all-remote-io', {
failures: await Promise.all([guardedApi, requestSource, dictSource].map((current) => rejectAsync(() => Reflect.apply(ui_4.resolveAsamOptions, undefined, [
current,
{ context: context(), provider: guardedProvider, separator: '' }
])))),
calls: guardedCalls
});
const transportCases = [];
for (const kind of ['api', 'request', 'dict'])
for (const mode of ['throw', 'reject', 'non-promise']) {
const original = Error(kind + '-' + mode), run = () => {
if (mode === 'throw')
throw original;
return mode === 'reject' ? Promise.reject(original) : [];
};
const selected = kind === 'api'
? Reflect.apply(factory.api, undefined, [{ api: run, params: undefined }])
: kind === 'request'
? requestSource
: dictSource;
transportCases.push({
kind,
mode,
failure: await rejectAsync(() => Reflect.apply(ui_4.resolveAsamOptions, undefined, [
selected,
{
context: context(),
provider: { request: run, dict: { get: run } }
}
]), mode === 'non-promise' ? undefined : original)
});
}
record('source-nine-transport-failures-and-original-causes', { cases: transportCases });
const stages = [];
for (const stage of ['transform', 'adapter'])
for (const mode of ['throw', 'async-resolve', 'async-reject', 'malformed']) {
const original = Error(stage + '-' + mode), parse = () => {
if (mode === 'throw')
throw original;
if (mode === 'async-reject')
return Promise.reject(original);
if (mode === 'async-resolve')
return Promise.resolve([]);
return {};
};
const selected = Reflect.apply(factory.api, undefined, [
{
api: async () => [],
params: undefined,
...(stage === 'transform' ? { transform: parse } : {})
}
]);
stages.push({
stage,
mode,
failure: await rejectAsync(() => Reflect.apply(ui_4.resolveAsamOptions, undefined, [
selected,
{
context: context(),
provider: stage === 'adapter' ? { adaptOptions: parse } : undefined
}
]), mode === 'throw' ? original : undefined)
});
}
record('source-eight-transform-adapter-sync-guards-and-error-stages', { cases: stages });
record('source-static-config-versus-remote-response-failures', {
static: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(factory.static({ options: [{ label: 'Bad', value: {} }] }), {
context: context()
})),
api: await rejectAsync(() => (0, ui_4.resolveAsamOptions)(factory.api({ api: async () => ({}), params: undefined }), {
context: context()
})),
dictionary: await rejectAsync(() => (0, ui_4.resolveAsamOptions)((0, ui_4.defineAsamDictSource)({ dictType: 'invalid', dictValueType: 'number' }), {
context: context(),
provider: {
dict: { get: async () => [{ label: 'Bad', value: 'not-number' }] }
}
})),
staticConstructionRemainsLazy: factory.static({
options: [{ label: 'Bad', value: {} }]
}).kind
});
const aborted = new AbortController(), reason = { owned: 'pre-abort' };
aborted.abort(reason);
let abortedCalls = 0;
const abortApi = factory.api({
api: async () => {
abortedCalls++;
return [];
},
params: undefined
});
const preAborts = [];
for (const current of [source, abortApi, requestSource, dictSource]) {
try {
await (0, ui_4.resolveAsamOptions)(current, {
context: context(aborted.signal),
provider: {
request: async () => {
abortedCalls++;
return [];
},
dict: {
get: async () => {
abortedCalls++;
return [];
}
}
}
});
}
catch (cause) {
preAborts.push(cause === reason);
}
}
record('source-pre-abort-exact-reason-four-kinds-zero-io', {
preAborts,
calls: abortedCalls
});
const lateResults = [];
for (const mode of ['resolve', 'reject']) {
const controller = new AbortController(), abortReason = { mode }, lateCause = Error('late-' + mode);
let release = () => {
throw Error('Missing release');
}, reject = () => {
throw Error('Missing rejection');
}, transforms = 0, calls = 0;
const gated = factory.api({
api: () => {
calls++;
return new Promise((done, fail) => {
release = done;
reject = fail;
});
},
params: undefined,
transform: () => {
transforms++;
return [];
}
});
const pending = (0, ui_4.resolveAsamOptions)(gated, { context: context(controller.signal) }).then(() => false, (cause) => cause === abortReason);
controller.abort(abortReason);
const promptExactReason = await pending;
if (mode === 'resolve')
release([]);
else
reject(lateCause);
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
lateResults.push({ mode, promptExactReason, calls, transforms });
}
record('source-prompt-abort-ignored-transport-and-late-settlement', { cases: lateResults });
sourceContractResult.value = observations;
}
catch (cause) {
sourceContractResult.value = [
...observations,
{
phase: 'source-contract-unexpected-failure',
state: { message: cause instanceof Error ? cause.message : String(cause) }
}
];
}
finally {
sourceContractBusy.value = false;
}
}
const optionsStateInjectionTarget = (0, vue_4.ref)();
const optionsStateContractResult = (0, vue_4.ref)([]);
const optionsStateContractBusy = (0, vue_4.ref)(false);
async function runOptionsStateContract() {
optionsStateContractBusy.value = true;
optionsStateContractResult.value = [];
const observations = [], scopes = [];
const record = (phase, state) => observations.push({ phase, state });
const attach = (config, kind = 'remote') => {
const scope = (0, vue_2.effectScope)();
scopes.push(scope);
const state = scope.run(() => kind === 'remote' ? (0, ui_1.useAsamRemoteOptions)(config) : (0, ui_1.useAsamDictOptions)(config));
if (!state)
throw Error('Missing scoped options state');
return { state, scope };
};
const snapshot = (state) => ({
values: state.data.value.map((o) => o.value),
loading: state.loading.value,
error: state.error.value?.kind ?? null,
errorMessage: state.error.value?.message ?? null,
stale: state.stale.value,
hasSucceeded: state.hasSucceeded.value,
empty: state.empty.value,
dataKeySet: state.dataKey.value !== null,
requestKeySet: state.requestKey.value !== null,
keysMatch: state.dataKey.value !== null && state.dataKey.value === state.requestKey.value
});
const settle = async (check) => {
for (let i = 0; i < 100 && !check(); i++)
await Promise.resolve();
if (!check())
throw Error('Options state did not settle within microtasks');
};
const gate = () => {
let release = () => {
throw Error('Missing gate');
}, reject = () => {
throw Error('Missing gate');
};
const promise = new Promise((done, fail) => {
release = done;
reject = fail;
});
return { promise, release, reject };
};
try {
const factory = (0, ui_4.defineAsamOptions)(), firstGate = gate(), failedGate = gate(), emptyGate = gate(), jobs = [firstGate, failedGate, emptyGate];
let calls = 0, success = 0, localErrors = 0, notifications = 0, successSame = false, errorSame = false;
const runtime = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
notifications++;
}
}
}), source = factory.api({ api: () => jobs[calls++].promise, params: undefined });
const attached = attach({
source,
runtime,
immediate: false,
onSuccess: (data) => {
success++;
successSame = data === current?.data.value;
},
onError: (error) => {
localErrors++;
errorSame = error === current?.error.value;
}
});
const current = attached.state;
record('options-state-all-public-members-and-manual-initial-state', {
members: Object.keys(current),
snapshot: snapshot(current),
calls
});
const first = current.reload();
record('options-state-held-loading-before-first-success', {
snapshot: snapshot(current),
calls
});
firstGate.release([{ label: 'One', value: 1 }]);
const firstResult = await first;
record('options-state-success-frozen-data-keys-and-callbacks', {
snapshot: snapshot(current),
status: firstResult.status,
fromCache: firstResult.status === 'success' ? firstResult.fromCache : null,
success,
localErrors,
notifications,
successSame,
frozen: Object.isFrozen(current.data.value) &&
Object.isFrozen(current.data.value[0]) &&
Object.isFrozen(current.data.value[0]?.raw)
});
const original = Error('owned hook request failure'), failed = current.reload();
failedGate.reject(original);
const failedResult = await failed;
record('options-state-request-failure-retains-stale-success-and-error-hooks', {
snapshot: snapshot(current),
status: failedResult.status,
originalCause: current.error.value?.cause === original,
notified: current.error.value?.notified,
success,
localErrors,
notifications,
errorSame
});
const empty = current.reload();
emptyGate.release([]);
const emptyResult = await empty;
record('options-state-empty-success-clears-error-stale-and-restores-callback', {
snapshot: snapshot(current),
status: emptyResult.status,
success,
localErrors,
notifications
});
attached.scope.stop();
record('options-state-disposal-removes-consumer-and-cancels-reload', {
status: (await current.reload()).status,
calls,
snapshot: snapshot(current)
});
const active = (0, vue_4.ref)(false);
let activeCalls = 0;
const activeSource = factory.api({
api: async () => {
activeCalls++;
return [{ label: 'Active', value: 2 }];
},
params: undefined
}), activeState = attach({
source: activeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
active,
immediate: false
}).state;
const inactiveInitial = snapshot(activeState), inactiveReload = (await activeState.reload()).status;
active.value = true;
const enabledBeforeReload = snapshot(activeState);
await activeState.reload();
active.value = false;
const disabledAfterSuccess = snapshot(activeState), inactiveAfterSuccess = (await activeState.reload()).status;
active.value = true;
const restored = snapshot(activeState);
record('options-state-reactive-active-retention-and-immediate-false', {
inactiveInitial,
inactiveReload,
enabledBeforeReload,
disabledAfterSuccess,
inactiveAfterSuccess,
restored,
calls: activeCalls
});
const obsolete = gate(), latest = gate();
let raceCalls = 0, lateCallbacks = 0;
const raceRuntime = (0, ui_4.createAsamDataRuntime)(), query = (0, vue_4.ref)('old'), raceApi = (input) => {
raceCalls++;
return input.query === 'old' ? obsolete.promise : latest.promise;
}, raceSource = (0, vue_4.computed)(() => factory.api({ api: raceApi, params: { query: query.value } })), raceState = attach({
source: raceSource,
runtime: raceRuntime,
immediate: false,
onSuccess: () => {
lateCallbacks++;
}
}).state;
const oldJob = raceState.reload(), oldKey = raceState.requestKey.value;
query.value = 'new';
const cancelledOld = await oldJob, newJob = raceState.reload(), changedKey = raceState.requestKey.value !== oldKey;
latest.release([{ label: 'New', value: 'new' }]);
await newJob;
obsolete.release([{ label: 'Obsolete', value: 'old' }]);
await settle(() => !raceState.loading.value);
record('options-state-source-replacement-cancels-old-and-blocks-late-write', {
cancelledOld: cancelledOld.status,
changedKey,
snapshot: snapshot(raceState),
calls: raceCalls,
successCallbacks: lateCallbacks
});
const cancelGate = gate();
let cancelCalls = 0, cancelCallbacks = 0;
const cancelOwner = attach({
source: factory.api({
api: () => {
cancelCalls++;
return cancelGate.promise;
},
params: undefined
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
onSuccess: () => {
cancelCallbacks++;
}
}), cancelState = cancelOwner.state, cancelJob = cancelState.reload();
cancelState.cancel();
const cancelled = await cancelJob;
cancelGate.release([{ label: 'Late', value: 9 }]);
await settle(() => !cancelState.loading.value);
record('options-state-explicit-cancel-settles-pending-without-success', {
status: cancelled.status,
snapshot: snapshot(cancelState),
calls: cancelCalls,
successCallbacks: cancelCallbacks
});
const sharedGate = gate();
let sharedCalls = 0;
const sharedApi = () => {
sharedCalls++;
return sharedGate.promise;
}, sharedSource = factory.api({
api: sharedApi,
params: { q: 1 },
cache: { ttlMs: 10000 }
}), sharedRuntime = (0, ui_4.createAsamDataRuntime)(), sharedA = attach({
source: sharedSource,
runtime: sharedRuntime,
immediate: false
}).state, sharedB = attach({
source: sharedSource,
runtime: sharedRuntime,
immediate: false
}).state;
const sharedJobA = sharedA.reload(), sharedJobB = sharedB.reload();
const joined = {
calls: sharedCalls,
sameRequestKey: sharedA.requestKey.value === sharedB.requestKey.value,
bothLoading: sharedA.loading.value && sharedB.loading.value
};
sharedA.cancel();
const detached = await sharedJobA;
sharedGate.release([{ label: 'Shared', value: 3 }]);
await sharedJobB;
const cached = await sharedA.reload();
record('options-state-cache-shared-flight-independent-cancel-and-rejoin', {
joined,
detached: detached.status,
fromCache: cached.status === 'success' ? cached.fromCache : null,
calls: sharedCalls,
sameSnapshot: sharedA.data.value === sharedB.data.value,
a: snapshot(sharedA),
b: snapshot(sharedB)
});
let isolatedCalls = 0;
const isolatedApi = async () => {
isolatedCalls++;
return [];
}, isolatedSource = factory.api({ api: isolatedApi, params: { q: 1 } }), isolatedRuntime = (0, ui_4.createAsamDataRuntime)(), isolatedA = attach({
source: isolatedSource,
runtime: isolatedRuntime,
immediate: false
}).state, isolatedB = attach({
source: isolatedSource,
runtime: isolatedRuntime,
immediate: false
}).state;
await Promise.all([isolatedA.reload(), isolatedB.reload()]);
record('options-state-uncached-remote-consumers-have-isolated-jobs', {
calls: isolatedCalls,
differentRequestKey: isolatedA.requestKey.value !== isolatedB.requestKey.value,
a: snapshot(isolatedA),
b: snapshot(isolatedB)
});
const ordinaryGate = gate(), forceGate = gate();
let forceCalls = 0;
const forceSource = factory.api({
api: () => [ordinaryGate, forceGate][forceCalls++].promise,
params: undefined,
cache: { ttlMs: 10000 }
}), forceRuntime = (0, ui_4.createAsamDataRuntime)(), forceA = attach({ source: forceSource, runtime: forceRuntime, immediate: false }).state, forceB = attach({ source: forceSource, runtime: forceRuntime, immediate: false }).state;
const ordinary = forceA.reload(), forcedA = forceA.reload({ force: true }), forcedB = forceB.reload({ force: true }), ordinaryCancelled = await ordinary;
forceGate.release([{ label: 'Forced', value: 4 }]);
const forceResults = await Promise.all([forcedA, forcedB]);
ordinaryGate.release([{ label: 'Obsolete', value: 0 }]);
await settle(() => !forceA.loading.value);
record('options-state-force-replaces-normal-flight-and-shares-forced-generation', {
ordinary: ordinaryCancelled.status,
forced: forceResults.map((r) => r.status),
fromCache: forceResults.map((r) => (r.status === 'success' ? r.fromCache : null)),
calls: forceCalls,
sameSnapshot: forceA.data.value === forceB.data.value,
a: snapshot(forceA),
b: snapshot(forceB)
});
let scopedCalls = 0;
const scopedRuntime = (0, ui_4.createAsamDataRuntime)({ scope: 'first' }), scopedApi = async () => {
scopedCalls++;
return [{ label: 'Scope', value: scopedCalls }];
}, scopedState = attach({
source: factory.api({ api: scopedApi, params: undefined, cache: { ttlMs: 10000 } }),
runtime: scopedRuntime,
immediate: false
}).state;
await scopedState.reload();
const scopeKey = scopedState.requestKey.value;
scopedRuntime.setScope('second');
const clearedOnScope = snapshot(scopedState), scopeKeyChanged = scopedState.requestKey.value !== scopeKey;
await scopedState.reload();
scopedRuntime.invalidate();
const clearedOnInvalidate = snapshot(scopedState);
await scopedState.reload();
record('options-state-scope-epoch-invalidation-clears-data-and-cache', {
clearedOnScope,
clearedOnInvalidate,
scopeKeyChanged,
calls: scopedCalls,
snapshot: snapshot(scopedState),
scope: scopedRuntime.scope,
epoch: scopedRuntime.epoch
});
const badSource = (0, vue_2.shallowRef)(undefined);
let configErrors = 0, configNotifications = 0;
const badRuntime = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
configNotifications++;
}
}
}), badState = attach({
source: badSource,
runtime: badRuntime,
immediate: false,
onError: () => {
configErrors++;
}
}).state;
Reflect.set(badSource, 'value', Object.freeze({ kind: 'api' }));
const dedup = {
errors: configErrors,
notifications: configNotifications,
snapshot: snapshot(badState)
};
badSource.value = factory.api({ api: async () => [], params: undefined });
await badState.reload();
record('options-state-config-error-dedup-and-valid-source-recovery', {
dedup,
recovered: snapshot(badState),
errors: configErrors,
notifications: configNotifications
});
const wrongKinds = [];
for (const [name, kind, input] of [
['remote-static', 'remote', factory.static({ options: [] })],
['remote-dict', 'remote', (0, ui_4.defineAsamDictSource)({ dictType: 'x' })],
['dict-api', 'dict', factory.api({ api: async () => [], params: undefined })],
['dict-url', 'dict', factory.request({ request: { url: '/x' } })]
]) {
const state = attach({ source: input, runtime: (0, ui_4.createAsamDataRuntime)(), immediate: false }, kind).state;
wrongKinds.push({
name,
snapshot: snapshot(state),
reload: (await state.reload()).status
});
}
record('options-state-remote-dict-source-kind-restrictions', { cases: wrongKinds });
const invalidConfig = [];
for (const [name, extra] of [
['negative-debounce', { debounceMs: -1 }],
['fraction-debounce', { debounceMs: 0.5 }],
['unsafe-debounce', { debounceMs: Number.MAX_SAFE_INTEGER + 1 }],
[
'bad-cache-key',
{
source: factory.api({
api: async () => [],
params: undefined,
cache: { ttlMs: 1, key: () => '' }
})
}
],
[
'throw-cache-key',
{
source: factory.api({
api: async () => [],
params: undefined,
cache: {
ttlMs: 1,
key: () => {
throw Error('owned cache key');
}
}
})
}
]
]) {
const owner = Reflect.apply(attach, undefined, [
{
source: factory.api({ api: async () => [], params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
...extra
}
]);
invalidConfig.push({
name,
snapshot: snapshot(owner.state),
reload: (await owner.state.reload()).status
});
}
record('options-state-debounce-and-cache-key-config-guards', { cases: invalidConfig });
const treeSource = factory.api({
api: async () => [
{ label: 'Parent', value: 1, children: [{ label: 'Leaf', value: 2 }] }
],
params: undefined
}), treeState = attach({
source: treeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
tree: true,
immediate: false,
valuePolicy: { multiple: true, valueMode: 'object', multipleValueMode: 'array' },
separator: '::'
}).state;
await treeState.reload();
const flatState = attach({
source: treeSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await flatState.reload();
record('options-state-tree-policy-separator-normalization-versus-flat-error', {
tree: snapshot(treeState),
children: treeState.data.value[0]?.children?.map((o) => o.value),
flat: snapshot(flatState)
});
let dictCalls = 0, refreshCalls = 0;
const dictRuntime = (0, ui_4.createAsamDataRuntime)({
provider: {
dict: {
get: async () => {
dictCalls++;
return [{ label: 'Dict', value: dictCalls }];
},
refresh: async () => {
refreshCalls++;
}
}
}
}), dictInput = (0, ui_4.defineAsamDictSource)({ dictType: 'hook-dict', dictValueType: 'number' }), dictA = attach({ source: dictInput, runtime: dictRuntime, immediate: false }, 'dict').state, dictB = attach({ source: dictInput, runtime: dictRuntime, immediate: false }, 'dict').state;
await Promise.all([dictA.reload(), dictB.reload()]);
const beforeForce = {
calls: dictCalls,
refreshCalls,
sameSnapshot: dictA.data.value === dictB.data.value
};
const dictForced = await Promise.all([
dictA.reload({ force: true }),
dictB.reload({ force: true })
]);
record('options-state-dictionary-sharing-and-deduplicated-force-refresh', {
beforeForce,
calls: dictCalls,
refreshCalls,
statuses: dictForced.map((r) => r.status),
a: snapshot(dictA),
b: snapshot(dictB),
sameSnapshot: dictA.data.value === dictB.data.value
});
const unavailable = attach({
source: dictInput,
runtime: (0, ui_4.createAsamDataRuntime)({ provider: { dict: { get: async () => [] } } }),
immediate: false
}, 'dict').state;
const noRefresh = await unavailable.reload({ force: true });
record('options-state-dictionary-force-without-refresh-config-error', {
status: noRefresh.status,
snapshot: snapshot(unavailable)
});
const disposedGate = gate();
let disposedCallbacks = 0;
const disposedOwner = attach({
source: factory.api({ api: () => disposedGate.promise, params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
onSuccess: () => {
disposedCallbacks++;
}
}), disposedJob = disposedOwner.state.reload();
disposedOwner.scope.stop();
const disposedResult = await disposedJob;
disposedGate.release([{ label: 'Disposed', value: 9 }]);
await settle(() => !disposedOwner.state.loading.value);
record('options-state-disposal-cancels-held-job-and-blocks-late-callback', {
status: disposedResult.status,
callbacks: disposedCallbacks,
reloadAfterDispose: (await disposedOwner.state.reload()).status,
snapshot: snapshot(disposedOwner.state)
});
const searchText = (0, vue_4.ref)('first'), debounceMs = (0, vue_4.ref)(25), searchCalls = [];
let searchDone = () => { };
const searchApi = async (params) => {
searchCalls.push(params.q);
return [{ label: params.q, value: params.q }];
}, searchInput = (0, vue_4.computed)(() => factory.api({ api: searchApi, params: { q: searchText.value } })), searchOwner = attach({
source: searchInput,
runtime: (0, ui_4.createAsamDataRuntime)(),
searchText,
debounceMs,
onSuccess: () => searchDone()
}), searchState = searchOwner.state;
await settle(() => searchState.hasSucceeded.value);
const firstSearch = snapshot(searchState), searchReady = new Promise((done) => {
searchDone = done;
});
searchText.value = 'second';
searchText.value = 'third';
const debouncing = snapshot(searchState), callsBeforeDebounce = [...searchCalls];
await searchReady;
const debounced = snapshot(searchState);
debounceMs.value = 0;
searchText.value = 'fourth';
await settle(() => searchState.data.value[0]?.value === 'fourth');
record('options-state-immediate-search-reactivity-default-debounce-and-zero', {
firstSearch,
debouncing,
callsBeforeDebounce,
debounced,
final: snapshot(searchState),
calls: searchCalls
});
let deadlineCalls = 0;
const deadlineSource = factory.api({
api: async () => {
deadlineCalls++;
return [{ label: 'TTL', value: deadlineCalls }];
},
params: undefined,
cache: { ttlMs: 200 }
}), deadlineState = attach({
source: deadlineSource,
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await deadlineState.reload();
const withinDeadline = await deadlineState.reload();
await new Promise((done) => setTimeout(done, 250));
const afterDeadline = await deadlineState.reload();
record('options-state-real-cache-ttl-hit-and-expiry', {
calls: deadlineCalls,
withinDeadline: withinDeadline.status === 'success' ? withinDeadline.fromCache : null,
afterDeadline: afterDeadline.status === 'success' ? afterDeadline.fromCache : null,
snapshot: snapshot(deadlineState),
expiryObservation: 'real timer after documented 200ms TTL; no clock replacement'
});
let serialCalls = 0;
const serialApi = async (_params) => {
void _params;
serialCalls++;
return [];
}, serialInput = new Date('2030-01-01T00:00:00Z'), fallbackState = attach({
source: factory.api({ api: serialApi, params: serialInput }),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await fallbackState.reload();
const strictState = attach({
source: factory.api({
api: serialApi,
params: serialInput,
cache: { ttlMs: 1000 }
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state, customKeyState = attach({
source: factory.api({
api: serialApi,
params: serialInput,
cache: { ttlMs: 1000, key: (input) => String(input) }
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false
}).state;
await customKeyState.reload();
record('options-state-uncached-identity-fallback-versus-cache-key-serialization', {
calls: serialCalls,
fallback: snapshot(fallbackState),
strict: snapshot(strictState),
custom: snapshot(customKeyState)
});
const policy = (0, vue_4.ref)({ multiple: false, valueMode: 'value' }), separator = (0, vue_4.ref)('::');
let policyCalls = 0;
const policyState = attach({
source: factory.api({
api: async () => {
policyCalls++;
return [
{ label: 'Numeric', value: 1 },
{ label: 'String', value: '1' }
];
},
params: undefined
}),
runtime: (0, ui_4.createAsamDataRuntime)(),
immediate: false,
valuePolicy: policy,
separator
}).state;
await policyState.reload();
const policyBefore = snapshot(policyState);
policy.value = { multiple: true, valueMode: 'value', multipleValueMode: 'string' };
await policyState.reload();
const policyRejected = snapshot(policyState);
policy.value = { multiple: true, valueMode: 'object', multipleValueMode: 'array' };
separator.value = '|';
await policyState.reload();
record('options-state-reactive-policy-separator-and-token-error-recovery', {
before: policyBefore,
rejected: policyRejected,
recovered: snapshot(policyState),
calls: policyCalls
});
const defaultSearch = (0, vue_4.ref)('initial'), defaultCalls = [];
let defaultDone = () => { };
const defaultApi = async (input) => {
defaultCalls.push(input.q);
return [{ label: input.q, value: input.q }];
}, defaultState = attach({
source: (0, vue_4.computed)(() => factory.api({ api: defaultApi, params: { q: defaultSearch.value } })),
runtime: (0, ui_4.createAsamDataRuntime)(),
searchText: defaultSearch,
onSuccess: () => defaultDone()
}).state;
await settle(() => defaultState.hasSucceeded.value);
const defaultReady = new Promise((done) => {
defaultDone = done;
});
defaultSearch.value = 'discard';
defaultSearch.value = 'default-latest';
const defaultBefore = [...defaultCalls];
await defaultReady;
record('options-state-default-search-debounce-retains-only-latest-input', {
before: defaultBefore,
calls: defaultCalls,
snapshot: snapshot(defaultState)
});
const suspendedActive = (0, vue_4.ref)(true), suspendedGate = gate();
let suspendedCallbacks = 0;
const suspendedState = attach({
source: factory.api({ api: () => suspendedGate.promise, params: undefined }),
runtime: (0, ui_4.createAsamDataRuntime)(),
active: () => suspendedActive.value,
immediate: false,
onSuccess: () => {
suspendedCallbacks++;
}
}).state, suspendedJob = suspendedState.reload();
suspendedActive.value = false;
const suspendedResult = await suspendedJob;
suspendedGate.release([{ label: 'Suspended', value: 9 }]);
await settle(() => !suspendedState.loading.value);
record('options-state-active-getter-suspends-held-request-without-late-success', {
status: suspendedResult.status,
snapshot: snapshot(suspendedState),
callbacks: suspendedCallbacks
});
let refreshFailureCalls = 0, refreshAttempts = 0, refreshNotifications = 0;
const refreshOriginal = Error('owned dict refresh failure'), refreshRuntime = (0, ui_4.createAsamDataRuntime)({
provider: {
onError: () => {
refreshNotifications++;
},
dict: {
get: async () => {
refreshFailureCalls++;
return [{ label: 'Refresh', value: refreshFailureCalls }];
},
refresh: async () => {
refreshAttempts++;
if (refreshAttempts === 1)
throw refreshOriginal;
}
}
}
}), refreshSource = (0, ui_4.defineAsamDictSource)({
dictType: 'refresh-failure',
dictValueType: 'number'
}), refreshA = attach({ source: refreshSource, runtime: refreshRuntime, immediate: false }, 'dict').state, refreshB = attach({ source: refreshSource, runtime: refreshRuntime, immediate: false }, 'dict').state;
await Promise.all([refreshA.reload(), refreshB.reload()]);
const refreshRejected = await Promise.all([
refreshA.reload({ force: true }),
refreshB.reload({ force: true })
]), rejectedA = snapshot(refreshA), rejectedB = snapshot(refreshB), sameError = refreshA.error.value === refreshB.error.value, originalRefreshCause = refreshA.error.value?.cause === refreshOriginal;
await Promise.all([refreshA.reload({ force: true }), refreshB.reload({ force: true })]);
record('options-state-dictionary-refresh-failure-shares-notification-and-recovers', {
rejected: refreshRejected.map((r) => r.status),
rejectedA,
rejectedB,
sameError,
originalRefreshCause,
refreshNotifications,
calls: refreshFailureCalls,
refreshAttempts,
recoveredA: snapshot(refreshA),
recoveredB: snapshot(refreshB)
});
const missingRuntime = [];
for (const kind of ['remote', 'dict']) {
try {
attach({
source: factory.api({ api: async () => [], params: undefined }),
immediate: false
}, kind);
throw Error('Expected missing runtime');
}
catch (cause) {
if (!(cause instanceof ui_4.AsamDataFailure))
throw cause;
missingRuntime.push({ kind, errorKind: cause.kind, message: cause.message });
}
}
record('options-state-both-hooks-require-runtime-outside-a-component', {
cases: missingRuntime
});
if (typeof document !== 'undefined' && optionsStateInjectionTarget.value) {
let injected, injectedCalls = 0;
let mounted = false;
const host = document.createElement('div'), app = (0, vue_2.createApp)((0, vue_2.defineComponent)({
setup() {
injected = (0, ui_1.useAsamRemoteOptions)({
source: factory.api({
api: async () => {
injectedCalls++;
return [{ label: 'Injected', value: 8 }];
},
params: undefined
}),
immediate: false
});
const state = injected;
return () => (0, vue_2.h)('output', { 'data-testid': 'options-state-injected-output' }, JSON.stringify(snapshot(state)));
}
}));
optionsStateInjectionTarget.value.append(host);
(0, ui_1.provideAsamData)(app, {});
try {
app.mount(host);
mounted = true;
if (!injected)
throw Error('Missing injected state');
const noInitialRequest = injectedCalls === 0, before = snapshot(injected);
await injected.reload();
await (0, vue_2.nextTick)();
const after = snapshot(injected), rendered = host.querySelector('output') !== null, renderedSnapshot = JSON.parse(host.querySelector('output')?.textContent ?? '{}');
app.unmount();
mounted = false;
const cancelledReload = (await injected.reload()).status;
record('options-state-mounted-app-injection-and-unmount-cleanup', {
noInitialRequest,
before,
after,
rendered,
renderedSnapshot,
calls: injectedCalls,
cancelledReload
});
}
finally {
if (mounted)
app.unmount();
host.remove();
}
}
optionsStateContractResult.value = observations;
}
catch (cause) {
optionsStateContractResult.value = [
...observations,
{
phase: 'options-state-contract-unexpected-failure',
state: { message: cause instanceof Error ? cause.message : String(cause) }
}
];
}
finally {
for (const scope of scopes)
scope.stop();
optionsStateContractBusy.value = false;
}
}
return (_ctx, _cache) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", _hoisted_1, [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[0] || (_cache[0] = $event => (nativeComposition.value = 'options-state-contract'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[192] || (_cache[192] = [
(0, vue_1.createTextVNode)("打开完整选项状态示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[1] || (_cache[1] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[193] || (_cache[193] = [
(0, vue_1.createTextVNode)("关闭完整选项状态示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'options-state-contract')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_2, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: optionsStateContractBusy.value,
onClick: runOptionsStateContract
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[194] || (_cache[194] = [
(0, vue_1.createTextVNode)("验证远程字典状态与生命周期", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_1.createElementVNode)("div", {
ref_key: "optionsStateInjectionTarget",
ref: optionsStateInjectionTarget
}, null, 512 /* NEED_PATCH */),
(0, vue_1.createElementVNode)("pre", _hoisted_3, (0, vue_1.toDisplayString)(JSON.stringify(optionsStateContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[2] || (_cache[2] = $event => (nativeComposition.value = 'source-contract'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[195] || (_cache[195] = [
(0, vue_1.createTextVNode)("打开完整来源工厂示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[3] || (_cache[3] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[196] || (_cache[196] = [
(0, vue_1.createTextVNode)("关闭完整来源工厂示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'source-contract')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_4, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: sourceContractBusy.value,
onClick: runSourceContract
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[197] || (_cache[197] = [
(0, vue_1.createTextVNode)("验证四类来源与单次解析", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_1.createElementVNode)("pre", _hoisted_5, (0, vue_1.toDisplayString)(JSON.stringify(sourceContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[4] || (_cache[4] = $event => (nativeComposition.value = 'normalizer-contract'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[198] || (_cache[198] = [
(0, vue_1.createTextVNode)("打开选项分页规范化示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[5] || (_cache[5] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[199] || (_cache[199] = [
(0, vue_1.createTextVNode)("关闭选项分页规范化示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'normalizer-contract')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_6, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: runNormalizerContract
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[200] || (_cache[200] = [
(0, vue_1.createTextVNode)("验证映射树与分页边界", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_7, (0, vue_1.toDisplayString)(JSON.stringify(normalizerContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[6] || (_cache[6] = $event => (nativeComposition.value = 'mock-contract'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[201] || (_cache[201] = [
(0, vue_1.createTextVNode)("打开确定性数据模拟示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[7] || (_cache[7] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[202] || (_cache[202] = [
(0, vue_1.createTextVNode)("关闭确定性数据模拟示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'mock-contract')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_8, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: mockContractRunning.value,
onClick: runMockContract
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[203] || (_cache[203] = [
(0, vue_1.createTextVNode)("验证模拟队列与等待门", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_1.createElementVNode)("pre", _hoisted_9, (0, vue_1.toDisplayString)(JSON.stringify(mockContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[8] || (_cache[8] = $event => (nativeComposition.value = 'runtime-contract'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[204] || (_cache[204] = [
(0, vue_1.createTextVNode)("打开数据运行时示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[9] || (_cache[9] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[205] || (_cache[205] = [
(0, vue_1.createTextVNode)("关闭数据运行时示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'runtime-contract')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_10, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: runRuntimeContract
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[206] || (_cache[206] = [
(0, vue_1.createTextVNode)("验证运行时完整契约", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_11, (0, vue_1.toDisplayString)(JSON.stringify(runtimeContractResult.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[10] || (_cache[10] = $event => (nativeComposition.value = 'control-source-types'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[207] || (_cache[207] = [
(0, vue_1.createTextVNode)("打开控件来源类型示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[11] || (_cache[11] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[208] || (_cache[208] = [
(0, vue_1.createTextVNode)("关闭控件来源类型示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'control-source-types')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_12, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: registerControlSourceOrders
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[209] || (_cache[209] = [
(0, vue_1.createTextVNode)("验证来源种类元组", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(controlSourceKeys, (kind) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
key: kind,
"native-type": "button",
onClick: $event => (loadControlSource(kind))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)(" 解析控件来源 " + (0, vue_1.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]);
}), 64 /* STABLE_FRAGMENT */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "sourceTypeForm",
ref: sourceTypeForm,
modelValue: sourceTypeModel.value,
"onUpdate:modelValue": _cache[13] || (_cache[13] = $event => ((sourceTypeModel).value = $event)),
schema: sourceTypeSchema.value,
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateSourceTypeForm
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[210] || (_cache[210] = [
(0, vue_1.createTextVNode)("校验来源模型", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[12] || (_cache[12] = $event => (sourceTypeForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[211] || (_cache[211] = [
(0, vue_1.createTextVNode)("重置来源模型", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema"]),
(0, vue_1.createElementVNode)("pre", _hoisted_13, (0, vue_1.toDisplayString)(JSON.stringify(controlSourceRegistration.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_14, (0, vue_1.toDisplayString)(JSON.stringify(controlSourceLoad.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_15, (0, vue_1.toDisplayString)(JSON.stringify(sourceTypeModel.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_16, (0, vue_1.toDisplayString)(JSON.stringify(sourceTypeSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[14] || (_cache[14] = $event => (nativeComposition.value = 'reserved-props'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[212] || (_cache[212] = [
(0, vue_1.createTextVNode)("打开控件属性边界示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[15] || (_cache[15] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[213] || (_cache[213] = [
(0, vue_1.createTextVNode)("关闭控件属性边界示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'reserved-props')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_17, [
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(reservedPropKeys, (key) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
key: key,
"native-type": "button",
onClick: $event => (attemptReservedProp(key))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)(" 拒绝控件属性 " + (0, vue_1.toDisplayString)(key), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]);
}), 64 /* STABLE_FRAGMENT */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: restoreReservedProps
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[214] || (_cache[214] = [
(0, vue_1.createTextVNode)("恢复合法控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: captureReservedState
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[215] || (_cache[215] = [
(0, vue_1.createTextVNode)("读取属性观察", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "reservedForm",
ref: reservedForm,
modelValue: reservedModel.value,
"onUpdate:modelValue": _cache[17] || (_cache[17] = $event => ((reservedModel).value = $event)),
schema: reservedSchema.value,
registry: (0, vue_1.unref)(reservedRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateReservedForm
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[216] || (_cache[216] = [
(0, vue_1.createTextVNode)("校验合法属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[16] || (_cache[16] = $event => (reservedForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[217] || (_cache[217] = [
(0, vue_1.createTextVNode)("重置合法属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema", "registry"]),
(0, vue_1.createElementVNode)("pre", _hoisted_18, (0, vue_1.toDisplayString)(JSON.stringify(reservedState.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_19, (0, vue_1.toDisplayString)(JSON.stringify(reservedSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[18] || (_cache[18] = $event => (nativeComposition.value = 'schema-union'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[218] || (_cache[218] = [
(0, vue_1.createTextVNode)("打开 schema 联合分支示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[19] || (_cache[19] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[219] || (_cache[219] = [
(0, vue_1.createTextVNode)("关闭 schema 联合分支示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'schema-union')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_20, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[20] || (_cache[20] = $event => (unionSourceMode.value = 'fixed'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[220] || (_cache[220] = [
(0, vue_1.createTextVNode)("固定来源分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[21] || (_cache[21] = $event => (unionSourceMode.value = 'resolver'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[221] || (_cache[221] = [
(0, vue_1.createTextVNode)("派生来源分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[22] || (_cache[22] = $event => (unionPropsMode.value = 'optional'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[222] || (_cache[222] = [
(0, vue_1.createTextVNode)("可选控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[23] || (_cache[23] = $event => (unionPropsMode.value = 'required'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[223] || (_cache[223] = [
(0, vue_1.createTextVNode)("必填控件属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "unionForm",
ref: unionForm,
modelValue: unionModel.value,
"onUpdate:modelValue": _cache[25] || (_cache[25] = $event => ((unionModel).value = $event)),
schema: unionSchema.value,
registry: (0, vue_1.unref)(protocolRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateUnionField
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[224] || (_cache[224] = [
(0, vue_1.createTextVNode)("校验联合分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[24] || (_cache[24] = $event => (unionForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[225] || (_cache[225] = [
(0, vue_1.createTextVNode)("重置联合分支", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "schema", "registry"]),
(0, vue_1.createElementVNode)("pre", _hoisted_21, (0, vue_1.toDisplayString)(JSON.stringify({ source: unionSourceMode.value, props: unionPropsMode.value, model: unionModel.value, component: unionSchema.value[0].component, hasComponentProps: Object.hasOwn(unionSchema.value[0], 'componentProps'), hasResolver: typeof unionSchema.value[0].resolveDataSource === 'function' })), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_22, (0, vue_1.toDisplayString)(JSON.stringify(unionSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[26] || (_cache[26] = $event => (nativeComposition.value = 'control'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[226] || (_cache[226] = [
(0, vue_1.createTextVNode)("打开控件注册示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[27] || (_cache[27] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[227] || (_cache[227] = [
(0, vue_1.createTextVNode)("关闭控件注册示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'control')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_23, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "protocolForm",
ref: protocolForm,
modelValue: protocolModel.value,
"onUpdate:modelValue": _cache[29] || (_cache[29] = $event => ((protocolModel).value = $event)),
schema: protocolSchema,
registry: (0, vue_1.unref)(protocolRegistry),
inline: false,
"show-search": false,
"show-reset": false
}, {
actions: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateProtocolControl
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[228] || (_cache[228] = [
(0, vue_1.createTextVNode)("校验注册控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[28] || (_cache[28] = $event => (protocolForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[229] || (_cache[229] = [
(0, vue_1.createTextVNode)("重置注册控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "registry"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: checkProtocolRegistration
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[230] || (_cache[230] = [
(0, vue_1.createTextVNode)("检查注册约束", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_24, (0, vue_1.toDisplayString)(JSON.stringify(protocolDefinition)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_25, (0, vue_1.toDisplayString)(JSON.stringify(protocolConstraints.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_26, (0, vue_1.toDisplayString)(JSON.stringify(protocolModel.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_27, (0, vue_1.toDisplayString)(JSON.stringify(protocolSettlement.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createElementVNode)("section", _hoisted_28, [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[30] || (_cache[30] = $event => (nativeComposition.value = 'validation'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[231] || (_cache[231] = [
(0, vue_1.createTextVNode)("打开原生完整规则表单", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[31] || (_cache[31] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[232] || (_cache[232] = [
(0, vue_1.createTextVNode)("关闭原生完整规则表单", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'validation')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_29, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "nativeRuleForm",
ref: nativeRuleForm,
modelValue: nativeRuleModel.value,
"onUpdate:modelValue": _cache[44] || (_cache[44] = $event => ((nativeRuleModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
rules: nativeRuleRules,
"validate-on-rule-change": false,
"label-width": "auto",
style: { "max-width": "600px" },
onValidate: onNativeRuleValidate
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动名称",
prop: "name"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": nativeRuleModel.value.name,
"onUpdate:modelValue": _cache[32] || (_cache[32] = $event => (updateNativeRule({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动区域",
prop: "region"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSelect), {
"model-value": nativeRuleModel.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动区域",
"onUpdate:modelValue": _cache[33] || (_cache[33] = $event => (updateNativeRule({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动数量",
prop: "count"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSelectV2), {
"model-value": nativeRuleModel.value.count,
options: (0, vue_1.unref)(nativeCountOptions),
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动数量",
"onUpdate:modelValue": _cache[34] || (_cache[34] = $event => (updateNativeRule({ count: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value", "options"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动时间",
required: ""
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_30, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { prop: "date1" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamDatePicker), {
"model-value": nativeRuleModel.value.date1,
"value-format": "",
type: "date",
"aria-label": "选择日期",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[35] || (_cache[35] = $event => (updateNativeRule({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
_cache[233] || (_cache[233] = (0, vue_1.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { prop: "date2" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamTimePicker), {
"model-value": nativeRuleModel.value.date2,
"value-format": "",
"aria-label": "选择时间",
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[36] || (_cache[36] = $event => (updateNativeRule({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
})
])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "即时配送",
prop: "delivery"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSwitch), {
"model-value": nativeRuleModel.value.delivery,
"onUpdate:modelValue": _cache[37] || (_cache[37] = $event => (updateNativeRule({ delivery: Boolean($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动地点",
prop: "location"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSegmented), {
"model-value": nativeRuleModel.value.location,
options: nativeLocations,
"onUpdate:modelValue": _cache[38] || (_cache[38] = $event => (updateNativeRule({ location: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动类型",
prop: "type"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamCheckboxGroup), {
"model-value": nativeRuleModel.value.type,
"onUpdate:modelValue": _cache[39] || (_cache[39] = $event => (updateNativeRule({ type: $event.map(String) })))
}, {
default: (0, vue_1.withCtx)(() => [
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(nativeActivityTypes, (kind) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "资源",
prop: "resource"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeRuleModel.value.resource,
"onUpdate:modelValue": _cache[40] || (_cache[40] = $event => (updateNativeRule({ resource: String($event) })))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), { value: "Sponsorship" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[234] || (_cache[234] = [
(0, vue_1.createTextVNode)("赞助", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), { value: "Venue" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[235] || (_cache[235] = [
(0, vue_1.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "活动表单",
prop: "desc"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamTextarea), {
"model-value": nativeRuleModel.value.desc,
"onUpdate:modelValue": _cache[41] || (_cache[41] = $event => (updateNativeRule({ desc: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_31, [
(0, vue_1.createElementVNode)("div", _hoisted_32, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
onClick: _cache[42] || (_cache[42] = $event => (validateNativeRule(true)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[236] || (_cache[236] = [
(0, vue_1.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
onClick: _cache[43] || (_cache[43] = $event => (nativeRuleForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[237] || (_cache[237] = [
(0, vue_1.createTextVNode)(" 重置 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[45] || (_cache[45] = $event => (validateNativeRule(false)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[238] || (_cache[238] = [
(0, vue_1.createTextVNode)("原生规则无回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeRuleFields
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[239] || (_cache[239] = [
(0, vue_1.createTextVNode)("读取完整规则字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_33, (0, vue_1.toDisplayString)(JSON.stringify({
model: nativeRuleModel.value,
date: nativeDateFacts(nativeRuleModel.value.date1),
time: nativeDateFacts(nativeRuleModel.value.date2),
optionCount: (0, vue_1.unref)(nativeCountOptions).length,
events: nativeRuleEvents.value,
submissions: nativeRuleSubmissions.value
})), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_34, (0, vue_1.toDisplayString)(JSON.stringify(nativeRuleSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_35, (0, vue_1.toDisplayString)(JSON.stringify(nativeRuleCallback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_36, (0, vue_1.toDisplayString)(JSON.stringify(nativeRuleFields.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[46] || (_cache[46] = $event => (nativeComposition.value = 'size'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[240] || (_cache[240] = [
(0, vue_1.createTextVNode)("打开原生尺寸组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[47] || (_cache[47] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[241] || (_cache[241] = [
(0, vue_1.createTextVNode)("关闭原生尺寸组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'size')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_37, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeSize.value,
"aria-label": "尺寸控制",
"onUpdate:modelValue": updateNativeSize
}, {
default: (0, vue_1.withCtx)(() => [
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(nativeSizes, (density) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioButton), {
key: density,
value: density
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(density), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioGroup), {
"model-value": nativeSizePosition.value,
"aria-label": "位置控制",
"onUpdate:modelValue": updateNativeSizePosition
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioButton), { value: "left" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[242] || (_cache[242] = [
(0, vue_1.createTextVNode)("左侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioButton), { value: "right" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[243] || (_cache[243] = [
(0, vue_1.createTextVNode)("右侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioButton), { value: "top" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[244] || (_cache[244] = [
(0, vue_1.createTextVNode)("顶部", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
modelValue: sizeActivity.value,
"onUpdate:modelValue": _cache[54] || (_cache[54] = $event => ((sizeActivity).value = $event)),
inline: false,
"label-position": nativeSizePosition.value,
size: nativeSize.value,
"show-search": false,
"show-reset": false,
"label-width": "auto",
style: { "max-width": "600px" }
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动名称" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": sizeActivity.value.name,
"onUpdate:modelValue": _cache[48] || (_cache[48] = $event => (updateSizeActivity({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSelect), {
"model-value": sizeActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "请选择区域",
"onUpdate:modelValue": _cache[49] || (_cache[49] = $event => (updateSizeActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_38, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": sizeActivity.value.date1,
type: "date",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[50] || (_cache[50] = $event => (updateSizeActivity({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"]),
_cache[245] || (_cache[245] = (0, vue_1.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamTimePicker), {
"value-format": "",
"model-value": sizeActivity.value.date2,
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[51] || (_cache[51] = $event => (updateSizeActivity({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动类型" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamCheckboxGroup), {
"model-value": sizeActivity.value.type,
"onUpdate:modelValue": _cache[52] || (_cache[52] = $event => (updateSizeActivity({ type: $event.map(String) })))
}, {
default: (0, vue_1.withCtx)(() => [
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(nativeSizeTypes, (kind) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamCheckboxButton), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "资源" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioGroup), {
"model-value": sizeActivity.value.resource,
"onUpdate:modelValue": _cache[53] || (_cache[53] = $event => (updateSizeActivity({ resource: String($event) })))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
border: "",
value: "Sponsor"
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[246] || (_cache[246] = [
(0, vue_1.createTextVNode)("赞助者", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
border: "",
value: "Venue"
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[247] || (_cache[247] = [
(0, vue_1.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_39, [
(0, vue_1.createElementVNode)("div", _hoisted_40, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitSizeActivity
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[248] || (_cache[248] = [
(0, vue_1.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), { type: "default" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[249] || (_cache[249] = [
(0, vue_1.createTextVNode)("取消", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "label-position", "size"]),
(0, vue_1.createElementVNode)("pre", _hoisted_41, (0, vue_1.toDisplayString)(JSON.stringify({
size: nativeSize.value,
position: nativeSizePosition.value,
model: sizeActivity.value,
date: nativeDateFacts(sizeActivity.value.date1),
time: nativeDateFacts(sizeActivity.value.date2),
submissions: sizeSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[55] || (_cache[55] = $event => (nativeComposition.value = 'basic'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[250] || (_cache[250] = [
(0, vue_1.createTextVNode)("打开原生基础表单组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[56] || (_cache[56] = $event => (nativeComposition.value = 'inline'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[251] || (_cache[251] = [
(0, vue_1.createTextVNode)("打开原生行内表单组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[57] || (_cache[57] = $event => (nativeComposition.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[252] || (_cache[252] = [
(0, vue_1.createTextVNode)("关闭原生基础行内组合", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'basic')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_42, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
modelValue: basicActivity.value,
"onUpdate:modelValue": _cache[66] || (_cache[66] = $event => ((basicActivity).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-width": "auto",
style: { "max-width": "600px" }
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动名称" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": basicActivity.value.name,
"onUpdate:modelValue": _cache[58] || (_cache[58] = $event => (updateBasicActivity({ name: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSelect), {
"model-value": basicActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "请选择区域",
"onUpdate:modelValue": _cache[59] || (_cache[59] = $event => (updateBasicActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_43, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": basicActivity.value.date1,
type: "date",
placeholder: "选择日期",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[60] || (_cache[60] = $event => (updateBasicActivity({ date1: $event })))
}, null, 8 /* PROPS */, ["model-value"]),
_cache[253] || (_cache[253] = (0, vue_1.createElementVNode)("span", null, "-", -1 /* CACHED */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamTimePicker), {
"value-format": "",
"model-value": basicActivity.value.date2,
placeholder: "选择时间",
style: { "width": "100%" },
"onUpdate:modelValue": _cache[61] || (_cache[61] = $event => (updateBasicActivity({ date2: $event })))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "即时配送" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSwitch), {
"model-value": basicActivity.value.delivery,
"onUpdate:modelValue": _cache[62] || (_cache[62] = $event => (updateBasicActivity({ delivery: Boolean($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动类型" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamCheckboxGroup), {
"model-value": basicActivity.value.type,
"onUpdate:modelValue": _cache[63] || (_cache[63] = $event => (updateBasicActivity({ type: $event.map(String) })))
}, {
default: (0, vue_1.withCtx)(() => [
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(nativeActivityTypes, (kind) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
key: kind,
value: kind,
name: "type"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(kind), 1 /* TEXT */)
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "资源" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamRadioGroup), {
"model-value": basicActivity.value.resource,
"onUpdate:modelValue": _cache[64] || (_cache[64] = $event => (updateBasicActivity({ resource: String($event) })))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), { value: "Sponsor" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[254] || (_cache[254] = [
(0, vue_1.createTextVNode)("赞助者", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), { value: "Venue" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[255] || (_cache[255] = [
(0, vue_1.createTextVNode)("场地", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动表单" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamTextarea), {
"model-value": basicActivity.value.desc,
"onUpdate:modelValue": _cache[65] || (_cache[65] = $event => (updateBasicActivity({ desc: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_44, [
(0, vue_1.createElementVNode)("div", _hoisted_45, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitBasicActivity
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[256] || (_cache[256] = [
(0, vue_1.createTextVNode)("创建", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), { type: "default" }, {
default: (0, vue_1.withCtx)(() => [...(_cache[257] || (_cache[257] = [
(0, vue_1.createTextVNode)("取消", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createElementVNode)("pre", _hoisted_46, (0, vue_1.toDisplayString)(JSON.stringify({
model: basicActivity.value,
date: nativeDateFacts(basicActivity.value.date1),
time: nativeDateFacts(basicActivity.value.date2),
submissions: basicSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(nativeComposition.value === 'inline')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_47, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
modelValue: inlineActivity.value,
"onUpdate:modelValue": _cache[70] || (_cache[70] = $event => ((inlineActivity).value = $event)),
inline: true,
"show-search": false,
"show-reset": false
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "审核人" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": inlineActivity.value.user,
placeholder: "审核人",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[67] || (_cache[67] = $event => (updateInlineActivity({ user: String($event) })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动区域" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamSelect), {
"model-value": inlineActivity.value.region,
options: nativeZones,
"value-mode": "value",
multiple: false,
teleported: false,
placeholder: "活动区域",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[68] || (_cache[68] = $event => (updateInlineActivity({ region: String($event ?? '') })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), { label: "活动时间" }, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_5.AsamDatePicker), {
"value-format": "",
"model-value": inlineActivity.value.date,
type: "date",
placeholder: "选择日期",
clearable: "",
style: { "width": "220px" },
"onUpdate:modelValue": _cache[69] || (_cache[69] = $event => (updateInlineActivity({ date: $event })))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), null, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
onClick: submitInlineActivity
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[258] || (_cache[258] = [
(0, vue_1.createTextVNode)(" 查询 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createElementVNode)("pre", _hoisted_48, (0, vue_1.toDisplayString)(JSON.stringify({
model: inlineActivity.value,
date: nativeDateFacts(inlineActivity.value.date),
submissions: inlineSubmissions.value
})), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[71] || (_cache[71] = $event => (dynamicCase.value = true))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[259] || (_cache[259] = [
(0, vue_1.createTextVNode)("打开动态字段组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[72] || (_cache[72] = $event => (dynamicCase.value = false))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[260] || (_cache[260] = [
(0, vue_1.createTextVNode)("关闭动态字段组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(dynamicCase.value)
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_49, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
ref_key: "dynamicForm",
ref: dynamicForm,
modelValue: dynamicModel.value,
"onUpdate:modelValue": _cache[73] || (_cache[73] = $event => ((dynamicModel).value = $event)),
"show-search": false,
"show-reset": false,
inline: false,
"label-width": "auto",
rules: dynamicRules.value,
"validate-on-rule-change": false,
onValidate: onDynamicValidate
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "电子邮箱",
prop: "email"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": dynamicModel.value.email,
"onUpdate:modelValue": updateDynamicEmail
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
((0, vue_1.openBlock)(true), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(dynamicModel.value.domains, (domain, index) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamFormItem), {
key: domain.key,
label: 'Domain' + index,
prop: 'domains.' + index + '.value',
rules: {
required: true,
message: 'domain can not be null',
trigger: 'blur'
},
"data-domain-key": domain.key
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_50, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": domain.value,
"onUpdate:modelValue": $event => (updateDynamicDomain(domain.key, $event))
}, null, 8 /* PROPS */, ["model-value", "onUpdate:modelValue"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
"aria-label": 'Delete Domain' + index,
onClick: $event => (removeDynamicDomain(domain.key))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[261] || (_cache[261] = [
(0, vue_1.createTextVNode)(" 删除 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["aria-label", "onClick"])
])
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["label", "prop", "data-domain-key"]));
}), 128 /* KEYED_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "rules"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[74] || (_cache[74] = $event => (validateDynamic(false)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[262] || (_cache[262] = [
(0, vue_1.createTextVNode)("动态无回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[75] || (_cache[75] = $event => (validateDynamic(true)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[263] || (_cache[263] = [
(0, vue_1.createTextVNode)("动态回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: addDynamicDomain
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[264] || (_cache[264] = [
(0, vue_1.createTextVNode)("新增域名", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[76] || (_cache[76] = $event => (dynamicForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[265] || (_cache[265] = [
(0, vue_1.createTextVNode)("动态重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readDynamicFields
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[266] || (_cache[266] = [
(0, vue_1.createTextVNode)("读取动态字段状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_51, (0, vue_1.toDisplayString)(JSON.stringify({ model: dynamicModel.value, events: dynamicEvents.value })), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_52, (0, vue_1.toDisplayString)(JSON.stringify(dynamicSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_53, (0, vue_1.toDisplayString)(JSON.stringify(dynamicCallback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_54, (0, vue_1.toDisplayString)(JSON.stringify(dynamicFields.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[77] || (_cache[77] = $event => (compositionCase.value = 'alignment'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[267] || (_cache[267] = [
(0, vue_1.createTextVNode)("打开标签对齐组合示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[78] || (_cache[78] = $event => (compositionCase.value = 'accessibility'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[268] || (_cache[268] = [
(0, vue_1.createTextVNode)(" 打开可访问性组合示例 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[79] || (_cache[79] = $event => (compositionCase.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[269] || (_cache[269] = [
(0, vue_1.createTextVNode)("关闭对齐可访问性示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(compositionCase.value === 'alignment')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_55, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
modelValue: alignmentModel.value,
"onUpdate:modelValue": _cache[82] || (_cache[82] = $event => ((alignmentModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-width": "auto",
"label-position": alignmentFormPosition.value
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "表单对齐",
"label-position": "right",
"data-testid": "alignment-form-control"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_56, [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(alignmentFormPositions, (position) => {
return (0, vue_1.createElementVNode)("label", { key: position }, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
modelValue: alignmentFormPosition.value,
"onUpdate:modelValue": _cache[80] || (_cache[80] = $event => ((alignmentFormPosition).value = $event)),
value: position
}, null, 8 /* PROPS */, ["modelValue", "value"]),
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(position), 1 /* TEXT */)
]);
}), 64 /* STABLE_FRAGMENT */))
])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "表单项对齐",
"label-position": "right",
"data-testid": "alignment-item-control"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_57, [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(alignmentItemPositions, (position) => {
return (0, vue_1.createElementVNode)("label", { key: position }, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
modelValue: alignmentItemPosition.value,
"onUpdate:modelValue": _cache[81] || (_cache[81] = $event => ((alignmentItemPosition).value = $event)),
value: position
}, null, 8 /* PROPS */, ["modelValue", "value"]),
(0, vue_1.createTextVNode)((0, vue_1.toDisplayString)(position || 'Empty'), 1 /* TEXT */)
]);
}), 64 /* STABLE_FRAGMENT */))
])
]),
_: 1 /* STABLE */
}),
((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(vue_1.Fragment, null, (0, vue_1.renderList)(alignmentFields, (field) => {
return (0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
key: field.key,
label: field.label,
"label-position": alignmentItemPosition.value,
"data-testid": 'alignment-' + field.key
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": alignmentModel.value[field.key],
"onUpdate:modelValue": $event => (updateAlignment(field.key, $event))
}, null, 8 /* PROPS */, ["model-value", "onUpdate:modelValue"])
]),
_: 2 /* DYNAMIC */
}, 1032 /* PROPS, DYNAMIC_SLOTS */, ["label", "label-position", "data-testid"]);
}), 64 /* STABLE_FRAGMENT */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "label-position"]),
(0, vue_1.createElementVNode)("pre", _hoisted_58, (0, vue_1.toDisplayString)(JSON.stringify({
model: alignmentModel.value,
formPosition: alignmentFormPosition.value,
itemPosition: alignmentItemPosition.value
})), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(compositionCase.value === 'accessibility')
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_59, [
_cache[270] || (_cache[270] = (0, vue_1.createElementVNode)("p", { class: "example-paragraph" }, " Full Name 标签自动关联单个输入;Your Information 标识多输入组,每个输入仍有独立的 aria-label。placeholder 不替代可访问名称。 ", -1 /* CACHED */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamForm), {
modelValue: accessibilityModel.value,
"onUpdate:modelValue": _cache[86] || (_cache[86] = $event => ((accessibilityModel).value = $event)),
inline: false,
"show-search": false,
"show-reset": false,
"label-position": "left",
"label-width": "auto"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "完整姓名",
"data-testid": "accessibility-single"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.fullName,
"onUpdate:modelValue": _cache[83] || (_cache[83] = $event => (updateAccessibility('fullName', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "你的信息",
"data-testid": "accessibility-group"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createElementVNode)("div", _hoisted_60, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.firstName,
"aria-label": "名",
placeholder: "名",
"onUpdate:modelValue": _cache[84] || (_cache[84] = $event => (updateAccessibility('firstName', $event)))
}, null, 8 /* PROPS */, ["model-value"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": accessibilityModel.value.lastName,
"aria-label": "姓",
placeholder: "姓",
"onUpdate:modelValue": _cache[85] || (_cache[85] = $event => (updateAccessibility('lastName', $event)))
}, null, 8 /* PROPS */, ["model-value"])
])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createElementVNode)("pre", _hoisted_61, (0, vue_1.toDisplayString)(JSON.stringify(accessibilityModel.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[87] || (_cache[87] = $event => (openValidationCase('custom')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[271] || (_cache[271] = [
(0, vue_1.createTextVNode)("打开自定义校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[88] || (_cache[88] = $event => (openValidationCase('number')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[272] || (_cache[272] = [
(0, vue_1.createTextVNode)("打开数字校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[89] || (_cache[89] = $event => (validationCase.value = undefined))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[273] || (_cache[273] = [
(0, vue_1.createTextVNode)("关闭校验示例", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(validationCase.value)
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_62, [
((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamForm), {
key: validationCase.value,
ref_key: "validationForm",
ref: validationForm,
modelValue: validationModel.value,
"onUpdate:modelValue": _cache[92] || (_cache[92] = $event => ((validationModel).value = $event)),
"show-search": false,
"show-reset": false,
rules: validationRules.value,
"validate-on-rule-change": false,
"status-icon": "",
onValidate: onValidationCaseEvent
}, {
default: (0, vue_1.withCtx)(() => [
(validationCase.value === 'custom')
? ((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamFormItem), {
key: 0,
label: "密码",
prop: "password"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamPassword), {
"model-value": validationModel.value.password,
"onUpdate:modelValue": _cache[90] || (_cache[90] = $event => (updateValidationText('password', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}))
: (0, vue_1.createCommentVNode)("v-if", true),
(validationCase.value === 'custom')
? ((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamFormItem), {
key: 1,
label: "确认密码",
prop: "confirm"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamPassword), {
"model-value": validationModel.value.confirm,
"onUpdate:modelValue": _cache[91] || (_cache[91] = $event => (updateValidationText('confirm', $event)))
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
}))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamFormItem), {
label: "年龄",
prop: "age"
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
"model-value": validationModel.value.age,
"onUpdate:modelValue": updateValidationAge
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 1 /* STABLE */
})
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "rules"])),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[93] || (_cache[93] = $event => (validateCase(false)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[274] || (_cache[274] = [
(0, vue_1.createTextVNode)("示例无回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[94] || (_cache[94] = $event => (validateCase(true)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[275] || (_cache[275] = [
(0, vue_1.createTextVNode)("示例回调提交", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[95] || (_cache[95] = $event => (validationForm.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[276] || (_cache[276] = [
(0, vue_1.createTextVNode)("示例重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readValidationCase
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[277] || (_cache[277] = [
(0, vue_1.createTextVNode)("读取示例字段状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("pre", _hoisted_63, (0, vue_1.toDisplayString)(JSON.stringify({
kind: validationCase.value,
model: validationModel.value,
pending: ageValidationPending.value,
events: validationEvents.value,
crossValidation: confirmRevalidation.value
})), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_64, (0, vue_1.toDisplayString)(JSON.stringify(validationCaseSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_65, (0, vue_1.toDisplayString)(JSON.stringify(validationCaseCallback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_66, (0, vue_1.toDisplayString)(JSON.stringify(validationCaseFields.value)), 1 /* TEXT */)
]))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[96] || (_cache[96] = $event => (validateNativeSubset('profile.nickname')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[278] || (_cache[278] = [
(0, vue_1.createTextVNode)(" 原生校验嵌套字符串字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[97] || (_cache[97] = $event => (validateNativeSubset([['profile', 'nickname']])))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[279] || (_cache[279] = [
(0, vue_1.createTextVNode)(" 原生校验嵌套分段数组字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateNativeNestedCallback
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[280] || (_cache[280] = [
(0, vue_1.createTextVNode)("原生嵌套回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[98] || (_cache[98] = $event => (form.value?.setFieldsValue({
name: 'Mixed live',
status: 'yes',
profile: { nickname: 'Nested live' }
})))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[281] || (_cache[281] = [
(0, vue_1.createTextVNode)(" 准备混合当前模型 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[99] || (_cache[99] = $event => (form.value?.setInitialValues({
name: 'Mixed initial',
profile: { nickname: 'Mixed nested A' }
})))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[282] || (_cache[282] = [
(0, vue_1.createTextVNode)(" 混合姓名嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[100] || (_cache[100] = $event => (form.value?.setInitialValues({
status: 'yes',
profile: { nickname: 'Mixed nested B' }
})))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[283] || (_cache[283] = [
(0, vue_1.createTextVNode)(" 混合状态嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[101] || (_cache[101] = $event => (form.value?.setInitialValues({ name: 'Omitted nested' })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[284] || (_cache[284] = [
(0, vue_1.createTextVNode)(" 省略嵌套初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[102] || (_cache[102] = $event => (form.value?.setInitialValues({ name: '', status: 'no', profile: { nickname: '' } })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[285] || (_cache[285] = [
(0, vue_1.createTextVNode)(" 恢复完整嵌套基线 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("fieldset", _hoisted_67, [
_cache[324] || (_cache[324] = (0, vue_1.createElementVNode)("legend", null, "原生嵌套 FormItem", -1 /* CACHED */)),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: enableNativeItem
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[286] || (_cache[286] = [
(0, vue_1.createTextVNode)("启用嵌套字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: disableNativeItem
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[287] || (_cache[287] = [
(0, vue_1.createTextVNode)("关闭嵌套字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemArrayPath.value,
"onUpdate:modelValue": _cache[103] || (_cache[103] = $event => ((itemArrayPath).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[288] || (_cache[288] = [
(0, vue_1.createTextVNode)("使用分段字段路径", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemLabelSlot.value,
"onUpdate:modelValue": _cache[104] || (_cache[104] = $event => ((itemLabelSlot).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[289] || (_cache[289] = [
(0, vue_1.createTextVNode)("使用字段标签插槽", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemErrorSlot.value,
"onUpdate:modelValue": _cache[105] || (_cache[105] = $event => ((itemErrorSlot).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[290] || (_cache[290] = [
(0, vue_1.createTextVNode)("使用字段错误插槽", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemRulesEnabled.value,
"onUpdate:modelValue": _cache[106] || (_cache[106] = $event => ((itemRulesEnabled).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[291] || (_cache[291] = [
(0, vue_1.createTextVNode)("使用字段规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemRequired.value,
"onUpdate:modelValue": _cache[107] || (_cache[107] = $event => ((itemRequired).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[292] || (_cache[292] = [
(0, vue_1.createTextVNode)("字段显式必填", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemArrayRules.value,
"onUpdate:modelValue": _cache[108] || (_cache[108] = $event => ((itemArrayRules).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[293] || (_cache[293] = [
(0, vue_1.createTextVNode)("使用数组和多触发器规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemHideMessage.value,
"onUpdate:modelValue": _cache[109] || (_cache[109] = $event => ((itemHideMessage).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[294] || (_cache[294] = [
(0, vue_1.createTextVNode)("隐藏字段校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemInlineMessage.value,
"onUpdate:modelValue": _cache[110] || (_cache[110] = $event => ((itemInlineMessage).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[295] || (_cache[295] = [
(0, vue_1.createTextVNode)("字段行内校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemExternalError.value,
"onUpdate:modelValue": _cache[111] || (_cache[111] = $event => ((itemExternalError).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[296] || (_cache[296] = [
(0, vue_1.createTextVNode)("字段外部错误", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: itemForcedSuccess.value,
"onUpdate:modelValue": _cache[112] || (_cache[112] = $event => ((itemForcedSuccess).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[297] || (_cache[297] = [
(0, vue_1.createTextVNode)("字段强制成功状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[113] || (_cache[113] = $event => (itemLabelPosition.value = 'left'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[298] || (_cache[298] = [
(0, vue_1.createTextVNode)("字段左侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[114] || (_cache[114] = $event => (itemLabelPosition.value = 'right'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[299] || (_cache[299] = [
(0, vue_1.createTextVNode)("字段右侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[115] || (_cache[115] = $event => (itemLabelPosition.value = 'top'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[300] || (_cache[300] = [
(0, vue_1.createTextVNode)("字段顶部标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[116] || (_cache[116] = $event => (itemLabelWidth.value = 'auto'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[301] || (_cache[301] = [
(0, vue_1.createTextVNode)("字段自动标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[117] || (_cache[117] = $event => (itemLabelWidth.value = 120))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[302] || (_cache[302] = [
(0, vue_1.createTextVNode)("字段恢复标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[118] || (_cache[118] = $event => (itemLabelText.value = '昵称'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[303] || (_cache[303] = [
(0, vue_1.createTextVNode)("字段短标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[119] || (_cache[119] = $event => (itemLabelText.value = '这是较长的嵌套昵称标签'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[304] || (_cache[304] = [
(0, vue_1.createTextVNode)(" 字段长标签 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[120] || (_cache[120] = $event => (itemLabelText.value = '嵌套昵称'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[305] || (_cache[305] = [
(0, vue_1.createTextVNode)("字段恢复标签文本", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[121] || (_cache[121] = $event => (itemRequiredMode.value = 'explicit'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[306] || (_cache[306] = [
(0, vue_1.createTextVNode)("字段显式必填属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[122] || (_cache[122] = $event => (itemRequiredMode.value = 'undefined'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[307] || (_cache[307] = [
(0, vue_1.createTextVNode)(" 字段未定义必填属性 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[123] || (_cache[123] = $event => (itemRequiredMode.value = 'omitted'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[308] || (_cache[308] = [
(0, vue_1.createTextVNode)("字段省略必填属性", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[124] || (_cache[124] = $event => (itemLabelWidth.value = 168))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[309] || (_cache[309] = [
(0, vue_1.createTextVNode)("字段数字标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[125] || (_cache[125] = $event => (itemLabelWidth.value = '200px'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[310] || (_cache[310] = [
(0, vue_1.createTextVNode)("字段文本标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[126] || (_cache[126] = $event => (itemSize.value = 'large'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[311] || (_cache[311] = [
(0, vue_1.createTextVNode)("字段 large 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[127] || (_cache[127] = $event => (itemSize.value = 'big'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[312] || (_cache[312] = [
(0, vue_1.createTextVNode)("字段 big 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[128] || (_cache[128] = $event => (itemSize.value = 'default'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[313] || (_cache[313] = [
(0, vue_1.createTextVNode)("字段 default 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[129] || (_cache[129] = $event => (itemSize.value = 'small'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[314] || (_cache[314] = [
(0, vue_1.createTextVNode)("字段 small 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[130] || (_cache[130] = $event => (validateNativeItem('blur')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[315] || (_cache[315] = [
(0, vue_1.createTextVNode)("字段 blur 校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[131] || (_cache[131] = $event => (validateNativeItem('change')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[316] || (_cache[316] = [
(0, vue_1.createTextVNode)("字段 change 校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[132] || (_cache[132] = $event => (validateNativeItem('blur', true)))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[317] || (_cache[317] = [
(0, vue_1.createTextVNode)("字段回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[133] || (_cache[133] = $event => (nativeItem.value?.clearValidate()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[318] || (_cache[318] = [
(0, vue_1.createTextVNode)("字段清除校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[134] || (_cache[134] = $event => (nativeItem.value?.setInitialValue('Item initial')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[319] || (_cache[319] = [
(0, vue_1.createTextVNode)(" 字段设置初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[135] || (_cache[135] = $event => (nativeItem.value?.resetField()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[320] || (_cache[320] = [
(0, vue_1.createTextVNode)("字段恢复初始值", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[136] || (_cache[136] = $event => (form.value?.setInitialValues({ profile: { nickname: 'Form nested initial' } })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[321] || (_cache[321] = [
(0, vue_1.createTextVNode)(" 表单设置嵌套初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[137] || (_cache[137] = $event => (form.value?.resetFields(['profile.nickname'])))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[322] || (_cache[322] = [
(0, vue_1.createTextVNode)(" 表单重置嵌套字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeItem
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[323] || (_cache[323] = [
(0, vue_1.createTextVNode)("读取字段公开状态", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: readNativeFields
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[325] || (_cache[325] = [
(0, vue_1.createTextVNode)("读取原生表单字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[138] || (_cache[138] = $event => (validateNativeSubset('name')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[326] || (_cache[326] = [
(0, vue_1.createTextVNode)("原生校验字符串字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[139] || (_cache[139] = $event => (validateNativeSubset(['name', 'status'])))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[327] || (_cache[327] = [
(0, vue_1.createTextVNode)(" 原生校验数组字段 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[140] || (_cache[140] = $event => (validateNativeSubset()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[328] || (_cache[328] = [
(0, vue_1.createTextVNode)("原生校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateNativeSubsetCallback
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[329] || (_cache[329] = [
(0, vue_1.createTextVNode)("原生字段回调校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[141] || (_cache[141] = $event => (form.value?.setInitialValues({ name: 'Native initial', status: 'yes' })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[330] || (_cache[330] = [
(0, vue_1.createTextVNode)(" 设置原生初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[142] || (_cache[142] = $event => (form.value?.setInitialValues({ name: '', status: 'no' })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[331] || (_cache[331] = [
(0, vue_1.createTextVNode)(" 恢复原生初始值 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: singleNativeRule.value,
"onUpdate:modelValue": _cache[143] || (_cache[143] = $event => ((singleNativeRule).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[332] || (_cache[332] = [
(0, vue_1.createTextVNode)("使用单条原生规则", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: validateOnRuleChange.value,
"onUpdate:modelValue": _cache[144] || (_cache[144] = $event => ((validateOnRuleChange).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[333] || (_cache[333] = [
(0, vue_1.createTextVNode)("自动校验规则变更", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[145] || (_cache[145] = $event => (labelPosition.value = 'left'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[334] || (_cache[334] = [
(0, vue_1.createTextVNode)("原生左侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[146] || (_cache[146] = $event => (labelPosition.value = 'right'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[335] || (_cache[335] = [
(0, vue_1.createTextVNode)("原生右侧标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[147] || (_cache[147] = $event => (labelPosition.value = 'top'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[336] || (_cache[336] = [
(0, vue_1.createTextVNode)("原生顶部标签", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[148] || (_cache[148] = $event => (form.value?.clearValidate(['name', 'status'])))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[337] || (_cache[337] = [
(0, vue_1.createTextVNode)(" 数组清除字段校验 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("fieldset", _hoisted_68, [
_cache[345] || (_cache[345] = (0, vue_1.createElementVNode)("legend", null, "原生表单显示配置", -1 /* CACHED */)),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: labelSuffixEnabled.value,
"onUpdate:modelValue": _cache[149] || (_cache[149] = $event => ((labelSuffixEnabled).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[338] || (_cache[338] = [
(0, vue_1.createTextVNode)("显示标签后缀", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: hideRequiredAsterisk.value,
"onUpdate:modelValue": _cache[150] || (_cache[150] = $event => ((hideRequiredAsterisk).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[339] || (_cache[339] = [
(0, vue_1.createTextVNode)("隐藏必填星号", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: asteriskRight.value,
"onUpdate:modelValue": _cache[151] || (_cache[151] = $event => ((asteriskRight).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[340] || (_cache[340] = [
(0, vue_1.createTextVNode)("星号放在右侧", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: hideMessages.value,
"onUpdate:modelValue": _cache[152] || (_cache[152] = $event => ((hideMessages).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[341] || (_cache[341] = [
(0, vue_1.createTextVNode)("隐藏校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: inlineMessage.value,
"onUpdate:modelValue": _cache[153] || (_cache[153] = $event => ((inlineMessage).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[342] || (_cache[342] = [
(0, vue_1.createTextVNode)("行内校验消息", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: statusIcon.value,
"onUpdate:modelValue": _cache[154] || (_cache[154] = $event => ((statusIcon).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[343] || (_cache[343] = [
(0, vue_1.createTextVNode)("显示校验状态图标", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: disabled.value,
"onUpdate:modelValue": _cache[155] || (_cache[155] = $event => ((disabled).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[344] || (_cache[344] = [
(0, vue_1.createTextVNode)("禁用原生表单控件", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"])
]),
(0, vue_1.createElementVNode)("fieldset", _hoisted_69, [
_cache[358] || (_cache[358] = (0, vue_1.createElementVNode)("legend", null, "表单顶层配置", -1 /* CACHED */)),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: builtinActions.value,
"onUpdate:modelValue": _cache[156] || (_cache[156] = $event => ((builtinActions).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[346] || (_cache[346] = [
(0, vue_1.createTextVNode)("使用内置操作", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: showSearch.value,
"onUpdate:modelValue": _cache[157] || (_cache[157] = $event => ((showSearch).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[347] || (_cache[347] = [
(0, vue_1.createTextVNode)("显示查询按钮", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: showReset.value,
"onUpdate:modelValue": _cache[158] || (_cache[158] = $event => ((showReset).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[348] || (_cache[348] = [
(0, vue_1.createTextVNode)("显示重置按钮", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createCommentVNode)(" prettier-ignore "),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamCheckboxItem), {
modelValue: customActionText.value,
"onUpdate:modelValue": _cache[159] || (_cache[159] = $event => ((customActionText).value = $event))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[349] || (_cache[349] = [
(0, vue_1.createTextVNode)("自定义操作文案", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[160] || (_cache[160] = $event => (labelWidth.value = 'auto'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[350] || (_cache[350] = [
(0, vue_1.createTextVNode)("表单自动标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[161] || (_cache[161] = $event => (labelWidth.value = 168))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[351] || (_cache[351] = [
(0, vue_1.createTextVNode)("数字标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[162] || (_cache[162] = $event => (labelWidth.value = '200px'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[352] || (_cache[352] = [
(0, vue_1.createTextVNode)("文本标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[163] || (_cache[163] = $event => (labelWidth.value = 120))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[353] || (_cache[353] = [
(0, vue_1.createTextVNode)("恢复标签宽度", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[164] || (_cache[164] = $event => (size.value = 'large'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[354] || (_cache[354] = [
(0, vue_1.createTextVNode)("表单 large 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[165] || (_cache[165] = $event => (size.value = 'big'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[355] || (_cache[355] = [
(0, vue_1.createTextVNode)("表单 big 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[166] || (_cache[166] = $event => (size.value = 'default'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[356] || (_cache[356] = [
(0, vue_1.createTextVNode)("表单 default 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[167] || (_cache[167] = $event => (size.value = 'small'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[357] || (_cache[357] = [
(0, vue_1.createTextVNode)("表单 small 尺寸", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
})
]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[168] || (_cache[168] = $event => (legacy.value = !legacy.value))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[359] || (_cache[359] = [
(0, vue_1.createTextVNode)("切换兼容字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[169] || (_cache[169] = $event => (inline.value = !inline.value))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[360] || (_cache[360] = [
(0, vue_1.createTextVNode)("切换行内布局", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[170] || (_cache[170] = $event => (labelPosition.value = labelPosition.value === 'top' ? 'right' : 'top'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[361] || (_cache[361] = [
(0, vue_1.createTextVNode)(" 切换标签位置 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[171] || (_cache[171] = $event => (labelMode.value = labelMode.value === 'visible' ? 'sr-only' : 'visible'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[362] || (_cache[362] = [
(0, vue_1.createTextVNode)(" 切换可访问标签 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[172] || (_cache[172] = $event => (size.value = size.value === 'default' ? 'big' : 'default'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[363] || (_cache[363] = [
(0, vue_1.createTextVNode)(" 切换表单尺寸 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validate
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[364] || (_cache[364] = [
(0, vue_1.createTextVNode)("校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: validateWithCallback
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[365] || (_cache[365] = [
(0, vue_1.createTextVNode)("用回调校验全部字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[173] || (_cache[173] = $event => (form.value?.clearValidate('name')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[366] || (_cache[366] = [
(0, vue_1.createTextVNode)("清除姓名校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[174] || (_cache[174] = $event => (form.value?.clearValidate()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[367] || (_cache[367] = [
(0, vue_1.createTextVNode)("清除全部校验", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[175] || (_cache[175] = $event => (form.value?.setFieldsValue({ name: 'Patched' })))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[368] || (_cache[368] = [
(0, vue_1.createTextVNode)(" 只更新姓名模型 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[176] || (_cache[176] = $event => (form.value?.resetFields()))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[369] || (_cache[369] = [
(0, vue_1.createTextVNode)("重置字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[177] || (_cache[177] = $event => (form.value?.resetFields(['name'])))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[370] || (_cache[370] = [
(0, vue_1.createTextVNode)("只重置姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[178] || (_cache[178] = $event => (form.value?.resetFields('name')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[371] || (_cache[371] = [
(0, vue_1.createTextVNode)("用字符串重置姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[179] || (_cache[179] = $event => {
omitScrollError.value = false;
scrollToError.value = !scrollToError.value;
})
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[372] || (_cache[372] = [
(0, vue_1.createTextVNode)(" 切换校验自动滚动 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[180] || (_cache[180] = $event => (omitScrollError.value = true))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[373] || (_cache[373] = [
(0, vue_1.createTextVNode)("省略校验自动滚动", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[181] || (_cache[181] = $event => (scrollMode.value = 'true'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[374] || (_cache[374] = [
(0, vue_1.createTextVNode)("使用 true 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[182] || (_cache[182] = $event => (scrollMode.value = 'false'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[375] || (_cache[375] = [
(0, vue_1.createTextVNode)("使用 false 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[183] || (_cache[183] = $event => (scrollMode.value = 'object'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[376] || (_cache[376] = [
(0, vue_1.createTextVNode)("使用对象滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[184] || (_cache[184] = $event => (scrollMode.value = 'omitted'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[377] || (_cache[377] = [
(0, vue_1.createTextVNode)("省略滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[185] || (_cache[185] = $event => (scrollMode.value = 'undefined'))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[378] || (_cache[378] = [
(0, vue_1.createTextVNode)("传入 undefined 滚动参数", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[186] || (_cache[186] = $event => (form.value?.scrollToField('name')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[379] || (_cache[379] = [
(0, vue_1.createTextVNode)("滚动到姓名字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: _cache[187] || (_cache[187] = $event => (form.value?.scrollToField('missing')))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[380] || (_cache[380] = [
(0, vue_1.createTextVNode)("滚动到不存在字段", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}),
(0, vue_1.createElementVNode)("div", _hoisted_70, [
_cache[386] || (_cache[386] = (0, vue_1.createElementVNode)("p", {
class: "example-paragraph",
style: { "min-height": "320px" }
}, "滚动区域从这里开始,表单字段位于下方。", -1 /* CACHED */)),
((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamForm), (0, vue_1.mergeProps)({
key: legacy.value ? 'legacy' : 'schema',
ref_key: "form",
ref: form,
modelValue: model.value,
"onUpdate:modelValue": _cache[188] || (_cache[188] = $event => ((model).value = $event)),
inline: inline.value,
"label-position": labelPosition.value,
"label-mode": labelMode.value,
"label-width": labelWidth.value,
size: size.value,
rules: nativeRules.value,
"validate-on-rule-change": validateOnRuleChange.value,
"label-suffix": labelSuffixEnabled.value ? ':' : '',
"hide-required-asterisk": hideRequiredAsterisk.value,
"require-asterisk-position": asteriskRight.value ? 'right' : 'left',
"show-message": !hideMessages.value,
"inline-message": inlineMessage.value,
"status-icon": statusIcon.value,
disabled: disabled.value,
"show-search": showSearch.value,
"show-reset": showReset.value
}, {
...(legacy.value ? { fields: fields } : { schema: schema, registry: registry }),
...(customActionText.value
? { searchText: '筛选成员', resetText: '恢复成员' }
: {}),
...nativeScrollBinding.value
}, {
onValidate: onValidate,
"onUpdate:modelValue": _cache[189] || (_cache[189] = $event => (recordModel('update:modelValue', $event))),
onSearch: _cache[190] || (_cache[190] = $event => (recordModel('search', $event))),
onReset: _cache[191] || (_cache[191] = $event => (recordModel('reset', $event)))
}), (0, vue_1.createSlots)({
default: (0, vue_1.withCtx)(() => [
_cache[382] || (_cache[382] = (0, vue_1.createElementVNode)("p", {
class: "example-paragraph",
"data-testid": "layout-form-default"
}, " 默认内容位于字段之前,不替代生成字段。 ", -1 /* CACHED */)),
(nativeItemEnabled.value)
? ((0, vue_1.openBlock)(), (0, vue_1.createBlock)((0, vue_1.unref)(ui_6.AsamFormItem), (0, vue_1.mergeProps)({
key: 0,
ref_key: "nativeItem",
ref: nativeItem,
"data-testid": "layout-native-item",
prop: itemArrayPath.value ? ['profile', 'nickname'] : 'profile.nickname',
label: itemLabelText.value,
"label-position": itemLabelPosition.value,
"label-width": itemLabelWidth.value
}, {
...itemRequiredBinding.value,
...(itemRules.value === undefined ? {} : { rules: itemRules.value })
}, {
error: itemExternalError.value ? '外部昵称错误' : '',
"show-message": !itemHideMessage.value,
"inline-message": itemInlineMessage.value,
size: itemSize.value,
for: "layout-native-item-input",
"validate-status": itemForcedSuccess.value ? 'success' : ''
}), (0, vue_1.createSlots)({
help: (0, vue_1.withCtx)(() => [
_cache[381] || (_cache[381] = (0, vue_1.createTextVNode)("嵌套字段帮助", -1 /* CACHED */))
]),
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_6.AsamInput), {
id: "layout-native-item-input",
"model-value": model.value.profile?.nickname ?? '',
"onUpdate:modelValue": updateNickname
}, null, 8 /* PROPS */, ["model-value"])
]),
_: 2 /* DYNAMIC */
}, [
(itemLabelSlot.value)
? {
name: "label",
fn: (0, vue_1.withCtx)(({ label }) => [
(0, vue_1.createElementVNode)("span", _hoisted_71, (0, vue_1.toDisplayString)(label) + "插槽", 1 /* TEXT */)
]),
key: "0"
}
: undefined,
(itemErrorSlot.value)
? {
name: "error",
fn: (0, vue_1.withCtx)(({ error }) => [
(0, vue_1.createElementVNode)("span", _hoisted_72, (0, vue_1.toDisplayString)(error), 1 /* TEXT */)
]),
key: "1"
}
: undefined
]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["prop", "label", "label-position", "label-width", "error", "show-message", "inline-message", "size", "validate-status"]))
: (0, vue_1.createCommentVNode)("v-if", true)
]),
append: (0, vue_1.withCtx)(() => [
_cache[385] || (_cache[385] = (0, vue_1.createElementVNode)("p", {
class: "example-paragraph",
"data-testid": "layout-form-append"
}, "追加内容与字段使用同一表单实例。", -1 /* CACHED */))
]),
_: 2 /* DYNAMIC */
}, [
(!builtinActions.value)
? {
name: "actions",
fn: (0, vue_1.withCtx)(({ search, reset }) => [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: $event => (search())
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[383] || (_cache[383] = [
(0, vue_1.createTextVNode)("插槽查询", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["onClick"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
onClick: $event => (reset())
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[384] || (_cache[384] = [
(0, vue_1.createTextVNode)("插槽重置", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["onClick"])
]),
key: "0"
}
: undefined
]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["modelValue", "inline", "label-position", "label-mode", "label-width", "size", "rules", "validate-on-rule-change", "label-suffix", "hide-required-asterisk", "require-asterisk-position", "show-message", "inline-message", "status-icon", "disabled", "show-search", "show-reset"]))
]),
(0, vue_1.createElementVNode)("pre", _hoisted_73, (0, vue_1.toDisplayString)(JSON.stringify(nativeFieldsSnapshot.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_74, (0, vue_1.toDisplayString)(JSON.stringify(nativeSubsetSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_75, (0, vue_1.toDisplayString)(JSON.stringify(nativeSubsetCallback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_76, (0, vue_1.toDisplayString)(JSON.stringify({
...nativeItemSnapshot.value,
requiredMode: itemRequiredMode.value,
requiredOwnKey: Object.hasOwn(itemRequiredBinding.value, 'required'),
requiredValueKind: typeof itemRequiredBinding.value.required,
requiredValue: itemRequiredBinding.value.required
})), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_77, (0, vue_1.toDisplayString)(JSON.stringify(nativeItemSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_78, (0, vue_1.toDisplayString)(JSON.stringify(nativeItemCallback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("p", _hoisted_79, (0, vue_1.toDisplayString)(result.value), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_80, (0, vue_1.toDisplayString)(JSON.stringify(events.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_81, (0, vue_1.toDisplayString)(JSON.stringify(validationSettlement.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_82, (0, vue_1.toDisplayString)(JSON.stringify(callback.value)), 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_83, (0, vue_1.toDisplayString)(JSON.stringify({
model: model.value,
legacy: legacy.value,
singleNativeRule: singleNativeRule.value,
validateOnRuleChange: validateOnRuleChange.value,
labelSuffixEnabled: labelSuffixEnabled.value,
hideRequiredAsterisk: hideRequiredAsterisk.value,
asteriskRight: asteriskRight.value,
hideMessages: hideMessages.value,
inlineMessage: inlineMessage.value,
statusIcon: statusIcon.value,
disabled: disabled.value,
builtinActions: builtinActions.value,
showSearch: showSearch.value,
showReset: showReset.value,
customActionText: customActionText.value,
labelWidth: labelWidth.value,
inline: inline.value,
labelPosition: labelPosition.value,
labelMode: labelMode.value,
size: size.value,
validated: validated.value,
scrollToError: scrollToError.value,
omitScrollError: omitScrollError.value,
scrollMode: scrollMode.value,
scrollIntoViewOptions: scrollIntoViewOptions.value
})), 1 /* TEXT */)
])
]));
};
}
});
exports.default.__scopeId = "data-v-60b74908";
},
"NarrowChoice.vue": (module, exports, require) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const _hoisted_1 = { class: "demo-spacing-1" };
const ui_1 = require("@asam-ui/ui");
exports.default = Object.assign({ name: 'AsamFormNarrowChoiceDemo' }, {
__name: 'NarrowChoice',
props: {
modelValue: { type: String, required: true },
caption: { type: String, required: true }
},
emits: ['update:modelValue'],
setup(__props, { emit: __emit }) {
const emit = __emit;
return (_ctx, _cache) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("fieldset", _hoisted_1, [
(0, vue_1.createElementVNode)("legend", null, (0, vue_1.toDisplayString)(__props.caption), 1 /* TEXT */),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
name: "narrow-status",
"model-value": __props.modelValue,
value: "yes",
onChange: _cache[0] || (_cache[0] = $event => (emit('update:modelValue', 'yes')))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
_cache[2] || (_cache[2] = (0, vue_1.createTextVNode)(" 是 ", -1 /* CACHED */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRadioItem), {
name: "narrow-status",
"model-value": __props.modelValue,
value: "no",
onChange: _cache[1] || (_cache[1] = $event => (emit('update:modelValue', 'no')))
}, {
default: (0, vue_1.withCtx)(() => [
(0, vue_1.createCommentVNode)(" prettier-ignore "),
_cache[3] || (_cache[3] = (0, vue_1.createTextVNode)(" 否 ", -1 /* CACHED */))
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["model-value"])
]));
};
}
});
exports.default.__scopeId = "data-v-cd3b2cdf";
},
};
const __dependencies = {"Demo.vue":{"./NarrowChoice.vue":"NarrowChoice.vue"},"NarrowChoice.vue":{}};
const __cache = Object.create(null);
function __require(id) {
if (__external[id]) return __external[id];
if (__cache[id]) return __cache[id].exports;
const module = { exports: {} };
__cache[id] = module;
__modules[id](module, module.exports, (dependency) => __require(__dependencies[id][dependency] || dependency));
return module.exports;
}
const StandaloneDemo = __require('Demo.vue').default;
</script>
<style>
.form-events[data-v-60b74908] {
max-height: 32rem;
overflow: auto;
}
.demo-layout-1[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-2[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-3[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-4[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-5[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-6[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-7[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-8[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-9[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-10[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-11[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-12[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-13[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-14[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-15[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-16[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-17[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-18[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-layout-19[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
}
.demo-root-layout[data-v-60b74908] {
display: flex;
gap: var(--asam-space-md);
flex-wrap: wrap;
align-items: center;
}
.demo-root-layout[data-v-60b74908] > :is(p, pre, output) {
margin-block: 0;
}
.demo-spacing-1[data-v-60b74908] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-spacing-2[data-v-60b74908] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-spacing-3[data-v-60b74908] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
.demo-slot-layout[data-v-60b74908] {
display: grid;
gap: var(--asam-space-md);
width: 100%;
min-width: 0;
}
.demo-slot-layout > .el-button[data-v-60b74908] {
justify-self: start;
}
.demo-slot-layout[data-v-60b74908] > :is(p, pre, output) {
margin-block: 0;
}
.demo-slot-actions[data-v-60b74908] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-sm);
}
.demo-slot-actions > .el-button + .el-button[data-v-60b74908] {
margin-left: 0;
}
p[data-v-60b74908]:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
.demo-spacing-1[data-v-cd3b2cdf] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--asam-space-md);
}
</style>
滚动区域将字段放在视口下方,便于观察校验失败后的定位。 完整说明。
同一完整示例在 schema 和兼容 fields 两种模式中保留具体实例控制。 完整说明。
可切换标签后缀、必填标记、错误显示、状态图标与禁用状态。 完整说明。
原生 Form 的 model 由 ASAM 的具体类型 v-model/modelValue 承接,不能再传 model 绕过事务。 完整说明。
原生标签位置可直接选择 left、right、top 并恢复 right;姓名模型不受布局变化影响。clearValidate 接受无参数、字符串字段或字段数组;数组按钮清除 name 与 status 的验证显示,保留模型,之后再次 validate 仍能发现原无效姓名。
原生 rules 可为字段提供单条规则或规则数组。 完整说明。
validate 的有效模型返回 fulfilled,无效模型返回 rejected;示例记录真实 Promise 终态。 完整说明。
通过 fields 与 getField 读取字段上下文,并按字段或整表触发校验。 完整说明。
嵌套 FormItem 示例通过默认插槽追加 profile.nickname;字符串和分段数组路径均注册到同一表单。 完整说明。
嵌套字段支持点分字符串与路径数组,字段上下文随当前模型更新。 完整说明。
组合演示交叉校验、异步数字校验与 number 模型转换。 完整说明。
FormItem 自动标签宽度和必填继承:在布局示例启用嵌套字段后,可将表单和字段的 label-width 同时设为 auto,并切换短、长标签,原生标签包装器根据实际标签宽度更新对齐。 完整说明。
可分别设置表单与字段的标签位置,字段空值继承表单配置。 完整说明。
上述对齐与可访问性纵向组合显式设置 inline=false;ASAM Form 默认 inline=true,不能依赖原生 Form 的 false 默认。
动态字段组合采用 Email 的 required/type:email 规则与 domains.index.value 嵌套必填路径。 完整说明。
resetFields 保留原生字段在本次模型更新中的校验暂停,重置后不重新触发 change 规则并留下 success 状态。受控模型的嵌套值不被原生重置直接修改;schema 工厂默认值、兼容字段默认值及默认插槽字段的原生初值仍按各自基线恢复。
原生基础表单组合保留活动名称、两个区域、日期/时间、即时配送、四种活动类型、两种资源、活动正文以及 Create/Cancel。 完整说明。
表单尺寸向子控件传递;切换尺寸和标签位置不重置模型。 完整说明。
完整原生规则组合保留初始 Hello、姓名 required/3到5长度、区域/数量、原生 Date 型日期和时间、地点、非空数组活动类型、资源及正文。 完整说明。
原生 FormItem 校验成功时,validateState 为 success、validate 事件消息为空,公开 validateMessage 仍可保留上一条错误文字;成功时错误区域不显示。 完整说明。
控件注册示例通过 defineAsamControl 创建 custom:code,声明字符串模型、无数据源、必填 placeholder、独立 emptyValue 工厂及可选 suspendable。 完整说明。
公开 AsamSchemaField 除固定/派生来源联合,还根据注册控件的必填属性决定 componentProps 是否可省略。 完整说明。
AsamComponentProps 保留非保留属性的类型约束,保留属性由表单统一管理。 完整说明。
AsamControlSource 是四类工厂来源的 opaque 公共类型;只有 kind 的对象不能替代工厂来源。 完整说明。
AsamDataRuntime 与 createAsamDataRuntime 是应用局部的数据协调契约。 完整说明。
reportError 只处理当前 context,保留 kind/message/cause,给报告附上当前 requestId 并冻结。 完整说明。
确定性模拟示例完整使用公开 AsamMockStep、AsamMockCall、AsamMockProviderOptions、AsamMockProvider 和 createAsamMockProvider。 完整说明。
AsamDataFailure 表达数据失败类型、原因及通知状态;取消请求不作为失败。 完整说明。
AsamMockStep 的结构联合不会在静态或运行时强制 data/error 二选一;同时存在时 error 分支优先,error:undefined 也作为原始拒绝原因保留。示例单独验证这两点,不虚构互斥校验。
通过公开工具规范化选项和分页数据,并处理标签缓存与未解析值。 完整说明。
选择规则按单选、多选、对象和值存储方式组合,非法分支不能混用。 完整说明。
page 要有 own list/total;list 是实际对象数组,稀疏 holes 也拒绝,total 为非负安全整数,total0 时 list 必须为空,正 total 可有空 list。 完整说明。
TS/JS 完整示例包含 13 个状态组,含 27 个 response、3 个字符串 token、18 个配置、17 个 page 形状拒绝,及原始 cause、两种公开重载、adapter/transform 优先级和宿主快照的真实观察;不以静态字段存在或仅挂载代替函数行为证据。
完整来源工厂示例通过公开 defineAsamOptions、defineAsamDictSource 和 resolveAsamOptions 展示 static/api/request/dict 四类来源。 完整说明。
工厂构造不发送请求。 完整说明。
构造配置必须是非数组对象,options/data/api/request/dictType/dataSource 中恰好一个已定义来源且匹配当前工厂,匹配值不能 null。 完整说明。
API 接收原始 params 对象与请求上下文。 完整说明。
resolveAsamOptions 只完成单次管线:必须传入 context,可附 provider、tree、valuePolicy、separator。 完整说明。
已取消的 context 立即以 signal.reason 拒绝且四类来源均零 IO;请求中取消及时拒绝,后端忽略取消时迟到成功和迟到失败都不能触发 transform 或恢复结果。 完整说明。
状态组合函数提供选项、加载、错误、选择及实例控制状态。 完整说明。
选项状态支持响应式来源和策略配置,运行时仍需由宿主提供。 完整说明。
缓存按完整来源身份去重;来源、参数或策略变化时重新计算身份。 完整说明。
字典共享同一 runtime 的来源 identity;force 需要 provider.dict.refresh,缺失时返回 config 错误。 完整说明。
远程搜索应同时在响应式 source 参数中表达当前搜索词,并提供 searchText;连续改变搜索词时取消旧等待,用最后输入发请求。 完整说明。
完整 TS/JS 分段实测29组观察,包括真实250ms默认防抖、25ms配置防抖/0、200ms TTL命中/过期、共享请求、force、刷新失败与恢复、identity、策略和生命周期。 完整说明。
选项值与字段映射的公开类型 ​
| 类型 | 完整约束与对应示例 |
|---|---|
AsamValue |
string、number、true、false;空字符串、0、负小数都合法。null/undefined 属于其他选择模型的空值约定,不属于本类型,object、array、bigint、symbol 也不属于本类型。规范化示例保留数字1与字符串“1”的类型区别;TypeScript number 包含 NaN/Infinity,有限数字限制由运行时检查。 |
AsamRecord |
只读字符串索引的 unknown 值记录。读取后需要收窄,不能按已知数字使用,也不能赋值给索引。它不在静态类型层保证 plain object、深冻结或业务字段;规范化结果的 raw 深复制和冻结由对应运行时管线负责,不改变宿主输入。 |
AsamOption<V, I> |
label 为字符串、value 保持 V、raw 保持 I,三者必需;disabled 为可选 boolean,children 为可选只读同类型选项数组。公开属性只读;默认 I 为 AsamRecord。树、空 children、可选 disabled、raw 元数据和宿主快照由规范化示例实际观察。 |
AsamDictEntry |
label/string、value/AsamValue 必需,disabled/boolean 与递归只读 children 可选;额外字符串字段类型为 unknown。已声明属性与额外字符串索引均只读,读取 unknown 字段需先收窄;静态类型不保证嵌套对象深冻结。字典输入原值与转换后的规范化 value 分别保留,不把两者混为同一泛型。 |
AsamDictValueType、AsamDictValue<T> |
前者是 string/number/boolean 三种字符串判别值;后者分别推导 string、number、boolean,联合 T 按分支分发。实际字典转换按严格运行时规则处理数字字符串、布尔别名、非法值和重复值;静态条件类型不执行转换。 |
AsamKeysOfType<I, V> |
只选择实际存在且其完整字段类型可赋给 V 的字符串字段名。number 字段不能作 string label;可选 string 含 undefined,所以不被仅 string 的匹配包含。数字或符号键不由最终字符串键类型暴露。 |
AsamFieldNames<I, V> |
label 匹配 string 字段、value 匹配 V 字段且两者必需;disabled 可选并匹配 boolean/undefined 字段,children 可选并匹配 readonly I[]/undefined 字段,所有映射属性只读。字段名是直接键,含点的键不会当成路径,字典固定字段与普通自定义映射分别演示。 |
完整 layout-registry TS/JS 示例中的规范化与来源分段承接上述类型:展示所有标量类型、原始记录和元数据快照、树与直接字段映射,以及三种字典值转换、非法形状与配置拒绝。 完整说明。
请求、字典与通用控制的公开协议 ​
AsamRequestContext 提供只读 signal/AbortSignal、requestId/number、scope/string 和 epoch/number。 完整说明。
AsamApiRequest<P, R> 是 (params: P, context: AsamRequestContext) => Promise<R>。 完整说明。
请求配置声明地址、方法与参数;取消、分页和查询意图由请求上下文传递。 完整说明。
数据错误保留失败类型、消息与原因;数据来源同时声明缓存及转换元数据。 完整说明。
字典 provider 异步返回字典条目;统一 runtime 管理请求与字典状态。 完整说明。
AsamDataControls<T> 只包含只读 reload 和 cancel 方法引用。 完整说明。
控件注册的内部边界 ​
应用使用公开 AsamControl、defineAsamControl 和 createAsamSchema;合法注册对象由工厂创建。 完整说明。
注册子控件的局部请求错误 ​
Form 通过既有控件注册与字段模型承接高级子控件的 error 插槽。 完整说明。
Form 不新增根请求、根 error 插槽或根 reload;FormItem 的原生校验 error 插槽继续 保持字段校验作用。完整 TS/JS 多文件例使用独立 provider,并在卸载时关闭子应用。
注册子控件的局部请求错误
<template><StandaloneDemo /></template>
<script lang="ts" setup>
import * as __external0 from "vue";
import * as __external1 from "@asam-ui/ui";
const __external: any = {"vue": { ...__external0, __esModule: true },
"@asam-ui/ui": { ...__external1, __esModule: true }};
const __modules: any = {
"Demo.vue": (module: any, exports: any, require: any) => {
"use strict";
var __importDefault: any = function (mod?: any) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1: any = require("vue");
const vue_2: any = require("vue");
const vue_3: any = require("vue");
const ui_1: any = require("@asam-ui/ui");
const Child_vue_1: any = __importDefault(require("./Child.vue"));
const transport_js_1: any = require("./transport.js");
exports.default = (0, vue_1.defineComponent)({
...{ name: 'AsamFormDemoLocalErrorExample' },
__name: 'Demo',
setup(__props?: any) {
const host: any = (0, vue_3.ref)();
let app: any;
(0, vue_3.onMounted)(() => {
if (!host.value)
return;
const transport: any = (0, transport_js_1.createTransport)();
app = (0, vue_3.createApp)(Child_vue_1.default, { transport });
(0, ui_1.provideAsamData)(app, transport.provider, { scope: 'AsamForm-local-error' });
app.mount(host.value);
});
(0, vue_3.onBeforeUnmount)(() => app?.unmount());
return (_ctx?: any, _cache?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("div", {
ref_key: "host",
ref: host
}, null, 512 /* NEED_PATCH */));
};
}
});
},
"Child.vue": (module: any, exports: any, require: any) => {
"use strict";
var __importDefault: any = function (mod?: any) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1: any = require("vue");
const vue_2: any = require("vue");
const _hoisted_1: any = { class: "demo-root-layout" };
const _hoisted_2: any = { "data-testid": "form-model" };
const vue_3: any = require("vue");
const ui_1: any = require("@asam-ui/ui");
const RequestSelect_vue_1: any = __importDefault(require("./RequestSelect.vue"));
exports.default = (0, vue_1.defineComponent)({
...{ name: 'AsamFormChildLocalErrorExample' },
__name: 'Child',
props: {
transport: { type: null, required: true }
},
setup(__props?: any) {
const props: any = __props;
const control: any = (0, ui_1.defineAsamControl)({
component: RequestSelect_vue_1.default,
emptyValue: () => null,
sourceKinds: []
});
const registry: any = { 'custom:request-status': control };
const builder: any = (0, ui_1.createAsamSchema)()(registry);
const schema: any = [
builder.field({
field: 'status',
component: 'custom:request-status',
label: '请求状态',
componentProps: { transport: props.transport }
})
];
const model: any = (0, vue_3.ref)({ status: null });
return (_ctx?: any, _cache?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("div", _hoisted_1, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamForm), {
modelValue: model.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event?: any) => ((model).value = $event)),
schema: schema,
registry: registry,
inline: false,
"show-search": false,
"show-reset": false
}, null, 8 /* PROPS */, ["modelValue"]),
(0, vue_2.createElementVNode)("pre", _hoisted_2, (0, vue_2.toDisplayString)(model.value), 1 /* TEXT */)
]));
};
}
});
exports.default.__scopeId = "data-v-aef2105e";
},
"RequestSelect.vue": (module: any, exports: any, require: any) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1: any = require("vue");
const vue_2: any = require("vue");
const _hoisted_1: any = { class: "demo-spacing-1" };
const _hoisted_2: any = {
role: "alert",
"data-testid": "local-error"
};
const _hoisted_3: any = { class: "example-paragraph" };
const _hoisted_4: any = {
key: 0,
class: "example-paragraph"
};
const _hoisted_5: any = {
class: "example-paragraph",
role: "status",
"data-testid": "retry-result"
};
const _hoisted_6: any = {
class: "example-paragraph",
"data-testid": "transport-count"
};
const _hoisted_7: any = { "data-testid": "local-model" };
const vue_3: any = require("vue");
const ui_1: any = require("@asam-ui/ui");
exports.default = (0, vue_1.defineComponent)({
...{ name: 'AsamFormRequestSelectLocalErrorExample' },
__name: 'RequestSelect',
props: {
transport: { type: null, required: true },
modelValue: { type: [String, null], required: true }
},
emits: ["update:modelValue"],
setup(__props: any, { emit: __emit }: any) {
const props: any = __props;
const transport: any = props.transport;
const emit: any = __emit;
const value: any = (0, vue_3.computed)({
get: () => props.modelValue,
set: (value?: any) => emit('update:modelValue', value)
});
const control: any = (0, vue_3.ref)();
const busy: any = (0, vue_3.ref)(false), result: any = (0, vue_3.ref)('');
const dataSource: any = (0, ui_1.defineAsamOptions)().api({
api: transport.api,
params: undefined,
transform: (rows?: any) => rows,
fieldNames: { label: 'label', value: 'value' }
});
(0, vue_3.onMounted)(async () => {
const response: any = await control.value?.reload();
result.value = response?.status ?? 'cancelled';
});
async function recover(retry?: any) {
busy.value = true;
transport.failing.value = false;
try {
const response: any = await retry();
result.value = response.status;
}
finally {
busy.value = false;
}
}
async function failAgain() {
busy.value = true;
transport.failing.value = true;
try {
const response: any = await control.value?.reload({ force: true });
result.value = response?.status ?? 'cancelled';
}
finally {
busy.value = false;
}
}
return (_ctx?: any, _cache?: any) => {
return ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("section", _hoisted_1, [
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamRemoteSelect), {
ref_key: "control",
ref: control,
modelValue: value.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event?: any) => ((value).value = $event)),
"data-source": (0, vue_2.unref)(dataSource),
immediate: false
}, {
error: (0, vue_2.withCtx)(({ error, stale, retry }: any) => [
(0, vue_2.createElementVNode)("div", _hoisted_2, [
(0, vue_2.createElementVNode)("p", _hoisted_3, (0, vue_2.toDisplayString)(error.message) + "(" + (0, vue_2.toDisplayString)(error.kind) + ")", 1 /* TEXT */),
stale
? ((0, vue_2.openBlock)(), (0, vue_2.createElementBlock)("p", _hoisted_4, "已保留上次成功结果。"))
: (0, vue_2.createCommentVNode)("v-if", true),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: busy.value,
onClick: ($event?: any) => (recover(retry))
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[1] || (_cache[1] = [
(0, vue_2.createTextVNode)(" 恢复并重试 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled", "onClick"])
])
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "data-source"]),
(0, vue_2.createVNode)((0, vue_2.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: busy.value,
onClick: failAgain
}, {
default: (0, vue_2.withCtx)(() => [...(_cache[2] || (_cache[2] = [
(0, vue_2.createTextVNode)("模拟更新失败", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_2.createElementVNode)("p", _hoisted_5, (0, vue_2.toDisplayString)(result.value), 1 /* TEXT */),
(0, vue_2.createElementVNode)("p", _hoisted_6, " 请求 " + (0, vue_2.toDisplayString)((0, vue_2.unref)(transport).calls.value) + " 次,字典刷新 " + (0, vue_2.toDisplayString)((0, vue_2.unref)(transport).refreshes.value) + " 次 ", 1 /* TEXT */),
(0, vue_2.createElementVNode)("pre", _hoisted_7, (0, vue_2.toDisplayString)(value.value), 1 /* TEXT */)
]));
};
}
});
exports.default.__scopeId = "data-v-21727db5";
},
"transport.ts": (module: any, exports: any, require: any) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.createTransport = createTransport;
const vue_1: any = require("vue");
function createTransport() {
const failing: any = (0, vue_1.ref)(true), calls: any = (0, vue_1.ref)(0), refreshes: any = (0, vue_1.ref)(0);
const api: any = async () => {
calls.value++;
if (failing.value)
throw Error('演示请求暂不可用');
return [
{ id: 1, value: 'ready', label: '准备' },
{ id: 2, value: 'running', label: '进行' }
];
};
const provider: any = {
dict: {
get: async (_type?: any, context?: any) => {
context.signal.throwIfAborted();
return api();
},
refresh: async (context?: any) => {
context.signal.throwIfAborted();
refreshes.value++;
}
}
};
return { failing, calls, refreshes, api, provider };
}
},
};
const __dependencies: any = {"Demo.vue":{"./Child.vue":"Child.vue","./transport.js":"transport.ts"},"Child.vue":{"./RequestSelect.vue":"RequestSelect.vue","./transport.js":"transport.ts"},"RequestSelect.vue":{"./transport.js":"transport.ts"},"transport.ts":{}};
const __cache: any = Object.create(null);
function __require(id: any): any {
if (__external[id]) return __external[id];
if (__cache[id]) return __cache[id].exports;
const module: any = { exports: {} };
__cache[id] = module;
__modules[id](module, module.exports, (dependency: any) => __require(__dependencies[id][dependency] || dependency));
return module.exports;
}
const StandaloneDemo = __require('Demo.vue').default;
</script>
<style>
.demo-root-layout[data-v-aef2105e] {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout[data-v-aef2105e] > :is(p, pre, output) {
margin-block: 0;
}
.demo-spacing-1[data-v-21727db5] {
display: grid;
gap: var(--asam-space-md);
}
p[data-v-21727db5]:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
</style>
<template><StandaloneDemo /></template>
<script setup>
import * as __external0 from "vue";
import * as __external1 from "@asam-ui/ui";
const __external = {"vue": { ...__external0, __esModule: true },
"@asam-ui/ui": { ...__external1, __esModule: true }};
const __modules = {
"Demo.vue": (module, exports, require) => {
"use strict";
var __importDefault = function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const vue_2 = require("vue");
const ui_1 = require("@asam-ui/ui");
const Child_vue_1 = __importDefault(require("./Child.vue"));
const transport_js_1 = require("./transport.js");
exports.default = Object.assign({ name: 'AsamFormDemoLocalErrorExample' }, {
__name: 'Demo',
setup(__props) {
const host = (0, vue_2.ref)();
let app;
(0, vue_2.onMounted)(() => {
if (!host.value)
return;
const transport = (0, transport_js_1.createTransport)();
app = (0, vue_2.createApp)(Child_vue_1.default, { transport });
(0, ui_1.provideAsamData)(app, transport.provider, { scope: 'AsamForm-local-error' });
app.mount(host.value);
});
(0, vue_2.onBeforeUnmount)(() => app?.unmount());
return (_ctx, _cache) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", {
ref_key: "host",
ref: host
}, null, 512 /* NEED_PATCH */));
};
}
});
},
"Child.vue": (module, exports, require) => {
"use strict";
var __importDefault = function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const _hoisted_1 = { class: "demo-root-layout" };
const _hoisted_2 = { "data-testid": "form-model" };
const vue_2 = require("vue");
const ui_1 = require("@asam-ui/ui");
const RequestSelect_vue_1 = __importDefault(require("./RequestSelect.vue"));
exports.default = Object.assign({ name: 'AsamFormChildLocalErrorExample' }, {
__name: 'Child',
props: { transport: { type: Object, required: true } },
setup(__props) {
const props = __props;
const control = (0, ui_1.defineAsamControl)({
component: RequestSelect_vue_1.default,
emptyValue: () => null,
sourceKinds: []
});
const registry = { 'custom:request-status': control };
const builder = (0, ui_1.createAsamSchema)()(registry);
const schema = [
builder.field({
field: 'status',
component: 'custom:request-status',
label: '请求状态',
componentProps: { transport: props.transport }
})
];
const model = (0, vue_2.ref)({ status: null });
return (_ctx, _cache) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("div", _hoisted_1, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamForm), {
modelValue: model.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((model).value = $event)),
schema: schema,
registry: registry,
inline: false,
"show-search": false,
"show-reset": false
}, null, 8 /* PROPS */, ["modelValue"]),
(0, vue_1.createElementVNode)("pre", _hoisted_2, (0, vue_1.toDisplayString)(model.value), 1 /* TEXT */)
]));
};
}
});
exports.default.__scopeId = "data-v-0f0be503";
},
"RequestSelect.vue": (module, exports, require) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const _hoisted_1 = { class: "demo-spacing-1" };
const _hoisted_2 = {
role: "alert",
"data-testid": "local-error"
};
const _hoisted_3 = { class: "example-paragraph" };
const _hoisted_4 = {
key: 0,
class: "example-paragraph"
};
const _hoisted_5 = {
class: "example-paragraph",
role: "status",
"data-testid": "retry-result"
};
const _hoisted_6 = {
class: "example-paragraph",
"data-testid": "transport-count"
};
const _hoisted_7 = { "data-testid": "local-model" };
const vue_2 = require("vue");
const ui_1 = require("@asam-ui/ui");
exports.default = Object.assign({ name: 'AsamFormRequestSelectLocalErrorExample' }, {
__name: 'RequestSelect',
props: {
transport: { type: Object, required: true },
modelValue: { type: String, default: null }
},
emits: ['update:modelValue'],
setup(__props, { emit: __emit }) {
const props = __props;
const transport = props.transport;
const emit = __emit;
const value = (0, vue_2.computed)({
get: () => props.modelValue,
set: (value) => emit('update:modelValue', value)
});
const control = (0, vue_2.ref)();
const busy = (0, vue_2.ref)(false), result = (0, vue_2.ref)('');
const dataSource = (0, ui_1.defineAsamOptions)().api({ api: transport.api, params: undefined });
(0, vue_2.onMounted)(async () => {
const response = await control.value?.reload();
result.value = response?.status ?? 'cancelled';
});
async function recover(retry) {
busy.value = true;
transport.failing.value = false;
try {
const response = await retry();
result.value = response.status;
}
finally {
busy.value = false;
}
}
async function failAgain() {
busy.value = true;
transport.failing.value = true;
try {
const response = await control.value?.reload({ force: true });
result.value = response?.status ?? 'cancelled';
}
finally {
busy.value = false;
}
}
return (_ctx, _cache) => {
return ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("section", _hoisted_1, [
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamRemoteSelect), {
ref_key: "control",
ref: control,
modelValue: value.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((value).value = $event)),
"data-source": (0, vue_1.unref)(dataSource),
immediate: false
}, {
error: (0, vue_1.withCtx)(({ error, stale, retry }) => [
(0, vue_1.createElementVNode)("div", _hoisted_2, [
(0, vue_1.createElementVNode)("p", _hoisted_3, (0, vue_1.toDisplayString)(error.message) + "(" + (0, vue_1.toDisplayString)(error.kind) + ")", 1 /* TEXT */),
stale
? ((0, vue_1.openBlock)(), (0, vue_1.createElementBlock)("p", _hoisted_4, "已保留上次成功结果。"))
: (0, vue_1.createCommentVNode)("v-if", true),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: busy.value,
onClick: $event => (recover(retry))
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[1] || (_cache[1] = [
(0, vue_1.createTextVNode)(" 恢复并重试 ", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled", "onClick"])
])
]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["modelValue", "data-source"]),
(0, vue_1.createVNode)((0, vue_1.unref)(ui_1.AsamButton), {
type: "default",
"native-type": "button",
disabled: busy.value,
onClick: failAgain
}, {
default: (0, vue_1.withCtx)(() => [...(_cache[2] || (_cache[2] = [
(0, vue_1.createTextVNode)("模拟更新失败", -1 /* CACHED */)
]))]),
_: 1 /* STABLE */
}, 8 /* PROPS */, ["disabled"]),
(0, vue_1.createElementVNode)("p", _hoisted_5, (0, vue_1.toDisplayString)(result.value), 1 /* TEXT */),
(0, vue_1.createElementVNode)("p", _hoisted_6, " 请求 " + (0, vue_1.toDisplayString)((0, vue_1.unref)(transport).calls.value) + " 次,字典刷新 " + (0, vue_1.toDisplayString)((0, vue_1.unref)(transport).refreshes.value) + " 次 ", 1 /* TEXT */),
(0, vue_1.createElementVNode)("pre", _hoisted_7, (0, vue_1.toDisplayString)(value.value), 1 /* TEXT */)
]));
};
}
});
exports.default.__scopeId = "data-v-dc2a891e";
},
"transport.js": (module, exports, require) => {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.createTransport = createTransport;
const vue_1 = require("vue");
function createTransport() {
const failing = (0, vue_1.ref)(true), calls = (0, vue_1.ref)(0), refreshes = (0, vue_1.ref)(0);
const api = async () => {
calls.value++;
if (failing.value)
throw Error('演示请求暂不可用');
return [
{ id: 1, value: 'ready', label: '准备' },
{ id: 2, value: 'running', label: '进行' }
];
};
const provider = {
dict: {
get: async (_type, context) => {
context.signal.throwIfAborted();
return api();
},
refresh: async (context) => {
context.signal.throwIfAborted();
refreshes.value++;
}
}
};
return { failing, calls, refreshes, api, provider };
}
},
};
const __dependencies = {"Demo.vue":{"./Child.vue":"Child.vue","./transport.js":"transport.js"},"Child.vue":{"./RequestSelect.vue":"RequestSelect.vue"},"RequestSelect.vue":{},"transport.js":{}};
const __cache = Object.create(null);
function __require(id) {
if (__external[id]) return __external[id];
if (__cache[id]) return __cache[id].exports;
const module = { exports: {} };
__cache[id] = module;
__modules[id](module, module.exports, (dependency) => __require(__dependencies[id][dependency] || dependency));
return module.exports;
}
const StandaloneDemo = __require('Demo.vue').default;
</script>
<style>
.demo-root-layout[data-v-0f0be503] {
display: grid;
gap: var(--asam-space-md);
justify-items: start;
}
.demo-root-layout[data-v-0f0be503] > :is(p, pre, output) {
margin-block: 0;
}
.demo-spacing-1[data-v-dc2a891e] {
display: grid;
gap: var(--asam-space-md);
}
p[data-v-dc2a891e]:where(.example-paragraph) {
margin-block: 16px;
line-height: 1.8;
overflow-wrap: anywhere;
}
</style>
API
属性 AsamFormProps
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
modelValue | — | M | — |
fields | — | readonly AsamFormField[] | undefined | — |
schema | — | readonly AsamFormSchemaEntry<M>[] | undefined | — |
registry | — | object | undefined | — |
inline | 行内表单模式 | boolean | undefined | true |
labelWidth | 标签宽度,例如 '50px'。可以使用 auto。 | string | number | undefined | 'auto' |
showSearch | — | boolean | undefined | true |
showReset | — | boolean | undefined | true |
searchText | — | string | undefined | '搜 索' |
resetText | — | string | undefined | '重置' |
labelMode | — | enum"visible" | "sr-only"完整类型:AsamFormLabelMode | undefined | 'visible' |
disabled | 是否禁用表单中的全部控件;设为 true 时覆盖内部组件的 disabled。 | boolean | undefined | false |
size | 表单项大小 | enum"large" | "big" | "default" | "small"完整类型:AsamControlSize | undefined | — |
scrollIntoViewOptions | 校验失败时,根据 scrollIntoView 配置滚动到首个错误字段。 | boolean | ScrollIntoViewOptions | undefined | true |
rules | 表单验证规则, 具体配置见下表, 更多内容可以参考async-validator | (AsamFormProps<M>)["rules"] | — |
labelPosition | 表单域标签的位置,当设置为 left 或 right 时,则也需要设置 label-width 属性 | enum"top" | "right" | "left"完整类型:"top" | "right" | "left" | undefined | — |
requireAsteriskPosition | 星号的位置。 | enum"right" | "left"完整类型:"right" | "left" | undefined | — |
labelSuffix | 表单域标签的后缀 | string | undefined | — |
inlineMessage | 是否在行内显示校验信息 | boolean | undefined | false |
statusIcon | 是否在输入框中显示校验结果反馈图标 | boolean | undefined | false |
showMessage | 是否显示校验错误信息 | boolean | undefined | false |
validateOnRuleChange | 是否在 rules 属性改变后立即触发一次验证 | boolean | undefined | false |
hideRequiredAsterisk | 是否隐藏必填字段标签旁边的红色星号。 | boolean | undefined | false |
scrollToError | 当校验失败时,滚动到第一个错误表单项 | boolean | undefined | false |
事件 AsamFormEmits
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
validate | — | (AsamFormEmits<M>)["validate"] | — |
update:modelValue | — | [model: M] | — |
search | — | [model: M] | — |
reset | — | [model: M] | — |
插槽 AsamFormSlots
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
default | — | (() => unknown) | undefined | — |
actions | — | ((scope: { search: () => void; reset: () => void; }) => unknown) | undefined | — |
append | — | (() => unknown) | undefined | — |
实例方法与状态 AsamFormExpose
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
validate | 验证表单项 | (AsamFormExpose<M>)["validate"] | — |
clearValidate | 清除指定字段的校验消息。 | (AsamFormExpose<M>)["clearValidate"] | — |
resetFields | — | (AsamFormExpose<M>)["resetFields"] | — |
setFieldsValue | — | (patch: Partial<M>) => void | — |
validateField | 验证具体的某个字段。 | (AsamFormExpose<M>)["validateField"] | — |
scrollToField | 滚动到指定的字段 | (AsamFormExpose<M>)["scrollToField"] | — |
getField | 获取字段的 context | (AsamFormExpose<M>)["getField"] | — |
fields | 全部字段的上下文。 | (AsamFormExpose<M>)["fields"] | — |
setInitialValues | 设置表单字段的初始值。当调用 resetFields 时,字段将重置为这些值。 | (initModel: Record<string, any>) => void | — |
类型 AsamSchemaField
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
field | — | K | — |
component | — | C | — |
label | — | string | undefined | — |
required | — | boolean | undefined | — |
rules | — | (AsamSchemaField<M, R, K, C>)["rules"] | — |
defaultValue | — | (() => M[K]) | undefined | — |
dependsOn | — | readonly (keyof M & string)[] | undefined | — |
hidden | — | boolean | ((model: Readonly<M>) => boolean) | undefined | — |
disabled | — | boolean | ((model: Readonly<M>) => boolean) | undefined | — |
onDependencyChange | — | enum"clear" | "retain"完整类型:"clear" | "retain" | undefined | — |
onHide | — | enum"clear" | "retain"完整类型:"clear" | "retain" | undefined | — |
componentProps | — | (AsamSchemaField<M, R, K, C>)["componentProps"] | — |
dataSource | — | (AsamSchemaField<M, R, K, C>)["dataSource"] | undefined | — |
resolveDataSource | — | undefined | (AsamSchemaField<M, R, K, C>)["resolveDataSource"] | — |
用法与契约补充说明 ​
Schema 与控件覆盖 ​
schema 配合 registry 使用;createAsamSchema 的 field 校验字段名、模型类型和对应控件。componentProps 不能接管 modelValue、来源属性或值策略保留字段。数据来源在 dataSource 与 resolveDataSource 中二选一;静态与异步来源须符合控件注册的 sourceKinds。
表单标量日期与时间 ​
注册表的 DatePicker、TimePicker 和 TimeSelect 使用 string|null 协议。Form 自有适配器为前两者显式传入 YYYY-MM-DD、HH:mm:ss;componentProps.valueFormat 可指定其他字符串格式。原生清空结果在 Form 适配器中映射为 null,reset 使用字段 defaultValue 或 emptyValue。基础日期组件仍保留原生默认值、模型联合与清空行为;需要 Date、数组或范围模型时使用范围控件、字段插槽或自定义注册控件。
依赖与隐藏规则 ​
dependsOn 声明前置字段;resolveDataSource 从只读模型派生来源。onDependencyChange 和 onHide 分别使用 retain 或 clear,按实际规则保留或清除模型。hidden、disabled 可以是布尔值或只读模型函数;回调不得修改模型。动态数据控件的暂停和旧请求取消由控件及表单生命周期协作处理。
插槽与实例 ​
field-字段名 插槽提供 field、model、value、update 和 updateValue;使用更新函数写回对应字段。actions 提供 search 与 reset 回调,二者返回 void;search/reset 事件携带当前模型,使用事件监听读取模型。append 用于追加内容,validate 使用基础表单事件。setFieldsValue 接收 Partial
依赖来源、隐藏与重置 ​
完整示例按地区派生成员 API 来源,在地区变化时清除旧成员;隐藏备注时清除备注并暂停其验证,重新显示后恢复 required 规则。使用 setFieldsValue 事务更新模型,validate 的拒绝由调用方处理,读取 fields/getField 并通过 setInitialValues + resetFields 设置重置目标。defaultValue 工厂用于 schema 字段的默认重置值;actions 的事件用于读取提交模型。接口只在演示内部运行。
依赖来源、隐藏与重置 ​
同一示例可切换 onDependencyChange 与 onHide 的 retain/clear 策略:retain 保留当前模型,clear 使用注册控件的空值。hidden 和 disabled 分别提供布尔及只读模型函数形式;禁用控件保留当前值,隐藏字段暂停验证,重新显示后恢复规则。固定成员来源通过 dataSource 传入预建 API 来源,依赖成员来源通过 resolveDataSource 派生,两者互斥;清空地区时 resolver 返回 undefined,暂停请求并保留过期选项快照,恢复地区后重新加载并可再次选择。追加长度规则与 required 同时生效;清空显式初始值再重置时,备注使用 defaultValue 工厂的非空默认值,随后隐藏并 clear 仍清为空值。
依赖来源、隐藏与重置 ​
成员字段也可独立切换必填、枚举规则、布尔/函数隐藏和禁用;固定来源与派生来源使用相同字段策略。隐藏后暂停成员验证,重新显示恢复必填;禁用保留值并继续验证,不能用禁用跳过必填。非空成员默认值仅用于 schema 重置,隐藏清值仍使用 Select 的 null 空值。固定来源下改变地区时,依赖 retain/clear 控制当前成员值,来源仍保持原预建 API。
依赖来源、隐藏与重置 ​
成员显示配置可切换 schema 的 label 与 componentProps.placeholder,并恢复原标签和占位文案。成员仍使用注册的 RemoteSelect,选择只更新 member 字段,保留地区及备注;读取成员配置可确认 getField('member') 与 fields 中的同一公开字段上下文、原生 prop 和字段总数。
布局、自定义注册和兼容字段 ​
完整示例用 custom:status 注册真正只发出 yes/no 的包装控件,componentProps.caption 为必填;宽 Input 不能代替窄枚举控件。布局按钮切换 inline、labelPosition、labelMode 和两档表单尺寸,sr-only 保留可访问名称。校验使用基础 rules 与 scrollToError,拒绝由调用方处理,validate 事件保留字段及结果。append 插槽放置字段后的内容。
布局、自定义注册和兼容字段 ​
完整布局场景记录四个公开事件:update:modelValue、search、reset 保留具体模型快照,validate 保留字段、布尔结果和消息。default 无scope且位于生成字段之前;append 无scope;actions 提供零参数 search/reset,在示例中显式调用,不把 MouseEvent 当作字段参数。schema 和兼容 fields 都可检查上述行为。
布局、自定义注册和兼容字段 ​
滚动区域将字段放在视口下方,便于观察校验失败后的定位。scrollToError 控制校验是否自动滚到首个无效字段,省略时默认 false;scrollIntoViewOptions 接受 true、false 或原生 ScrollIntoViewOptions 对象,省略或设为 undefined 时使用默认 true。对象示例使用 behavior=auto、block=center;布尔 false 是原生滚动对齐参数,不是关闭滚动。关闭自动校验滚动后仍可调用 scrollToField('name'),不存在的字段不触发滚动。resetFields(['name']) 或 resetFields('name') 只重置姓名并保留状态,resetFields() 重置全部字段;actions.reset 是无参数回调,reset 事件返回模型。
布局、自定义注册和兼容字段 ​
同一完整示例在 schema 和兼容 fields 两种模式中保留具体实例控制。 validate() 的无回调拒绝由调用者处理;validate(callback) 将 valid 与无效字段集合传给回调, 可以观察失败的 name 与成功时的空集合。clearValidate('name') 或 clearValidate() 清除对应 验证显示并保留当前模型;它不会把无效输入改成有效值。setFieldsValue({ name: 'Patched' }) 仅更新姓名并保留状态,后续仍可校验或按子集/全部重置。
布局、自定义注册和兼容字段 ​
原生 Form 的 model 由 ASAM 的具体类型 v-model/modelValue 承接,不能再传 model 绕过事务。inline 可开启并恢复非行内,labelWidth 支持数字和文本宽度,size 使用 ASAM 四档并传给原生输入。validate 事件保留字段、布尔有效性和错误文字;default 插槽无参数,位于生成字段之前且不替换字段。公开 validate 同时保留 Promise 与 callback:无回调的失败拒绝由调用者处理,回调失败带无效字段集合,成功带空集合。
布局、自定义注册和兼容字段 ​
原生 rules 可为字段提供单条规则或规则数组。原数组保留 required 与 min=2,切换单条规则使用 min=5。validateOnRuleChange=true 时规则切换立即触发原生校验;false 时既有错误与模型保持,手动 validate 仍按当前规则工作。恢复数组规则和自动校验后,无效/有效状态按当前模型恢复;此开关不禁用输入变化或手动校验。
布局、自定义注册和兼容字段 ​
嵌套 FormItem 示例通过默认插槽追加 profile.nickname;字符串和分段数组路径均注册到同一表单。控件使用显式 for/id、标签与错误作用域插槽;可独立调整标签位置/宽度、四档尺寸、required/rules、showMessage/inlineMessage、外部 error 与 validateStatus。单条 blur 规则和数组 blur/change 规则演示 trigger 过滤;公开实例 validate 的 Promise 与回调、validateState/validateMessage/size、clearValidate、setInitialValue/resetField 以及表单嵌套初始值/重置均可操作。关闭后恢复原 name/status 模型和字段数,不影响原默认示例。
布局、自定义注册和兼容字段 ​
FormItem 自动标签宽度和必填继承:在布局示例启用嵌套字段后,可将表单和字段的 label-width 同时设为 auto,并切换短、长标签,原生标签包装器根据实际标签宽度更新对齐。required=false 会覆盖规则中的 required=true,空值仍可通过;required=true 即使没有 rules 也会生成必填校验。传入 undefined 或完全省略 required 都继承已有规则。示例分别提供显式、undefined、省略三种绑定,并显示是否存在 required 自有键;字段无回调校验记录 Promise,回调校验记录 valid 和字段键,读取状态可查看原生字段状态和消息。
布局、自定义注册和兼容字段 ​
动态字段组合采用 Email 的 required/type:email 规则与 domains.index.value 嵌套必填路径。新增与删除按稳定 key 管理,索引变化后由当前公开 FormItem prop 重新对应字段。submit 记录真实无回调 Promise 或回调 valid/fields;resetFields 重置当前仍挂载字段的初值,不重建已经删除的数组成员。示例可读取 fields/getField 的公开状态与分段路径身份,空数组时只校验邮件字段。
布局、自定义注册和兼容字段 ​
原生基础表单组合保留活动名称、两个区域、日期/时间、即时配送、四种活动类型、两种资源、活动正文以及 Create/Cancel。文本域由独立 AsamTextarea 承接,其他输入均用公开 ASAM 控件;本组合显式设置 value-format="",日期和时间保持原生 Date 模型;基础日期/时间控件未设置 value-format 时使用原生 Date 模型,schema 的标量日期/时间注册项由 Form 显式配置字符串格式,Create 记录具体提交快照,Cancel 沿原例不添加业务动作。行内组合保留 Approved by、区域、日期和 Query,三个控件都可实际清除;本行内组合保留原生清空结果,不将基础空值统一改写为 null,查询记录清除后的当前模型。两个组合均在原默认示例之外单独启用。
布局、自定义注册和兼容字段 ​
完整原生规则组合保留初始 Hello、姓名 required/3到5长度、区域/数量、原生 Date 型日期和时间、地点、非空数组活动类型、资源及正文。数量由公开 AsamSelectV2 消费 10000 个规范化选项,地点由 AsamSegmented 承接;Date/时间显式 value-format="",文本域继续使用独立 AsamTextarea。Create 记录 callback 的 valid/fields 与实际 Promise 终态,成功才保存当前提交快照;额外按钮观察无回调拒绝,Reset 恢复挂载时 Hello 与其余空基线并清除字段校验。配送无必填规则,false 不列入无效字段。
布局、自定义注册和兼容字段 ​
原生 FormItem 校验成功时,validateState 为 success、validate 事件消息为空,公开 validateMessage 仍可保留上一条错误文字;成功时错误区域不显示。clearValidate/resetFields 才清除公开消息和校验状态,不应把事件消息与实例的最后错误文字混为一项。
布局、自定义注册和兼容字段 ​
控件注册示例通过 defineAsamControl 创建 custom:code,声明字符串模型、无数据源、必填 placeholder、独立 emptyValue 工厂及可选 suspendable。注册配置与复制的 sourceKinds/requiredProps 数组被冻结;调用者数组后续改变不影响注册对象。createAsamSchema<Model>()(registry) 负责匹配模型与注册控件类型,field 返回同一配置对象,不能代替 AsamForm 的运行时校验。实际表单示例输入、校验和 reset 到 Default;约束检查演示无效注册配置产生 config 错误。isAsamControl 与 RuntimeControl 属于内部实现,当前不作为根入口公开 API 使用。
布局、自定义注册和兼容字段 ​
公开 AsamSchemaField 除固定/派生来源联合,还根据注册控件的必填属性决定 componentProps 是否可省略。联合分支示例用 Input 和 custom:code 展示可省略/必填属性各自的固定与 resolver 四种组合:无数据源控件可省略来源或 resolver 返回 undefined,仍正常输入、校验和按工厂重置;必填注册属性不能因改用 resolver 而省略。明确 undefined 的可选来源字段不构成两个有效来源冲突;非 undefined 的来源/resolver 互斥,Prepared API 来源与只读依赖、保留/清除、暂停恢复等完整路径继续见依赖示例。
布局、自定义注册和兼容字段 ​
AsamControlSource 是四类工厂来源的 opaque 公共类型;只有 kind 的对象不能替代工厂来源。控件来源类型示例在独立 runtime/context 中真实解析 static、api、request、dict,保留实际来源和不可变结果,再由表单 Select 消费解析快照,真实选择、校验和默认重置。它不会自动让自定义控件具备来源加载器,组件仍需实现自己的消费路径。AsamSourceKindTuple<K> 在 K=never 时是空元组,非空联合时恰好覆盖每个种类一次且可任意排序;示例公开注册四类全 24 种顺序、空/单项/双项元组,验证冻结复制及重复/未知/非数组的运行时拒绝。运行时注册看不到泛型 K,缺项约束由静态元组检查承担,不把合法子集误报为运行时非法。
布局、自定义注册和兼容字段 ​
AsamDataRuntime 与 createAsamDataRuntime 是应用局部的数据协调契约。完整运行时示例通过公开入口真实运行默认构造、延迟安装、同对象重复安装、禁止替换、只读 provider/scope/epoch、冻结 context、身份检查、独立取消、scope 切换、epoch 失效、订阅与取消订阅、错误报告和回收;构造与这些协调动作不会发起 transport。scope 必须是非空字符串;provider 的 request/upload/adaptOptions/adaptPage/onError/isErrorNotified、dict 与 pagination 在构造和 install 中同样验证。重复 setScope 不失效,变更 scope 和 invalidate 同步中止所有当前 context;release 可重复,结构相同的外部 context 不会成为本 runtime 的当前请求。
布局、自定义注册和兼容字段 ​
reportError 只处理当前 context,保留 kind/message/cause,给报告附上当前 requestId 并冻结。相同错误在同一 epoch 内跨 context 去重,invalidate 清空该缓存。宿主 isErrorNotified 返回 true 或输入已标记 notified 时跳过 onError;当前错误在调用 onError 前登记以阻止递归。没有通知钩子时仍返回标准化未通知结果;过期或外部 context 返回输入原对象且不触发钩子。示例没有吞掉产品控制台错误:抛错的失效订阅者及抛错/异步的通知钩子另外在真实普通安装包的隔离 Node 故障测试中观测,验证其他订阅者继续执行、原始失败保全、同步回调边界、递归与去重和零未处理 Promise 拒绝。异步 onError 返回在 TypeScript 的 void 回调兼容规则下可能可赋值,运行时依然要求同步完成;不把静态类型描述成其没有实现的拒绝能力。
布局、自定义注册和兼容字段 ​
确定性模拟示例完整使用公开 AsamMockStep、AsamMockCall、AsamMockProviderOptions、AsamMockProvider 和 createAsamMockProvider。request 路由键是“method URL”(省略 method 时为 get),dictionary 用类型键,refresh 只有显式提供队列才存在;空队列表示存在但已耗尽。每步 data/error 可带 Promise
布局、自定义注册和兼容字段 ​
page 要有 own list/total;list 是实际对象数组,稀疏 holes 也拒绝,total 为非负安全整数,total0 时 list 必须为空,正 total 可有空 list。不会猜测 data/rows 等未知包装或把非法响应变成空列表。结果及列表/raw 元数据深复制冻结。resolveAsamPage 的公开重载分别是 response+同步 transform 两参数,或 response+undefined+可选 provider 三参数;无 transform/adapter 时验证原响应,显式 transform 负责解包装,否则可用 provider.adaptPage。动态不受类型约束的三参数组合中 transform 优先于 adapter,但示例不把该组合描述成合法静态重载。同步 transform 抛错保留原 cause 并标记 transform,adapter/默认响应错误标记 response;无效返回保持对应阶段且附带规范化失败。异步 transform/adapter 按同步规则拒绝,以同步守卫失败为 cause,并处理 Promise 拒绝以免泄漏 unhandled rejection;真实普通安装包的四个隔离 Node 故障场景另行验证此边界。
布局、自定义注册和兼容字段 ​
完整来源工厂示例通过公开 defineAsamOptions、defineAsamDictSource 和 resolveAsamOptions 展示 static/api/request/dict 四类来源。无泛型工厂使用 AsamValue/AsamRecord,允许默认 label/value;显式 value/raw 泛型工厂要求字段映射,API 和 URL 还要求同步 transform。API 的 params 和 transform 输入由 API 函数推断,不能用其他字段扩大它们;URL transform 收到 unknown,宿主负责可靠地收窄。dictValueType 缺省 string,显式 number/boolean 改变解析结果 value 的静态类型,raw 保留字典原始值。AsamSourceKind 是四种来源的封闭联合。
布局、自定义注册和兼容字段 ​
工厂构造不发送请求。每个来源只有冻结的 kind 可见,类型品牌隐藏在类型层,实际执行身份由工厂登记;手写 kind 对象、展开复制和 Proxy 包装均不能代替原来源。AsamSourceDescriptor 是公开只读类型,其 identity 为对象或字符串,input、transform、fields、cache、dictType、dictValueType 均有明确类型;内部描述符读取函数在包根仅作为类型导出,不是可调用的根值 API。不要通过扩展包根或给来源对象添加 loader 来绕开工厂。
布局、自定义注册和兼容字段 ​
构造配置必须是非数组对象,options/data/api/request/dictType/dataSource 中恰好一个已定义来源且匹配当前工厂,匹配值不能 null。额外非 undefined 键拒绝;额外 undefined 键允许,当前构造器也接受继承的来源属性,示例将此与规范化数据必须有 own 字段的规则分别呈现。cache 仅用于 API/URL,ttlMs 为正安全整数,key 若提供必须是函数;static/dict 不接受 cache。自定义远程 fieldNames 必须伴随 transform,即使 provider 有 adaptOptions 也先执行这项构造校验。fieldNames 构造时复制冻结;params、request、cache 与静态 options 保留宿主引用,不深冻结宿主。static 每次解析读取当前 options,并返回独立的深冻结快照,构造不会提前验证 options 列表内容。
布局、自定义注册和兼容字段 ​
API 接收原始 params 对象与请求上下文。 URL 先验证非空 url、get/post/put/delete 方法及非数组对象 params;缺省方法 get,get 不能有 data。解析时再次验证宿主 request,发送浅复制配置,保留 params/data 引用和原 context。URL 必须有 provider.request;字典必须有 provider.dict.get,并传递原 dictType(非空白但不主动 trim)和 context。API/URL 的显式 transform 优先于 provider.adaptOptions,否则使用原响应;字典使用其固定字段和严格值转换,不借用远程 adapter。
布局、自定义注册和兼容字段 ​
resolveAsamOptions 只完成单次管线:必须传入 context,可附 provider、tree、valuePolicy、separator。远程规则先于 IO 验证;provider 能力缺失和无效配置不会发出 transport。API/provider 必须返回带 then/catch 的 Promise 接口,不能直接返回数组;同步 transport 抛错和 Promise 拒绝记为 request 并保留原 cause,非 Promise 返回记为 response。显式 transform 失败记为 transform,adapter/原响应/字典转换失败记为 response;static 规范化错误记为 config。异步 transform/adapter 会被同步守卫拒绝并消费其 Promise 拒绝;这些错误不是成功空列表。
布局、自定义注册和兼容字段 ​
已取消的 context 立即以 signal.reason 拒绝且四类来源均零 IO;请求中取消及时拒绝,后端忽略取消时迟到成功和迟到失败都不能触发 transform 或恢复结果。cache 元数据不使此函数自动缓存,重复调用仍发两次 IO,也不调用 cache.key;cache/share、响应式来源替换、stale、错误恢复、模型同步和资源释放由状态消费者负责。完整 TS/JS 示例含 16 个观察组、61 个构造拒绝、9 个传输错误、8 个解析分支和两种迟到回包;原有 Form 和所有公开来源组合保持可运行。
布局、自定义注册和兼容字段 ​
字典共享同一 runtime 的来源 identity;force 需要 provider.dict.refresh,缺失时返回 config 错误。一次刷新成功后重新加载受影响的字典,等待同次刷新的消费者不重复刷新。失败保留旧快照、标记 stale,并向有效消费者交付一次已报告的结构化错误;中途加入的新字典组保留同一报告与 notified 标记。失败交付先登记消费者,再调用 onError,因此本地回调内重新加载、先前等待者加入新组和互相触发的有限重试不会重复交付同次错误。示例覆盖旧组、新组、取消、epoch 切换、成功刷新及恢复;旧普通包的重复回调故障记录保留,修复后的正常本地安装候选已通过这些 DEV 检查。
布局、自定义注册和兼容字段 ​
远程搜索应同时在响应式 source 参数中表达当前搜索词,并提供 searchText;连续改变搜索词时取消旧等待,用最后输入发请求。debounceMs 是非负安全整数,缺省250ms,0立即请求;reload 可直接触发本次加载,cancel/active 切换/销毁清除当前等待。scope 或 epoch 失效清空快照/错误/成功标记与缓存键,再按当前配置建立新请求,旧回包不能回写。onSuccess 接收完整规范化选项且与当前 data 是同一成功快照,onError 接收当前结构化错误。AsamReloadResult 分为 success(data/fromCache)、error(error) 和 cancelled,无 pending 分支。
布局、自定义注册和兼容字段 ​
完整 TS/JS 分段实测29组观察,包括真实250ms默认防抖、25ms配置防抖/0、200ms TTL命中/过期、共享请求、force、刷新失败与恢复、identity、策略和生命周期。TS、JS与实际 Form Layout Story均在修复后的正常本地安装包上执行29组相同结果,包括真实挂载注入与卸载;隔离Node执行其中28组并检查未处理拒绝,9条刷新重入回归另行执行。这里记录本角色DEV验证,整卡独立QA与ACC仍按原完整15组件范围进行。
选项值与字段映射的公开类型 ​
完整 layout-registry TS/JS 示例中的规范化与来源分段承接上述类型:展示所有标量类型、原始记录和元数据快照、树与直接字段映射,以及三种字典值转换、非法形状与配置拒绝。公开类型夹具为每项提供明确的合法赋值和不合法用法;类型检查不代替这些已有的真实运行时观察,也不把静态可表达的 NaN 当成运行时合法选项。
请求、字典与通用控制的公开协议 ​
AsamRequestContext 提供只读 signal/AbortSignal、requestId/number、scope/string 和 epoch/number。createContext() 创建真实冻结对象,序号在所属 runtime 内递增;释放、scope 切换和显式失效会终止所属 signal。结构上相同的外来对象不能代替该 runtime 登记的 context。API 与 provider 接收原 context,不复制或改写它;类型只约束形状,不能用静态 number/string 字段证明运行时归属。
请求、字典与通用控制的公开协议 ​
AsamApiRequest<P, R> 是 (params: P, context: AsamRequestContext) => Promise<R>。P/R 保留宿主泛型,P 不限于某个业务对象;直接同步返回响应不符合契约。来源管线还会检查实际 Promise 接口、同步抛错、拒绝和取消,并将迟到回包隔离;参数对象身份与 context 身份由示例实际验证。API 回调不会因声明泛型而自动转换响应。
请求、字典与通用控制的公开协议 ​
AsamDataControls<T> 只包含只读 reload 和 cancel 方法引用。reload 接收可选 { force?: boolean },返回 Promise<AsamReloadResult<T>>;cancel 无参数且返回 void,不把取消结果作为它的返回值。完整选项状态示例将等待中的 reload 结算为 cancelled,并检查回包、回调与保留快照;这些状态生命周期由具体消费者提供,不能仅从通用控制类型推断额外状态成员。
控件注册的内部边界 ​
应用使用公开 AsamControl、defineAsamControl 和 createAsamSchema;合法注册对象由工厂创建。内部 isAsamControl 依赖私有 WeakSet,不是可公开复用的结构判断;RuntimeControl 是运行时内部形状,根入口既不导出该类型,也不导出上述判断函数。内部 Schema 深路径不在包 exports 中,应用不应通过深路径绕过品牌或注册。完整示例通过公开工厂与实际表单消费这一边界。
注册子控件的局部请求错误 ​
Form 通过既有控件注册与字段模型承接高级子控件的 error 插槽。本例注册
RequestSelect 子控件,在其 RemoteSelect 内定制 { error, stale, retry };错误对象
沿用子控件原 AsamDataError,无参数 retry 返回其强刷 reload 的 Promise。
初次失败与保留旧数据后的更新失败均局部展示,等待 success/error/cancelled 后更新
结果说明,不把请求失败写成字段校验错误,也不改变父模型。
更多参数与事件说明 ​
布局、自定义注册和兼容字段 ​
兼容按钮在独立实例之间切换 schema 和 fields:旧 fields 使用 key/type/options,仍支持输入、选择、验证及重置;它不提供 createAsamSchema 的字段和控件双向类型检查,新表单继续使用 schema。两种模式均由同一 v-model 管理真实模型,不同时提供 schema 和 fields。
布局、自定义注册和兼容字段 ​
顶层配置在 schema/registry 与兼容 fields 两种方式下共同演示 v-model、inline、数字/文本 labelWidth、visible/sr-only labelMode 和 large/big/default/small 四档尺寸;尺寸由表单传给未单独设尺寸的输入控件。勾选使用内置操作后移除 actions 插槽,showSearch/showReset 独立控制两个按钮,searchText/resetText 切换默认与自定义文案;查询在配置有效时直接发出当前模型,不自动验证字段;需要验证时由调用方显式调用 validate。重置恢复初始模型。取消内置操作后恢复原 actions 插槽。
布局、自定义注册和兼容字段 ​
原布局示例还可独立切换原生 labelSuffix、hideRequiredAsterisk、requireAsteriskPosition、showMessage、inlineMessage、statusIcon 和 disabled。这些属性由 AsamForm 统一交给其 AsamBaseForm 实例:隐藏错误文字不取消校验失败,状态图标跟随真实校验结果,取消禁用后原生姓名输入继续更新当前模型。自定义注册控件应自行消费表单上下文或明确的 disabled 契约;示例中的窄枚举原生 radio 不声明此能力。
布局、自定义注册和兼容字段 ​
示例另记录无回调 validate() 的实际 Promise 终态:有效模型 fulfilledValue=true,无效模型 settledKind=rejected 并保留 rejectionFields 中的 name。invalid 状态文字本身不能区分 fulfilled false 与 rejected;上述终态记录用于确认公开 Promise 契约,不改变原 callback 的 valid/fields 记录。
布局、自定义注册和兼容字段 ​
原生实例按钮读取 fields 与 getField 的公开字段上下文:字符串 name 和分段路径数组指向同一上下文,不存在的路径返回 undefined,字段列表仍包含当前 name/status,fieldValue 跟随模型。validateField 可按字符串、字段数组或省略参数校验;无回调的有效模型 fulfilled true,无效模型 rejected 并记录 name。回调返回 valid/fields,失败回调 false/name 后 Promise fulfilled false,成功为 true/空集合。setInitialValues 只设置后续 resetFields 的基线,不立即修改当前模型;重置采用新基线,随后可恢复原空姓名/no 基线。
布局、自定义注册和兼容字段 ​
原生表单方法的嵌套补充通过 AsamForm 公开 receiver 操作 profile.nickname:getField 点分字符串与多段数组返回同一当前上下文,缺失嵌套路径返回 undefined;validateField 的字符串和嵌套分段数组选择器仅校验目标,排除的无效兄弟字段保持原错误/状态且不发该字段的新校验事件,validateField() 则拒绝准确全部无效字段。无回调 Promise 与回调 valid/fields 分别记录实际终态。setInitialValues 的映射分两类:schema/兼容 fields 管理字段的遗漏项在 resetFields 时继续按已确认 ASAM defaultValue 工厂/emptyValue 或兼容默认值恢复;默认插槽注册的原生字段由 native setInitialValues 设置基线,遗漏的 slot 字段基线为 undefined,slotResetPatch 在重置时读取它。混合提供与遗漏场景不立即修改模型,重置采用相应基线,再恢复完整初始值;不把 native 遗漏 undefined 强加给 ASAM 管理字段。
布局、自定义注册和兼容字段 ​
自定义校验与数字校验示例通过 AsamForm + AsamFormItem 组合:密码/确认密码交叉规则、修改密码后重新校验确认字段、异步整数与成年年龄回调;数字输入沿 Vue .number 的 parseFloat 语义转换,空值/非数字保留原字符串供 required/type:number 报错。无回调提交记录实际 Promise,回调提交记录 valid/fields,字段状态可读取,resetFields 恢复原基线。原默认例子不启用此区域;native slot profile.nickname 类型允许遗漏值,匹配前轮已经验证的 undefined 初始值语义。
布局、自定义注册和兼容字段 ​
标签对齐组合示例包含两个位置选择器和 姓名、活动区域、活动形式 三字段:Form left/right/top 与 FormItem 空值继承、left/right/top 可组合;两个选择器的字段标签固定 right,独立于表单位置。可访问性组合中,完整姓名 自动关联单一 AsamInput;您的信息 在多输入时由原生 FormItem 生成 group/aria-labelledby,每个 AsamInput 分别设置 名字、姓氏 aria-label,placeholder 仅为输入提示,不替代名称。
布局、自定义注册和兼容字段 ​
原生尺寸组合通过公开 RadioGroup/RadioButton 切换 large/big/default/small 与 left/right/top;表单传递密度到输入、选择、日期/时间、复选按钮、带 border 的单选和操作按钮。保留两个活动类型和两种资源,Date/时间显式 value-format="";改变尺寸和标签位置不重置当前模型,Create 记录具体快照,Cancel 保持原例行为。
布局、自定义注册和兼容字段 ​
AsamComponentProps<P> 保留 P 的非保留属性、必填和 readonly 约束;十三个 AsamReservedControlProp 为 modelValue、update:modelValue、onUpdate:modelValue、options、api、request、dictType、dataSource、transform、multiple、valueMode、multipleValueMode、separator,全部禁止通过 componentProps 注入。控件属性边界示例逐项把外部原始 schema 的保留键交给公开 AsamForm,配置错误出现前不会挂载控件或调用来源解析,当前模型保持不变;恢复合法 placeholder、maxlength、clearable 后可继续真实输入、校验和默认重置。不要用原始 schema 的宽松输入类型替代 createAsamSchema 的静态安全约束。
布局、自定义注册和兼容字段 ​
AsamDataFailure 是 Error 子类,保留 config/request/response/transform/upload 类型、message、可选原 cause,name=AsamDataFailure 且 notified 初始 false;readonly 是公开类型约束,构造实例本身不会自动冻结。低层失败是否通知仍由当前 runtime/context 的报告规则决定,模拟器不擅自通知宿主。Body 与 TS/JS 源码明确这些边界,不把 Error 构造器描述成运行时 kind 验证器。
布局、自定义注册和兼容字段 ​
选项与分页规范化示例完整调用公开 normalizeAsamOptions、normalizeAsamPage、resolveAsamPage,并提供 AsamMapping 与 AsamOptionRules 的完整类型/实际配置。mapping 的 label/value 必需,disabled/children 可选,字段名是直接 own key,“name.label”不表示路径;字段名本身只要求非空字符串,label/value 可映射同一个键。数据 option 必须是对象,label 为字符串,value 为 string/boolean/有限 number;空 label/value 在普通模式合法。disabled 只能 boolean 或 undefined,children 只能数组或 undefined;非空 children 需要 tree 模式。值按类型保留,整棵树全局去重并拒绝祖先循环;空 children 可用于平面 options。规范化深复制/冻结结果和 raw,不冻结或改变宿主输入。
布局、自定义注册和兼容字段 ​
规则支持 single value/object、multiple value array/string、multiple object array 五种合法策略;single 不能带 multipleValueMode,object multiple 不能 string。separator 为非空字符串,string 模式按完整 separator 检查,不按字符拆解;拒绝空 token、包含完整 separator 和 String(value) 碰撞,数字1与字符串“1”在普通模式不同而在 string 模式冲突。dictionary string/number/boolean 转换使用严格规则并保留 raw 的原始值;number 不接受空白/任意字符串或 boolean,boolean 只接受 true/1/“true”/“1”及对应 false/0 形式。各 boolean 别名单独转换有效,合并后重复值仍被拒绝。TypeScript number 无法表达有限性,运行时还会拒绝 NaN/Infinity;unknown 输入的形状由规范化器验证,不把其静态参数误称为已经验证的数据。
布局、自定义注册和兼容字段 ​
选项状态分段通过 useAsamRemoteOptions/useAsamDictOptions 展示 AsamOptionsState 的完整 data、loading、error、stale、hasSucceeded、empty、dataKey、requestKey、reload 和 cancel。公开引用和方法在类型上只读,宿主不应修改 value;成功的规范化 data/raw 自身是独立深冻结快照。初始尚未成功不算 empty;成功空列表才算 empty,加载中或有错误不算 empty。失败保留最近成功数据并标记 stale,成功重试清除 error/stale;取消和销毁终结等待中的 reload,不产生迟到成功回调。配置错误先于 IO 处理,相同 kind/message 的连续无效来源不重复发布本地错误回调;有效来源恢复后可重新加载。
布局、自定义注册和兼容字段 ​
AsamOptionsStateConfig.source 可用原来源、ref 或同步 getter;active、valuePolicy、separator、searchText、debounceMs 同样支持相应值/ref/getter。remote 仅接受 api/request,dict 仅接受 dict;static 来源由静态消费者处理。runtime 可显式提供,在组件 setup 内也可使用 provideAsamData 关联的 app runtime;组件外没有显式 runtime 会拒绝。immediate 缺省启动,false 只建立来源/请求键并等待 reload;active=false 取消请求并保留成功快照为 stale,inactive reload 返回 cancelled,恢复 active 后按 immediate 规则接续。tree 要在选项规范化时处理整棵树,策略或 separator 变化形成新的键;字符串 token 歧义是 response 错误,不把保留数据误作当前成功数据。
布局、自定义注册和兼容字段 ​
source 的缓存元数据在这里生效:同 runtime、scope、epoch、来源/参数/映射/transform/策略/tree/separator 等完整 identity 的带缓存远程消费者共享请求与结果,单个 cancel 不终止其他消费者;未带缓存的远程消费者保持隔离。缓存 key 默认序列化输入,带缓存时 Date/Map/循环等非普通可序列化输入拒绝,也可由同步自定义 key 返回非空字符串;无缓存时无法序列化输入退回来源对象 identity。TTL 为真实时间期限,普通 reload 在期限内可返回 fromCache=true,过期或 force 重新请求。force 取代旧普通请求,同次进行中的强制请求可被后继消费者共享。
请求、字典与通用控制的公开协议 ​
AsamRequestConfig 必需 url/string,可选 method/get/post/put/delete、params/AsamRecord 和 data/unknown,公开字段只读,缺省 method 为 get。类型不表达非空 URL 或 GET 不带 data 的规则;来源在 IO 前验证这些规则以及 params 的实际形状。data 为 unknown,宿主仍需可靠收窄;URL 管线发送浅复制配置并保持原 params/data 和 context,不伪造业务 payload。
请求、字典与通用控制的公开协议 ​
AsamDataError 必需 kind/config-request-response-transform-upload、message/string、cause/unknown 和 notified/boolean,requestId/number 可选;所有已声明字段只读。cause 保留原原因,读取前需收窄。当前 runtime 对有效 context 的同一错误去重、按宿主通知责任更新 notified,并提供真实 requestId 和冻结的报告;过期或外来 context 不触发新通知。此结构类型不执行错误阶段验证,也不意味着原 cause 对象被深冻结,upload kind 的存在不代替上传功能验证。
请求、字典与通用控制的公开协议 ​
AsamDictionaryProvider.get(dictType: string, context) 必需返回 Promise<readonly AsamDictEntry[]>;refresh 可选,若提供则为 (context) => Promise<void>。get/refresh 是方法成员,其类型不声明方法引用只读。字典来源验证非空 dictType,保留原类型键与 context,使用固定 label/value 字段和严格值转换。普通读取可不具备 refresh;force 在缺少 refresh 时返回配置错误,同次刷新、失败交付、恢复与取消由选项状态分段完整验证。
继承能力
本入口的独有 API 见上表,基础能力见本站对应页面。
关联组件
参数与事件补充说明
参数与事件说明
modelValue
必填:是;声明来源:ASAM 声明。
fields
必填:否;声明来源:ASAM 声明。
schema
必填:否;声明来源:ASAM 声明。
registry
必填:否;声明来源:ASAM 声明。
inline
必填:否;声明来源:ASAM 声明。
inline 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
true(源码表达式;ASAM 声明)labelWidth
必填:否;声明来源:ASAM 声明。
默认值与来源
'auto'(源码表达式;ASAM 声明)showSearch
必填:否;声明来源:ASAM 声明。
showSearch 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
true(源码表达式;ASAM 声明)showReset
必填:否;声明来源:ASAM 声明。
showReset 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
true(源码表达式;ASAM 声明)searchText
必填:否;声明来源:ASAM 声明。
默认值与来源
'搜 索'(源码表达式;ASAM 声明)resetText
必填:否;声明来源:ASAM 声明。
默认值与来源
'重置'(源码表达式;ASAM 声明)labelMode
必填:否;声明来源:ASAM 声明。
labelMode 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"visible" / "sr-only"
默认值与来源
'visible'(源码表达式;ASAM 声明)disabled
必填:否;声明来源:上游声明。
disabled 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:false(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
size
必填:否;声明来源:ASAM 声明。
size 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"large" / "big" / "default" / "small"
scrollIntoViewOptions
必填:否;声明来源:上游声明。
scrollIntoViewOptions 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
scrollIntoViewOptions.block:ScrollLogicalPosition | undefined— 依赖声明枚举:
"start"/"center"/"end"/"nearest"scrollIntoViewOptions.inline:ScrollLogicalPosition | undefined— 依赖声明枚举:
"start"/"center"/"end"/"nearest"scrollIntoViewOptions.behavior:ScrollBehavior | undefined— 依赖声明枚举:
"auto"/"smooth"/"instant"
默认值与来源
true(源码表达式;ASAM 声明)固定上游文档默认:true(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:true(2.14.7;源码事实,未作为 ASAM 运行实测)
rules
必填:否;声明来源:上游声明。
默认值与来源
未知 / 未声明固定上游文档默认:未声明(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码未声明 default(2.14.7;源码事实,未作为 ASAM 运行实测)
labelPosition
必填:否;声明来源:上游声明。
labelPosition 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"top" / "right" / "left"
默认值与来源
未知 / 未声明固定上游文档默认:right(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:'right'(2.14.7;源码事实,未作为 ASAM 运行实测)
requireAsteriskPosition
必填:否;声明来源:上游声明。
requireAsteriskPosition 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"right" / "left"
默认值与来源
未知 / 未声明固定上游文档默认:left(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:'left'(2.14.7;源码事实,未作为 ASAM 运行实测)
labelSuffix
必填:否;声明来源:上游声明。
默认值与来源
未知 / 未声明固定上游文档默认:''(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:''(2.14.7;源码事实,未作为 ASAM 运行实测)
inlineMessage
必填:否;声明来源:上游声明。
inlineMessage 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:false(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
statusIcon
必填:否;声明来源:上游声明。
statusIcon 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:false(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
showMessage
必填:否;声明来源:上游声明。
showMessage 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:true(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:true(2.14.7;源码事实,未作为 ASAM 运行实测)
validateOnRuleChange
必填:否;声明来源:上游声明。
validateOnRuleChange 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:true(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
固定上游源码默认表达式:true(2.14.7;源码事实,未作为 ASAM 运行实测)
hideRequiredAsterisk
必填:否;声明来源:上游声明。
hideRequiredAsterisk 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:false(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
scrollToError
必填:否;声明来源:上游声明。
scrollToError 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
默认值与来源
false(隐式 Boolean 默认;已安装组件)固定上游文档默认:false(2.14.7;文档事实,实际默认以 ASAM 源码 / 安装包为准)
AsamFormProps 公开类型视图
import type { AsamFormProps, AsamFormModel, AsamFormField, AsamFormSchemaEntry, AsamFormActionsProps, AsamFormSectionProps, AsamFormLabelMode, AsamControlSize } from '@asam-ui/ui';
type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;
// AsamFormProps
type PublicContract<M extends object = AsamFormModel> = {
"modelValue": M;
"fields"?: readonly AsamFormField[] | undefined;
"schema"?: readonly AsamFormSchemaEntry<M>[] | undefined;
"registry"?: object | undefined;
"inline"?: boolean | undefined;
"labelWidth"?: string | number | undefined;
"showSearch"?: boolean | undefined;
"showReset"?: boolean | undefined;
"searchText"?: string | undefined;
"resetText"?: string | undefined;
"labelMode"?: AsamFormLabelMode | undefined;
"disabled"?: boolean | undefined;
"size"?: AsamControlSize | undefined;
"scrollIntoViewOptions"?: boolean | ScrollIntoViewOptions | undefined;
"rules"?: (AsamFormProps<M>)["rules"];
"labelPosition"?: "top" | "right" | "left" | undefined;
"requireAsteriskPosition"?: "right" | "left" | undefined;
"labelSuffix"?: string | undefined;
"inlineMessage"?: boolean | undefined;
"statusIcon"?: boolean | undefined;
"showMessage"?: boolean | undefined;
"validateOnRuleChange"?: boolean | undefined;
"hideRequiredAsterisk"?: boolean | undefined;
"scrollToError"?: boolean | undefined;
};
参数与事件说明
validate
必填:是;声明来源:ASAM 声明。
update:modelValue
必填:是;声明来源:ASAM 声明。
search
必填:是;声明来源:ASAM 声明。
reset
必填:是;声明来源:ASAM 声明。
AsamFormEmits 公开类型视图
import type { AsamFormEmits, AsamFormModel } from '@asam-ui/ui';
// AsamFormEmits
type PublicContract<M extends object = AsamFormModel> = {
"validate": (AsamFormEmits<M>)["validate"];
"update:modelValue": [model: M];
"search": [model: M];
"reset": [model: M];
};
参数与事件说明
default
必填:否;声明来源:ASAM 声明。
default 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(): unknown
actions
必填:否;声明来源:ASAM 声明。
actions 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(scope: { search: () => void; reset: () => void; }): unknown
append
必填:否;声明来源:ASAM 声明。
append 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(): unknown
AsamFormSlots 公开类型视图
import type { AsamFormSlots, AsamFormModel } from '@asam-ui/ui';
// AsamFormSlots
type PublicContract<M extends object = AsamFormModel> = {
"default"?: (() => unknown) | undefined;
"actions"?: ((scope: { search: () => void; reset: () => void; }) => unknown) | undefined;
"append"?: (() => unknown) | undefined;
};
参数与事件说明
validate
必填:是;声明来源:ASAM 声明。
validate 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(callback?: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["validate"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(AsamFormExpose<M>)["validate"]>, (...args: never[]) => unknown>>
clearValidate
必填:是;声明来源:ASAM 声明。
clearValidate 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(props?: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["clearValidate"]>, (...args: never[]) => unknown>>[0]): void
resetFields
必填:是;声明来源:ASAM 声明。
resetFields 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(props?: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["resetFields"]>, (...args: never[]) => unknown>>[0]): void
setFieldsValue
必填:是;声明来源:ASAM 声明。
setFieldsValue 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(patch: Partial<M>): void
validateField
必填:是;声明来源:上游声明。
validateField 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(props?: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["validateField"]>, (...args: never[]) => unknown>>[0], callback?: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["validateField"]>, (...args: never[]) => unknown>>[1]): ReturnType<Extract<NonNullable<(AsamFormExpose<M>)["validateField"]>, (...args: never[]) => unknown>>
scrollToField
必填:是;声明来源:上游声明。
scrollToField 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(prop: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["scrollToField"]>, (...args: never[]) => unknown>>[0]): void
getField
必填:是;声明来源:上游声明。
getField 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(prop: Parameters<Extract<NonNullable<(AsamFormExpose<M>)["getField"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(AsamFormExpose<M>)["getField"]>, (...args: never[]) => unknown>>
fields
必填:是;声明来源:上游声明。
fields 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
嵌套展开边界:框架 / 平台类型;完整类型见公开类型视图。
setInitialValues
必填:是;声明来源:上游声明。
setInitialValues 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(initModel: Record<string, any>): void
AsamFormExpose 公开类型视图
import type { AsamFormExpose, AsamFormModel } from '@asam-ui/ui';
// AsamFormExpose
type PublicContract<M extends object = AsamFormModel> = {
"validate": (AsamFormExpose<M>)["validate"];
"clearValidate": (AsamFormExpose<M>)["clearValidate"];
"resetFields": (AsamFormExpose<M>)["resetFields"];
"setFieldsValue": (patch: Partial<M>) => void;
"validateField": (AsamFormExpose<M>)["validateField"];
"scrollToField": (AsamFormExpose<M>)["scrollToField"];
"getField": (AsamFormExpose<M>)["getField"];
"fields": (AsamFormExpose<M>)["fields"];
"setInitialValues": (initModel: Record<string, any>) => void;
};
组合契约按分支生效;请同时查看公开类型。
参数与事件说明
field
必填:是;声明来源:ASAM 声明。
component
必填:是;声明来源:ASAM 声明。
label
必填:否;声明来源:ASAM 声明。
required
必填:否;声明来源:ASAM 声明。
required 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
rules
必填:否;声明来源:ASAM 声明。
defaultValue
必填:否;声明来源:ASAM 声明。
defaultValue 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(): M[K]
dependsOn
必填:否;声明来源:ASAM 声明。
hidden
必填:否;声明来源:ASAM 声明。
hidden 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
事件参数:(model: Readonly<M>): boolean
disabled
必填:否;声明来源:ASAM 声明。
disabled 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:false / true
事件参数:(model: Readonly<M>): boolean
onDependencyChange
必填:否;声明来源:ASAM 声明。
onDependencyChange 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"clear" / "retain"
onHide
必填:否;声明来源:ASAM 声明。
onHide 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
枚举:"clear" / "retain"
componentProps
必填:否;声明来源:ASAM 声明。
dataSource
必填:否;声明来源:ASAM 声明。
resolveDataSource
必填:否;声明来源:ASAM 声明。
resolveDataSource 参数与事件数据
下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。
事件参数:(model: Readonly<M>): ReturnType<Extract<NonNullable<(AsamSchemaField<M, R, K, C>)["resolveDataSource"]>, (...args: never[]) => unknown>>
AsamSchemaField 公开类型视图
import type { AsamSchemaField, AsamCompatibleKey, AsamFormSectionProps, AsamFormActionsProps, AsamComponentProps } from '@asam-ui/ui';
// AsamSchemaField
type PublicContract<M, R, K extends keyof M & string, C extends AsamCompatibleKey<M, R, K>> = AsamSchemaField<M, R, K, C>;