用element-plus框架插入订单提交表单生成vue3格式 script setup代码要求所有方法或箭头函数都用function定义要求所有变量为ref响应式无需任何文字说明只要源码即可

<script setup>
import { ref } from 'vue';
import { ElForm, ElFormItem, ElInput, ElButton } from 'element-plus';

const form = ref(null);
const name = ref('');
const phone = ref('');
const address = ref('');

function handleSubmit() {
  form.value.validate((valid) => {
    if (valid) {
      console.log('submit success');
    } else {
      console.log('submit fail');
      return false;
    }
  });
}

return () => (
  <ElForm ref={form} label-position="left" label-width="80px">
    <ElFormItem label="Name" prop="name">
      <ElInput v-model={name} placeholder="Please enter your name" />
    </ElFormItem>
    <ElFormItem label="Phone" prop="phone">
      <ElInput v-model={phone} placeholder="Please enter your phone number" />
    </ElFormItem>
    <ElFormItem label="Address" prop="address">
      <ElInput v-model={address} placeholder="Please enter your address" />
    </ElFormItem>
    <ElFormItem>
      <ElButton type="primary" onClick={handleSubmit}>Submit</ElButton>
    </ElFormItem>
  </ElForm>
);
</script>