feat: 个人中心

apps/web-antd/src/views/property/personalCenter/leaveApplication/index.vue

@@ -12,6 +12,7 @@ import { useVbenForm } from '#/adapter/form';
 import {  useVbenModal} from '@vben/common-ui';
 import {modalSchema} from "./data";
 import { useVModel } from '@vueuse/core';
+import { Button, message } from 'ant-design-vue';
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -25,8 +26,30 @@ const [BasicForm, formApi] = useVbenForm({
   },
   schema: modalSchema(),
   showDefaultActions: false,
-  wrapperClass: 'grid-cols-2 gap-x-10 gap-y-2',
+  wrapperClass: 'grid-cols-2',
 });
+
+// 提交处理函数
+async function handleSubmit() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      message.error('请完善表单信息');
+      return;
+    }
+    
+    const formData = await formApi.getValues();
+    formData.startTime = dayjs(formData.startTime).format('YYYY-MM-DD HH:mm:ss');
+    formData.endTime = dayjs(formData.endTime).format('YYYY-MM-DD HH:mm:ss');
+
+    console.log('提交数据:', formData);
+    // await leaveApplicationAdd(formData);
+    
+    message.success('提交成功');
+    await formApi.resetForm();
+}
+async function cleanForm () {
+  await formApi.resetForm();
+}
 </script>
 
 <template>
@@ -34,6 +57,23 @@ const [BasicForm, formApi] = useVbenForm({
     <div class="text-2xl font-bold">请假申请</div>
     <div class="m-6 bg-white p-4">
         <BasicForm/>
+        <div class="flex justify-center mt-6 gap-2">
+          <Button type="primary" @click="handleSubmit">提交申请</Button>
+          <Button  @click="cleanForm">重置</Button>
+        </div>
     </div>
   </div>
 </template>
+<style scoped>
+/* 使用 :deep() 穿透 scoped 样式，影响子组件 */
+:deep(.ant-input[disabled]),
+:deep(.ant-input-number-disabled .ant-input-number-input),
+:deep(.ant-select-disabled .ant-select-selection-item),
+:deep(.ant-picker-disabled .ant-picker-input > input) {
+  /* 设置一个更深的颜色 */
+  color: rgb(0 0 0 / 65%) !important;
+
+  /* 有些浏览器需要这个来覆盖默认颜色 */
+  -webkit-text-fill-color: rgb(0 0 0 / 65%) !important;
+}
+</style>