fix: 优化中药开方功能

apps/web-antd/src/layouts/basic.vue

@@ -4,9 +4,11 @@ import type { NotificationItem } from '@vben/layouts';
 import { computed, ref, watch } from 'vue';
 
 import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
+
 // import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
 import { useWatermark } from '@vben/hooks';
 // import { BookOpenText, CircleHelp, MdiGithub } from '@vben/icons';
+// import { CircleHelp } from '@vben/icons';
 import {
   BasicLayout,
   LockScreen,
@@ -65,6 +67,13 @@ const menus = computed(() => [
   // TODO 后续放个人中心
   // {
   //   handler: () => {
+  //     UpdatePasswordModalApi.open();
+  //   },
+  //   icon: 'carbon:password',
+  //   text: '修改密码',
+  // },
+  // {
+  //   handler: () => {
   //     openWindow(VBEN_DOC_URL, {
   //       target: '_blank',
   //     });
@@ -158,5 +167,6 @@ watch(
     <template #lock-screen>
       <LockScreen :avatar @to-login="handleLogout" />
     </template>
+    <UpdatePasswordModals />
   </BasicLayout>
 </template>

apps/web-antd/src/layouts/components/UpdatePasswordModal.vue

@@ -0,0 +1,53 @@
+<script lang="ts" setup>
+import {Page, useVbenModal} from '@vben/common-ui';
+
+import {message} from 'ant-design-vue';
+
+import {passwordModalForm} from '#/layouts/config/form.ts'
+import {useVbenForm} from "#/adapter/form";
+import {updatePassword} from "#/views/system/admin/api";
+
+const [Form, formApi] = useVbenForm(passwordModalForm);
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    formApi.validate().then(async (e: any) => {
+      if (e.valid) {
+        const values = await formApi.getValues();
+        modalApi.setState({loading: true, confirmLoading: true});
+        updatePassword(values).then(() => {
+          modalApi.close();
+          message.success('修改成功，请重新登录');
+        })
+          .finally(() => {
+            modalApi.setState({loading: false, confirmLoading: false});
+          });
+      }
+    });
+    await formApi.validateAndSubmitForm();
+  },
+  onOpenChange(isOpen: boolean) {
+    console.log(isOpen, '开启状态');
+    // if (isOpen) {
+    //   const {values} =
+    //     modalApi.getData<Record<string, any>>();
+    //   if (values) {
+    //   }
+    // }
+  },
+});
+</script>
+
+<template>
+  <!--  <Modal class="w-[60%]" title="西（中成）药列表">-->
+  <Modal class="w-[60%]" title="修改密码">
+    <Page>
+      <Form/>
+    </Page>
+  </Modal>
+</template>
+<style lang="scss"></style>

apps/web-antd/src/layouts/config/form.ts

@@ -0,0 +1,105 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+import { z } from '#/adapter/form';
+
+const defaultPassword = '';
+
+export const passwordModalForm: VbenFormProps = {
+  wrapperClass: 'grid-cols-12', // 24栅格,
+  commonConfig: {
+    formItemClass: 'col-span-12',
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  // handleSubmit: onSubmit,
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'password',
+      label: '旧的密码',
+      component: 'InputPassword',
+      help: '5-18位数字、字母、特殊字符组成。',
+      componentProps: {
+        placeholder: '请输入密码',
+        allowClear: true,
+      },
+      defaultValue: defaultPassword,
+      rules: z
+        .string()
+        .regex(
+          /^(?=.*[A-Z0-9])(?=.*[!@#$%^&*])[A-Z0-9!@#$%^&*]{5,18}$/i,
+          '密码由5-18位数字、字母、特殊字符组成。',
+        ),
+      dependencies: {
+        if({ id }) {
+          return !id;
+        },
+        triggerFields: ['id'],
+      },
+      // formItemClass: 'col-span-6',
+    },
+    {
+      fieldName: 'new_password',
+      label: '新的密码',
+      component: 'InputPassword',
+      help: '5-18位数字、字母、特殊字符组成。',
+      componentProps: {
+        placeholder: '请输入密码',
+        allowClear: true,
+      },
+      defaultValue: defaultPassword,
+      rules: z
+        .string()
+        .regex(
+          /^(?=.*[A-Z0-9])(?=.*[!@#$%^&*])[A-Z0-9!@#$%^&*]{5,18}$/i,
+          '密码由5-18位数字、字母、特殊字符组成。',
+        ),
+      dependencies: {
+        if({ id }) {
+          return !id;
+        },
+        triggerFields: ['id'],
+      },
+      // formItemClass: 'col-span-6',
+    },
+    {
+      fieldName: 'new_password_confirmation',
+      label: '确认密码',
+      component: 'InputPassword',
+      componentProps: {
+        placeholder: '请输入确认密码',
+        allowClear: true,
+      },
+      defaultValue: defaultPassword,
+      rules: z
+        .string()
+        .regex(/[\w!@#$%^&*]{5,18}/, '密码由5-18位数字、字母、特殊字符组成。'),
+      dependencies: {
+        if({ id }) {
+          return !id;
+        },
+        triggerFields: ['id', 'confirmPassword'],
+        rules: (values) => {
+          return z
+            .string()
+            .regex(
+              /[\w!@#$%^&*]{5,18}/,
+              '密码由5-18位数字、字母、特殊字符组成。',
+            )
+            .refine(
+              (confirmPassword) => {
+                return confirmPassword === values.new_password;
+              },
+              {
+                message: '确认密码必须与密码一致',
+              },
+            );
+        },
+      },
+      // formItemClass: 'col-span-6',
+    },
+  ],
+  showDefaultActions: false,
+};