新增重置密码以及密码复杂度

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

@@ -29,7 +29,6 @@ const model = reactive({
 
 const rules = {
   username: patternRules.username,
-  password: patternRules.pwd
 };
 
 async function handleSubmit() {

src/views/manage/user/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="tsx">
-import { Button, Popconfirm, Tag } from 'ant-design-vue';
+import { Button, Form, message, Popconfirm, Tag } from 'ant-design-vue';
 import type { Key } from 'ant-design-vue/es/_util/type';
 import { useTable, useTableOperate } from '@/hooks/common/table';
 import { $t } from '@/locales';
@@ -7,6 +7,7 @@ import { enableStatusRecord } from '@/constants/business';
 import { SimpleScrollbar } from '~/packages/materials/src';
 import UserOperateDrawer from './modules/user-operate-drawer.vue';
 import UserSearch from './modules/user-search.vue';
+import {  LockOutlined } from '@ant-design/icons-vue';
 
 const wrapperEl = shallowRef<HTMLElement | null>(null);
 const { height: wrapperElHeight } = useElementSize(wrapperEl);
@@ -96,6 +97,14 @@ const { columns, columnChecks, data, loading, getData, mobilePagination, searchP
                 </Button>
               </Popconfirm>
             )}
+            {isShowBtn('system:user:resetPwd') && (
+              <Button
+                 size="small"
+                  onClick={() => fnRecordResetPwd(record)}
+                >
+                {$t('page.login.resetPwd.title')}
+                </Button>
+            )}
           </div>
         )
     }
@@ -160,6 +169,89 @@ const handleReset = () => {
 
   getData();
 };
+
+/**对话框对象信息状态 */
+let modalState: any = reactive({
+  openByResetPwd: false,
+  title: '用户',
+  from: {
+    userName: '',
+    newPassword: '',
+    oldPassword: '',
+  },
+  confirmLoading: false,
+});
+
+/**对话框内表单属性和校验规则 */
+const modalStateFrom = Form.useForm(
+  modalState.from,
+  reactive({
+    newPassword: [
+      {
+        required: true,
+        pattern: /^(?![A-Za-z0-9]+$)(?![a-z0-9\W]+$)(?![A-Za-z\W]+$)(?![A-Z0-9\W]+$)[a-zA-Z0-9\W]{6,}$/,
+        message: $t('form.pwd.invalid'),
+      },
+    ],
+    oldPassword: [
+      {
+        required: true,
+        pattern: /^(?![A-Za-z0-9]+$)(?![a-z0-9\W]+$)(?![A-Za-z\W]+$)(?![A-Z0-9\W]+$)[a-zA-Z0-9\W]{6,}$/,
+        message: $t('form.pwd.invalid'),
+      },
+    ],
+  })
+);
+
+function fnModalOkResetPwd(){
+  modalStateFrom
+    .validate(['password'])
+    .then(() => {
+      modalState.confirmLoading = true;
+      const key = 'user';
+      const from = toRaw(modalState.from);
+      message.loading({ content: $t('common.loading'), key });
+      doUpdatePwd(from)
+        .then(res => {
+          if (!res.error) {
+          message.success({
+            content: $t('common.msgSuccess', {msg: modalState.title}),
+            key,
+            duration: 2,
+          });
+        }
+        getData();
+        })
+        .finally(() => {
+          modalState.confirmLoading = false;
+        });
+    })
+    .catch(e => {
+      message.error($t('common.errorFields', { num: e.errorFields.length }), 3);
+    });
+}
+
+/**
+ * 对话框弹出关闭执行函数
+ * 进行表达规则校验
+ */
+ function fnModalCancel() {
+  modalState.openByResetPwd = false;
+  modalStateFrom.resetFields();
+}
+
+/**
+ * 对话框弹出显示为 用户重置密码
+ * @param row 用户记录对象
+ */
+ function fnRecordResetPwd(row: Record<string, string>) {
+  modalStateFrom.resetFields();
+  modalState.from.userName = row.userName;
+  modalState.title = $t('page.login.resetPwd.title');
+  modalState.openByResetPwd = true;
+}
+
+
 </script>
 
 <template>
@@ -213,6 +305,62 @@ const handleReset = () => {
           :row-data="editingData"
           @submitted="getData"
         />
+
+
+             <!-- 重置密码修改框 -->
+    <a-modal
+      :keyboard="false"
+      :mask-closable="false"
+      :open="modalState.openByResetPwd"
+      :title="modalState.title"
+      :confirm-loading="modalState.confirmLoading"
+      @ok="fnModalOkResetPwd"
+      @cancel="fnModalCancel"
+    >
+      <a-form name="modalStateFromByResetPwd" layout="horizontal">
+        <a-form-item
+          :label="$t('page.manage.user.userName')"
+          name="userName"
+          v-bind="modalStateFrom.validateInfos.userName"
+        >
+          <a-input :value="modalState.from.userName" disabled :maxlength="30">
+            <template #prefix>
+              <UserOutlined />
+            </template>
+          </a-input>
+        </a-form-item>
+        <a-form-item
+          :label="$t('page.login.register.oldPassword')"
+          name="password"
+          v-bind="modalStateFrom.validateInfos.oldPassword"
+        >
+          <a-input-password
+            v-model:value="modalState.from.oldPassword"
+            :maxlength="26"
+          >
+            <template #prefix>
+              <LockOutlined />
+            </template>
+          </a-input-password>
+        </a-form-item>
+        <a-form-item
+          :label="$t('page.login.register.newPassword')"
+          name="password"
+          v-bind="modalStateFrom.validateInfos.newPassword"
+        >
+          <a-input-password
+            v-model:value="modalState.from.newPassword"
+            :maxlength="26"
+          >
+            <template #prefix>
+              <LockOutlined />
+            </template>
+          </a-input-password>
+        </a-form-item>
+
+      </a-form>
+    </a-modal>
+
       </ACard>
     </div>
   </SimpleScrollbar>

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

@@ -74,7 +74,7 @@ const rules = {
   deptId: defaultRequiredRule,
   email: formRules.email,
   phonenumber: formRules.phone,
-  password: formRules.pwd,
+  password: formRules.userPwd,
   postIds: defaultRequiredRule,
   roleIds: defaultRequiredRule
 };