src/constants/reg.ts

@@ -7,9 +7,9 @@ export const REG_PHONE =
 /**
  * Password reg
  *
- * 6-18 characters, including letters, numbers, and underscores
+ * 6-18 characters, including letters, numbers, and special characters
  */
-export const REG_PWD = /^[\w@!#&*]{6,18}$/;
+export const REG_PWD = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#$%^&*()_+])[A-Za-z\d!@#$%^&*()_+]{6,18}$/;
 
 /** Email reg */
 export const REG_EMAIL = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;

src/hooks/common/table.ts

@@ -109,6 +109,7 @@ export function useTable<A extends AntDesign.TableApiFn>(config: AntDesign.AntDe
     showSizeChanger: true,
     pageSizeOptions: ['10', '15', '20', '25', '30'],
     total: 0,
+    showTotal:total => `共 ${total} 条`,
     onChange: async (current: number, size: number) => {
       pagination.pageIndex = current
       pagination.pageSize = size

src/locales/langs/en-us.ts

@@ -440,7 +440,7 @@ const local: App.I18n.Schema = {
     },
     pwd: {
       required: 'Please enter password',
-      invalid: '6-18 characters, including letters, numbers, and underscores'
+      invalid: '6-18 characters, including letters, numbers, and special characters'
     },
     confirmPwd: {
       required: 'Please enter password again',

src/locales/langs/zh-cn.ts

@@ -449,7 +449,7 @@ const local: App.I18n.Schema = {
     },
     pwd: {
       required: '请输入密码',
-      invalid: '密码格式不正确，6-18位字符，包含字母、数字、下划线'
+      invalid: '密码格式不正确，6-18位字符，包含字母、数字、特殊字符'
     },
     confirmPwd: {
       required: '请输入确认密码',

src/views/_builtin/login/modules/pwd-login.vue

@@ -60,13 +60,14 @@ async function handleSubmit() {
 <template>
   <AForm ref="formRef" :model="model" :rules="rules">
     <AFormItem name="userName">
-      <AInput v-model:value="model.userName" size="large" :placeholder="$t('page.login.common.userNamePlaceholder')" />
+      <AInput v-model:value="model.userName" size="large" :placeholder="$t('page.login.common.userNamePlaceholder')" allowClear/>
     </AFormItem>
     <AFormItem name="password">
       <AInputPassword
         v-model:value="model.password"
         size="large"
         :placeholder="$t('page.login.common.passwordPlaceholder')"
+        allowClear
       />
     </AFormItem>
     <ARow :gutter="[16,16]" wrap>
@@ -76,6 +77,7 @@ async function handleSubmit() {
         v-model:value="model.code"
         size="large"
         :placeholder="$t('page.login.common.codePlaceholder')"
+        allowClear
       />
     </AFormItem>
       </ACol>

src/views/manage/menu/index.vue

@@ -1,14 +1,14 @@
 <script setup lang="tsx">
+import SvgIcon from '@/components/custom/svg-icon.vue';
 import { useTable, useTableOperate, useTableScroll } from '@/hooks/common/table';
 import { $t } from '@/locales';
 import { fetchDeleteMenu, fetchGetAllPages, fetchGetMenuList, getDicts } from '@/service/api';
 import { useBoolean } from '@sa/hooks';
 import { Button, Popconfirm } from 'ant-design-vue';
 import type { Ref } from 'vue';
-import { ref, onMounted } from 'vue';
+import { onMounted, ref } from 'vue';
 import MenuOperateModal, { type OperateType } from './modules/menu-operate-modal.vue';
-import SvgIcon from '@/components/custom/svg-icon.vue';
-import MenuSearch from './modules/menu-search.vue'
+import MenuSearch from './modules/menu-search.vue';
 const { bool: visible, setTrue: openModal } = useBoolean();
 const { tableWrapperRef, scrollConfig } = useTableScroll();
 const visibleOptions = ref([])

src/views/manage/menu/modules/menu-operate-modal.vue

@@ -1,12 +1,12 @@
 <script setup lang="tsx">
-import { computed, nextTick, reactive, ref, watch } from 'vue';
-import { SimpleScrollbar } from '@sa/materials';
+import SvgIcon from '@/components/custom/svg-icon.vue';
+import { menuTypeOptions } from '@/constants/business';
 import { useAntdForm, useFormRules } from '@/hooks/common/form';
 import { $t } from '@/locales';
-import { menuTypeOptions } from '@/constants/business';
-import SvgIcon from '@/components/custom/svg-icon.vue';
+import { fetchAddMenu, fetchGetMenuDetail, fetchGetMenuList, fetchGetSysApiList, fetchUpdateMenu } from '@/service/api';
 import { getLocalIcons } from '@/utils/icon';
-import { fetchGetMenuList, fetchAddMenu, fetchGetSysApiList, fetchGetMenuDetail, fetchUpdateMenu} from '@/service/api';
+import { SimpleScrollbar } from '@sa/materials';
+import { computed, nextTick, reactive, ref, watch } from 'vue';
 // import {
 //   getLayoutAndPage,
 //   getPathParamFromRoutePath,
@@ -16,7 +16,7 @@ import { fetchGetMenuList, fetchAddMenu, fetchGetSysApiList, fetchGetMenuDetail,
 // } from './shared';
 
 import {
-  QuestionCircleFilled,
+QuestionCircleFilled
 } from '@ant-design/icons-vue';
 defineOptions({
   name: 'MenuOperateModal'
@@ -300,8 +300,8 @@ watch(visible, () => {
   <AModal v-model:open="visible" :title="title"  width="800px">
     <div class="h-480px">
       <SimpleScrollbar>
-        <AForm ref="formRef" layout="vertical" :model="model" :rules="rules" :label-col="{ lg: 8, xs: 4 }" label-wrap class="pr-20px" :labelAlign="'left'">
-          <ARow :gutter="[16,16]" wrap>
+        <AForm ref="formRef"  :model="model" :rules="rules" :label-col="{ lg: 8, xs: 4 }" label-wrap class="pr-20px">
+          <ARow wrap>
             <ACol :lg="12" :xs="24">
               <AFormItem label="上级菜单" name="parentId">
                 <ATreeSelect v-model:value="model.parentId" show-search  :tree-data="menuOptions"
@@ -314,12 +314,12 @@ watch(visible, () => {
                 <template #label>
                   <span class="marginRight5">{{$t('page.manage.menu.menuName')}}</span>
                   <ATooltip>
-                    <template #title>包含目录：以及菜单或者菜单组，菜单：具体对应某一个页面，按钮：功能才做按钮.</template>
+                    <template #title>菜单位置显示的说明信息.</template>
                     <QuestionCircleFilled />
                   </ATooltip>
                 </template>
 
-                <AInput v-model:value="model.title" :placeholder="$t('page.manage.menu.form.menuName')" />
+                <AInput v-model:value="model.title" :placeholder="$t('page.manage.menu.form.menuName')" allowClear/>
               </AFormItem>
             </ACol>
             <ACol :lg="12" :xs="24">
@@ -331,7 +331,7 @@ watch(visible, () => {
                     <QuestionCircleFilled />
                   </ATooltip>
                 </template>
-                <AInputNumber v-model:value="model.sort as number"  :placeholder="$t('page.manage.menu.form.order')"  class="w-full"/>
+                <AInputNumber v-model:value="model.sort as number"  :placeholder="$t('page.manage.menu.form.order')"  class="w-full" />
 
               </AFormItem>
             </ACol>
@@ -361,7 +361,7 @@ watch(visible, () => {
                     <QuestionCircleFilled />
                   </ATooltip>
                 </template>
-                <AInput v-model:value="model.menuName" :placeholder="$t('page.manage.menu.form.routeName')" />
+                <AInput v-model:value="model.menuName" :placeholder="$t('page.manage.menu.form.routeName')" allowClear/>
               </AFormItem>
             </ACol>
             <ACol :lg="12" :xs="24" v-if="model.menuType == 'M' || model.menuType == 'C'" >
@@ -369,25 +369,26 @@ watch(visible, () => {
                 <template #label>
                   <span class="marginRight5">{{ $t('page.manage.menu.routePath') }}</span>
                   <ATooltip>
-                    <template #title>菜单对应的具体vue页面文件路径views的下级路径/admin/sys-api/index；目录类型：填写Layout，如何有二级目录请参照日志目录填写；</template>
+                    <template #title>菜单对应的具体vue页面文件路径；</template>
                     <QuestionCircleFilled />
                   </ATooltip>
                 </template>
-                <AInput v-model:value="model.component"  :placeholder="$t('page.manage.menu.form.routePath')" />
+                <AInput v-model:value="model.component"  :placeholder="$t('page.manage.menu.form.routePath')" allowClear/>
               </AFormItem>
             </ACol>
 
             <ACol :lg="12" :xs="24"  v-if="model.menuType != 'F'">
               <AFormItem label="路由地址" name="path">
-                <AInput v-model:value="model.path" placeholder="请输入路由地址" />
+                <AInput v-model:value="model.path" placeholder="请输入路由地址" allowClear/>
               </AFormItem>
             </ACol>
-            <ACol :lg="12" :xs="24">
-              <AFormItem v-if="showLayout" :label="$t('page.manage.menu.layout')" name="layout">
+            <ACol :lg="12" :xs="24"  v-if="showLayout">
+              <AFormItem :label="$t('page.manage.menu.layout')" name="layout">
                 <ASelect
                   v-model:value="model.layout"
                   :options="layoutOptions"
                   :placeholder="$t('page.manage.menu.form.layout')"
+                  allowClear
                 />
               </AFormItem>
             </ACol>
@@ -420,11 +421,19 @@ watch(visible, () => {
                     v-model:value="model.icon"
                     :placeholder="$t('page.manage.menu.form.localIcon')"
                     :options="localIconOptions"
+                    allowClear
                   />
               </AFormItem>
             </ACol>
             <ACol :lg="12" :xs="24">
-              <AFormItem :label="$t('page.manage.menu.menuStatus')" name="visible">
+              <AFormItem name="visible">
+                <template #label>
+                  <span class="marginRight5">{{$t('page.manage.menu.menuStatus') }}</span>
+                  <ATooltip>
+                    <template #title>需要显示在菜单列表的菜单设置为显示，否则设置为隐藏；</template>
+                    <QuestionCircleFilled />
+                  </ATooltip>
+                </template>
                 <ARadioGroup v-model:value="model.visible">
                   <ARadio v-for="item in visibleOptions" :key="item.value" :value="item.value">
                     {{ item.label }}

src/views/manage/menu/modules/menu-search.vue

@@ -1,7 +1,5 @@
 /* eslint-disable */
-<script setup lang="ts">
-import { reactive, ref, watch } from 'vue';
-defineOptions({
+<script setup lang="ts">defineOptions({
   name: 'MenuSearch'
 });
 interface Option {
@@ -31,24 +29,30 @@ function search() {
 
 <template>
   <ACard :title="$t('common.search')" :bordered="false" class="card-wrapper">
-    <AForm :model="model" :label-width="80">
+    <AForm
+      :model="model"
+      :label-col="{
+        span: 5,
+        md: 7
+      }"
+    >
       <ARow :gutter="[16, 16]" wrap>
-        <ACol :span="24" :md="12" :lg="8">
+        <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.menu.menuName')" name="title" class="m-0">
-            <AInput v-model:value.trim="model.title" :placeholder="$t('page.manage.menu.form.menuName')" @keyup.enter.native="search"/>
+            <AInput v-model:value.trim="model.title" :placeholder="$t('page.manage.menu.form.menuName')" @keyup.enter.native="search" allowClear/>
           </AFormItem>
         </ACol>
 
-        <ACol :span="24" :md="12" :lg="8">
+        <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.menu.menuStatus')" name="visible" class="m-0">
-            <ASelect v-model:value="model.visible"  allow-clear @change="search">
+            <ASelect v-model:value="model.visible"  allowClear @change="search">
               <ASelectOption v-for="option in visibleOptions" :key="option.value" :value="option.value" >
                 {{ option.label }}
               </ASelectOption>
             </ASelect>
           </AFormItem>
         </ACol>
-        <ACol :span="24" :md="12" :lg="8">
+        <ACol :span="24" :md="12" :lg="6">
           <AFormItem class="m-0">
             <div class="w-full flex-y-center justify-end gap-12px">
               <AButton @click="reset">

src/views/manage/role/index.vue

@@ -87,7 +87,7 @@ const {
       key: 'operate',
       title: $t('common.operate'),
       align: 'center',
-      width: 130,
+      width: 200,
       customRender: ({ record }) => (
         <div class="flex-center gap-8px">
           <Button type="primary" ghost size="small" onClick={() => handleRowEdit(record.roleId)}>

src/views/manage/role/modules/role-modifypermis-modal.vue

@@ -1,9 +1,9 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { ref, reactive, watch } from 'vue';
-import { $t } from '@/locales';
 import { useAntdForm, useFormRules } from '@/hooks/common/form';
-import { fetchModifyRolePersion, fetchDeptTreeByRole}  from '@/service/api';
+import { $t } from '@/locales';
+import { fetchDeptTreeByRole, fetchModifyRolePersion } from '@/service/api';
+import { reactive, ref, watch } from 'vue';
 defineOptions({
   name: 'RoleModifyPermisModal'
 });
@@ -104,20 +104,20 @@ watch(visible, () => {
   <AModal v-model:open="visible" title="分配数据权限" width="420px">
     <AForm ref="formRef" layout="vertical" :model="model" :rules="rules">
       <AFormItem :label="$t('page.manage.role.roleName')" name="roleName">
-        <AInput v-model:value="model.roleName" :placeholder="$t('page.manage.role.form.roleName')" :disabled="true" />
+        <AInput v-model:value="model.roleName" :placeholder="$t('page.manage.role.form.roleName')" :disabled="true" allowClear/>
       </AFormItem>
       <AFormItem :label="$t('page.manage.role.roleKey')" name="roleKey" >
-        <AInput v-model:value.trim="model.roleKey" :placeholder="$t('page.manage.role.form.roleKey')" :disabled="true" />
+        <AInput v-model:value.trim="model.roleKey" :placeholder="$t('page.manage.role.form.roleKey')" :disabled="true" allowClear/>
       </AFormItem>
       <AFormItem label="权限范围" name="dataScope" >
-        <ASelect v-model:value="model.dataScope"   :placeholder="$t('page.manage.role.form.roleStatus')" allow-clear @change="handelChange">
+        <ASelect v-model:value="model.dataScope"   :placeholder="$t('page.manage.role.form.roleStatus')" allowClear @change="handelChange">
           <ASelectOption v-for="option in dataScopeOptions" :key="option.value" :value="option.value" >
             {{ option.label }}
           </ASelectOption>
         </ASelect>
       </AFormItem>
       <AFormItem label="数据权限" name="dataScope" v-if="model.dataScope === '2'">
-        <ATree v-model:checkedKeys="model.deptIds" :field-names="{children:'children', title:'label', key:'id' }" :tree-data="treeData"
+        <ATree v-model:checkedKeys="model.deptIds" :field-names="{children:'children', title:'label', key:'id' }" :tree-data="treeData" allowClear
         checkable/>
       </AFormItem>
     </AForm>

src/views/manage/role/modules/role-operate-drawer.vue

@@ -1,13 +1,13 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { computed, nextTick, reactive, watch, ref } from 'vue';
+import { computed, nextTick, reactive, ref, watch } from 'vue';
 // import { useBoolean } from '@sa/hooks';
+import { enableStatusOptions } from '@/constants/business';
 import { useAntdForm, useFormRules } from '@/hooks/common/form';
 import { $t } from '@/locales';
-import { enableStatusOptions } from '@/constants/business';
 // import MenuAuthModal from './menu-auth-modal.vue';
+import { fetchAddRole, fetchEditRole, fetchGetMenuTree } from '@/service/api';
 import type { DataNode } from 'ant-design-vue/es/tree';
-import { fetchGetMenuTree, fetchAddRole, fetchEditRole } from '@/service/api';
 defineOptions({
   name: 'RoleOperateDrawer'
 });
@@ -142,21 +142,21 @@ watch(visible, () => {
 </script>
 
 <template>
-  <AModal v-model:open="visible" :title="title" width="600px">
-    <AForm ref="formRef" layout="vertical" :model="model" :rules="rules">
-      <ARow :gutter="[16, 16]" wrap>
+  <AModal v-model:open="visible" :title="title" width="800px">
+    <AForm ref="formRef"  :model="model" :rules="rules" :label-col="{ lg: 8, xs: 4 }" label-wrap class="pr-20px">
+      <ARow wrap>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.role.roleName')" name="roleName">
-            <AInput v-model:value="model.roleName" :disabled="isEdit" :placeholder="$t('page.manage.role.form.roleName')" />
+            <AInput v-model:value="model.roleName" :disabled="isEdit" :placeholder="$t('page.manage.role.form.roleName')" allowClear />
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.role.roleKey')" name="roleKey">
-            <AInput v-model:value="model.roleKey" :disabled="isEdit" :placeholder="$t('page.manage.role.form.roleKey')" />
+            <AInput v-model:value="model.roleKey" :disabled="isEdit" :placeholder="$t('page.manage.role.form.roleKey')" allowClear/>
           </AFormItem>
         </ACol>
       </ARow>
-      <ARow :gutter="[16, 16]" wrap>
+      <ARow wrap>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.role.roleSort')" name="roleSort">
             <AInputNumber v-model:value="model.roleSort" :placeholder="$t('page.manage.role.form.roleSort')"  style="width:100%"/>
@@ -172,18 +172,18 @@ watch(visible, () => {
           </AFormItem>
         </ACol>
       </ARow>
-      <ARow :gutter="[16, 16]" wrap >
+      <ARow wrap >
         <ACol :span="24" :md="24" :xs="24">
-          <AFormItem :label="$t('page.manage.user.remark')" name="remark">
-          <a-textarea v-model:value="model.remark" :placeholder="$t('page.manage.user.form.remark')"
+          <AFormItem :label-col="{ lg: 4, xs: 2 }" :label="$t('page.manage.user.remark')" name="remark">
+          <a-textarea v-model:value="model.remark" :placeholder="$t('page.manage.user.form.remark')" allowClear
             :auto-size="{ minRows: 2, maxRows: 5 }" />
         </AFormItem>
         </ACol>
       </ARow>
-      <ARow :gutter="[16, 16]" wrap >
+      <ARow wrap >
         <ACol :span="24" :md="24" :xs="24">
-          <AFormItem :label="$t('page.manage.role.menuAuth')" name="remark">
-          <ATree v-model:checked-keys="model.menuIds" :tree-data="tree" checkable :height="280" class="h-280px" />
+          <AFormItem :label-col="{ lg: 4, xs: 2 }" :label="$t('page.manage.role.menuAuth')" name="remark">
+          <ATree :label-col="{ lg: 4, xs: 2 }" v-model:checked-keys="model.menuIds" :tree-data="tree" checkable :height="280" class="h-280px" allowClear/>
         </AFormItem>
         </ACol>
       </ARow>

src/views/manage/role/modules/role-search.vue

@@ -1,7 +1,7 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { $t } from '@/locales';
 import { enableStatusOptions } from '@/constants/business';
+import { $t } from '@/locales';
 
 defineOptions({
   name: 'RoleSearch'
@@ -27,21 +27,27 @@ function search() {
 
 <template>
   <ACard :title="$t('common.search')" :bordered="false" class="card-wrapper">
-    <AForm :model="model" :label-width="80">
+    <AForm
+      :model="model"
+      :label-col="{
+        span: 5,
+        md: 7
+      }"
+    >
       <ARow :gutter="[16, 16]" wrap>
         <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.role.roleName')" name="roleName" class="m-0">
-            <AInput v-model:value.trim="model.roleName" :placeholder="$t('page.manage.role.form.roleName')" @keyup.enter.native="search"/>
+            <AInput v-model:value.trim="model.roleName" :placeholder="$t('page.manage.role.form.roleName')" @keyup.enter.native="search" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.role.roleKey')" name="roleKey" class="m-0">
-            <AInput v-model:value.trim="model.roleKey" :placeholder="$t('page.manage.role.form.roleKey')" @keyup.enter.native="search"/>
+            <AInput v-model:value.trim="model.roleKey" :placeholder="$t('page.manage.role.form.roleKey')" @keyup.enter.native="search" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.role.roleStatus')" name="status" class="m-0">
-            <ASelect v-model:value="model.status" :placeholder="$t('page.manage.role.form.roleStatus')" allow-clear @change="search">
+            <ASelect v-model:value="model.status" :placeholder="$t('page.manage.role.form.roleStatus')" allowClear @change="search">
               <ASelectOption v-for="option in enableStatusOptions" :key="option.value" :value="option.value" >
                 {{ $t(option.label) }}
               </ASelectOption>

src/views/manage/user/index.vue

@@ -1,13 +1,13 @@
 <script setup lang="tsx">
-import { Button, Popconfirm } from 'ant-design-vue';
-import { fetchGetUserList, fetchDelteUser, changeUserStatus } from '@/service/api';
 import { useTable, useTableOperate, useTableScroll } from '@/hooks/common/table';
 import { $t } from '@/locales';
+import { changeUserStatus, fetchDelteUser, fetchGetUserList } from '@/service/api';
+import { Button, Popconfirm } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { ref } from 'vue';
 import UserOperateDrawer from './modules/user-operate-drawer.vue';
 import UserResetPwdDialog from './modules/user-resetpwd-dialog.vue';
 import UserSearch from './modules/user-search.vue';
-import dayjs from 'dayjs';
-import { ref } from 'vue';
 const { tableWrapperRef, scrollConfig } = useTableScroll();
 const apiParams = ref({
   pageIndex: 1,

src/views/manage/user/modules/user-operate-drawer.vue

@@ -1,9 +1,9 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { computed, nextTick, reactive, ref, watch } from 'vue';
 import { useAntdForm, useFormRules } from '@/hooks/common/form';
-import { fetchGetAllRoles, getDicts, fetchGetPostList, fetchGetdeptTreeList, fetchAddUser } from '@/service/api';
 import { $t } from '@/locales';
+import { fetchAddUser, fetchGetAllRoles, fetchGetdeptTreeList, fetchGetPostList, getDicts } from '@/service/api';
+import { computed, nextTick, reactive, ref, watch } from 'vue';
 defineOptions({
   name: 'UserOperateDrawer'
 });
@@ -159,12 +159,12 @@ watch(visible, () => {
 </script>
 
 <template>
-  <AModal v-model:open="visible" :title="title" width="600px">
-    <AForm ref="formRef" layout="vertical" :model="model" :rules="rules">
-      <ARow :gutter="[16,16]" wrap>
+  <AModal v-model:open="visible" :title="title" width="800px">
+    <AForm ref="formRef"  :model="model" :rules="rules" :label-col="{ lg: 8, xs: 4 }" label-wrap class="pr-20px">
+      <ARow  wrap>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.user.nickName')" name="nickName">
-            <AInput v-model:value="model.nickName" :placeholder="$t('page.manage.user.form.nickName')" />
+            <AInput v-model:value="model.nickName" :placeholder="$t('page.manage.user.form.nickName')" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="12" :xs="24">
@@ -175,27 +175,27 @@ watch(visible, () => {
           </AFormItem>
         </ACol>
       </ARow>
-      <ARow  :gutter="[16,16]" wrap>
+      <ARow wrap>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.user.userPhone')" name="phone">
-            <AInput v-model:value="model.phone" :placeholder="$t('page.manage.user.form.userPhone')" />
+            <AInput v-model:value="model.phone" :placeholder="$t('page.manage.user.form.userPhone')" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.user.userEmail')" name="email">
-            <AInput v-model:value="model.email" :placeholder="$t('page.manage.user.form.userEmail')" />
+            <AInput v-model:value="model.email" :placeholder="$t('page.manage.user.form.userEmail')" allowClear/>
           </AFormItem>
         </ACol>
       </ARow>
-      <ARow  :gutter="[16,16]" wrap>
+      <ARow wrap>
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.user.userName')" name="username">
-            <AInput v-model:value="model.username" :placeholder="$t('page.manage.user.form.userName')" />
+            <AInput v-model:value="model.username" :placeholder="$t('page.manage.user.form.userName')" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="12" :xs="24" v-if="props.operateType === 'add'">
           <AFormItem :label="$t('page.manage.user.password')" name="password" >
-            <AInput v-model:value="model.password" :placeholder="$t('page.manage.user.form.password')" />
+            <AInput v-model:value="model.password" :placeholder="$t('page.manage.user.form.password')" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="12" :xs="24">
@@ -219,20 +219,22 @@ watch(visible, () => {
         <ACol :span="12" :md="12" :xs="24">
           <AFormItem :label="$t('page.manage.user.postId')" name="postId">
             <ASelect v-model:value="model.postId" :options="postOptions"
-              :placeholder="$t('page.manage.user.form.postId')" />
+              :placeholder="$t('page.manage.user.form.postId')" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="12" :md="props.operateType === 'add'? 12: 24" :xs="24">
           <AFormItem :label="$t('page.manage.user.userRole')" name="roleId">
             <ASelect v-model:value="model.roleId"  :options="roleOptions"
-              :placeholder="$t('page.manage.user.form.userRole')" />
+              :placeholder="$t('page.manage.user.form.userRole')" allowClear/>
+          </AFormItem>
+        </ACol>
+        <ACol :span="24" :md="24" :xs="24">
+          <AFormItem :label-col="{ lg: 4, xs: 2 }" :label="$t('page.manage.user.remark')" name="remark">
+            <a-textarea v-model:value="model.remark" :placeholder="$t('page.manage.user.form.remark')"
+              :auto-size="{ minRows: 2, maxRows: 5 }" allowClear/>
           </AFormItem>
         </ACol>
       </ARow>
-      <AFormItem :label="$t('page.manage.user.remark')" name="remark">
-        <a-textarea v-model:value="model.remark" :placeholder="$t('page.manage.user.form.remark')"
-          :auto-size="{ minRows: 2, maxRows: 5 }" />
-      </AFormItem>
     </AForm>
     <template #footer>
       <ASpace :size="16">

src/views/manage/user/modules/user-resetpwd-dialog.vue

@@ -1,8 +1,8 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { reactive, watch } from 'vue';
 import { useAntdForm, useFormRules } from '@/hooks/common/form';
 import { fetchRestPwsUser } from '@/service/api';
+import { reactive, watch } from 'vue';
 defineOptions({
   name: 'UserResetPwdDialog'
 });
@@ -16,7 +16,7 @@ interface Props {
 const props = defineProps<Props>();
 const model = reactive(createDefaultModel());
 const { formRef, validate, resetFields } = useAntdForm();
-const { defaultRequiredRule } = useFormRules();
+const { formRules } = useFormRules();
 function createDefaultModel(){
   return {
     password: '',
@@ -24,7 +24,7 @@ function createDefaultModel(){
   };
 }
 const rules: Record<'password', App.Global.FormRule> = {
-  password: defaultRequiredRule,
+  password: formRules.pwd,
 };
 
 function closeDrawer() {
@@ -51,7 +51,7 @@ watch(visible, () => {
     <!-- <p style="margin-bottom: 10px;"></p> -->
     <AForm ref="formRef" layout="vertical" :model="model" :rules="rules">
       <AFormItem :label="`请输入${userName}的新密码`" name="password">
-        <AInput v-model:value="model.password" placeholder="请输入新密码" />
+        <AInput v-model:value="model.password" placeholder="请输入新密码" allowClear/>
       </AFormItem>
     </AForm>
     <template #footer>

src/views/manage/user/modules/user-search.vue

@@ -1,11 +1,11 @@
 /* eslint-disable */
 <script setup lang="ts">
-import { computed, ref,onMounted } from 'vue';
-import { $t } from '@/locales';
-import { useAntdForm, useFormRules } from '@/hooks/common/form';
 import { enableStatusOptions } from '@/constants/business';
-import { translateOptions } from '@/utils/common';
+import { useAntdForm, useFormRules } from '@/hooks/common/form';
+import { $t } from '@/locales';
 import { fetchGetdeptTreeList } from '@/service/api';
+import { translateOptions } from '@/utils/common';
+import { computed, onMounted, ref } from 'vue';
 defineOptions({
   name: 'UserSearch'
 });
@@ -64,7 +64,7 @@ async function search() {
       <ARow :gutter="[16, 16]" wrap>
         <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.user.userName')" name="username" class="m-0">
-            <AInput v-model:value.trim="model.username" :placeholder="$t('page.manage.user.form.userName')" @keyup.enter.native="search"/>
+            <AInput v-model:value.trim="model.username" :placeholder="$t('page.manage.user.form.userName')" @keyup.enter.native="search" allowClear/>
           </AFormItem>
         </ACol>
         <ACol :span="24" :md="12" :lg="6">
@@ -92,7 +92,7 @@ async function search() {
         </ACol> -->
         <ACol :span="24" :md="12" :lg="6">
           <AFormItem :label="$t('page.manage.user.userPhone')" name="phone" class="m-0">
-            <AInput v-model:value.trim="model.phone" :placeholder="$t('page.manage.user.form.userPhone')" @keyup.enter.native="search"/>
+            <AInput v-model:value.trim="model.phone" :placeholder="$t('page.manage.user.form.userPhone')" @keyup.enter.native="search" allowClear/>
           </AFormItem>
         </ACol>
         <!-- <ACol :span="24" :md="12" :lg="6">