<template>
  <div class="bg-[#fff] py-8">
    <BasicForm @register="registerForm" @submit="handleSubmit" />
  </div>
</template>

<script setup lang="ts">
  import { BasicForm, useForm } from '/@/components/Form/index';

  import { formSchema } from '../Files/GZjcyb.data';
  import { view, saveOrUpdate } from '../Files/GZjcyb.api';
  import { encryptData } from '/@/api/common/api';
  import { decrypts } from '@/utils/checkTip';

  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
    rowProps: { gutter: 24, justify: 'start', align: 'middle' },
    //全局col列占比(每列显示多少位)，和schemas中的colProps属性一致
    baseColProps: { span: 12 },
    //使用labelCol的样式参数来控制标题宽度
    labelCol: { style: { width: '150px' } },
    //row行的样式
    baseRowStyle: { width: '100%' },
    //表单布局属性，支持（vertical,horizontal），默认为horizontal
    layout: 'horizontal',
    schemas: formSchema,
    showResetButton: false,
    submitButtonOptions: { text: '确认', preIcon: '' },
    actionColOptions: { span: 17 },
  });

  //表单赋值
  async function init() {
    const records = await view({});
    if (records.sfzh) records.sfzh = await decrypts(records.sfzh, false);
    if (records.lxdh) records.lxdh = await decrypts(records.lxdh, false);
    if (records.yhzh) records.yhzh = await decrypts(records.yhzh, false);
    //重置表单
    await resetFields();
    //表单赋值
    await setFieldsValue({
      ...records,
    });
  }
  init();

  //   提交
  async function handleSubmit() {
    try {
      let values = await validate();
      values.sfzh = await encryptData({ str: values.sfzh });
      values.lxdh = await encryptData({ str: values.lxdh });
      values.yhzh = await encryptData({ str: values.yhzh });
      //提交表单
      await saveOrUpdate(values, true);
      //刷新列表
      init();
    } finally {
    }
  }
</script>
<style lang="less" scoped>
  :deep(.ant-input-number) {
    width: 100%;
  }
</style>
