<script setup lang="ts">
import XForm from '@af-mobile-client-vue3/components/data/XForm/index.vue'
import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
import { ref } from 'vue'
import {
  Button as VanButton,
} from 'vant'

const configName = ref('测试Form')
const serviceName = ref('af-safecheck')
const formGroupAddConstruction = ref()

// 提交测试
function onSubmit(form) {
  console.log('事件触发提交表单----', form)
}
async function onAsyncSubmit() {
  const res = await formGroupAddConstruction.value.asyncSubmit()
  console.log('异步提交表单----', res)
}
function emitFunc(func, data) {
  console.log('emitFunc:', func, data)
}
</script>

<template>
  <NormalDataLayout id="XFormGroupView" title="纯表单">
    <template #layout_content>
      <XForm
        ref="formGroupAddConstruction"
        mode="修改"
        :config-name="configName"
        :show-tab-header="false"
        service-name="af-safecheck"
        :is-group-form="true"
        @on-submit="onSubmit"
        @x-form-item-emit-func="emitFunc"
      />
    </template>
  </NormalDataLayout>
  <van-button type="primary" @click="onAsyncSubmit">提交1</van-button>
</template>

<style scoped lang="less">

</style>
